Compare commits
8 Commits
frontend_c
...
f66a5fcf84
| Author | SHA1 | Date | |
|---|---|---|---|
| f66a5fcf84 | |||
| 3cc014310e | |||
| edab2fa900 | |||
| 5bc89fc514 | |||
| fa620baa9c | |||
| f3f88ad659 | |||
| 79959c5ff9 | |||
| 469b5a584f |
@@ -79,9 +79,11 @@ def xpath(source: str, xpath: str) -> str:
|
||||
else:
|
||||
result_string = ""
|
||||
for e in result:
|
||||
result_string += etree.tostring(e, pretty_print=True).decode() + "\n"
|
||||
return result_string, "node"
|
||||
|
||||
if isinstance(e, etree._Element):
|
||||
result_string += etree.tostring(e, pretty_print=True).decode() + "\n"
|
||||
else:
|
||||
result_string += str(e) + "\n"
|
||||
return result_string, "node"
|
||||
|
||||
|
||||
def xsd(source: str, xsd: str) -> bool:
|
||||
|
||||
@@ -61,6 +61,13 @@ public class Xalan implements XmlEngine{
|
||||
return nodeType == Node.CDATA_SECTION_NODE || nodeType == Node.TEXT_NODE;
|
||||
}
|
||||
|
||||
private boolean isAttributeNode(Node n) {
|
||||
if (n == null)
|
||||
return false;
|
||||
short nodeType = n.getNodeType();
|
||||
return nodeType == Node.CDATA_SECTION_NODE || nodeType == Node.ATTRIBUTE_NODE;
|
||||
}
|
||||
|
||||
@Override
|
||||
public String processXSLT(XMLMultipleFilesData[] data, String transform) throws Exception {
|
||||
throw new UnsupportedOperationException("Xalan does not support multiple files XSLT processing");
|
||||
@@ -101,7 +108,10 @@ public class Xalan implements XmlEngine{
|
||||
for (Node nn = n.getNextSibling(); isTextNode(nn); nn = nn.getNextSibling()) {
|
||||
resultString.append(nn.getNodeValue());
|
||||
}
|
||||
} else {
|
||||
} else if (isAttributeNode(n)) {
|
||||
resultString.append(n.getNodeValue());
|
||||
}
|
||||
else {
|
||||
ByteArrayOutputStream outputStream = new ByteArrayOutputStream();
|
||||
serializer.transform(new DOMSource(n), new StreamResult(new OutputStreamWriter(outputStream)));
|
||||
resultString.append(outputStream);
|
||||
|
||||
11
Frontend/package-lock.json
generated
11
Frontend/package-lock.json
generated
@@ -13,6 +13,7 @@
|
||||
"@codemirror/lang-xml": "^6.0.2",
|
||||
"@codemirror/theme-one-dark": "^6.1.2",
|
||||
"codemirror": "^6.0.1",
|
||||
"material-icons": "^1.13.14",
|
||||
"thememirror": "^2.0.1",
|
||||
"vue": "^3.3.4",
|
||||
"vue-codemirror": "^6.1.1",
|
||||
@@ -3071,6 +3072,11 @@
|
||||
"node": ">=12"
|
||||
}
|
||||
},
|
||||
"node_modules/material-icons": {
|
||||
"version": "1.13.14",
|
||||
"resolved": "https://registry.npmjs.org/material-icons/-/material-icons-1.13.14.tgz",
|
||||
"integrity": "sha512-kZOfc7xCC0rAT8Q3DQixYAeT+tBqZnxkseQtp2bxBxz7q5pMAC+wmit7vJn1g/l7wRU+HEPq23gER4iPjGs5Cg=="
|
||||
},
|
||||
"node_modules/memorystream": {
|
||||
"version": "0.3.1",
|
||||
"resolved": "https://registry.npmjs.org/memorystream/-/memorystream-0.3.1.tgz",
|
||||
@@ -6909,6 +6915,11 @@
|
||||
"@jridgewell/sourcemap-codec": "^1.4.13"
|
||||
}
|
||||
},
|
||||
"material-icons": {
|
||||
"version": "1.13.14",
|
||||
"resolved": "https://registry.npmjs.org/material-icons/-/material-icons-1.13.14.tgz",
|
||||
"integrity": "sha512-kZOfc7xCC0rAT8Q3DQixYAeT+tBqZnxkseQtp2bxBxz7q5pMAC+wmit7vJn1g/l7wRU+HEPq23gER4iPjGs5Cg=="
|
||||
},
|
||||
"memorystream": {
|
||||
"version": "0.3.1",
|
||||
"resolved": "https://registry.npmjs.org/memorystream/-/memorystream-0.3.1.tgz",
|
||||
|
||||
@@ -17,6 +17,7 @@
|
||||
"@codemirror/lang-xml": "^6.0.2",
|
||||
"@codemirror/theme-one-dark": "^6.1.2",
|
||||
"codemirror": "^6.0.1",
|
||||
"material-icons": "^1.13.14",
|
||||
"thememirror": "^2.0.1",
|
||||
"vue": "^3.3.4",
|
||||
"vue-codemirror": "^6.1.1",
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
<script setup lang="ts">
|
||||
import { RouterView } from 'vue-router';
|
||||
import 'material-icons/iconfont/material-icons.css';
|
||||
import SidebarComponent from '@components/sidebar/SidebarComponent.vue';
|
||||
import {onMounted, provide, ref } from 'vue';
|
||||
|
||||
@@ -45,13 +46,12 @@ function getTheme(){
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div id="layout" class="font-sans flex h-screen bg-gradient-to-br from-sky-200 to-indigo-200 dark:from-sky-950 dark:to-indigo-950">
|
||||
<div id="layout" class="font-sans flex h-screen bg-[#f5f7fa] dark:bg-gray-700 dark:from-sky-950 dark:to-indigo-950">
|
||||
<SidebarComponent @theme:changed="setTheme" />
|
||||
<div class="relative p-4 w-full m-4 ml-0 bg-blue-50 dark:bg-gray-700 rounded-2xl overflow-hidden shadow-lg">
|
||||
<div class="relative p-4 w-full m-4 ml-0 bg-[#f5f7fa] dark:bg-gray-700 rounded-2xl overflow-hidden ">
|
||||
<RouterView></RouterView>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
||||
@@ -2,7 +2,8 @@
|
||||
import { onBeforeUpdate, inject } from 'vue'
|
||||
import { Codemirror } from 'vue-codemirror'
|
||||
import { oneDark } from '@codemirror/theme-one-dark'
|
||||
import { espresso } from 'thememirror';
|
||||
import { createTheme} from 'thememirror';
|
||||
import {tags as t} from '@lezer/highlight';
|
||||
import {xml} from '@codemirror/lang-xml'
|
||||
import {json} from '@codemirror/lang-json'
|
||||
import {html} from '@codemirror/lang-html'
|
||||
@@ -18,6 +19,47 @@ const props= defineProps({
|
||||
},
|
||||
})
|
||||
|
||||
const lightTheme = createTheme({
|
||||
variant: 'light',
|
||||
settings: {
|
||||
background: '#FFFFFF',
|
||||
foreground: '#000000',
|
||||
caret: '#000000',
|
||||
selection: '#80C7FF',
|
||||
gutterBackground: '#FFFFFF',
|
||||
gutterForeground: '#00000070',
|
||||
lineHighlight: '#C1E2F840',
|
||||
},
|
||||
styles: [
|
||||
{
|
||||
tag: t.comment,
|
||||
color: '#AAAAAA',
|
||||
},
|
||||
{
|
||||
tag: [t.keyword, t.operator, t.typeName, t.tagName, t.propertyName],
|
||||
color: '#2F6F9F',
|
||||
fontWeight: 'bold',
|
||||
},
|
||||
{
|
||||
tag: [t.attributeName, t.definition(t.propertyName)],
|
||||
color: '#4F9FD0',
|
||||
},
|
||||
{
|
||||
tag: [t.className, t.string, t.special(t.brace)],
|
||||
color: '#CF4F5F',
|
||||
},
|
||||
{
|
||||
tag: t.number,
|
||||
color: '#CF4F5F',
|
||||
fontWeight: 'bold',
|
||||
},
|
||||
{
|
||||
tag: t.variableName,
|
||||
fontWeight: 'bold',
|
||||
},
|
||||
],
|
||||
});
|
||||
|
||||
const emit = defineEmits(
|
||||
[
|
||||
'update:updatedCode'
|
||||
@@ -37,7 +79,7 @@ function selectTheme() {
|
||||
if (isDarkModeSet())
|
||||
return oneDark;
|
||||
else
|
||||
return espresso;
|
||||
return lightTheme;
|
||||
}
|
||||
|
||||
function isDarkModeSet(){
|
||||
@@ -83,4 +125,4 @@ function parseLanguage(name: String){
|
||||
/>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
</template>
|
||||
@@ -1,42 +1,79 @@
|
||||
<script setup lang="ts">
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="dark:text-slate-100">
|
||||
<h1 class="text-3xl mb-4">Welcome to Release11 Tools</h1>
|
||||
<h2 class="text-xl">Our tool set is split to three main categories:</h2>
|
||||
<ul class="list-decimal ml-5">
|
||||
<li><strong>XML</strong> - containing various tools that allow to validate and transform any XML</li>
|
||||
<li><strong>Formatter</strong> - containing tools for formatting text files in various formats</li>
|
||||
<li><strong>REST</strong> - consist of Mock that allows to create mocked REST endpoint</li>
|
||||
<li><strong>Encoder</strong> - consist of encoders for Base64 and URL</li>
|
||||
</ul>
|
||||
<br/>
|
||||
<div class="dark:text-slate-100 bg-[#f5f7fa] flex w-fit flex-col items-center ">
|
||||
|
||||
<h2 class="text-xl mt-2">XML - Tools:</h2>
|
||||
<ul class="list-decimal ml-5">
|
||||
<li><strong>XPath</strong> - This is tool that allows to parse XPath on selected XML</li>
|
||||
<li><strong>XQuery</strong> - Allows to execute XQuery on provided XML file.</li>
|
||||
<li><strong>XSD</strong> - Allows to validate XML against provided XSD schema.</li>
|
||||
<li><strong>XSLT</strong> - Allows to transform XML using XSLT transform.</li>
|
||||
</ul>
|
||||
|
||||
<h2 class="text-xl mt-2">Formatter - Tools:</h2>
|
||||
<p>These are tools that allow to format or minimize files in bespoken formats.</p>
|
||||
|
||||
<h2 class="text-xl mt-2">REST - Tools:</h2>
|
||||
<p>This is tools that allow to created mocked REST Service that can be used to test REST clients.</p>
|
||||
|
||||
<h2 class="text-xl mt-2">Encoder - Tools:</h2>
|
||||
<ul class="list-decimal ml-5">
|
||||
<li><strong>Base64</strong> - This is tool allowing to encode text to base64 and decode base64 to text or image.</li>
|
||||
<li><strong>URL</strong> - This tool allow to encode string in the way that is used by browser when you put it in address bar.</li>
|
||||
</ul>
|
||||
|
||||
<div class="flex my-4 px-4 py-4 w-full rounded-lg shadow-lg flex-col bg-white items-center">
|
||||
<h1 class="text-3xl">Welcome to Release11 Tools</h1>
|
||||
|
||||
</div>
|
||||
<div class="flex my-4 px-4 py-4 w-full rounded-lg shadow-lg flex-col bg-white ">
|
||||
<div class="flex items-center gap-2">
|
||||
<i class="material-icons text-2xl text-[#2A93B0]">construction</i>
|
||||
<h2 class="text-xl">Our tool set is split to three main categories:</h2>
|
||||
</div>
|
||||
<ul class="list-decimal ml-5">
|
||||
<li>
|
||||
<strong>XML</strong> - containing various tools that allow to validate and transform any
|
||||
XML
|
||||
</li>
|
||||
<li>
|
||||
<strong>Formatter</strong> - containing tools for formatting text files in various formats
|
||||
</li>
|
||||
<li><strong>REST</strong> - consist of Mock that allows to create mocked REST endpoint</li>
|
||||
<li><strong>Encoder</strong> - consist of encoders for Base64 and URL</li>
|
||||
</ul>
|
||||
</div>
|
||||
<br />
|
||||
<div class="flex my-4 px-4 py-4 w-full rounded-lg shadow-lg flex-col bg-white ">
|
||||
<div class="flex items-center gap-2">
|
||||
<i class="material-icons text-2xl text-[#2A93B0]">code</i>
|
||||
<h2 class="text-xl ">XML - Tools:</h2>
|
||||
|
||||
</div>
|
||||
|
||||
<ul class="list-decimal ml-5">
|
||||
<li><strong>XPath</strong> - This is tool that allows to parse XPath on selected XML</li>
|
||||
<li><strong>XQuery</strong> - Allows to execute XQuery on provided XML file.</li>
|
||||
<li><strong>XSD</strong> - Allows to validate XML against provided XSD schema.</li>
|
||||
<li><strong>XSLT</strong> - Allows to transform XML using XSLT transform.</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="flex my-4 px-4 py-4 w-full rounded-lg shadow-lg flex-col bg-white ">
|
||||
<div class="flex items-center gap-2">
|
||||
<i class="material-icons text-2xl text-[#2A93B0]">format_align_left</i>
|
||||
<h2 class="text-xl ">Formatter - Tools:</h2>
|
||||
</div>
|
||||
<p>These are tools that allow to format or minimize files in bespoken formats.</p>
|
||||
</div>
|
||||
<div class="flex my-4 px-4 py-4 w-full rounded-lg shadow-lg flex-col bg-white ">
|
||||
<div class="flex items-center gap-2">
|
||||
<i class="material-icons text-2xl text-[#2A93B0]">lan</i>
|
||||
<h2 class="text-xl ">REST - Tools:</h2>
|
||||
</div>
|
||||
<p>
|
||||
This is tools that allow to created mocked REST Service that can be used to test REST
|
||||
clients.
|
||||
</p>
|
||||
</div>
|
||||
<div class="flex my-4 px-4 py-4 w-full rounded-lg shadow-lg flex-col bg-white ">
|
||||
<div class="flex items-center gap-2">
|
||||
<i class="material-icons text-2xl text-[#2A93B0] ">cached</i>
|
||||
<h2 class="text-xl ">Encoder - Tools:</h2>
|
||||
</div>
|
||||
<ul class="list-decimal ml-5">
|
||||
<li>
|
||||
<strong>Base64</strong> - This is tool allowing to encode text to base64 and decode base64
|
||||
to text or image.
|
||||
</li>
|
||||
<li>
|
||||
<strong>URL</strong> - This tool allow to encode string in the way that is used by browser
|
||||
when you put it in address bar.
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
||||
|
||||
@@ -15,11 +15,16 @@ function toggleTooltips() {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div :class="areTooltipsHidden ? 'w-fit' : 'w-5/12'" class="hidden xl:flex items-stretch p-2 flex-row rounded-xl shadow-lg bg-gradient-to-r from-blue-400 to-blue-300 dark:from-sky-600 dark:to-sky-800 ">
|
||||
<button :class="{'mr-2' : !areTooltipsHidden }" class="text-xl w-6 dark:text-slate-100" @click="toggleTooltips()">
|
||||
<div
|
||||
:class="[
|
||||
areTooltipsHidden ? 'w-fit' : 'w-5/12',
|
||||
'hidden xl:flex items-stretch p-2 flex-row rounded-lg shadow-lg',
|
||||
'bg-[#bbe3ef] dark:bg-[#2A93B0]'
|
||||
]"
|
||||
> <button :class="{'mr-2' : !areTooltipsHidden }" class="text-xl w-6 bg-[#bbe3ef] dark:bg-[#2A93B0]" @click="toggleTooltips()">
|
||||
T<br/>o<br/>o<br/>l<br/>t<br/>i<br/>p<br/>s
|
||||
</button>
|
||||
<div id="content" :class="{'hidden' : areTooltipsHidden}" class="w-full flex flex-col gap-4 p-2 overflow-auto rounded-xl dark:text-white bg-indigo-50 dark:bg-gray-700" >
|
||||
<div id="content" :class="{'hidden' : areTooltipsHidden}" class="w-full flex flex-col gap-4 p-2 overflow-auto rounded-lg dark:text-white bg-white dark:bg-gray-700" >
|
||||
<slot></slot>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -17,11 +17,11 @@ const props = defineProps(
|
||||
|
||||
|
||||
<template>
|
||||
<div class="w-full mb-4 p-2 rounded-xl shadow-lg bg-gradient-to-r from-blue-400 to-blue-300 dark:from-sky-700 dark:to-sky-900">
|
||||
<button @click="switchHiddenElement()" type="button" :class="[isActive ? 'rounded-lg' : 'rounded-lg']" class="w-full p-1 text-lg font-normal text-gray-900 transition duration-75 hover:bg-blue-100 dark:text-gray-100 dark:hover:bg-slate-600">
|
||||
<div class="w-full mb-4 p-2 rounded-xl shadow-lg bg-white dark:bg-gray-600 dark:from-sky-700 dark:to-sky-900">
|
||||
<button @click="switchHiddenElement()" type="button" :class="[isActive ? 'rounded-lg' : 'rounded-lg']" class="w-full p-1 text-lg font-normal text-gray-900 transition duration-75 hover:bg-[#2A93B0] dark:text-gray-100 dark:hover:bg-slate-600">
|
||||
<span class="flex-1 whitespace-nowrap">{{props.categoryName}}</span>
|
||||
</button>
|
||||
<div class="flex flex-col w-full mt-2 py-2 bg-indigo-50 dark:bg-slate-800 rounded-xl font-light overflow-hidden" :class="[isActive ? 'active' : 'hidden']">
|
||||
<div class="flex flex-col w-full mt-2 py-2 bg-white dark:bg-gray-600 rounded-xl font-light overflow-hidden" :class="[isActive ? 'active' : 'hidden']">
|
||||
<slot></slot>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -11,7 +11,7 @@ const props = defineProps(
|
||||
|
||||
<template>
|
||||
<RouterLink
|
||||
class="w-full text-center py-2 px-4 text-gray-800 transition duration-75 hover:bg-blue-100 dark:text-white dark:hover:bg-slate-600"
|
||||
class="w-full text-center py-2 px-4 text-gray-800 transition duration-75 hover:bg-[#bbe3ef] dark:bg-gray-600 dark:text-white dark:hover:bg-[#2A93B0]"
|
||||
:to="props.pathTo">{{ props.elementContent }}</RouterLink>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -7,16 +7,18 @@ const props = defineProps(
|
||||
{
|
||||
tool: {type: String, required: true},
|
||||
xml: {type: [String, Array<TabData>], required: true},
|
||||
query: {type: String, required: true}
|
||||
query: {type: String, required: true},
|
||||
activeTabId: {type: Number, required: false}
|
||||
}
|
||||
)
|
||||
|
||||
const emit = defineEmits(["update"]);
|
||||
const emit = defineEmits(["update", "update:engine"]);
|
||||
|
||||
const result = ref('');
|
||||
|
||||
let enginesForCurrentTool = ref(["saxon", "xalan", "libxml"]);
|
||||
|
||||
const allVersionsOfXpath = ["2.0", "3.0", "3.1"];
|
||||
const allVersions = ["1.0", "2.0", "3.0", "3.1"];
|
||||
let versionsForCurrentEngine = ref([""]);
|
||||
|
||||
@@ -72,7 +74,7 @@ function changeAvailableVersionsOfXPath() {
|
||||
if(engine.value == "xalan" || engine.value == "libxml")
|
||||
versionsForCurrentEngine.value = ["1.0"];
|
||||
else if (engine.value == "saxon")
|
||||
versionsForCurrentEngine.value = allVersions;
|
||||
versionsForCurrentEngine.value = allVersionsOfXpath;
|
||||
}
|
||||
|
||||
function selectDefaultEngine() {
|
||||
@@ -109,21 +111,23 @@ function prepareRequest():Request {
|
||||
|
||||
function prepareURL(): string {
|
||||
const engineEndpoint = engine.value == "libxml" ? "libxml" : "java";
|
||||
|
||||
|
||||
let tool = props.tool;
|
||||
if (Array.isArray(props.xml) && props.xml.length > 1)
|
||||
if (Array.isArray(props.xml) && props.xml.length > 1 && engine.value == "saxon")
|
||||
tool = "multiple/xslt";
|
||||
|
||||
return document.location.protocol + "//" + document.location.hostname + "/" + engineEndpoint + "/" + tool;
|
||||
}
|
||||
|
||||
function selectRequestBodyType() : string {
|
||||
if (Array.isArray(props.xml) && props.xml.length > 1)
|
||||
return prepareRequestBodyMultiXml();
|
||||
if (Array.isArray(props.xml) && (engine.value == "xalan" || engine.value == "libxml"))
|
||||
return prepareRequestBodySingleXml(props.xml.at(props.activeTabId!)!.data)
|
||||
else if (Array.isArray(props.xml) && props.xml.length > 1)
|
||||
return prepareRequestBodyMultiXml();
|
||||
else if (Array.isArray(props.xml))
|
||||
return prepareRequestBodySingleXml(props.xml.at(0)!.data);
|
||||
return prepareRequestBodySingleXml(props.xml.at(0)!.data);
|
||||
else
|
||||
return prepareRequestBodySingleXml(props.xml!);
|
||||
return prepareRequestBodySingleXml(props.xml!);
|
||||
}
|
||||
|
||||
function prepareRequestBodySingleXml(data: string):string {
|
||||
@@ -188,6 +192,10 @@ function emitVersionChange() {
|
||||
emit("update", version.value);
|
||||
}
|
||||
|
||||
function emitEngineChange() {
|
||||
emit("update:engine", engine.value);
|
||||
}
|
||||
|
||||
function isVersionSelectionAvailable() {
|
||||
return !(versionsForCurrentEngine.value.length == 1 && versionsForCurrentEngine.value.at(0) == "N/A");
|
||||
}
|
||||
@@ -202,6 +210,11 @@ function highlightField() {
|
||||
return "";
|
||||
}
|
||||
|
||||
function handleChange() {
|
||||
changeAvailableVersions();
|
||||
emitEngineChange();
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@@ -209,10 +222,10 @@ function highlightField() {
|
||||
<div class="flex place-content-between w-full items-center pb-2">
|
||||
<span class="dark:text-white">Result:</span>
|
||||
<div class="flex space-x-2 overflow-x-auto">
|
||||
<select v-model="engine" name="engine" @change="changeAvailableVersions()" class="px-3 rounded-full border border-slate-400 bg-white dark:text-slate-100 dark:bg-gray-600">
|
||||
<select v-model="engine" name="engine" @change="handleChange()" class="px-3 rounded-lg border border-slate-400 bg-white dark:text-slate-100 dark:bg-gray-600">
|
||||
<option v-for="engine in enginesForCurrentTool" :value="engine">{{ engine }}</option>
|
||||
</select>
|
||||
<select v-model="version" v-if="isVersionSelectionAvailable()" name="version" @change="emitVersionChange()" class="px-3 rounded-full border border-slate-400 bg-white dark:text-slate-100 dark:bg-gray-600">
|
||||
<select v-model="version" v-if="isVersionSelectionAvailable()" name="version" @change="emitVersionChange()" class="px-3 rounded-lg border border-slate-400 bg-white dark:text-slate-100 dark:bg-gray-600">
|
||||
<option v-for="version in versionsForCurrentEngine" :value="version">{{ version }}</option>
|
||||
</select>
|
||||
<button class="tool-button" @click="clear">Clear</button>
|
||||
|
||||
@@ -10,11 +10,11 @@ const props = defineProps(
|
||||
{
|
||||
stylizedName: {type: String, required: true},
|
||||
data: {type: Array<TabData>},
|
||||
tabCountLimit: {type: Number, required: false, validator: (value) => typeof value == "number" && value > 0}
|
||||
tabCountLimit: {type: Number, required: false, validator: (value) => typeof value == "number" && value > 0},
|
||||
engine: {type: String, required: true}
|
||||
}
|
||||
)
|
||||
const emit = defineEmits(['update:modelValue'])
|
||||
|
||||
const emit = defineEmits(['update:modelValue', 'update:activeTabId'])
|
||||
const newTabId = ref(0);
|
||||
const activeTabId = ref(0);
|
||||
const data = ref('')
|
||||
@@ -30,6 +30,9 @@ tabs.value.push({
|
||||
function sendValue() {
|
||||
emit('update:modelValue', tabs.value);
|
||||
}
|
||||
function emitActiveTab() {
|
||||
emit('update:activeTabId', activeTabId.value);
|
||||
}
|
||||
|
||||
function updateData(newData: string) {
|
||||
data.value = newData;
|
||||
@@ -73,6 +76,7 @@ function changeActiveTab(id : number) {
|
||||
|
||||
tabs.value.at(index)!.data = data.value;
|
||||
activeTabId.value = id;
|
||||
emitActiveTab();
|
||||
data.value = tabs.value.at(newIndex)!.data;
|
||||
|
||||
sendValue();
|
||||
@@ -128,7 +132,7 @@ function findIndexWithID(id : number) : number {
|
||||
<div class="flex flex-col w-full h-1/2 lg:h-1/2 flex-none xl:pr-2 2xl:pr-4 pb-2">
|
||||
<div class="flex justify-between mb-2">
|
||||
<div class="flex gap-2 overflow-x-auto">
|
||||
<TabComponent @click:activate="changeActiveTab" @click:remove="removeTab" v-for="tab in tabs" :id="tab.id" :isActive="tab.id == activeTabId">{{ tab.name }}</TabComponent>
|
||||
<TabComponent @click:activate="changeActiveTab" @click:remove="removeTab" v-for="tab in tabs" :id="tab.id" :isActive="tab.id == activeTabId" :class="[tab.id !== activeTabId && (props.engine === 'xalan' ? 'disabled-tab' : '' || props.engine === 'libxml' ? 'disabled-tab' : '')]">{{ tab.name }}</TabComponent>
|
||||
</div>
|
||||
<div class="flex gap-2">
|
||||
<div class="flex items-stretch w-64">
|
||||
|
||||
@@ -13,9 +13,9 @@ function toggleTooltips() {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="flex p-2 flex-col rounded-xl shadow-lg bg-gradient-to-r from-gray-300 to-slate-300 dark:from-slate-500 dark:to-slate-600">
|
||||
<div class="flex p-2 flex-col rounded-lg shadow-lg bg-white dark:bg-gray-700 dark:from-slate-500 dark:to-slate-600">
|
||||
<button :class="{ 'mb-2' : !isCategoryHidden }" class="dark:text-slate-100 hover:font-bold" @click="toggleTooltips()">{{ props.name }}</button>
|
||||
<div id="content" :class="{'hidden' : isCategoryHidden}" class="flex flex-col gap-4 w-full h-fit p-2 rounded-xl dark:text-white bg-indigo-50 dark:bg-slate-800" >
|
||||
<div id="content" :class="{'hidden' : isCategoryHidden}" class="flex flex-col gap-4 w-full h-fit p-2 rounded-lg dark:text-white bg-white dark:bg-gray-700" >
|
||||
<slot></slot>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -58,11 +58,11 @@ function toggleTooltips() {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div :class="areTooltipsHidden ? 'w-fit' : 'w-[26rem]'" class="hidden xl:flex shrink-0 items-stretch p-2 flex-row rounded-xl shadow-lg bg-gradient-to-r from-blue-400 to-blue-300 dark:from-sky-600 dark:to-sky-800 ">
|
||||
<div :class="areTooltipsHidden ? 'w-fit' : 'w-[26rem]'" class="hidden xl:flex shrink-0 items-stretch p-2 flex-row rounded-lg shadow-lg bg-[#bbe3ef] dark:bg-[#2A93B0] dark:from-sky-600 dark:to-sky-800 ">
|
||||
<button :class="{'mr-2' : !areTooltipsHidden }" class="text-xl w-6 dark:text-slate-100" @click="toggleTooltips()">
|
||||
T<br/>o<br/>o<br/>l<br/>t<br/>i<br/>p<br/>s
|
||||
</button>
|
||||
<div id="content" :class="{'hidden' : areTooltipsHidden}" class="w-full flex flex-col gap-4 p-2 overflow-auto rounded-xl dark:text-white bg-indigo-50 dark:bg-gray-700" >
|
||||
<div id="content" :class="{'hidden' : areTooltipsHidden}" class="w-full flex flex-col gap-4 p-2 overflow-auto rounded-lg dark:text-white bg-[#bbe3ef] dark:bg-gray-700" >
|
||||
<TooltipDiffsComponent :tool-name="toolType" :tool-version="props.version"></TooltipDiffsComponent>
|
||||
<div class="w-full h-2"> </div>
|
||||
<tooltipCategoryComponent v-for="category in selectTooltip()" :key="category.name" :name="category.name">
|
||||
|
||||
@@ -48,7 +48,7 @@ function interpretXPathIndicators( elementType:string ):string {
|
||||
<template>
|
||||
<div class="flex p-1 flex-col rounded-xl border border-slate-400 dark:border-slate-400">
|
||||
<button :class="{ 'mb-2' : !isEntryHidden }" class="dark:text-slate-100 hover:font-bold" @click="toggleTooltips()">{{ props.entryData.name }}</button>
|
||||
<div id="content" :class="{'hidden' : isEntryHidden}" class="w-full p-2 rounded-xl dark:text-white bg-indigo-50 dark:bg-slate-800" >
|
||||
<div id="content" :class="{'hidden' : isEntryHidden}" class="w-full p-2 rounded-xl dark:text-white bg-white dark:bg-gray-700" >
|
||||
<h4 class="text-xl mb-2 font-bold text-justify">Description</h4>
|
||||
<span class="text-justify">
|
||||
<p>
|
||||
|
||||
@@ -17,7 +17,7 @@
|
||||
}
|
||||
|
||||
.tool-button {
|
||||
@apply hover:brightness-110 py-2 px-3 h-fit min-w-fit rounded-full bg-gradient-to-r from-blue-400 to-sky-300 dark:text-white dark:from-sky-600 dark:to-sky-800 hover:bg-blue-400
|
||||
@apply hover:brightness-110 py-2 px-3 h-fit min-w-fit rounded-lg bg-white border border-[#2A93B0] dark:bg-[#2A93B0] dark:text-white dark:from-sky-600 dark:to-sky-800 hover:bg-[#2A93B0]
|
||||
}
|
||||
|
||||
.text-field {
|
||||
@@ -25,7 +25,7 @@
|
||||
}
|
||||
|
||||
.file-selector {
|
||||
@apply block file:border-none file:font-sans file:text-base file:hover:brightness-110 file:py-2 file:px-3 file:h-full file:w-fit file:rounded-full file:bg-gradient-to-r file:from-blue-400 file:to-sky-300 file:dark:text-white file:dark:from-sky-600 file:dark:to-sky-800 file:hover:bg-blue-400 w-fit rounded-full text-sm text-gray-900 border border-gray-300 cursor-pointer bg-gray-50 dark:text-gray-400 focus:outline-none dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400
|
||||
@apply block file:border-none file:font-sans file:text-base file:hover:brightness-110 file:py-2 file:px-3 file:h-full file:w-fit file:rounded-lg file:bg-white file:from-blue-400 file:to-sky-300 file:dark:text-white file:dark:bg-[#2A93B0] file:dark:from-sky-600 file:dark:to-sky-800 file:hover:bg-[#2A93B0] w-fit rounded-lg text-sm text-gray-900 border border-[#2A93B0] cursor-pointer bg-gray-50 dark:text-gray-400 focus:outline-none dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400
|
||||
}
|
||||
|
||||
.text-field-error {
|
||||
@@ -41,5 +41,9 @@
|
||||
}
|
||||
|
||||
.tab-active {
|
||||
@apply py-2 px-3 h-fit text-slate-700 border-t border-l border-r border-slate-400 rounded-t-2xl bg-gradient-to-r from-blue-400 to-sky-300 dark:text-white dark:from-sky-600 dark:to-sky-800 hover:bg-blue-400
|
||||
@apply py-2 px-3 h-fit text-slate-700 border-t border-l border-r border-slate-400 rounded-t-2xl bg-[#bbe3ef] dark:bg-[#2A93B0] dark:text-white dark:from-sky-600 dark:to-sky-800
|
||||
}
|
||||
|
||||
.disabled-tab {
|
||||
@apply py-2 px-3 h-fit text-slate-400 border-t border-l border-r border-slate-300 rounded-t-2xl bg-gradient-to-r from-gray-200 to-gray-300 dark:from-gray-700 dark:to-gray-800 pointer-events-none opacity-50;
|
||||
}
|
||||
|
||||
@@ -10,6 +10,9 @@ export default {
|
||||
|
||||
|
||||
<template>
|
||||
<div class="flex rounded-lg items-center bg-[#f5f7fa] justify-center ">
|
||||
<LandingComponent></LandingComponent>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
|
||||
@@ -11,6 +11,8 @@ import { ref } from 'vue';
|
||||
const xml = ref(new Array<TabData>);
|
||||
const query = ref('');
|
||||
const version = ref('');
|
||||
const engine = ref('')
|
||||
const activeTabId = ref(0)
|
||||
|
||||
function updateVersion(newVersion: string) {
|
||||
version.value = newVersion;
|
||||
@@ -22,10 +24,10 @@ function updateVersion(newVersion: string) {
|
||||
<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" :tab-count-limit="3" v-model="xml"></xmlTabbedInputComponent>
|
||||
<xmlTabbedInputComponent stylized-name="XML" v-model:activeTabId="activeTabId" :engine="engine" :tab-count-limit="3" v-model="xml"></xmlTabbedInputComponent>
|
||||
<xmlInputFieldComponent stylized-name="XSLT" :data="query" v-model="query"></xmlInputFieldComponent>
|
||||
</div>
|
||||
<xmlOutputFieldComponent tool="xslt" :xml="xml" :query="query" @update="updateVersion"></xmlOutputFieldComponent>
|
||||
<xmlOutputFieldComponent tool="xslt" :xml="xml" :active-tab-id="activeTabId" v-model:engine="engine" :query="query" @update="updateVersion"></xmlOutputFieldComponent>
|
||||
</div>
|
||||
<TooltipComponent tool-type="xslt" :version="version"></TooltipComponent>
|
||||
</div>
|
||||
|
||||
21
issue_template/bug.md
Normal file
21
issue_template/bug.md
Normal file
@@ -0,0 +1,21 @@
|
||||
---
|
||||
|
||||
name: "Bug template"
|
||||
about: "This template is for reporting bugs"
|
||||
title: "Bug"
|
||||
|
||||
---
|
||||
|
||||
## Description
|
||||
*A clear and concise description of the issue.*
|
||||
|
||||
### Selected Fields
|
||||
- **Engine:** [Specify the engine used]
|
||||
- **Version:** [Specify the version]
|
||||
- **Tool:** [Specify the currently used tool]
|
||||
|
||||
### Data:
|
||||
*Paste used xml/xslt/json etc...*
|
||||
|
||||
## Additional Context
|
||||
*Any other information that might help with this issue.*
|
||||
10
issue_template/feature.md
Normal file
10
issue_template/feature.md
Normal file
@@ -0,0 +1,10 @@
|
||||
---
|
||||
|
||||
name: "Feature request template"
|
||||
about: "This template is for requesting features"
|
||||
title: "Feature request"
|
||||
|
||||
---
|
||||
|
||||
## Feature Request
|
||||
*Describe the feature you’d like to see and why it’s useful.*
|
||||
Reference in New Issue
Block a user