From 36e85b5fb991e69254636804fd0ab8c9ff83690e Mon Sep 17 00:00:00 2001 From: sD Date: Wed, 1 Apr 2020 22:09:02 +0200 Subject: add logic to load them --- webAO/client.js | 17 ++++++++++++++++- 1 file changed, 16 insertions(+), 1 deletion(-) (limited to 'webAO/client.js') diff --git a/webAO/client.js b/webAO/client.js index fd92e90..6a3b192 100644 --- a/webAO/client.js +++ b/webAO/client.js @@ -14,6 +14,8 @@ import background_arr from "./backgrounds.js"; import evidence_arr from "./evidence.js"; import sfx_arr from "./sounds.js"; +import chatbox_arr from "./styles/chatbox/chatboxes.js"; + import { EventEmitter } from "events"; import { version } from '../package.json'; @@ -515,9 +517,11 @@ class Client extends EventEmitter { let msg_nameplate = args[3]; let msg_blips = "male"; + let char_chatbox = "default"; try { msg_nameplate = this.chars[args[9]].showname; msg_blips = this.chars[args[9]].gender; + char_chatbox = this.chars[args[9]].chat; } catch (e) { //we already set defaults } @@ -526,6 +530,7 @@ class Client extends EventEmitter { deskmod: safe_tags(args[1]).toLowerCase(), preanim: safe_tags(args[2]).toLowerCase(), // get preanim nameplate: msg_nameplate, // TODO: there's a new feature that let's people choose the name that's displayed + chatbox: char_chatbox, name: safe_tags(args[3]), sprite: safe_tags(args[4]).toLowerCase(), content: this.prepChat(args[5]), // Escape HTML tags @@ -652,7 +657,8 @@ class Client extends EventEmitter { name: chargs[0], showname: chargs[0], side: "def", - gender: "male" + gender: "male", + chat: "default" }; cini.options = Object.assign(default_options, cini.options); @@ -667,6 +673,8 @@ class Client extends EventEmitter { showname: safe_tags(cini.options.showname), desc: safe_tags(chargs[1]), gender: safe_tags(cini.options.gender).toLowerCase(), + side: safe_tags(cini.options.side).toLowerCase(), + chat: safe_tags(cini.options.chat).toLowerCase(), evidence: chargs[3], icon: icon, inifile: cini, @@ -1508,6 +1516,7 @@ async changeBackground(position) { const pairSprite = document.getElementById("client_pair_char"); const nameBox = document.getElementById("client_name"); const chatBox = document.getElementById("client_chat"); + const chatbox_theme = document.getElementById("chatbox_theme"); const chatContainerBox = document.getElementById("client_chatcontainer"); const waitingBox = document.getElementById("client_chatwaiting"); const eviBox = document.getElementById("client_evi"); @@ -1622,6 +1631,12 @@ async changeBackground(position) { this.changeBackground(chatmsg.side); + if (chatbox_arr.includes(chatmsg.chatbox)) { + chatbox_theme.href = "styles/chatbox/" + chatmsg.chatbox + ".css"; + } else { + chatbox_theme.href = "styles/chatbox/default.css"; + } + // Flip the character if (this.chatmsg.flip === 1) { charSprite.style.transform = "scaleX(-1)"; -- cgit From 34908dcaef5940ae40c95865e4bf7f875d1d0a6f Mon Sep 17 00:00:00 2001 From: sD Date: Tue, 7 Apr 2020 19:12:32 +0200 Subject: make AA the default chatbox --- webAO/client.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'webAO/client.js') diff --git a/webAO/client.js b/webAO/client.js index c97c136..120936d 100644 --- a/webAO/client.js +++ b/webAO/client.js @@ -672,7 +672,7 @@ class Client extends EventEmitter { showname: chargs[0], side: "def", gender: "male", - chat: "default" + chat: "aa" }; cini.options = Object.assign(default_options, cini.options); @@ -1654,7 +1654,7 @@ async changeBackground(position) { if (chatbox_arr.includes(chatmsg.chatbox)) { chatbox_theme.href = "styles/chatbox/" + chatmsg.chatbox + ".css"; } else { - chatbox_theme.href = "styles/chatbox/default.css"; + chatbox_theme.href = "styles/chatbox/aa.css"; } // Flip the character -- cgit From 40b05d6a8d49aa31379d4f9ad1426d54ce0d8062 Mon Sep 17 00:00:00 2001 From: sD Date: Wed, 8 Apr 2020 13:49:20 +0200 Subject: hide chatcontainer instead of chatbox and namebox + base the font size on the background, not itself --- webAO/client.js | 20 ++++++-------------- 1 file changed, 6 insertions(+), 14 deletions(-) (limited to 'webAO/client.js') diff --git a/webAO/client.js b/webAO/client.js index 120936d..121b5fc 100644 --- a/webAO/client.js +++ b/webAO/client.js @@ -1555,7 +1555,6 @@ async changeBackground(position) { const chatContainerBox = document.getElementById("client_chatcontainer"); const nameBox = document.getElementById("client_name"); - const chatBox = document.getElementById("client_chat"); const chatBoxInner = document.getElementById("client_inner_chat"); //Clear out the last message @@ -1598,8 +1597,6 @@ async changeBackground(position) { const shout = this.shouts[this.chatmsg.objection]; if (shout) { // Hide message box - nameBox.style.display = "none"; - chatBox.style.display = "none"; chatContainerBox.style.display = "none"; shoutSprite.src = client.resources[shout]["src"]; shoutSprite.style.display = "block"; @@ -1631,8 +1628,6 @@ async changeBackground(position) { case 1: // play preanim // Hide message box - nameBox.style.display = "none"; - chatBox.style.display = "none"; chatContainerBox.style.display = "none"; // If preanim existed then determine the length gifLength = await this.getAnimLength(`${AO_HOST}characters/${encodeURI(this.chatmsg.name.toLowerCase())}/${encodeURI(this.chatmsg.preanim)}.gif`); @@ -1720,8 +1715,7 @@ async changeBackground(position) { this.updater = setTimeout(() => this.tick(), UPDATE_INTERVAL); } - const nameBox = document.getElementById("client_name"); - const chatBox = document.getElementById("client_chat"); + const gamewindow = document.getElementById("client_gamewindow"); const waitingBox = document.getElementById("client_chatwaiting"); const charSprite = document.getElementById("client_char"); const pairSprite = document.getElementById("client_pair_char"); @@ -1735,7 +1729,7 @@ async changeBackground(position) { if (this.chatmsg.flash === 2) { // Shake screen this.playSFX(AO_HOST + "sounds/general/sfx-stab.wav"); - document.getElementById("client_gamewindow").style.animation = "shake 0.2s 1"; + gamewindow.style.animation = "shake 0.2s 1"; } else if (this.chatmsg.flash === 1) { // Flash screen this.playSFX(AO_HOST + "sounds/general/sfx-realization.wav"); @@ -1788,16 +1782,14 @@ async changeBackground(position) { } } - document.getElementById("client_chatcontainer").style.display = "block"; + const chatContainerBox = document.getElementById("client_chatcontainer"); + const gameHeight = document.getElementById("client_background").offsetHeight; + chatContainerBox.style.display = "block"; - nameBox.style.display = "block"; - nameBox.style.fontSize = (nameBox.offsetHeight * 0.7) + "px"; + chatContainerBox.style.fontSize = (gameHeight * 0.05) + "px"; chatBoxInner.className = "text_" + this.colors[this.chatmsg.color]; - chatBox.style.display = "block"; - chatBox.style.fontSize = (chatBox.offsetHeight * 0.25) + "px"; - this.chatmsg.startspeaking = false; if (this.chatmsg.preanimdelay === 0) { -- cgit From 5b114b21f805b3e1246f70402924a98b90181685 Mon Sep 17 00:00:00 2001 From: sD Date: Sat, 11 Apr 2020 16:15:55 +0200 Subject: give the name tag an inner p --- webAO/client.js | 21 ++++++++++++++++----- 1 file changed, 16 insertions(+), 5 deletions(-) (limited to 'webAO/client.js') diff --git a/webAO/client.js b/webAO/client.js index 121b5fc..0e86aaf 100644 --- a/webAO/client.js +++ b/webAO/client.js @@ -1554,12 +1554,12 @@ async changeBackground(position) { const pairSprite = document.getElementById("client_pair_char"); const chatContainerBox = document.getElementById("client_chatcontainer"); - const nameBox = document.getElementById("client_name"); + const nameBoxInner = document.getElementById("client_inner_name"); const chatBoxInner = document.getElementById("client_inner_chat"); //Clear out the last message chatBoxInner.innerText = this.textnow; - nameBox.innerText = this.chatmsg.nameplate; + nameBoxInner.innerText = this.chatmsg.nameplate; if (this.lastChar !== this.chatmsg.name) { charSprite.style.display = "none"; @@ -1651,6 +1651,7 @@ async changeBackground(position) { } else { chatbox_theme.href = "styles/chatbox/aa.css"; } + resizeChatbox(); // Flip the character if (this.chatmsg.flip === 1) { @@ -1782,12 +1783,11 @@ async changeBackground(position) { } } + resizeChatbox(); + const chatContainerBox = document.getElementById("client_chatcontainer"); - const gameHeight = document.getElementById("client_background").offsetHeight; chatContainerBox.style.display = "block"; - chatContainerBox.style.fontSize = (gameHeight * 0.05) + "px"; - chatBoxInner.className = "text_" + this.colors[this.chatmsg.color]; this.chatmsg.startspeaking = false; @@ -2422,6 +2422,17 @@ export function getIndexFromSelect(select_box, value) { } window.getIndexFromSelect = getIndexFromSelect; +/** + * Set the font size for the chatbox + */ +export function resizeChatbox() { + const chatContainerBox = document.getElementById("client_chatcontainer"); + const gameHeight = document.getElementById("client_background").offsetHeight; + + chatContainerBox.style.fontSize = (gameHeight * 0.05) + "px"; +} +window.resizeChatbox = resizeChatbox; + /** * Update evidence icon. */ -- cgit From cc95e7d8393e6862b571e6c83c713a3284a6f895 Mon Sep 17 00:00:00 2001 From: sD Date: Sat, 18 Apr 2020 15:32:07 +0200 Subject: let the users pin the box to 1 style if they want --- webAO/client.js | 21 +++++++++++++++------ 1 file changed, 15 insertions(+), 6 deletions(-) (limited to 'webAO/client.js') diff --git a/webAO/client.js b/webAO/client.js index c44ed74..dace52b 100644 --- a/webAO/client.js +++ b/webAO/client.js @@ -1641,12 +1641,7 @@ async changeBackground(position) { this.changeBackground(chatmsg.side); - const chatbox_theme = document.getElementById("chatbox_theme"); - if (chatbox_arr.includes(chatmsg.chatbox)) { - chatbox_theme.href = "styles/chatbox/" + chatmsg.chatbox + ".css"; - } else { - chatbox_theme.href = "styles/chatbox/aa.css"; - } + setChatbox(chatmsg.chatbox); resizeChatbox(); // Flip the character @@ -2438,6 +2433,20 @@ export function getIndexFromSelect(select_box, value) { } window.getIndexFromSelect = getIndexFromSelect; +export function setChatbox(style) { + const chatbox_theme = document.getElementById("chatbox_theme"); + const selected_theme = document.getElementById("client_chatboxselect").value; + if(selected_theme === "dynamic") { + if (chatbox_arr.includes(style)) { + chatbox_theme.href = "styles/chatbox/" + style + ".css"; + } else { + chatbox_theme.href = "styles/chatbox/aa.css"; + } + } else { + chatbox_theme.href = "styles/chatbox/" + selected_theme + ".css"; + } +} + /** * Set the font size for the chatbox */ -- cgit From 7807d85ab18edadba33de36b324353f51cf51036 Mon Sep 17 00:00:00 2001 From: sD Date: Sat, 18 Apr 2020 16:04:27 +0200 Subject: load chatbox from cookie --- webAO/client.js | 6 ++++++ 1 file changed, 6 insertions(+) (limited to 'webAO/client.js') diff --git a/webAO/client.js b/webAO/client.js index dace52b..9d35c4d 100644 --- a/webAO/client.js +++ b/webAO/client.js @@ -395,6 +395,11 @@ class Client extends EventEmitter { document.querySelector('#client_themeselect [value="' + cookietheme + '"]').selected = true; reloadTheme(); + var cookiechatbox = getCookie("chatbox") || "dynamic"; + + document.querySelector('#client_chatboxselect [value="' + cookiechatbox + '"]').selected = true; + setChatbox(cookiechatbox); + document.getElementById("client_musicaudio").volume = getCookie("musicVolume") || 1; changeMusicVolume(); document.getElementById("client_svolume").value = getCookie("sfxVolume") || 1; @@ -2436,6 +2441,7 @@ window.getIndexFromSelect = getIndexFromSelect; export function setChatbox(style) { const chatbox_theme = document.getElementById("chatbox_theme"); const selected_theme = document.getElementById("client_chatboxselect").value; + setCookie("chatbox", selected_theme); if(selected_theme === "dynamic") { if (chatbox_arr.includes(style)) { chatbox_theme.href = "styles/chatbox/" + style + ".css"; -- cgit From 786949e40f004b98b8006ab43f34da9f3bf98f54 Mon Sep 17 00:00:00 2001 From: sD Date: Sat, 18 Apr 2020 16:08:21 +0200 Subject: export the function --- webAO/client.js | 4 ++++ 1 file changed, 4 insertions(+) (limited to 'webAO/client.js') diff --git a/webAO/client.js b/webAO/client.js index 9d35c4d..9392f2c 100644 --- a/webAO/client.js +++ b/webAO/client.js @@ -2438,6 +2438,9 @@ export function getIndexFromSelect(select_box, value) { } window.getIndexFromSelect = getIndexFromSelect; +/** + * Set the style of the chatbox + */ export function setChatbox(style) { const chatbox_theme = document.getElementById("chatbox_theme"); const selected_theme = document.getElementById("client_chatboxselect").value; @@ -2452,6 +2455,7 @@ export function setChatbox(style) { chatbox_theme.href = "styles/chatbox/" + selected_theme + ".css"; } } +window.setChatbox = setChatbox; /** * Set the font size for the chatbox -- cgit