aboutsummaryrefslogtreecommitdiff
path: root/webAO/client.js
diff options
context:
space:
mode:
Diffstat (limited to 'webAO/client.js')
-rw-r--r--webAO/client.js73
1 files changed, 55 insertions, 18 deletions
diff --git a/webAO/client.js b/webAO/client.js
index b5c8c2f..54458e5 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';
@@ -393,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;
@@ -502,12 +509,14 @@ class Client extends EventEmitter {
let msg_nameplate = args[3];
let msg_blips = "male";
+ let char_chatbox = "default";
let char_muted = false;
try {
msg_nameplate = this.chars[char_id].showname;
msg_blips = this.chars[char_id].gender;
- char_muted = this.chars[char_id].muted;
+ char_chatbox = this.chars[char_id].chat;
+ char_muted = this.chars[char_id].muted;
if(this.chars[char_id].name !== char_name) {
console.info(this.chars[char_id].name + " is iniediting to " + char_name);
@@ -527,6 +536,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: char_name,
sprite: safe_tags(args[4]).toLowerCase(),
content: prepChat(args[5]), // Escape HTML tags
@@ -664,7 +674,8 @@ class Client extends EventEmitter {
name: chargs[0],
showname: chargs[0],
side: "def",
- gender: "male"
+ gender: "male",
+ chat: "aa"
};
cini.options = Object.assign(default_options, cini.options);
@@ -679,6 +690,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,
@@ -1542,13 +1555,12 @@ async changeBackground(position) {
const pairSprite = document.getElementById("client_pair_char");
const chatContainerBox = document.getElementById("client_chatcontainer");
- const nameBox = document.getElementById("client_name");
- const chatBox = document.getElementById("client_chat");
+ 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";
@@ -1586,8 +1598,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";
@@ -1619,8 +1629,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`);
@@ -1638,6 +1646,9 @@ async changeBackground(position) {
this.changeBackground(chatmsg.side);
+ setChatbox(chatmsg.chatbox);
+ resizeChatbox();
+
// Flip the character
if (this.chatmsg.flip === 1) {
charSprite.style.transform = "scaleX(-1)";
@@ -1701,8 +1712,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");
@@ -1716,7 +1726,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");
@@ -1769,16 +1779,13 @@ async changeBackground(position) {
}
}
- document.getElementById("client_chatcontainer").style.display = "block";
+ resizeChatbox();
- nameBox.style.display = "block";
- nameBox.style.fontSize = (nameBox.offsetHeight * 0.7) + "px";
+ const chatContainerBox = document.getElementById("client_chatcontainer");
+ chatContainerBox.style.display = "block";
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) {
@@ -2450,6 +2457,36 @@ 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;
+ setCookie("chatbox", selected_theme);
+ 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";
+ }
+}
+window.setChatbox = setChatbox;
+
+/**
+ * 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.
*/
export function updateEvidenceIcon() {