~starkingdoms/starkingdoms

ref: 87bcad92e90499a6b79397394d13076ada549abd starkingdoms/starkingdoms-client/src/chat.ts -rw-r--r-- 2.2 KiB
87bcad92TerraMaster85 Substantially nicer chat box 1 year, 11 months ago
                                                                                
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
export function addMessage(classname: string, message: string) {
  let chatbox = document.getElementById("chatbox");
  let should_scroll =
    chatbox!.scrollTop == chatbox!.scrollHeight - chatbox!.offsetHeight;
  let p = document.createElement("p");
  p.innerText = message;
  p.classList.add("message");
  p.classList.add(classname);
  if (chatbox.children.length > 128) {
    chatbox.children[0]!.remove();
  }
  chatbox!.appendChild(p);
  if (should_scroll) {
    chatbox!.scrollTop = chatbox!.scrollHeight;
  }
}

/* I'm sorry for this code lmao */
export function chatViewToggle() {
  let el = document.getElementById("chat-minimax");
  let chat_modal = document.getElementById("chat");
  console.log("clickl");
  let to_hide = [
    document.getElementById("chatbox"),
    document.getElementById("chatentry"),
  ];
  if (el.hasAttribute("minimised")) {
    chat_modal.style.width = "";
    chat_modal.style.paddingRight = "";
    for (let element of to_hide) {
      element.style.display = "";
    }
  } else {
    chat_modal.style.width = "unset";
    chat_modal.style.paddingRight = "4em"; /* magical number. don't touch >:( */
    for (let element of to_hide) {
      element.style.display = "none";
    }
  }

  /* inject that live svg hell yeah */
  if (el.hasAttribute("minimised")) {
    el.removeAttribute("minimised");
    el.innerHTML = `<svg height=16 style=position:absolute;top:7px;left:7px version=1.1 viewBox="0 0 4.2333332 0.52916663"width=16 xmlns=http://www.w3.org/2000/svg xmlns:svg=http://www.w3.org/2000/svg><defs id=defs1></defs><g id=layer1 transform=translate(0,-1.8520833)><rect height=0.52916664 id=rect1 style=fill:#f9f9f9;stroke-width:0 width=4.2333331 x=0 y=1.8520833></rect></g></svg>`;
  } else {
    el.setAttribute("minimised", "");
    el.innerHTML = `<svg height=16 width=16 style=position:absolute;top:7px;left:7px version=1.1 viewBox="0 0 4.2333332 4.233333"width=16 xmlns=http://www.w3.org/2000/svg xmlns:svg=http://www.w3.org/2000/svg><defs id=defs1 /><g id=layer1><rect height=0.52916664 id=rect1 style=fill:#f9f9f9;stroke-width:0 width=4.2333331 x=0 y=1.8520833 /><rect height=0.52916664 id=rect1-5 style=fill:#f9f9f9;stroke-width:0 width=4.2333331 x=-4.2333331 y=1.8520833 transform=rotate(-90) /></g></svg>`;
  }
}