fixing up the dialog class with other bug fixes
This commit is contained in:
parent
b57988e734
commit
8e87635209
9 changed files with 55 additions and 66 deletions
|
@ -32,27 +32,23 @@ class Dialog {
|
||||||
}
|
}
|
||||||
return img;
|
return img;
|
||||||
case "hdiv":
|
case "hdiv":
|
||||||
const hdiv = document.createElement("table");
|
const hdiv = document.createElement("div");
|
||||||
const tr = document.createElement("tr");
|
hdiv.classList.add("flexltr");
|
||||||
hdiv.appendChild(tr);
|
|
||||||
for (const thing of array) {
|
for (const thing of array) {
|
||||||
if (thing === "hdiv") {
|
if (thing === "hdiv") {
|
||||||
continue;
|
continue;
|
||||||
}
|
}
|
||||||
const td = document.createElement("td");
|
hdiv.appendChild(this.tohtml(thing));
|
||||||
td.appendChild(this.tohtml(thing));
|
|
||||||
tr.appendChild(td);
|
|
||||||
}
|
}
|
||||||
return hdiv;
|
return hdiv;
|
||||||
case "vdiv":
|
case "vdiv":
|
||||||
const vdiv = document.createElement("table");
|
const vdiv = document.createElement("div");
|
||||||
|
vdiv.classList.add("flexttb");
|
||||||
for (const thing of array) {
|
for (const thing of array) {
|
||||||
if (thing === "vdiv") {
|
if (thing === "vdiv") {
|
||||||
continue;
|
continue;
|
||||||
}
|
}
|
||||||
const tr = document.createElement("tr");
|
vdiv.appendChild(this.tohtml(thing));
|
||||||
tr.appendChild(this.tohtml(thing));
|
|
||||||
vdiv.appendChild(tr);
|
|
||||||
}
|
}
|
||||||
return vdiv;
|
return vdiv;
|
||||||
case "checkbox":
|
case "checkbox":
|
||||||
|
@ -192,34 +188,34 @@ class Dialog {
|
||||||
return div;
|
return div;
|
||||||
}
|
}
|
||||||
case "tabs": {
|
case "tabs": {
|
||||||
const table = document.createElement("table");
|
const table = document.createElement("div");
|
||||||
const tabs = document.createElement("tr");
|
table.classList.add("flexttb");
|
||||||
|
const tabs = document.createElement("div");
|
||||||
|
tabs.classList.add("flexltr");
|
||||||
tabs.classList.add("tabbed-head");
|
tabs.classList.add("tabbed-head");
|
||||||
table.appendChild(tabs);
|
table.appendChild(tabs);
|
||||||
const td = document.createElement("td");
|
const content = document.createElement("div");
|
||||||
tabs.appendChild(td);
|
|
||||||
const content = document.createElement("tr");
|
|
||||||
content.classList.add("tabbed-content");
|
content.classList.add("tabbed-content");
|
||||||
table.appendChild(content);
|
table.appendChild(content);
|
||||||
let shown;
|
let shown;
|
||||||
for (const thing of array[1]) {
|
for (const thing of array[1]) {
|
||||||
const button = document.createElement("button");
|
const button = document.createElement("button");
|
||||||
button.textContent = thing[0];
|
button.textContent = thing[0];
|
||||||
td.appendChild(button);
|
tabs.appendChild(button);
|
||||||
const tdcontent = document.createElement("td");
|
const html = this.tohtml(thing[1]);
|
||||||
tdcontent.colSpan = array[1].length;
|
content.append(html);
|
||||||
tdcontent.appendChild(this.tohtml(thing[1]));
|
|
||||||
content.appendChild(tdcontent);
|
|
||||||
if (!shown) {
|
if (!shown) {
|
||||||
shown = tdcontent;
|
shown = html;
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
tdcontent.hidden = true;
|
html.style.display = "none";
|
||||||
}
|
}
|
||||||
button.addEventListener("click", _ => {
|
button.addEventListener("click", _ => {
|
||||||
shown.hidden = true;
|
if (shown) {
|
||||||
tdcontent.hidden = false;
|
shown.style.display = "none";
|
||||||
shown = tdcontent;
|
}
|
||||||
|
html.style.display = "";
|
||||||
|
shown = html;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
return table;
|
return table;
|
||||||
|
|
|
@ -6,7 +6,6 @@ import { Permissions } from "./permissions.js";
|
||||||
import { SnowFlake } from "./snowflake.js";
|
import { SnowFlake } from "./snowflake.js";
|
||||||
import { Contextmenu } from "./contextmenu.js";
|
import { Contextmenu } from "./contextmenu.js";
|
||||||
class Direct extends Guild {
|
class Direct extends Guild {
|
||||||
channelids;
|
|
||||||
getUnixTime() {
|
getUnixTime() {
|
||||||
throw new Error("Do not call this for Direct, it does not make sense");
|
throw new Error("Do not call this for Direct, it does not make sense");
|
||||||
}
|
}
|
||||||
|
|
|
@ -91,7 +91,7 @@ class InfiniteScroller {
|
||||||
}
|
}
|
||||||
currrunning = false;
|
currrunning = false;
|
||||||
async addedBottom() {
|
async addedBottom() {
|
||||||
this.updatestuff();
|
await this.updatestuff();
|
||||||
const func = this.snapBottom();
|
const func = this.snapBottom();
|
||||||
await this.watchForChange();
|
await this.watchForChange();
|
||||||
func();
|
func();
|
||||||
|
@ -99,7 +99,7 @@ class InfiniteScroller {
|
||||||
snapBottom() {
|
snapBottom() {
|
||||||
const scrollBottom = this.scrollBottom;
|
const scrollBottom = this.scrollBottom;
|
||||||
return () => {
|
return () => {
|
||||||
if (this.div && scrollBottom < 10) {
|
if (this.div && scrollBottom < 4) {
|
||||||
this.div.scrollTop = this.div.scrollHeight + 20;
|
this.div.scrollTop = this.div.scrollHeight + 20;
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
|
@ -1252,8 +1252,7 @@ class Localuser {
|
||||||
this.manageBot(appId);
|
this.manageBot(appId);
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
]
|
]]);
|
||||||
]);
|
|
||||||
appDialog.show();
|
appDialog.show();
|
||||||
}
|
}
|
||||||
async manageBot(appId = "") {
|
async manageBot(appId = "") {
|
||||||
|
@ -1319,8 +1318,7 @@ class Localuser {
|
||||||
botDialog.hide();
|
botDialog.hide();
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
]
|
]]);
|
||||||
]);
|
|
||||||
botDialog.show();
|
botDialog.show();
|
||||||
}
|
}
|
||||||
//---------- resolving members code -----------
|
//---------- resolving members code -----------
|
||||||
|
|
|
@ -28,12 +28,12 @@ type dialogjson=[
|
||||||
"tabs",[string,dialogjson][]
|
"tabs",[string,dialogjson][]
|
||||||
]
|
]
|
||||||
class Dialog{
|
class Dialog{
|
||||||
layout;
|
layout:dialogjson;
|
||||||
onclose: Function;
|
onclose: Function;
|
||||||
onopen: Function;
|
onopen: Function;
|
||||||
html:HTMLDivElement;
|
html:HTMLDivElement;
|
||||||
background: HTMLDivElement;
|
background: HTMLDivElement;
|
||||||
constructor(layout,onclose=_=>{},onopen=_=>{}){
|
constructor(layout:dialogjson,onclose=_=>{},onopen=_=>{}){
|
||||||
this.layout=layout;
|
this.layout=layout;
|
||||||
this.onclose=onclose;
|
this.onclose=onclose;
|
||||||
this.onopen=onopen;
|
this.onopen=onopen;
|
||||||
|
@ -60,28 +60,24 @@ class Dialog{
|
||||||
}
|
}
|
||||||
return img;
|
return img;
|
||||||
case"hdiv":
|
case"hdiv":
|
||||||
const hdiv=document.createElement("table");
|
const hdiv=document.createElement("div");
|
||||||
const tr=document.createElement("tr");
|
hdiv.classList.add("flexltr")
|
||||||
hdiv.appendChild(tr);
|
|
||||||
|
|
||||||
for(const thing of array){
|
for(const thing of array){
|
||||||
if(thing==="hdiv"){
|
if(thing==="hdiv"){
|
||||||
continue;
|
continue;
|
||||||
}
|
}
|
||||||
const td=document.createElement("td");
|
hdiv.appendChild(this.tohtml(thing));
|
||||||
td.appendChild(this.tohtml(thing));
|
|
||||||
tr.appendChild(td);
|
|
||||||
}
|
}
|
||||||
return hdiv;
|
return hdiv;
|
||||||
case"vdiv":
|
case"vdiv":
|
||||||
const vdiv=document.createElement("table");
|
const vdiv=document.createElement("div");
|
||||||
|
vdiv.classList.add("flexttb");
|
||||||
for(const thing of array){
|
for(const thing of array){
|
||||||
if(thing==="vdiv"){
|
if(thing==="vdiv"){
|
||||||
continue;
|
continue;
|
||||||
}
|
}
|
||||||
const tr=document.createElement("tr");
|
vdiv.appendChild(this.tohtml(thing));
|
||||||
tr.appendChild(this.tohtml(thing));
|
|
||||||
vdiv.appendChild(tr);
|
|
||||||
}
|
}
|
||||||
return vdiv;
|
return vdiv;
|
||||||
case"checkbox":
|
case"checkbox":
|
||||||
|
@ -225,36 +221,35 @@ class Dialog{
|
||||||
return div;
|
return div;
|
||||||
}
|
}
|
||||||
case"tabs":{
|
case"tabs":{
|
||||||
const table=document.createElement("table");
|
const table=document.createElement("div");
|
||||||
const tabs=document.createElement("tr");
|
table.classList.add("flexttb");
|
||||||
|
const tabs=document.createElement("div");
|
||||||
|
tabs.classList.add("flexltr")
|
||||||
tabs.classList.add("tabbed-head");
|
tabs.classList.add("tabbed-head");
|
||||||
table.appendChild(tabs);
|
table.appendChild(tabs);
|
||||||
const td=document.createElement("td");
|
const content=document.createElement("div");
|
||||||
tabs.appendChild(td);
|
|
||||||
const content=document.createElement("tr");
|
|
||||||
content.classList.add("tabbed-content");
|
content.classList.add("tabbed-content");
|
||||||
table.appendChild(content);
|
table.appendChild(content);
|
||||||
|
|
||||||
let shown;
|
let shown:HTMLElement|undefined;
|
||||||
for(const thing of array[1]){
|
for(const thing of array[1]){
|
||||||
const button=document.createElement("button");
|
const button=document.createElement("button");
|
||||||
button.textContent=thing[0];
|
button.textContent=thing[0];
|
||||||
td.appendChild(button);
|
tabs.appendChild(button);
|
||||||
|
|
||||||
|
const html=this.tohtml(thing[1]);
|
||||||
const tdcontent=document.createElement("td");
|
content.append(html);
|
||||||
tdcontent.colSpan=array[1].length;
|
|
||||||
tdcontent.appendChild(this.tohtml(thing[1]));
|
|
||||||
content.appendChild(tdcontent);
|
|
||||||
if(!shown){
|
if(!shown){
|
||||||
shown=tdcontent;
|
shown=html;
|
||||||
}else{
|
}else{
|
||||||
tdcontent.hidden=true;
|
html.style.display="none";
|
||||||
}
|
}
|
||||||
button.addEventListener("click",_=>{
|
button.addEventListener("click",_=>{
|
||||||
shown.hidden=true;
|
if(shown){
|
||||||
tdcontent.hidden=false;
|
shown.style.display="none";
|
||||||
shown=tdcontent;
|
}
|
||||||
|
html.style.display="";
|
||||||
|
shown=html;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
return table;
|
return table;
|
||||||
|
|
|
@ -9,7 +9,7 @@ import { SnowFlake } from "./snowflake.js";
|
||||||
import { Contextmenu } from "./contextmenu.js";
|
import { Contextmenu } from "./contextmenu.js";
|
||||||
|
|
||||||
class Direct extends Guild{
|
class Direct extends Guild{
|
||||||
channelids:{[key:string]:Group};
|
declare channelids:{[key:string]:Group};
|
||||||
getUnixTime(): number {
|
getUnixTime(): number {
|
||||||
throw new Error("Do not call this for Direct, it does not make sense");
|
throw new Error("Do not call this for Direct, it does not make sense");
|
||||||
}
|
}
|
||||||
|
|
|
@ -92,7 +92,7 @@ class InfiniteScroller{
|
||||||
}
|
}
|
||||||
currrunning:boolean=false;
|
currrunning:boolean=false;
|
||||||
async addedBottom(){
|
async addedBottom(){
|
||||||
this.updatestuff();
|
await this.updatestuff();
|
||||||
const func=this.snapBottom();
|
const func=this.snapBottom();
|
||||||
await this.watchForChange();
|
await this.watchForChange();
|
||||||
func();
|
func();
|
||||||
|
@ -100,7 +100,7 @@ class InfiniteScroller{
|
||||||
snapBottom(){
|
snapBottom(){
|
||||||
const scrollBottom=this.scrollBottom;
|
const scrollBottom=this.scrollBottom;
|
||||||
return()=>{
|
return()=>{
|
||||||
if(this.div&&scrollBottom<10){
|
if(this.div&&scrollBottom<4){
|
||||||
this.div.scrollTop=this.div.scrollHeight+20;
|
this.div.scrollTop=this.div.scrollHeight+20;
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
|
@ -1192,7 +1192,7 @@ class Localuser{
|
||||||
json.icon ? ["img", this.info.cdn+"/app-icons/" + appId + "/" + json.icon + ".png?size=128", [128, 128]] : ["text", "No icon"],
|
json.icon ? ["img", this.info.cdn+"/app-icons/" + appId + "/" + json.icon + ".png?size=128", [128, 128]] : ["text", "No icon"],
|
||||||
["fileupload", "Application icon:", event=>{
|
["fileupload", "Application icon:", event=>{
|
||||||
const reader=new FileReader();
|
const reader=new FileReader();
|
||||||
reader.readAsDataURL(event.target.files[0]);
|
reader.readAsDataURL((event.target as HTMLInputElement).files[0]);
|
||||||
reader.onload=()=>{
|
reader.onload=()=>{
|
||||||
fields.icon=reader.result;
|
fields.icon=reader.result;
|
||||||
};
|
};
|
||||||
|
@ -1280,7 +1280,7 @@ class Localuser{
|
||||||
fields.avatar ? ["img", fields.avatar, [128, 128]] : ["text", "No avatar"],
|
fields.avatar ? ["img", fields.avatar, [128, 128]] : ["text", "No avatar"],
|
||||||
["fileupload", "Bot avatar:", event=>{
|
["fileupload", "Bot avatar:", event=>{
|
||||||
const reader=new FileReader();
|
const reader=new FileReader();
|
||||||
reader.readAsDataURL(event.target.files[0]);
|
reader.readAsDataURL((event.target as HTMLInputElement).files[0]);
|
||||||
reader.onload=()=>{
|
reader.onload=()=>{
|
||||||
fields.avatar=reader.result;
|
fields.avatar=reader.result;
|
||||||
};
|
};
|
||||||
|
|
|
@ -1054,6 +1054,7 @@ span {
|
||||||
}
|
}
|
||||||
.tabbed-head{
|
.tabbed-head{
|
||||||
background: var(--profile-info-bg);
|
background: var(--profile-info-bg);
|
||||||
|
width: 100%;
|
||||||
}
|
}
|
||||||
.tabbed-content td{
|
.tabbed-content td{
|
||||||
/* border-color: var(--textarea-bg); */
|
/* border-color: var(--textarea-bg); */
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue