jank-client-fork/webpage/index.ts

import { Localuser } from "./localuser.js";
import {Contextmenu} from "./contextmenu.js";
import {mobile, getBulkUsers,setTheme, Specialuser} from "./login.js";
import { MarkDown } from "./markdown.js";
import { Message } from "./message.js";
import { File } from "./file.js";
(async()=>{
    async function waitforload(){
        let res;
        new Promise(r=>{res=r});
        document.addEventListener("DOMContentLoaded", function(){
            res();
        });
        await res;
    }
    await waitforload();



    const users=getBulkUsers();
    if(!users.currentuser){
        window.location.href = '/login.html';
    }


    function showAccountSwitcher(){
        const table=document.createElement("div");
        for(const thing of Object.values(users.users)){
            const specialuser=thing as Specialuser;
            console.log(specialuser.pfpsrc)

            const userinfo=document.createElement("div");
            userinfo.classList.add("flexltr","switchtable");
            const pfp=document.createElement("img");
            userinfo.append(pfp);

            const user=document.createElement("div");
            userinfo.append(user);
            user.append(specialuser.username);
            user.append(document.createElement("br"));
            const span=document.createElement("span");
            span.textContent=specialuser.serverurls.wellknown.replace("https://","").replace("http://","");
            user.append(span);
            user.classList.add("userinfo")
            span.classList.add("serverURL")

            pfp.src=specialuser.pfpsrc;
            pfp.classList.add("pfp");
            table.append(userinfo);
            userinfo.addEventListener("click",_=>{
                thisuser.unload();
                thisuser.swapped=true;
                const loading=document.getElementById("loading") as HTMLDivElement;
                loading.classList.remove("doneloading");
                loading.classList.add("loading");
                thisuser=new Localuser(specialuser);
                users["currentuser"]=specialuser.uid;
                localStorage.setItem("userinfos",JSON.stringify(users));
                thisuser.initwebsocket().then(_=>{
                    thisuser.loaduser();
                    thisuser.init();
                    loading.classList.add("doneloading");
                    loading.classList.remove("loading");
                    console.log("done loading")

                });
                userinfo.remove();
            })
        }
        {
            const td=document.createElement("div");
            td.classList.add("switchtable")
            td.append("Switch accounts ⇌");
            td.addEventListener("click",_=>{
                window.location.href="/login.html";
            })
            table.append(td);
        }
        table.classList.add("accountSwitcher");
        if(Contextmenu.currentmenu!=""){
            Contextmenu.currentmenu.remove();
        }
        Contextmenu.currentmenu=table;
        console.log(table);
        document.body.append(table);
    }
    {
        const userinfo=document.getElementById("userinfo") as HTMLDivElement;
        userinfo.addEventListener("click",_=>{
            _.stopImmediatePropagation();
            showAccountSwitcher();
        })
        const switchaccounts=document.getElementById("switchaccounts") as HTMLDivElement;
        switchaccounts.addEventListener("click",_=>{
            _.stopImmediatePropagation();
            showAccountSwitcher();
        })
            console.log("this ran")
    }
    let thisuser:Localuser;
    try{
        console.log(users.users,users.currentuser)
        thisuser=new Localuser(users.users[users.currentuser]);
        thisuser.initwebsocket().then(_=>{
            thisuser.loaduser();
            thisuser.init();
            const loading=document.getElementById("loading") as HTMLDivElement;
            loading.classList.add("doneloading");
            loading.classList.remove("loading");
            console.log("done loading")
        });
    }catch(e){
        console.error(e);
        (document.getElementById("load-desc") as HTMLSpanElement).textContent="Account unable to start";
        thisuser=new Localuser(-1);
    }


    {
        const menu=new Contextmenu("create rightclick");//Really should go into the localuser class, but that's a later thing
        menu.addbutton("Create channel",function(){
            if(thisuser.lookingguild){
                thisuser.lookingguild.createchannels();
            }
        },null,_=>{return thisuser.isAdmin()})

        menu.addbutton("Create category",function(){
            if(thisuser.lookingguild){
                thisuser.lookingguild.createcategory();
            }
        },null,_=>{return thisuser.isAdmin()})
        menu.bindContextmenu(document.getElementById("channels") as HTMLDivElement,0,0)
    }

    const pasteimage=document.getElementById("pasteimage") as HTMLDivElement;
    let replyingto:Message|null=null;
    async function enter(event){
        const channel=thisuser.channelfocus
        if(!channel||!thisuser.channelfocus) return;
        channel.typingstart();
        if(event.key === "Enter"&&!event.shiftKey){
            event.preventDefault();
            if(channel.editing){
                channel.editing.edit(markdown.rawString);
                channel.editing=null;
            }else{
                replyingto= thisuser.channelfocus.replyingto;
                let replying=replyingto;
                if(replyingto?.div){
                    replyingto.div.classList.remove("replying");
                }
                thisuser.channelfocus.replyingto=null;
                channel.sendMessage(markdown.rawString,{
                    attachments:images,
                    embeds:[],
                    replyingto:replying
                })
                thisuser.channelfocus.makereplybox();
            }
            while(images.length!=0){
                images.pop();
                pasteimage.removeChild(imageshtml.pop() as HTMLElement);
            }
            typebox.innerHTML="";
            return;
        }
    }

    const typebox=document.getElementById("typebox") as HTMLDivElement;
    const markdown=new MarkDown("",thisuser);
    markdown.giveBox(typebox);
    typebox["markdown"]=markdown;
    typebox.addEventListener("keyup",enter);
    typebox.addEventListener("keydown",event=>{
        if(event.key === "Enter"&&!event.shiftKey) event.preventDefault();
    });
    console.log(typebox)
    typebox.onclick=console.log;

    /*
    function getguildinfo(){
        const path=window.location.pathname.split("/");
        const channel=path[3];
        this.ws.send(JSON.stringify({op: 14, d: {guild_id: path[2], channels: {[channel]: [[0, 99]]}}}));
    }
    */

    const images:Blob[]=[];
    const imageshtml:HTMLElement[]=[];



    document.addEventListener('paste', async (e) => {
        if(!e.clipboardData) return;
        Array.from(e.clipboardData.files).forEach(async (f) => {
            const file=File.initFromBlob(f);
            e.preventDefault();
            const html=file.upHTML(images,f);
            pasteimage.appendChild(html);
            images.push(f)
            imageshtml.push(html);
        });
    });

    setTheme();

    function userSettings(){
        thisuser.showusersettings();
    }
    (document.getElementById("settings") as HTMLImageElement).onclick=userSettings;

    if(mobile){
        (document.getElementById("channelw") as HTMLDivElement).onclick=()=>{
            ((document.getElementById("channels") as HTMLDivElement).parentNode as HTMLElement).classList.add("collapse");
            (document.getElementById("servertd") as HTMLDivElement).classList.add("collapse");
            (document.getElementById("servers")  as HTMLDivElement).classList.add("collapse");
        }
        (document.getElementById("mobileback") as HTMLDivElement).textContent="#";
        (document.getElementById("mobileback") as HTMLDivElement).onclick=()=>{
            ((document.getElementById("channels") as HTMLDivElement).parentNode as HTMLElement).classList.remove("collapse");
            (document.getElementById("servertd") as HTMLDivElement).classList.remove("collapse");
            (document.getElementById("servers") as HTMLDivElement).classList.remove("collapse");
        }
    }
})()