Andromeda/jank-client-fork
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

type out Dialog

Browse source
This commit is contained in:
MathMan05 2024-09-08 17:47:36 -05:00
parent fc9d4d8d6f
commit b57988e734
2 changed files with 235 additions and 205 deletions
Download patch file Download diff file Expand all files Collapse all files

5
.dist/dialog.js
View file

@ -22,11 +22,11 @@ class Dialog {
const img = document.createElement("img");
img.src = array[1];
if (array[2] != undefined) {
if (array[2].length == 2) {
if (array[2].length === 2) {
img.width = array[2][0];
img.height = array[2][1];
}
else if (array[2][0] == "fit") {
else if (array[2][0] === "fit") {
img.classList.add("imgfit");
}
}
@ -226,6 +226,7 @@ class Dialog {
}
default:
console.error("can't find element:" + array[0], " full element:", array);
return document.createElement("span");
}
}
show() {

435
webpage/dialog.ts
View file

@ -1,4 +1,32 @@
type dialogjson=[
"hdiv",...dialogjson[]
]|[
"vdiv",...dialogjson[]
]|[
"img",string,[number,number]|undefined|["fit"]
]|[
"checkbox",string,boolean,(this:HTMLInputElement,e:Event)=>unknown
]|[
"button",string,string,(this:HTMLButtonElement,e:Event)=>unknown
]|[
"mdbox",string,string,(this:HTMLTextAreaElement,e:Event)=>unknown
]|[
"textbox",string,string,(this:HTMLInputElement,e:Event)=>unknown
]|[
"fileupload",string,(this:HTMLInputElement,e:Event)=>unknown
]|[
"text",string
]|[
"title",string
]|[
"radio",string,string[],(this:unknown,e:string)=>unknown,number
]|[
"html",HTMLElement
]|[
"select",string,string[],(this:HTMLSelectElement,e:Event)=>unknown,number
]|[
"tabs",[string,dialogjson][]
]
class Dialog{
layout;
onclose: Function;
@ -17,222 +45,223 @@ class Dialog{
this.html.classList.add("nonimagecenter");
}
}
tohtml(array:any[]){
tohtml(array:dialogjson):HTMLElement{
switch(array[0]){
case"img":
const img=document.createElement("img");
img.src=array[1];
if(array[2]!=undefined){
if(array[2].length==2){
img.width=array[2][0];
img.height=array[2][1];
}else if(array[2][0]=="fit"){
img.classList.add("imgfit");
}
}
return img;
case"hdiv":
const hdiv=document.createElement("table");
const tr=document.createElement("tr");
hdiv.appendChild(tr);
for(const thing of array){
if(thing==="hdiv"){
continue;
}
const td=document.createElement("td");
td.appendChild(this.tohtml(thing));
tr.appendChild(td);
}
return hdiv;
case"vdiv":
const vdiv=document.createElement("table");
for(const thing of array){
if(thing==="vdiv"){
continue;
case"img":
const img=document.createElement("img");
img.src=array[1];
if(array[2]!=undefined){
if(array[2].length===2){
img.width=array[2][0];
img.height=array[2][1];
}else if(array[2][0]==="fit"){
img.classList.add("imgfit");
}
}
return img;
case"hdiv":
const hdiv=document.createElement("table");
const tr=document.createElement("tr");
tr.appendChild(this.tohtml(thing));
vdiv.appendChild(tr);
}
return vdiv;
case"checkbox":
{
const div=document.createElement("div");
const checkbox = document.createElement("input");
div.appendChild(checkbox);
const label=document.createElement("span");
checkbox.checked=array[2];
label.textContent=array[1];
div.appendChild(label);
checkbox.addEventListener("change",array[3]);
checkbox.type = "checkbox";
return div;
}
case"button":
{
const div=document.createElement("div");
const input = document.createElement("button");
hdiv.appendChild(tr);
const label=document.createElement("span");
input.textContent=array[2];
label.textContent=array[1];
div.appendChild(label);
div.appendChild(input);
input.addEventListener("click",array[3]);
return div;
}
case"mdbox":
{
const div=document.createElement("div");
const input=document.createElement("textarea");
input.value=array[2];
const label=document.createElement("span");
label.textContent=array[1];
input.addEventListener("input",array[3]);
div.appendChild(label);
div.appendChild(document.createElement("br"));
div.appendChild(input);
return div;
}
case"textbox":
{
const div=document.createElement("div");
const input=document.createElement("input");
input.value=array[2];
input.type="text";
const label=document.createElement("span");
label.textContent=array[1];
console.log(array[3]);
input.addEventListener("input",array[3]);
div.appendChild(label);
div.appendChild(input);
return div;
}
case"fileupload":
{
const div=document.createElement("div");
const input=document.createElement("input");
input.type="file";
const label=document.createElement("span");
label.textContent=array[1];
div.appendChild(label);
div.appendChild(input);
input.addEventListener("change",array[2]);
console.log(array);
return div;
}
case"text":{
const span =document.createElement("span");
span.textContent=array[1];
return span;
}
case"title":{
const span =document.createElement("span");
span.classList.add("title");
span.textContent=array[1];
return span;
}
case"radio":{
const div=document.createElement("div");
const fieldset=document.createElement("fieldset");
fieldset.addEventListener("change",()=>{
let i=-1;
for(const thing of fieldset.children){
i++;
if(i===0){
for(const thing of array){
if(thing==="hdiv"){
continue;
}
const checkbox = thing.children[0].children[0] as HTMLInputElement;
if(checkbox.checked){
array[3](checkbox.value);
}
const td=document.createElement("td");
td.appendChild(this.tohtml(thing));
tr.appendChild(td);
}
});
const legend=document.createElement("legend");
legend.textContent=array[1];
fieldset.appendChild(legend);
let i=0;
for(const thing of array[2]){
return hdiv;
case"vdiv":
const vdiv=document.createElement("table");
for(const thing of array){
if(thing==="vdiv"){
continue;
}
const tr=document.createElement("tr");
tr.appendChild(this.tohtml(thing));
vdiv.appendChild(tr);
}
return vdiv;
case"checkbox":
{
const div=document.createElement("div");
const checkbox = document.createElement("input");
div.appendChild(checkbox);
const label=document.createElement("span");
checkbox.checked=array[2];
label.textContent=array[1];
div.appendChild(label);
checkbox.addEventListener("change",array[3]);
checkbox.type = "checkbox";
return div;
}
case"button":
{
const div=document.createElement("div");
const input = document.createElement("button");
const label=document.createElement("span");
input.textContent=array[2];
label.textContent=array[1];
div.appendChild(label);
div.appendChild(input);
input.addEventListener("click",array[3]);
return div;
}
case"mdbox":
{
const div=document.createElement("div");
const input=document.createElement("textarea");
input.value=array[2];
const label=document.createElement("span");
label.textContent=array[1];
input.addEventListener("input",array[3]);
div.appendChild(label);
div.appendChild(document.createElement("br"));
div.appendChild(input);
return div;
}
case"textbox":
{
const div=document.createElement("div");
const input=document.createElement("input");
input.classList.add("radio");
input.type="radio";
input.name=array[1];
input.value=thing;
if(i===array[4]){
input.checked=true;
}
const label=document.createElement("label");
label.appendChild(input);
const span=document.createElement("span");
span.textContent=thing;
label.appendChild(span);
input.value=array[2];
input.type="text";
const label=document.createElement("span");
label.textContent=array[1];
console.log(array[3]);
input.addEventListener("input",array[3]);
div.appendChild(label);
fieldset.appendChild(div);
i++;
div.appendChild(input);
return div;
}
div.appendChild(fieldset);
return div;
}
case"html":
return array[1];
case"select":{
const div=document.createElement("div");
const label=document.createElement("label");
const select=document.createElement("select");
label.textContent=array[1];
div.append(label);
div.appendChild(select);
for(const thing of array[2]){
const option = document.createElement("option");
option.textContent=thing;
select.appendChild(option);
case"fileupload":
{
const div=document.createElement("div");
const input=document.createElement("input");
input.type="file";
const label=document.createElement("span");
label.textContent=array[1];
div.appendChild(label);
div.appendChild(input);
input.addEventListener("change",array[2]);
console.log(array);
return div;
}
select.selectedIndex=array[4];
select.addEventListener("change",array[3]);
return div;
}
case"tabs":{
const table=document.createElement("table");
const tabs=document.createElement("tr");
tabs.classList.add("tabbed-head");
table.appendChild(tabs);
const td=document.createElement("td");
tabs.appendChild(td);
const content=document.createElement("tr");
content.classList.add("tabbed-content");
table.appendChild(content);
let shown;
for(const thing of array[1]){
const button=document.createElement("button");
button.textContent=thing[0];
td.appendChild(button);
const tdcontent=document.createElement("td");
tdcontent.colSpan=array[1].length;
tdcontent.appendChild(this.tohtml(thing[1]));
content.appendChild(tdcontent);
if(!shown){
shown=tdcontent;
}else{
tdcontent.hidden=true;
}
button.addEventListener("click",_=>{
shown.hidden=true;
tdcontent.hidden=false;
shown=tdcontent;
case"text":{
const span =document.createElement("span");
span.textContent=array[1];
return span;
}
case"title":{
const span =document.createElement("span");
span.classList.add("title");
span.textContent=array[1];
return span;
}
case"radio":{
const div=document.createElement("div");
const fieldset=document.createElement("fieldset");
fieldset.addEventListener("change",()=>{
let i=-1;
for(const thing of fieldset.children){
i++;
if(i===0){
continue;
}
const checkbox = thing.children[0].children[0] as HTMLInputElement;
if(checkbox.checked){
array[3](checkbox.value);
}
}
});
const legend=document.createElement("legend");
legend.textContent=array[1];
fieldset.appendChild(legend);
let i=0;
for(const thing of array[2]){
const div=document.createElement("div");
const input=document.createElement("input");
input.classList.add("radio");
input.type="radio";
input.name=array[1];
input.value=thing;
if(i===array[4]){
input.checked=true;
}
const label=document.createElement("label");
label.appendChild(input);
const span=document.createElement("span");
span.textContent=thing;
label.appendChild(span);
div.appendChild(label);
fieldset.appendChild(div);
i++;
}
div.appendChild(fieldset);
return div;
}
return table;
}
default:
console.error("can't find element:"+array[0]," full element:",array);
case"html":
return array[1];
case"select":{
const div=document.createElement("div");
const label=document.createElement("label");
const select=document.createElement("select");
label.textContent=array[1];
div.append(label);
div.appendChild(select);
for(const thing of array[2]){
const option = document.createElement("option");
option.textContent=thing;
select.appendChild(option);
}
select.selectedIndex=array[4];
select.addEventListener("change",array[3]);
return div;
}
case"tabs":{
const table=document.createElement("table");
const tabs=document.createElement("tr");
tabs.classList.add("tabbed-head");
table.appendChild(tabs);
const td=document.createElement("td");
tabs.appendChild(td);
const content=document.createElement("tr");
content.classList.add("tabbed-content");
table.appendChild(content);
let shown;
for(const thing of array[1]){
const button=document.createElement("button");
button.textContent=thing[0];
td.appendChild(button);
const tdcontent=document.createElement("td");
tdcontent.colSpan=array[1].length;
tdcontent.appendChild(this.tohtml(thing[1]));
content.appendChild(tdcontent);
if(!shown){
shown=tdcontent;
}else{
tdcontent.hidden=true;
}
button.addEventListener("click",_=>{
shown.hidden=true;
tdcontent.hidden=false;
shown=tdcontent;
});
}
return table;
}
default:
console.error("can't find element:"+array[0]," full element:",array);
return document.createElement("span");
}
}
show(){