Added green shadow wan success and other things (#268)
Reviewed-on: #268 Reviewed-by: Mikolaj Widla <widlam@noreply.example.com> Co-authored-by: Adam Bem <adam.bem@zoho.eu> Co-committed-by: Adam Bem <adam.bem@zoho.eu>
This commit is contained in:
@@ -1,63 +1,8 @@
|
||||
<script setup lang="ts">
|
||||
import InsertTemplateComponent from '@components/common/InsertTemplateComponent.vue';
|
||||
import CodeEditorComponent from '@/components/CodeEditorComponent.vue';
|
||||
import { ref } from 'vue';
|
||||
import HtmlButtonFormatterComponent from '@/components/formatter/HtmlButtonFormatterComponent.vue';
|
||||
|
||||
|
||||
const html = ref('');
|
||||
const inputFile = ref()
|
||||
|
||||
const errorOccurred = ref(false);
|
||||
|
||||
function clear() {
|
||||
html.value = '';
|
||||
errorOccurred.value = false
|
||||
inputFile.value.value = ''
|
||||
}
|
||||
|
||||
function setTextFieldValue(data: string) {
|
||||
html.value = data.toString()
|
||||
}
|
||||
|
||||
function setErrorOccurred(occurred: boolean) {
|
||||
errorOccurred.value = occurred
|
||||
}
|
||||
|
||||
function setExample(data: string) {
|
||||
inputFile.value.value = ''
|
||||
setTextFieldValue(data)
|
||||
}
|
||||
|
||||
function readFile(file : any) {
|
||||
|
||||
const reader = new FileReader()
|
||||
reader.onloadend = () => {
|
||||
var result = reader.result?.toString()
|
||||
if (typeof result == "string")
|
||||
setTextFieldValue(result);
|
||||
|
||||
}
|
||||
reader.readAsText(file.target.files[0])
|
||||
}
|
||||
import FormatterComponent from '@/components/formatter/FormatterComponent.vue';
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div id="layout" class="flex flex-col w-full h-full gap-4">
|
||||
<div id="toolbar" class="flex flex-col gap-4 items-center lg:flex-row place-content-between">
|
||||
<span class="dark:text-slate-100">HTML Formatter</span>
|
||||
<div class="flex flex-wrap gap-2 justify-center">
|
||||
<div class="flex items-stretch w-64">
|
||||
<input id="fileLoader" ref="inputFile" class="file-selector" type="file" accept=".xml,.html,.htm,text/xml,text/plain,text/html" @change="readFile" />
|
||||
</div>
|
||||
<InsertTemplateComponent stylized-name="HTML" @update:defaultData="setExample"></InsertTemplateComponent>
|
||||
<button class="tool-button" @click="clear()">Clear</button>
|
||||
<HtmlButtonFormatterComponent @update:result="setTextFieldValue" @update:error="setErrorOccurred" :code="html" format-type="Minimize" />
|
||||
<HtmlButtonFormatterComponent @update:result="setTextFieldValue" @update:error="setErrorOccurred" :code="html" format-type="Prettify" />
|
||||
<HtmlButtonFormatterComponent @update:result="setTextFieldValue" @update:error="setErrorOccurred" :code="html" format-type="HTML -> XML" />
|
||||
</div>
|
||||
</div>
|
||||
<CodeEditorComponent :class="{'text-field-error' : errorOccurred}" @update:updated-code="setTextFieldValue" :code="html" :config="{disabled:false,language:'html'}" />
|
||||
</div>
|
||||
<FormatterComponent formatter-language="HTML"></FormatterComponent>
|
||||
</template>
|
||||
@@ -1,67 +1,8 @@
|
||||
<script setup lang="ts">
|
||||
import CodeEditorComponent from '@/components/CodeEditorComponent.vue';
|
||||
import JsonButtonFormatterComponent from '@/components/formatter/JsonButtonFormatterComponent.vue';
|
||||
import InsertTemplateComponent from '@components/common/InsertTemplateComponent.vue';
|
||||
import { ref } from 'vue';
|
||||
|
||||
|
||||
const json = ref('');
|
||||
const inputFile = ref()
|
||||
|
||||
const errorOccurred = ref(false);
|
||||
|
||||
|
||||
function setTextFieldValue(data: string) {
|
||||
json.value = data
|
||||
}
|
||||
|
||||
function setExample(data: string) {
|
||||
inputFile.value.value = ''
|
||||
setTextFieldValue(data)
|
||||
}
|
||||
|
||||
function setErrorOccurred(occurred: boolean) {
|
||||
errorOccurred.value = occurred
|
||||
}
|
||||
|
||||
function format(formattedXml: any) {
|
||||
json.value = formattedXml.data;
|
||||
}
|
||||
|
||||
function clear() {
|
||||
json.value = '';
|
||||
errorOccurred.value = false
|
||||
inputFile.value.value = ''
|
||||
}
|
||||
|
||||
function readFile(file : any) {
|
||||
|
||||
const reader = new FileReader()
|
||||
reader.onloadend = () => {
|
||||
var result = reader.result?.toString()
|
||||
if (typeof result == "string")
|
||||
setTextFieldValue(result);
|
||||
|
||||
}
|
||||
reader.readAsText(file.target.files[0])
|
||||
}
|
||||
import FormatterComponent from '@/components/formatter/FormatterComponent.vue';
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div id="layout" class="flex flex-col w-full h-full gap-4">
|
||||
<div id="toolbar" class= "flex flex-col gap-4 items-center lg:flex-row place-content-between">
|
||||
<span class="dark:text-slate-100">JSON Formatter</span>
|
||||
<div class="flex flex-wrap gap-2 justify-center">
|
||||
<div class="flex items-stretch w-64">
|
||||
<input id="fileLoader" ref="inputFile" class="file-selector" type="file" accept=".json,text/xml,text/plain,text/json,application/json" @change="readFile" />
|
||||
</div>
|
||||
<InsertTemplateComponent stylized-name="JSON" @update:defaultData="(data: string) => setExample(data)"></InsertTemplateComponent>
|
||||
<button class="tool-button" @click="clear()">Clear</button>
|
||||
<JsonButtonFormatterComponent isMinimizer :json="json" @update:result="(data: any) => format(data)" @update:error="setErrorOccurred"></JsonButtonFormatterComponent>
|
||||
<JsonButtonFormatterComponent :json="json" @update:result="(data: any) => format(data)" @update:error="setErrorOccurred"></JsonButtonFormatterComponent>
|
||||
</div>
|
||||
</div>
|
||||
<CodeEditorComponent :class="{'text-field-error' : errorOccurred}" @update:updated-code="setTextFieldValue" :code="json" :config="{disabled:false,language:'json'}" />
|
||||
</div>
|
||||
<FormatterComponent formatter-language="JSON"></FormatterComponent>
|
||||
</template>
|
||||
@@ -1,66 +1,8 @@
|
||||
<script setup lang="ts">
|
||||
import XMLButtonFormatterComponent from '@/components/formatter/XMLButtonFormatterComponent.vue';
|
||||
import InsertTemplateComponent from '@components/common/InsertTemplateComponent.vue';
|
||||
import CodeEditorComponent from '@/components/CodeEditorComponent.vue';
|
||||
import { ref } from 'vue';
|
||||
|
||||
|
||||
const xml = ref('');
|
||||
const inputFile = ref()
|
||||
|
||||
const errorOccurred = ref(false);
|
||||
|
||||
function setTextFieldValue(data: string) {
|
||||
xml.value = data
|
||||
}
|
||||
|
||||
function format(formattedXml: any) {
|
||||
xml.value = formattedXml.result;
|
||||
}
|
||||
|
||||
function setErrorOccurred(occurred: boolean) {
|
||||
errorOccurred.value = occurred
|
||||
}
|
||||
|
||||
function setExample(data: string) {
|
||||
inputFile.value.value = ''
|
||||
setTextFieldValue(data)
|
||||
}
|
||||
|
||||
function clear() {
|
||||
xml.value = '';
|
||||
errorOccurred.value = false
|
||||
inputFile.value.value = ''
|
||||
}
|
||||
|
||||
function readFile(file : any) {
|
||||
|
||||
const reader = new FileReader()
|
||||
reader.onloadend = () => {
|
||||
var result = reader.result?.toString()
|
||||
if (typeof result == "string")
|
||||
setTextFieldValue(result);
|
||||
|
||||
}
|
||||
reader.readAsText(file.target.files[0])
|
||||
}
|
||||
import FormatterComponent from '@/components/formatter/FormatterComponent.vue';
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div id="layout" class="flex flex-col w-full h-full gap-4">
|
||||
<div id="toolbar" class= "flex flex-col gap-4 items-center lg:flex-row place-content-between">
|
||||
<span class="dark:text-slate-100">XML Formatter</span>
|
||||
<div class="flex flex-wrap gap-2 justify-center">
|
||||
<div class="flex items-stretch w-64">
|
||||
<input id="fileLoader" ref="inputFile" class="file-selector" type="file" accept=".xml,.xql,.xquery,.xslt,text/xml,text/plain" @change="readFile" />
|
||||
</div>
|
||||
<InsertTemplateComponent stylized-name="XML" @update:defaultData="(data: string) => setExample(data)"></InsertTemplateComponent>
|
||||
<button class="tool-button" @click="clear()">Clear</button>
|
||||
<XMLButtonFormatterComponent @update:error="setErrorOccurred" is-minimizer :xml="xml" @update:result="(data: any) => format(data)"></XMLButtonFormatterComponent>
|
||||
<XMLButtonFormatterComponent @update:error="setErrorOccurred" :xml="xml" @update:result="(data: any) => format(data)"></XMLButtonFormatterComponent>
|
||||
</div>
|
||||
</div>
|
||||
<CodeEditorComponent :class="{'text-field-error' : errorOccurred}" @update:updated-code="setTextFieldValue" :code="xml" :config="{disabled:false,language:'xml'}" />
|
||||
</div>
|
||||
<FormatterComponent formatter-language="XML"></FormatterComponent>
|
||||
</template>
|
||||
Reference in New Issue
Block a user