From fd5996c57204b7cd635fda1bd5b916c251082925 Mon Sep 17 00:00:00 2001
From: Adam Bem <adam.bem@zoho.eu>
Date: Wed, 29 Nov 2023 14:48:07 +0100
Subject: [PATCH] Added new endpoint handling

---
 Frontend/src/components/common/TabData.ts     |  5 ++
 .../xml/XmlOutputFieldComponent.vue           | 61 +++++++++++++++++--
 .../xml/XmlTabbedInputComponent.vue           | 17 +++---
 Frontend/src/views/XSLTView.vue               | 15 ++++-
 4 files changed, 79 insertions(+), 19 deletions(-)
 create mode 100644 Frontend/src/components/common/TabData.ts

diff --git a/Frontend/src/components/common/TabData.ts b/Frontend/src/components/common/TabData.ts
new file mode 100644
index 0000000..0e965b3
--- /dev/null
+++ b/Frontend/src/components/common/TabData.ts
@@ -0,0 +1,5 @@
+export interface TabData {
+    id: number;
+    name: string;
+    data: string;
+}
\ No newline at end of file
diff --git a/Frontend/src/components/xml/XmlOutputFieldComponent.vue b/Frontend/src/components/xml/XmlOutputFieldComponent.vue
index 116cd87..c7c551c 100644
--- a/Frontend/src/components/xml/XmlOutputFieldComponent.vue
+++ b/Frontend/src/components/xml/XmlOutputFieldComponent.vue
@@ -1,12 +1,15 @@
 <script setup lang="ts">
 import { onMounted, ref } from 'vue';
+import { type TabData } from '../common/TabData'
 import CodeEditor from '../CodeEditorComponent.vue';
+import { xml } from '@codemirror/lang-xml';
 
 
 const props = defineProps(
     {
         tool: {type: String, required: true},
-        xml: {type: String},
+        xml: {type: String, required: false},
+        multiXml: {type: Array<TabData>, required: false},
         query: {type: String}
     }
 )
@@ -90,27 +93,73 @@ function process() {
 
 function prepareRequest():Request {
     var request = new Request(prepareURL(), {
-        body: prepareRequestBody(),
+        body: selectRequestBodyType(),
         method: "POST"
     });
     return request
+    
 }
 
 function prepareURL(): string {
-   const engineEndpoint = engine.value == "libxml" ? "libxml" : "java";
-   return document.location.protocol + "//" + document.location.hostname + "/" + engineEndpoint + "/" + props.tool;
+    const engineEndpoint = engine.value == "libxml" ? "libxml" : "java";
+   
+    var tool = props.tool;
+    if (props.multiXml && props.multiXml.length > 1)
+        tool = "multiple/xslt";
+
+    return document.location.protocol + "//" + document.location.hostname + "/" + engineEndpoint + "/" + tool;
 }
 
-function prepareRequestBody():string {
+function selectRequestBodyType() : string {
+    if (props.multiXml && props.multiXml.length > 1)
+        return prepareRequestBodyMultiXml();
+    else if (props.multiXml)
+        return prepareRequestBodySingleXml(props.multiXml.at(0)!.data);
+    else
+        return prepareRequestBodySingleXml(props.xml!);
+}
+
+function prepareRequestBodySingleXml(data: string):string {
     var requestBody = JSON.stringify({
-        "data": props.xml,
+        "data": data,
         "processorData": props.query,
         "processor": engine.value,
         "version": version.value
     });
+    console.log(requestBody);
     return requestBody;
 }
 
+function prepareRequestBodyMultiXml():string {
+    var xmlFilesArray = convertDataArray(props.multiXml!);
+
+    var requestBody = JSON.stringify({
+        "data": xmlFilesArray,
+        "processorData": props.query,
+        "processor": engine.value,
+        "version": version.value
+    });
+    console.log(requestBody);
+    return requestBody;
+}
+
+function convertDataArray(data: Array<TabData>) {
+    let result = new Array<Object>;
+    data.forEach(element => {
+        let fileName = element.name;
+        if (!fileName.endsWith(".xml")) {
+            fileName += ".xml";
+        }
+
+        result.push({
+            fileName: fileName,
+            fileData: element.data,
+        });
+    });
+
+    return result;
+}
+
 async function fetchRequest(request: Request):Promise<JSON> {
     var responseBody = await fetch(request)
     .then(response => response.json())
diff --git a/Frontend/src/components/xml/XmlTabbedInputComponent.vue b/Frontend/src/components/xml/XmlTabbedInputComponent.vue
index f01ee90..daabb14 100644
--- a/Frontend/src/components/xml/XmlTabbedInputComponent.vue
+++ b/Frontend/src/components/xml/XmlTabbedInputComponent.vue
@@ -2,12 +2,12 @@
 import TabComponent from './TabComponent.vue'
 import InsertTemplateComponent from '@components/common/InsertTemplateComponent.vue'
 import XMLButtonFormatterComponent from '@components/formatter/XMLButtonFormatterComponent.vue'
+import { type TabData } from '../common/TabData'
 import { ref } from 'vue'
 import CodeEditor from '../CodeEditorComponent.vue'
 
 const newTabId = ref(0);
 const activeTabId = ref(0);
-const prevActiveTabId = ref(-1);
 
 const tabs = ref(new Array<TabData>);
 tabs.value.push({
@@ -22,28 +22,26 @@ const inputFile = ref()
 const props = defineProps(
     {
         stylizedName: {type: String, required: true},
-        data: {type: String},
+        data: {type: Array<TabData>},
     }
 )
 const emit = defineEmits(['update'])
 
-interface TabData {
-    id: number;
-    name: string;
-    data: string;
-}
+
 
 function sendValue() {
-    emit('update', data.value);
+    emit('update', tabs.value);
 }
 
 function sendNewValue(newValue : string) {
     data.value = newValue;
-    emit('update', data.value);
+    tabs.value.at(findIndexWithID(activeTabId.value))!.data = newValue;
+    emit('update', tabs.value);
 }
 
 function updateData(newData: string) {
     data.value = newData;
+    tabs.value.at(findIndexWithID(activeTabId.value))!.data = newData;
     inputFile.value.value = '';
     sendValue();
 }
@@ -81,7 +79,6 @@ function changeActiveTab(id : number) {
     let newIndex = findIndexWithID(id);
     
     tabs.value.at(index)!.data = data.value;
-    prevActiveTabId.value = activeTabId.value;
     activeTabId.value = id;
     data.value = tabs.value.at(newIndex)!.data;
 
diff --git a/Frontend/src/views/XSLTView.vue b/Frontend/src/views/XSLTView.vue
index dad8c43..9cb5784 100644
--- a/Frontend/src/views/XSLTView.vue
+++ b/Frontend/src/views/XSLTView.vue
@@ -3,26 +3,35 @@ import xmlInputFieldComponent from '@/components/xml/XmlInputFieldComponent.vue'
 import xmlTabbedInputComponent from '@/components/xml/XmlTabbedInputComponent.vue';
 import xmlOutputFieldComponent from '@/components/xml/XmlOutputFieldComponent.vue';
 import TooltipComponent from '@/components/xml/tooltips/TooltipComponent.vue';
+
+import { type TabData } from '@/components/common/TabData';
 import { ref } from 'vue';
 
 
-const xml = ref('');
+const xml = ref(new Array<TabData>);
 const query = ref('');
 const version = ref('');
 
 function updateVersion(newVersion: string) {
     version.value = newVersion;
 }
+
+function updateXML(data: Array<TabData>) {
+    xml.value = data;
+    console.log("Update:" + data);
+    console.log(data);
+}
+
 </script>
 
 <template>
     <div id="layout" class="flex flex-row w-full h-full">
         <div class="flex flex-col 2xl:flex-row w-full xl:w-7/12 grow overflow-hide pr-2">
             <div class="flex flex-col w-full 2xl:w-1/2 h-2/3 2xl:h-full flex-none items-center">
-                <xmlTabbedInputComponent stylized-name="XML" :data="xml" @update="(data) => {xml = data}"></xmlTabbedInputComponent>
+                <xmlTabbedInputComponent stylized-name="XML" :data="xml" @update="updateXML"></xmlTabbedInputComponent>
                 <xmlInputFieldComponent stylized-name="XSLT" :data="query" @update="(data) => {query = data}"></xmlInputFieldComponent>
             </div>
-            <xmlOutputFieldComponent tool="xslt" :xml="xml" :query="query" @update="(version) => updateVersion(version)"></xmlOutputFieldComponent>
+            <xmlOutputFieldComponent tool="xslt" :multi-xml="xml" :query="query" @update="(version) => updateVersion(version)"></xmlOutputFieldComponent>
         </div>
         <TooltipComponent tool-type="xslt" :version="version"></TooltipComponent>
     </div>