Changed prretyName props to stylizedName and some other to more descriptive
This commit is contained in:
		| @@ -8,7 +8,7 @@ import sampleXQuery from "@/assets/sampleXQuery.xquery?raw" | ||||
|  | ||||
| const props = defineProps( | ||||
|     { | ||||
|         prettyName: {type: String, required: true} | ||||
|         stylizedName: {type: String, required: true} | ||||
|     } | ||||
| ) | ||||
|  | ||||
| @@ -16,7 +16,7 @@ const emit = defineEmits(['update:defaultData']) | ||||
|  | ||||
| function setDefault() { | ||||
|     const emitName = "update:defaultData"; | ||||
|     switch (props.prettyName.toLowerCase()) { | ||||
|     switch (props.stylizedName.toLowerCase()) { | ||||
|         case "json": | ||||
|             emit(emitName, "{'message': 'Here we have to add some proper message', 'answer': 'Ya, definitely'}") | ||||
|             break; | ||||
| @@ -43,5 +43,5 @@ function setDefault() { | ||||
| </script> | ||||
|  | ||||
| <template> | ||||
|     <button class="tool-button" @click="setDefault()">Default {{ prettyName }}</button> | ||||
|     <button class="tool-button" @click="setDefault()">Default {{ stylizedName }}</button> | ||||
| </template> | ||||
| @@ -1,7 +1,7 @@ | ||||
| <script setup lang="ts"> | ||||
|  | ||||
| const props = defineProps({ | ||||
|     xml: {type: String, required: true}, | ||||
|     json: {type: String, required: true}, | ||||
|     isMinimizer: {type: Boolean} | ||||
| }) | ||||
|  | ||||
| @@ -30,7 +30,7 @@ function prepareURL(): string { | ||||
| } | ||||
|  | ||||
| function prepareRequestBody():string { | ||||
|     var requestBody = props.xml; | ||||
|     var requestBody = props.json; | ||||
|     return requestBody; | ||||
| } | ||||
|  | ||||
|   | ||||
| @@ -7,7 +7,7 @@ const data = ref('') | ||||
|  | ||||
| const props = defineProps( | ||||
|     { | ||||
|         prettyName: {type: String, required: true}, | ||||
|         stylizedName: {type: String, required: true}, | ||||
|         data: {type: String}, | ||||
|     } | ||||
| ) | ||||
| @@ -27,9 +27,9 @@ function clear() { | ||||
| } | ||||
|  | ||||
| function canBeFormatted() { | ||||
|     return props.prettyName.toLowerCase() == 'xml' ||  | ||||
|            props.prettyName.toLowerCase() == 'xsd' ||  | ||||
|            props.prettyName.toLowerCase() == 'xslt'; | ||||
|     return props.stylizedName.toLowerCase() == 'xml' ||  | ||||
|            props.stylizedName.toLowerCase() == 'xsd' ||  | ||||
|            props.stylizedName.toLowerCase() == 'xslt'; | ||||
| } | ||||
|  | ||||
| </script> | ||||
| @@ -37,9 +37,9 @@ function canBeFormatted() { | ||||
| <template> | ||||
|     <div class="flex flex-col w-full h-1/2"> | ||||
|         <div class="flex place-content-between w-full pr-2 items-center m-2"> | ||||
|             <span class="dark:text-white">{{ prettyName }}</span> | ||||
|             <span class="dark:text-white">{{ stylizedName }}</span> | ||||
|             <div class="flex space-x-2"> | ||||
|                 <InsertTemplateComponent :pretty-name="props.prettyName" @update:default-data="(data: string) => updateData(data)"></InsertTemplateComponent> | ||||
|                 <InsertTemplateComponent :stylized-name="props.stylizedName" @update:default-data="(data: string) => updateData(data)"></InsertTemplateComponent> | ||||
|                 <XMLButtonFormatterComponent v-if="canBeFormatted()" :xml="data" @update:result="(data:any) => updateData(data.result)"></XMLButtonFormatterComponent> | ||||
|                 <button class="tool-button" @click="clear">Clear</button> | ||||
|             </div> | ||||
|   | ||||
| @@ -25,10 +25,10 @@ function clear() { | ||||
|         <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"> | ||||
|                 <InsertTemplateComponent pretty-name="JSON" @update:defaultData="(data: string) => setTextFieldValue(data)"></InsertTemplateComponent> | ||||
|                 <InsertTemplateComponent stylized-name="JSON" @update:defaultData="(data: string) => setTextFieldValue(data)"></InsertTemplateComponent> | ||||
|                 <button class="tool-button" @click="clear()">Clear</button> | ||||
|                 <JsonButtonFormatterComponent isMinimizer :xml="json" @update:result="(data: any) => format(data)"></JsonButtonFormatterComponent> | ||||
|                 <JsonButtonFormatterComponent :xml="json" @update:result="(data: any) => format(data)"></JsonButtonFormatterComponent> | ||||
|                 <JsonButtonFormatterComponent isMinimizer :json="json" @update:result="(data: any) => format(data)"></JsonButtonFormatterComponent> | ||||
|                 <JsonButtonFormatterComponent :json="json" @update:result="(data: any) => format(data)"></JsonButtonFormatterComponent> | ||||
|             </div> | ||||
|         </div> | ||||
|         <textarea name="data" id="data" :value="json" class="text-field"></textarea> | ||||
|   | ||||
| @@ -12,8 +12,8 @@ const query = ref(''); | ||||
| <template> | ||||
|     <div id="layout" class="flex flex-col lg:flex-row w-full h-full gap-4"> | ||||
|         <div class="flex flex-col w-full lg:w-1/2 h-full items-center gap-4"> | ||||
|             <xmlInputFieldComponent prettyName="XML" :data="xml" @update="(data) => {xml = data}"></xmlInputFieldComponent> | ||||
|             <xmlInputFieldComponent prettyName="XPath" :data="query" @update="(data) => {query = data}"></xmlInputFieldComponent> | ||||
|             <xmlInputFieldComponent stylized-name="XML" :data="xml" @update="(data) => {xml = data}"></xmlInputFieldComponent> | ||||
|             <xmlInputFieldComponent stylized-name="XPath" :data="query" @update="(data) => {query = data}"></xmlInputFieldComponent> | ||||
|         </div> | ||||
|         <xmlOutputFieldComponent tool="xpath" :xml="xml" :query="query"></xmlOutputFieldComponent> | ||||
|     </div> | ||||
|   | ||||
| @@ -12,8 +12,8 @@ const query = ref(''); | ||||
| <template> | ||||
|     <div id="layout" class="flex flex-col lg:flex-row w-full h-full gap-4"> | ||||
|         <div class="flex flex-col w-full lg:w-1/2 h-full items-center gap-4"> | ||||
|             <xmlInputFieldComponent prettyName="XML" @update="(data) => {xml = data}"></xmlInputFieldComponent> | ||||
|             <xmlInputFieldComponent prettyName="XQuery" @update="(data) => {query = data}"></xmlInputFieldComponent> | ||||
|             <xmlInputFieldComponent stylized-name="XML" @update="(data) => {xml = data}"></xmlInputFieldComponent> | ||||
|             <xmlInputFieldComponent stylized-name="XQuery" @update="(data) => {query = data}"></xmlInputFieldComponent> | ||||
|         </div> | ||||
|         <xmlOutputFieldComponent tool="xquery" :xml="xml" :query="query"></xmlOutputFieldComponent> | ||||
|     </div> | ||||
|   | ||||
| @@ -12,8 +12,8 @@ const query = ref(''); | ||||
| <template> | ||||
|     <div id="layout" class="flex flex-col lg:flex-row w-full h-full gap-4"> | ||||
|         <div class="flex flex-col w-full lg:w-1/2 h-full items-center gap-4"> | ||||
|             <xmlInputFieldComponent prettyName="XML" @update="(data) => {xml = data}"></xmlInputFieldComponent> | ||||
|             <xmlInputFieldComponent prettyName="XSD" @update="(data) => {query = data}"></xmlInputFieldComponent> | ||||
|             <xmlInputFieldComponent stylized-name="XML" @update="(data) => {xml = data}"></xmlInputFieldComponent> | ||||
|             <xmlInputFieldComponent stylized-name="XSD" @update="(data) => {query = data}"></xmlInputFieldComponent> | ||||
|         </div> | ||||
|         <xmlOutputFieldComponent tool="xsd" :xml="xml" :query="query"></xmlOutputFieldComponent> | ||||
|     </div> | ||||
|   | ||||
| @@ -12,8 +12,8 @@ const query = ref(''); | ||||
| <template> | ||||
|     <div id="layout" class="flex flex-col lg:flex-row w-full h-full gap-4"> | ||||
|         <div class="flex flex-col w-full lg:w-1/2 h-full items-center gap-4"> | ||||
|             <xmlInputFieldComponent prettyName="XML" @update="(data) => {xml = data}"></xmlInputFieldComponent> | ||||
|             <xmlInputFieldComponent prettyName="XSLT" @update="(data) => {query = data}"></xmlInputFieldComponent> | ||||
|             <xmlInputFieldComponent stylized-name="XML" @update="(data) => {xml = data}"></xmlInputFieldComponent> | ||||
|             <xmlInputFieldComponent stylized-name="XSLT" @update="(data) => {query = data}"></xmlInputFieldComponent> | ||||
|         </div> | ||||
|         <xmlOutputFieldComponent tool="xslt" :xml="xml" :query="query"></xmlOutputFieldComponent> | ||||
|     </div> | ||||
|   | ||||
| @@ -25,7 +25,7 @@ function clear() { | ||||
|         <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"> | ||||
|                 <InsertTemplateComponent pretty-name="XML" @update:defaultData="(data: string) => setTextFieldValue(data)"></InsertTemplateComponent> | ||||
|                 <InsertTemplateComponent stylized-name="XML" @update:defaultData="(data: string) => setTextFieldValue(data)"></InsertTemplateComponent> | ||||
|                 <button class="tool-button" @click="clear()">Clear</button> | ||||
|                 <XMLButtonFormatterComponent is-minimizer :xml="xml" @update:result="(data: any) => format(data)"></XMLButtonFormatterComponent> | ||||
|                 <XMLButtonFormatterComponent :xml="xml" @update:result="(data: any) => format(data)"></XMLButtonFormatterComponent> | ||||
|   | ||||
		Reference in New Issue
	
	Block a user