added fix for unicde characters

This commit is contained in:
dcore94 2024-11-15 15:24:35 +01:00
parent 7f36ebe941
commit a58fdbfd3d
5 changed files with 44 additions and 19 deletions

View File

@ -491,7 +491,7 @@ class CCPExecutionForm extends HTMLElement {
"in": (e, d) => { return Object.values(d.inputs) },
target: "div",
apply: (e, d) => {
e.innerHTML = `<d4s-ccp-input name="${d.id}" input='${btoa(JSON.stringify(d))}'></d4s-ccp-input>`
e.innerHTML = `<d4s-ccp-input name="${d.id}" input='${base64EncodeUnicode(JSON.stringify(d))}'></d4s-ccp-input>`
}
}
]
@ -504,7 +504,7 @@ class CCPExecutionForm extends HTMLElement {
"in": (e, d) => { return Object.values(d.outputs) },
target: "div",
apply: (e, d) => {
e.innerHTML = `<d4s-ccp-output name="${d.id}" output='${btoa(JSON.stringify(d))}'></d4s-ccp-output>`
e.innerHTML = `<d4s-ccp-output name="${d.id}" output='${base64EncodeUnicode(JSON.stringify(d))}'></d4s-ccp-output>`
}
}
]

View File

@ -7,65 +7,65 @@ class CCPInputWidgetController extends HTMLElement {
}
connectedCallback() {
this.#data = JSON.parse(atob(this.getAttribute("input")))
this.#data = JSON.parse(base64DecodeUnicode(this.getAttribute("input")))
if (this.isChecklist()) {
const opts = this.#data.schema.enum.join(",")
this.innerHTML += `<d4s-ccp-input-checklist readonly="${this.#data.schema.readOnly}" options="${opts}" default="${this.#data.schema.default}" maxOccurs="${this.#data.maxOccurs}" minOccurs="${this.#data.minOccurs}" name="${this.#data.id}" description="${btoa(this.#data.description)}" title="${this.#data.title}"></d4s-ccp-input-checklist>`
this.innerHTML += `<d4s-ccp-input-checklist readonly="${this.#data.schema.readOnly}" options="${opts}" default="${this.#data.schema.default}" maxOccurs="${this.#data.maxOccurs}" minOccurs="${this.#data.minOccurs}" name="${this.#data.id}" description="${base64EncodeUnicode(this.#data.description)}" title="${this.#data.title}"></d4s-ccp-input-checklist>`
this.querySelector("d4s-ccp-input-checklist").default = this.#data.schema.default
} else if (this.isEnum()) {
const opts = this.#data.schema.enum.join(",")
this.innerHTML += `<d4s-ccp-input-enum readonly="${this.#data.schema.readOnly}" options="${opts}" default="${this.#data.schema.default}" maxOccurs="${this.#data.maxOccurs}" minOccurs="${this.#data.minOccurs}" name="${this.#data.id}" description="${btoa(this.#data.description)}" title="${this.#data.title}"></d4s-ccp-input-enum>`
this.innerHTML += `<d4s-ccp-input-enum readonly="${this.#data.schema.readOnly}" options="${opts}" default="${this.#data.schema.default}" maxOccurs="${this.#data.maxOccurs}" minOccurs="${this.#data.minOccurs}" name="${this.#data.id}" description="${base64EncodeUnicode(this.#data.description)}" title="${this.#data.title}"></d4s-ccp-input-enum>`
this.querySelector("d4s-ccp-input-enum").default = this.#data.schema.default
} else if (this.isCode()) {
this.innerHTML += `<d4s-ccp-input-textarea readonly="${this.#data.schema.readOnly}" default="${this.#data.schema.default}" maxOccurs="${this.#data.maxOccurs}" minOccurs="${this.#data.minOccurs}" name="${this.#data.id}" description="${btoa(this.#data.description)}" title="${this.#data.title}"></d4s-ccp-input-textarea>`
this.innerHTML += `<d4s-ccp-input-textarea readonly="${this.#data.schema.readOnly}" default="${this.#data.schema.default}" maxOccurs="${this.#data.maxOccurs}" minOccurs="${this.#data.minOccurs}" name="${this.#data.id}" description="${base64EncodeUnicode(this.#data.description)}" title="${this.#data.title}"></d4s-ccp-input-textarea>`
this.querySelector("d4s-ccp-input-textarea").default = this.#data.schema.default
} else if (this.isDateTime()) {
const t = this.#data.schema.format.toLowerCase() === "datetime" ?
"datetime-local" : this.#data.schema.format.toLowerCase()
this.innerHTML += `<d4s-ccp-input-simple type="${t}" readonly="${this.#data.schema.readOnly}" default="${this.#data.schema.default}" maxOccurs="${this.#data.maxOccurs}" minOccurs="${this.#data.minOccurs}" name="${this.#data.id}" description="${btoa(this.#data.description)}" title="${this.#data.title}"></d4s-ccp-input-simple>`
this.innerHTML += `<d4s-ccp-input-simple type="${t}" readonly="${this.#data.schema.readOnly}" default="${this.#data.schema.default}" maxOccurs="${this.#data.maxOccurs}" minOccurs="${this.#data.minOccurs}" name="${this.#data.id}" description="${base64EncodeUnicode(this.#data.description)}" title="${this.#data.title}"></d4s-ccp-input-simple>`
this.querySelector("d4s-ccp-input-simple").default = this.#data.schema.default
} else if (this.isFile()) {
this.innerHTML += `<d4s-ccp-input-file readonly="${this.#data.schema.readOnly}" default="${this.#data.schema.default}" maxOccurs="${this.#data.maxOccurs}" minOccurs="${this.#data.minOccurs}" name="${this.#data.id}" description="${btoa(this.#data.description)}" title="${this.#data.title}"></d4s-ccp-input-file>`
this.innerHTML += `<d4s-ccp-input-file readonly="${this.#data.schema.readOnly}" default="${this.#data.schema.default}" maxOccurs="${this.#data.maxOccurs}" minOccurs="${this.#data.minOccurs}" name="${this.#data.id}" description="${base64EncodeUnicode(this.#data.description)}" title="${this.#data.title}"></d4s-ccp-input-file>`
this.querySelector("d4s-ccp-input-file").default = this.#data.schema.default
} else if (this.isRemoteFile()) {
this.innerHTML += `<d4s-ccp-input-remotefile readonly="${this.#data.schema.readOnly}" default="${this.#data.schema.default}" maxOccurs="${this.#data.maxOccurs}" minOccurs="${this.#data.minOccurs}" name="${this.#data.id}" description="${btoa(this.#data.description)}" title="${this.#data.title}"></d4s-ccp-input-remotefile>`
this.innerHTML += `<d4s-ccp-input-remotefile readonly="${this.#data.schema.readOnly}" default="${this.#data.schema.default}" maxOccurs="${this.#data.maxOccurs}" minOccurs="${this.#data.minOccurs}" name="${this.#data.id}" description="${base64EncodeUnicode(this.#data.description)}" title="${this.#data.title}"></d4s-ccp-input-remotefile>`
this.querySelector("d4s-ccp-input-remotefile").default = this.#data.schema.default
} else if (this.isGeo()) {
this.innerHTML += `<d4s-ccp-input-geo readonly="${this.#data.schema.readOnly}" default="${this.#data.schema.default}" maxOccurs="${this.#data.maxOccurs}" minOccurs="${this.#data.minOccurs}" name="${this.#data.id}" description="${btoa(this.#data.description)}" title="${this.#data.title}"></d4s-ccp-input-remotefile>`
this.innerHTML += `<d4s-ccp-input-geo readonly="${this.#data.schema.readOnly}" default="${this.#data.schema.default}" maxOccurs="${this.#data.maxOccurs}" minOccurs="${this.#data.minOccurs}" name="${this.#data.id}" description="${base64EncodeUnicode(this.#data.description)}" title="${this.#data.title}"></d4s-ccp-input-remotefile>`
this.querySelector("d4s-ccp-input-geo").default = this.#data.schema.default
} else if (this.isSecret()) {
this.innerHTML += `<d4s-ccp-input-secret readonly="${this.#data.schema.readOnly}" default="${this.#data.schema.default}" maxOccurs="${this.#data.maxOccurs}" minOccurs="${this.#data.minOccurs }" name="${this.#data.id}" description="${btoa(this.#data.description)}" title="${this.#data.title}"></d4s-ccp-input-secret>`
this.innerHTML += `<d4s-ccp-input-secret readonly="${this.#data.schema.readOnly}" default="${this.#data.schema.default}" maxOccurs="${this.#data.maxOccurs}" minOccurs="${this.#data.minOccurs }" name="${this.#data.id}" description="${base64EncodeUnicode(this.#data.description)}" title="${this.#data.title}"></d4s-ccp-input-secret>`
this.querySelector("d4s-ccp-input-secret").default = this.#data.schema.default
} else if (this.isBoolean()) {
this.innerHTML += `<d4s-ccp-input-boolean readonly="${this.#data.schema.readOnly}" default="${this.#data.schema.default}" maxOccurs="${this.#data.maxOccurs}" minOccurs="${this.#data.minOccurs}" name="${this.#data.id}" description="${btoa(this.#data.description)}" title="${this.#data.title}"></d4s-ccp-input-boolean>`
this.innerHTML += `<d4s-ccp-input-boolean readonly="${this.#data.schema.readOnly}" default="${this.#data.schema.default}" maxOccurs="${this.#data.maxOccurs}" minOccurs="${this.#data.minOccurs}" name="${this.#data.id}" description="${base64EncodeUnicode(this.#data.description)}" title="${this.#data.title}"></d4s-ccp-input-boolean>`
this.querySelector("d4s-ccp-input-boolean").default = this.#data.schema.default
} else if (this.isNumber()) {
this.innerHTML += `<d4s-ccp-input-simple type="number" readonly="${this.#data.schema.readOnly}" default="${this.#data.schema.default}" maxOccurs="${this.#data.maxOccurs}" minOccurs="${this.#data.minOccurs}" name="${this.#data.id}" description="${btoa(this.#data.description)}" title="${this.#data.title}"></d4s-ccp-input-simple>`
this.innerHTML += `<d4s-ccp-input-simple type="number" readonly="${this.#data.schema.readOnly}" default="${this.#data.schema.default}" maxOccurs="${this.#data.maxOccurs}" minOccurs="${this.#data.minOccurs}" name="${this.#data.id}" description="${base64EncodeUnicode(this.#data.description)}" title="${this.#data.title}"></d4s-ccp-input-simple>`
this.querySelector("d4s-ccp-input-simple").default = this.#data.schema.default
} else {
this.innerHTML += `<d4s-ccp-input-simple readonly="${this.#data.schema.readOnly}" default="${this.#data.schema.default}" maxOccurs="${this.#data.maxOccurs}" minOccurs="${this.#data.minOccurs}" name="${this.#data.id}" description="${btoa(this.#data.description)}" title="${this.#data.title}"></d4s-ccp-input-simple>`
this.innerHTML += `<d4s-ccp-input-simple readonly="${this.#data.schema.readOnly}" default="${this.#data.schema.default}" maxOccurs="${this.#data.maxOccurs}" minOccurs="${this.#data.minOccurs}" name="${this.#data.id}" description="${base64EncodeUnicode(this.#data.description)}" title="${this.#data.title}"></d4s-ccp-input-simple>`
this.querySelector("d4s-ccp-input-simple").default = this.#data.schema.default
}
@ -173,7 +173,7 @@ class CCPBaseInputWidgetController extends HTMLElement {
this.#rootdoc = this//this.attachShadow({ mode: "open" });
this.#name = this.getAttribute("name")
this.#title = this.getAttribute("title")
this.#description = this.getAttribute("description")
this.#description = base64DecodeUnicode(this.getAttribute("description"))
//this.#default = this.getAttribute("default")
this.#minOccurs = Number(this.getAttribute("minoccurs") ? this.getAttribute("minoccurs") : 1)
this.#maxOccurs = Number(this.getAttribute("maxoccurs") ? this.getAttribute("maxoccurs") : 1)
@ -296,7 +296,7 @@ class CCPBaseInputWidgetController extends HTMLElement {
</div>
</div>
<div>
<small class="text-muted">${atob(this.#description)}</small>
<small class="text-muted">${this.#description}</small>
</div>
<div name="content">
</div>
@ -616,7 +616,7 @@ class CCPRemoteFileInputWidgetController extends CCPBaseInputWidgetController {
</div>
<small class="text-muted m-0">Select an item or drag and drop it to a proper input</small>
</div>
<div style="min-width:500px; max-width:640px;overflow:auto;etxt-wrap:nowrap;text-overflow: ellipsis;min-height:5rem; max-height:10rem;">
<div style="min-width:500px; max-width:640px;overflow:auto;text-wrap:nowrap;text-overflow: ellipsis;min-height:5rem; max-height:10rem;">
<d4s-storage-tree
base-url="${addresses[iss]}"
file-download-enabled="true"

View File

@ -66,7 +66,7 @@ class CCPInputWidgetEditorController extends HTMLElement {
}
renderDefaultByType() {
return `<d4s-ccp-input name="default" input="${btoa(JSON.stringify(this.#input))}"></d4s-ccp-input>`
return `<d4s-ccp-input name="default" input="${base64EncodeUnicode(JSON.stringify(this.#input))}"></d4s-ccp-input>`
}
renderDeleteButton() {

View File

@ -4,7 +4,7 @@ class CCPOutputWidgetController extends HTMLElement {
constructor(){
super()
this.#output = JSON.parse(atob(this.getAttribute("output")))
this.#output = JSON.parse(base64DecodeUnicode(this.getAttribute("output")))
}
connectedCallback(){

25
common/js/utils.js Normal file
View File

@ -0,0 +1,25 @@
function base64EncodeUnicode(str) {
// Encode the string as UTF-8 bytes
const utf8Bytes = new TextEncoder().encode(str);
// Convert the bytes to a binary string
let binary = '';
utf8Bytes.forEach(byte => {
binary += String.fromCharCode(byte);
});
// Encode the binary string to Base64
return btoa(binary);
}
function base64DecodeUnicode(base64) {
// Decode the Base64 string to a binary string
const binary = atob(base64);
// Convert the binary string to a Uint8Array
const bytes = Uint8Array.from(binary, char => char.charCodeAt(0));
// Decode the UTF-8 bytes back to a Unicode string
const decoder = new TextDecoder();
return decoder.decode(bytes);
}