Cleaning
This commit is contained in:
@@ -1,18 +0,0 @@
|
||||
<script setup lang="ts">
|
||||
import XMLButtonFormatterComponent from '@/components/formatter/XMLButtonFormatterComponent.vue';
|
||||
import InsertDefaultComponent from '../xml/InsertDefaultComponent.vue';
|
||||
|
||||
defineProps({
|
||||
inputValue: {type: String, required: true}
|
||||
})
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="flex flex-col w-full h-full">
|
||||
|
||||
<textarea name="data" id="data" :value="$props.inputValue" class="text-field"></textarea>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
@@ -1,6 +1,6 @@
|
||||
<script setup lang="ts">
|
||||
|
||||
import InsertDefaultComponent from "./InsertDefaultComponent.vue"
|
||||
import InsertTemplateComponent from '@components/common/InsertTemplateComponent.vue'
|
||||
|
||||
const props = defineProps(
|
||||
{
|
||||
@@ -21,7 +21,7 @@ function setDefault(data: string) {
|
||||
<div class="flex place-content-between w-full pr-2 items-center m-2">
|
||||
<span class="dark:text-white">{{ prettyName }}</span>
|
||||
<div class="flex space-x-2">
|
||||
<InsertDefaultComponent :pretty-name="props.prettyName" @update:default-data="(data) => setDefault(data)"></InsertDefaultComponent>
|
||||
<InsertTemplateComponent :pretty-name="props.prettyName" @update:default-data="(data: string) => setDefault(data)"></InsertTemplateComponent>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
@@ -1,6 +1,5 @@
|
||||
<script setup lang="ts">
|
||||
import xmlOutputFieldToolbarComponent from '@/components/xml/XmlOutputFieldToolbarComponent.vue';
|
||||
import { ref } from 'vue';
|
||||
import { onMounted, ref } from 'vue';
|
||||
|
||||
|
||||
const props = defineProps(
|
||||
@@ -13,7 +12,80 @@ const props = defineProps(
|
||||
|
||||
const result = ref('');
|
||||
|
||||
function parseResult(data: any) {
|
||||
var engines = ["saxon", "xalan", "libxml"];
|
||||
var versions = ["1.0", "2.0", "3.0", "3.1"];
|
||||
|
||||
const engine = ref('');
|
||||
const version = ref('');
|
||||
|
||||
|
||||
onMounted(() => {
|
||||
selectAvailableEngines();
|
||||
selectAvailableVersions();
|
||||
selectDefaults();
|
||||
})
|
||||
|
||||
function selectAvailableEngines() {
|
||||
if (props.tool == "xsd") {
|
||||
engines = ["xalan", "libxml"]
|
||||
}
|
||||
else if (props.tool == "xquery") {
|
||||
engines = ["saxon"]
|
||||
}
|
||||
}
|
||||
|
||||
function selectAvailableVersions() {
|
||||
if (props.tool == "xquery")
|
||||
versions = ["3.1"];
|
||||
else if (props.tool == "xslt")
|
||||
versions = ["3.0"];
|
||||
else if (props.tool == "xsd")
|
||||
versions = ["N/A"];
|
||||
}
|
||||
|
||||
function selectDefaults() {
|
||||
version.value = versions[versions.length - 1];
|
||||
engine.value = engines[0];
|
||||
}
|
||||
|
||||
function process() {
|
||||
var request:Request = prepareRequest();
|
||||
fetchRequest(request).then((data) => {
|
||||
updateOutputField(data);
|
||||
})
|
||||
}
|
||||
|
||||
function prepareRequest():Request {
|
||||
var request = new Request(prepareURL(), {
|
||||
body: prepareRequestBody(),
|
||||
method: "POST"
|
||||
});
|
||||
return request
|
||||
}
|
||||
|
||||
function prepareURL(): string {
|
||||
const engineEndpoint = engine.value == "libxml" ? "libxml" : "java";
|
||||
return document.location.protocol + "//" + document.location.hostname + "/" + engineEndpoint + "/" + props.tool;
|
||||
}
|
||||
|
||||
function prepareRequestBody():string {
|
||||
var requestBody = JSON.stringify({
|
||||
"data": props.xml,
|
||||
"process": props.query,
|
||||
"processor": engine.value,
|
||||
"version": version.value
|
||||
});
|
||||
return requestBody;
|
||||
}
|
||||
|
||||
async function fetchRequest(request: Request):Promise<JSON> {
|
||||
var responseBody = await fetch(request)
|
||||
.then(response => response.json())
|
||||
.then((body) => body);
|
||||
return responseBody;
|
||||
}
|
||||
|
||||
function updateOutputField(data: any) {
|
||||
result.value = data.result;
|
||||
}
|
||||
|
||||
@@ -21,7 +93,19 @@ function parseResult(data: any) {
|
||||
|
||||
<template>
|
||||
<div class="flex flex-col w-full lg:w-1/2 h-full items-center">
|
||||
<xmlOutputFieldToolbarComponent :xml="$props.xml" :query="$props.query" :tool="$props.tool" @update:result="(data) => parseResult(data)"></xmlOutputFieldToolbarComponent>
|
||||
<div class="flex place-content-between w-full items-center m-2">
|
||||
<span class="dark:text-white">Result:</span>
|
||||
<div class="flex space-x-2">
|
||||
<select v-model="engine" name="engine" class="px-3 rounded-full border border-slate-400 bg-white dark:text-slate-100 dark:bg-gray-600">
|
||||
<option v-for="engine in engines" :value="engine">{{ engine }}</option>
|
||||
</select>
|
||||
<select v-model="version" name="version" class="px-3 rounded-full border border-slate-400 bg-white dark:text-slate-100 dark:bg-gray-600">
|
||||
<option v-for="version in versions" :value="version">{{ version }}</option>
|
||||
</select>
|
||||
<button class="tool-button">Clear</button>
|
||||
<button class="tool-button" @click="process">Process</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-field overflow-scroll">
|
||||
<pre class="break-words"><code>{{ result }}</code></pre>
|
||||
</div>
|
||||
|
||||
@@ -1,112 +0,0 @@
|
||||
<script setup lang="ts">
|
||||
import { onMounted, ref } from 'vue';
|
||||
|
||||
var engines = ["saxon", "xalan", "libxml"];
|
||||
var versions = ["1.0", "2.0", "3.0", "3.1"];
|
||||
|
||||
const props = defineProps(
|
||||
{
|
||||
tool: {type: String, required: true},
|
||||
xml: {type: String},
|
||||
query: {type: String},
|
||||
}
|
||||
)
|
||||
|
||||
const emit = defineEmits(['update:result'])
|
||||
|
||||
const engine = ref('');
|
||||
const version = ref('');
|
||||
|
||||
const isSaxonHidden = ref(false);
|
||||
const isXalanHidden = ref(false);
|
||||
const isLibXMLHidden = ref(false);
|
||||
|
||||
|
||||
onMounted(() => {
|
||||
selectAvailableEngines();
|
||||
selectAvailableVersions();
|
||||
selectDefaults();
|
||||
})
|
||||
|
||||
function selectAvailableEngines() {
|
||||
if (props.tool == "xsd") {
|
||||
engines = ["xalan", "libxml"]
|
||||
}
|
||||
else if (props.tool == "xquery") {
|
||||
engines = ["saxon"]
|
||||
}
|
||||
}
|
||||
|
||||
function selectAvailableVersions() {
|
||||
if (props.tool == "xquery")
|
||||
versions = ["3.1"];
|
||||
else if (props.tool == "xsd")
|
||||
versions = ["N/A"];
|
||||
}
|
||||
|
||||
function selectDefaults() {
|
||||
version.value = versions[versions.length - 1];
|
||||
engine.value = engines[0];
|
||||
}
|
||||
|
||||
function process() {
|
||||
var request:Request = prepareRequest();
|
||||
fetchRequest(request).then((data) => {
|
||||
sendProcessedData(data);
|
||||
})
|
||||
}
|
||||
|
||||
function prepareRequest():Request {
|
||||
var request = new Request(prepareURL(), {
|
||||
body: prepareRequestBody(),
|
||||
method: "POST"
|
||||
});
|
||||
return request
|
||||
}
|
||||
|
||||
function prepareURL(): string {
|
||||
const engineEndpoint = engine.value == "libxml" ? "libxml" : "java";
|
||||
return document.location.protocol + "//" + document.location.hostname + "/" + engineEndpoint + "/" + props.tool;
|
||||
}
|
||||
|
||||
function prepareRequestBody():string {
|
||||
var requestBody = JSON.stringify({
|
||||
"data": props.xml,
|
||||
"process": props.query,
|
||||
"processor": engine.value,
|
||||
"version": version.value
|
||||
});
|
||||
return requestBody;
|
||||
}
|
||||
|
||||
async function fetchRequest(request: Request):Promise<JSON> {
|
||||
var responseBody = await fetch(request)
|
||||
.then(response => response.json())
|
||||
.then((body) => body);
|
||||
return responseBody;
|
||||
}
|
||||
|
||||
function sendProcessedData(data: JSON) {
|
||||
emit("update:result", data);
|
||||
}
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="flex place-content-between w-full items-center m-2">
|
||||
<span class="dark:text-white">Result:</span>
|
||||
<div class="flex space-x-2">
|
||||
<select v-model="engine" name="engine" class="px-3 rounded-full border border-slate-400 bg-white dark:text-slate-100 dark:bg-gray-600">
|
||||
<option v-for="engine in engines" :value="engine">{{ engine }}</option>
|
||||
</select>
|
||||
<select v-model="version" name="version" class="px-3 rounded-full border border-slate-400 bg-white dark:text-slate-100 dark:bg-gray-600">
|
||||
<option v-for="version in versions" :value="version">{{ version }}</option>
|
||||
</select>
|
||||
<button class="tool-button">Clear</button>
|
||||
<button class="tool-button" @click="process">Process</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
@@ -1,13 +1,12 @@
|
||||
<script setup lang="ts">
|
||||
import InputFormatterComponent from '@/components/formatter/InputFormatterComponent.vue';
|
||||
import XMLButtonFormatterComponent from '@/components/formatter/XMLButtonFormatterComponent.vue';
|
||||
import InsertDefaultComponent from '@components/xml/InsertDefaultComponent.vue';
|
||||
import InsertTemplateComponent from '@components/common/InsertTemplateComponent.vue';
|
||||
import { ref } from 'vue';
|
||||
|
||||
|
||||
const xml = ref('');
|
||||
|
||||
function setTextFieldValue(data: any) {
|
||||
function setTextFieldValue(data: string) {
|
||||
xml.value = data
|
||||
}
|
||||
|
||||
@@ -22,10 +21,10 @@ function format(formattedXml: any) {
|
||||
<div id="toolbar" class= "flex flex-col gap-4 items-center md:flex-row place-content-between">
|
||||
<span class="dark:text-slate-100">XML Formatter</span>
|
||||
<div class="space-x-2">
|
||||
<InsertDefaultComponent pretty-name="XML" @update:defaultData="(data: any) => setTextFieldValue(data)"></InsertDefaultComponent>
|
||||
<InsertTemplateComponent pretty-name="XML" @update:defaultData="(data: string) => setTextFieldValue(data)"></InsertTemplateComponent>
|
||||
<XMLButtonFormatterComponent :xml="xml" @update:result="(data: any) => format(data)"></XMLButtonFormatterComponent>
|
||||
</div>
|
||||
</div>
|
||||
<InputFormatterComponent :inputValue="xml"></InputFormatterComponent>
|
||||
<textarea name="data" id="data" :value="xml" class="text-field"></textarea>
|
||||
</div>
|
||||
</template>
|
||||
Reference in New Issue
Block a user