Added dynamic engine selection

Frontend/src/components/xml/XmlOutputFieldToolbarComponent.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref } from 'vue';
+import { onMounted, ref } from 'vue';
 
 
 const props = defineProps(
@@ -10,7 +10,11 @@ const props = defineProps(
     }
 )
 
-const engine = ref('')
+const engine = ref('');
+
+const isSaxonHidden = ref(false);
+const isXalanHidden = ref(false);
+const isLibXMLHidden = ref(false);
 
 const emit = defineEmits(['update:result'])
 
@@ -21,6 +25,14 @@ function process() {
     })
 }
 
+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;
@@ -36,14 +48,6 @@ function prepareRequestBody():string {
     return requestBody;
 }
 
-function prepareRequest():Request {
-    var request = new Request(prepareURL(), {
-        body: prepareRequestBody(),
-        method: "POST"
-    });
-    return request
-}
-
 async function fetchRequest(request: Request):Promise<JSON> {
     var responseBody = await fetch(request)
     .then(response => response.json())
@@ -51,10 +55,32 @@ async function fetchRequest(request: Request):Promise<JSON> {
     return responseBody;
 }
 
-function sendProcessedData(data: any) {
+function sendProcessedData(data: JSON) {
     emit("update:result", data);
 }
 
+onMounted(() => {
+    showOnlyAvailableEngines();
+})
+
+function showOnlyAvailableEngines() {
+    if (props.tool == "xsd") {
+        isSaxonHidden.value = true;
+        isXalanHidden.value = false;
+        isLibXMLHidden.value = false;
+    }
+    else if (props.tool == "xquery") {
+        isSaxonHidden.value = false;
+        isXalanHidden.value = true;
+        isLibXMLHidden.value = true;
+    }
+    else {
+        isSaxonHidden.value = false;
+        isXalanHidden.value = false;
+        isLibXMLHidden.value = false;
+    }
+}
+
 </script>
 
 <template>
@@ -62,9 +88,9 @@ function sendProcessedData(data: any) {
         <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 value="saxon">Saxon</option>
+                <option value="saxon" :class="(isSaxonHidden) ? 'hidden' : ''">Saxon</option>
-                <option value="xalan">Xalan</option>
+                <option value="xalan" :class="(isXalanHidden) ? 'hidden' : ''">Xalan</option>
-                <option value="libxml">libXML</option>
+                <option value="libxml" :class="(isLibXMLHidden) ? 'hidden' : ''">libXML</option>
             </select>
             <button class="tool-button">Clear</button>    
             <button class="tool-button" @click="process">Process</button>

Frontend/src/views/XSLTView.vue

@@ -13,6 +13,6 @@ const query = ref('');
     <div id="layout" class="flex flex-col lg:flex-row w-full h-full gap-4">
         <xmlInputFieldComponent prettyName="XSLT" @update:xml="(data) => {xml = data}" @update:transform="(data) => {query = data}"></xmlInputFieldComponent>    
 
-        <xmlOutputFieldComponent tool="xslt" :xml="xml" :query="query"></xmlOutputFieldComponent>
+        <xmlOutputFieldComponent tool="xpath" :xml="xml" :query="query"></xmlOutputFieldComponent>
     </div>
 </template>