From b1591208dc9479b1abc04727072849258e7cc729 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Tue, 29 Mar 2022 19:24:40 +0200 Subject: encodechat was empty, yeet --- webAO/client.ts | 20 ++++++++++---------- webAO/encoding.ts | 8 -------- 2 files changed, 10 insertions(+), 18 deletions(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 8ced37a..993a230 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -8,7 +8,7 @@ import FingerprintJS from '@fingerprintjs/fingerprintjs'; import { EventEmitter } from 'events'; import tryUrls from './utils/tryUrls' import { - escapeChat, encodeChat, prepChat, safeTags, + escapeChat, prepChat, safeTags, } from './encoding'; import mlConfig from './utils/aoml'; // Load some defaults for the background and evidence dropdowns @@ -320,8 +320,8 @@ class Client extends EventEmitter { */ sendOOC(message: string) { setCookie('OOC_name', (document.getElementById('OOC_name')).value); - const oocName = `${escapeChat(encodeChat((document.getElementById('OOC_name')).value))}`; - const oocMessage = `${escapeChat(encodeChat(message))}`; + const oocName = `${escapeChat((document.getElementById('OOC_name')).value)}`; + const oocMessage = `${escapeChat(message)}`; const commands = { '/save_chatlog': this.saveChatlogHandle @@ -400,18 +400,18 @@ class Client extends EventEmitter { other_emote = '##'; other_offset = '#0#0'; } - extra_cccc = `${showname}#${other_charid}${other_emote}#${self_offset}${other_offset}#${Number(noninterrupting_preanim)}#`; + extra_cccc = `${escapeChat(showname)}#${other_charid}${escapeChat(other_emote)}#${self_offset}${other_offset}#${Number(noninterrupting_preanim)}#`; if (extrafeatures.includes('looping_sfx')) { extra_27 = `${Number(looping_sfx)}#${Number(screenshake)}#${frame_screenshake}#${frame_realization}#${frame_sfx}#`; if (extrafeatures.includes('effects')) { - extra_28 = `${Number(additive)}#${effect}#`; + extra_28 = `${Number(additive)}#${escapeChat(effect)}#`; } } } - const serverMessage = `MS#${deskmod}#${preanim}#${name}#${emote}` - + `#${escapeChat(encodeChat(message))}#${side}#${sfx_name}#${emote_modifier}` + const serverMessage = `MS#${escapeChat(deskmod)}#${escapeChat(preanim)}#${escapeChat(name)}#${escapeChat(emote)}` + + `#${escapeChat(message)}#${escapeChat(side)}#${escapeChat(sfx_name)}#${emote_modifier}` + `#${this.charID}#${sfx_delay}#${Number(objection_modifier)}#${Number(evidence)}#${Number(flip)}#${Number(realization)}#${text_color}#${extra_cccc}${extra_27}${extra_28}%`; this.sendServer(serverMessage); @@ -427,7 +427,7 @@ class Client extends EventEmitter { * @param {string} evidence image filename */ sendPE(name: string, desc: string, img: string) { - this.sendServer(`PE#${escapeChat(encodeChat(name))}#${escapeChat(encodeChat(desc))}#${img}#%`); + this.sendServer(`PE#${escapeChat(name)}#${escapeChat(desc)}#${img}#%`); } /** @@ -438,7 +438,7 @@ class Client extends EventEmitter { * @param {string} evidence image filename */ sendEE(id: number, name: string, desc: string, img: string) { - this.sendServer(`EE#${id}#${escapeChat(encodeChat(name))}#${escapeChat(encodeChat(desc))}#${img}#%`); + this.sendServer(`EE#${id}#${escapeChat(name)}#${escapeChat(desc)}#${img}#%`); } /** @@ -2571,7 +2571,7 @@ export function onEnter(event: KeyboardEvent) { const noninterrupting_preanim = Boolean(((document.getElementById('check_nonint')).checked)); const looping_sfx = Boolean(((document.getElementById('check_loopsfx')).checked)); const color = Number((document.getElementById('textcolor')).value); - const showname = (document.getElementById('ic_chat_name')).value; + const showname = escapeChat((document.getElementById('ic_chat_name')).value); const text = (document.getElementById('client_inputbox')).value; const pairchar = (document.getElementById('pair_select')).value; const pairoffset = Number((document.getElementById('pair_offset')).value); diff --git a/webAO/encoding.ts b/webAO/encoding.ts index 1018144..54770d0 100644 --- a/webAO/encoding.ts +++ b/webAO/encoding.ts @@ -37,14 +37,6 @@ export function safeTags(unsafe: string): string { return ''; } -/** - * Encode text on client side. - * @param {string} estring the string to be encoded - */ -export function encodeChat(estring: string): string { - return estring; -} - /** * Decodes text on client side. * @param {string} estring the string to be decoded -- cgit From 64ca5ccad6c93e0c8ac5f892d8a1de46b5fa4ca1 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Tue, 29 Mar 2022 19:25:43 +0200 Subject: delete index.html in masterlist --- webAO/master.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'webAO') diff --git a/webAO/master.ts b/webAO/master.ts index 5c538d4..5a31024 100644 --- a/webAO/master.ts +++ b/webAO/master.ts @@ -132,7 +132,7 @@ function cachedServerlist(response: Response) { } function processServerlist(thelist: { name: string, description: string, ip: string, port: number, ws_port: number, assets: string, online: string }[]) { - const myURL: string = window.location.href.replace('https://','http://'); + const myURL: string = window.location.href.replace('https://','http://').replace('index.html',''); for (let i = 0; i < thelist.length - 1; i++) { const serverEntry: { name: string, description: string, ip: string, port: number, ws_port: number, assets: string, online: string } = thelist[i]; -- cgit From ef11d76ef5300d921711228fa64afebf8f9a3131 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Tue, 5 Apr 2022 23:26:38 +0200 Subject: uncheck sfx after sending one --- webAO/client.ts | 1 + 1 file changed, 1 insertion(+) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 993a230..a993266 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -2637,6 +2637,7 @@ function resetICParams() { document.getElementById('button_shake').className = 'client_button'; (document.getElementById('sendpreanim')).checked = false; + (document.getElementById('sendsfx')).checked = false; if (selectedShout) { document.getElementById(`button_${selectedShout}`).className = 'client_button'; -- cgit From 9a175fa1ea4a2acaf109fcdd532f4663e8b594e5 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Wed, 6 Apr 2022 22:17:15 +0200 Subject: this is not supposed to be escaped --- webAO/client.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index a993266..94083f1 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -400,7 +400,7 @@ class Client extends EventEmitter { other_emote = '##'; other_offset = '#0#0'; } - extra_cccc = `${escapeChat(showname)}#${other_charid}${escapeChat(other_emote)}#${self_offset}${other_offset}#${Number(noninterrupting_preanim)}#`; + extra_cccc = `${escapeChat(showname)}#${other_charid}${other_emote}#${self_offset}${other_offset}#${Number(noninterrupting_preanim)}#`; if (extrafeatures.includes('looping_sfx')) { extra_27 = `${Number(looping_sfx)}#${Number(screenshake)}#${frame_screenshake}#${frame_realization}#${frame_sfx}#`; -- cgit From 3e27e18149f9b89122edb639d9c00c78d270e4cd Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Wed, 6 Apr 2022 23:01:53 +0200 Subject: fix pantilt enabling on old bgs --- webAO/client.ts | 28 ++++++++++++++++------------ 1 file changed, 16 insertions(+), 12 deletions(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 94083f1..10cafcd 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -2796,19 +2796,23 @@ window.iniedit = iniedit; /** * Triggered by the pantilt checkbox */ -export async function switchPanTilt(addcheck: number) { - const background = document.getElementById('client_fullview'); - if (addcheck === 1) { - (document.getElementById('client_pantilt')).checked = true; - document.getElementById('client_court').style.display = ''; - } else if (addcheck === 2) { - (document.getElementById('client_pantilt')).checked = false; - document.getElementById('client_court').style.display = 'none'; - } - if ((document.getElementById('client_pantilt')).checked) { - background.style.transition = '0.5s ease-in-out'; +export async function switchPanTilt() { + const fullview = document.getElementById('client_fullview'); + const fullbg = document.getElementById('client_court'); + const checkbox = document.getElementById('client_pantilt'); + + if (fullbg.src = transparentPng) { + checkbox.checked = false; + fullbg.style.display = 'none'; } else { - background.style.transition = 'none'; + checkbox.checked = true; + fullbg.style.display = ''; + } + + if (checkbox.checked) { + fullview.style.transition = '0.5s ease-in-out'; + } else { + fullview.style.transition = 'none'; } } window.switchPanTilt = switchPanTilt; -- cgit From 945dc093c92dda971cc1d769c36fd6b3eb3a4236 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Wed, 6 Apr 2022 23:05:57 +0200 Subject: text speed chars were swapped --- webAO/client.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 10cafcd..d1a11a3 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -2332,11 +2332,11 @@ class Viewport { const MAX_SLOW_CHATSPEED = 120 for(let i = this.textnow.length; i < this.chatmsg.content.length; i++) { const currentCharacter = this.chatmsg.parsed[i - 1].innerHTML - if (currentCharacter === '{') { + if (currentCharacter === '}') { if (this.chatmsg.speed > 0) { this.chatmsg.speed -= 20 } - } else if(currentCharacter === '}') { + } else if(currentCharacter === '{') { if(this.chatmsg.speed < MAX_SLOW_CHATSPEED) { this.chatmsg.speed += 20 } -- cgit From da5851d4ce782c60c24ff96006fb44d5ea6c6f79 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Sat, 9 Apr 2022 13:16:04 +0200 Subject: define demo at the beginning --- webAO/client.ts | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index d1a11a3..7df9133 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -911,9 +911,9 @@ class Client extends EventEmitter { * @param {Number} charid character ID */ async handleCharacterInfo(chargs: string[], charid: number) { + const img = document.getElementById(`demo_${charid}`); if (chargs[0]) { let cini: any = {}; - const img = document.getElementById(`demo_${charid}`); const getCharIcon = async () => { const extensions = [ '.png', @@ -986,7 +986,6 @@ class Client extends EventEmitter { iniedit_select.add(new Option(safeTags(chargs[0]))); } else { console.warn(`missing charid ${charid}`); - const img = document.getElementById(`demo_${charid}`); img.style.display = 'none'; } } -- cgit From 51c3567bb40016c3910d0c955cafe05ceb9c62d1 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Wed, 4 May 2022 19:32:00 +0200 Subject: do NOT reload the page --- webAO/client.ts | 1 + 1 file changed, 1 insertion(+) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 7df9133..bcb3e35 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -2622,6 +2622,7 @@ export function onEnter(event: KeyboardEvent) { effect, ); } + return false; } window.onEnter = onEnter; -- cgit From ae18b3bfcc33f720941c39427dfdbe7858bab133 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Wed, 4 May 2022 21:56:48 +0200 Subject: stop comically large shownames from moving to the bottom --- webAO/styles/chatbox/aa.css | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) (limited to 'webAO') diff --git a/webAO/styles/chatbox/aa.css b/webAO/styles/chatbox/aa.css index 33428ae..688f199 100644 --- a/webAO/styles/chatbox/aa.css +++ b/webAO/styles/chatbox/aa.css @@ -86,7 +86,6 @@ text-justify: distribute; line-height: 100%; margin: 0; - margin-top: 2.75%; } #client_chat { @@ -139,4 +138,4 @@ 100% { right: 0; } -} \ No newline at end of file +} -- cgit From c01f37ef8e5f5472af9022445eee611706836963 Mon Sep 17 00:00:00 2001 From: AwesomeAim <30537683+AwesomeAim@users.noreply.github.com> Date: Tue, 10 May 2022 04:58:15 -0700 Subject: Reveal the textbox after the preanimation There may be a better fix since I really am unfamiliar with this language and codebase, but this fixed it well enough. --- webAO/client.ts | 2 ++ 1 file changed, 2 insertions(+) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index bcb3e35..bd2407f 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -2517,6 +2517,8 @@ class Viewport { return } } else if (this.textnow !== this.chatmsg.content) { + const chatContainerBox = document.getElementById('client_chatcontainer'); + chatContainerBox.style.opacity = '1'; await this.handleTextTick(charLayers) } } -- cgit From 611fa88bdba12a880cea62678da8b3addffcd462 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Sat, 14 May 2022 16:40:44 +0200 Subject: escape evidence image --- webAO/client.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index bd2407f..12b4197 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -427,7 +427,7 @@ class Client extends EventEmitter { * @param {string} evidence image filename */ sendPE(name: string, desc: string, img: string) { - this.sendServer(`PE#${escapeChat(name)}#${escapeChat(desc)}#${img}#%`); + this.sendServer(`PE#${escapeChat(name)}#${escapeChat(desc)}#${escapeChat(img)}#%`); } /** @@ -438,7 +438,7 @@ class Client extends EventEmitter { * @param {string} evidence image filename */ sendEE(id: number, name: string, desc: string, img: string) { - this.sendServer(`EE#${id}#${escapeChat(name)}#${escapeChat(desc)}#${img}#%`); + this.sendServer(`EE#${id}#${escapeChat(name)}#${escapeChat(desc)}#${escapeChat(img)}#%`); } /** -- cgit From 60cbb85ade595eed6e55430a8120c2d723a29f73 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Sun, 22 May 2022 12:58:21 +0200 Subject: fix female blips --- webAO/client.ts | 34 +++++++++++++++++++++++----------- 1 file changed, 23 insertions(+), 11 deletions(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 12b4197..e9c413f 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -706,21 +706,33 @@ class Client extends EventEmitter { let char_chatbox = 'default'; let char_muted = false; + if (this.chars[char_id].name !== char_name) { + console.info(`${this.chars[char_id].name} is iniediting to ${char_name}`); + const chargs = (`${char_name}&` + 'iniediter').split('&'); + this.handleCharacterInfo(chargs, char_id); + } + + try { + msg_nameplate = this.chars[char_id].showname; + } catch (e) { + msg_nameplate = args[3]; + } + try { - msg_nameplate = this.chars[char_id].showname; msg_blips = this.chars[char_id].blips; - char_chatbox = this.chars[char_id].chat; - char_muted = this.chars[char_id].muted; + } catch (e) { + ; + } - if (this.chars[char_id].name !== char_name) { - console.info(`${this.chars[char_id].name} is iniediting to ${char_name}`); - const chargs = (`${char_name}&` + 'iniediter').split('&'); - this.handleCharacterInfo(chargs, char_id); - } + try { + char_chatbox = this.chars[char_id].chat; } catch (e) { - msg_nameplate = args[3]; - msg_blips = 'male'; char_chatbox = 'default'; + } + + try { + char_muted = this.chars[char_id].muted; + } catch (e) { char_muted = false; console.error("we're still missing some character data"); } @@ -980,7 +992,7 @@ class Client extends EventEmitter { muted: false, }; - if (this.chars[charid].blips === '') { this.chars[charid].blips = this.chars[charid].gender; } + if (this.chars[charid].blips === 'male' && this.chars[charid].gender !== 'male' && this.chars[charid].gender !== '') { this.chars[charid].blips = this.chars[charid].gender; } const iniedit_select = document.getElementById('client_ininame'); iniedit_select.add(new Option(safeTags(chargs[0]))); -- cgit From e1cf45fa8ace00ef400235e09aca418d5094fc57 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Sun, 22 May 2022 13:17:28 +0200 Subject: reversed logic with chatboxes --- webAO/client.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index e9c413f..9821ba0 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -985,7 +985,7 @@ class Client extends EventEmitter { blips: safeTags(cini.options.blips).toLowerCase(), gender: safeTags(cini.options.gender).toLowerCase(), side: safeTags(cini.options.side).toLowerCase(), - chat: (cini.options.chat === '') ? safeTags(cini.options.chat).toLowerCase() : safeTags(cini.options.category).toLowerCase(), + chat: (cini.options.chat === '' ) ? safeTags(cini.options.category).toLowerCase() : safeTags(cini.options.chat).toLowerCase(), evidence: chargs[3], icon: img.src, inifile: cini, -- cgit From a9635bb552d327b6e9c092d643d3857c5c8652ba Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Thu, 16 Jun 2022 14:21:55 +0200 Subject: send -1 for spectator --- webAO/client.ts | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 9821ba0..2163a1d 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -3018,9 +3018,8 @@ export function pickChar(ccharacter: number) { // Spectator document.getElementById('client_waiting').style.display = 'none'; document.getElementById('client_charselect').style.display = 'none'; - } else { - client.sendCharacter(ccharacter); } + client.sendCharacter(ccharacter); } window.pickChar = pickChar; -- cgit From 28aa78ebe7df1f64959d879e7a140ff513fcfa82 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Fri, 17 Jun 2022 18:08:27 +0200 Subject: close connection on cleanup --- webAO/client.ts | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 2163a1d..07a35db 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -634,9 +634,7 @@ class Client extends EventEmitter { cleanup() { clearInterval(this.checkUpdater); - // the connection got rekt, get rid of the old musiclist - this.resetMusicList(); - document.getElementById('client_chartable').innerHTML = ''; + this.serv.close() } /** -- cgit From dfd0adff20c8a27a55d83c188e63fc59dd48a8d9 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Fri, 17 Jun 2022 19:36:18 +0200 Subject: send CC if charid is -1 --- webAO/client.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 07a35db..c668612 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -555,7 +555,9 @@ class Client extends EventEmitter { * @param {number} character the character ID */ sendCharacter(character: number) { - if (this.chars[character].name) { this.sendServer(`CC#${this.playerID}#${character}#web#%`); } + if (this.chars[character].name || character === -1) { + this.sendServer(`CC#${this.playerID}#${character}#web#%`); + } } /** -- cgit From cbac42d800ebc0696c5e37ed70cf89c444990dfd Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Thu, 23 Jun 2022 16:50:58 +0200 Subject: rename say and changeBG to match client --- webAO/client.ts | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index c668612..a739705 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -842,7 +842,7 @@ class Client extends EventEmitter { if (chatmsg.charid === this.charID) { resetICParams(); } - viewport.say(chatmsg); // no await + viewport.handle_ic_speaking(chatmsg); // no await } } } @@ -1410,9 +1410,9 @@ class Client extends EventEmitter { tryUrls(`${bgfolder}prosecutorempty`).then(resp => {(document.getElementById('client_court_pro')).src = resp}); if (this.charID === -1) { - viewport.changeBackground('jud'); + viewport.set_side('jud'); } else { - viewport.changeBackground(this.chars[this.charID].side); + viewport.set_side(this.chars[this.charID].side); } } @@ -1934,7 +1934,7 @@ class Viewport { * Valid positions: `def, pro, hld, hlp, wit, jud, jur, sea` * @param {string} position the position to change into */ - async changeBackground(position: string) { + async set_side(position: string) { const bgfolder = viewport.bgFolder; const view = document.getElementById('client_fullview'); @@ -2135,7 +2135,7 @@ class Viewport { * TODO: the preanim logic, on the other hand, should probably be moved to tick() * @param {object} chatmsg the new chat message */ - async say(chatmsg: any) { + async handle_ic_speaking(chatmsg: any) { this.chatmsg = chatmsg; this.textnow = ''; @@ -2170,7 +2170,7 @@ class Viewport { } this.lastEvi = this.chatmsg.evidence; - const validSides = ['def', 'pro', 'wit']; + const validSides: string[] = ['def', 'pro', 'wit']; // these are for the full view pan, the other positions use 'client_char' if (validSides.includes(this.chatmsg.side)) { charLayers = document.getElementById(`client_${this.chatmsg.side}_char`); pairLayers = document.getElementById(`client_${this.chatmsg.side}_pair_char`); @@ -2226,7 +2226,7 @@ class Viewport { this.chatmsg.startpreanim = true; let gifLength = 0; - if (this.chatmsg.type === 1 && this.chatmsg.preanim !== '-') { + if (this.chatmsg.type === 1 && this.chatmsg.preanim !== '-') { //we have a preanim chatContainerBox.style.opacity = '0'; gifLength = await getAnimLength(`${AO_HOST}characters/${encodeURI(this.chatmsg.name.toLowerCase())}/${encodeURI(this.chatmsg.preanim)}`); this.chatmsg.startspeaking = false; @@ -2236,7 +2236,7 @@ class Viewport { } this.chatmsg.preanimdelay = gifLength; - this.changeBackground(chatmsg.side); + this.set_side(chatmsg.side); setChatbox(chatmsg.chatbox); resizeChatbox(); -- cgit From c4c4299fe5024af9f786ef34be4fa6594b6f4959 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Thu, 23 Jun 2022 17:17:17 +0200 Subject: fix blankposting?? --- webAO/client.ts | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index a739705..e1b9dd1 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -2288,6 +2288,8 @@ class Viewport { fg.src = transparentPng; } + charLayers.style.opacity = '1'; + const soundChecks = ['0', '1', '', undefined]; if (soundChecks.some((check) => this.chatmsg.sound === check)) { this.chatmsg.sound = this.chatmsg.effects[2]; @@ -2423,7 +2425,8 @@ class Viewport { let charLayers = document.getElementById('client_char'); let pairLayers = document.getElementById('client_pair_char'); - if ('def,pro,wit'.includes(this.chatmsg.side)) { + const validSides: string[] = ['def', 'pro', 'wit']; // these are for the full view pan, the other positions use 'client_char' + if (validSides.includes(this.chatmsg.side)) { charLayers = document.getElementById(`client_${this.chatmsg.side}_char`); pairLayers = document.getElementById(`client_${this.chatmsg.side}_pair_char`); } @@ -2456,7 +2459,6 @@ class Viewport { shoutSprite.style.animation = ''; const preanim = this.chatmsg.preanim.toLowerCase(); setEmote(AO_HOST, this, charName, preanim, '', false, this.chatmsg.side); - charLayers.style.opacity = '1'; } if (this.chatmsg.other_name) { @@ -2471,6 +2473,7 @@ class Viewport { this.chatmsg.startpreanim = false; this.chatmsg.startspeaking = true; } + const hasNonInterruptingPreAnim = this.chatmsg.noninterrupting_preanim === 1 if (this.textnow !== this.chatmsg.content && hasNonInterruptingPreAnim) { const chatContainerBox = document.getElementById('client_chatcontainer'); -- cgit From 601631bd4c0ca01e55e40848f755adc264997a26 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Thu, 23 Jun 2022 17:38:24 +0200 Subject: don't show chatbox on blankpost --- webAO/client.ts | 12 ++++++++---- 1 file changed, 8 insertions(+), 4 deletions(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index e1b9dd1..1646ed9 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -2232,7 +2232,8 @@ class Viewport { this.chatmsg.startspeaking = false; } else { this.chatmsg.startspeaking = true; - chatContainerBox.style.opacity = '1'; + if(this.chatmsg.content !== "") + chatContainerBox.style.opacity = '1'; } this.chatmsg.preanimdelay = gifLength; @@ -2295,7 +2296,7 @@ class Viewport { this.chatmsg.sound = this.chatmsg.effects[2]; } this.chatmsg.parsed = await attorneyMarkdown.applyMarkdown(chatmsg.content, this.colors[this.chatmsg.color]) - this.tick(); + this.chat_tick(); } async handleTextTick(charLayers: HTMLImageElement) { @@ -2409,7 +2410,10 @@ class Viewport { * * XXX: This relies on a global variable `this.chatmsg`! */ - async tick() { + async chat_tick() { + // note: this is called fairly often + // do not perform heavy operations here + await delay(this.chatmsg.speed) if (this.textnow === this.chatmsg.content) { @@ -2545,7 +2549,7 @@ class Viewport { } } if (this._animating) { - this.tick() + this.chat_tick() } this.tickTimer += UPDATE_INTERVAL; } -- cgit From 3e8704e509f65bb5896e2efa4d49e8aaa5431799 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Thu, 23 Jun 2022 18:51:56 +0200 Subject: fix sending spectator --- webAO/client.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 1646ed9..54084b7 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -293,6 +293,7 @@ class Client extends EventEmitter { * @param {string} message the message to send */ sendServer(message: string) { + //console.log("C: "+message); mode === 'replay' ? this.sendSelf(message) : this.serv.send(message); } @@ -555,7 +556,8 @@ class Client extends EventEmitter { * @param {number} character the character ID */ sendCharacter(character: number) { - if (this.chars[character].name || character === -1) { + console.log("sending "+character); + if (character === -1 || this.chars[character].name) { this.sendServer(`CC#${this.playerID}#${character}#web#%`); } } -- cgit From 9ac75a06cd792074eaf7b3fbf3a1e5c482be60ac Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Tue, 12 Jul 2022 15:13:30 +0200 Subject: log preanim length --- webAO/client.ts | 1 + 1 file changed, 1 insertion(+) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 54084b7..2af1ab9 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -2231,6 +2231,7 @@ class Viewport { if (this.chatmsg.type === 1 && this.chatmsg.preanim !== '-') { //we have a preanim chatContainerBox.style.opacity = '0'; gifLength = await getAnimLength(`${AO_HOST}characters/${encodeURI(this.chatmsg.name.toLowerCase())}/${encodeURI(this.chatmsg.preanim)}`); + console.debug("preanim is "+gifLength+" long"); this.chatmsg.startspeaking = false; } else { this.chatmsg.startspeaking = true; -- cgit From a46ccf72cef30eccf4cb3f9cdea9c461bb44f8b2 Mon Sep 17 00:00:00 2001 From: Caleb Mabry Date: Fri, 15 Jul 2022 00:44:10 -0400 Subject: Resolving issue with name display and encoding issue --- webAO/client.ts | 9 ++++++--- webAO/utils/__tests__/paths.test.ts | 13 +++++++++++++ webAO/utils/paths.ts | 1 + 3 files changed, 20 insertions(+), 3 deletions(-) create mode 100644 webAO/utils/__tests__/paths.test.ts create mode 100644 webAO/utils/paths.ts (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 2af1ab9..99462cd 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -8,7 +8,7 @@ import FingerprintJS from '@fingerprintjs/fingerprintjs'; import { EventEmitter } from 'events'; import tryUrls from './utils/tryUrls' import { - escapeChat, prepChat, safeTags, + escapeChat, prepChat, safeTags, unescapeChat, } from './encoding'; import mlConfig from './utils/aoml'; // Load some defaults for the background and evidence dropdowns @@ -30,6 +30,7 @@ import getAnimLength from './utils/getAnimLength.js'; import getResources from './utils/getResources.js'; import transparentPng from './constants/transparentPng'; import downloadFile from './services/downloadFile' +import { getFilenameFromPath } from './utils/paths'; const version = process.env.npm_package_version; let client: Client; @@ -1180,7 +1181,9 @@ class Client extends EventEmitter { addTrack(trackname: string) { const newentry = document.createElement('OPTION'); - newentry.text = trackname; + const songName = getFilenameFromPath(trackname); + newentry.text = unescapeChat(songName); + newentry.value = trackname; (document.getElementById('client_musiclist')).options.add(newentry); this.musics.push(trackname); } @@ -1271,7 +1274,7 @@ class Client extends EventEmitter { for (let i = 1; i < args.length - 1; i++) { // Check when found the song for the first time - const trackname = safeTags(args[i]); + const trackname = args[i]; const trackindex = i - 1; document.getElementById('client_loadingtext').innerHTML = `Loading Music ${i}/${this.music_list_length}`; (document.getElementById('client_loadingbar')).value = this.char_list_length + this.evidence_list_length + i; diff --git a/webAO/utils/__tests__/paths.test.ts b/webAO/utils/__tests__/paths.test.ts new file mode 100644 index 0000000..4f41d09 --- /dev/null +++ b/webAO/utils/__tests__/paths.test.ts @@ -0,0 +1,13 @@ +import {getFilenameFromPath} from '../paths' +jest.mock('../fileExists') + +describe('getFilenameFromPath', () => { + const EXAMPLE_PATH = "localhost/stoneddiscord/assets.png" + it('Should get the last value from a path', async () => { + const actual = getFilenameFromPath(EXAMPLE_PATH); + const expected = 'assets.png'; + expect(actual).toBe(expected); + }); +}) + + diff --git a/webAO/utils/paths.ts b/webAO/utils/paths.ts new file mode 100644 index 0000000..f4284b6 --- /dev/null +++ b/webAO/utils/paths.ts @@ -0,0 +1 @@ +export const getFilenameFromPath = (path: string) => path.substring(path.lastIndexOf('/') + 1) -- cgit From b7ddd8990bdd8561e25a9114c389530c4f18b877 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Sat, 16 Jul 2022 13:34:41 +0200 Subject: handle deskmod --- webAO/client.ts | 70 ++++++++++++++++++++++++++++++++++++++++++++------------- 1 file changed, 54 insertions(+), 16 deletions(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 2af1ab9..407d09d 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -1412,9 +1412,9 @@ class Client extends EventEmitter { tryUrls(`${bgfolder}prosecutorempty`).then(resp => {(document.getElementById('client_court_pro')).src = resp}); if (this.charID === -1) { - viewport.set_side('jud'); + viewport.set_side('jud',false,true); } else { - viewport.set_side(this.chars[this.charID].side); + viewport.set_side(this.chars[this.charID].side,false,true); } } @@ -1936,7 +1936,7 @@ class Viewport { * Valid positions: `def, pro, hld, hlp, wit, jud, jur, sea` * @param {string} position the position to change into */ - async set_side(position: string) { + async set_side(position: string, showspeedlines: boolean, showdesk: boolean) { const bgfolder = viewport.bgFolder; const view = document.getElementById('client_fullview'); @@ -2026,21 +2026,18 @@ class Viewport { speedLines = 'defense_speedlines.gif'; } - if (viewport.chatmsg.type === 5) { - console.warn('this is a zoom'); + if (showspeedlines) { court.src = `${AO_HOST}themes/default/${encodeURI(speedLines)}`; - bench.style.opacity = '0'; } else { - // Set src here - court.src = await tryUrls(bgfolder + bg) - if (desk) { - const deskFilename = await fileExists(bgfolder + desk.ao2) ? desk.ao2 : desk.ao1; - bench.src = bgfolder + deskFilename; - bench.style.opacity = '1'; - } else { - bench.style.opacity = '0'; - } + } + + if (showdesk && desk) { + const deskFilename = await fileExists(bgfolder + desk.ao2) ? desk.ao2 : desk.ao1; + bench.src = bgfolder + deskFilename; + bench.style.opacity = '1'; + } else { + bench.style.opacity = '0'; } if ('def,pro,wit'.includes(position)) { @@ -2240,7 +2237,33 @@ class Viewport { } this.chatmsg.preanimdelay = gifLength; - this.set_side(chatmsg.side); + if (chatmsg.type === 5) { + this.set_side(chatmsg.side,true,false); + } else { + switch(chatmsg.deskmod) { + case 0: + this.set_side(chatmsg.side,false,false); + break; + case 1: + this.set_side(chatmsg.side,false,true); + break; + case 2: + this.set_side(chatmsg.side,false,false); + break; + case 3: + this.set_side(chatmsg.side,false,false); + break; + case 4: + this.set_side(chatmsg.side,false,false); + break; + case 5: + this.set_side(chatmsg.side,false,true); + break; + default: + this.set_side(chatmsg.side,false,true); + break; + } + } setChatbox(chatmsg.chatbox); resizeChatbox(); @@ -2520,6 +2543,21 @@ class Viewport { shoutSprite.style.animation = ''; } + switch(this.chatmsg.deskmod) { + case 2: + this.set_side(this.chatmsg.side,false,true); + break; + case 3: + this.set_side(this.chatmsg.side,false,false); + break; + case 4: + this.set_side(this.chatmsg.side,false,true); + break; + case 5: + this.set_side(this.chatmsg.side,false,false); + break; + } + if (this.chatmsg.other_name) { setEmote(AO_HOST, this, pairName, pairEmote, '(a)', true, this.chatmsg.side); pairLayers.style.opacity = '1'; -- cgit From 23da8c8f171e34e1a4aa151ea12c48144f7f07f2 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Sat, 16 Jul 2022 13:43:51 +0200 Subject: finally fix testimony and guilty "bubbles" --- webAO/utils/getResources.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) (limited to 'webAO') diff --git a/webAO/utils/getResources.js b/webAO/utils/getResources.js index a0c513e..859e63b 100644 --- a/webAO/utils/getResources.js +++ b/webAO/utils/getResources.js @@ -16,22 +16,22 @@ const getResources = (AO_HOST, THEME) => ({ duration: 840, }, witnesstestimony: { - src: `${AO_HOST}themes/${THEME}/witnesstestimony.gif`, + src: `${AO_HOST}themes/${THEME}/witnesstestimony_bubble.gif`, duration: 1560, sfx: `${AO_HOST}sounds/general/sfx-testimony.opus`, }, crossexamination: { - src: `${AO_HOST}themes/${THEME}/crossexamination.gif`, + src: `${AO_HOST}themes/${THEME}/crossexamination_bubble.gif`, duration: 1600, sfx: `${AO_HOST}sounds/general/sfx-testimony2.opus`, }, guilty: { - src: `${AO_HOST}themes/${THEME}/guilty.gif`, + src: `${AO_HOST}themes/${THEME}/guilty_bubble.gif`, duration: 2870, sfx: `${AO_HOST}sounds/general/sfx-guilty.opus`, }, notguilty: { - src: `${AO_HOST}themes/${THEME}/notguilty.gif`, + src: `${AO_HOST}themes/${THEME}/notguilty_bubble.gif`, duration: 2440, sfx: `${AO_HOST}sounds/general/sfx-notguilty.opus`, }, -- cgit From b4d6d002509d928bcb1c57aa908059e0d946f18c Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Sat, 16 Jul 2022 13:53:35 +0200 Subject: fix switch case --- webAO/client.ts | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 407d09d..3da1dc8 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -2026,13 +2026,13 @@ class Viewport { speedLines = 'defense_speedlines.gif'; } - if (showspeedlines) { + if (showspeedlines === true) { court.src = `${AO_HOST}themes/default/${encodeURI(speedLines)}`; } else { court.src = await tryUrls(bgfolder + bg) } - if (showdesk && desk) { + if (showdesk === true && desk) { const deskFilename = await fileExists(bgfolder + desk.ao2) ? desk.ao2 : desk.ao1; bench.src = bgfolder + deskFilename; bench.style.opacity = '1'; @@ -2240,7 +2240,7 @@ class Viewport { if (chatmsg.type === 5) { this.set_side(chatmsg.side,true,false); } else { - switch(chatmsg.deskmod) { + switch(Number(chatmsg.deskmod)) { case 0: this.set_side(chatmsg.side,false,false); break; @@ -2543,7 +2543,7 @@ class Viewport { shoutSprite.style.animation = ''; } - switch(this.chatmsg.deskmod) { + switch(Number(this.chatmsg.deskmod)) { case 2: this.set_side(this.chatmsg.side,false,true); break; -- cgit From abcba2ff9b3a884952492364fe6b5fe28a6c617f Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Sat, 16 Jul 2022 13:57:59 +0200 Subject: send deskmod too --- webAO/client.ts | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 3da1dc8..c73f975 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -342,7 +342,7 @@ class Client extends EventEmitter { /** * Sends an in-character chat message. - * @param {string} deskmod currently unused + * @param {string} deskmod controls the desk * @param {string} speaking who is speaking * @param {string} name the name of the current character * @param {string} silent whether or not it's silent @@ -1721,6 +1721,7 @@ class Client extends EventEmitter { preanim: emoteinfo[1].toLowerCase(), emote: emoteinfo[2].toLowerCase(), zoom: Number(emoteinfo[3]) || 0, + deskmod: Number(emoteinfo[4]) || 1, sfx: esfx.toLowerCase(), sfxdelay: esfxd, frame_screenshake: '', @@ -2656,7 +2657,7 @@ export function onEnter(event: KeyboardEvent) { client.sendIC( - 'chat', + myemo.deskmod, myemo.preanim, mychar.name, myemo.emote, -- cgit From f3359b60bde9014e3ee56daa3d4104d61d8ee149 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Sat, 16 Jul 2022 14:00:35 +0200 Subject: deskmod is actually a number --- webAO/client.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 3876011..6c56950 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -343,7 +343,7 @@ class Client extends EventEmitter { /** * Sends an in-character chat message. - * @param {string} deskmod controls the desk + * @param {number} deskmod controls the desk * @param {string} speaking who is speaking * @param {string} name the name of the current character * @param {string} silent whether or not it's silent @@ -363,7 +363,7 @@ class Client extends EventEmitter { * @param {number} noninterrupting_preanim play the full preanim (optional) */ sendIC( - deskmod: string, + deskmod: number, preanim: string, name: string, emote: string, @@ -412,7 +412,7 @@ class Client extends EventEmitter { } } - const serverMessage = `MS#${escapeChat(deskmod)}#${escapeChat(preanim)}#${escapeChat(name)}#${escapeChat(emote)}` + const serverMessage = `MS#${deskmod}#${escapeChat(preanim)}#${escapeChat(name)}#${escapeChat(emote)}` + `#${escapeChat(message)}#${escapeChat(side)}#${escapeChat(sfx_name)}#${emote_modifier}` + `#${this.charID}#${sfx_delay}#${Number(objection_modifier)}#${Number(evidence)}#${Number(flip)}#${Number(realization)}#${text_color}#${extra_cccc}${extra_27}${extra_28}%`; -- cgit From b60b656fceee55f689de2bdb30a86b7fd42e6810 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Sat, 16 Jul 2022 14:39:39 +0200 Subject: something weird was going on with pantilt, creating lag. removed onload --- webAO/client.ts | 13 +++---------- 1 file changed, 3 insertions(+), 10 deletions(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 6c56950..246d496 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -2864,22 +2864,15 @@ window.iniedit = iniedit; */ export async function switchPanTilt() { const fullview = document.getElementById('client_fullview'); - const fullbg = document.getElementById('client_court'); const checkbox = document.getElementById('client_pantilt'); - if (fullbg.src = transparentPng) { - checkbox.checked = false; - fullbg.style.display = 'none'; - } else { - checkbox.checked = true; - fullbg.style.display = ''; - } - if (checkbox.checked) { fullview.style.transition = '0.5s ease-in-out'; } else { fullview.style.transition = 'none'; } + + return } window.switchPanTilt = switchPanTilt; @@ -2887,7 +2880,7 @@ window.switchPanTilt = switchPanTilt; * Triggered by the change aspect ratio checkbox */ export async function switchAspectRatio() { - const background = document.getElementById('client_background'); + const background = document.getElementById('client_gamewindow'); const offsetCheck = document.getElementById('client_hdviewport_offset'); if ((document.getElementById('client_hdviewport')).checked) { background.style.paddingBottom = '56.25%'; -- cgit From f7a94ed001f600994d4dbcd221463e2d77fca59d Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Sat, 16 Jul 2022 15:08:05 +0200 Subject: hopefully fix banned message --- webAO/client.ts | 10 ++++------ 1 file changed, 4 insertions(+), 6 deletions(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 246d496..7696047 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -71,7 +71,7 @@ let selectedMenu = 1; let selectedShout = 0; let extrafeatures: string[] = []; - +let banned: boolean = false; let hdid: string; declare global { @@ -212,8 +212,6 @@ class Client extends EventEmitter { this.callwords = []; - this.banned = false; - this.resources = getResources(AO_HOST, THEME); this.selectedEmote = -1; @@ -591,7 +589,7 @@ class Client extends EventEmitter { */ onClose(e: CloseEvent) { console.error(`The connection was closed: ${e.reason} (${e.code})`); - if (extrafeatures.length == 0 && this.banned === false) { + if (extrafeatures.length == 0 && banned === false) { document.getElementById('client_errortext').textContent = 'Could not connect to the server'; } document.getElementById('client_waiting').style.display = 'block'; @@ -1353,7 +1351,7 @@ class Client extends EventEmitter { */ handleKB(args: string[]) { this.handleBans('Banned', safeTags(args[1])); - this.banned = true; + banned = true; } /** @@ -1372,7 +1370,7 @@ class Client extends EventEmitter { */ handleBD(args: string[]) { this.handleBans('Banned', safeTags(args[1])); - this.banned = true; + banned = true; } /** -- cgit From bde7f84ccc633af051bd84d6c563a9ced3052fe3 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Sat, 16 Jul 2022 15:17:10 +0200 Subject: 4 skips the offset --- webAO/client.ts | 59 ++++++++++++++++++++++++++++++--------------------------- 1 file changed, 31 insertions(+), 28 deletions(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 7696047..db4c776 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -2239,26 +2239,28 @@ class Viewport { } this.chatmsg.preanimdelay = gifLength; + let skipoffset: boolean = false; if (chatmsg.type === 5) { this.set_side(chatmsg.side,true,false); } else { switch(Number(chatmsg.deskmod)) { - case 0: + case 0: //desk is hidden this.set_side(chatmsg.side,false,false); break; - case 1: + case 1: //desk is shown this.set_side(chatmsg.side,false,true); break; - case 2: + case 2: //desk is hidden during preanim, but shown during idle/talk this.set_side(chatmsg.side,false,false); break; - case 3: + case 3: //opposite of 2 this.set_side(chatmsg.side,false,false); break; - case 4: + case 4: //desk is hidden, character offset is ignored, pair character is hidden during preanim, normal behavior during idle/talk this.set_side(chatmsg.side,false,false); + skipoffset = true; break; - case 5: + case 5: //opposite of 4 this.set_side(chatmsg.side,false,true); break; default: @@ -2270,31 +2272,32 @@ class Viewport { setChatbox(chatmsg.chatbox); resizeChatbox(); - // Flip the character - charLayers.style.transform = this.chatmsg.flip === 1 ? 'scaleX(-1)' : 'scaleX(1)'; + if (!skipoffset) { + // Flip the character + charLayers.style.transform = this.chatmsg.flip === 1 ? 'scaleX(-1)' : 'scaleX(1)'; + pairLayers.style.transform = this.chatmsg.other_flip === 1 ? 'scaleX(-1)' : 'scaleX(1)'; - // Shift by the horizontal offset - switch (this.chatmsg.side) { - case 'wit': - pairLayers.style.left = `${200 + Number(this.chatmsg.other_offset[0])}%`; - charLayers.style.left = `${200 + Number(this.chatmsg.self_offset[0])}%`; - break; - case 'pro': - pairLayers.style.left = `${400 + Number(this.chatmsg.other_offset[0])}%`; - charLayers.style.left = `${400 + Number(this.chatmsg.self_offset[0])}%`; - break; - default: - pairLayers.style.left = `${Number(this.chatmsg.other_offset[0])}%`; - charLayers.style.left = `${Number(this.chatmsg.self_offset[0])}%`; - break; - } + // Shift by the horizontal offset + switch (this.chatmsg.side) { + case 'wit': + pairLayers.style.left = `${200 + Number(this.chatmsg.other_offset[0])}%`; + charLayers.style.left = `${200 + Number(this.chatmsg.self_offset[0])}%`; + break; + case 'pro': + pairLayers.style.left = `${400 + Number(this.chatmsg.other_offset[0])}%`; + charLayers.style.left = `${400 + Number(this.chatmsg.self_offset[0])}%`; + break; + default: + pairLayers.style.left = `${Number(this.chatmsg.other_offset[0])}%`; + charLayers.style.left = `${Number(this.chatmsg.self_offset[0])}%`; + break; + } - // New vertical offsets - pairLayers.style.top = `${Number(this.chatmsg.other_offset[1])}%`; - charLayers.style.top = `${Number(this.chatmsg.self_offset[1])}%`; + // New vertical offsets + pairLayers.style.top = `${Number(this.chatmsg.other_offset[1])}%`; + charLayers.style.top = `${Number(this.chatmsg.self_offset[1])}%`; - // flip the paired character - pairLayers.style.transform = this.chatmsg.other_flip === 1 ? 'scaleX(-1)' : 'scaleX(1)'; + } this.blipChannels.forEach((channel: HTMLAudioElement) => channel.src = `${AO_HOST}sounds/general/sfx-blip${encodeURI(this.chatmsg.blips.toLowerCase())}.opus`); -- cgit From 25fe710c3b36b097502a5f3e0afb024312cbf7b9 Mon Sep 17 00:00:00 2001 From: Caleb Mabry <36182383+caleb-mabry@users.noreply.github.com> Date: Sun, 17 Jul 2022 00:56:15 -0400 Subject: Moved viewport out of client --- webAO/client.ts | 2944 +++++++++++++++++++--------------------------- webAO/client/setEmote.js | 40 - webAO/client/setEmote.ts | 51 + webAO/viewport.ts | 1053 +++++++++++++++++ 4 files changed, 2335 insertions(+), 1753 deletions(-) delete mode 100644 webAO/client/setEmote.js create mode 100644 webAO/client/setEmote.ts create mode 100644 webAO/viewport.ts (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index db4c776..64ffab9 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -2,62 +2,63 @@ * Glorious webAO * made by sD, refactored by oldmud0 and Qubrick * credits to aleks for original idea and source -*/ + */ -import FingerprintJS from '@fingerprintjs/fingerprintjs'; -import { EventEmitter } from 'events'; -import tryUrls from './utils/tryUrls' -import { - escapeChat, prepChat, safeTags, unescapeChat, -} from './encoding'; -import mlConfig from './utils/aoml'; +import FingerprintJS from "@fingerprintjs/fingerprintjs"; +import { EventEmitter } from "events"; +import tryUrls from "./utils/tryUrls"; +import { escapeChat, prepChat, safeTags, unescapeChat } from "./encoding"; +import mlConfig from "./utils/aoml"; // Load some defaults for the background and evidence dropdowns -import vanilla_character_arr from './constants/characters.js'; -import vanilla_music_arr from './constants/music.js'; -import vanilla_background_arr from './constants/backgrounds.js'; -import vanilla_evidence_arr from './constants/evidence.js'; - -import chatbox_arr from './styles/chatbox/chatboxes.js'; -import iniParse from './iniParse'; -import getCookie from './utils/getCookie.js'; -import setCookie from './utils/setCookie.js'; -import { request } from './services/request.js'; -import { changeShoutVolume, changeSFXVolume, changeTestimonyVolume } from './dom/changeVolume.js'; -import setEmote from './client/setEmote.js'; -import fileExists from './utils/fileExists.js'; -import queryParser from './utils/queryParser.js'; -import getAnimLength from './utils/getAnimLength.js'; -import getResources from './utils/getResources.js'; -import transparentPng from './constants/transparentPng'; -import downloadFile from './services/downloadFile' -import { getFilenameFromPath } from './utils/paths'; +import vanilla_character_arr from "./constants/characters.js"; +import vanilla_music_arr from "./constants/music.js"; +import vanilla_background_arr from "./constants/backgrounds.js"; +import vanilla_evidence_arr from "./constants/evidence.js"; + +import chatbox_arr from "./styles/chatbox/chatboxes.js"; +import iniParse from "./iniParse"; +import getCookie from "./utils/getCookie.js"; +import setCookie from "./utils/setCookie.js"; +import { request } from "./services/request.js"; +import { + changeShoutVolume, + changeSFXVolume, + changeTestimonyVolume, +} from "./dom/changeVolume.js"; +import setEmote from "./client/setEmote.js"; +import fileExists from "./utils/fileExists.js"; +import queryParser from "./utils/queryParser.js"; +import getAnimLength from "./utils/getAnimLength.js"; +import getResources from "./utils/getResources.js"; +import transparentPng from "./constants/transparentPng"; +import downloadFile from "./services/downloadFile"; +import { getFilenameFromPath } from "./utils/paths"; const version = process.env.npm_package_version; +import masterViewport, { Viewport } from "./viewport"; -let client: Client; -let viewport: Viewport; interface Testimony { - [key: number]: string + [key: number]: string; } // Get the arguments from the URL bar interface QueryParams { - ip: string - serverIP: string - mode: string - asset: string - theme: string + ip: string; + serverIP: string; + mode: string; + asset: string; + theme: string; } -let { - ip: serverIP, mode, asset, theme, -} = queryParser() as QueryParams; +let { ip: serverIP, mode, asset, theme } = queryParser() as QueryParams; // Unless there is an asset URL specified, use the wasabi one -const DEFAULT_HOST = 'http://attorneyoffline.de/base/'; +const DEFAULT_HOST = "http://attorneyoffline.de/base/"; let AO_HOST = asset || DEFAULT_HOST; -const THEME = theme || 'default'; +const THEME = theme || "default"; -const attorneyMarkdown = mlConfig(AO_HOST) +let client: Client; + +const attorneyMarkdown = mlConfig(AO_HOST); -const UPDATE_INTERVAL = 60; +export const UPDATE_INTERVAL = 60; /** * Toggles AO1-style loading using paginated music packets for mobile platforms. @@ -131,7 +132,11 @@ declare global { } function isLowMemory() { - if (/webOS|iPod|BlackBerry|BB|PlayBook|IEMobile|Windows Phone|Kindle|Silk|PlayStation|Nintendo|Opera Mini/i.test(navigator.userAgent)) { + if ( + /webOS|iPod|BlackBerry|BB|PlayBook|IEMobile|Windows Phone|Kindle|Silk|PlayStation|Nintendo|Opera Mini/i.test( + navigator.userAgent + ) + ) { oldLoading = true; } } @@ -141,12 +146,11 @@ fpPromise .then((result) => { hdid = result.visitorId; client = new Client(serverIP); - viewport = new Viewport(); isLowMemory(); client.loadResources(); }); -const delay = (ms: number) => new Promise(res => setTimeout(res, ms)); +export const delay = (ms: number) => new Promise((res) => setTimeout(res, ms)); let lastICMessageTime = new Date(0); @@ -172,24 +176,24 @@ class Client extends EventEmitter { selectedEvidence: number; checkUpdater: any; _lastTimeICReceived: any; - + viewport: Viewport; constructor(address: string) { super(); - if (mode !== 'replay') { + if (mode !== "replay") { this.serv = new WebSocket(`ws://${address}`); // Assign the websocket events - this.serv.addEventListener('open', this.emit.bind(this, 'open')); - this.serv.addEventListener('close', this.emit.bind(this, 'close')); - this.serv.addEventListener('message', this.emit.bind(this, 'message')); - this.serv.addEventListener('error', this.emit.bind(this, 'error')); + this.serv.addEventListener("open", this.emit.bind(this, "open")); + this.serv.addEventListener("close", this.emit.bind(this, "close")); + this.serv.addEventListener("message", this.emit.bind(this, "message")); + this.serv.addEventListener("error", this.emit.bind(this, "error")); } else { this.joinServer(); } - this.on('open', this.onOpen.bind(this)); - this.on('close', this.onClose.bind(this)); - this.on('message', this.onMessage.bind(this)); - this.on('error', this.onError.bind(this)); + this.on("open", this.onOpen.bind(this)); + this.on("close", this.onClose.bind(this)); + this.on("message", this.onMessage.bind(this)); + this.on("error", this.onError.bind(this)); // Preset some of the variables @@ -218,119 +222,128 @@ class Client extends EventEmitter { this.selectedEvidence = 0; this.checkUpdater = null; - + this.viewport = masterViewport(this, AO_HOST); /** - * Assign handlers for all commands - * If you implement a new command, you need to add it here - */ - this.on('MS', this.handleMS.bind(this)); - this.on('CT', this.handleCT.bind(this)); - this.on('MC', this.handleMC.bind(this)); - this.on('RMC', this.handleRMC.bind(this)); - this.on('CI', this.handleCI.bind(this)); - this.on('SC', this.handleSC.bind(this)); - this.on('EI', this.handleEI.bind(this)); - this.on('FL', this.handleFL.bind(this)); - this.on('LE', this.handleLE.bind(this)); - this.on('EM', this.handleEM.bind(this)); - this.on('FM', this.handleFM.bind(this)); - this.on('FA', this.handleFA.bind(this)); - this.on('SM', this.handleSM.bind(this)); - this.on('MM', this.handleMM.bind(this)); - this.on('BD', this.handleBD.bind(this)); - this.on('BB', this.handleBB.bind(this)); - this.on('KB', this.handleKB.bind(this)); - this.on('KK', this.handleKK.bind(this)); - this.on('DONE', this.handleDONE.bind(this)); - this.on('BN', this.handleBN.bind(this)); - this.on('HP', this.handleHP.bind(this)); - this.on('RT', this.handleRT.bind(this)); - this.on('TI', this.handleTI.bind(this)); - this.on('ZZ', this.handleZZ.bind(this)); - this.on('HI', this.handleHI.bind(this)); - this.on('ID', this.handleID.bind(this)); - this.on('PN', this.handlePN.bind(this)); - this.on('SI', this.handleSI.bind(this)); - this.on('ARUP', this.handleARUP.bind(this)); - this.on('askchaa', this.handleaskchaa.bind(this)); - this.on('CC', this.handleCC.bind(this)); - this.on('RC', this.handleRC.bind(this)); - this.on('RM', this.handleRM.bind(this)); - this.on('RD', this.handleRD.bind(this)); - this.on('CharsCheck', this.handleCharsCheck.bind(this)); - this.on('PV', this.handlePV.bind(this)); - this.on('ASS', this.handleASS.bind(this)); - this.on('CHECK', () => { }); - this.on('CH', () => { }); + * Assign handlers for all commands + * If you implement a new command, you need to add it here + */ + this.on("MS", this.handleMS.bind(this)); + this.on("CT", this.handleCT.bind(this)); + this.on("MC", this.handleMC.bind(this)); + this.on("RMC", this.handleRMC.bind(this)); + this.on("CI", this.handleCI.bind(this)); + this.on("SC", this.handleSC.bind(this)); + this.on("EI", this.handleEI.bind(this)); + this.on("FL", this.handleFL.bind(this)); + this.on("LE", this.handleLE.bind(this)); + this.on("EM", this.handleEM.bind(this)); + this.on("FM", this.handleFM.bind(this)); + this.on("FA", this.handleFA.bind(this)); + this.on("SM", this.handleSM.bind(this)); + this.on("MM", this.handleMM.bind(this)); + this.on("BD", this.handleBD.bind(this)); + this.on("BB", this.handleBB.bind(this)); + this.on("KB", this.handleKB.bind(this)); + this.on("KK", this.handleKK.bind(this)); + this.on("DONE", this.handleDONE.bind(this)); + this.on("BN", this.handleBN.bind(this)); + this.on("HP", this.handleHP.bind(this)); + this.on("RT", this.handleRT.bind(this)); + this.on("TI", this.handleTI.bind(this)); + this.on("ZZ", this.handleZZ.bind(this)); + this.on("HI", this.handleHI.bind(this)); + this.on("ID", this.handleID.bind(this)); + this.on("PN", this.handlePN.bind(this)); + this.on("SI", this.handleSI.bind(this)); + this.on("ARUP", this.handleARUP.bind(this)); + this.on("askchaa", this.handleaskchaa.bind(this)); + this.on("CC", this.handleCC.bind(this)); + this.on("RC", this.handleRC.bind(this)); + this.on("RM", this.handleRM.bind(this)); + this.on("RD", this.handleRD.bind(this)); + this.on("CharsCheck", this.handleCharsCheck.bind(this)); + this.on("PV", this.handlePV.bind(this)); + this.on("ASS", this.handleASS.bind(this)); + this.on("CHECK", () => {}); + this.on("CH", () => {}); this._lastTimeICReceived = new Date(0); } /** - * Gets the current player's character. - */ + * Gets the current player's character. + */ get character() { return this.chars[this.charID]; } /** - * Gets the player's currently selected emote. - */ + * Gets the player's currently selected emote. + */ get emote() { return this.emotes[this.selectedEmote]; } /** - * Gets the current evidence ID unless the player doesn't want to present any evidence - */ + * Gets the current evidence ID unless the player doesn't want to present any evidence + */ get evidence() { - return (document.getElementById('button_present').classList.contains('dark')) ? this.selectedEvidence : 0; + return document.getElementById("button_present").classList.contains("dark") + ? this.selectedEvidence + : 0; } /** - * Hook for sending messages to the server - * @param {string} message the message to send - */ + * Hook for sending messages to the server + * @param {string} message the message to send + */ sendServer(message: string) { //console.log("C: "+message); - mode === 'replay' ? this.sendSelf(message) : this.serv.send(message); + mode === "replay" ? this.sendSelf(message) : this.serv.send(message); } /** - * Hook for sending messages to the client - * @param {string} message the message to send - */ + * Hook for sending messages to the client + * @param {string} message the message to send + */ handleSelf(message: string) { - const message_event = new MessageEvent('websocket', { data: message }); + const message_event = new MessageEvent("websocket", { data: message }); setTimeout(() => this.onMessage(message_event), 1); } /** - * Hook for sending messages to the client - * @param {string} message the message to send - */ + * Hook for sending messages to the client + * @param {string} message the message to send + */ sendSelf(message: string) { - (document.getElementById('client_ooclog')).value += `${message}\r\n`; + (( + document.getElementById("client_ooclog") + )).value += `${message}\r\n`; this.handleSelf(message); } /** - * Sends an out-of-character chat message. - * @param {string} message the message to send - */ + * Sends an out-of-character chat message. + * @param {string} message the message to send + */ sendOOC(message: string) { - setCookie('OOC_name', (document.getElementById('OOC_name')).value); - const oocName = `${escapeChat((document.getElementById('OOC_name')).value)}`; + setCookie( + "OOC_name", + (document.getElementById("OOC_name")).value + ); + const oocName = `${escapeChat( + (document.getElementById("OOC_name")).value + )}`; const oocMessage = `${escapeChat(message)}`; const commands = { - '/save_chatlog': this.saveChatlogHandle - } - const commandsMap = new Map(Object.entries(commands)) + "/save_chatlog": this.saveChatlogHandle, + }; + const commandsMap = new Map(Object.entries(commands)); if (oocMessage && commandsMap.has(oocMessage.toLowerCase())) { try { - commandsMap.get(oocMessage.toLowerCase())() + commandsMap.get(oocMessage.toLowerCase())(); } catch (e) { // Command Not Recognized } @@ -340,26 +353,26 @@ class Client extends EventEmitter { } /** - * Sends an in-character chat message. - * @param {number} deskmod controls the desk - * @param {string} speaking who is speaking - * @param {string} name the name of the current character - * @param {string} silent whether or not it's silent - * @param {string} message the message to be sent - * @param {string} side the name of the side in the background - * @param {string} sfx_name the name of the sound effect - * @param {number} emote_modifier whether or not to zoom - * @param {number} sfx_delay the delay (in milliseconds) to play the sound effect - * @param {number} objection_modifier the number of the shout to play - * @param {string} evidence the filename of evidence to show - * @param {boolean} flip change to 1 to reverse sprite for position changes - * @param {boolean} realization screen flash effect - * @param {number} text_color text color - * @param {string} showname custom name to be displayed (optional) - * @param {number} other_charid paired character (optional) - * @param {number} self_offset offset to paired character (optional) - * @param {number} noninterrupting_preanim play the full preanim (optional) - */ + * Sends an in-character chat message. + * @param {number} deskmod controls the desk + * @param {string} speaking who is speaking + * @param {string} name the name of the current character + * @param {string} silent whether or not it's silent + * @param {string} message the message to be sent + * @param {string} side the name of the side in the background + * @param {string} sfx_name the name of the sound effect + * @param {number} emote_modifier whether or not to zoom + * @param {number} sfx_delay the delay (in milliseconds) to play the sound effect + * @param {number} objection_modifier the number of the shout to play + * @param {string} evidence the filename of evidence to show + * @param {boolean} flip change to 1 to reverse sprite for position changes + * @param {boolean} realization screen flash effect + * @param {number} text_color text color + * @param {string} showname custom name to be displayed (optional) + * @param {number} other_charid paired character (optional) + * @param {number} self_offset offset to paired character (optional) + * @param {number} noninterrupting_preanim play the full preanim (optional) + */ sendIC( deskmod: number, preanim: string, @@ -386,233 +399,283 @@ class Client extends EventEmitter { frame_realization: string, frame_sfx: string, additive: boolean, - effect: string, + effect: string ) { - let extra_cccc = ''; - let other_emote = ''; - let other_offset = ''; - let extra_27 = ''; - let extra_28 = ''; - - if (extrafeatures.includes('cccc_ic_support')) { - const self_offset = extrafeatures.includes('y_offset') ? `${self_hoffset}${self_yoffset}` : self_hoffset; // HACK: this should be an & but client fucked it up and all the servers adopted it - if (mode === 'replay') { - other_emote = '##'; - other_offset = '#0#0'; + let extra_cccc = ""; + let other_emote = ""; + let other_offset = ""; + let extra_27 = ""; + let extra_28 = ""; + + if (extrafeatures.includes("cccc_ic_support")) { + const self_offset = extrafeatures.includes("y_offset") + ? `${self_hoffset}${self_yoffset}` + : self_hoffset; // HACK: this should be an & but client fucked it up and all the servers adopted it + if (mode === "replay") { + other_emote = "##"; + other_offset = "#0#0"; } - extra_cccc = `${escapeChat(showname)}#${other_charid}${other_emote}#${self_offset}${other_offset}#${Number(noninterrupting_preanim)}#`; - - if (extrafeatures.includes('looping_sfx')) { - extra_27 = `${Number(looping_sfx)}#${Number(screenshake)}#${frame_screenshake}#${frame_realization}#${frame_sfx}#`; - if (extrafeatures.includes('effects')) { + extra_cccc = `${escapeChat( + showname + )}#${other_charid}${other_emote}#${self_offset}${other_offset}#${Number( + noninterrupting_preanim + )}#`; + + if (extrafeatures.includes("looping_sfx")) { + extra_27 = `${Number(looping_sfx)}#${Number( + screenshake + )}#${frame_screenshake}#${frame_realization}#${frame_sfx}#`; + if (extrafeatures.includes("effects")) { extra_28 = `${Number(additive)}#${escapeChat(effect)}#`; } } } - const serverMessage = `MS#${deskmod}#${escapeChat(preanim)}#${escapeChat(name)}#${escapeChat(emote)}` - + `#${escapeChat(message)}#${escapeChat(side)}#${escapeChat(sfx_name)}#${emote_modifier}` - + `#${this.charID}#${sfx_delay}#${Number(objection_modifier)}#${Number(evidence)}#${Number(flip)}#${Number(realization)}#${text_color}#${extra_cccc}${extra_27}${extra_28}%`; + const serverMessage = + `MS#${deskmod}#${escapeChat(preanim)}#${escapeChat(name)}#${escapeChat( + emote + )}` + + `#${escapeChat(message)}#${escapeChat(side)}#${escapeChat( + sfx_name + )}#${emote_modifier}` + + `#${this.charID}#${sfx_delay}#${Number(objection_modifier)}#${Number( + evidence + )}#${Number(flip)}#${Number( + realization + )}#${text_color}#${extra_cccc}${extra_27}${extra_28}%`; this.sendServer(serverMessage); - if (mode === 'replay') { - (document.getElementById('client_ooclog')).value += `wait#${(document.getElementById('client_replaytimer')).value}#%\r\n`; + if (mode === "replay") { + (( + document.getElementById("client_ooclog") + )).value += `wait#${ + (document.getElementById("client_replaytimer")).value + }#%\r\n`; } } /** - * Sends add evidence command. - * @param {string} evidence name - * @param {string} evidence description - * @param {string} evidence image filename - */ + * Sends add evidence command. + * @param {string} evidence name + * @param {string} evidence description + * @param {string} evidence image filename + */ sendPE(name: string, desc: string, img: string) { - this.sendServer(`PE#${escapeChat(name)}#${escapeChat(desc)}#${escapeChat(img)}#%`); + this.sendServer( + `PE#${escapeChat(name)}#${escapeChat(desc)}#${escapeChat(img)}#%` + ); } /** - * Sends edit evidence command. - * @param {number} evidence id - * @param {string} evidence name - * @param {string} evidence description - * @param {string} evidence image filename - */ + * Sends edit evidence command. + * @param {number} evidence id + * @param {string} evidence name + * @param {string} evidence description + * @param {string} evidence image filename + */ sendEE(id: number, name: string, desc: string, img: string) { - this.sendServer(`EE#${id}#${escapeChat(name)}#${escapeChat(desc)}#${escapeChat(img)}#%`); + this.sendServer( + `EE#${id}#${escapeChat(name)}#${escapeChat(desc)}#${escapeChat(img)}#%` + ); } /** - * Sends delete evidence command. - * @param {number} evidence id - */ + * Sends delete evidence command. + * @param {number} evidence id + */ sendDE(id: number) { this.sendServer(`DE#${id}#%`); } /** - * Sends health point command. - * @param {number} side the position - * @param {number} hp the health point - */ + * Sends health point command. + * @param {number} side the position + * @param {number} hp the health point + */ sendHP(side: number, hp: number) { this.sendServer(`HP#${side}#${hp}#%`); } /** - * Sends call mod command. - * @param {string} message to mod - */ + * Sends call mod command. + * @param {string} message to mod + */ sendZZ(msg: string) { - if (extrafeatures.includes('modcall_reason')) { + if (extrafeatures.includes("modcall_reason")) { this.sendServer(`ZZ#${msg}#%`); } else { - this.sendServer('ZZ#%'); + this.sendServer("ZZ#%"); } } /** - * Sends testimony command. - * @param {string} testimony type - */ + * Sends testimony command. + * @param {string} testimony type + */ sendRT(testimony: string) { - if (this.chars[this.charID].side === 'jud') { + if (this.chars[this.charID].side === "jud") { this.sendServer(`RT#${testimony}#%`); } } /** - * Requests to change the music to the specified track. - * @param {string} track the track ID - */ + * Requests to change the music to the specified track. + * @param {string} track the track ID + */ sendMusicChange(track: string) { this.sendServer(`MC#${track}#${this.charID}#%`); } /** - * Begins the handshake process by sending an identifier - * to the server. - */ + * Begins the handshake process by sending an identifier + * to the server. + */ joinServer() { this.sendServer(`HI#${hdid}#%`); - this.sendServer('ID#webAO#webAO#%'); - if (mode !== 'replay') { this.checkUpdater = setInterval(() => this.sendCheck(), 5000); } + this.sendServer("ID#webAO#webAO#%"); + if (mode !== "replay") { + this.checkUpdater = setInterval(() => this.sendCheck(), 5000); + } } /** - * Load game resources and stored settings. - */ + * Load game resources and stored settings. + */ loadResources() { - document.getElementById('client_version').innerText = `version ${version}`; + document.getElementById("client_version").innerText = `version ${version}`; // Load background array to select - const background_select = document.getElementById('bg_select'); - background_select.add(new Option('Custom', '0')); + const background_select = ( + document.getElementById("bg_select") + ); + background_select.add(new Option("Custom", "0")); vanilla_background_arr.forEach((background) => { background_select.add(new Option(background)); }); // Load evidence array to select - const evidence_select = document.getElementById('evi_select'); - evidence_select.add(new Option('Custom', '0')); + const evidence_select = ( + document.getElementById("evi_select") + ); + evidence_select.add(new Option("Custom", "0")); vanilla_evidence_arr.forEach((evidence) => { evidence_select.add(new Option(evidence)); }); // Read cookies and set the UI to its values - (document.getElementById('OOC_name')).value = getCookie('OOC_name') || `web${String(Math.round(Math.random() * 100 + 10))}`; + (document.getElementById("OOC_name")).value = + getCookie("OOC_name") || + `web${String(Math.round(Math.random() * 100 + 10))}`; // Read cookies and set the UI to its values - const cookietheme = getCookie('theme') || 'default'; + const cookietheme = getCookie("theme") || "default"; - (document.querySelector(`#client_themeselect [value="${cookietheme}"]`)).selected = true; - reloadTheme(); + (( + document.querySelector(`#client_themeselect [value="${cookietheme}"]`) + )).selected = true; + this.viewport.reloadTheme(); - const cookiechatbox = getCookie('chatbox') || 'dynamic'; + const cookiechatbox = getCookie("chatbox") || "dynamic"; - (document.querySelector(`#client_chatboxselect [value="${cookiechatbox}"]`)).selected = true; + (( + document.querySelector(`#client_chatboxselect [value="${cookiechatbox}"]`) + )).selected = true; setChatbox(cookiechatbox); - (document.getElementById('client_mvolume')).value = getCookie('musicVolume') || '1'; - changeMusicVolume(); - (document.getElementById('client_sfxaudio')).volume = Number(getCookie('sfxVolume')) || 1; + (document.getElementById("client_mvolume")).value = + getCookie("musicVolume") || "1"; + this.viewport.changeMusicVolume(); + (document.getElementById("client_sfxaudio")).volume = + Number(getCookie("sfxVolume")) || 1; changeSFXVolume(); - (document.getElementById('client_shoutaudio')).volume = Number(getCookie('shoutVolume')) || 1; + (document.getElementById("client_shoutaudio")).volume = + Number(getCookie("shoutVolume")) || 1; changeShoutVolume(); - (document.getElementById('client_testimonyaudio')).volume = Number(getCookie('testimonyVolume')) || 1; + (( + document.getElementById("client_testimonyaudio") + )).volume = Number(getCookie("testimonyVolume")) || 1; changeTestimonyVolume(); - (document.getElementById('client_bvolume')).value = getCookie('blipVolume') || '1'; - changeBlipVolume(); - - (document.getElementById('ic_chat_name')).value = getCookie('ic_chat_name'); - (document.getElementById('showname')).checked = Boolean(getCookie('showname')); + (document.getElementById("client_bvolume")).value = + getCookie("blipVolume") || "1"; + this.viewport.changeBlipVolume(); + + (document.getElementById("ic_chat_name")).value = + getCookie("ic_chat_name"); + (document.getElementById("showname")).checked = Boolean( + getCookie("showname") + ); showname_click(null); - (document.getElementById('client_callwords')).value = getCookie('callwords'); + (document.getElementById("client_callwords")).value = + getCookie("callwords"); } /** - * Requests to play as a specified character. - * @param {number} character the character ID - */ + * Requests to play as a specified character. + * @param {number} character the character ID + */ sendCharacter(character: number) { - console.log("sending "+character); + console.log("sending " + character); if (character === -1 || this.chars[character].name) { this.sendServer(`CC#${this.playerID}#${character}#web#%`); } } /** - * Requests to select a music track. - * @param {number?} song the song to be played - */ + * Requests to select a music track. + * @param {number?} song the song to be played + */ sendMusic(song: string) { this.sendServer(`MC#${song}#${this.charID}#%`); } /** - * Sends a keepalive packet. - */ + * Sends a keepalive packet. + */ sendCheck() { this.sendServer(`CH#${this.charID}#%`); } /** - * Triggered when a connection is established to the server. - */ + * Triggered when a connection is established to the server. + */ onOpen(_e: Event) { client.joinServer(); } /** - * Triggered when the connection to the server closes. - * @param {CloseEvent} e - */ + * Triggered when the connection to the server closes. + * @param {CloseEvent} e + */ onClose(e: CloseEvent) { console.error(`The connection was closed: ${e.reason} (${e.code})`); if (extrafeatures.length == 0 && banned === false) { - document.getElementById('client_errortext').textContent = 'Could not connect to the server'; + document.getElementById("client_errortext").textContent = + "Could not connect to the server"; } - document.getElementById('client_waiting').style.display = 'block'; - document.getElementById('client_error').style.display = 'flex'; - document.getElementById('client_loading').style.display = 'none'; - document.getElementById('error_id').textContent = String(e.code); + document.getElementById("client_waiting").style.display = "block"; + document.getElementById("client_error").style.display = "flex"; + document.getElementById("client_loading").style.display = "none"; + document.getElementById("error_id").textContent = String(e.code); this.cleanup(); } /** - * Triggered when a packet is received from the server. - * @param {MessageEvent} e - */ + * Triggered when a packet is received from the server. + * @param {MessageEvent} e + */ onMessage(e: MessageEvent) { const msg = e.data; console.debug(`S: ${msg}`); - const lines = msg.split('%'); + const lines = msg.split("%"); for (const msg of lines) { - if (msg === '') { break; } + if (msg === "") { + break; + } - const args = msg.split('#'); + const args = msg.split("#"); const header = args[0]; if (!this.emit(header, args)) { @@ -622,41 +685,43 @@ class Client extends EventEmitter { } /** - * Triggered when an network error occurs. - * @param {ErrorEvent} e - */ + * Triggered when an network error occurs. + * @param {ErrorEvent} e + */ onError(e: ErrorEvent) { console.error(`A network error occurred`); - document.getElementById('client_error').style.display = 'flex'; + document.getElementById("client_error").style.display = "flex"; this.cleanup(); } /** - * Stop sending keepalives to the server. - */ + * Stop sending keepalives to the server. + */ cleanup() { clearInterval(this.checkUpdater); - this.serv.close() + this.serv.close(); } /** - * Parse the lines in the OOC and play them - * @param {*} args packet arguments - */ + * Parse the lines in the OOC and play them + * @param {*} args packet arguments + */ handleReplay() { - const ooclog = document.getElementById('client_ooclog'); + const ooclog = document.getElementById("client_ooclog"); const rawLog = false; - let rtime: number = Number((document.getElementById('client_replaytimer')).value); + let rtime: number = Number( + (document.getElementById("client_replaytimer")).value + ); const clines = ooclog.value.split(/\r?\n/); if (clines[0]) { const currentLine = String(clines[0]); this.handleSelf(currentLine); - ooclog.value = clines.slice(1).join('\r\n'); - if (currentLine.substr(0, 4) === 'wait' && rawLog === false) { - rtime = Number(currentLine.split('#')[1]); - } else if (currentLine.substr(0, 2) !== 'MS') { + ooclog.value = clines.slice(1).join("\r\n"); + if (currentLine.substr(0, 4) === "wait" && rawLog === false) { + rtime = Number(currentLine.split("#")[1]); + } else if (currentLine.substr(0, 2) !== "MS") { rtime = 0; } @@ -665,70 +730,69 @@ class Client extends EventEmitter { } saveChatlogHandle = async () => { - const clientLog = document.getElementById('client_log') - const icMessageLogs = clientLog.getElementsByTagName('p') - const messages = [] + const clientLog = document.getElementById("client_log"); + const icMessageLogs = clientLog.getElementsByTagName("p"); + const messages = []; for (let i = 0; i < icMessageLogs.length; i++) { - const SHOWNAME_POSITION = 0 - const TEXT_POSITION = 2 - const showname = icMessageLogs[i].children[SHOWNAME_POSITION].innerHTML - const text = icMessageLogs[i].children[TEXT_POSITION].innerHTML - const message = `${showname}: ${text}` - messages.push(message) + const SHOWNAME_POSITION = 0; + const TEXT_POSITION = 2; + const showname = icMessageLogs[i].children[SHOWNAME_POSITION].innerHTML; + const text = icMessageLogs[i].children[TEXT_POSITION].innerHTML; + const message = `${showname}: ${text}`; + messages.push(message); } const d = new Date(); - let ye = new Intl.DateTimeFormat('en', { year: 'numeric' }).format(d); - let mo = new Intl.DateTimeFormat('en', { month: 'short' }).format(d); - let da = new Intl.DateTimeFormat('en', { day: '2-digit' }).format(d); + let ye = new Intl.DateTimeFormat("en", { year: "numeric" }).format(d); + let mo = new Intl.DateTimeFormat("en", { month: "short" }).format(d); + let da = new Intl.DateTimeFormat("en", { day: "2-digit" }).format(d); const filename = `chatlog-${da}-${mo}-${ye}`.toLowerCase(); - downloadFile(messages.join('\n'), filename); + downloadFile(messages.join("\n"), filename); // Reset Chatbox to Empty - (document.getElementById('client_inputbox')).value = ''; - } - + (document.getElementById("client_inputbox")).value = ""; + }; + /** - * Handles an in-character chat message. - * @param {*} args packet arguments - */ + * Handles an in-character chat message. + * @param {*} args packet arguments + */ handleMS(args: string[]) { - // TODO: this if-statement might be a bug. - if (args[4] !== viewport.chatmsg.content) { - document.getElementById('client_inner_chat').innerHTML = ''; + if (args[4] !== this.viewport.chatmsg.content) { + document.getElementById("client_inner_chat").innerHTML = ""; const char_id = Number(args[9]); const char_name = safeTags(args[3]); let msg_nameplate = args[3]; - let msg_blips = 'male'; - let char_chatbox = 'default'; + let msg_blips = "male"; + let char_chatbox = "default"; let char_muted = false; if (this.chars[char_id].name !== char_name) { - console.info(`${this.chars[char_id].name} is iniediting to ${char_name}`); - const chargs = (`${char_name}&` + 'iniediter').split('&'); + console.info( + `${this.chars[char_id].name} is iniediting to ${char_name}` + ); + const chargs = (`${char_name}&` + "iniediter").split("&"); this.handleCharacterInfo(chargs, char_id); } try { - msg_nameplate = this.chars[char_id].showname; + msg_nameplate = this.chars[char_id].showname; } catch (e) { msg_nameplate = args[3]; } try { msg_blips = this.chars[char_id].blips; - } catch (e) { - ; - } + } catch (e) {} try { char_chatbox = this.chars[char_id].chat; } catch (e) { - char_chatbox = 'default'; + char_chatbox = "default"; } try { @@ -758,23 +822,23 @@ class Client extends EventEmitter { flip: Number(args[13]), flash: Number(args[14]), color: Number(args[15]), - speed: UPDATE_INTERVAL + speed: UPDATE_INTERVAL, }; - if (extrafeatures.includes('cccc_ic_support')) { + if (extrafeatures.includes("cccc_ic_support")) { const extra_cccc = { showname: safeTags(args[16]), other_charid: Number(args[17]), other_name: safeTags(args[18]), other_emote: safeTags(args[19]), - self_offset: args[20].split(''), // HACK: here as well, client is fucked and uses this instead of & - other_offset: args[21].split(''), + self_offset: args[20].split(""), // HACK: here as well, client is fucked and uses this instead of & + other_offset: args[21].split(""), other_flip: Number(args[22]), noninterrupting_preanim: Number(args[23]), }; chatmsg = Object.assign(extra_cccc, chatmsg); - if (extrafeatures.includes('looping_sfx')) { + if (extrafeatures.includes("looping_sfx")) { const extra_27 = { looping_sfx: Number(args[24]), screenshake: Number(args[25]), @@ -784,16 +848,16 @@ class Client extends EventEmitter { }; chatmsg = Object.assign(extra_27, chatmsg); - if (extrafeatures.includes('effects')) { + if (extrafeatures.includes("effects")) { const extra_28 = { additive: Number(args[29]), - effects: args[30].split('|'), + effects: args[30].split("|"), }; chatmsg = Object.assign(extra_28, chatmsg); } else { const extra_28 = { additive: 0, - effects: ['', '', ''], + effects: ["", "", ""], }; chatmsg = Object.assign(extra_28, chatmsg); } @@ -801,23 +865,23 @@ class Client extends EventEmitter { const extra_27 = { looping_sfx: 0, screenshake: 0, - frame_screenshake: '', - frame_realization: '', - frame_sfx: '', + frame_screenshake: "", + frame_realization: "", + frame_sfx: "", }; chatmsg = Object.assign(extra_27, chatmsg); const extra_28 = { additive: 0, - effects: ['', '', ''], + effects: ["", "", ""], }; chatmsg = Object.assign(extra_28, chatmsg); } } else { const extra_cccc = { - showname: '', + showname: "", other_charid: 0, - other_name: '', - other_emote: '', + other_name: "", + other_emote: "", self_offset: [0, 0], other_offset: [0, 0], other_flip: 0, @@ -827,14 +891,14 @@ class Client extends EventEmitter { const extra_27 = { looping_sfx: 0, screenshake: 0, - frame_screenshake: '', - frame_realization: '', - frame_sfx: '', + frame_screenshake: "", + frame_realization: "", + frame_sfx: "", }; chatmsg = Object.assign(extra_27, chatmsg); const extra_28 = { additive: 0, - effects: ['', '', ''], + effects: ["", "", ""], }; chatmsg = Object.assign(extra_28, chatmsg); } @@ -843,42 +907,42 @@ class Client extends EventEmitter { if (chatmsg.charid === this.charID) { resetICParams(); } - viewport.handle_ic_speaking(chatmsg); // no await + console.log(chatmsg); + this.viewport.handle_ic_speaking(chatmsg); // no await } } } /** - * Handles an out-of-character chat message. - * @param {Array} args packet arguments - */ + * Handles an out-of-character chat message. + * @param {Array} args packet arguments + */ handleCT(args: string[]) { - if (mode !== 'replay') { - const oocLog = document.getElementById('client_ooclog'); + if (mode !== "replay") { + const oocLog = document.getElementById("client_ooclog"); oocLog.innerHTML += `${prepChat(args[1])}: ${prepChat(args[2])}\r\n`; if (oocLog.scrollTop > oocLog.scrollHeight - 600) { oocLog.scrollTop = oocLog.scrollHeight; } } - } /** - * Handles a music change to an arbitrary resource. - * @param {Array} args packet arguments - */ + * Handles a music change to an arbitrary resource. + * @param {Array} args packet arguments + */ handleMC(args: string[]) { const track = prepChat(args[1]); let charID = Number(args[2]); - const showname = args[3] || ''; + const showname = args[3] || ""; const looping = Boolean(args[4]); const channel = Number(args[5]) || 0; // const fading = Number(args[6]) || 0; // unused in web - const music = viewport.music[channel]; + const music = this.viewport.music[channel]; let musicname; music.pause(); - if (track.startsWith('http')) { + if (track.startsWith("http")) { music.src = track; } else { music.src = `${AO_HOST}sounds/music/${encodeURI(track.toLowerCase())}`; @@ -899,41 +963,48 @@ class Client extends EventEmitter { appendICLog(`The music was changed to ${track}`); } - document.getElementById('client_trackstatustext').innerText = track; + document.getElementById("client_trackstatustext").innerText = track; } + // TODO BUG: + // this.viewport.music is an array. Therefore you must access elements /** - * Handles a music change to an arbitrary resource, with an offset in seconds. - * @param {Array} args packet arguments - */ + * Handles a music change to an arbitrary resource, with an offset in seconds. + * @param {Array} args packet arguments + */ handleRMC(args: string[]) { - viewport.music.pause(); - const { music } = viewport; + this.viewport.music.pause(); + const { music } = this.viewport; // Music offset + drift from song loading music.totime = args[1]; music.offset = new Date().getTime() / 1000; - music.addEventListener('loadedmetadata', () => { - music.currentTime += parseFloat(music.totime + (new Date().getTime() / 1000 - music.offset)).toFixed(3); - music.play(); - }, false); + music.addEventListener( + "loadedmetadata", + () => { + music.currentTime += parseFloat( + music.totime + (new Date().getTime() / 1000 - music.offset) + ).toFixed(3); + music.play(); + }, + false + ); } /** - * Handles the incoming character information, and downloads the sprite + ini for it - * @param {Array} chargs packet arguments - * @param {Number} charid character ID - */ + * Handles the incoming character information, and downloads the sprite + ini for it + * @param {Array} chargs packet arguments + * @param {Number} charid character ID + */ async handleCharacterInfo(chargs: string[], charid: number) { const img = document.getElementById(`demo_${charid}`); if (chargs[0]) { let cini: any = {}; const getCharIcon = async () => { - const extensions = [ - '.png', - '.webp', - ]; + const extensions = [".png", ".webp"]; img.alt = chargs[0]; - const charIconBaseUrl = `${AO_HOST}characters/${encodeURI(chargs[0].toLowerCase())}/char_icon`; + const charIconBaseUrl = `${AO_HOST}characters/${encodeURI( + chargs[0].toLowerCase() + )}/char_icon`; for (let i = 0; i < extensions.length; i++) { const fileUrl = charIconBaseUrl + extensions[i]; const exists = await fileExists(fileUrl); @@ -948,28 +1019,34 @@ class Client extends EventEmitter { // If the ini doesn't exist on the server this will throw an error try { - const cinidata = await request(`${AO_HOST}characters/${encodeURI(chargs[0].toLowerCase())}/char.ini`); + const cinidata = await request( + `${AO_HOST}characters/${encodeURI(chargs[0].toLowerCase())}/char.ini` + ); cini = iniParse(cinidata); } catch (err) { cini = {}; - img.classList.add('noini'); + img.classList.add("noini"); console.warn(`character ${chargs[0]} is missing from webAO`); // If it does, give the user a visual indication that the character is unusable } - const mute_select = document.getElementById('mute_select'); + const mute_select = ( + document.getElementById("mute_select") + ); mute_select.add(new Option(safeTags(chargs[0]), String(charid))); - const pair_select = document.getElementById('pair_select'); + const pair_select = ( + document.getElementById("pair_select") + ); pair_select.add(new Option(safeTags(chargs[0]), String(charid))); // sometimes ini files lack important settings const default_options = { name: chargs[0], showname: chargs[0], - side: 'def', - blips: 'male', - chat: '', - category: '', + side: "def", + blips: "male", + chat: "", + category: "", }; cini.options = Object.assign(default_options, cini.options); @@ -986,107 +1063,133 @@ class Client extends EventEmitter { blips: safeTags(cini.options.blips).toLowerCase(), gender: safeTags(cini.options.gender).toLowerCase(), side: safeTags(cini.options.side).toLowerCase(), - chat: (cini.options.chat === '' ) ? safeTags(cini.options.category).toLowerCase() : safeTags(cini.options.chat).toLowerCase(), + chat: + cini.options.chat === "" + ? safeTags(cini.options.category).toLowerCase() + : safeTags(cini.options.chat).toLowerCase(), evidence: chargs[3], icon: img.src, inifile: cini, muted: false, }; - if (this.chars[charid].blips === 'male' && this.chars[charid].gender !== 'male' && this.chars[charid].gender !== '') { this.chars[charid].blips = this.chars[charid].gender; } + if ( + this.chars[charid].blips === "male" && + this.chars[charid].gender !== "male" && + this.chars[charid].gender !== "" + ) { + this.chars[charid].blips = this.chars[charid].gender; + } - const iniedit_select = document.getElementById('client_ininame'); + const iniedit_select = ( + document.getElementById("client_ininame") + ); iniedit_select.add(new Option(safeTags(chargs[0]))); } else { console.warn(`missing charid ${charid}`); - img.style.display = 'none'; + img.style.display = "none"; } } /** - * Handles incoming character information, bundling multiple characters - * per packet. - * CI#0#Phoenix&description&&&&#Miles ... - * @param {Array} args packet arguments - */ + * Handles incoming character information, bundling multiple characters + * per packet. + * CI#0#Phoenix&description&&&&#Miles ... + * @param {Array} args packet arguments + */ handleCI(args: string[]) { // Loop through the 10 characters that were sent for (let i = 2; i <= args.length - 2; i++) { if (i % 2 === 0) { - document.getElementById('client_loadingtext').innerHTML = `Loading Character ${args[1]}/${this.char_list_length}`; - const chargs = args[i].split('&'); + document.getElementById( + "client_loadingtext" + ).innerHTML = `Loading Character ${args[1]}/${this.char_list_length}`; + const chargs = args[i].split("&"); const charid = Number(args[i - 1]); - (document.getElementById('client_loadingbar')).value = charid; + (( + document.getElementById("client_loadingbar") + )).value = charid; setTimeout(() => this.handleCharacterInfo(chargs, charid), 500); } } // Request the next pack - this.sendServer(`AN#${(Number(args[1]) / 10) + 1}#%`); + this.sendServer(`AN#${Number(args[1]) / 10 + 1}#%`); } /** - * Handles incoming character information, containing all characters - * in one packet. - * @param {Array} args packet arguments - */ + * Handles incoming character information, containing all characters + * in one packet. + * @param {Array} args packet arguments + */ async handleSC(args: string[]) { const sleep = (ms: number) => new Promise((r) => setTimeout(r, ms)); - if (mode === 'watch') { // Spectators don't need to pick a character - document.getElementById('client_charselect').style.display = 'none'; + if (mode === "watch") { + // Spectators don't need to pick a character + document.getElementById("client_charselect").style.display = "none"; } else { - document.getElementById('client_charselect').style.display = 'block'; + document.getElementById("client_charselect").style.display = "block"; } - document.getElementById('client_loadingtext').innerHTML = 'Loading Characters'; + document.getElementById("client_loadingtext").innerHTML = + "Loading Characters"; for (let i = 1; i < args.length; i++) { - document.getElementById('client_loadingtext').innerHTML = `Loading Character ${i}/${this.char_list_length}`; - const chargs = args[i].split('&'); + document.getElementById( + "client_loadingtext" + ).innerHTML = `Loading Character ${i}/${this.char_list_length}`; + const chargs = args[i].split("&"); const charid = i - 1; - (document.getElementById('client_loadingbar')).value = charid; + (( + document.getElementById("client_loadingbar") + )).value = charid; await sleep(0.1); // TODO: Too many network calls without this. net::ERR_INSUFFICIENT_RESOURCES this.handleCharacterInfo(chargs, charid); } // We're done with the characters, request the music - this.sendServer('RM#%'); + this.sendServer("RM#%"); } /** - * Handles incoming evidence information, containing only one evidence - * item per packet. - * - * EI#id#name&description&type&image&##% - * - * @param {Array} args packet arguments - */ + * Handles incoming evidence information, containing only one evidence + * item per packet. + * + * EI#id#name&description&type&image&##% + * + * @param {Array} args packet arguments + */ handleEI(args: string[]) { - document.getElementById('client_loadingtext').innerHTML = `Loading Evidence ${args[1]}/${this.evidence_list_length}`; + document.getElementById( + "client_loadingtext" + ).innerHTML = `Loading Evidence ${args[1]}/${this.evidence_list_length}`; const evidenceID = Number(args[1]); - (document.getElementById('client_loadingbar')).value = this.char_list_length + evidenceID; - - const arg = args[2].split('&'); - this.evidences[evidenceID] = { - name: prepChat(arg[0]), - desc: prepChat(arg[1]), - filename: safeTags(arg[3]), - icon: `${AO_HOST}evidence/${encodeURI(arg[3].toLowerCase())}`, - }; - - this.sendServer('AE'+(evidenceID+1)+'#%'); + (document.getElementById("client_loadingbar")).value = + this.char_list_length + evidenceID; + + const arg = args[2].split("&"); + this.evidences[evidenceID] = { + name: prepChat(arg[0]), + desc: prepChat(arg[1]), + filename: safeTags(arg[3]), + icon: `${AO_HOST}evidence/${encodeURI(arg[3].toLowerCase())}`, + }; + + this.sendServer("AE" + (evidenceID + 1) + "#%"); } /** - * Handles incoming evidence list, all evidences at once - * item per packet. - * - * @param {Array} args packet arguments - */ + * Handles incoming evidence list, all evidences at once + * item per packet. + * + * @param {Array} args packet arguments + */ handleLE(args: string[]) { this.evidences = []; for (let i = 1; i < args.length - 1; i++) { - (document.getElementById('client_loadingbar')).value = this.char_list_length + i; - const arg = args[i].split('&'); + (( + document.getElementById("client_loadingbar") + )).value = this.char_list_length + i; + const arg = args[i].split("&"); this.evidences[i - 1] = { name: prepChat(arg[0]), desc: prepChat(arg[1]), @@ -1095,8 +1198,8 @@ class Client extends EventEmitter { }; } - const evidence_box = document.getElementById('evidences'); - evidence_box.innerHTML = ''; + const evidence_box = document.getElementById("evidences"); + evidence_box.innerHTML = ""; for (let i = 1; i <= this.evidences.length; i++) { evidence_box.innerHTML += `document.getElementById('bg_select'); - bg_select.innerHTML = ''; + const bg_select = document.getElementById("bg_select"); + bg_select.innerHTML = ""; - bg_select.add(new Option('Custom', '0')); + bg_select.add(new Option("Custom", "0")); bg_array.forEach((background: string) => { bg_select.add(new Option(background)); }); } catch (err) { - console.warn('there was no backgrounds.json file'); + console.warn("there was no backgrounds.json file"); } } @@ -1143,14 +1246,16 @@ class Client extends EventEmitter { const char_array = JSON.parse(chardata); // the try catch will fail before here when there is no file - const char_select = document.getElementById('client_ininame'); - char_select.innerHTML = ''; + const char_select = ( + document.getElementById("client_ininame") + ); + char_select.innerHTML = ""; char_array.forEach((character: string) => { char_select.add(new Option(character)); }); } catch (err) { - console.warn('there was no characters.json file'); + console.warn("there was no characters.json file"); } } @@ -1160,29 +1265,35 @@ class Client extends EventEmitter { const evi_array = JSON.parse(evidata); // the try catch will fail before here when there is no file - const evi_select = document.getElementById('evi_select'); - evi_select.innerHTML = ''; + const evi_select = ( + document.getElementById("evi_select") + ); + evi_select.innerHTML = ""; evi_array.forEach((evi: string) => { evi_select.add(new Option(evi)); }); - evi_select.add(new Option('Custom', '0')); + evi_select.add(new Option("Custom", "0")); } catch (err) { - console.warn('there was no evidence.json file'); + console.warn("there was no evidence.json file"); } } isAudio(trackname: string) { - const audioEndings = ['.wav', '.mp3', '.ogg', '.opus']; - return audioEndings.filter((ending) => trackname.endsWith(ending)).length === 1; + const audioEndings = [".wav", ".mp3", ".ogg", ".opus"]; + return ( + audioEndings.filter((ending) => trackname.endsWith(ending)).length === 1 + ); } addTrack(trackname: string) { - const newentry = document.createElement('OPTION'); + const newentry = document.createElement("OPTION"); const songName = getFilenameFromPath(trackname); newentry.text = unescapeChat(songName); newentry.value = trackname; - (document.getElementById('client_musiclist')).options.add(newentry); + (( + document.getElementById("client_musiclist") + )).options.add(newentry); this.musics.push(trackname); } @@ -1190,49 +1301,50 @@ class Client extends EventEmitter { const thisarea = { name, players: 0, - status: 'IDLE', - cm: '', - locked: 'FREE', + status: "IDLE", + cm: "", + locked: "FREE", }; this.areas.push(thisarea); // Create area button - const newarea = document.createElement('SPAN'); - newarea.className = 'area-button area-default'; + const newarea = document.createElement("SPAN"); + newarea.className = "area-button area-default"; newarea.id = `area${id}`; newarea.innerText = thisarea.name; - newarea.title = `Players: ${thisarea.players}\n` - + `Status: ${thisarea.status}\n` - + `CM: ${thisarea.cm}\n` - + `Area lock: ${thisarea.locked}`; + newarea.title = + `Players: ${thisarea.players}\n` + + `Status: ${thisarea.status}\n` + + `CM: ${thisarea.cm}\n` + + `Area lock: ${thisarea.locked}`; newarea.onclick = function () { area_click(newarea); }; - document.getElementById('areas').appendChild(newarea); + document.getElementById("areas").appendChild(newarea); } /** - * Area list fuckery - */ + * Area list fuckery + */ fix_last_area() { if (this.areas.length > 0) { const malplaced = this.areas.pop().name; - const areas = document.getElementById('areas'); + const areas = document.getElementById("areas"); areas.removeChild(areas.lastChild); this.addTrack(malplaced); } } /** - * Handles incoming music information, containing multiple entries - * per packet. - * @param {Array} args packet arguments - */ + * Handles incoming music information, containing multiple entries + * per packet. + * @param {Array} args packet arguments + */ handleEM(args: string[]) { - document.getElementById('client_loadingtext').innerHTML = 'Loading Music'; - if (args[1] === '0') { + document.getElementById("client_loadingtext").innerHTML = "Loading Music"; + if (args[1] === "0") { this.resetMusicList(); this.resetAreaList(); this.musics_time = false; @@ -1242,29 +1354,32 @@ class Client extends EventEmitter { if (i % 2 === 0) { const trackname = safeTags(args[i]); const trackindex = Number(args[i - 1]); - (document.getElementById('client_loadingbar')).value = this.char_list_length + this.evidence_list_length + trackindex; + (( + document.getElementById("client_loadingbar") + )).value = + this.char_list_length + this.evidence_list_length + trackindex; if (this.musics_time) { - this.addTrack(trackname); - } else if (this.isAudio(trackname)) { - this.musics_time = true; - this.fix_last_area(); - this.addTrack(trackname); - } else { - this.createArea(trackindex, trackname); - } + this.addTrack(trackname); + } else if (this.isAudio(trackname)) { + this.musics_time = true; + this.fix_last_area(); + this.addTrack(trackname); + } else { + this.createArea(trackindex, trackname); + } } } // get the next batch of tracks - this.sendServer(`AM#${(Number(args[1]) / 10) + 1}#%`); + this.sendServer(`AM#${Number(args[1]) / 10 + 1}#%`); } /** - * Handles incoming music information, containing all music in one packet. - * @param {Array} args packet arguments - */ + * Handles incoming music information, containing all music in one packet. + * @param {Array} args packet arguments + */ handleSM(args: string[]) { - document.getElementById('client_loadingtext').innerHTML = 'Loading Music '; + document.getElementById("client_loadingtext").innerHTML = "Loading Music "; this.resetMusicList(); this.resetAreaList(); @@ -1274,8 +1389,12 @@ class Client extends EventEmitter { // Check when found the song for the first time const trackname = args[i]; const trackindex = i - 1; - document.getElementById('client_loadingtext').innerHTML = `Loading Music ${i}/${this.music_list_length}`; - (document.getElementById('client_loadingbar')).value = this.char_list_length + this.evidence_list_length + i; + document.getElementById( + "client_loadingtext" + ).innerHTML = `Loading Music ${i}/${this.music_list_length}`; + (( + document.getElementById("client_loadingbar") + )).value = this.char_list_length + this.evidence_list_length + i; if (this.musics_time) { this.addTrack(trackname); } else if (this.isAudio(trackname)) { @@ -1288,13 +1407,13 @@ class Client extends EventEmitter { } // Music done, carry on - this.sendServer('RD#%'); + this.sendServer("RD#%"); } /** - * Handles updated music list - * @param {Array} args packet arguments - */ + * Handles updated music list + * @param {Array} args packet arguments + */ handleFM(args: string[]) { this.resetMusicList(); @@ -1305,9 +1424,9 @@ class Client extends EventEmitter { } /** - * Handles updated area list - * @param {Array} args packet arguments - */ + * Handles updated area list + * @param {Array} args packet arguments + */ handleFA(args: string[]) { this.resetAreaList(); @@ -1317,249 +1436,306 @@ class Client extends EventEmitter { } /** - * Handles the "MusicMode" packet - * @param {Array} args packet arguments - */ + * Handles the "MusicMode" packet + * @param {Array} args packet arguments + */ handleMM(_args: string[]) { // It's unused nowadays, as preventing people from changing the music is now serverside } /** - * Handles the kicked packet - * @param {string} type is it a kick or a ban - * @param {string} reason why - */ + * Handles the kicked packet + * @param {string} type is it a kick or a ban + * @param {string} reason why + */ handleBans(type: string, reason: string) { - document.getElementById('client_error').style.display = 'flex'; - document.getElementById('client_errortext').innerHTML = `${type}:
${reason.replace(/\n/g, '
')}`; - (document.getElementsByClassName('client_reconnect')[0]).style.display = 'none'; - (document.getElementsByClassName('client_reconnect')[1]).style.display = 'none'; - } - - /** - * Handles the kicked packet - * @param {Array} args kick reason - */ + document.getElementById("client_error").style.display = "flex"; + document.getElementById( + "client_errortext" + ).innerHTML = `${type}:
${reason.replace(/\n/g, "
")}`; + (( + document.getElementsByClassName("client_reconnect")[0] + )).style.display = "none"; + (( + document.getElementsByClassName("client_reconnect")[1] + )).style.display = "none"; + } + + /** + * Handles the kicked packet + * @param {Array} args kick reason + */ handleKK(args: string[]) { - this.handleBans('Kicked', safeTags(args[1])); + this.handleBans("Kicked", safeTags(args[1])); } /** - * Handles the banned packet - * this one is sent when you are kicked off the server - * @param {Array} args ban reason - */ + * Handles the banned packet + * this one is sent when you are kicked off the server + * @param {Array} args ban reason + */ handleKB(args: string[]) { - this.handleBans('Banned', safeTags(args[1])); + this.handleBans("Banned", safeTags(args[1])); banned = true; } /** - * Handles the warning packet - * on client this spawns a message box you can't close for 2 seconds - * @param {Array} args ban reason - */ - handleBB(args: string[]) { + * Handles the warning packet + * on client this spawns a message box you can't close for 2 seconds + * @param {Array} args ban reason + */ + handleBB(args: string[]) { alert(safeTags(args[1])); } /** - * Handles the banned packet - * this one is sent when you try to reconnect but you're banned - * @param {Array} args ban reason - */ + * Handles the banned packet + * this one is sent when you try to reconnect but you're banned + * @param {Array} args ban reason + */ handleBD(args: string[]) { - this.handleBans('Banned', safeTags(args[1])); + this.handleBans("Banned", safeTags(args[1])); banned = true; } /** - * Handles the handshake completion packet, meaning the player - * is ready to select a character. - * - * @param {Array} args packet arguments - */ + * Handles the handshake completion packet, meaning the player + * is ready to select a character. + * + * @param {Array} args packet arguments + */ handleDONE(_args: string[]) { - document.getElementById('client_loading').style.display = 'none'; - if (mode === 'watch') { // Spectators don't need to pick a character - document.getElementById('client_waiting').style.display = 'none'; + document.getElementById("client_loading").style.display = "none"; + if (mode === "watch") { + // Spectators don't need to pick a character + document.getElementById("client_waiting").style.display = "none"; } } - + /** - * Handles a background change. - * @param {Array} args packet arguments - */ - + * Handles a background change. + * @param {Array} args packet arguments + */ + handleBN(args: string[]) { - viewport.bgname = safeTags(args[1]); - const bgfolder = viewport.bgFolder; - const bg_index = getIndexFromSelect('bg_select', viewport.bgname); - (document.getElementById('bg_select')).selectedIndex = bg_index; + this.viewport.bgname = safeTags(args[1]); + const bgfolder = this.viewport.bgFolder; + const bg_index = getIndexFromSelect("bg_select", this.viewport.bgname); + (document.getElementById("bg_select")).selectedIndex = + bg_index; updateBackgroundPreview(); if (bg_index === 0) { - (document.getElementById('bg_filename')).value = viewport.bgname; - } - - tryUrls(`${AO_HOST}background/${encodeURI(args[1].toLowerCase())}/defenseempty`).then(resp => {(document.getElementById('bg_preview')).src = resp}); - tryUrls(`${bgfolder}defensedesk`).then((resp) => {(document.getElementById('client_def_bench')).src = resp}); - tryUrls(`${bgfolder}stand`).then(resp => {(document.getElementById('client_wit_bench')).src = resp}); - tryUrls(`${bgfolder}prosecutiondesk`).then(resp => {(document.getElementById('client_pro_bench')).src = resp}); - tryUrls(`${bgfolder}full`).then(resp => {(document.getElementById('client_court')).src = resp}); - tryUrls(`${bgfolder}defenseempty`).then(resp => {(document.getElementById('client_court_def')).src = resp}); - tryUrls(`${bgfolder}transition_def`).then(resp => {(document.getElementById('client_court_deft')).src = resp}); - tryUrls(`${bgfolder}witnessempty`).then(resp => {(document.getElementById('client_court_wit')).src = resp}); - tryUrls(`${bgfolder}transition_pro`).then(resp => {(document.getElementById('client_court_prot')).src = resp}); - tryUrls(`${bgfolder}prosecutorempty`).then(resp => {(document.getElementById('client_court_pro')).src = resp}); + (document.getElementById("bg_filename")).value = + this.viewport.bgname; + } + + tryUrls( + `${AO_HOST}background/${encodeURI(args[1].toLowerCase())}/defenseempty` + ).then((resp) => { + (document.getElementById("bg_preview")).src = resp; + }); + tryUrls(`${bgfolder}defensedesk`).then((resp) => { + (document.getElementById("client_def_bench")).src = + resp; + }); + tryUrls(`${bgfolder}stand`).then((resp) => { + (document.getElementById("client_wit_bench")).src = + resp; + }); + tryUrls(`${bgfolder}prosecutiondesk`).then((resp) => { + (document.getElementById("client_pro_bench")).src = + resp; + }); + tryUrls(`${bgfolder}full`).then((resp) => { + (document.getElementById("client_court")).src = resp; + }); + tryUrls(`${bgfolder}defenseempty`).then((resp) => { + (document.getElementById("client_court_def")).src = + resp; + }); + tryUrls(`${bgfolder}transition_def`).then((resp) => { + (document.getElementById("client_court_deft")).src = + resp; + }); + tryUrls(`${bgfolder}witnessempty`).then((resp) => { + (document.getElementById("client_court_wit")).src = + resp; + }); + tryUrls(`${bgfolder}transition_pro`).then((resp) => { + (document.getElementById("client_court_prot")).src = + resp; + }); + tryUrls(`${bgfolder}prosecutorempty`).then((resp) => { + (document.getElementById("client_court_pro")).src = + resp; + }); if (this.charID === -1) { - viewport.set_side('jud',false,true); + this.viewport.set_side({ + position: "jud", + showSpeedLines: false, + showDesk: true, + }); } else { - viewport.set_side(this.chars[this.charID].side,false,true); + this.viewport.set_side({ + position: this.chars[this.charID].side, + showSpeedLines: false, + showDesk: true, + }); } } /** - * Handles a change in the health bars' states. - * @param {Array} args packet arguments - */ + * Handles a change in the health bars' states. + * @param {Array} args packet arguments + */ handleHP(args: string[]) { const percent_hp = Number(args[2]) * 10; let healthbox; - if (args[1] === '1') { + if (args[1] === "1") { // Def hp this.hp[0] = Number(args[2]); - healthbox = document.getElementById('client_defense_hp'); + healthbox = document.getElementById("client_defense_hp"); } else { // Pro hp this.hp[1] = Number(args[2]); - healthbox = document.getElementById('client_prosecutor_hp'); + healthbox = document.getElementById("client_prosecutor_hp"); } - (healthbox.getElementsByClassName('health-bar')[0]).style.width = `${percent_hp}%`; + (( + healthbox.getElementsByClassName("health-bar")[0] + )).style.width = `${percent_hp}%`; } /** - * Handles a testimony states. - * @param {Array} args packet arguments - */ + * Handles a testimony states. + * @param {Array} args packet arguments + */ handleRT(args: string[]) { const judgeid = Number(args[2]); switch (args[1]) { - case 'testimony1': + case "testimony1": this.testimonyID = 1; break; - case 'testimony2': + case "testimony2": // Cross Examination this.testimonyID = 2; break; - case 'judgeruling': + case "judgeruling": this.testimonyID = 3 + judgeid; break; default: - console.warn('Invalid testimony'); + console.warn("Invalid testimony"); } - viewport.initTestimonyUpdater(); + this.viewport.initTestimonyUpdater(); } /** - * Handles a timer update - * @param {Array} args packet arguments - */ + * Handles a timer update + * @param {Array} args packet arguments + */ handleTI(args: string[]) { const timerid = Number(args[1]); const type = Number(args[2]); const timer_value = args[3]; switch (type) { case 0: - // + // case 1: - document.getElementById(`client_timer${timerid}`).innerText = timer_value; + document.getElementById(`client_timer${timerid}`).innerText = + timer_value; case 2: - document.getElementById(`client_timer${timerid}`).style.display = ''; + document.getElementById(`client_timer${timerid}`).style.display = ""; case 3: - document.getElementById(`client_timer${timerid}`).style.display = 'none'; + document.getElementById(`client_timer${timerid}`).style.display = + "none"; } } /** - * Handles a modcall - * @param {Array} args packet arguments - */ + * Handles a modcall + * @param {Array} args packet arguments + */ handleZZ(args: string[]) { - const oocLog = document.getElementById('client_ooclog'); + const oocLog = document.getElementById("client_ooclog"); oocLog.innerHTML += `$Alert: ${prepChat(args[1])}\r\n`; if (oocLog.scrollTop > oocLog.scrollHeight - 60) { oocLog.scrollTop = oocLog.scrollHeight; } - viewport.sfxaudio.pause(); - const oldvolume = viewport.sfxaudio.volume; - viewport.sfxaudio.volume = 1; - viewport.sfxaudio.src = `${AO_HOST}sounds/general/sfx-gallery.opus`; - viewport.sfxaudio.play(); - viewport.sfxaudio.volume = oldvolume; + + this.viewport.sfxaudio.pause(); + const oldvolume = this.viewport.sfxaudio.volume; + this.viewport.sfxaudio.volume = 1; + this.viewport.sfxaudio.src = `${AO_HOST}sounds/general/sfx-gallery.opus`; + this.viewport.sfxaudio.play(); + this.viewport.sfxaudio.volume = oldvolume; } /** - * Handle the player - * @param {Array} args packet arguments - */ + * Handle the player + * @param {Array} args packet arguments + */ handleHI(_args: string[]) { this.sendSelf(`ID#1#webAO#${version}#%`); - this.sendSelf('FL#fastloading#yellowtext#cccc_ic_support#flipping#looping_sfx#effects#%'); + this.sendSelf( + "FL#fastloading#yellowtext#cccc_ic_support#flipping#looping_sfx#effects#%" + ); } /** - * Identifies the server and issues a playerID - * @param {Array} args packet arguments - */ + * Identifies the server and issues a playerID + * @param {Array} args packet arguments + */ handleID(args: string[]) { this.playerID = Number(args[1]); - const serverSoftware = args[2].split('&')[0]; + const serverSoftware = args[2].split("&")[0]; let serverVersion; - if (serverSoftware === 'serverD') { - serverVersion = args[2].split('&')[1]; - } else if (serverSoftware === 'webAO') { + if (serverSoftware === "serverD") { + serverVersion = args[2].split("&")[1]; + } else if (serverSoftware === "webAO") { oldLoading = false; - this.sendSelf('PN#0#1#%'); - } else { - serverVersion = args[3]; + this.sendSelf("PN#0#1#%"); + } else { + serverVersion = args[3]; } - if (serverSoftware === 'serverD' && serverVersion === '1377.152') { oldLoading = true; } // bugged version + if (serverSoftware === "serverD" && serverVersion === "1377.152") { + oldLoading = true; + } // bugged version } /** - * Indicates how many users are on this server - * @param {Array} args packet arguments - */ + * Indicates how many users are on this server + * @param {Array} args packet arguments + */ handlePN(_args: string[]) { - this.sendServer('askchaa#%'); + this.sendServer("askchaa#%"); } /** - * What? you want a character?? - * @param {Array} args packet arguments - */ + * What? you want a character?? + * @param {Array} args packet arguments + */ handleCC(args: string[]) { this.sendSelf(`PV#1#CID#${args[2]}#%`); } /** - * What? you want a character list from me?? - * @param {Array} args packet arguments - */ + * What? you want a character list from me?? + * @param {Array} args packet arguments + */ handleaskchaa(_args: string[]) { this.sendSelf(`SI#${vanilla_character_arr.length}#0#0#%`); } /** - * Handle the change of players in an area. - * @param {Array} args packet arguments - */ + * Handle the change of players in an area. + * @param {Array} args packet arguments + */ handleARUP(args: string[]) { args = args.slice(1); for (let i = 0; i < args.length - 2; i++) { - if (this.areas[i]) { // the server sends us ARUP before we even get the area list + if (this.areas[i]) { + // the server sends us ARUP before we even get the area list const thisarea = document.getElementById(`area${i}`); switch (Number(args[0])) { case 0: // playercount @@ -1576,143 +1752,158 @@ class Client extends EventEmitter { break; } - thisarea.className = `area-button area-${this.areas[i].status.toLowerCase()}`; + thisarea.className = `area-button area-${this.areas[ + i + ].status.toLowerCase()}`; thisarea.innerText = `${this.areas[i].name} (${this.areas[i].players}) [${this.areas[i].status}]`; - thisarea.title = `Players: ${this.areas[i].players}\n` - + `Status: ${this.areas[i].status}\n` - + `CM: ${this.areas[i].cm}\n` - + `Area lock: ${this.areas[i].locked}`; + thisarea.title = + `Players: ${this.areas[i].players}\n` + + `Status: ${this.areas[i].status}\n` + + `CM: ${this.areas[i].cm}\n` + + `Area lock: ${this.areas[i].locked}`; } } } /** - * With this the server tells us which features it supports - * @param {Array} args list of features - */ + * With this the server tells us which features it supports + * @param {Array} args list of features + */ handleFL(args: string[]) { - console.info('Server-supported features:'); + console.info("Server-supported features:"); console.info(args); extrafeatures = args; - if (args.includes('yellowtext')) { - const colorselect = document.getElementById('textcolor'); + if (args.includes("yellowtext")) { + const colorselect = ( + document.getElementById("textcolor") + ); - colorselect.options[colorselect.options.length] = new Option('Yellow', '5'); - colorselect.options[colorselect.options.length] = new Option('Grey', '6'); - colorselect.options[colorselect.options.length] = new Option('Pink', '7'); - colorselect.options[colorselect.options.length] = new Option('Cyan', '8'); + colorselect.options[colorselect.options.length] = new Option( + "Yellow", + "5" + ); + colorselect.options[colorselect.options.length] = new Option("Grey", "6"); + colorselect.options[colorselect.options.length] = new Option("Pink", "7"); + colorselect.options[colorselect.options.length] = new Option("Cyan", "8"); } - if (args.includes('cccc_ic_support')) { - document.getElementById('cccc').style.display = ''; - document.getElementById('pairing').style.display = ''; + if (args.includes("cccc_ic_support")) { + document.getElementById("cccc").style.display = ""; + document.getElementById("pairing").style.display = ""; } - if (args.includes('flipping')) { - document.getElementById('button_flip').style.display = ''; + if (args.includes("flipping")) { + document.getElementById("button_flip").style.display = ""; } - if (args.includes('looping_sfx')) { - document.getElementById('button_shake').style.display = ''; - document.getElementById('2.7').style.display = ''; + if (args.includes("looping_sfx")) { + document.getElementById("button_shake").style.display = ""; + document.getElementById("2.7").style.display = ""; } - if (args.includes('effects')) { - document.getElementById('2.8').style.display = ''; + if (args.includes("effects")) { + document.getElementById("2.8").style.display = ""; } - if (args.includes('y_offset')) { - document.getElementById('y_offset').style.display = ''; + if (args.includes("y_offset")) { + document.getElementById("y_offset").style.display = ""; } } /** - * Received when the server announces its server info, - * but we use it as a cue to begin retrieving characters. - * @param {Array} args packet arguments - */ + * Received when the server announces its server info, + * but we use it as a cue to begin retrieving characters. + * @param {Array} args packet arguments + */ handleSI(args: string[]) { this.char_list_length = Number(args[1]); this.char_list_length += 1; // some servers count starting from 0 some from 1... this.evidence_list_length = Number(args[2]); this.music_list_length = Number(args[3]); - - (document.getElementById('client_loadingbar')).max = this.char_list_length + this.evidence_list_length + this.music_list_length; + + (document.getElementById("client_loadingbar")).max = + this.char_list_length + + this.evidence_list_length + + this.music_list_length; // create the charselect grid, to be filled by the character loader - document.getElementById('client_chartable').innerHTML = ''; + document.getElementById("client_chartable").innerHTML = ""; for (let i = 0; i < this.char_list_length; i++) { - const demothing = document.createElement('img'); + const demothing = document.createElement("img"); - demothing.className = 'demothing'; + demothing.className = "demothing"; demothing.id = `demo_${i}`; - const demoonclick = document.createAttribute('onclick'); + const demoonclick = document.createAttribute("onclick"); demoonclick.value = `pickChar(${i})`; demothing.setAttributeNode(demoonclick); - document.getElementById('client_chartable').appendChild(demothing); + document.getElementById("client_chartable").appendChild(demothing); } // this is determined at the top of this file - if (!oldLoading && extrafeatures.includes('fastloading')) { - this.sendServer('RC#%'); + if (!oldLoading && extrafeatures.includes("fastloading")) { + this.sendServer("RC#%"); } else { - this.sendServer('askchar2#%'); + this.sendServer("askchar2#%"); } } /** - * Handles the list of all used and vacant characters. - * @param {Array} args list of all characters represented as a 0 for free or a -1 for taken - */ + * Handles the list of all used and vacant characters. + * @param {Array} args list of all characters represented as a 0 for free or a -1 for taken + */ handleCharsCheck(args: string[]) { for (let i = 0; i < this.char_list_length; i++) { const img = document.getElementById(`demo_${i}`); - if (args[i + 1] === '-1') { img.style.opacity = '0.25'; } else if (args[i + 1] === '0') { img.style.opacity = '1'; } + if (args[i + 1] === "-1") { + img.style.opacity = "0.25"; + } else if (args[i + 1] === "0") { + img.style.opacity = "1"; + } } } /** - * Handles the server's assignment of a character for the player to use. - * PV # playerID (unused) # CID # character ID - * @param {Array} args packet arguments - */ + * Handles the server's assignment of a character for the player to use. + * PV # playerID (unused) # CID # character ID + * @param {Array} args packet arguments + */ async handlePV(args: string[]) { this.charID = Number(args[3]); - document.getElementById('client_waiting').style.display = 'none'; - document.getElementById('client_charselect').style.display = 'none'; + document.getElementById("client_waiting").style.display = "none"; + document.getElementById("client_charselect").style.display = "none"; const me = this.chars[this.charID]; this.selectedEmote = -1; const { emotes } = this; - const emotesList = document.getElementById('client_emo'); - emotesList.style.display = ''; - emotesList.innerHTML = ''; // Clear emote box + const emotesList = document.getElementById("client_emo"); + emotesList.style.display = ""; + emotesList.innerHTML = ""; // Clear emote box const ini = me.inifile; me.side = ini.options.side; updateActionCommands(me.side); if (ini.emotions.number === 0) { - emotesList.innerHTML = `No emotes available`; } else { for (let i = 1; i <= ini.emotions.number; i++) { try { - const emoteinfo = ini.emotions[i].split('#'); + const emoteinfo = ini.emotions[i].split("#"); let esfx; let esfxd; try { - esfx = ini.soundn[i] || '0'; + esfx = ini.soundn[i] || "0"; esfxd = Number(ini.soundt[i]) || 0; } catch (e) { - console.warn('ini sound is completly missing'); - esfx = '0'; + console.warn("ini sound is completly missing"); + esfx = "0"; esfxd = 0; } // Make sure the asset server is case insensitive, or that everything on it is lowercase @@ -1725,13 +1916,14 @@ class Client extends EventEmitter { deskmod: Number(emoteinfo[4]) || 1, sfx: esfx.toLowerCase(), sfxdelay: esfxd, - frame_screenshake: '', - frame_realization: '', - frame_sfx: '', - button: `${AO_HOST}characters/${encodeURI(me.name.toLowerCase())}/emotions/button${i}_off.png`, + frame_screenshake: "", + frame_realization: "", + frame_sfx: "", + button: `${AO_HOST}characters/${encodeURI( + me.name.toLowerCase() + )}/emotions/button${i}_off.png`, }; - emotesList.innerHTML - += `${emotes[i].desc}document.getElementById('client_ininame'); + const iniedit_select = ( + document.getElementById("client_ininame") + ); // Load iniswaps if there are any try { - const cswapdata = await request(`${AO_HOST}characters/${encodeURI(me.name.toLowerCase())}/iniswaps.ini`); - const cswap = cswapdata.split('\n'); + const cswapdata = await request( + `${AO_HOST}characters/${encodeURI(me.name.toLowerCase())}/iniswaps.ini` + ); + const cswap = cswapdata.split("\n"); // most iniswaps don't list their original char if (cswap.length > 0) { - iniedit_select.innerHTML = ''; + iniedit_select.innerHTML = ""; iniedit_select.add(new Option(safeTags(me.name))); - cswap.forEach((inisw: string) => iniedit_select.add(new Option(safeTags(inisw)))); + cswap.forEach((inisw: string) => + iniedit_select.add(new Option(safeTags(inisw))) + ); } } catch (err) { console.info("character doesn't have iniswaps"); @@ -1767,837 +1973,43 @@ class Client extends EventEmitter { } /** - * new asset url!! - * @param {Array} args packet arguments - */ - handleASS(args: string[]) { + * new asset url!! + * @param {Array} args packet arguments + */ + handleASS(args: string[]) { AO_HOST = args[1]; } /** - * we are asking ourselves what characters there are - * @param {Array} args packet arguments - */ + * we are asking ourselves what characters there are + * @param {Array} args packet arguments + */ handleRC(_args: string[]) { - this.sendSelf(`SC#${vanilla_character_arr.join('#')}#%`); + this.sendSelf(`SC#${vanilla_character_arr.join("#")}#%`); } /** - * we are asking ourselves what characters there are - * @param {Array} args packet arguments - */ + * we are asking ourselves what characters there are + * @param {Array} args packet arguments + */ handleRM(_args: string[]) { - this.sendSelf(`SM#${vanilla_music_arr.join('#')}#%`); + this.sendSelf(`SM#${vanilla_music_arr.join("#")}#%`); } /** - * we are asking ourselves what characters there are - * @param {Array} args packet arguments - */ + * we are asking ourselves what characters there are + * @param {Array} args packet arguments + */ handleRD(_args: string[]) { - this.sendSelf('BN#gs4#%'); - this.sendSelf('DONE#%'); - const ooclog = document.getElementById('client_ooclog'); - ooclog.value = ''; + this.sendSelf("BN#gs4#%"); + this.sendSelf("DONE#%"); + const ooclog = document.getElementById("client_ooclog"); + ooclog.value = ""; ooclog.readOnly = false; - document.getElementById('client_oocinput').style.display = 'none'; - document.getElementById('client_replaycontrols').style.display = 'inline-block'; - } -} - -class Viewport { - textnow: string; - chatmsg: any; - shouts: string[]; - colors: string[]; - blipChannels: any; - currentBlipChannel: number; - sfxaudio: any; - sfxplayed: number; - shoutaudio: any; - testimonyAudio: any; - music: any; - updater: any; - testimonyUpdater: any; - bgname: string; - lastChar: string; - lastEvi: number; - testimonyTimer: number; - shoutTimer: number; - tickTimer: number; - _animating: boolean; - startFirstTickCheck: boolean; - startSecondTickCheck: boolean; - startThirdTickCheck: boolean; - theme: string; - - constructor() { - this.textnow = ''; - this.chatmsg = { - content: '', - objection: 0, - sound: '', - startpreanim: true, - startspeaking: false, - side: null, - color: 0, - snddelay: 0, - preanimdelay: 0, - speed: UPDATE_INTERVAL - }; - - this.shouts = [ - undefined, - 'holdit', - 'objection', - 'takethat', - 'custom', - ]; - - this.colors = [ - 'white', - 'green', - 'red', - 'orange', - 'blue', - 'yellow', - 'pink', - 'cyan', - 'grey', - ]; - - // Allocate multiple blip audio channels to make blips less jittery - const blipSelectors = document.getElementsByClassName('blipSound') - this.blipChannels = [...blipSelectors]; - this.blipChannels.forEach((channel: HTMLAudioElement) => channel.volume = 0.5); - this.blipChannels.forEach((channel: HTMLAudioElement) => channel.onerror = opusCheck(channel)); - this.currentBlipChannel = 0; - - this.sfxaudio = document.getElementById('client_sfxaudio'); - this.sfxaudio.src = `${AO_HOST}sounds/general/sfx-realization.opus`; - - this.sfxplayed = 0; - - this.shoutaudio = document.getElementById('client_shoutaudio'); - this.shoutaudio.src = `${AO_HOST}misc/default/objection.opus`; - - this.testimonyAudio = document.getElementById('client_testimonyaudio'); - this.testimonyAudio.src = `${AO_HOST}sounds/general/sfx-guilty.opus`; - - const audioChannels = document.getElementsByClassName('audioChannel') - this.music = [...audioChannels]; - this.music.forEach((channel: HTMLAudioElement) => channel.volume = 0.5); - this.music.forEach((channel: HTMLAudioElement) => channel.onerror = opusCheck(channel)); - - this.updater = null; - this.testimonyUpdater = null; - - this.bgname = 'gs4'; - - this.lastChar = ''; - this.lastEvi = 0; - - this.testimonyTimer = 0; - this.shoutTimer = 0; - this.tickTimer = 0; - - this._animating = false; - } - - /** - * Sets the volume of the music. - * @param {number} volume - */ - set musicVolume(volume: number) { - this.music.forEach((channel: HTMLAudioElement) => channel.volume = volume); - } - - /** - * Returns the path which the background is located in. - */ - get bgFolder() { - return `${AO_HOST}background/${encodeURI(this.bgname.toLowerCase())}/`; - } - - /** - * Play any SFX - * - * @param {string} sfxname - */ - async playSFX(sfxname: string, looping: boolean) { - this.sfxaudio.pause(); - this.sfxaudio.loop = looping; - this.sfxaudio.src = sfxname; - this.sfxaudio.play(); - } - - /** - * Changes the viewport background based on a given position. - * - * Valid positions: `def, pro, hld, hlp, wit, jud, jur, sea` - * @param {string} position the position to change into - */ - async set_side(position: string, showspeedlines: boolean, showdesk: boolean) { - const bgfolder = viewport.bgFolder; - - const view = document.getElementById('client_fullview'); - - let bench: HTMLImageElement; - if ('def,pro,wit'.includes(position)) { - bench = document.getElementById(`client_${position}_bench`); - } else { - bench = document.getElementById('client_bench_classic'); - } - - let court: HTMLImageElement; - if ('def,pro,wit'.includes(position)) { - court = document.getElementById(`client_court_${position}`); - } else { - court = document.getElementById('client_court_classic'); - } - - interface Desk { - ao2?: string - ao1?: string - } - interface Position { - bg?: string - desk?: Desk - speedLines: string - } - - interface Positions { - [key: string]: Position - } - - const positions: Positions = { - def: { - bg: 'defenseempty', - desk: { ao2: 'defensedesk.png', ao1: 'bancodefensa.png' } as Desk, - speedLines: 'defense_speedlines.gif', - }, - pro: { - bg: 'prosecutorempty', - desk: { ao2: 'prosecutiondesk.png', ao1: 'bancoacusacion.png' } as Desk, - speedLines: 'prosecution_speedlines.gif', - }, - hld: { - bg: 'helperstand', - desk: null as Desk, - speedLines: 'defense_speedlines.gif', - }, - hlp: { - bg: 'prohelperstand', - desk: null as Desk, - speedLines: 'prosecution_speedlines.gif', - }, - wit: { - bg: 'witnessempty', - desk: { ao2: 'stand.png', ao1: 'estrado.png' } as Desk, - speedLines: 'prosecution_speedlines.gif', - }, - jud: { - bg: 'judgestand', - desk: { ao2: 'judgedesk.png', ao1: 'judgedesk.gif' } as Desk, - speedLines: 'prosecution_speedlines.gif', - }, - jur: { - bg: 'jurystand', - desk: { ao2: 'jurydesk.png', ao1: 'estrado.png' } as Desk, - speedLines: 'defense_speedlines.gif', - }, - sea: { - bg: 'seancestand', - desk: { ao2: 'seancedesk.png', ao1: 'estrado.png' } as Desk, - speedLines: 'prosecution_speedlines.gif', - }, - }; - - let bg; - let desk; - let speedLines; - - if ('def,pro,hld,hlp,wit,jud,jur,sea'.includes(position)) { - bg = positions[position].bg; - desk = positions[position].desk; - speedLines = positions[position].speedLines; - } else { - bg = `${position}`; - desk = { ao2: `${position}_overlay.png`, ao1: '_overlay.png' }; - speedLines = 'defense_speedlines.gif'; - } - - if (showspeedlines === true) { - court.src = `${AO_HOST}themes/default/${encodeURI(speedLines)}`; - } else { - court.src = await tryUrls(bgfolder + bg) - } - - if (showdesk === true && desk) { - const deskFilename = await fileExists(bgfolder + desk.ao2) ? desk.ao2 : desk.ao1; - bench.src = bgfolder + deskFilename; - bench.style.opacity = '1'; - } else { - bench.style.opacity = '0'; - } - - if ('def,pro,wit'.includes(position)) { - view.style.display = ''; - document.getElementById('client_classicview').style.display = 'none'; - switch (position) { - case 'def': - view.style.left = '0'; - break; - case 'wit': - view.style.left = '-200%'; - break; - case 'pro': - view.style.left = '-400%'; - break; - } - } else { - view.style.display = 'none'; - document.getElementById('client_classicview').style.display = ''; - } - } - - /** - * Intialize testimony updater - */ - initTestimonyUpdater() { - - const testimonyFilenames: Testimony = { - 1: 'witnesstestimony', - 2: 'crossexamination', - 3: 'notguilty', - 4: 'guilty', - }; - - const testimony = testimonyFilenames[client.testimonyID]; - if (!testimony) { - console.warn(`Invalid testimony ID ${client.testimonyID}`); - return; - } - - this.testimonyAudio.src = client.resources[testimony].sfx; - this.testimonyAudio.play(); - - const testimonyOverlay = document.getElementById('client_testimony'); - testimonyOverlay.src = client.resources[testimony].src; - testimonyOverlay.style.opacity = '1'; - - this.testimonyTimer = 0; - this.testimonyUpdater = setTimeout(() => this.updateTestimony(), UPDATE_INTERVAL); - } - - /** - * Updates the testimony overaly - */ - updateTestimony() { - const testimonyFilenames: Testimony = { - 1: 'witnesstestimony', - 2: 'crossexamination', - 3: 'notguilty', - 4: 'guilty', - }; - - // Update timer - this.testimonyTimer += UPDATE_INTERVAL; - - const testimony = testimonyFilenames[client.testimonyID]; - const resource = client.resources[testimony]; - if (!resource) { - this.disposeTestimony(); - return; - } - - if (this.testimonyTimer >= resource.duration) { - this.disposeTestimony(); - } else { - this.testimonyUpdater = setTimeout(() => this.updateTestimony(), UPDATE_INTERVAL); - } - } - - /** - * Dispose the testimony overlay - */ - disposeTestimony() { - client.testimonyID = 0; - this.testimonyTimer = 0; - document.getElementById('client_testimony').style.opacity = '0'; - clearTimeout(this.testimonyUpdater); - } - - /** - * Sets a new emote. - * This sets up everything before the tick() loops starts - * a lot of things can probably be moved here, like starting the shout animation if there is one - * TODO: the preanim logic, on the other hand, should probably be moved to tick() - * @param {object} chatmsg the new chat message - */ - async handle_ic_speaking(chatmsg: any) { - - this.chatmsg = chatmsg; - this.textnow = ''; - this.sfxplayed = 0; - this.tickTimer = 0; - this._animating = true; - this.startFirstTickCheck = true - this.startSecondTickCheck = false - this.startThirdTickCheck = false - let charLayers = document.getElementById('client_char'); - let pairLayers = document.getElementById('client_pair_char'); - - // stop updater - clearTimeout(this.updater); - - // stop last sfx from looping any longer - this.sfxaudio.loop = false; - - const fg = document.getElementById('client_fg'); - const gamewindow = document.getElementById('client_gamewindow'); - const waitingBox = document.getElementById('client_chatwaiting'); - - // Reset CSS animation - gamewindow.style.animation = ''; - waitingBox.style.opacity = '0'; - - const eviBox = document.getElementById('client_evi'); - - if (this.lastEvi !== this.chatmsg.evidence) { - eviBox.style.opacity = '0'; - eviBox.style.height = '0%'; - } - this.lastEvi = this.chatmsg.evidence; - - const validSides: string[] = ['def', 'pro', 'wit']; // these are for the full view pan, the other positions use 'client_char' - if (validSides.includes(this.chatmsg.side)) { - charLayers = document.getElementById(`client_${this.chatmsg.side}_char`); - pairLayers = document.getElementById(`client_${this.chatmsg.side}_pair_char`); - } - - const chatContainerBox = document.getElementById('client_chatcontainer'); - const nameBoxInner = document.getElementById('client_inner_name'); - const chatBoxInner = document.getElementById('client_inner_chat'); - - const displayname = ((document.getElementById('showname')).checked && this.chatmsg.showname !== '') ? this.chatmsg.showname : this.chatmsg.nameplate; - - // Clear out the last message - chatBoxInner.innerText = this.textnow; - nameBoxInner.innerText = displayname; - - if (this.lastChar !== this.chatmsg.name) { - charLayers.style.opacity = '0'; - pairLayers.style.opacity = '0'; - } - this.lastChar = this.chatmsg.name; - - appendICLog(this.chatmsg.content, this.chatmsg.showname, this.chatmsg.nameplate); - - checkCallword(this.chatmsg.content); - - setEmote(AO_HOST, this, this.chatmsg.name.toLowerCase(), this.chatmsg.sprite, '(a)', false, this.chatmsg.side); - - if (this.chatmsg.other_name) { - setEmote(AO_HOST, this, this.chatmsg.other_name.toLowerCase(), this.chatmsg.other_emote, '(a)', false, this.chatmsg.side); - } - - // gets which shout shall played - const shoutSprite = document.getElementById('client_shout'); - const shout = this.shouts[this.chatmsg.objection]; - if (shout) { - // Hide message box - chatContainerBox.style.opacity = '0'; - if (this.chatmsg.objection === 4) { - shoutSprite.src = `${AO_HOST}characters/${encodeURI(this.chatmsg.name.toLowerCase())}/custom.gif`; - } else { - shoutSprite.src = client.resources[shout].src; - shoutSprite.style.animation = 'bubble 700ms steps(10, jump-both)'; - } - shoutSprite.style.opacity = '1'; - - this.shoutaudio.src = `${AO_HOST}characters/${encodeURI(this.chatmsg.name.toLowerCase())}/${shout}.opus`; - this.shoutaudio.play(); - this.shoutTimer = client.resources[shout].duration; - } else { - this.shoutTimer = 0; - } - - this.chatmsg.startpreanim = true; - let gifLength = 0; - - if (this.chatmsg.type === 1 && this.chatmsg.preanim !== '-') { //we have a preanim - chatContainerBox.style.opacity = '0'; - gifLength = await getAnimLength(`${AO_HOST}characters/${encodeURI(this.chatmsg.name.toLowerCase())}/${encodeURI(this.chatmsg.preanim)}`); - console.debug("preanim is "+gifLength+" long"); - this.chatmsg.startspeaking = false; - } else { - this.chatmsg.startspeaking = true; - if(this.chatmsg.content !== "") - chatContainerBox.style.opacity = '1'; - } - this.chatmsg.preanimdelay = gifLength; - - let skipoffset: boolean = false; - if (chatmsg.type === 5) { - this.set_side(chatmsg.side,true,false); - } else { - switch(Number(chatmsg.deskmod)) { - case 0: //desk is hidden - this.set_side(chatmsg.side,false,false); - break; - case 1: //desk is shown - this.set_side(chatmsg.side,false,true); - break; - case 2: //desk is hidden during preanim, but shown during idle/talk - this.set_side(chatmsg.side,false,false); - break; - case 3: //opposite of 2 - this.set_side(chatmsg.side,false,false); - break; - case 4: //desk is hidden, character offset is ignored, pair character is hidden during preanim, normal behavior during idle/talk - this.set_side(chatmsg.side,false,false); - skipoffset = true; - break; - case 5: //opposite of 4 - this.set_side(chatmsg.side,false,true); - break; - default: - this.set_side(chatmsg.side,false,true); - break; - } - } - - setChatbox(chatmsg.chatbox); - resizeChatbox(); - - if (!skipoffset) { - // Flip the character - charLayers.style.transform = this.chatmsg.flip === 1 ? 'scaleX(-1)' : 'scaleX(1)'; - pairLayers.style.transform = this.chatmsg.other_flip === 1 ? 'scaleX(-1)' : 'scaleX(1)'; - - // Shift by the horizontal offset - switch (this.chatmsg.side) { - case 'wit': - pairLayers.style.left = `${200 + Number(this.chatmsg.other_offset[0])}%`; - charLayers.style.left = `${200 + Number(this.chatmsg.self_offset[0])}%`; - break; - case 'pro': - pairLayers.style.left = `${400 + Number(this.chatmsg.other_offset[0])}%`; - charLayers.style.left = `${400 + Number(this.chatmsg.self_offset[0])}%`; - break; - default: - pairLayers.style.left = `${Number(this.chatmsg.other_offset[0])}%`; - charLayers.style.left = `${Number(this.chatmsg.self_offset[0])}%`; - break; - } - - // New vertical offsets - pairLayers.style.top = `${Number(this.chatmsg.other_offset[1])}%`; - charLayers.style.top = `${Number(this.chatmsg.self_offset[1])}%`; - - } - - this.blipChannels.forEach((channel: HTMLAudioElement) => channel.src = `${AO_HOST}sounds/general/sfx-blip${encodeURI(this.chatmsg.blips.toLowerCase())}.opus`); - - // process markup - if (this.chatmsg.content.startsWith('~~')) { - chatBoxInner.style.textAlign = 'center'; - this.chatmsg.content = this.chatmsg.content.substring(2, this.chatmsg.content.length); - } else { - chatBoxInner.style.textAlign = 'inherit'; - } - - // apply effects - fg.style.animation = ''; - const badEffects = ['', '-', 'none']; - if (this.chatmsg.effects[0] && !badEffects.includes(this.chatmsg.effects[0].toLowerCase())) { - const baseEffectUrl = `${AO_HOST}themes/default/effects/`; - fg.src = `${baseEffectUrl}${encodeURI(this.chatmsg.effects[0].toLowerCase())}.webp`; - } else { - - fg.src = transparentPng; - } - - charLayers.style.opacity = '1'; - - const soundChecks = ['0', '1', '', undefined]; - if (soundChecks.some((check) => this.chatmsg.sound === check)) { - this.chatmsg.sound = this.chatmsg.effects[2]; - } - this.chatmsg.parsed = await attorneyMarkdown.applyMarkdown(chatmsg.content, this.colors[this.chatmsg.color]) - this.chat_tick(); - } - - async handleTextTick(charLayers: HTMLImageElement) { - const chatBox = document.getElementById('client_chat'); - const waitingBox = document.getElementById('client_chatwaiting'); - const chatBoxInner = document.getElementById('client_inner_chat'); - const charName = this.chatmsg.name.toLowerCase(); - const charEmote = this.chatmsg.sprite.toLowerCase(); - - - if (this.chatmsg.content.charAt(this.textnow.length) !== ' ') { - this.blipChannels[this.currentBlipChannel].play(); - this.currentBlipChannel++; - this.currentBlipChannel %= this.blipChannels.length; - } - this.textnow = this.chatmsg.content.substring(0, this.textnow.length + 1); - const characterElement = this.chatmsg.parsed[this.textnow.length - 1] - if (characterElement) { - const COMMAND_IDENTIFIER = '\\' - - const nextCharacterElement = this.chatmsg.parsed[this.textnow.length] - const flash = async () => { - const effectlayer = document.getElementById('client_fg'); - this.playSFX(`${AO_HOST}sounds/general/sfx-realization.opus`, false); - effectlayer.style.animation = 'flash 0.4s 1'; - await delay(400) - effectlayer.style.removeProperty('animation') - } - - const shake = async () => { - const gamewindow = document.getElementById('client_gamewindow'); - this.playSFX(`${AO_HOST}sounds/general/sfx-stab.opus`, false); - gamewindow.style.animation = 'shake 0.2s 1'; - await delay(200) - gamewindow.style.removeProperty('animation') - } - - const commands = new Map(Object.entries({ - 's': shake, - 'f': flash - })) - const textSpeeds = new Set(['{', '}']) - - // Changing Text Speed - if (textSpeeds.has(characterElement.innerHTML)) { - // Grab them all in a row - const MAX_SLOW_CHATSPEED = 120 - for(let i = this.textnow.length; i < this.chatmsg.content.length; i++) { - const currentCharacter = this.chatmsg.parsed[i - 1].innerHTML - if (currentCharacter === '}') { - if (this.chatmsg.speed > 0) { - this.chatmsg.speed -= 20 - } - } else if(currentCharacter === '{') { - if(this.chatmsg.speed < MAX_SLOW_CHATSPEED) { - this.chatmsg.speed += 20 - } - } else { - // No longer at a speed character - this.textnow = this.chatmsg.content.substring(0, i); - break - } - } - } - - if (characterElement.innerHTML === COMMAND_IDENTIFIER && commands.has(nextCharacterElement?.innerHTML)) { - this.textnow = this.chatmsg.content.substring(0, this.textnow.length + 1); - await commands.get(nextCharacterElement.innerHTML)() - } else { - chatBoxInner.appendChild(this.chatmsg.parsed[this.textnow.length - 1]); - } - } - - // scroll to bottom - chatBox.scrollTop = chatBox.scrollHeight; - - if (this.textnow === this.chatmsg.content) { - this._animating = false; - setEmote(AO_HOST, this, charName, charEmote, '(a)', false, this.chatmsg.side); - charLayers.style.opacity = '1'; - waitingBox.style.opacity = '1'; - clearTimeout(this.updater); - } - } - /** - * Updates the chatbox based on the given text. - * - * OK, here's the documentation on how this works: - * - * 1 _animating - * If we're not done with this characters animation, i.e. his text isn't fully there, set a timeout for the next tick/step to happen - * - * 2 startpreanim - * If the shout timer is over it starts with the preanim - * The first thing it checks for is the shake effect (TODO on client this is handled by the @ symbol and not a flag ) - * Then is the flash/realization effect - * After that, the shout image set to be transparent - * and the main characters preanim gif is loaded - * If pairing is supported the paired character will just stand around with his idle sprite - * - * 3 preanimdelay over - * this animates the evidence popup and finally shows the character name and message box - * it sets the text color and the character speaking sprite - * - * 4 textnow != content - * this adds a character to the textbox and stops the animations if the entire message is present in the textbox - * - * 5 sfx - * independent of the stuff above, this will play any sound effects specified by the emote the character sent. - * happens after the shout delay + an sfx delay that comes with the message packet - * - * XXX: This relies on a global variable `this.chatmsg`! - */ - async chat_tick() { - // note: this is called fairly often - // do not perform heavy operations here - - await delay(this.chatmsg.speed) - - if (this.textnow === this.chatmsg.content) { - return - } - - const gamewindow = document.getElementById('client_gamewindow'); - const waitingBox = document.getElementById('client_chatwaiting'); - const eviBox = document.getElementById('client_evi'); - const shoutSprite = document.getElementById('client_shout'); - const effectlayer = document.getElementById('client_fg'); - const chatBoxInner = document.getElementById('client_inner_chat'); - let charLayers = document.getElementById('client_char'); - let pairLayers = document.getElementById('client_pair_char'); - - const validSides: string[] = ['def', 'pro', 'wit']; // these are for the full view pan, the other positions use 'client_char' - if (validSides.includes(this.chatmsg.side)) { - charLayers = document.getElementById(`client_${this.chatmsg.side}_char`); - pairLayers = document.getElementById(`client_${this.chatmsg.side}_pair_char`); - } - - const charName = this.chatmsg.name.toLowerCase(); - const charEmote = this.chatmsg.sprite.toLowerCase(); - - const pairName = this.chatmsg.other_name.toLowerCase(); - const pairEmote = this.chatmsg.other_emote.toLowerCase(); - - // TODO: preanims sometimes play when they're not supposed to - const isShoutOver = this.tickTimer >= this.shoutTimer - const isShoutAndPreanimOver = this.tickTimer >= this.shoutTimer + this.chatmsg.preanimdelay - if (isShoutOver && this.startFirstTickCheck) { - // Effect stuff - if (this.chatmsg.screenshake === 1) { - // Shake screen - this.playSFX(`${AO_HOST}sounds/general/sfx-stab.opus`, false); - gamewindow.style.animation = 'shake 0.2s 1'; - } - if (this.chatmsg.flash === 1) { - // Flash screen - this.playSFX(`${AO_HOST}sounds/general/sfx-realization.opus`, false); - effectlayer.style.animation = 'flash 0.4s 1'; - } - - // Pre-animation stuff - if (this.chatmsg.preanimdelay > 0) { - shoutSprite.style.opacity = '0'; - shoutSprite.style.animation = ''; - const preanim = this.chatmsg.preanim.toLowerCase(); - setEmote(AO_HOST, this, charName, preanim, '', false, this.chatmsg.side); - } - - if (this.chatmsg.other_name) { - pairLayers.style.opacity = '1'; - } else { - pairLayers.style.opacity = '0'; - } - // Done with first check, move to second - this.startFirstTickCheck = false - this.startSecondTickCheck = true - - this.chatmsg.startpreanim = false; - this.chatmsg.startspeaking = true; - } - - const hasNonInterruptingPreAnim = this.chatmsg.noninterrupting_preanim === 1 - if (this.textnow !== this.chatmsg.content && hasNonInterruptingPreAnim) { - const chatContainerBox = document.getElementById('client_chatcontainer'); - chatContainerBox.style.opacity = '1'; - await this.handleTextTick(charLayers) - - }else if (isShoutAndPreanimOver && this.startSecondTickCheck) { - if (this.chatmsg.startspeaking) { - this.chatmsg.startspeaking = false; - - // Evidence Bullshit - if (this.chatmsg.evidence > 0) { - // Prepare evidence - eviBox.src = safeTags(client.evidences[this.chatmsg.evidence - 1].icon); - - eviBox.style.width = 'auto'; - eviBox.style.height = '36.5%'; - eviBox.style.opacity = '1'; - - this.testimonyAudio.src = `${AO_HOST}sounds/general/sfx-evidenceshoop.opus`; - this.testimonyAudio.play(); - - if (this.chatmsg.side === 'def') { - // Only def show evidence on right - eviBox.style.right = '1em'; - eviBox.style.left = 'initial'; - } else { - eviBox.style.right = 'initial'; - eviBox.style.left = '1em'; - } - } - chatBoxInner.className = `text_${this.colors[this.chatmsg.color]}`; - - - if (this.chatmsg.preanimdelay === 0) { - shoutSprite.style.opacity = '0'; - shoutSprite.style.animation = ''; - } - - switch(Number(this.chatmsg.deskmod)) { - case 2: - this.set_side(this.chatmsg.side,false,true); - break; - case 3: - this.set_side(this.chatmsg.side,false,false); - break; - case 4: - this.set_side(this.chatmsg.side,false,true); - break; - case 5: - this.set_side(this.chatmsg.side,false,false); - break; - } - - if (this.chatmsg.other_name) { - setEmote(AO_HOST, this, pairName, pairEmote, '(a)', true, this.chatmsg.side); - pairLayers.style.opacity = '1'; - } else { - pairLayers.style.opacity = '0'; - } - - setEmote(AO_HOST, this, charName, charEmote, '(b)', false, this.chatmsg.side); - charLayers.style.opacity = '1'; - - if (this.textnow === this.chatmsg.content) { - setEmote(AO_HOST, this, charName, charEmote, '(a)', false, this.chatmsg.side); - charLayers.style.opacity = '1'; - waitingBox.style.opacity = '1'; - this._animating = false; - clearTimeout(this.updater); - return - } - } else if (this.textnow !== this.chatmsg.content) { - const chatContainerBox = document.getElementById('client_chatcontainer'); - chatContainerBox.style.opacity = '1'; - await this.handleTextTick(charLayers) - } - } - - if (!this.sfxplayed && this.chatmsg.snddelay + this.shoutTimer >= this.tickTimer) { - this.sfxplayed = 1; - if (this.chatmsg.sound !== '0' && this.chatmsg.sound !== '1' && this.chatmsg.sound !== '' && this.chatmsg.sound !== undefined && (this.chatmsg.type == 1 || this.chatmsg.type == 2 || this.chatmsg.type == 6)) { - this.playSFX(`${AO_HOST}sounds/general/${encodeURI(this.chatmsg.sound.toLowerCase())}.opus`, this.chatmsg.looping_sfx); - } - } - if (this._animating) { - this.chat_tick() - } - this.tickTimer += UPDATE_INTERVAL; + document.getElementById("client_oocinput").style.display = "none"; + document.getElementById("client_replaycontrols").style.display = + "inline-block"; } } @@ -2607,8 +2019,11 @@ class Viewport { */ export function onOOCEnter(event: KeyboardEvent) { if (event.keyCode === 13) { - client.sendOOC((document.getElementById('client_oocinputbox')).value); - (document.getElementById('client_oocinputbox')).value = ''; + client.sendOOC( + (document.getElementById("client_oocinputbox")).value + ); + (document.getElementById("client_oocinputbox")).value = + ""; } } window.onOOCEnter = onOOCEnter; @@ -2631,34 +2046,63 @@ export function onEnter(event: KeyboardEvent) { const mychar = client.character; const myemo = client.emote; const evi = client.evidence; - const flip = Boolean((document.getElementById('button_flip').classList.contains('dark'))); - const flash = Boolean((document.getElementById('button_flash').classList.contains('dark'))); - const screenshake = Boolean((document.getElementById('button_shake').classList.contains('dark'))); - const noninterrupting_preanim = Boolean(((document.getElementById('check_nonint')).checked)); - const looping_sfx = Boolean(((document.getElementById('check_loopsfx')).checked)); - const color = Number((document.getElementById('textcolor')).value); - const showname = escapeChat((document.getElementById('ic_chat_name')).value); - const text = (document.getElementById('client_inputbox')).value; - const pairchar = (document.getElementById('pair_select')).value; - const pairoffset = Number((document.getElementById('pair_offset')).value); - const pairyoffset = Number((document.getElementById('pair_y_offset')).value); - const myrole = (document.getElementById('role_select')).value ? (document.getElementById('role_select')).value : mychar.side; - const additive = Boolean(((document.getElementById('check_additive')).checked)); - const effect = (document.getElementById('effect_select')).value; - - let sfxname = '0'; + const flip = Boolean( + document.getElementById("button_flip").classList.contains("dark") + ); + const flash = Boolean( + document.getElementById("button_flash").classList.contains("dark") + ); + const screenshake = Boolean( + document.getElementById("button_shake").classList.contains("dark") + ); + const noninterrupting_preanim = Boolean( + (document.getElementById("check_nonint")).checked + ); + const looping_sfx = Boolean( + (document.getElementById("check_loopsfx")).checked + ); + const color = Number( + (document.getElementById("textcolor")).value + ); + const showname = escapeChat( + (document.getElementById("ic_chat_name")).value + ); + const text = (document.getElementById("client_inputbox")) + .value; + const pairchar = (document.getElementById("pair_select")) + .value; + const pairoffset = Number( + (document.getElementById("pair_offset")).value + ); + const pairyoffset = Number( + (document.getElementById("pair_y_offset")).value + ); + const myrole = (document.getElementById("role_select")) + .value + ? (document.getElementById("role_select")).value + : mychar.side; + const additive = Boolean( + (document.getElementById("check_additive")).checked + ); + const effect = (document.getElementById("effect_select")) + .value; + + let sfxname = "0"; let sfxdelay = 0; let emote_mod = myemo.zoom; - if ((document.getElementById('sendsfx')).checked) { + if ((document.getElementById("sendsfx")).checked) { sfxname = myemo.sfx; sfxdelay = myemo.sfxdelay; } // not to overwrite a 5 from the ini or anything else - if ((document.getElementById('sendpreanim')).checked) { - if (emote_mod === 0) { emote_mod = 1; } - } else if (emote_mod === 1) { emote_mod = 0; } - + if ((document.getElementById("sendpreanim")).checked) { + if (emote_mod === 0) { + emote_mod = 1; + } + } else if (emote_mod === 1) { + emote_mod = 0; + } client.sendIC( myemo.deskmod, @@ -2682,11 +2126,11 @@ export function onEnter(event: KeyboardEvent) { noninterrupting_preanim, looping_sfx, screenshake, - '-', - '-', - '-', + "-", + "-", + "-", additive, - effect, + effect ); } return false; @@ -2699,22 +2143,23 @@ window.onEnter = onEnter; * was successfully sent/presented. */ function resetICParams() { - (document.getElementById('client_inputbox')).value = ''; - document.getElementById('button_flash').className = 'client_button'; - document.getElementById('button_shake').className = 'client_button'; + (document.getElementById("client_inputbox")).value = ""; + document.getElementById("button_flash").className = "client_button"; + document.getElementById("button_shake").className = "client_button"; - (document.getElementById('sendpreanim')).checked = false; - (document.getElementById('sendsfx')).checked = false; + (document.getElementById("sendpreanim")).checked = false; + (document.getElementById("sendsfx")).checked = false; if (selectedShout) { - document.getElementById(`button_${selectedShout}`).className = 'client_button'; + document.getElementById(`button_${selectedShout}`).className = + "client_button"; selectedShout = 0; } } export function resetOffset(_event: Event) { - (document.getElementById('pair_offset')).value = '0'; - (document.getElementById('pair_y_offset')).value = '0'; + (document.getElementById("pair_offset")).value = "0"; + (document.getElementById("pair_y_offset")).value = "0"; } window.resetOffset = resetOffset; @@ -2723,14 +2168,18 @@ window.resetOffset = resetOffset; * @param {MouseEvent} event */ export function musiclist_filter(_event: Event) { - const musiclist_element = document.getElementById('client_musiclist'); - const searchname = (document.getElementById('client_musicsearch')).value; + const musiclist_element = ( + document.getElementById("client_musiclist") + ); + const searchname = (( + document.getElementById("client_musicsearch") + )).value; - musiclist_element.innerHTML = ''; + musiclist_element.innerHTML = ""; for (const trackname of client.musics) { if (trackname.toLowerCase().indexOf(searchname.toLowerCase()) !== -1) { - const newentry = document.createElement('OPTION'); + const newentry = document.createElement("OPTION"); newentry.text = trackname; musiclist_element.options.add(newentry); } @@ -2743,12 +2192,16 @@ window.musiclist_filter = musiclist_filter; * @param {MouseEvent} event */ export function musiclist_click(_event: Event) { - const playtrack = (document.getElementById('client_musiclist')).value; + const playtrack = (( + document.getElementById("client_musiclist") + )).value; client.sendMusicChange(playtrack); // This is here so you can't actually select multiple tracks, // even though the select tag has the multiple option to render differently - const musiclist_elements = (document.getElementById('client_musiclist')).selectedOptions; + const musiclist_elements = (( + document.getElementById("client_musiclist") + )).selectedOptions; for (let i = 0; i < musiclist_elements.length; i++) { musiclist_elements[i].selected = false; } @@ -2760,12 +2213,14 @@ window.musiclist_click = musiclist_click; * @param {MouseEvent} event */ export function mutelist_click(_event: Event) { - const mutelist = document.getElementById('mute_select'); + const mutelist = document.getElementById("mute_select"); const selected_character = mutelist.options[mutelist.selectedIndex]; if (client.chars[selected_character.value].muted === false) { client.chars[selected_character.value].muted = true; - selected_character.text = `${client.chars[selected_character.value].name} (muted)`; + selected_character.text = `${ + client.chars[selected_character.value].name + } (muted)`; console.info(`muted ${client.chars[selected_character.value].name}`); } else { client.chars[selected_character.value].muted = false; @@ -2779,12 +2234,22 @@ window.mutelist_click = mutelist_click; * @param {MouseEvent} event */ export function showname_click(_event: Event) { - setCookie('showname', String((document.getElementById('showname')).checked)); - setCookie('ic_chat_name', (document.getElementById('ic_chat_name')).value); + setCookie( + "showname", + String((document.getElementById("showname")).checked) + ); + setCookie( + "ic_chat_name", + (document.getElementById("ic_chat_name")).value + ); - const css_s = document.getElementById('nameplate_setting'); + const css_s = document.getElementById("nameplate_setting"); - if ((document.getElementById('showname')).checked) { css_s.href = 'styles/shownames.css'; } else { css_s.href = 'styles/nameplates.css'; } + if ((document.getElementById("showname")).checked) { + css_s.href = "styles/shownames.css"; + } else { + css_s.href = "styles/nameplates.css"; + } } window.showname_click = showname_click; @@ -2796,48 +2261,21 @@ export function area_click(el: HTMLElement) { const area = client.areas[el.id.substr(4)].name; client.sendMusicChange(area); - const areaHr = document.createElement('div'); - areaHr.className = 'hrtext'; + const areaHr = document.createElement("div"); + areaHr.className = "hrtext"; areaHr.textContent = `switched to ${el.textContent}`; - document.getElementById('client_log').appendChild(areaHr); + document.getElementById("client_log").appendChild(areaHr); } window.area_click = area_click; -/** - * Triggered by the music volume slider. - */ -export function changeMusicVolume() { - viewport.musicVolume = Number((document.getElementById('client_mvolume')).value); - setCookie('musicVolume', String(viewport.musicVolume)); -} -window.changeMusicVolume = changeMusicVolume; - -/** - * Triggered by the blip volume slider. - */ -export function changeBlipVolume() { - const blipVolume = (document.getElementById('client_bvolume')).value; - viewport.blipChannels.forEach((channel: HTMLAudioElement) => channel.volume = Number(blipVolume)); - setCookie('blipVolume', blipVolume); -} -window.changeBlipVolume = changeBlipVolume; - -/** - * Triggered by the theme selector. - */ -export function reloadTheme() { - viewport.theme = (document.getElementById('client_themeselect')).value; - setCookie('theme', viewport.theme); - (document.getElementById('client_theme')).href = `styles/${viewport.theme}.css`; -} -window.reloadTheme = reloadTheme; - /** * Triggered by a changed callword list */ export function changeCallwords() { - client.callwords = (document.getElementById('client_callwords')).value.split('\n'); - setCookie('callwords', client.callwords.join('\n')); + client.callwords = (( + document.getElementById("client_callwords") + )).value.split("\n"); + setCookie("callwords", client.callwords.join("\n")); } window.changeCallwords = changeCallwords; @@ -2845,7 +2283,7 @@ window.changeCallwords = changeCallwords; * Triggered by the modcall sfx dropdown */ export function modcall_test() { - client.handleZZ('test#test'.split('#')); + client.handleZZ("test#test".split("#")); } window.modcall_test = modcall_test; @@ -2853,10 +2291,11 @@ window.modcall_test = modcall_test; * Triggered by the ini button. */ export async function iniedit() { - const ininame = (document.getElementById('client_ininame')).value; + const ininame = (document.getElementById("client_ininame")) + .value; const inicharID = client.charID; - await client.handleCharacterInfo(ininame.split('&'), inicharID); - client.handlePV((`PV#0#CID#${inicharID}`).split('#')); + await client.handleCharacterInfo(ininame.split("&"), inicharID); + client.handlePV(`PV#0#CID#${inicharID}`.split("#")); } window.iniedit = iniedit; @@ -2864,16 +2303,16 @@ window.iniedit = iniedit; * Triggered by the pantilt checkbox */ export async function switchPanTilt() { - const fullview = document.getElementById('client_fullview'); - const checkbox = document.getElementById('client_pantilt'); + const fullview = document.getElementById("client_fullview"); + const checkbox = document.getElementById("client_pantilt"); if (checkbox.checked) { - fullview.style.transition = '0.5s ease-in-out'; + fullview.style.transition = "0.5s ease-in-out"; } else { - fullview.style.transition = 'none'; + fullview.style.transition = "none"; } - return + return; } window.switchPanTilt = switchPanTilt; @@ -2881,13 +2320,17 @@ window.switchPanTilt = switchPanTilt; * Triggered by the change aspect ratio checkbox */ export async function switchAspectRatio() { - const background = document.getElementById('client_gamewindow'); - const offsetCheck = document.getElementById('client_hdviewport_offset'); - if ((document.getElementById('client_hdviewport')).checked) { - background.style.paddingBottom = '56.25%'; + const background = document.getElementById("client_gamewindow"); + const offsetCheck = ( + document.getElementById("client_hdviewport_offset") + ); + if ( + (document.getElementById("client_hdviewport")).checked + ) { + background.style.paddingBottom = "56.25%"; offsetCheck.disabled = false; } else { - background.style.paddingBottom = '75%'; + background.style.paddingBottom = "75%"; offsetCheck.disabled = true; } } @@ -2897,13 +2340,16 @@ window.switchAspectRatio = switchAspectRatio; * Triggered by the change aspect ratio checkbox */ export async function switchChatOffset() { - const container = document.getElementById('client_chatcontainer'); - if ((document.getElementById('client_hdviewport_offset')).checked) { - container.style.width = '80%'; - container.style.left = '10%'; + const container = document.getElementById("client_chatcontainer"); + if ( + (document.getElementById("client_hdviewport_offset")) + .checked + ) { + container.style.width = "80%"; + container.style.left = "10%"; } else { - container.style.width = '100%'; - container.style.left = '0'; + container.style.width = "100%"; + container.style.left = "0"; } } window.switchChatOffset = switchChatOffset; @@ -2913,9 +2359,9 @@ window.switchChatOffset = switchChatOffset; * @param {MouseEvent} event */ export function changeCharacter(_event: Event) { - document.getElementById('client_waiting').style.display = 'block'; - document.getElementById('client_charselect').style.display = 'block'; - document.getElementById('client_emo').innerHTML = ''; + document.getElementById("client_waiting").style.display = "block"; + document.getElementById("client_charselect").style.display = "block"; + document.getElementById("client_emo").innerHTML = ""; } window.changeCharacter = changeCharacter; @@ -2936,7 +2382,7 @@ window.charError = charError; */ export function imgError(image: HTMLImageElement) { image.onerror = null; - image.src = ''; // unload so the old sprite doesn't persist + image.src = ""; // unload so the old sprite doesn't persist return true; } window.imgError = imgError; @@ -2945,18 +2391,20 @@ window.imgError = imgError; * Triggered when there was an error loading a sound * @param {HTMLAudioElement} image the element containing the missing sound */ -export function opusCheck(channel: HTMLAudioElement): OnErrorEventHandlerNonNull{ - const audio = channel.src - if (audio === '') { - return +export function opusCheck( + channel: HTMLAudioElement +): OnErrorEventHandlerNonNull { + const audio = channel.src; + if (audio === "") { + return; } console.info(`failed to load sound ${channel.src}`); - let oldsrc = ''; - let newsrc = ''; + let oldsrc = ""; + let newsrc = ""; oldsrc = channel.src; - if (!oldsrc.endsWith('.opus')) { - newsrc = oldsrc.replace('.mp3', '.opus'); - newsrc = newsrc.replace('.wav', '.opus'); + if (!oldsrc.endsWith(".opus")) { + newsrc = oldsrc.replace(".mp3", ".opus"); + newsrc = newsrc.replace(".wav", ".opus"); channel.src = newsrc; // unload so the old sprite doesn't persist } } @@ -2968,9 +2416,9 @@ window.opusCheck = opusCheck; export function ReconnectButton() { client.cleanup(); client = new Client(serverIP); - + if (client) { - document.getElementById('client_error').style.display = 'none'; + document.getElementById("client_error").style.display = "none"; } } window.ReconnectButton = ReconnectButton; @@ -2980,18 +2428,27 @@ window.ReconnectButton = ReconnectButton; * @param {string} msg the string to be added * @param {string} name the name of the sender */ -function appendICLog(msg: string, showname = '', nameplate = '', time = new Date()) { - const entry = document.createElement('p'); - const shownameField = document.createElement('span'); - const nameplateField = document.createElement('span'); - const textField = document.createElement('span'); - nameplateField.className = 'iclog_name iclog_nameplate'; +export function appendICLog( + msg: string, + showname = "", + nameplate = "", + time = new Date() +) { + const entry = document.createElement("p"); + const shownameField = document.createElement("span"); + const nameplateField = document.createElement("span"); + const textField = document.createElement("span"); + nameplateField.className = "iclog_name iclog_nameplate"; nameplateField.appendChild(document.createTextNode(nameplate)); - shownameField.className = 'iclog_name iclog_showname'; - if (showname === '' || !showname) { shownameField.appendChild(document.createTextNode(nameplate)); } else { shownameField.appendChild(document.createTextNode(showname)); } + shownameField.className = "iclog_name iclog_showname"; + if (showname === "" || !showname) { + shownameField.appendChild(document.createTextNode(nameplate)); + } else { + shownameField.appendChild(document.createTextNode(showname)); + } - textField.className = 'iclog_text'; + textField.className = "iclog_text"; textField.appendChild(document.createTextNode(msg)); entry.appendChild(shownameField); @@ -3000,16 +2457,16 @@ function appendICLog(msg: string, showname = '', nameplate = '', time = new Date // Only put a timestamp if the minute has changed. if (lastICMessageTime.getMinutes() !== time.getMinutes()) { - const timeStamp = document.createElement('span'); - timeStamp.className = 'iclog_time'; + const timeStamp = document.createElement("span"); + timeStamp.className = "iclog_time"; timeStamp.innerText = time.toLocaleTimeString(undefined, { - hour: 'numeric', - minute: '2-digit', + hour: "numeric", + minute: "2-digit", }); entry.appendChild(timeStamp); } - const clientLog = document.getElementById('client_log'); + const clientLog = document.getElementById("client_log"); clientLog.appendChild(entry); /* This is a little buggy - some troubleshooting might be desirable */ @@ -3024,14 +2481,13 @@ function appendICLog(msg: string, showname = '', nameplate = '', time = new Date * check if the message contains an entry on our callword list * @param {string} message */ -export function checkCallword(message: string) { +export function checkCallword(message: string, sfxAudio: HTMLAudioElement) { client.callwords.forEach(testCallword); - function testCallword(item: string) { - if (item !== '' && message.toLowerCase().includes(item.toLowerCase())) { - viewport.sfxaudio.pause(); - viewport.sfxaudio.src = `${AO_HOST}sounds/general/sfx-gallery.opus`; - viewport.sfxaudio.play(); + if (item !== "" && message.toLowerCase().includes(item.toLowerCase())) { + sfxAudio.pause(); + sfxAudio.src = `${AO_HOST}sounds/general/sfx-gallery.opus`; + sfxAudio.play(); } } } @@ -3041,14 +2497,16 @@ export function checkCallword(message: string) { * @param {MouseEvent} event */ export function chartable_filter(_event: Event) { - const searchname = (document.getElementById('client_charactersearch')).value; + const searchname = (( + document.getElementById("client_charactersearch") + )).value; client.chars.forEach((character: any, charid: number) => { const demothing = document.getElementById(`demo_${charid}`); if (character.name.toLowerCase().indexOf(searchname.toLowerCase()) === -1) { - demothing.style.display = 'none'; + demothing.style.display = "none"; } else { - demothing.style.display = 'inline-block'; + demothing.style.display = "inline-block"; } }); } @@ -3062,8 +2520,8 @@ window.chartable_filter = chartable_filter; export function pickChar(ccharacter: number) { if (ccharacter === -1) { // Spectator - document.getElementById('client_waiting').style.display = 'none'; - document.getElementById('client_charselect').style.display = 'none'; + document.getElementById("client_waiting").style.display = "none"; + document.getElementById("client_charselect").style.display = "none"; } client.sendCharacter(ccharacter); } @@ -3076,17 +2534,20 @@ window.pickChar = pickChar; export function pickEmotion(emo: number) { try { if (client.selectedEmote !== -1) { - document.getElementById(`emo_${client.selectedEmote}`).className = 'emote_button'; + document.getElementById(`emo_${client.selectedEmote}`).className = + "emote_button"; } } catch (err) { - // do nothing + // do nothing } client.selectedEmote = emo; - document.getElementById(`emo_${emo}`).className = 'emote_button dark'; + document.getElementById(`emo_${emo}`).className = "emote_button dark"; - (document.getElementById('sendsfx')).checked = (client.emote.sfx.length > 1); + (document.getElementById("sendsfx")).checked = + client.emote.sfx.length > 1; - (document.getElementById('sendpreanim')).checked = (client.emote.zoom == 1); + (document.getElementById("sendpreanim")).checked = + client.emote.zoom == 1; } window.pickEmotion = pickEmotion; @@ -3098,28 +2559,39 @@ export function pickEvidence(evidence: number) { if (client.selectedEvidence !== evidence) { // Update selected evidence if (client.selectedEvidence > 0) { - document.getElementById(`evi_${client.selectedEvidence}`).className = 'evi_icon'; + document.getElementById(`evi_${client.selectedEvidence}`).className = + "evi_icon"; } - document.getElementById(`evi_${evidence}`).className = 'evi_icon dark'; + document.getElementById(`evi_${evidence}`).className = "evi_icon dark"; client.selectedEvidence = evidence; // Show evidence on information window - (document.getElementById('evi_name')).value = client.evidences[evidence - 1].name; - (document.getElementById('evi_desc')).value = client.evidences[evidence - 1].desc; + (document.getElementById("evi_name")).value = + client.evidences[evidence - 1].name; + (document.getElementById("evi_desc")).value = + client.evidences[evidence - 1].desc; // Update icon - const icon_id = getIndexFromSelect('evi_select', client.evidences[evidence - 1].filename); - (document.getElementById('evi_select')).selectedIndex = icon_id; + const icon_id = getIndexFromSelect( + "evi_select", + client.evidences[evidence - 1].filename + ); + (document.getElementById("evi_select")).selectedIndex = + icon_id; if (icon_id === 0) { - (document.getElementById('evi_filename')).value = client.evidences[evidence - 1].filename; + (document.getElementById("evi_filename")).value = + client.evidences[evidence - 1].filename; } updateEvidenceIcon(); // Update button - document.getElementById('evi_add').className = 'client_button hover_button inactive'; - document.getElementById('evi_edit').className = 'client_button hover_button'; - document.getElementById('evi_cancel').className = 'client_button hover_button'; - document.getElementById('evi_del').className = 'client_button hover_button'; + document.getElementById("evi_add").className = + "client_button hover_button inactive"; + document.getElementById("evi_edit").className = + "client_button hover_button"; + document.getElementById("evi_cancel").className = + "client_button hover_button"; + document.getElementById("evi_del").className = "client_button hover_button"; } else { cancelEvidence(); } @@ -3130,13 +2602,15 @@ window.pickEvidence = pickEvidence; * Add evidence. */ export function addEvidence() { - const evidence_select = document.getElementById('evi_select'); + const evidence_select = ( + document.getElementById("evi_select") + ); client.sendPE( - (document.getElementById('evi_name')).value, - (document.getElementById('evi_desc')).value, + (document.getElementById("evi_name")).value, + (document.getElementById("evi_desc")).value, evidence_select.selectedIndex === 0 - ? (document.getElementById('evi_filename')).value - : evidence_select.options[evidence_select.selectedIndex].text, + ? (document.getElementById("evi_filename")).value + : evidence_select.options[evidence_select.selectedIndex].text ); cancelEvidence(); } @@ -3146,15 +2620,17 @@ window.addEvidence = addEvidence; * Edit selected evidence. */ export function editEvidence() { - const evidence_select = document.getElementById('evi_select'); + const evidence_select = ( + document.getElementById("evi_select") + ); const id = client.selectedEvidence - 1; client.sendEE( id, - (document.getElementById('evi_name')).value, - (document.getElementById('evi_desc')).value, + (document.getElementById("evi_name")).value, + (document.getElementById("evi_desc")).value, evidence_select.selectedIndex === 0 - ? (document.getElementById('evi_filename')).value - : evidence_select.options[evidence_select.selectedIndex].text, + ? (document.getElementById("evi_filename")).value + : evidence_select.options[evidence_select.selectedIndex].text ); cancelEvidence(); } @@ -3176,23 +2652,29 @@ window.deleteEvidence = deleteEvidence; export function cancelEvidence() { // Clear evidence data if (client.selectedEvidence > 0) { - document.getElementById(`evi_${client.selectedEvidence}`).className = 'evi_icon'; + document.getElementById(`evi_${client.selectedEvidence}`).className = + "evi_icon"; } client.selectedEvidence = 0; // Clear evidence on information window - (document.getElementById('evi_select')).selectedIndex = 0; + (document.getElementById("evi_select")).selectedIndex = 0; updateEvidenceIcon(); // Update icon widget - (document.getElementById('evi_filename')).value = ''; - (document.getElementById('evi_name')).value = ''; - (document.getElementById('evi_desc')).value = ''; - (document.getElementById('evi_preview')).src = `${AO_HOST}misc/empty.png`; // Clear icon + (document.getElementById("evi_filename")).value = ""; + (document.getElementById("evi_name")).value = ""; + (document.getElementById("evi_desc")).value = ""; + (( + document.getElementById("evi_preview") + )).src = `${AO_HOST}misc/empty.png`; // Clear icon // Update button - document.getElementById('evi_add').className = 'client_button hover_button'; - document.getElementById('evi_edit').className = 'client_button hover_button inactive'; - document.getElementById('evi_cancel').className = 'client_button hover_button inactive'; - document.getElementById('evi_del').className = 'client_button hover_button inactive'; + document.getElementById("evi_add").className = "client_button hover_button"; + document.getElementById("evi_edit").className = + "client_button hover_button inactive"; + document.getElementById("evi_cancel").className = + "client_button hover_button inactive"; + document.getElementById("evi_del").className = + "client_button hover_button inactive"; } window.cancelEvidence = cancelEvidence; @@ -3217,16 +2699,20 @@ window.getIndexFromSelect = getIndexFromSelect; * Set the style of the chatbox */ export function setChatbox(style: string) { - const chatbox_theme = document.getElementById('chatbox_theme'); - const themeselect = document.getElementById('client_chatboxselect'); + const chatbox_theme = ( + document.getElementById("chatbox_theme") + ); + const themeselect = ( + document.getElementById("client_chatboxselect") + ); const selected_theme = themeselect.value; - setCookie('chatbox', selected_theme); - if (selected_theme === 'dynamic') { + 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'; + chatbox_theme.href = "styles/chatbox/aa.css"; } } else { chatbox_theme.href = `styles/chatbox/${selected_theme}.css`; @@ -3238,8 +2724,8 @@ 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; + const chatContainerBox = document.getElementById("client_chatcontainer"); + const gameHeight = document.getElementById("client_background").offsetHeight; chatContainerBox.style.fontSize = `${(gameHeight * 0.0521).toFixed(1)}px`; } @@ -3249,16 +2735,26 @@ window.resizeChatbox = resizeChatbox; * Update evidence icon. */ export function updateEvidenceIcon() { - const evidence_select = document.getElementById('evi_select'); - const evidence_filename = document.getElementById('evi_filename'); - const evidence_iconbox = document.getElementById('evi_preview'); + const evidence_select = ( + document.getElementById("evi_select") + ); + const evidence_filename = ( + document.getElementById("evi_filename") + ); + const evidence_iconbox = ( + document.getElementById("evi_preview") + ); if (evidence_select.selectedIndex === 0) { - evidence_filename.style.display = 'initial'; - evidence_iconbox.src = `${AO_HOST}evidence/${encodeURI(evidence_filename.value.toLowerCase())}`; + evidence_filename.style.display = "initial"; + evidence_iconbox.src = `${AO_HOST}evidence/${encodeURI( + evidence_filename.value.toLowerCase() + )}`; } else { - evidence_filename.style.display = 'none'; - evidence_iconbox.src = `${AO_HOST}evidence/${encodeURI(evidence_select.value.toLowerCase())}`; + evidence_filename.style.display = "none"; + evidence_iconbox.src = `${AO_HOST}evidence/${encodeURI( + evidence_select.value.toLowerCase() + )}`; } } window.updateEvidenceIcon = updateEvidenceIcon; @@ -3267,16 +2763,21 @@ window.updateEvidenceIcon = updateEvidenceIcon; * Update evidence icon. */ export function updateActionCommands(side: string) { - if (side === 'jud') { - document.getElementById('judge_action').style.display = 'inline-table'; - document.getElementById('no_action').style.display = 'none'; + if (side === "jud") { + document.getElementById("judge_action").style.display = "inline-table"; + document.getElementById("no_action").style.display = "none"; } else { - document.getElementById('judge_action').style.display = 'none'; - document.getElementById('no_action').style.display = 'inline-table'; + document.getElementById("judge_action").style.display = "none"; + document.getElementById("no_action").style.display = "inline-table"; } // Update role selector - for (let i = 0, role_select = document.getElementById('role_select'); i < role_select.options.length; i++) { + for ( + let i = 0, + role_select = document.getElementById("role_select"); + i < role_select.options.length; + i++ + ) { if (side === role_select.options[i].value) { role_select.options.selectedIndex = i; return; @@ -3289,18 +2790,22 @@ window.updateActionCommands = updateActionCommands; * Change background via OOC. */ export function changeBackgroundOOC() { - const selectedBG = document.getElementById('bg_select'); + const selectedBG = document.getElementById("bg_select"); const changeBGCommand = "bg $1"; - const bgFilename = document.getElementById('bg_filename'); + const bgFilename = document.getElementById("bg_filename"); - let filename = ''; + let filename = ""; if (selectedBG.selectedIndex === 0) { filename = bgFilename.value; } else { filename = selectedBG.value; } - if (mode === 'join') { client.sendOOC(`/${changeBGCommand.replace('$1', filename)}`); } else if (mode === 'replay') { client.sendSelf(`BN#${filename}#%`); } + if (mode === "join") { + client.sendOOC(`/${changeBGCommand.replace("$1", filename)}`); + } else if (mode === "replay") { + client.sendSelf(`BN#${filename}#%`); + } } window.changeBackgroundOOC = changeBackgroundOOC; @@ -3308,7 +2813,7 @@ window.changeBackgroundOOC = changeBackgroundOOC; * Change role via OOC. */ export function changeRoleOOC() { - const roleselect = document.getElementById('role_select'); + const roleselect = document.getElementById("role_select"); client.sendOOC(`/pos ${roleselect.value}`); client.sendServer(`SP#${roleselect.value}#%`); @@ -3329,10 +2834,10 @@ window.randomCharacterOOC = randomCharacterOOC; */ export function callMod() { let modcall; - if (extrafeatures.includes('modcall_reason')) { - modcall = prompt('Please enter the reason for the modcall', ''); + if (extrafeatures.includes("modcall_reason")) { + modcall = prompt("Please enter the reason for the modcall", ""); } - if (modcall == null || modcall === '') { + if (modcall == null || modcall === "") { // cancel } else { client.sendZZ(modcall); @@ -3344,7 +2849,7 @@ window.callMod = callMod; * Declare witness testimony. */ export function initWT() { - client.sendRT('testimony1'); + client.sendRT("testimony1"); } window.initWT = initWT; @@ -3352,7 +2857,7 @@ window.initWT = initWT; * Declare cross examination. */ export function initCE() { - client.sendRT('testimony2'); + client.sendRT("testimony2"); } window.initCE = initCE; @@ -3360,7 +2865,7 @@ window.initCE = initCE; * Declare the defendant not guilty */ export function notguilty() { - client.sendRT('judgeruling#0'); + client.sendRT("judgeruling#0"); } window.notguilty = notguilty; @@ -3368,7 +2873,7 @@ window.notguilty = notguilty; * Declare the defendant not guilty */ export function guilty() { - client.sendRT('judgeruling#1'); + client.sendRT("judgeruling#1"); } window.guilty = guilty; @@ -3376,7 +2881,7 @@ window.guilty = guilty; * Increment defense health point. */ export function addHPD() { - client.sendHP(1, (client.hp[0] + 1)); + client.sendHP(1, client.hp[0] + 1); } window.addHPD = addHPD; @@ -3384,7 +2889,7 @@ window.addHPD = addHPD; * Decrement defense health point. */ export function redHPD() { - client.sendHP(1, (client.hp[0] - 1)); + client.sendHP(1, client.hp[0] - 1); } window.redHPD = redHPD; @@ -3392,7 +2897,7 @@ window.redHPD = redHPD; * Increment prosecution health point. */ export function addHPP() { - client.sendHP(2, (client.hp[1] + 1)); + client.sendHP(2, client.hp[1] + 1); } window.addHPP = addHPP; @@ -3400,7 +2905,7 @@ window.addHPP = addHPP; * Decrement prosecution health point. */ export function redHPP() { - client.sendHP(2, (client.hp[1] - 1)); + client.sendHP(2, client.hp[1] - 1); } window.redHPP = redHPP; @@ -3408,16 +2913,26 @@ window.redHPP = redHPP; * Update background preview. */ export function updateBackgroundPreview() { - const background_select = document.getElementById('bg_select'); - const background_filename = document.getElementById('bg_filename'); - const background_preview = document.getElementById('bg_preview'); + const background_select = ( + document.getElementById("bg_select") + ); + const background_filename = ( + document.getElementById("bg_filename") + ); + const background_preview = ( + document.getElementById("bg_preview") + ); if (background_select.selectedIndex === 0) { - background_filename.style.display = 'initial'; - background_preview.src = `${AO_HOST}background/${encodeURI(background_filename.value.toLowerCase())}/defenseempty.png`; + background_filename.style.display = "initial"; + background_preview.src = `${AO_HOST}background/${encodeURI( + background_filename.value.toLowerCase() + )}/defenseempty.png`; } else { - background_filename.style.display = 'none'; - background_preview.src = `${AO_HOST}background/${encodeURI(background_select.value.toLowerCase())}/defenseempty.png`; + background_filename.style.display = "none"; + background_preview.src = `${AO_HOST}background/${encodeURI( + background_select.value.toLowerCase() + )}/defenseempty.png`; } } window.updateBackgroundPreview = updateBackgroundPreview; @@ -3428,10 +2943,12 @@ window.updateBackgroundPreview = updateBackgroundPreview; */ export function toggleMenu(menu: number) { if (menu !== selectedMenu) { - document.getElementById(`menu_${menu}`).className = 'menu_button active'; - document.getElementById(`content_${menu}`).className = 'menu_content active'; - document.getElementById(`menu_${selectedMenu}`).className = 'menu_button'; - document.getElementById(`content_${selectedMenu}`).className = 'menu_content'; + document.getElementById(`menu_${menu}`).className = "menu_button active"; + document.getElementById(`content_${menu}`).className = + "menu_content active"; + document.getElementById(`menu_${selectedMenu}`).className = "menu_button"; + document.getElementById(`content_${selectedMenu}`).className = + "menu_content"; selectedMenu = menu; } } @@ -3444,15 +2961,16 @@ window.toggleMenu = toggleMenu; */ export function toggleShout(shout: number) { if (shout === selectedShout) { - document.getElementById(`button_${shout}`).className = 'client_button'; + document.getElementById(`button_${shout}`).className = "client_button"; selectedShout = 0; } else { - document.getElementById(`button_${shout}`).className = 'client_button dark'; + document.getElementById(`button_${shout}`).className = "client_button dark"; if (selectedShout) { - document.getElementById(`button_${selectedShout}`).className = 'client_button'; + document.getElementById(`button_${selectedShout}`).className = + "client_button"; } selectedShout = shout; } } window.toggleShout = toggleShout; -export default Client +export default Client; diff --git a/webAO/client/setEmote.js b/webAO/client/setEmote.js deleted file mode 100644 index f682fe5..0000000 --- a/webAO/client/setEmote.js +++ /dev/null @@ -1,40 +0,0 @@ -import transparentPng from '../constants/transparentPng'; -import fileExists from '../utils/fileExists'; - -/** - * Sets all the img tags to the right sources - * @param {*} chatmsg - */ - -const setEmote = async (AO_HOST, client, charactername, emotename, prefix, pair, side) => { - const pairID = pair ? 'pair' : 'char'; - const characterFolder = `${AO_HOST}characters/`; - const acceptedPositions = ['def', 'pro', 'wit']; - const position = acceptedPositions.includes(side) ? `${side}_` : ''; - const emoteSelector = document.getElementById(`client_${position}${pairID}_img`) - const extensionsMap = [ - '.gif', - '.png', - '.apng', - '.webp' - ]; - - for (const extension of extensionsMap) { - // Hides all sprites before creating a new sprite - if (client.lastChar !== client.chatmsg.name) { - emoteSelector.src = transparentPng; - } - let url; - if (extension === '.png') { - url = `${characterFolder}${encodeURI(charactername)}/${encodeURI(emotename)}${extension}`; - } else { - url = `${characterFolder}${encodeURI(charactername)}/${encodeURI(prefix)}${encodeURI(emotename)}${extension}`; - } - const exists = await fileExists(url); - if (exists) { - emoteSelector.src = url; - break; - } - } -}; -export default setEmote; diff --git a/webAO/client/setEmote.ts b/webAO/client/setEmote.ts new file mode 100644 index 0000000..1f0de07 --- /dev/null +++ b/webAO/client/setEmote.ts @@ -0,0 +1,51 @@ +import Client from "../client"; +import transparentPng from "../constants/transparentPng"; +import fileExists from "../utils/fileExists"; + +/** + * Sets all the img tags to the right sources + * @param {*} chatmsg + */ + +const setEmote = async ( + AO_HOST: string, + client: Client, + charactername: string, + emotename: string, + prefix: string, + pair: boolean, + side: string +) => { + const pairID = pair ? "pair" : "char"; + const characterFolder = `${AO_HOST}characters/`; + const acceptedPositions = ["def", "pro", "wit"]; + const position = acceptedPositions.includes(side) ? `${side}_` : ""; + const emoteSelector = document.getElementById( + `client_${position}${pairID}_img` + ) as HTMLImageElement; + const extensionsMap = [".gif", ".png", ".apng", ".webp"]; + + for (const extension of extensionsMap) { + // Hides all sprites before creating a new sprite + + if (client.viewport.lastChar !== client.viewport.chatmsg.name) { + emoteSelector.src = transparentPng; + } + let url; + if (extension === ".png") { + url = `${characterFolder}${encodeURI(charactername)}/${encodeURI( + emotename + )}${extension}`; + } else { + url = `${characterFolder}${encodeURI(charactername)}/${encodeURI( + prefix + )}${encodeURI(emotename)}${extension}`; + } + const exists = await fileExists(url); + if (exists) { + emoteSelector.src = url; + break; + } + } +}; +export default setEmote; diff --git a/webAO/viewport.ts b/webAO/viewport.ts new file mode 100644 index 0000000..f680162 --- /dev/null +++ b/webAO/viewport.ts @@ -0,0 +1,1053 @@ +import tryUrls from "./utils/tryUrls"; +import fileExists from "./utils/fileExists"; +import Client, { opusCheck } from "./client"; +import { delay } from "./client"; +import { UPDATE_INTERVAL } from "./client"; +import { setChatbox } from "./client"; +import { resizeChatbox } from "./client"; +import transparentPng from "./constants/transparentPng"; +import mlConfig from "./utils/aoml"; +import { appendICLog } from "./client"; +import { checkCallword } from "./client"; +import setEmote from "./client/setEmote"; +import getAnimLength from "./utils/getAnimLength"; +import { safeTags } from "./encoding"; +import setCookie from "./utils/setCookie"; +interface ChatMsg { + content: string; + objection: number; + sound: string; + startpreanim: boolean; + startspeaking: boolean; + side: any; + color: number; + snddelay: number; + preanimdelay: number; + speed: number; + blips: string; + self_offset?: number[]; + other_offset?: number[]; + showname?: string; + nameplate?: string; + flip?: number; + other_flip?: number; + effects?: string[]; + deskmod?: number; + preanim?: string; + other_name?: string; + sprite?: string; + name?: string; + chatbox?: string; + other_emote?: string; + parsed?: HTMLSpanElement[]; + screenshake?: number; + flash?: number; + type?: number; + evidence?: number; + looping_sfx?: boolean; + noninterrupting_preanim?: number; +} +interface Testimony { + [key: number]: string; +} +export interface Viewport { + chat_tick: Function; + changeMusicVolume: Function; + changeBlipVolume: Function; + reloadTheme: Function; + playSFX: Function; + set_side: Function; + initTestimonyUpdater: Function; + updateTestimony: Function; + disposeTestimony: Function; + handle_ic_speaking: Function; + handleTextTick: Function; + theme: string; + chatmsg: ChatMsg; + sfxaudio: HTMLAudioElement; + blipChannels: HTMLAudioElement[]; + music: any; + musicVolume: number; + bgFolder: string; + bgname: string; + lastChar: string; +} +const viewport = (masterClient: Client, AO_HOST: string): Viewport => { + const attorneyMarkdown = mlConfig(AO_HOST); + let client = masterClient; + let textnow = ""; + let chatmsg = { + content: "", + objection: 0, + sound: "", + startpreanim: true, + startspeaking: false, + side: null, + color: 0, + snddelay: 0, + preanimdelay: 0, + speed: UPDATE_INTERVAL, + } as ChatMsg; + let shouts = [undefined, "holdit", "objection", "takethat", "custom"]; + let colors = [ + "white", + "green", + "red", + "orange", + "blue", + "yellow", + "pink", + "cyan", + "grey", + ]; + const blipSelectors = document.getElementsByClassName( + "blipSound" + ) as HTMLCollectionOf; + + let blipChannels = [...blipSelectors]; + // Allocate multiple blip audio channels to make blips less jittery + blipChannels.forEach((channel: HTMLAudioElement) => (channel.volume = 0.5)); + blipChannels.forEach( + (channel: HTMLAudioElement) => (channel.onerror = opusCheck(channel)) + ); + let currentBlipChannel = 0; + let sfxaudio = document.getElementById("client_sfxaudio") as HTMLAudioElement; + sfxaudio.src = `${AO_HOST}sounds/general/sfx-realization.opus`; + let sfxplayed = 0; + + let shoutaudio = document.getElementById( + "client_shoutaudio" + ) as HTMLAudioElement; + shoutaudio.src = `${AO_HOST}misc/default/objection.opus`; + + let testimonyAudio = document.getElementById( + "client_testimonyaudio" + ) as HTMLAudioElement; + testimonyAudio.src = `${AO_HOST}sounds/general/sfx-guilty.opus`; + + const audioChannels = document.getElementsByClassName( + "audioChannel" + ) as HTMLCollectionOf; + let music: any; + music = [...audioChannels]; + music.forEach((channel: HTMLAudioElement) => (channel.volume = 0.5)); + music.forEach( + (channel: HTMLAudioElement) => (channel.onerror = opusCheck(channel)) + ); + let musicVolume = 0; + let updater: any; + let testimonyUpdater: any; + let bgname = "gs4"; + let lastChar = ""; + let lastEvi = 0; + let testimonyTimer = 0; + let shoutTimer = 0; + let tickTimer = 0; + let _animating = false; + let startFirstTickCheck: boolean; + let startSecondTickCheck: boolean; + let startThirdTickCheck: boolean; + let theme: string; + const bgFolder = `${AO_HOST}background/${encodeURI(bgname.toLowerCase())}/`; + /** + * Sets the volume of the music. + * @param {number} volume + */ + const changeMusicVolume = (volume: number = -1) => { + const clientVolume = Number( + (document.getElementById("client_mvolume")).value + ); + let musicVolume = volume === -1 ? clientVolume : volume; + music.forEach( + (channel: HTMLAudioElement) => (channel.volume = musicVolume) + ); + setCookie("musicVolume", String(musicVolume)); + }; + window.changeMusicVolume = changeMusicVolume; + + /** + * Play any SFX + * + * @param {string} sfxname + */ + const playSFX = async (sfxname: string, looping: boolean) => { + sfxaudio.pause(); + sfxaudio.loop = looping; + sfxaudio.src = sfxname; + sfxaudio.play(); + }; + + /** + * Changes the viewport background based on a given position. + * + * Valid positions: `def, pro, hld, hlp, wit, jud, jur, sea` + * @param {string} position the position to change into + */ + const set_side = async ({ + position, + showSpeedLines, + showDesk, + }: { + position: string; + showSpeedLines: boolean; + showDesk: boolean; + }) => { + const view = document.getElementById("client_fullview"); + + let bench: HTMLImageElement; + if ("def,pro,wit".includes(position)) { + bench = ( + document.getElementById(`client_${position}_bench`) + ); + } else { + bench = document.getElementById("client_bench_classic"); + } + + let court: HTMLImageElement; + if ("def,pro,wit".includes(position)) { + court = ( + document.getElementById(`client_court_${position}`) + ); + } else { + court = document.getElementById("client_court_classic"); + } + + interface Desk { + ao2?: string; + ao1?: string; + } + interface Position { + bg?: string; + desk?: Desk; + speedLines: string; + } + + interface Positions { + [key: string]: Position; + } + + const positions: Positions = { + def: { + bg: "defenseempty", + desk: { ao2: "defensedesk.png", ao1: "bancodefensa.png" } as Desk, + speedLines: "defense_speedlines.gif", + }, + pro: { + bg: "prosecutorempty", + desk: { ao2: "prosecutiondesk.png", ao1: "bancoacusacion.png" } as Desk, + speedLines: "prosecution_speedlines.gif", + }, + hld: { + bg: "helperstand", + desk: null as Desk, + speedLines: "defense_speedlines.gif", + }, + hlp: { + bg: "prohelperstand", + desk: null as Desk, + speedLines: "prosecution_speedlines.gif", + }, + wit: { + bg: "witnessempty", + desk: { ao2: "stand.png", ao1: "estrado.png" } as Desk, + speedLines: "prosecution_speedlines.gif", + }, + jud: { + bg: "judgestand", + desk: { ao2: "judgedesk.png", ao1: "judgedesk.gif" } as Desk, + speedLines: "prosecution_speedlines.gif", + }, + jur: { + bg: "jurystand", + desk: { ao2: "jurydesk.png", ao1: "estrado.png" } as Desk, + speedLines: "defense_speedlines.gif", + }, + sea: { + bg: "seancestand", + desk: { ao2: "seancedesk.png", ao1: "estrado.png" } as Desk, + speedLines: "prosecution_speedlines.gif", + }, + }; + + let bg; + let desk; + let speedLines; + + if ("def,pro,hld,hlp,wit,jud,jur,sea".includes(position)) { + bg = positions[position].bg; + desk = positions[position].desk; + speedLines = positions[position].speedLines; + } else { + bg = `${position}`; + desk = { ao2: `${position}_overlay.png`, ao1: "_overlay.png" }; + speedLines = "defense_speedlines.gif"; + } + + if (showSpeedLines === true) { + court.src = `${AO_HOST}themes/default/${encodeURI(speedLines)}`; + } else { + court.src = await tryUrls(bgFolder + bg); + } + + if (showDesk === true && desk) { + const deskFilename = (await fileExists(bgFolder + desk.ao2)) + ? desk.ao2 + : desk.ao1; + bench.src = bgFolder + deskFilename; + bench.style.opacity = "1"; + } else { + bench.style.opacity = "0"; + } + + if ("def,pro,wit".includes(position)) { + view.style.display = ""; + document.getElementById("client_classicview").style.display = "none"; + switch (position) { + case "def": + view.style.left = "0"; + break; + case "wit": + view.style.left = "-200%"; + break; + case "pro": + view.style.left = "-400%"; + break; + } + } else { + view.style.display = "none"; + document.getElementById("client_classicview").style.display = ""; + } + }; + + /** + * Intialize testimony updater + */ + const initTestimonyUpdater = () => { + const testimonyFilenames: Testimony = { + 1: "witnesstestimony", + 2: "crossexamination", + 3: "notguilty", + 4: "guilty", + }; + + const testimony = testimonyFilenames[masterClient.testimonyID]; + if (!testimony) { + console.warn(`Invalid testimony ID ${masterClient.testimonyID}`); + return; + } + + testimonyAudio.src = masterClient.resources[testimony].sfx; + testimonyAudio.play(); + + const testimonyOverlay = ( + document.getElementById("client_testimony") + ); + testimonyOverlay.src = masterClient.resources[testimony].src; + testimonyOverlay.style.opacity = "1"; + + testimonyTimer = 0; + testimonyUpdater = setTimeout(() => updateTestimony(), UPDATE_INTERVAL); + }; + + /** + * Updates the testimony overaly + */ + const updateTestimony = () => { + const testimonyFilenames: Testimony = { + 1: "witnesstestimony", + 2: "crossexamination", + 3: "notguilty", + 4: "guilty", + }; + + // Update timer + testimonyTimer += UPDATE_INTERVAL; + + const testimony = testimonyFilenames[masterClient.testimonyID]; + const resource = masterClient.resources[testimony]; + if (!resource) { + disposeTestimony(); + return; + } + + if (testimonyTimer >= resource.duration) { + disposeTestimony(); + } else { + testimonyUpdater = setTimeout(() => updateTestimony(), UPDATE_INTERVAL); + } + }; + + /** + * Dispose the testimony overlay + */ + const disposeTestimony = () => { + masterClient.testimonyID = 0; + testimonyTimer = 0; + document.getElementById("client_testimony").style.opacity = "0"; + clearTimeout(testimonyUpdater); + }; + + /** + * Sets a new emote. + * This sets up everything before the tick() loops starts + * a lot of things can probably be moved here, like starting the shout animation if there is one + * TODO: the preanim logic, on the other hand, should probably be moved to tick() + * @param {object} chatmsg the new chat message + */ + const handle_ic_speaking = async (playerChatMsg: ChatMsg) => { + chatmsg = playerChatMsg; + textnow = ""; + sfxplayed = 0; + tickTimer = 0; + _animating = true; + startFirstTickCheck = true; + startSecondTickCheck = false; + startThirdTickCheck = false; + let charLayers = document.getElementById("client_char"); + let pairLayers = document.getElementById("client_pair_char"); + console.log(chatmsg); + console.log("FICLK YOPU"); + // stop updater + clearTimeout(updater); + + // stop last sfx from looping any longer + sfxaudio.loop = false; + + const fg = document.getElementById("client_fg"); + const gamewindow = document.getElementById("client_gamewindow"); + const waitingBox = document.getElementById("client_chatwaiting"); + + // Reset CSS animation + gamewindow.style.animation = ""; + waitingBox.style.opacity = "0"; + + const eviBox = document.getElementById("client_evi"); + + if (lastEvi !== chatmsg.evidence) { + eviBox.style.opacity = "0"; + eviBox.style.height = "0%"; + } + lastEvi = chatmsg.evidence; + + const validSides: string[] = ["def", "pro", "wit"]; // these are for the full view pan, the other positions use 'client_char' + if (validSides.includes(chatmsg.side)) { + charLayers = document.getElementById(`client_${chatmsg.side}_char`); + pairLayers = document.getElementById(`client_${chatmsg.side}_pair_char`); + } + + const chatContainerBox = document.getElementById("client_chatcontainer"); + const nameBoxInner = document.getElementById("client_inner_name"); + const chatBoxInner = document.getElementById("client_inner_chat"); + + const displayname = + (document.getElementById("showname")).checked && + chatmsg.showname !== "" + ? chatmsg.showname + : chatmsg.nameplate; + + // Clear out the last message + chatBoxInner.innerText = textnow; + nameBoxInner.innerText = displayname; + + if (lastChar !== chatmsg.name) { + charLayers.style.opacity = "0"; + pairLayers.style.opacity = "0"; + } + lastChar = chatmsg.name; + + appendICLog(chatmsg.content, chatmsg.showname, chatmsg.nameplate); + + checkCallword(chatmsg.content, sfxaudio); + + setEmote( + AO_HOST, + client, + chatmsg.name.toLowerCase(), + chatmsg.sprite, + "(a)", + false, + chatmsg.side + ); + + if (chatmsg.other_name) { + setEmote( + AO_HOST, + client, + chatmsg.other_name.toLowerCase(), + chatmsg.other_emote, + "(a)", + false, + chatmsg.side + ); + } + + // gets which shout shall played + const shoutSprite = ( + document.getElementById("client_shout") + ); + const shout = shouts[chatmsg.objection]; + if (shout) { + // Hide message box + chatContainerBox.style.opacity = "0"; + if (chatmsg.objection === 4) { + shoutSprite.src = `${AO_HOST}characters/${encodeURI( + chatmsg.name.toLowerCase() + )}/custom.gif`; + } else { + shoutSprite.src = masterClient.resources[shout].src; + shoutSprite.style.animation = "bubble 700ms steps(10, jump-both)"; + } + shoutSprite.style.opacity = "1"; + + shoutaudio.src = `${AO_HOST}characters/${encodeURI( + chatmsg.name.toLowerCase() + )}/${shout}.opus`; + shoutaudio.play(); + shoutTimer = masterClient.resources[shout].duration; + } else { + shoutTimer = 0; + } + + chatmsg.startpreanim = true; + let gifLength = 0; + + if (chatmsg.type === 1 && chatmsg.preanim !== "-") { + //we have a preanim + chatContainerBox.style.opacity = "0"; + gifLength = await getAnimLength( + `${AO_HOST}characters/${encodeURI( + chatmsg.name.toLowerCase() + )}/${encodeURI(chatmsg.preanim)}` + ); + console.debug("preanim is " + gifLength + " long"); + chatmsg.startspeaking = false; + } else { + chatmsg.startspeaking = true; + if (chatmsg.content !== "") chatContainerBox.style.opacity = "1"; + } + chatmsg.preanimdelay = gifLength; + const setAside = { + position: chatmsg.side, + showSpeedLines: false, + showDesk: false, + }; + let skipoffset: boolean = false; + if (chatmsg.type === 5) { + setAside.showSpeedLines = true; + setAside.showDesk = false; + set_side(setAside); + } else { + switch (Number(chatmsg.deskmod)) { + case 0: //desk is hidden + setAside.showSpeedLines = false; + setAside.showDesk = false; + set_side(setAside); + break; + case 1: //desk is shown + setAside.showSpeedLines = false; + setAside.showDesk = true; + set_side(setAside); + break; + case 2: //desk is hidden during preanim, but shown during idle/talk + setAside.showSpeedLines = false; + setAside.showDesk = false; + set_side(setAside); + break; + case 3: //opposite of 2 + setAside.showSpeedLines = false; + setAside.showDesk = false; + set_side(setAside); + break; + case 4: //desk is hidden, character offset is ignored, pair character is hidden during preanim, normal behavior during idle/talk + setAside.showSpeedLines = false; + setAside.showDesk = false; + set_side(setAside); + skipoffset = true; + break; + case 5: //opposite of 4 + setAside.showSpeedLines = false; + setAside.showDesk = true; + set_side(setAside); + break; + default: + setAside.showSpeedLines = false; + setAside.showDesk = true; + set_side(setAside); + break; + } + } + + setChatbox(chatmsg.chatbox); + resizeChatbox(); + + if (!skipoffset) { + // Flip the character + charLayers.style.transform = + chatmsg.flip === 1 ? "scaleX(-1)" : "scaleX(1)"; + pairLayers.style.transform = + chatmsg.other_flip === 1 ? "scaleX(-1)" : "scaleX(1)"; + + // Shift by the horizontal offset + switch (chatmsg.side) { + case "wit": + pairLayers.style.left = `${200 + Number(chatmsg.other_offset[0])}%`; + charLayers.style.left = `${200 + Number(chatmsg.self_offset[0])}%`; + break; + case "pro": + pairLayers.style.left = `${400 + Number(chatmsg.other_offset[0])}%`; + charLayers.style.left = `${400 + Number(chatmsg.self_offset[0])}%`; + break; + default: + pairLayers.style.left = `${Number(chatmsg.other_offset[0])}%`; + charLayers.style.left = `${Number(chatmsg.self_offset[0])}%`; + break; + } + + // New vertical offsets + pairLayers.style.top = `${Number(chatmsg.other_offset[1])}%`; + charLayers.style.top = `${Number(chatmsg.self_offset[1])}%`; + } + + blipChannels.forEach( + (channel: HTMLAudioElement) => + (channel.src = `${AO_HOST}sounds/general/sfx-blip${encodeURI( + chatmsg.blips.toLowerCase() + )}.opus`) + ); + + // process markup + if (chatmsg.content.startsWith("~~")) { + chatBoxInner.style.textAlign = "center"; + chatmsg.content = chatmsg.content.substring(2, chatmsg.content.length); + } else { + chatBoxInner.style.textAlign = "inherit"; + } + + // apply effects + fg.style.animation = ""; + const badEffects = ["", "-", "none"]; + if ( + chatmsg.effects[0] && + !badEffects.includes(chatmsg.effects[0].toLowerCase()) + ) { + const baseEffectUrl = `${AO_HOST}themes/default/effects/`; + fg.src = `${baseEffectUrl}${encodeURI( + chatmsg.effects[0].toLowerCase() + )}.webp`; + } else { + fg.src = transparentPng; + } + + charLayers.style.opacity = "1"; + + const soundChecks = ["0", "1", "", undefined]; + if (soundChecks.some((check) => chatmsg.sound === check)) { + chatmsg.sound = chatmsg.effects[2]; + } + chatmsg.parsed = await attorneyMarkdown.applyMarkdown( + chatmsg.content, + colors[chatmsg.color] + ); + console.log("ASSHOLE"); + chat_tick(); + }; + + const handleTextTick = async (charLayers: HTMLImageElement) => { + console.log("tick"); + const chatBox = document.getElementById("client_chat"); + const waitingBox = document.getElementById("client_chatwaiting"); + const chatBoxInner = document.getElementById("client_inner_chat"); + const charName = chatmsg.name.toLowerCase(); + const charEmote = chatmsg.sprite.toLowerCase(); + + if (chatmsg.content.charAt(textnow.length) !== " ") { + blipChannels[currentBlipChannel].play(); + currentBlipChannel++; + currentBlipChannel %= blipChannels.length; + } + textnow = chatmsg.content.substring(0, textnow.length + 1); + console.log(textnow); + const characterElement = chatmsg.parsed[textnow.length - 1]; + if (characterElement) { + const COMMAND_IDENTIFIER = "\\"; + + const nextCharacterElement = chatmsg.parsed[textnow.length]; + const flash = async () => { + const effectlayer = document.getElementById("client_fg"); + playSFX(`${AO_HOST}sounds/general/sfx-realization.opus`, false); + effectlayer.style.animation = "flash 0.4s 1"; + await delay(400); + effectlayer.style.removeProperty("animation"); + }; + + const shake = async () => { + const gamewindow = document.getElementById("client_gamewindow"); + playSFX(`${AO_HOST}sounds/general/sfx-stab.opus`, false); + gamewindow.style.animation = "shake 0.2s 1"; + await delay(200); + gamewindow.style.removeProperty("animation"); + }; + + const commands = new Map( + Object.entries({ + s: shake, + f: flash, + }) + ); + const textSpeeds = new Set(["{", "}"]); + + // Changing Text Speed + if (textSpeeds.has(characterElement.innerHTML)) { + // Grab them all in a row + const MAX_SLOW_CHATSPEED = 120; + for (let i = textnow.length; i < chatmsg.content.length; i++) { + const currentCharacter = chatmsg.parsed[i - 1].innerHTML; + if (currentCharacter === "}") { + if (chatmsg.speed > 0) { + chatmsg.speed -= 20; + } + } else if (currentCharacter === "{") { + if (chatmsg.speed < MAX_SLOW_CHATSPEED) { + chatmsg.speed += 20; + } + } else { + // No longer at a speed character + textnow = chatmsg.content.substring(0, i); + break; + } + } + } + + if ( + characterElement.innerHTML === COMMAND_IDENTIFIER && + commands.has(nextCharacterElement?.innerHTML) + ) { + textnow = chatmsg.content.substring(0, textnow.length + 1); + await commands.get(nextCharacterElement.innerHTML)(); + } else { + chatBoxInner.appendChild(chatmsg.parsed[textnow.length - 1]); + } + } + console.log("ass"); + // scroll to bottom + chatBox.scrollTop = chatBox.scrollHeight; + + if (textnow === chatmsg.content) { + _animating = false; + setEmote( + AO_HOST, + client, + charName, + charEmote, + "(a)", + false, + chatmsg.side + ); + charLayers.style.opacity = "1"; + waitingBox.style.opacity = "1"; + clearTimeout(updater); + } + }; + /** + * Updates the chatbox based on the given text. + * + * OK, here's the documentation on how this works: + * + * 1 _animating + * If we're not done with this characters animation, i.e. his text isn't fully there, set a timeout for the next tick/step to happen + * + * 2 startpreanim + * If the shout timer is over it starts with the preanim + * The first thing it checks for is the shake effect (TODO on client this is handled by the @ symbol and not a flag ) + * Then is the flash/realization effect + * After that, the shout image set to be transparent + * and the main characters preanim gif is loaded + * If pairing is supported the paired character will just stand around with his idle sprite + * + * 3 preanimdelay over + * this animates the evidence popup and finally shows the character name and message box + * it sets the text color and the character speaking sprite + * + * 4 textnow != content + * this adds a character to the textbox and stops the animations if the entire message is present in the textbox + * + * 5 sfx + * independent of the stuff above, this will play any sound effects specified by the emote the character sent. + * happens after the shout delay + an sfx delay that comes with the message packet + * + * XXX: This relies on a global variable `chatmsg`! + */ + const chat_tick = async () => { + // note: this is called fairly often + // do not perform heavy operations here + + await delay(chatmsg.speed); + console.log("WHERE IS THE CHATMSG"); + console.log(chatmsg); + console.log(textnow + " UH " + chatmsg.content); + if (textnow === chatmsg.content) { + return; + } + + const gamewindow = document.getElementById("client_gamewindow"); + const waitingBox = document.getElementById("client_chatwaiting"); + const eviBox = document.getElementById("client_evi"); + const shoutSprite = ( + document.getElementById("client_shout") + ); + const effectlayer = document.getElementById("client_fg"); + const chatBoxInner = document.getElementById("client_inner_chat"); + let charLayers = document.getElementById("client_char"); + let pairLayers = ( + document.getElementById("client_pair_char") + ); + + const validSides: string[] = ["def", "pro", "wit"]; // these are for the full view pan, the other positions use 'client_char' + if (validSides.includes(chatmsg.side)) { + charLayers = ( + document.getElementById(`client_${chatmsg.side}_char`) + ); + pairLayers = ( + document.getElementById(`client_${chatmsg.side}_pair_char`) + ); + } + + const charName = chatmsg.name.toLowerCase(); + const charEmote = chatmsg.sprite.toLowerCase(); + + const pairName = chatmsg.other_name.toLowerCase(); + const pairEmote = chatmsg.other_emote.toLowerCase(); + + // TODO: preanims sometimes play when they're not supposed to + const isShoutOver = tickTimer >= shoutTimer; + const isShoutAndPreanimOver = + tickTimer >= shoutTimer + chatmsg.preanimdelay; + if (isShoutOver && startFirstTickCheck) { + // Effect stuff + if (chatmsg.screenshake === 1) { + // Shake screen + playSFX(`${AO_HOST}sounds/general/sfx-stab.opus`, false); + gamewindow.style.animation = "shake 0.2s 1"; + } + if (chatmsg.flash === 1) { + // Flash screen + playSFX(`${AO_HOST}sounds/general/sfx-realization.opus`, false); + effectlayer.style.animation = "flash 0.4s 1"; + } + + // Pre-animation stuff + if (chatmsg.preanimdelay > 0) { + shoutSprite.style.opacity = "0"; + shoutSprite.style.animation = ""; + const preanim = chatmsg.preanim.toLowerCase(); + setEmote(AO_HOST, client, charName, preanim, "", false, chatmsg.side); + } + + if (chatmsg.other_name) { + pairLayers.style.opacity = "1"; + } else { + pairLayers.style.opacity = "0"; + } + // Done with first check, move to second + startFirstTickCheck = false; + startSecondTickCheck = true; + + chatmsg.startpreanim = false; + chatmsg.startspeaking = true; + } + + const hasNonInterruptingPreAnim = chatmsg.noninterrupting_preanim === 1; + if (textnow !== chatmsg.content && hasNonInterruptingPreAnim) { + const chatContainerBox = document.getElementById("client_chatcontainer"); + chatContainerBox.style.opacity = "1"; + await handleTextTick(charLayers); + } else if (isShoutAndPreanimOver && startSecondTickCheck) { + if (chatmsg.startspeaking) { + chatmsg.startspeaking = false; + + // Evidence Bullshit + if (chatmsg.evidence > 0) { + // Prepare evidence + eviBox.src = safeTags( + masterClient.evidences[chatmsg.evidence - 1].icon + ); + + eviBox.style.width = "auto"; + eviBox.style.height = "36.5%"; + eviBox.style.opacity = "1"; + + testimonyAudio.src = `${AO_HOST}sounds/general/sfx-evidenceshoop.opus`; + testimonyAudio.play(); + + if (chatmsg.side === "def") { + // Only def show evidence on right + eviBox.style.right = "1em"; + eviBox.style.left = "initial"; + } else { + eviBox.style.right = "initial"; + eviBox.style.left = "1em"; + } + } + chatBoxInner.className = `text_${colors[chatmsg.color]}`; + + if (chatmsg.preanimdelay === 0) { + shoutSprite.style.opacity = "0"; + shoutSprite.style.animation = ""; + } + + switch (Number(chatmsg.deskmod)) { + case 2: + set_side({ + position: chatmsg.side, + showSpeedLines: false, + showDesk: true, + }); + break; + case 3: + set_side({ + position: chatmsg.side, + showSpeedLines: false, + showDesk: false, + }); + break; + case 4: + set_side({ + position: chatmsg.side, + showSpeedLines: false, + showDesk: true, + }); + break; + case 5: + set_side({ + position: chatmsg.side, + showSpeedLines: false, + showDesk: false, + }); + break; + } + + if (chatmsg.other_name) { + setEmote( + AO_HOST, + client, + pairName, + pairEmote, + "(a)", + true, + chatmsg.side + ); + pairLayers.style.opacity = "1"; + } else { + pairLayers.style.opacity = "0"; + } + + setEmote( + AO_HOST, + client, + charName, + charEmote, + "(b)", + false, + chatmsg.side + ); + charLayers.style.opacity = "1"; + + if (textnow === chatmsg.content) { + setEmote( + AO_HOST, + client, + charName, + charEmote, + "(a)", + false, + chatmsg.side + ); + charLayers.style.opacity = "1"; + waitingBox.style.opacity = "1"; + _animating = false; + clearTimeout(updater); + return; + } + } else if (textnow !== chatmsg.content) { + const chatContainerBox = document.getElementById( + "client_chatcontainer" + ); + chatContainerBox.style.opacity = "1"; + await handleTextTick(charLayers); + } + } + + if (!sfxplayed && chatmsg.snddelay + shoutTimer >= tickTimer) { + sfxplayed = 1; + if ( + chatmsg.sound !== "0" && + chatmsg.sound !== "1" && + chatmsg.sound !== "" && + chatmsg.sound !== undefined && + (chatmsg.type == 1 || chatmsg.type == 2 || chatmsg.type == 6) + ) { + playSFX( + `${AO_HOST}sounds/general/${encodeURI( + chatmsg.sound.toLowerCase() + )}.opus`, + chatmsg.looping_sfx + ); + } + } + if (_animating) { + chat_tick(); + } + tickTimer += UPDATE_INTERVAL; + }; + /** + * Triggered by the theme selector. + */ + function reloadTheme() { + theme = (document.getElementById("client_themeselect")) + .value; + + setCookie("theme", theme); + (( + document.getElementById("client_theme") + )).href = `styles/${theme}.css`; + } + window.reloadTheme = reloadTheme; + /** + * Triggered by the blip volume slider. + */ + function changeBlipVolume() { + const blipVolume = (( + document.getElementById("client_bvolume") + )).value; + blipChannels.forEach( + (channel: HTMLAudioElement) => (channel.volume = Number(blipVolume)) + ); + setCookie("blipVolume", blipVolume); + } + window.changeBlipVolume = changeBlipVolume; + + return { + chat_tick, + changeMusicVolume, + changeBlipVolume, + reloadTheme, + playSFX, + set_side, + initTestimonyUpdater, + updateTestimony, + disposeTestimony, + handle_ic_speaking, + handleTextTick, + theme, + chatmsg, + sfxaudio, + blipChannels, + lastChar, + music, + musicVolume, + bgFolder, + bgname, + }; +}; + +export default viewport; -- cgit From 1aa738cd9849225266d623e98d1d9a455c3501f0 Mon Sep 17 00:00:00 2001 From: Caleb Mabry <36182383+caleb-mabry@users.noreply.github.com> Date: Sun, 17 Jul 2022 13:40:46 -0400 Subject: Changing mock value --- webAO/client/__tests__/setEmote.test.js | 11 +++++++---- 1 file changed, 7 insertions(+), 4 deletions(-) (limited to 'webAO') diff --git a/webAO/client/__tests__/setEmote.test.js b/webAO/client/__tests__/setEmote.test.js index 1db13c9..53bb68d 100644 --- a/webAO/client/__tests__/setEmote.test.js +++ b/webAO/client/__tests__/setEmote.test.js @@ -9,10 +9,13 @@ jest.mock('../../utils/fileExists'); describe('setEmote', () => { const AO_HOST = ''; Client.mockReturnValue({ - lastChar: 'long', - chatmsg: { - name: 'byte', - }, + viewport: { + lastChar: 'long', + chatmsg: { + name: 'byte', + }, + } + }); const client = new Client('127.0.0.1'); const firstExtension = '.gif'; -- cgit From 03aa72eda907a1586baf3664a0be71191d898b9b Mon Sep 17 00:00:00 2001 From: Caleb Mabry <36182383+caleb-mabry@users.noreply.github.com> Date: Sun, 17 Jul 2022 13:43:25 -0400 Subject: Removing console logs --- webAO/client.ts | 3 --- webAO/viewport.ts | 9 --------- 2 files changed, 12 deletions(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 64ffab9..18b173c 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -298,7 +298,6 @@ class Client extends EventEmitter { * @param {string} message the message to send */ sendServer(message: string) { - //console.log("C: "+message); mode === "replay" ? this.sendSelf(message) : this.serv.send(message); } @@ -615,7 +614,6 @@ class Client extends EventEmitter { * @param {number} character the character ID */ sendCharacter(character: number) { - console.log("sending " + character); if (character === -1 || this.chars[character].name) { this.sendServer(`CC#${this.playerID}#${character}#web#%`); } @@ -907,7 +905,6 @@ class Client extends EventEmitter { if (chatmsg.charid === this.charID) { resetICParams(); } - console.log(chatmsg); this.viewport.handle_ic_speaking(chatmsg); // no await } } diff --git a/webAO/viewport.ts b/webAO/viewport.ts index f680162..61fdc4d 100644 --- a/webAO/viewport.ts +++ b/webAO/viewport.ts @@ -405,8 +405,6 @@ const viewport = (masterClient: Client, AO_HOST: string): Viewport => { startThirdTickCheck = false; let charLayers = document.getElementById("client_char"); let pairLayers = document.getElementById("client_pair_char"); - console.log(chatmsg); - console.log("FICLK YOPU"); // stop updater clearTimeout(updater); @@ -648,12 +646,10 @@ const viewport = (masterClient: Client, AO_HOST: string): Viewport => { chatmsg.content, colors[chatmsg.color] ); - console.log("ASSHOLE"); chat_tick(); }; const handleTextTick = async (charLayers: HTMLImageElement) => { - console.log("tick"); const chatBox = document.getElementById("client_chat"); const waitingBox = document.getElementById("client_chatwaiting"); const chatBoxInner = document.getElementById("client_inner_chat"); @@ -666,7 +662,6 @@ const viewport = (masterClient: Client, AO_HOST: string): Viewport => { currentBlipChannel %= blipChannels.length; } textnow = chatmsg.content.substring(0, textnow.length + 1); - console.log(textnow); const characterElement = chatmsg.parsed[textnow.length - 1]; if (characterElement) { const COMMAND_IDENTIFIER = "\\"; @@ -728,7 +723,6 @@ const viewport = (masterClient: Client, AO_HOST: string): Viewport => { chatBoxInner.appendChild(chatmsg.parsed[textnow.length - 1]); } } - console.log("ass"); // scroll to bottom chatBox.scrollTop = chatBox.scrollHeight; @@ -782,9 +776,6 @@ const viewport = (masterClient: Client, AO_HOST: string): Viewport => { // do not perform heavy operations here await delay(chatmsg.speed); - console.log("WHERE IS THE CHATMSG"); - console.log(chatmsg); - console.log(textnow + " UH " + chatmsg.content); if (textnow === chatmsg.content) { return; } -- cgit From 0a5641f1c437993cf49958a77831056792b0c872 Mon Sep 17 00:00:00 2001 From: Caleb Mabry <36182383+caleb-mabry@users.noreply.github.com> Date: Sun, 17 Jul 2022 20:23:38 -0400 Subject: Updating to use getters and setters --- webAO/client.ts | 21 +++++++++++---------- webAO/viewport.ts | 30 ++++++++++++++++++++---------- 2 files changed, 31 insertions(+), 20 deletions(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 18b173c..569b0e8 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -1515,15 +1515,16 @@ class Client extends EventEmitter { */ handleBN(args: string[]) { - this.viewport.bgname = safeTags(args[1]); - const bgfolder = this.viewport.bgFolder; - const bg_index = getIndexFromSelect("bg_select", this.viewport.bgname); + const bgFromArgs = safeTags(args[1]); + this.viewport.changeBgName(bgFromArgs); + const bgfolder = this.viewport.bgFolder(); + const bg_index = getIndexFromSelect("bg_select", this.viewport.bgName()); (document.getElementById("bg_select")).selectedIndex = bg_index; updateBackgroundPreview(); if (bg_index === 0) { (document.getElementById("bg_filename")).value = - this.viewport.bgname; + this.viewport.bgName(); } tryUrls( @@ -1659,12 +1660,12 @@ class Client extends EventEmitter { oocLog.scrollTop = oocLog.scrollHeight; } - this.viewport.sfxaudio.pause(); - const oldvolume = this.viewport.sfxaudio.volume; - this.viewport.sfxaudio.volume = 1; - this.viewport.sfxaudio.src = `${AO_HOST}sounds/general/sfx-gallery.opus`; - this.viewport.sfxaudio.play(); - this.viewport.sfxaudio.volume = oldvolume; + this.viewport.sfxAudio().pause(); + const oldvolume = this.viewport.sfxAudio().volume; + this.viewport.sfxAudio().volume = 1; + this.viewport.sfxAudio().src = `${AO_HOST}sounds/general/sfx-gallery.opus`; + this.viewport.sfxAudio().play(); + this.viewport.sfxAudio().volume = oldvolume; } /** diff --git a/webAO/viewport.ts b/webAO/viewport.ts index 61fdc4d..e908ff1 100644 --- a/webAO/viewport.ts +++ b/webAO/viewport.ts @@ -64,12 +64,13 @@ export interface Viewport { handleTextTick: Function; theme: string; chatmsg: ChatMsg; - sfxaudio: HTMLAudioElement; + sfxAudio: Function; blipChannels: HTMLAudioElement[]; music: any; musicVolume: number; - bgFolder: string; - bgname: string; + changeBgName: Function; + bgFolder: Function; + bgName: Function; lastChar: string; } const viewport = (masterClient: Client, AO_HOST: string): Viewport => { @@ -137,7 +138,7 @@ const viewport = (masterClient: Client, AO_HOST: string): Viewport => { let musicVolume = 0; let updater: any; let testimonyUpdater: any; - let bgname = "gs4"; + let viewportBgName = ""; let lastChar = ""; let lastEvi = 0; let testimonyTimer = 0; @@ -148,7 +149,11 @@ const viewport = (masterClient: Client, AO_HOST: string): Viewport => { let startSecondTickCheck: boolean; let startThirdTickCheck: boolean; let theme: string; - const bgFolder = `${AO_HOST}background/${encodeURI(bgname.toLowerCase())}/`; + const sfxAudio = () => sfxaudio; + const bgName = () => viewportBgName; + const changeBgName = (bgName: string) => (viewportBgName = bgName); + const bgFolder = () => + `${AO_HOST}background/${encodeURI(viewportBgName.toLowerCase())}/`; /** * Sets the volume of the music. * @param {number} volume @@ -286,14 +291,14 @@ const viewport = (masterClient: Client, AO_HOST: string): Viewport => { if (showSpeedLines === true) { court.src = `${AO_HOST}themes/default/${encodeURI(speedLines)}`; } else { - court.src = await tryUrls(bgFolder + bg); + court.src = await tryUrls(bgFolder() + bg); } if (showDesk === true && desk) { - const deskFilename = (await fileExists(bgFolder + desk.ao2)) + const deskFilename = (await fileExists(bgFolder() + desk.ao2)) ? desk.ao2 : desk.ao1; - bench.src = bgFolder + deskFilename; + bench.src = bgFolder() + deskFilename; bench.style.opacity = "1"; } else { bench.style.opacity = "0"; @@ -396,6 +401,8 @@ const viewport = (masterClient: Client, AO_HOST: string): Viewport => { */ const handle_ic_speaking = async (playerChatMsg: ChatMsg) => { chatmsg = playerChatMsg; + client.viewport.chatmsg = playerChatMsg; + textnow = ""; sfxplayed = 0; tickTimer = 0; @@ -451,7 +458,9 @@ const viewport = (masterClient: Client, AO_HOST: string): Viewport => { charLayers.style.opacity = "0"; pairLayers.style.opacity = "0"; } + lastChar = chatmsg.name; + client.viewport.lastChar = chatmsg.name; appendICLog(chatmsg.content, chatmsg.showname, chatmsg.nameplate); @@ -1024,6 +1033,7 @@ const viewport = (masterClient: Client, AO_HOST: string): Viewport => { reloadTheme, playSFX, set_side, + changeBgName, initTestimonyUpdater, updateTestimony, disposeTestimony, @@ -1031,13 +1041,13 @@ const viewport = (masterClient: Client, AO_HOST: string): Viewport => { handleTextTick, theme, chatmsg, - sfxaudio, + sfxAudio, blipChannels, lastChar, music, musicVolume, bgFolder, - bgname, + bgName, }; }; -- cgit From 151347b150e79bc01fcb8b8af0a173535df8b7fb Mon Sep 17 00:00:00 2001 From: Caleb Mabry <36182383+caleb-mabry@users.noreply.github.com> Date: Mon, 18 Jul 2022 13:24:21 -0400 Subject: Everything moved --- webAO/client.ts | 27 +++-- webAO/viewport.ts | 344 ++++++++++++++++++++++++++++-------------------------- 2 files changed, 195 insertions(+), 176 deletions(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 569b0e8..64b8f9a 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -51,7 +51,7 @@ interface QueryParams { let { ip: serverIP, mode, asset, theme } = queryParser() as QueryParams; // Unless there is an asset URL specified, use the wasabi one const DEFAULT_HOST = "http://attorneyoffline.de/base/"; -let AO_HOST = asset || DEFAULT_HOST; +export let AO_HOST = asset || DEFAULT_HOST; const THEME = theme || "default"; let client: Client; @@ -222,7 +222,7 @@ class Client extends EventEmitter { this.selectedEvidence = 0; this.checkUpdater = null; - this.viewport = masterViewport(this, AO_HOST); + this.viewport = masterViewport(this); /** * Assign handlers for all commands * If you implement a new command, you need to add it here @@ -1516,15 +1516,18 @@ class Client extends EventEmitter { handleBN(args: string[]) { const bgFromArgs = safeTags(args[1]); - this.viewport.changeBgName(bgFromArgs); - const bgfolder = this.viewport.bgFolder(); - const bg_index = getIndexFromSelect("bg_select", this.viewport.bgName()); + this.viewport.setBackgroundName(bgFromArgs); + const bgfolder = this.viewport.getBackgroundFolder(); + const bg_index = getIndexFromSelect( + "bg_select", + this.viewport.getBackgroundName() + ); (document.getElementById("bg_select")).selectedIndex = bg_index; updateBackgroundPreview(); if (bg_index === 0) { (document.getElementById("bg_filename")).value = - this.viewport.bgName(); + this.viewport.getBackgroundName(); } tryUrls( @@ -1660,12 +1663,12 @@ class Client extends EventEmitter { oocLog.scrollTop = oocLog.scrollHeight; } - this.viewport.sfxAudio().pause(); - const oldvolume = this.viewport.sfxAudio().volume; - this.viewport.sfxAudio().volume = 1; - this.viewport.sfxAudio().src = `${AO_HOST}sounds/general/sfx-gallery.opus`; - this.viewport.sfxAudio().play(); - this.viewport.sfxAudio().volume = oldvolume; + this.viewport.getSfxAudio().pause(); + const oldvolume = this.viewport.getSfxAudio().volume; + this.viewport.getSfxAudio().volume = 1; + this.viewport.getSfxAudio().src = `${AO_HOST}sounds/general/sfx-gallery.opus`; + this.viewport.getSfxAudio().play(); + this.viewport.getSfxAudio().volume = oldvolume; } /** diff --git a/webAO/viewport.ts b/webAO/viewport.ts index e908ff1..0f0dc01 100644 --- a/webAO/viewport.ts +++ b/webAO/viewport.ts @@ -13,6 +13,7 @@ import setEmote from "./client/setEmote"; import getAnimLength from "./utils/getAnimLength"; import { safeTags } from "./encoding"; import setCookie from "./utils/setCookie"; +import { AO_HOST } from "./client"; interface ChatMsg { content: string; objection: number; @@ -64,122 +65,181 @@ export interface Viewport { handleTextTick: Function; theme: string; chatmsg: ChatMsg; - sfxAudio: Function; + setSfxAudio: Function; + getSfxAudio: Function; + getBackgroundFolder: Function; blipChannels: HTMLAudioElement[]; music: any; musicVolume: number; - changeBgName: Function; - bgFolder: Function; - bgName: Function; + setBackgroundName: Function; lastChar: string; + getBackgroundName: Function; } -const viewport = (masterClient: Client, AO_HOST: string): Viewport => { - const attorneyMarkdown = mlConfig(AO_HOST); - let client = masterClient; - let textnow = ""; - let chatmsg = { - content: "", - objection: 0, - sound: "", - startpreanim: true, - startspeaking: false, - side: null, - color: 0, - snddelay: 0, - preanimdelay: 0, - speed: UPDATE_INTERVAL, - } as ChatMsg; - let shouts = [undefined, "holdit", "objection", "takethat", "custom"]; - let colors = [ - "white", - "green", - "red", - "orange", - "blue", - "yellow", - "pink", - "cyan", - "grey", - ]; +const SHOUTS = [undefined, "holdit", "objection", "takethat", "custom"]; + +const COLORS = [ + "white", + "green", + "red", + "orange", + "blue", + "yellow", + "pink", + "cyan", + "grey", +]; +const createMusic = () => { + const audioChannels = document.getElementsByClassName( + "audioChannel" + ) as HTMLCollectionOf; + let music = [...audioChannels]; + music.forEach((channel: HTMLAudioElement) => (channel.volume = 0.5)); + music.forEach( + (channel: HTMLAudioElement) => (channel.onerror = opusCheck(channel)) + ); + return music; +}; +const createTestimonyAudio = () => { + const testimonyAudio = document.getElementById( + "client_testimonyaudio" + ) as HTMLAudioElement; + testimonyAudio.src = `${AO_HOST}sounds/general/sfx-guilty.opus`; + return testimonyAudio; +}; + +const createShoutAudio = () => { + const shoutAudio = document.getElementById( + "client_shoutaudio" + ) as HTMLAudioElement; + shoutAudio.src = `${AO_HOST}misc/default/objection.opus`; + return shoutAudio; +}; +const createSfxAudio = () => { + const sfxAudio = document.getElementById( + "client_sfxaudio" + ) as HTMLAudioElement; + sfxAudio.src = `${AO_HOST}sounds/general/sfx-realization.opus`; + return sfxAudio; +}; +const createBlipsChannels = () => { const blipSelectors = document.getElementsByClassName( "blipSound" ) as HTMLCollectionOf; - let blipChannels = [...blipSelectors]; + const blipChannels = [...blipSelectors]; // Allocate multiple blip audio channels to make blips less jittery blipChannels.forEach((channel: HTMLAudioElement) => (channel.volume = 0.5)); blipChannels.forEach( (channel: HTMLAudioElement) => (channel.onerror = opusCheck(channel)) ); - let currentBlipChannel = 0; - let sfxaudio = document.getElementById("client_sfxaudio") as HTMLAudioElement; - sfxaudio.src = `${AO_HOST}sounds/general/sfx-realization.opus`; - let sfxplayed = 0; - - let shoutaudio = document.getElementById( - "client_shoutaudio" - ) as HTMLAudioElement; - shoutaudio.src = `${AO_HOST}misc/default/objection.opus`; + return blipChannels; +}; +const defaultChatMsg = { + content: "", + objection: 0, + sound: "", + startpreanim: true, + startspeaking: false, + side: null, + color: 0, + snddelay: 0, + preanimdelay: 0, + speed: UPDATE_INTERVAL, +} as ChatMsg; +interface Desk { + ao2?: string; + ao1?: string; +} +interface Position { + bg?: string; + desk?: Desk; + speedLines: string; +} - let testimonyAudio = document.getElementById( - "client_testimonyaudio" - ) as HTMLAudioElement; - testimonyAudio.src = `${AO_HOST}sounds/general/sfx-guilty.opus`; +interface Positions { + [key: string]: Position; +} - const audioChannels = document.getElementsByClassName( - "audioChannel" - ) as HTMLCollectionOf; - let music: any; - music = [...audioChannels]; - music.forEach((channel: HTMLAudioElement) => (channel.volume = 0.5)); - music.forEach( - (channel: HTMLAudioElement) => (channel.onerror = opusCheck(channel)) - ); - let musicVolume = 0; - let updater: any; - let testimonyUpdater: any; - let viewportBgName = ""; +const positions: Positions = { + def: { + bg: "defenseempty", + desk: { ao2: "defensedesk.png", ao1: "bancodefensa.png" } as Desk, + speedLines: "defense_speedlines.gif", + }, + pro: { + bg: "prosecutorempty", + desk: { ao2: "prosecutiondesk.png", ao1: "bancoacusacion.png" } as Desk, + speedLines: "prosecution_speedlines.gif", + }, + hld: { + bg: "helperstand", + desk: null as Desk, + speedLines: "defense_speedlines.gif", + }, + hlp: { + bg: "prohelperstand", + desk: null as Desk, + speedLines: "prosecution_speedlines.gif", + }, + wit: { + bg: "witnessempty", + desk: { ao2: "stand.png", ao1: "estrado.png" } as Desk, + speedLines: "prosecution_speedlines.gif", + }, + jud: { + bg: "judgestand", + desk: { ao2: "judgedesk.png", ao1: "judgedesk.gif" } as Desk, + speedLines: "prosecution_speedlines.gif", + }, + jur: { + bg: "jurystand", + desk: { ao2: "jurydesk.png", ao1: "estrado.png" } as Desk, + speedLines: "defense_speedlines.gif", + }, + sea: { + bg: "seancestand", + desk: { ao2: "seancedesk.png", ao1: "estrado.png" } as Desk, + speedLines: "prosecution_speedlines.gif", + }, +}; +const viewport = (masterClient: Client): Viewport => { + let animating = false; + let attorneyMarkdown = mlConfig(AO_HOST); + let blipChannels = createBlipsChannels(); + let chatmsg = defaultChatMsg; + let client = masterClient; + let currentBlipChannel = 0; let lastChar = ""; let lastEvi = 0; - let testimonyTimer = 0; + let music = createMusic(); + let musicVolume = 0; + let sfxAudio = createSfxAudio(); + let sfxplayed = 0; let shoutTimer = 0; - let tickTimer = 0; - let _animating = false; + let shoutaudio = createShoutAudio(); let startFirstTickCheck: boolean; let startSecondTickCheck: boolean; let startThirdTickCheck: boolean; + let testimonyAudio = createTestimonyAudio(); + let testimonyTimer = 0; + let testimonyUpdater: any; + let textnow = ""; let theme: string; - const sfxAudio = () => sfxaudio; - const bgName = () => viewportBgName; - const changeBgName = (bgName: string) => (viewportBgName = bgName); - const bgFolder = () => - `${AO_HOST}background/${encodeURI(viewportBgName.toLowerCase())}/`; - /** - * Sets the volume of the music. - * @param {number} volume - */ - const changeMusicVolume = (volume: number = -1) => { - const clientVolume = Number( - (document.getElementById("client_mvolume")).value - ); - let musicVolume = volume === -1 ? clientVolume : volume; - music.forEach( - (channel: HTMLAudioElement) => (channel.volume = musicVolume) - ); - setCookie("musicVolume", String(musicVolume)); - }; - window.changeMusicVolume = changeMusicVolume; + let tickTimer = 0; + let updater: any; + let backgroundName = ""; + const getSfxAudio = () => sfxAudio; + const setSfxAudio = (value: HTMLAudioElement) => (sfxAudio = value); + const getBackgroundName = () => backgroundName; + const setBackgroundName = (value: string) => (backgroundName = value); + const getBackgroundFolder = () => + `${AO_HOST}background/${encodeURI(backgroundName.toLowerCase())}/`; - /** - * Play any SFX - * - * @param {string} sfxname - */ const playSFX = async (sfxname: string, looping: boolean) => { - sfxaudio.pause(); - sfxaudio.loop = looping; - sfxaudio.src = sfxname; - sfxaudio.play(); + sfxAudio.pause(); + sfxAudio.loop = looping; + sfxAudio.src = sfxname; + sfxAudio.play(); }; /** @@ -217,63 +277,6 @@ const viewport = (masterClient: Client, AO_HOST: string): Viewport => { court = document.getElementById("client_court_classic"); } - interface Desk { - ao2?: string; - ao1?: string; - } - interface Position { - bg?: string; - desk?: Desk; - speedLines: string; - } - - interface Positions { - [key: string]: Position; - } - - const positions: Positions = { - def: { - bg: "defenseempty", - desk: { ao2: "defensedesk.png", ao1: "bancodefensa.png" } as Desk, - speedLines: "defense_speedlines.gif", - }, - pro: { - bg: "prosecutorempty", - desk: { ao2: "prosecutiondesk.png", ao1: "bancoacusacion.png" } as Desk, - speedLines: "prosecution_speedlines.gif", - }, - hld: { - bg: "helperstand", - desk: null as Desk, - speedLines: "defense_speedlines.gif", - }, - hlp: { - bg: "prohelperstand", - desk: null as Desk, - speedLines: "prosecution_speedlines.gif", - }, - wit: { - bg: "witnessempty", - desk: { ao2: "stand.png", ao1: "estrado.png" } as Desk, - speedLines: "prosecution_speedlines.gif", - }, - jud: { - bg: "judgestand", - desk: { ao2: "judgedesk.png", ao1: "judgedesk.gif" } as Desk, - speedLines: "prosecution_speedlines.gif", - }, - jur: { - bg: "jurystand", - desk: { ao2: "jurydesk.png", ao1: "estrado.png" } as Desk, - speedLines: "defense_speedlines.gif", - }, - sea: { - bg: "seancestand", - desk: { ao2: "seancedesk.png", ao1: "estrado.png" } as Desk, - speedLines: "prosecution_speedlines.gif", - }, - }; - let bg; let desk; let speedLines; @@ -291,14 +294,14 @@ const viewport = (masterClient: Client, AO_HOST: string): Viewport => { if (showSpeedLines === true) { court.src = `${AO_HOST}themes/default/${encodeURI(speedLines)}`; } else { - court.src = await tryUrls(bgFolder() + bg); + court.src = await tryUrls(getBackgroundFolder() + bg); } if (showDesk === true && desk) { - const deskFilename = (await fileExists(bgFolder() + desk.ao2)) + const deskFilename = (await fileExists(getBackgroundFolder() + desk.ao2)) ? desk.ao2 : desk.ao1; - bench.src = bgFolder() + deskFilename; + bench.src = getBackgroundFolder() + deskFilename; bench.style.opacity = "1"; } else { bench.style.opacity = "0"; @@ -406,7 +409,7 @@ const viewport = (masterClient: Client, AO_HOST: string): Viewport => { textnow = ""; sfxplayed = 0; tickTimer = 0; - _animating = true; + animating = true; startFirstTickCheck = true; startSecondTickCheck = false; startThirdTickCheck = false; @@ -416,7 +419,7 @@ const viewport = (masterClient: Client, AO_HOST: string): Viewport => { clearTimeout(updater); // stop last sfx from looping any longer - sfxaudio.loop = false; + sfxAudio.loop = false; const fg = document.getElementById("client_fg"); const gamewindow = document.getElementById("client_gamewindow"); @@ -464,7 +467,7 @@ const viewport = (masterClient: Client, AO_HOST: string): Viewport => { appendICLog(chatmsg.content, chatmsg.showname, chatmsg.nameplate); - checkCallword(chatmsg.content, sfxaudio); + checkCallword(chatmsg.content, sfxAudio); setEmote( AO_HOST, @@ -492,7 +495,7 @@ const viewport = (masterClient: Client, AO_HOST: string): Viewport => { const shoutSprite = ( document.getElementById("client_shout") ); - const shout = shouts[chatmsg.objection]; + const shout = SHOUTS[chatmsg.objection]; if (shout) { // Hide message box chatContainerBox.style.opacity = "0"; @@ -653,7 +656,7 @@ const viewport = (masterClient: Client, AO_HOST: string): Viewport => { } chatmsg.parsed = await attorneyMarkdown.applyMarkdown( chatmsg.content, - colors[chatmsg.color] + COLORS[chatmsg.color] ); chat_tick(); }; @@ -736,7 +739,7 @@ const viewport = (masterClient: Client, AO_HOST: string): Viewport => { chatBox.scrollTop = chatBox.scrollHeight; if (textnow === chatmsg.content) { - _animating = false; + animating = false; setEmote( AO_HOST, client, @@ -888,7 +891,7 @@ const viewport = (masterClient: Client, AO_HOST: string): Viewport => { eviBox.style.left = "1em"; } } - chatBoxInner.className = `text_${colors[chatmsg.color]}`; + chatBoxInner.className = `text_${COLORS[chatmsg.color]}`; if (chatmsg.preanimdelay === 0) { shoutSprite.style.opacity = "0"; @@ -964,7 +967,7 @@ const viewport = (masterClient: Client, AO_HOST: string): Viewport => { ); charLayers.style.opacity = "1"; waitingBox.style.opacity = "1"; - _animating = false; + animating = false; clearTimeout(updater); return; } @@ -994,7 +997,7 @@ const viewport = (masterClient: Client, AO_HOST: string): Viewport => { ); } } - if (_animating) { + if (animating) { chat_tick(); } tickTimer += UPDATE_INTERVAL; @@ -1026,6 +1029,18 @@ const viewport = (masterClient: Client, AO_HOST: string): Viewport => { } window.changeBlipVolume = changeBlipVolume; + const changeMusicVolume = (volume: number = -1) => { + const clientVolume = Number( + (document.getElementById("client_mvolume")).value + ); + let musicVolume = volume === -1 ? clientVolume : volume; + music.forEach( + (channel: HTMLAudioElement) => (channel.volume = musicVolume) + ); + setCookie("musicVolume", String(musicVolume)); + }; + window.changeMusicVolume = changeMusicVolume; + return { chat_tick, changeMusicVolume, @@ -1033,21 +1048,22 @@ const viewport = (masterClient: Client, AO_HOST: string): Viewport => { reloadTheme, playSFX, set_side, - changeBgName, + setBackgroundName, initTestimonyUpdater, updateTestimony, disposeTestimony, handle_ic_speaking, handleTextTick, + getBackgroundFolder, + getBackgroundName, + getSfxAudio, + setSfxAudio, theme, chatmsg, - sfxAudio, blipChannels, lastChar, music, musicVolume, - bgFolder, - bgName, }; }; -- cgit From 3d280ac650081343ca9e870cbdc7db71942b5834 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Tue, 19 Jul 2022 23:53:38 +0200 Subject: OPTIMIZE --- webAO/styles/chatbox/drv3chatbox.png | Bin 36885 -> 33880 bytes 1 file changed, 0 insertions(+), 0 deletions(-) (limited to 'webAO') diff --git a/webAO/styles/chatbox/drv3chatbox.png b/webAO/styles/chatbox/drv3chatbox.png index ecf5e1f..224e2c5 100644 Binary files a/webAO/styles/chatbox/drv3chatbox.png and b/webAO/styles/chatbox/drv3chatbox.png differ -- cgit From 53d6ddae3df298bd2e8c01e1c7858acd3cc59bee Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Fri, 29 Jul 2022 16:36:33 +0200 Subject: fix pl vs pw chatbox --- webAO/styles/chatbox/chatplvsaa.css | 26 +++++++++++++++----------- webAO/styles/chatbox/plvspw.png | Bin 0 -> 213 bytes webAO/styles/chatbox/plvspw_name.png | Bin 0 -> 211 bytes 3 files changed, 15 insertions(+), 11 deletions(-) create mode 100644 webAO/styles/chatbox/plvspw.png create mode 100644 webAO/styles/chatbox/plvspw_name.png (limited to 'webAO') diff --git a/webAO/styles/chatbox/chatplvsaa.css b/webAO/styles/chatbox/chatplvsaa.css index 23a8ea0..068e412 100644 --- a/webAO/styles/chatbox/chatplvsaa.css +++ b/webAO/styles/chatbox/chatplvsaa.css @@ -1,5 +1,5 @@ .text_white { - color: #fff; + color: #120f09; } .text_blue { @@ -53,33 +53,37 @@ #client_name { display: block; - left: 1%; + left: 2%; top: 0; height: 20%; min-width: 15%; padding: 0px 6px; - border: 2px ridge #b1822d; - border-radius: 0.4em; - background: #783500; + image-rendering: crisp-edges; + border-image-source: url("plvspw_name.png"); + border-image-slice: 6 fill; + border-image-width: 0.4em; position: absolute; z-index: 1; } #client_inner_name { margin: 1px; + padding: 0 0.4em; } #client_chat { font-size: 1em; display: block; width: 99%; - width: calc(100% - 4px); + width: calc(100% - 0.4em); margin: auto; height: 80%; - border: 2px ridge #d9a63b; - border-radius: 0.5em; - background-color: rgba(148,96,0,0.6); + image-rendering: crisp-edges; + border-image-source: url("plvspw.png"); + border-image-slice: 10 fill; + border-image-width: 0.4em; bottom: 0; + left: 0.2em; position: absolute; word-break: keep-all; word-wrap: break-word; @@ -90,8 +94,8 @@ } #client_inner_chat { - margin: 6px; - padding: 6px 20px; + margin: 0.1em; + padding: 0.3em 0.6em; } #client_chatwaiting { diff --git a/webAO/styles/chatbox/plvspw.png b/webAO/styles/chatbox/plvspw.png new file mode 100644 index 0000000..ba6a7e8 Binary files /dev/null and b/webAO/styles/chatbox/plvspw.png differ diff --git a/webAO/styles/chatbox/plvspw_name.png b/webAO/styles/chatbox/plvspw_name.png new file mode 100644 index 0000000..d9fc4e1 Binary files /dev/null and b/webAO/styles/chatbox/plvspw_name.png differ -- cgit From a3c8f2180a38fa30505324a1140c7999076f929b Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Fri, 29 Jul 2022 16:42:44 +0200 Subject: fix animal crossing colors --- webAO/styles/chatbox/acww.css | 32 ++++++++++++++++++++++++++++++++ 1 file changed, 32 insertions(+) (limited to 'webAO') diff --git a/webAO/styles/chatbox/acww.css b/webAO/styles/chatbox/acww.css index 9818b4e..9a046e9 100644 --- a/webAO/styles/chatbox/acww.css +++ b/webAO/styles/chatbox/acww.css @@ -2,6 +2,38 @@ color: #000; } +.text_green { + color: #0f0; +} + +.text_red { + color: #f00; +} + +.text_orange { + color: #ffa500; +} + +.text_blue { + color: #b3b2fa; +} + +.text_yellow { + color: #ff0; +} + +.text_pink { + color: #ffc0cb; +} + +.text_cyan { + color: #0ff; +} + +.text_grey { + color: #bbb; +} + #client_chatcontainer { display: block; position: absolute; -- cgit From 317e9948ca40313871ded798a26cffa16785d154 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Fri, 29 Jul 2022 16:42:54 +0200 Subject: fix ddlc redundant text stroke --- webAO/styles/chatbox/ddlc.css | 10 +--------- 1 file changed, 1 insertion(+), 9 deletions(-) (limited to 'webAO') diff --git a/webAO/styles/chatbox/ddlc.css b/webAO/styles/chatbox/ddlc.css index 01d30e8..57c263e 100644 --- a/webAO/styles/chatbox/ddlc.css +++ b/webAO/styles/chatbox/ddlc.css @@ -1,46 +1,37 @@ .text_white { color: #fff; - -webkit-text-stroke: 0.04em #523643; } .text_blue { color: #6bc6f7; - -webkit-text-stroke: 0.04em #523643; } .text_green { color: #00f700; - -webkit-text-stroke: 0.04em #523643; } .text_red { color: #f00; - -webkit-text-stroke: 0.04em #523643; } .text_orange { color: #f77339; - -webkit-text-stroke: 0.04em #523643; } .text_yellow { color: #ff0; - -webkit-text-stroke: 0.04em #523643; } .text_pink { color: #ffc0cb; - -webkit-text-stroke: 0.04em #523643; } .text_cyan { color: #0ff; - -webkit-text-stroke: 0.04em #523643; } .text_grey { color: #bbb; - -webkit-text-stroke: 0.04em #523643; } #client_chatcontainer { @@ -97,6 +88,7 @@ font-family: "Aller", "OpenSans", sans-serif; font-size: 1em; font-weight: 600; + -webkit-text-stroke: 0.04em #523643; word-break: keep-all; overflow-wrap: break-word; text-align: left; -- cgit From a5553ec91ce7389bd2502f8fc0516c61ad3229fe Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Fri, 29 Jul 2022 16:43:03 +0200 Subject: fix nametag on plsvspw --- webAO/styles/chatbox/chatplvsaa.css | 2 ++ 1 file changed, 2 insertions(+) (limited to 'webAO') diff --git a/webAO/styles/chatbox/chatplvsaa.css b/webAO/styles/chatbox/chatplvsaa.css index 068e412..eb7b8b6 100644 --- a/webAO/styles/chatbox/chatplvsaa.css +++ b/webAO/styles/chatbox/chatplvsaa.css @@ -63,6 +63,8 @@ border-image-slice: 6 fill; border-image-width: 0.4em; position: absolute; + font-weight: bold; + -webkit-text-stroke: 0.02em #000; z-index: 1; } -- cgit From 1187161d3aee05f2d14c0561a685499bf48827cc Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Fri, 29 Jul 2022 17:08:42 +0200 Subject: fix up animal crossing --- webAO/styles/chatbox/acww.css | 47 +++++++++++++++++----------- webAO/styles/chatbox/chatwaiting_acww.svg | 51 ++++++++++++++++++++++++++++++- 2 files changed, 79 insertions(+), 19 deletions(-) (limited to 'webAO') diff --git a/webAO/styles/chatbox/acww.css b/webAO/styles/chatbox/acww.css index 9a046e9..6cb37da 100644 --- a/webAO/styles/chatbox/acww.css +++ b/webAO/styles/chatbox/acww.css @@ -3,19 +3,19 @@ } .text_green { - color: #0f0; + color: #009600; } .text_red { - color: #f00; + color: #ff0859; } .text_orange { - color: #ffa500; + color: #610000; } .text_blue { - color: #b3b2fa; + color: #7900ff; } .text_yellow { @@ -23,17 +23,33 @@ } .text_pink { - color: #ffc0cb; + color: #ff51ff; } -.text_cyan { - color: #0ff; +.text_cyan { + color: #0038ff; } .text_grey { color: #bbb; } +/* Webfont CSS setup for Igiari by Caveras */ + +@font-face { + font-family:'Igiari Cyrillic'; + src: url('../igiari/igiari-cyrillic.ttf'); + font-weight:normal; + font-style:normal; +} + +@font-face { + font-family:'Ace Name'; + src: url('./ace-name.ttf'); + font-weight:normal; + font-style:normal; +} + #client_chatcontainer { display: block; position: absolute; @@ -53,7 +69,7 @@ min-width: 11%; font-size: 0.8em; background: #d8f8a0; - color: #004000; + color: #040; margin: 0; padding-top: 0.4%; padding-left: 1.955%; @@ -61,11 +77,11 @@ border-color: #b0f818; border-style: solid; border-width: 0.3em 0.6em; - border-radius: 10%/50%; + border-radius: 15%/50%; box-shadow: 0 0.3em #70c020; line-height: 100%; z-index: 1; - font-family: sans-serif; + font-family: "Ace Name", "Igiari Cyrillic", "MS PGothic", "MS UI Gothic", "MS Sans Serif", "Hiragino Maru Gothic Pro", "Mitra Mono", "Mukti Narrow", "Meera", "Khmer OS", "FreeSans", "Gargi", sans-serif; } #client_inner_name { @@ -83,11 +99,6 @@ width: 100%; height: 87%; margin: auto; - /*border-color: darkgray; - border-style: solid; - border-width: 0.15em; - border-radius: 0.15em; - background-color: white;*/ background-image: url("acww.svg"); background-size: cover; background-repeat: no-repeat; @@ -96,11 +107,11 @@ text-align: left; overflow: hidden; scroll-behavior: smooth; - font-family: sans-serif; + font-family: "Igiari Cyrillic", "MS PGothic", "MS UI Gothic", "MS Sans Serif", "Hiragino Maru Gothic Pro", "Mitra Mono", "Mukti Narrow", "Meera", "Khmer OS", "FreeSans", "Gargi", sans-serif; } #client_inner_chat { - padding: 5% 12%; + padding: 5% 16%; margin: 0; line-height: 100%; } @@ -116,7 +127,7 @@ height: 1.5em; background-image: url("chatwaiting_acww.svg"); background-size: contain; - animation: idling 0.4s linear infinite; + animation: idling 0.4s steps(1) infinite; } @keyframes idling { diff --git a/webAO/styles/chatbox/chatwaiting_acww.svg b/webAO/styles/chatbox/chatwaiting_acww.svg index 0f86322..057bf37 100644 --- a/webAO/styles/chatbox/chatwaiting_acww.svg +++ b/webAO/styles/chatbox/chatwaiting_acww.svg @@ -1 +1,50 @@ - \ No newline at end of file + + + + + + + + + -- cgit From 319561b177d95f88c5297435371fc3f4111deddc Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Mon, 1 Aug 2022 23:01:46 +0200 Subject: declutter the controls a little --- webAO/dom/toggleElement.js | 13 +++++++++++++ 1 file changed, 13 insertions(+) create mode 100644 webAO/dom/toggleElement.js (limited to 'webAO') diff --git a/webAO/dom/toggleElement.js b/webAO/dom/toggleElement.js new file mode 100644 index 0000000..efddabf --- /dev/null +++ b/webAO/dom/toggleElement.js @@ -0,0 +1,13 @@ +/** + * Hides and shows any html element + * @param {string} element_id the id of the element to toggle + */ +export function toggleElement(element_id) { + const element = document.getElementById(element_id); + if (element.style.display !== 'none') { + element.style.display = 'none'; + } else { + element.style.display = 'block'; + } +} +window.toggleElement = toggleElement; -- cgit From 9727cb0f120f84f1d94df7d2a6c423ebd9862997 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Tue, 2 Aug 2022 18:46:09 +0200 Subject: add new commands --- webAO/client.ts | 33 +++++++++++++++++++++++++++++++++ 1 file changed, 33 insertions(+) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 64b8f9a..9640b8e 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -264,6 +264,10 @@ class Client extends EventEmitter { this.on("CharsCheck", this.handleCharsCheck.bind(this)); this.on("PV", this.handlePV.bind(this)); this.on("ASS", this.handleASS.bind(this)); + this.on("ackMS", this.handleackMS.bind(this)); + this.on("SP", this.handleSP.bind(this)); + this.on("JD", this.handleJD.bind(this)); + this.on("decryptor", () => {}); this.on("CHECK", () => {}); this.on("CH", () => {}); @@ -1981,6 +1985,35 @@ class Client extends EventEmitter { AO_HOST = args[1]; } + /** + * server got our message + */ + handleackMS() { + resetICParams(); + } + + /** +* position change +* @param {string} pos new position +*/ + handleSP(pos: string) { + updateActionCommands(pos); + } + + /** +* show/hide judge controls +* @param {number} show either a 1 or a 0 +*/ + handleJD(show: number) { + if (show === 1) { + document.getElementById("judge_action").style.display = "inline-table"; + document.getElementById("no_action").style.display = "none"; + } else { + document.getElementById("judge_action").style.display = "none"; + document.getElementById("no_action").style.display = "inline-table"; + } + } + /** * we are asking ourselves what characters there are * @param {Array} args packet arguments -- cgit From 3f434f66d31d2d954eeca90e6206eb3e0c6fd045 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Tue, 2 Aug 2022 18:55:47 +0200 Subject: SC is not a character --- webAO/client.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 9640b8e..5444a1b 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -1135,7 +1135,7 @@ class Client extends EventEmitter { document.getElementById("client_loadingtext").innerHTML = "Loading Characters"; - for (let i = 1; i < args.length; i++) { + for (let i = 1; i < args.length-1; i++) { document.getElementById( "client_loadingtext" ).innerHTML = `Loading Character ${i}/${this.char_list_length}`; -- cgit From 9ba98154f6d41956c4d89e0f04fa07e93963d184 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Tue, 2 Aug 2022 19:11:05 +0200 Subject: check for static webps too --- webAO/client/setEmote.ts | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) (limited to 'webAO') diff --git a/webAO/client/setEmote.ts b/webAO/client/setEmote.ts index 1f0de07..161eb51 100644 --- a/webAO/client/setEmote.ts +++ b/webAO/client/setEmote.ts @@ -23,7 +23,7 @@ const setEmote = async ( const emoteSelector = document.getElementById( `client_${position}${pairID}_img` ) as HTMLImageElement; - const extensionsMap = [".gif", ".png", ".apng", ".webp"]; + const extensionsMap = [".gif", ".png", ".apng", ".webp", ".webp.static"]; for (const extension of extensionsMap) { // Hides all sprites before creating a new sprite @@ -36,6 +36,10 @@ const setEmote = async ( url = `${characterFolder}${encodeURI(charactername)}/${encodeURI( emotename )}${extension}`; + } else if (extension === ".webp.static") { + url = `${characterFolder}${encodeURI(charactername)}/${encodeURI( + emotename + )}.webp`; } else { url = `${characterFolder}${encodeURI(charactername)}/${encodeURI( prefix -- cgit From 88c239af5f5c5b6b6785562af257bb84c9f8c53e Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Tue, 2 Aug 2022 19:49:26 +0200 Subject: make maximise buttons easier to hit on mobile --- webAO/styles/client.css | 7 +++++++ 1 file changed, 7 insertions(+) (limited to 'webAO') diff --git a/webAO/styles/client.css b/webAO/styles/client.css index 7f72eb1..8c7898b 100644 --- a/webAO/styles/client.css +++ b/webAO/styles/client.css @@ -1,3 +1,10 @@ +.lm_item .lm_header .lm_controls .lm_maximise { + top: 0; + right: 0; + height: 20px; + width: 20px; +} + @keyframes error_blink { 0% { color: #fff; -- cgit From d95b83d35496163171e251f37630957eaaf52503 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Tue, 9 Aug 2022 23:22:50 +0200 Subject: add dr2 clock svg --- webAO/styles/chatbox/clock_dr2.svg | 64 ++++++++++++++++++++++++++++++++++++++ 1 file changed, 64 insertions(+) create mode 100644 webAO/styles/chatbox/clock_dr2.svg (limited to 'webAO') diff --git a/webAO/styles/chatbox/clock_dr2.svg b/webAO/styles/chatbox/clock_dr2.svg new file mode 100644 index 0000000..189c45e --- /dev/null +++ b/webAO/styles/chatbox/clock_dr2.svg @@ -0,0 +1,64 @@ + + + + + + + + + + + + + + -- cgit From 2a6a6b13452a68ec9aa26ec21f58755256ad1a68 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Tue, 9 Aug 2022 23:36:40 +0200 Subject: music not clock --- webAO/styles/chatbox/clock_dr2.svg | 64 -------------------------------------- webAO/styles/chatbox/music_dr2.svg | 64 ++++++++++++++++++++++++++++++++++++++ 2 files changed, 64 insertions(+), 64 deletions(-) delete mode 100644 webAO/styles/chatbox/clock_dr2.svg create mode 100644 webAO/styles/chatbox/music_dr2.svg (limited to 'webAO') diff --git a/webAO/styles/chatbox/clock_dr2.svg b/webAO/styles/chatbox/clock_dr2.svg deleted file mode 100644 index 189c45e..0000000 --- a/webAO/styles/chatbox/clock_dr2.svg +++ /dev/null @@ -1,64 +0,0 @@ - - - - - - - - - - - - - - diff --git a/webAO/styles/chatbox/music_dr2.svg b/webAO/styles/chatbox/music_dr2.svg new file mode 100644 index 0000000..189c45e --- /dev/null +++ b/webAO/styles/chatbox/music_dr2.svg @@ -0,0 +1,64 @@ + + + + + + + + + + + + + + -- cgit From 2194597e6ec4c8d4a8aefcb8e90cf02598b0a4df Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Tue, 9 Aug 2022 23:39:28 +0200 Subject: add track display to dr2 theme --- webAO/styles/chatbox/chatdr2.css | 23 +++++++++++++++++++++-- 1 file changed, 21 insertions(+), 2 deletions(-) (limited to 'webAO') diff --git a/webAO/styles/chatbox/chatdr2.css b/webAO/styles/chatbox/chatdr2.css index 73187f1..481cd3d 100644 --- a/webAO/styles/chatbox/chatdr2.css +++ b/webAO/styles/chatbox/chatdr2.css @@ -45,6 +45,7 @@ #client_name { display: block; + position: absolute; height: 100%; width: 7%; text-align: left; @@ -55,8 +56,6 @@ box-shadow: 0.3em 0px 0 #ff9700; left: 0; bottom: 0; - position: absolute; - z-index: 1; } #client_inner_name { @@ -98,4 +97,24 @@ #client_chatwaiting { display: none; +} + +#client_trackstatus { + display: block; + position: absolute; + width: 35%; + height: 35%; + top: 0; + left: 0; + background-image: url("music_dr2.svg"); + background-size: contain; + background-repeat: no-repeat; +} + +#client_trackstatustext { + position: absolute; + top: 4%; + left: 4%; + color: #f84f00; + font-family: monospace; } \ No newline at end of file -- cgit From 73346f6e281bc59713381688f30325aea2039890 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Wed, 10 Aug 2022 00:09:40 +0200 Subject: add DR2 music to theme --- webAO/client.ts | 3 +++ webAO/styles/chatbox/chatdr2.css | 9 ++++++--- 2 files changed, 9 insertions(+), 3 deletions(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 5444a1b..5cee9bf 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -2762,6 +2762,9 @@ export function resizeChatbox() { const gameHeight = document.getElementById("client_background").offsetHeight; chatContainerBox.style.fontSize = `${(gameHeight * 0.0521).toFixed(1)}px`; + + const trackstatus = (document.getElementById("client_trackstatustext")); + trackstatus.width = (trackstatus.offsetWidth-1)+"px"; } window.resizeChatbox = resizeChatbox; diff --git a/webAO/styles/chatbox/chatdr2.css b/webAO/styles/chatbox/chatdr2.css index 481cd3d..fdfc426 100644 --- a/webAO/styles/chatbox/chatdr2.css +++ b/webAO/styles/chatbox/chatdr2.css @@ -102,7 +102,7 @@ #client_trackstatus { display: block; position: absolute; - width: 35%; + width: 30%; height: 35%; top: 0; left: 0; @@ -113,8 +113,11 @@ #client_trackstatustext { position: absolute; - top: 4%; - left: 4%; + top: 6%; + left: 25%; + width: 50%; color: #f84f00; font-family: monospace; + font-size: 1.2em; + white-space: nowrap; } \ No newline at end of file -- cgit From 5385216e30f15f6016134975bd8fa2384c20cfbf Mon Sep 17 00:00:00 2001 From: sD Date: Wed, 10 Aug 2022 20:13:52 +0200 Subject: add track status to dr2 --- webAO/styles/chatbox/acww.css | 4 ++++ webAO/styles/chatbox/chat999.css | 4 ++++ webAO/styles/chatbox/chatdd.css | 4 ++++ webAO/styles/chatbox/chatfuture.css | 4 ++++ webAO/styles/chatbox/chatp3.css | 4 ++++ webAO/styles/chatbox/chatplvsaa.css | 4 ++++ webAO/styles/chatbox/ddlc.css | 4 ++++ webAO/styles/chatbox/dgs.css | 4 ++++ webAO/styles/chatbox/dr1.css | 4 ++++ webAO/styles/chatbox/drae.css | 4 ++++ webAO/styles/chatbox/drv3.css | 4 ++++ webAO/styles/chatbox/ff.css | 4 ++++ webAO/styles/chatbox/halla.css | 4 ++++ webAO/styles/chatbox/homestuck.css | 4 ++++ webAO/styles/chatbox/key.css | 4 ++++ webAO/styles/chatbox/legacy.css | 4 ++++ webAO/styles/chatbox/n64zelda.css | 4 ++++ webAO/styles/chatbox/p4.css | 4 ++++ webAO/styles/chatbox/p5.css | 4 ++++ webAO/styles/chatbox/papermario.css | 4 ++++ webAO/styles/chatbox/trilogy.css | 4 ++++ webAO/styles/chatbox/whentheycry.css | 4 ++++ webAO/styles/chatbox/yakuza.css | 4 ++++ webAO/styles/chatbox/yttd.css | 4 ++++ 24 files changed, 96 insertions(+) (limited to 'webAO') diff --git a/webAO/styles/chatbox/acww.css b/webAO/styles/chatbox/acww.css index 6cb37da..ffda68b 100644 --- a/webAO/styles/chatbox/acww.css +++ b/webAO/styles/chatbox/acww.css @@ -142,4 +142,8 @@ 100% { bottom: 12%; } +} + +#client_trackstatus { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/chat999.css b/webAO/styles/chatbox/chat999.css index 55c7194..221dced 100644 --- a/webAO/styles/chatbox/chat999.css +++ b/webAO/styles/chatbox/chat999.css @@ -117,4 +117,8 @@ 100% { right: 0; } +} + +#client_trackstatus { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/chatdd.css b/webAO/styles/chatbox/chatdd.css index 7fb6bee..dca2390 100644 --- a/webAO/styles/chatbox/chatdd.css +++ b/webAO/styles/chatbox/chatdd.css @@ -100,4 +100,8 @@ 100% { right: 0; } +} + +#client_trackstatus { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/chatfuture.css b/webAO/styles/chatbox/chatfuture.css index 8b2f6a4..96b124d 100644 --- a/webAO/styles/chatbox/chatfuture.css +++ b/webAO/styles/chatbox/chatfuture.css @@ -126,4 +126,8 @@ 100% { right: 0; } +} + +#client_trackstatus { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/chatp3.css b/webAO/styles/chatbox/chatp3.css index c8ed3f8..8c6a39d 100644 --- a/webAO/styles/chatbox/chatp3.css +++ b/webAO/styles/chatbox/chatp3.css @@ -110,4 +110,8 @@ bottom: 0.5em; opacity: 1; } +} + +#client_trackstatus { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/chatplvsaa.css b/webAO/styles/chatbox/chatplvsaa.css index eb7b8b6..af8a09f 100644 --- a/webAO/styles/chatbox/chatplvsaa.css +++ b/webAO/styles/chatbox/chatplvsaa.css @@ -102,4 +102,8 @@ #client_chatwaiting { display: none; +} + +#client_trackstatus { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/ddlc.css b/webAO/styles/chatbox/ddlc.css index 57c263e..f88b631 100644 --- a/webAO/styles/chatbox/ddlc.css +++ b/webAO/styles/chatbox/ddlc.css @@ -123,4 +123,8 @@ 100% { right: 0; } +} + +#client_trackstatus { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/dgs.css b/webAO/styles/chatbox/dgs.css index 654b86c..82a7699 100644 --- a/webAO/styles/chatbox/dgs.css +++ b/webAO/styles/chatbox/dgs.css @@ -133,3 +133,7 @@ right: 0.6em; } } + +#client_trackstatus { + display: none; +} \ No newline at end of file diff --git a/webAO/styles/chatbox/dr1.css b/webAO/styles/chatbox/dr1.css index 7696b26..26988d3 100644 --- a/webAO/styles/chatbox/dr1.css +++ b/webAO/styles/chatbox/dr1.css @@ -155,4 +155,8 @@ @keyframes marquee { from { text-indent: 0% } to { text-indent: -125% } +} + +#client_trackstatus { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/drae.css b/webAO/styles/chatbox/drae.css index 14bde1d..43e815d 100644 --- a/webAO/styles/chatbox/drae.css +++ b/webAO/styles/chatbox/drae.css @@ -99,4 +99,8 @@ #client_chatwaiting { display: none; +} + +#client_trackstatus { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/drv3.css b/webAO/styles/chatbox/drv3.css index 2a9e6d3..830ca9e 100644 --- a/webAO/styles/chatbox/drv3.css +++ b/webAO/styles/chatbox/drv3.css @@ -95,4 +95,8 @@ #client_chatwaiting { display: none; +} + +#client_trackstatus { + color: transparent; } \ No newline at end of file diff --git a/webAO/styles/chatbox/ff.css b/webAO/styles/chatbox/ff.css index d0b00b8..4528ca0 100644 --- a/webAO/styles/chatbox/ff.css +++ b/webAO/styles/chatbox/ff.css @@ -100,4 +100,8 @@ padding: 0.4% 2.8%; margin: 1px; line-height: 100%; +} + +#client_trackstatus { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/halla.css b/webAO/styles/chatbox/halla.css index 53622a6..0814b20 100644 --- a/webAO/styles/chatbox/halla.css +++ b/webAO/styles/chatbox/halla.css @@ -132,4 +132,8 @@ 50% { color: #fff; } +} + +#client_trackstatus { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/homestuck.css b/webAO/styles/chatbox/homestuck.css index aea8f99..a41031a 100644 --- a/webAO/styles/chatbox/homestuck.css +++ b/webAO/styles/chatbox/homestuck.css @@ -72,4 +72,8 @@ position: absolute; left: 2%; bottom: 2%; +} + +#client_trackstatus { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/key.css b/webAO/styles/chatbox/key.css index 43efed4..c269334 100644 --- a/webAO/styles/chatbox/key.css +++ b/webAO/styles/chatbox/key.css @@ -133,4 +133,8 @@ 100% { transform: rotate(90deg) scaleY(1); } +} + +#client_trackstatus { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/legacy.css b/webAO/styles/chatbox/legacy.css index 3fce78f..52fabf9 100644 --- a/webAO/styles/chatbox/legacy.css +++ b/webAO/styles/chatbox/legacy.css @@ -86,4 +86,8 @@ #client_chatwaiting { display: none; +} + +#client_trackstatus { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/n64zelda.css b/webAO/styles/chatbox/n64zelda.css index 5c203b8..59279e2 100644 --- a/webAO/styles/chatbox/n64zelda.css +++ b/webAO/styles/chatbox/n64zelda.css @@ -106,4 +106,8 @@ color: #3282ff; text-shadow: 0 0 0.2em #3282ff; } +} + +#client_trackstatus { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/p4.css b/webAO/styles/chatbox/p4.css index 3128d66..7389fae 100644 --- a/webAO/styles/chatbox/p4.css +++ b/webAO/styles/chatbox/p4.css @@ -108,4 +108,8 @@ #client_chatwaiting { display: none; +} + +#client_trackstatus { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/p5.css b/webAO/styles/chatbox/p5.css index 5df386a..da27529 100644 --- a/webAO/styles/chatbox/p5.css +++ b/webAO/styles/chatbox/p5.css @@ -104,4 +104,8 @@ 100% { right: 0; } +} + +#client_trackstatus { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/papermario.css b/webAO/styles/chatbox/papermario.css index 1d15590..ab62f26 100644 --- a/webAO/styles/chatbox/papermario.css +++ b/webAO/styles/chatbox/papermario.css @@ -90,4 +90,8 @@ to { transform: rotate(20deg); } +} + +#client_trackstatus { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/trilogy.css b/webAO/styles/chatbox/trilogy.css index bc455e9..927cfb8 100644 --- a/webAO/styles/chatbox/trilogy.css +++ b/webAO/styles/chatbox/trilogy.css @@ -109,4 +109,8 @@ 100% { right: 0.6em; } +} + +#client_trackstatus { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/whentheycry.css b/webAO/styles/chatbox/whentheycry.css index ba11f02..7fd611a 100644 --- a/webAO/styles/chatbox/whentheycry.css +++ b/webAO/styles/chatbox/whentheycry.css @@ -103,4 +103,8 @@ left: 0.2em; top: 0; } +} + +#client_trackstatus { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/yakuza.css b/webAO/styles/chatbox/yakuza.css index 683e11b..0da74fa 100644 --- a/webAO/styles/chatbox/yakuza.css +++ b/webAO/styles/chatbox/yakuza.css @@ -100,4 +100,8 @@ background-image: url("x_button.svg"); background-size: contain; transition: opacity 0.2s; +} + +#client_trackstatus { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/yttd.css b/webAO/styles/chatbox/yttd.css index c7e327b..1ec9c7d 100644 --- a/webAO/styles/chatbox/yttd.css +++ b/webAO/styles/chatbox/yttd.css @@ -111,4 +111,8 @@ 100% { bottom: 2px; } +} + +#client_trackstatus { + display: none; } \ No newline at end of file -- cgit From 1fb415128806b86ed7484177c55fa1aa0e12a9eb Mon Sep 17 00:00:00 2001 From: sD Date: Wed, 10 Aug 2022 21:44:05 +0200 Subject: add dr3 track status (unfinished) --- webAO/styles/chatbox/drv3.css | 17 ++++++++++++++++- webAO/styles/chatbox/drv3trackstatus.png | Bin 0 -> 18455 bytes webAO/styles/chatbox/drv3trackstatustext.png | Bin 0 -> 21648 bytes 3 files changed, 16 insertions(+), 1 deletion(-) create mode 100644 webAO/styles/chatbox/drv3trackstatus.png create mode 100644 webAO/styles/chatbox/drv3trackstatustext.png (limited to 'webAO') diff --git a/webAO/styles/chatbox/drv3.css b/webAO/styles/chatbox/drv3.css index 830ca9e..6855edb 100644 --- a/webAO/styles/chatbox/drv3.css +++ b/webAO/styles/chatbox/drv3.css @@ -98,5 +98,20 @@ } #client_trackstatus { - color: transparent; + position: absolute; + top: 0; + left: 0; + height: 10%; + background-image: url('drv3trackstatus.png'); + background-size: contain; + background-repeat: no-repeat; +} + +#client_trackstatustext { + position: absolute; + left: 0; + top: 10%; + background-image: url('drv3trackstatustext.png'); + background-size: contain; + background-repeat: no-repeat; } \ No newline at end of file diff --git a/webAO/styles/chatbox/drv3trackstatus.png b/webAO/styles/chatbox/drv3trackstatus.png new file mode 100644 index 0000000..200ef18 Binary files /dev/null and b/webAO/styles/chatbox/drv3trackstatus.png differ diff --git a/webAO/styles/chatbox/drv3trackstatustext.png b/webAO/styles/chatbox/drv3trackstatustext.png new file mode 100644 index 0000000..6bbe27f Binary files /dev/null and b/webAO/styles/chatbox/drv3trackstatustext.png differ -- cgit From f8b87e949339e170f280549ddea5876f357e32f0 Mon Sep 17 00:00:00 2001 From: sD Date: Wed, 10 Aug 2022 21:47:51 +0200 Subject: fix name wrapping around in dr3 --- webAO/styles/chatbox/drv3.css | 1 - 1 file changed, 1 deletion(-) (limited to 'webAO') diff --git a/webAO/styles/chatbox/drv3.css b/webAO/styles/chatbox/drv3.css index 6855edb..d73457d 100644 --- a/webAO/styles/chatbox/drv3.css +++ b/webAO/styles/chatbox/drv3.css @@ -60,7 +60,6 @@ #client_inner_name { transform: skew(-15deg); - padding: 0 2%; margin: 1px; } -- cgit From 9fcf758d8c125a24f279efc59614325405f85298 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Wed, 17 Aug 2022 22:54:47 +0200 Subject: add ACWW clock --- webAO/styles/chatbox/acww.css | 69 +++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 69 insertions(+) (limited to 'webAO') diff --git a/webAO/styles/chatbox/acww.css b/webAO/styles/chatbox/acww.css index ffda68b..00b2b7f 100644 --- a/webAO/styles/chatbox/acww.css +++ b/webAO/styles/chatbox/acww.css @@ -146,4 +146,73 @@ #client_trackstatus { display: none; +} + +#client_clock_date { + position: absolute; + width: 13%; + height: 4%; + right: 0; + top: 1%; + text-align: left; + color: #7d5500; + background: linear-gradient( + to bottom, + #ffef55, + #ffef55 20%, + #ffcf3c 20%, + #ffcf3c 40%, + #ffef55 40%, + #ffef55 60%, + #ffcf3c 60%, + #ffcf3c 80%, + #ffef55 80%, + #ffef55 100% + ); + border: 0.1em solid #ae4500; + border-radius: 50%; + border-bottom: none; + font-weight: bold; + padding-left: 1.5em; + padding-top: 0.5em; +} + +#client_clock_weekday { + position: absolute; + width: 2.5%; + height: 3%; + right: 1%; + top: 2%; + color: white; + background: green; + background-size: 100% 40%; + border: 0.1em solid green; + border-radius: 100%; +} + +#client_clock_time { + position: absolute; + width: 16%; + height: 4%; + right: 2%; + top: 4%; + text-align: center; + color: #5d5500; + background: linear-gradient( + to bottom, + rgba(255,255,0,0), + rgba(255,255,0,0) 20%, + #ffcf3c 20%, + #ffcf3c 40%, + #ffef55 40%, + #ffef55 60%, + #ffcf3c 60%, + #ffcf3c 80%, + #ffef55 80%, + #ffef55 100% + ); + border: 0.1em solid #ae4500; + border-radius: 50%; + border-top: none; + padding-top: 0.5em; } \ No newline at end of file -- cgit From 4a794666f2bdcdde08ddabe12ec7a895266e6585 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Wed, 17 Aug 2022 23:01:18 +0200 Subject: add clock css for styles that don't have clocks --- webAO/styles/chatbox/aa.css | 8 ++++++++ webAO/styles/chatbox/chat999.css | 4 ++++ webAO/styles/chatbox/chatdd.css | 4 ++++ webAO/styles/chatbox/chatdr2.css | 4 ++++ webAO/styles/chatbox/chatfuture.css | 4 ++++ webAO/styles/chatbox/chatplvsaa.css | 4 ++++ webAO/styles/chatbox/ddlc.css | 4 ++++ webAO/styles/chatbox/dgs.css | 4 ++++ webAO/styles/chatbox/ff.css | 4 ++++ webAO/styles/chatbox/halla.css | 4 ++++ webAO/styles/chatbox/homestuck.css | 4 ++++ webAO/styles/chatbox/key.css | 6 ++++++ webAO/styles/chatbox/legacy.css | 4 ++++ webAO/styles/chatbox/n64zelda.css | 4 ++++ webAO/styles/chatbox/papermario.css | 4 ++++ webAO/styles/chatbox/trilogy.css | 4 ++++ webAO/styles/chatbox/whentheycry.css | 4 ++++ webAO/styles/chatbox/yakuza.css | 4 ++++ webAO/styles/chatbox/yttd.css | 4 ++++ 19 files changed, 82 insertions(+) (limited to 'webAO') diff --git a/webAO/styles/chatbox/aa.css b/webAO/styles/chatbox/aa.css index 688f199..a504daf 100644 --- a/webAO/styles/chatbox/aa.css +++ b/webAO/styles/chatbox/aa.css @@ -139,3 +139,11 @@ right: 0; } } + +#client_trackstatus { + display: none; +} + +#client_clock { + display: none; +} \ No newline at end of file diff --git a/webAO/styles/chatbox/chat999.css b/webAO/styles/chatbox/chat999.css index 221dced..de20d28 100644 --- a/webAO/styles/chatbox/chat999.css +++ b/webAO/styles/chatbox/chat999.css @@ -121,4 +121,8 @@ #client_trackstatus { display: none; +} + +#client_clock { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/chatdd.css b/webAO/styles/chatbox/chatdd.css index dca2390..d1561a4 100644 --- a/webAO/styles/chatbox/chatdd.css +++ b/webAO/styles/chatbox/chatdd.css @@ -104,4 +104,8 @@ #client_trackstatus { display: none; +} + +#client_clock { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/chatdr2.css b/webAO/styles/chatbox/chatdr2.css index fdfc426..59b11dc 100644 --- a/webAO/styles/chatbox/chatdr2.css +++ b/webAO/styles/chatbox/chatdr2.css @@ -120,4 +120,8 @@ font-family: monospace; font-size: 1.2em; white-space: nowrap; +} + +#client_trackstatus { + display: fuck; } \ No newline at end of file diff --git a/webAO/styles/chatbox/chatfuture.css b/webAO/styles/chatbox/chatfuture.css index 96b124d..cd638f4 100644 --- a/webAO/styles/chatbox/chatfuture.css +++ b/webAO/styles/chatbox/chatfuture.css @@ -130,4 +130,8 @@ #client_trackstatus { display: none; +} + +#client_clock { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/chatplvsaa.css b/webAO/styles/chatbox/chatplvsaa.css index af8a09f..a656e9b 100644 --- a/webAO/styles/chatbox/chatplvsaa.css +++ b/webAO/styles/chatbox/chatplvsaa.css @@ -106,4 +106,8 @@ #client_trackstatus { display: none; +} + +#client_clock { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/ddlc.css b/webAO/styles/chatbox/ddlc.css index f88b631..0b019fb 100644 --- a/webAO/styles/chatbox/ddlc.css +++ b/webAO/styles/chatbox/ddlc.css @@ -127,4 +127,8 @@ #client_trackstatus { display: none; +} + +#client_clock { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/dgs.css b/webAO/styles/chatbox/dgs.css index 82a7699..77b8db0 100644 --- a/webAO/styles/chatbox/dgs.css +++ b/webAO/styles/chatbox/dgs.css @@ -136,4 +136,8 @@ #client_trackstatus { display: none; +} + +#client_clock { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/ff.css b/webAO/styles/chatbox/ff.css index 4528ca0..942794b 100644 --- a/webAO/styles/chatbox/ff.css +++ b/webAO/styles/chatbox/ff.css @@ -104,4 +104,8 @@ #client_trackstatus { display: none; +} + +#client_clock { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/halla.css b/webAO/styles/chatbox/halla.css index 0814b20..0932937 100644 --- a/webAO/styles/chatbox/halla.css +++ b/webAO/styles/chatbox/halla.css @@ -136,4 +136,8 @@ #client_trackstatus { display: none; +} + +#client_clock { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/homestuck.css b/webAO/styles/chatbox/homestuck.css index a41031a..e6eea68 100644 --- a/webAO/styles/chatbox/homestuck.css +++ b/webAO/styles/chatbox/homestuck.css @@ -76,4 +76,8 @@ #client_trackstatus { display: none; +} + +#client_clock { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/key.css b/webAO/styles/chatbox/key.css index c269334..74dc95a 100644 --- a/webAO/styles/chatbox/key.css +++ b/webAO/styles/chatbox/key.css @@ -137,4 +137,10 @@ #client_trackstatus { display: none; +} + +#client_clock { + position: absolute; + top: 1%; + left: 1%; } \ No newline at end of file diff --git a/webAO/styles/chatbox/legacy.css b/webAO/styles/chatbox/legacy.css index 52fabf9..debbcb3 100644 --- a/webAO/styles/chatbox/legacy.css +++ b/webAO/styles/chatbox/legacy.css @@ -90,4 +90,8 @@ #client_trackstatus { display: none; +} + +#client_clock { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/n64zelda.css b/webAO/styles/chatbox/n64zelda.css index 59279e2..35187f0 100644 --- a/webAO/styles/chatbox/n64zelda.css +++ b/webAO/styles/chatbox/n64zelda.css @@ -110,4 +110,8 @@ #client_trackstatus { display: none; +} + +#client_clock { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/papermario.css b/webAO/styles/chatbox/papermario.css index ab62f26..587fcd1 100644 --- a/webAO/styles/chatbox/papermario.css +++ b/webAO/styles/chatbox/papermario.css @@ -94,4 +94,8 @@ #client_trackstatus { display: none; +} + +#client_clock { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/trilogy.css b/webAO/styles/chatbox/trilogy.css index 927cfb8..05b98b7 100644 --- a/webAO/styles/chatbox/trilogy.css +++ b/webAO/styles/chatbox/trilogy.css @@ -113,4 +113,8 @@ #client_trackstatus { display: none; +} + +#client_clock { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/whentheycry.css b/webAO/styles/chatbox/whentheycry.css index 7fd611a..1a08e27 100644 --- a/webAO/styles/chatbox/whentheycry.css +++ b/webAO/styles/chatbox/whentheycry.css @@ -107,4 +107,8 @@ #client_trackstatus { display: none; +} + +#client_clock { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/yakuza.css b/webAO/styles/chatbox/yakuza.css index 0da74fa..40da26c 100644 --- a/webAO/styles/chatbox/yakuza.css +++ b/webAO/styles/chatbox/yakuza.css @@ -104,4 +104,8 @@ #client_trackstatus { display: none; +} + +#client_clock { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/yttd.css b/webAO/styles/chatbox/yttd.css index 1ec9c7d..b6bebc7 100644 --- a/webAO/styles/chatbox/yttd.css +++ b/webAO/styles/chatbox/yttd.css @@ -115,4 +115,8 @@ #client_trackstatus { display: none; +} + +#client_clock { + display: none; } \ No newline at end of file -- cgit From 158008e16594e2c074c907a2656466baa9d6d9cf Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Fri, 19 Aug 2022 13:57:08 +0200 Subject: fix weekdays color --- webAO/styles/chatbox/acww.css | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'webAO') diff --git a/webAO/styles/chatbox/acww.css b/webAO/styles/chatbox/acww.css index 00b2b7f..1f6699e 100644 --- a/webAO/styles/chatbox/acww.css +++ b/webAO/styles/chatbox/acww.css @@ -184,9 +184,9 @@ right: 1%; top: 2%; color: white; - background: green; + background: #00b63c; background-size: 100% 40%; - border: 0.1em solid green; + border: 0.1em solid #00b63c; border-radius: 100%; } -- cgit From f4711674144923ba14de51af4d1c9e108deec4fc Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Sun, 21 Aug 2022 18:22:19 +0200 Subject: handle out of range char ids a little better --- webAO/client.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 5cee9bf..94b80c1 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -773,7 +773,7 @@ class Client extends EventEmitter { let char_chatbox = "default"; let char_muted = false; - if (this.chars[char_id].name !== char_name) { + if (char_id < this.char_list_length && this.chars[char_id].name !== char_name) { console.info( `${this.chars[char_id].name} is iniediting to ${char_name}` ); -- cgit From 77e2da563b92bfac596caf0ee749f318e849786a Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Sun, 21 Aug 2022 18:32:18 +0200 Subject: wrap check in another if --- webAO/client.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 94b80c1..debd318 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -773,12 +773,14 @@ class Client extends EventEmitter { let char_chatbox = "default"; let char_muted = false; - if (char_id < this.char_list_length && this.chars[char_id].name !== char_name) { + if (char_id < this.char_list_length && char_id >= 0) { + if(this.chars[char_id].name !== char_name) { console.info( `${this.chars[char_id].name} is iniediting to ${char_name}` ); const chargs = (`${char_name}&` + "iniediter").split("&"); this.handleCharacterInfo(chargs, char_id); + } } try { -- cgit From a6186ff308c844b39d71cfd65e3d3117dbdbedb0 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Thu, 25 Aug 2022 19:06:50 +0200 Subject: fix judge actions for non-judges --- webAO/client.ts | 12 +++++------- 1 file changed, 5 insertions(+), 7 deletions(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index debd318..2f84277 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -516,9 +516,7 @@ class Client extends EventEmitter { * @param {string} testimony type */ sendRT(testimony: string) { - if (this.chars[this.charID].side === "jud") { - this.sendServer(`RT#${testimony}#%`); - } + this.sendServer(`RT#${testimony}#%`); } /** @@ -1998,16 +1996,16 @@ class Client extends EventEmitter { * position change * @param {string} pos new position */ - handleSP(pos: string) { - updateActionCommands(pos); + handleSP(args: string[]) { + updateActionCommands(args[1]); } /** * show/hide judge controls * @param {number} show either a 1 or a 0 */ - handleJD(show: number) { - if (show === 1) { + handleJD(args: string[]) { + if (Number(args[1]) === 1) { document.getElementById("judge_action").style.display = "inline-table"; document.getElementById("no_action").style.display = "none"; } else { -- cgit From 9bec7d0fba8c80284e260469ed3045e9dfdb5d79 Mon Sep 17 00:00:00 2001 From: Caleb Date: Thu, 25 Aug 2022 21:34:08 -0400 Subject: Remove handleMS and separate queryParser --- webAO/client.ts | 186 ++----------------------------------- webAO/packets/handlers/handleMS.ts | 163 ++++++++++++++++++++++++++++++++ webAO/utils/queryParser.ts | 22 +++++ 3 files changed, 193 insertions(+), 178 deletions(-) create mode 100644 webAO/packets/handlers/handleMS.ts create mode 100644 webAO/utils/queryParser.ts (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 2f84277..f42f622 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -35,28 +35,15 @@ import downloadFile from "./services/downloadFile"; import { getFilenameFromPath } from "./utils/paths"; const version = process.env.npm_package_version; import masterViewport, { Viewport } from "./viewport"; +import { handleMS } from './packets/handlers/handleMS'; -interface Testimony { - [key: number]: string; -} - -// Get the arguments from the URL bar -interface QueryParams { - ip: string; - serverIP: string; - mode: string; - asset: string; - theme: string; -} -let { ip: serverIP, mode, asset, theme } = queryParser() as QueryParams; +let { ip: serverIP, mode, asset, theme } = queryParser() ; // Unless there is an asset URL specified, use the wasabi one const DEFAULT_HOST = "http://attorneyoffline.de/base/"; export let AO_HOST = asset || DEFAULT_HOST; const THEME = theme || "default"; -let client: Client; - -const attorneyMarkdown = mlConfig(AO_HOST); +export let client: Client; export const UPDATE_INTERVAL = 60; @@ -71,7 +58,7 @@ let oldLoading = false; let selectedMenu = 1; let selectedShout = 0; -let extrafeatures: string[] = []; +export let extrafeatures: string[] = []; let banned: boolean = false; let hdid: string; @@ -220,14 +207,14 @@ class Client extends EventEmitter { this.selectedEmote = -1; this.selectedEvidence = 0; - + this.checkUpdater = null; this.viewport = masterViewport(this); /** * Assign handlers for all commands * If you implement a new command, you need to add it here */ - this.on("MS", this.handleMS.bind(this)); + this.on("MS", handleMS); this.on("CT", this.handleCT.bind(this)); this.on("MC", this.handleMC.bind(this)); this.on("RMC", this.handleRMC.bind(this)); @@ -754,165 +741,7 @@ class Client extends EventEmitter { (document.getElementById("client_inputbox")).value = ""; }; - /** - * Handles an in-character chat message. - * @param {*} args packet arguments - */ - handleMS(args: string[]) { - // TODO: this if-statement might be a bug. - if (args[4] !== this.viewport.chatmsg.content) { - document.getElementById("client_inner_chat").innerHTML = ""; - - const char_id = Number(args[9]); - const char_name = safeTags(args[3]); - - let msg_nameplate = args[3]; - let msg_blips = "male"; - let char_chatbox = "default"; - let char_muted = false; - - if (char_id < this.char_list_length && char_id >= 0) { - if(this.chars[char_id].name !== char_name) { - console.info( - `${this.chars[char_id].name} is iniediting to ${char_name}` - ); - const chargs = (`${char_name}&` + "iniediter").split("&"); - this.handleCharacterInfo(chargs, char_id); - } - } - - try { - msg_nameplate = this.chars[char_id].showname; - } catch (e) { - msg_nameplate = args[3]; - } - - try { - msg_blips = this.chars[char_id].blips; - } catch (e) {} - - try { - char_chatbox = this.chars[char_id].chat; - } catch (e) { - char_chatbox = "default"; - } - - try { - char_muted = this.chars[char_id].muted; - } catch (e) { - char_muted = false; - console.error("we're still missing some character data"); - } - - if (char_muted === false) { - let chatmsg = { - deskmod: safeTags(args[1]).toLowerCase(), - preanim: safeTags(args[2]).toLowerCase(), // get preanim - nameplate: msg_nameplate, - chatbox: char_chatbox, - name: char_name, - sprite: safeTags(args[4]).toLowerCase(), - content: prepChat(args[5]), // Escape HTML tags - side: args[6].toLowerCase(), - sound: safeTags(args[7]).toLowerCase(), - blips: safeTags(msg_blips), - type: Number(args[8]), - charid: char_id, - snddelay: Number(args[10]), - objection: Number(args[11]), - evidence: safeTags(args[12]), - flip: Number(args[13]), - flash: Number(args[14]), - color: Number(args[15]), - speed: UPDATE_INTERVAL, - }; - - if (extrafeatures.includes("cccc_ic_support")) { - const extra_cccc = { - showname: safeTags(args[16]), - other_charid: Number(args[17]), - other_name: safeTags(args[18]), - other_emote: safeTags(args[19]), - self_offset: args[20].split(""), // HACK: here as well, client is fucked and uses this instead of & - other_offset: args[21].split(""), - other_flip: Number(args[22]), - noninterrupting_preanim: Number(args[23]), - }; - chatmsg = Object.assign(extra_cccc, chatmsg); - - if (extrafeatures.includes("looping_sfx")) { - const extra_27 = { - looping_sfx: Number(args[24]), - screenshake: Number(args[25]), - frame_screenshake: safeTags(args[26]), - frame_realization: safeTags(args[27]), - frame_sfx: safeTags(args[28]), - }; - chatmsg = Object.assign(extra_27, chatmsg); - - if (extrafeatures.includes("effects")) { - const extra_28 = { - additive: Number(args[29]), - effects: args[30].split("|"), - }; - chatmsg = Object.assign(extra_28, chatmsg); - } else { - const extra_28 = { - additive: 0, - effects: ["", "", ""], - }; - chatmsg = Object.assign(extra_28, chatmsg); - } - } else { - const extra_27 = { - looping_sfx: 0, - screenshake: 0, - frame_screenshake: "", - frame_realization: "", - frame_sfx: "", - }; - chatmsg = Object.assign(extra_27, chatmsg); - const extra_28 = { - additive: 0, - effects: ["", "", ""], - }; - chatmsg = Object.assign(extra_28, chatmsg); - } - } else { - const extra_cccc = { - showname: "", - other_charid: 0, - other_name: "", - other_emote: "", - self_offset: [0, 0], - other_offset: [0, 0], - other_flip: 0, - noninterrupting_preanim: 0, - }; - chatmsg = Object.assign(extra_cccc, chatmsg); - const extra_27 = { - looping_sfx: 0, - screenshake: 0, - frame_screenshake: "", - frame_realization: "", - frame_sfx: "", - }; - chatmsg = Object.assign(extra_27, chatmsg); - const extra_28 = { - additive: 0, - effects: ["", "", ""], - }; - chatmsg = Object.assign(extra_28, chatmsg); - } - // our own message appeared, reset the buttons - if (chatmsg.charid === this.charID) { - resetICParams(); - } - this.viewport.handle_ic_speaking(chatmsg); // no await - } - } - } /** * Handles an out-of-character chat message. @@ -2176,7 +2005,7 @@ window.onEnter = onEnter; * This should only be called when the player's previous chat message * was successfully sent/presented. */ -function resetICParams() { +export function resetICParams() { (document.getElementById("client_inputbox")).value = ""; document.getElementById("button_flash").className = "client_button"; document.getElementById("button_shake").className = "client_button"; @@ -3010,4 +2839,5 @@ export function toggleShout(shout: number) { } } window.toggleShout = toggleShout; + export default Client; diff --git a/webAO/packets/handlers/handleMS.ts b/webAO/packets/handlers/handleMS.ts new file mode 100644 index 0000000..f3554ca --- /dev/null +++ b/webAO/packets/handlers/handleMS.ts @@ -0,0 +1,163 @@ +import { client, extrafeatures, resetICParams, UPDATE_INTERVAL } from "../../client"; +import { prepChat, safeTags } from "../../encoding"; + +/** + * Handles an in-character chat message. + * @param {*} args packet arguments + */ +export const handleMS = (args: string[]) => { + console.log(args) + // TODO: this if-statement might be a bug. + if (args[4] !== client.viewport.chatmsg.content) { + document.getElementById("client_inner_chat")!.innerHTML = ""; + + const char_id = Number(args[9]); + const char_name = safeTags(args[3]); + + let msg_nameplate = args[3]; + let msg_blips = "male"; + let char_chatbox = "default"; + let char_muted = false; + + if (char_id < client.char_list_length && char_id >= 0) { + if(client.chars[char_id].name !== char_name) { + console.info( + `${client.chars[char_id].name} is iniediting to ${char_name}` + ); + const chargs = (`${char_name}&` + "iniediter").split("&"); + client.handleCharacterInfo(chargs, char_id); + } + } + + try { + msg_nameplate = client.chars[char_id].showname; + } catch (e) { + msg_nameplate = args[3]; + } + + try { + msg_blips = client.chars[char_id].blips; + } catch (e) {} + + try { + char_chatbox = client.chars[char_id].chat; + } catch (e) { + char_chatbox = "default"; + } + + try { + char_muted = client.chars[char_id].muted; + } catch (e) { + char_muted = false; + console.error("we're still missing some character data"); + } + + if (char_muted === false) { + let chatmsg = { + deskmod: safeTags(args[1]).toLowerCase(), + preanim: safeTags(args[2]).toLowerCase(), // get preanim + nameplate: msg_nameplate, + chatbox: char_chatbox, + name: char_name, + sprite: safeTags(args[4]).toLowerCase(), + content: prepChat(args[5]), // Escape HTML tags + side: args[6].toLowerCase(), + sound: safeTags(args[7]).toLowerCase(), + blips: safeTags(msg_blips), + type: Number(args[8]), + charid: char_id, + snddelay: Number(args[10]), + objection: Number(args[11]), + evidence: safeTags(args[12]), + flip: Number(args[13]), + flash: Number(args[14]), + color: Number(args[15]), + speed: UPDATE_INTERVAL, + }; + + if (extrafeatures.includes("cccc_ic_support")) { + const extra_cccc = { + showname: safeTags(args[16]), + other_charid: Number(args[17]), + other_name: safeTags(args[18]), + other_emote: safeTags(args[19]), + self_offset: args[20].split(""), // HACK: here as well, client is fucked and uses this instead of & + other_offset: args[21].split(""), + other_flip: Number(args[22]), + noninterrupting_preanim: Number(args[23]), + }; + chatmsg = Object.assign(extra_cccc, chatmsg); + + if (extrafeatures.includes("looping_sfx")) { + const extra_27 = { + looping_sfx: Number(args[24]), + screenshake: Number(args[25]), + frame_screenshake: safeTags(args[26]), + frame_realization: safeTags(args[27]), + frame_sfx: safeTags(args[28]), + }; + chatmsg = Object.assign(extra_27, chatmsg); + + if (extrafeatures.includes("effects")) { + const extra_28 = { + additive: Number(args[29]), + effects: args[30].split("|"), + }; + chatmsg = Object.assign(extra_28, chatmsg); + } else { + const extra_28 = { + additive: 0, + effects: ["", "", ""], + }; + chatmsg = Object.assign(extra_28, chatmsg); + } + } else { + const extra_27 = { + looping_sfx: 0, + screenshake: 0, + frame_screenshake: "", + frame_realization: "", + frame_sfx: "", + }; + chatmsg = Object.assign(extra_27, chatmsg); + const extra_28 = { + additive: 0, + effects: ["", "", ""], + }; + chatmsg = Object.assign(extra_28, chatmsg); + } + } else { + const extra_cccc = { + showname: "", + other_charid: 0, + other_name: "", + other_emote: "", + self_offset: [0, 0], + other_offset: [0, 0], + other_flip: 0, + noninterrupting_preanim: 0, + }; + chatmsg = Object.assign(extra_cccc, chatmsg); + const extra_27 = { + looping_sfx: 0, + screenshake: 0, + frame_screenshake: "", + frame_realization: "", + frame_sfx: "", + }; + chatmsg = Object.assign(extra_27, chatmsg); + const extra_28 = { + additive: 0, + effects: ["", "", ""], + }; + chatmsg = Object.assign(extra_28, chatmsg); + } + + // our own message appeared, reset the buttons + if (chatmsg.charid === client.charID) { + resetICParams(); + } + client.viewport.handle_ic_speaking(chatmsg); // no await + } + } + } \ No newline at end of file diff --git a/webAO/utils/queryParser.ts b/webAO/utils/queryParser.ts new file mode 100644 index 0000000..3110c14 --- /dev/null +++ b/webAO/utils/queryParser.ts @@ -0,0 +1,22 @@ +interface QueryParams { + ip: string; + serverIP: string; + mode: string; + asset: string; + theme: string; +} +interface StringMap { + [key: string]: any; +} + +const queryParser = (): QueryParams => { + const queryDict: StringMap = {}; + location.search + .substr(1) + .split("&") + .forEach((item) => { + queryDict[item.split("=")[0]] = item.split("=")[1]; + }); + return queryDict as QueryParams; +}; +export default queryParser; -- cgit From a96a2b8c914e55f12d49b1287b445f89d32926ea Mon Sep 17 00:00:00 2001 From: Caleb Date: Thu, 25 Aug 2022 21:34:47 -0400 Subject: Removing unused imports --- webAO/client.ts | 3 --- webAO/packets/handlers/handleMS.ts | 1 - 2 files changed, 4 deletions(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index f42f622..c0ea5a0 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -8,7 +8,6 @@ import FingerprintJS from "@fingerprintjs/fingerprintjs"; import { EventEmitter } from "events"; import tryUrls from "./utils/tryUrls"; import { escapeChat, prepChat, safeTags, unescapeChat } from "./encoding"; -import mlConfig from "./utils/aoml"; // Load some defaults for the background and evidence dropdowns import vanilla_character_arr from "./constants/characters.js"; import vanilla_music_arr from "./constants/music.js"; @@ -25,10 +24,8 @@ import { changeSFXVolume, changeTestimonyVolume, } from "./dom/changeVolume.js"; -import setEmote from "./client/setEmote.js"; import fileExists from "./utils/fileExists.js"; import queryParser from "./utils/queryParser.js"; -import getAnimLength from "./utils/getAnimLength.js"; import getResources from "./utils/getResources.js"; import transparentPng from "./constants/transparentPng"; import downloadFile from "./services/downloadFile"; diff --git a/webAO/packets/handlers/handleMS.ts b/webAO/packets/handlers/handleMS.ts index f3554ca..0aad19a 100644 --- a/webAO/packets/handlers/handleMS.ts +++ b/webAO/packets/handlers/handleMS.ts @@ -6,7 +6,6 @@ import { prepChat, safeTags } from "../../encoding"; * @param {*} args packet arguments */ export const handleMS = (args: string[]) => { - console.log(args) // TODO: this if-statement might be a bug. if (args[4] !== client.viewport.chatmsg.content) { document.getElementById("client_inner_chat")!.innerHTML = ""; -- cgit From e849b2af16e381af15676283bf884457fa8e36d5 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Fri, 26 Aug 2022 19:16:04 +0200 Subject: add rain effect --- webAO/styles/effects/rain.css | 23 +++++++++++++++++++++++ webAO/viewport.ts | 24 +++++++++++++++++++----- 2 files changed, 42 insertions(+), 5 deletions(-) create mode 100644 webAO/styles/effects/rain.css (limited to 'webAO') diff --git a/webAO/styles/effects/rain.css b/webAO/styles/effects/rain.css new file mode 100644 index 0000000..0e350fa --- /dev/null +++ b/webAO/styles/effects/rain.css @@ -0,0 +1,23 @@ +#client_fg { + overflow: hidden; +} + +#client_fg p { + position: absolute; + bottom: 100%; + width: 1px; + height: 1em; + transform: rotate(10deg); + background: linear-gradient(rgba(200,200,200,0) 0%, rgba(200,200,200,0.5) 20%, rgba(250,250,250,0.6) 100%); + animation: falling 1s linear infinite; +} + +@keyframes falling { + 0% { + bottom: 100%; + + } + 100% { + bottom: -10%; + } +} \ No newline at end of file diff --git a/webAO/viewport.ts b/webAO/viewport.ts index 0f0dc01..323029f 100644 --- a/webAO/viewport.ts +++ b/webAO/viewport.ts @@ -635,15 +635,29 @@ const viewport = (masterClient: Client): Viewport => { // apply effects fg.style.animation = ""; + const effectName = chatmsg.effects[0].toLowerCase(); const badEffects = ["", "-", "none"]; - if ( + if (effectName.startsWith("rain") ) { + (document.getElementById("effect_css")).href = "styles/effects/rain.css"; + let intensity = 200; + if(effectName.endsWith("weak")) { + intensity = 100; + } else if (effectName.endsWith("strong")) { + intensity = 400; + } + for (let i = 0; i < intensity; i++) { + let drop = document.createElement("p"); + drop.style.left = (Math.random() * 100) + "%"; + drop.style.animationDelay = String(Math.random())+"s"; + fg.appendChild(drop) + } + } else if ( chatmsg.effects[0] && - !badEffects.includes(chatmsg.effects[0].toLowerCase()) + !badEffects.includes(effectName) ) { + (document.getElementById("effect_css")).href = ""; const baseEffectUrl = `${AO_HOST}themes/default/effects/`; - fg.src = `${baseEffectUrl}${encodeURI( - chatmsg.effects[0].toLowerCase() - )}.webp`; + fg.src = `${baseEffectUrl}${encodeURI(effectName)}.webp`; } else { fg.src = transparentPng; } -- cgit From 6f42857e57b00155b8b97187d66c6375e57944ec Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Fri, 26 Aug 2022 19:17:17 +0200 Subject: Update viewport.ts reset rain so it doesn't add up --- webAO/viewport.ts | 1 + 1 file changed, 1 insertion(+) (limited to 'webAO') diff --git a/webAO/viewport.ts b/webAO/viewport.ts index 323029f..e243e0b 100644 --- a/webAO/viewport.ts +++ b/webAO/viewport.ts @@ -638,6 +638,7 @@ const viewport = (masterClient: Client): Viewport => { const effectName = chatmsg.effects[0].toLowerCase(); const badEffects = ["", "-", "none"]; if (effectName.startsWith("rain") ) { + fg.innerHTML = ''; (document.getElementById("effect_css")).href = "styles/effects/rain.css"; let intensity = 200; if(effectName.endsWith("weak")) { -- cgit From f99c2bb36ba021128d8eaa311c6ca1eb50678d98 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Fri, 26 Aug 2022 19:25:15 +0200 Subject: make drops bigger --- webAO/styles/effects/rain.css | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'webAO') diff --git a/webAO/styles/effects/rain.css b/webAO/styles/effects/rain.css index 0e350fa..846b35e 100644 --- a/webAO/styles/effects/rain.css +++ b/webAO/styles/effects/rain.css @@ -5,8 +5,8 @@ #client_fg p { position: absolute; bottom: 100%; - width: 1px; - height: 1em; + width: 2px; + height: 2em; transform: rotate(10deg); background: linear-gradient(rgba(200,200,200,0) 0%, rgba(200,200,200,0.5) 20%, rgba(250,250,250,0.6) 100%); animation: falling 1s linear infinite; -- cgit From 3c15b3bb517feba40083865a2574ec1d04bb2108 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Fri, 26 Aug 2022 19:25:25 +0200 Subject: only reset when there are less drops than before --- webAO/viewport.ts | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) (limited to 'webAO') diff --git a/webAO/viewport.ts b/webAO/viewport.ts index e243e0b..c778891 100644 --- a/webAO/viewport.ts +++ b/webAO/viewport.ts @@ -638,7 +638,6 @@ const viewport = (masterClient: Client): Viewport => { const effectName = chatmsg.effects[0].toLowerCase(); const badEffects = ["", "-", "none"]; if (effectName.startsWith("rain") ) { - fg.innerHTML = ''; (document.getElementById("effect_css")).href = "styles/effects/rain.css"; let intensity = 200; if(effectName.endsWith("weak")) { @@ -646,6 +645,11 @@ const viewport = (masterClient: Client): Viewport => { } else if (effectName.endsWith("strong")) { intensity = 400; } + if ( intensity < fg.childElementCount) + fg.innerHTML = ''; + else + intensity = intensity - fg.childElementCount; + for (let i = 0; i < intensity; i++) { let drop = document.createElement("p"); drop.style.left = (Math.random() * 100) + "%"; @@ -657,6 +661,7 @@ const viewport = (masterClient: Client): Viewport => { !badEffects.includes(effectName) ) { (document.getElementById("effect_css")).href = ""; + fg.innerHTML = ''; const baseEffectUrl = `${AO_HOST}themes/default/effects/`; fg.src = `${baseEffectUrl}${encodeURI(effectName)}.webp`; } else { -- cgit From 20cdeeda24c9ab9d216f2556c3658b118fe43c4b Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Sat, 27 Aug 2022 18:48:06 +0200 Subject: add key calendar --- webAO/styles/chatbox/key.css | 52 ++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 52 insertions(+) (limited to 'webAO') diff --git a/webAO/styles/chatbox/key.css b/webAO/styles/chatbox/key.css index 74dc95a..cf979e7 100644 --- a/webAO/styles/chatbox/key.css +++ b/webAO/styles/chatbox/key.css @@ -47,6 +47,7 @@ width: 100%; filter: none; font-family: "Verdana"; + transition: height 1s linear; } #client_chatdecoration { @@ -143,4 +144,55 @@ position: absolute; top: 1%; left: 1%; + width: 12%; + height: 15%; + background-color: #d59a9a; + border: #ffbe9f 3px ridge; + border-radius: 100%; +} + +#client_clock_month { + position: absolute; + width: 90%; + height: 15%; + left: 5%; + top: 8%; + margin: 0; + color: #52443c; + background: #ffb183; + border: 2px white outset; + border-radius: 100%; + text-shadow: -1px -1px 0 #d7e5d9, 1px -1px 0 #d7e5d9, -1px 1px 0 #d7e5d9, 1px 1px 0 #d7e5d9; +} + +#client_clock_date { + position: absolute; + width: 50%; + height: 50%; + left: 25%; + top: 25%; + margin: 0; + color: #fdf5e4; + text-shadow: -1px -1px 0 #78320b, 1px -1px 0 #78320b, -1px 1px 0 #78320b, 1px 1px 0 #78320b; + font-size: 3em; +} + +#client_clock_weekday { + position: absolute; + width: 25%; + height: 25%; + right: 0; + bottom: 0; + margin: 0; + color: gray; + text-shadow: -1px -1px 0 darkgray, 1px -1px 0 darkgray, -1px 1px 0 darkgray, 1px 1px 0 darkgray; + text-decoration: underline; + font-size: smaller; + background-color: #c7856f; + border: #ffc89f 3px ridge; + border-radius: 100%; +} + +#client_clock_time { + display: none; } \ No newline at end of file -- cgit From 2a79fa570e6e144e4124f3038214f6f49d2acac0 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Sat, 27 Aug 2022 18:51:17 +0200 Subject: adjust the text --- webAO/styles/chatbox/key.css | 4 ++++ 1 file changed, 4 insertions(+) (limited to 'webAO') diff --git a/webAO/styles/chatbox/key.css b/webAO/styles/chatbox/key.css index cf979e7..50d2bc1 100644 --- a/webAO/styles/chatbox/key.css +++ b/webAO/styles/chatbox/key.css @@ -163,6 +163,8 @@ border: 2px white outset; border-radius: 100%; text-shadow: -1px -1px 0 #d7e5d9, 1px -1px 0 #d7e5d9, -1px 1px 0 #d7e5d9, 1px 1px 0 #d7e5d9; + font-size: small; + line-height: 1; } #client_clock_date { @@ -188,9 +190,11 @@ text-shadow: -1px -1px 0 darkgray, 1px -1px 0 darkgray, -1px 1px 0 darkgray, 1px 1px 0 darkgray; text-decoration: underline; font-size: smaller; + font-weight: bold; background-color: #c7856f; border: #ffc89f 3px ridge; border-radius: 100%; + line-height: 2; } #client_clock_time { -- cgit From e412b63731d851e8b05e2c28510716b3e0ce6e51 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Sat, 27 Aug 2022 19:11:56 +0200 Subject: set the time --- webAO/client.ts | 30 +++++++++++++++++++++++++----- webAO/styles/chatbox/acww.css | 4 ++++ 2 files changed, 29 insertions(+), 5 deletions(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index c0ea5a0..53551e2 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -38,7 +38,8 @@ let { ip: serverIP, mode, asset, theme } = queryParser() ; // Unless there is an asset URL specified, use the wasabi one const DEFAULT_HOST = "http://attorneyoffline.de/base/"; export let AO_HOST = asset || DEFAULT_HOST; -const THEME = theme || "default"; +let THEME: string = theme || "default"; +let CHATBOX: string; export let client: Client; @@ -2565,17 +2566,17 @@ export function setChatbox(style: string) { const themeselect = ( document.getElementById("client_chatboxselect") ); - const selected_theme = themeselect.value; + CHATBOX = themeselect.value; - setCookie("chatbox", selected_theme); - if (selected_theme === "dynamic") { + setCookie("chatbox", CHATBOX); + if (CHATBOX === "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`; + chatbox_theme.href = `styles/chatbox/${CHATBOX}.css`; } } window.setChatbox = setChatbox; @@ -2591,6 +2592,25 @@ export function resizeChatbox() { const trackstatus = (document.getElementById("client_trackstatustext")); trackstatus.width = (trackstatus.offsetWidth-1)+"px"; + + + //clock + const now = new Date(); + let weekday = ["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"]; + const month = ["January","February","March","April","May","June","July","August","September","October","November","December"]; + document.getElementById("client_clock_month").innerText = month[now.getMonth()]; + console.debug(CHATBOX); + if (CHATBOX == "acww") { + weekday = ["Su","Mo","Tu","We","Th","Fr","Sa"]; + document.getElementById("client_clock_weekday").innerText = weekday[now.getDay()]; + document.getElementById("client_clock_date").innerText = now.getDay()+"/"+now.getMonth(); + document.getElementById("client_clock_time").innerText = now.getHours()+":"+now.getMinutes(); + } else if (CHATBOX == "key") { + weekday = ["Sun.","Mon.","Tue.","Wed.","Thu.","Fri.","Sat."]; + document.getElementById("client_clock_weekday").innerText = weekday[now.getDay()]; + document.getElementById("client_clock_date").innerText = String(now.getDay()); + } + } window.resizeChatbox = resizeChatbox; diff --git a/webAO/styles/chatbox/acww.css b/webAO/styles/chatbox/acww.css index 1f6699e..dd899b9 100644 --- a/webAO/styles/chatbox/acww.css +++ b/webAO/styles/chatbox/acww.css @@ -177,6 +177,10 @@ padding-top: 0.5em; } +#client_clock_month { + display: none; +} + #client_clock_weekday { position: absolute; width: 2.5%; -- cgit From 2b249fb0effd3893b70a8f9ce3383992ea43c63d Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Sat, 27 Aug 2022 19:16:54 +0200 Subject: change iniediting back to the old input box --- webAO/client.ts | 29 ----------------------------- 1 file changed, 29 deletions(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index c0ea5a0..069e323 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -908,10 +908,6 @@ class Client extends EventEmitter { this.chars[charid].blips = this.chars[charid].gender; } - const iniedit_select = ( - document.getElementById("client_ininame") - ); - iniedit_select.add(new Option(safeTags(chargs[0]))); } else { console.warn(`missing charid ${charid}`); img.style.display = "none"; @@ -1776,31 +1772,6 @@ class Client extends EventEmitter { document.getElementById("button_4").style.display = "none"; } - const iniedit_select = ( - document.getElementById("client_ininame") - ); - - // Load iniswaps if there are any - try { - const cswapdata = await request( - `${AO_HOST}characters/${encodeURI(me.name.toLowerCase())}/iniswaps.ini` - ); - const cswap = cswapdata.split("\n"); - - // most iniswaps don't list their original char - if (cswap.length > 0) { - iniedit_select.innerHTML = ""; - - iniedit_select.add(new Option(safeTags(me.name))); - - cswap.forEach((inisw: string) => - iniedit_select.add(new Option(safeTags(inisw))) - ); - } - } catch (err) { - console.info("character doesn't have iniswaps"); - this.fetchCharacterList(); - } } /** -- cgit From 59f2093eccb135d13599b2ab36e24b21bf460a41 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Sat, 27 Aug 2022 19:58:33 +0200 Subject: hide clock in danganronpa --- webAO/styles/chatbox/dr1.css | 2 +- webAO/styles/chatbox/drae.css | 4 ++++ webAO/styles/chatbox/drv3.css | 4 ++++ 3 files changed, 9 insertions(+), 1 deletion(-) (limited to 'webAO') diff --git a/webAO/styles/chatbox/dr1.css b/webAO/styles/chatbox/dr1.css index 26988d3..ced1932 100644 --- a/webAO/styles/chatbox/dr1.css +++ b/webAO/styles/chatbox/dr1.css @@ -157,6 +157,6 @@ to { text-indent: -125% } } -#client_trackstatus { +#client_clock { display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/drae.css b/webAO/styles/chatbox/drae.css index 43e815d..d5b9fa0 100644 --- a/webAO/styles/chatbox/drae.css +++ b/webAO/styles/chatbox/drae.css @@ -103,4 +103,8 @@ #client_trackstatus { display: none; +} + +#client_clock { + display: none; } \ No newline at end of file diff --git a/webAO/styles/chatbox/drv3.css b/webAO/styles/chatbox/drv3.css index d73457d..c7eb957 100644 --- a/webAO/styles/chatbox/drv3.css +++ b/webAO/styles/chatbox/drv3.css @@ -113,4 +113,8 @@ background-image: url('drv3trackstatustext.png'); background-size: contain; background-repeat: no-repeat; +} + +#client_clock { + display: none; } \ No newline at end of file -- cgit From 2e5e164bbde1b024834430a91a5c1b81b6e33ae4 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Tue, 30 Aug 2022 19:53:47 +0200 Subject: fix #112 --- webAO/utils/calculateApngLength.js | 13 +++++++++---- 1 file changed, 9 insertions(+), 4 deletions(-) (limited to 'webAO') diff --git a/webAO/utils/calculateApngLength.js b/webAO/utils/calculateApngLength.js index 932f581..d6a40b6 100644 --- a/webAO/utils/calculateApngLength.js +++ b/webAO/utils/calculateApngLength.js @@ -13,13 +13,18 @@ const calculateApngLength = (apngFile) => { && d[i + 2] === 0x54 && d[i + 3] === 0x4C) { // numerator and denominator - const delay = ((d[i + 21] / d[i + 23]) * 1000); - + const delay_num = Number(d[i + 23]); + const delay_den = Number(d[i + 25]); + let delay; // minimum is 100ms - duration += delay < 100 ? 100 : delay; + if (delay_den == 0) + delay = delay_num / 100; + else + delay = delay_num / delay_den; + + duration = duration + delay; } } - console.debug(duration); return duration * 10; }; export default calculateApngLength; -- cgit From 2838fbe91a270ed3d69ac708dac85b108b6f09dc Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Tue, 30 Aug 2022 20:53:31 +0200 Subject: use the typescript version of queryparser --- webAO/client.ts | 2 +- webAO/utils/queryParser.js | 9 --------- 2 files changed, 1 insertion(+), 10 deletions(-) delete mode 100644 webAO/utils/queryParser.js (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index edd5d13..918704d 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -25,7 +25,7 @@ import { changeTestimonyVolume, } from "./dom/changeVolume.js"; import fileExists from "./utils/fileExists.js"; -import queryParser from "./utils/queryParser.js"; +import queryParser from "./utils/queryParser"; import getResources from "./utils/getResources.js"; import transparentPng from "./constants/transparentPng"; import downloadFile from "./services/downloadFile"; diff --git a/webAO/utils/queryParser.js b/webAO/utils/queryParser.js deleted file mode 100644 index 1c2b83a..0000000 --- a/webAO/utils/queryParser.js +++ /dev/null @@ -1,9 +0,0 @@ -// Get the arguments from the URL bar -const queryParser = () => { - const queryDict = {}; - location.search.substr(1).split('&').forEach((item) => { - queryDict[item.split('=')[0]] = item.split('=')[1]; - }); - return queryDict; -}; -export default queryParser; -- cgit From 325aa41d1216facbb7228743930a8ad21afec7aa Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Tue, 30 Aug 2022 20:58:25 +0200 Subject: convert cookie stuff to ts --- webAO/client.ts | 4 ++-- webAO/utils/getCookie.js | 26 -------------------------- webAO/utils/getCookie.ts | 26 ++++++++++++++++++++++++++ webAO/utils/setCookie.js | 10 ---------- webAO/utils/setCookie.ts | 10 ++++++++++ 5 files changed, 38 insertions(+), 38 deletions(-) delete mode 100644 webAO/utils/getCookie.js create mode 100644 webAO/utils/getCookie.ts delete mode 100644 webAO/utils/setCookie.js create mode 100644 webAO/utils/setCookie.ts (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 918704d..a2735b2 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -16,8 +16,8 @@ import vanilla_evidence_arr from "./constants/evidence.js"; import chatbox_arr from "./styles/chatbox/chatboxes.js"; import iniParse from "./iniParse"; -import getCookie from "./utils/getCookie.js"; -import setCookie from "./utils/setCookie.js"; +import getCookie from "./utils/getCookie"; +import setCookie from "./utils/setCookie"; import { request } from "./services/request.js"; import { changeShoutVolume, diff --git a/webAO/utils/getCookie.js b/webAO/utils/getCookie.js deleted file mode 100644 index 3be0733..0000000 --- a/webAO/utils/getCookie.js +++ /dev/null @@ -1,26 +0,0 @@ -/** - * read a cookie from storage - * got this from w3schools - * https://www.w3schools.com/js/js_cookies.asp - * @param {String} cname The name of the cookie to return - */ -const getCookie = (cname) => { - try { - const name = `${cname}=`; - const decodedCookie = decodeURIComponent(document.cookie); - const ca = decodedCookie.split(';'); - for (let i = 0; i < ca.length; i++) { - let c = ca[i]; - while (c.charAt(0) === ' ') { - c = c.substring(1); - } - if (c.indexOf(name) === 0) { - return c.substring(name.length, c.length); - } - } - return ''; - } catch (error) { - return ''; - } -}; -export default getCookie; diff --git a/webAO/utils/getCookie.ts b/webAO/utils/getCookie.ts new file mode 100644 index 0000000..f5b9679 --- /dev/null +++ b/webAO/utils/getCookie.ts @@ -0,0 +1,26 @@ +/** + * read a cookie from storage + * got this from w3schools + * https://www.w3schools.com/js/js_cookies.asp + * @param {String} cname The name of the cookie to return + */ +const getCookie = (cname: String) => { + try { + const name = `${cname}=`; + const decodedCookie = decodeURIComponent(document.cookie); + const ca = decodedCookie.split(';'); + for (let i = 0; i < ca.length; i++) { + let c = ca[i]; + while (c.charAt(0) === ' ') { + c = c.substring(1); + } + if (c.indexOf(name) === 0) { + return c.substring(name.length, c.length); + } + } + return ''; + } catch (error) { + return ''; + } +}; +export default getCookie; diff --git a/webAO/utils/setCookie.js b/webAO/utils/setCookie.js deleted file mode 100644 index 9734eae..0000000 --- a/webAO/utils/setCookie.js +++ /dev/null @@ -1,10 +0,0 @@ -/** - * set a cookie - * the version from w3schools expects these to expire - * @param {String} cname The name of the cookie to return - * @param {String} value The value of that cookie option - */ -const setCookie = (cname, value) => { - document.cookie = `${cname}=${value}`; -}; -export default setCookie; diff --git a/webAO/utils/setCookie.ts b/webAO/utils/setCookie.ts new file mode 100644 index 0000000..084fa20 --- /dev/null +++ b/webAO/utils/setCookie.ts @@ -0,0 +1,10 @@ +/** + * set a cookie + * the version from w3schools expects these to expire + * @param {String} cname The name of the cookie to return + * @param {any} value The value of that cookie option + */ +const setCookie = (cname: String, value: any) => { + document.cookie = `${cname}=${value}`; +}; +export default setCookie; -- cgit From be5bd2e466951a3b525a97d595e577f3194913db Mon Sep 17 00:00:00 2001 From: Caleb Date: Tue, 30 Aug 2022 16:14:31 -0400 Subject: Format and move two packets --- webAO/client.ts | 102 ++++++++++--------------------------- webAO/packets/handlers/handleCT.ts | 17 +++++++ webAO/packets/handlers/handleMC.ts | 41 +++++++++++++++ 3 files changed, 84 insertions(+), 76 deletions(-) create mode 100644 webAO/packets/handlers/handleCT.ts create mode 100644 webAO/packets/handlers/handleMC.ts (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index a2735b2..bc96703 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -13,7 +13,8 @@ import vanilla_character_arr from "./constants/characters.js"; import vanilla_music_arr from "./constants/music.js"; import vanilla_background_arr from "./constants/backgrounds.js"; import vanilla_evidence_arr from "./constants/evidence.js"; - +import { handleCT } from './packets/handlers/handleCT' +import { handleMC } from './packets/handlers/handleMC' import chatbox_arr from "./styles/chatbox/chatboxes.js"; import iniParse from "./iniParse"; import getCookie from "./utils/getCookie"; @@ -34,7 +35,7 @@ const version = process.env.npm_package_version; import masterViewport, { Viewport } from "./viewport"; import { handleMS } from './packets/handlers/handleMS'; -let { ip: serverIP, mode, asset, theme } = queryParser() ; +let { ip: serverIP, mode, asset, theme } = queryParser(); // Unless there is an asset URL specified, use the wasabi one const DEFAULT_HOST = "http://attorneyoffline.de/base/"; export let AO_HOST = asset || DEFAULT_HOST; @@ -205,7 +206,7 @@ class Client extends EventEmitter { this.selectedEmote = -1; this.selectedEvidence = 0; - + this.checkUpdater = null; this.viewport = masterViewport(this); /** @@ -213,8 +214,8 @@ class Client extends EventEmitter { * If you implement a new command, you need to add it here */ this.on("MS", handleMS); - this.on("CT", this.handleCT.bind(this)); - this.on("MC", this.handleMC.bind(this)); + this.on("CT", handleCT); + this.on("MC", handleMC); this.on("RMC", this.handleRMC.bind(this)); this.on("CI", this.handleCI.bind(this)); this.on("SC", this.handleSC.bind(this)); @@ -252,9 +253,9 @@ class Client extends EventEmitter { this.on("ackMS", this.handleackMS.bind(this)); this.on("SP", this.handleSP.bind(this)); this.on("JD", this.handleJD.bind(this)); - this.on("decryptor", () => {}); - this.on("CHECK", () => {}); - this.on("CH", () => {}); + this.on("decryptor", () => { }); + this.on("CHECK", () => { }); + this.on("CH", () => { }); this._lastTimeICReceived = new Date(0); } @@ -436,9 +437,8 @@ class Client extends EventEmitter { if (mode === "replay") { (( document.getElementById("client_ooclog") - )).value += `wait#${ - (document.getElementById("client_replaytimer")).value - }#%\r\n`; + )).value += `wait#${(document.getElementById("client_replaytimer")).value + }#%\r\n`; } } @@ -741,58 +741,9 @@ class Client extends EventEmitter { - /** - * Handles an out-of-character chat message. - * @param {Array} args packet arguments - */ - handleCT(args: string[]) { - if (mode !== "replay") { - const oocLog = document.getElementById("client_ooclog"); - oocLog.innerHTML += `${prepChat(args[1])}: ${prepChat(args[2])}\r\n`; - if (oocLog.scrollTop > oocLog.scrollHeight - 600) { - oocLog.scrollTop = oocLog.scrollHeight; - } - } - } - - /** - * Handles a music change to an arbitrary resource. - * @param {Array} args packet arguments - */ - handleMC(args: string[]) { - const track = prepChat(args[1]); - let charID = Number(args[2]); - const showname = args[3] || ""; - const looping = Boolean(args[4]); - const channel = Number(args[5]) || 0; - // const fading = Number(args[6]) || 0; // unused in web - - const music = this.viewport.music[channel]; - let musicname; - music.pause(); - if (track.startsWith("http")) { - music.src = track; - } else { - music.src = `${AO_HOST}sounds/music/${encodeURI(track.toLowerCase())}`; - } - music.loop = looping; - music.play(); - try { - musicname = this.chars[charID].name; - } catch (e) { - charID = -1; - } - if (charID >= 0) { - musicname = this.chars[charID].name; - appendICLog(`${musicname} changed music to ${track}`); - } else { - appendICLog(`The music was changed to ${track}`); - } - document.getElementById("client_trackstatustext").innerText = track; - } // TODO BUG: // this.viewport.music is an array. Therefore you must access elements @@ -958,7 +909,7 @@ class Client extends EventEmitter { document.getElementById("client_loadingtext").innerHTML = "Loading Characters"; - for (let i = 1; i < args.length-1; i++) { + for (let i = 1; i < args.length - 1; i++) { document.getElementById( "client_loadingtext" ).innerHTML = `Loading Character ${i}/${this.char_list_length}`; @@ -2050,9 +2001,8 @@ export function mutelist_click(_event: Event) { if (client.chars[selected_character.value].muted === false) { client.chars[selected_character.value].muted = true; - selected_character.text = `${ - client.chars[selected_character.value].name - } (muted)`; + selected_character.text = `${client.chars[selected_character.value].name + } (muted)`; console.info(`muted ${client.chars[selected_character.value].name}`); } else { client.chars[selected_character.value].muted = false; @@ -2562,26 +2512,26 @@ export function resizeChatbox() { chatContainerBox.style.fontSize = `${(gameHeight * 0.0521).toFixed(1)}px`; const trackstatus = (document.getElementById("client_trackstatustext")); - trackstatus.width = (trackstatus.offsetWidth-1)+"px"; + trackstatus.width = (trackstatus.offsetWidth - 1) + "px"; //clock const now = new Date(); - let weekday = ["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"]; - const month = ["January","February","March","April","May","June","July","August","September","October","November","December"]; + let weekday = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"]; + const month = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]; document.getElementById("client_clock_month").innerText = month[now.getMonth()]; console.debug(CHATBOX); if (CHATBOX == "acww") { - weekday = ["Su","Mo","Tu","We","Th","Fr","Sa"]; - document.getElementById("client_clock_weekday").innerText = weekday[now.getDay()]; - document.getElementById("client_clock_date").innerText = now.getDay()+"/"+now.getMonth(); - document.getElementById("client_clock_time").innerText = now.getHours()+":"+now.getMinutes(); + weekday = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"]; + document.getElementById("client_clock_weekday").innerText = weekday[now.getDay()]; + document.getElementById("client_clock_date").innerText = now.getDay() + "/" + now.getMonth(); + document.getElementById("client_clock_time").innerText = now.getHours() + ":" + now.getMinutes(); } else if (CHATBOX == "key") { - weekday = ["Sun.","Mon.","Tue.","Wed.","Thu.","Fri.","Sat."]; - document.getElementById("client_clock_weekday").innerText = weekday[now.getDay()]; - document.getElementById("client_clock_date").innerText = String(now.getDay()); + weekday = ["Sun.", "Mon.", "Tue.", "Wed.", "Thu.", "Fri.", "Sat."]; + document.getElementById("client_clock_weekday").innerText = weekday[now.getDay()]; + document.getElementById("client_clock_date").innerText = String(now.getDay()); } - + } window.resizeChatbox = resizeChatbox; @@ -2628,7 +2578,7 @@ export function updateActionCommands(side: string) { // Update role selector for ( let i = 0, - role_select = document.getElementById("role_select"); + role_select = document.getElementById("role_select"); i < role_select.options.length; i++ ) { diff --git a/webAO/packets/handlers/handleCT.ts b/webAO/packets/handlers/handleCT.ts new file mode 100644 index 0000000..cff9b24 --- /dev/null +++ b/webAO/packets/handlers/handleCT.ts @@ -0,0 +1,17 @@ +import queryParser from '../../utils/queryParser' +import { prepChat } from '../../encoding' +let { mode } = queryParser(); + +/** + * Handles an out-of-character chat message. + * @param {Array} args packet arguments + */ +export const handleCT = (args: string[]) => { + if (mode !== "replay") { + const oocLog = document.getElementById("client_ooclog")!; + oocLog.innerHTML += `${prepChat(args[1])}: ${prepChat(args[2])}\r\n`; + if (oocLog.scrollTop > oocLog.scrollHeight - 600) { + oocLog.scrollTop = oocLog.scrollHeight; + } + } +} \ No newline at end of file diff --git a/webAO/packets/handlers/handleMC.ts b/webAO/packets/handlers/handleMC.ts new file mode 100644 index 0000000..28254ba --- /dev/null +++ b/webAO/packets/handlers/handleMC.ts @@ -0,0 +1,41 @@ +import { prepChat } from "../../encoding"; +import { AO_HOST, appendICLog, client } from '../../client' + +/** + * Handles a music change to an arbitrary resource. + * @param {Array} args packet arguments + */ +export const handleMC = (args: string[]) => { + const track = prepChat(args[1]); + let charID = Number(args[2]); + const showname = args[3] || ""; + const looping = Boolean(args[4]); + const channel = Number(args[5]) || 0; + // const fading = Number(args[6]) || 0; // unused in web + + const music = client.viewport.music[channel]; + let musicname; + music.pause(); + if (track.startsWith("http")) { + music.src = track; + } else { + music.src = `${AO_HOST}sounds/music/${encodeURI(track.toLowerCase())}`; + } + music.loop = looping; + music.play(); + + try { + musicname = client.chars[charID].name; + } catch (e) { + charID = -1; + } + + if (charID >= 0) { + musicname = client.chars[charID].name; + appendICLog(`${musicname} changed music to ${track}`); + } else { + appendICLog(`The music was changed to ${track}`); + } + + document.getElementById("client_trackstatustext")!.innerText = track; +} \ No newline at end of file -- cgit From 3d6e61c6b0962cea539c6d780d68a7ad0b64bee1 Mon Sep 17 00:00:00 2001 From: Caleb Date: Tue, 30 Aug 2022 16:20:08 -0400 Subject: One more handler --- webAO/client.ts | 29 ++++------------------------- webAO/packets/handlers/handleRMC.ts | 24 ++++++++++++++++++++++++ 2 files changed, 28 insertions(+), 25 deletions(-) create mode 100644 webAO/packets/handlers/handleRMC.ts (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index bc96703..676aa3f 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -15,6 +15,7 @@ import vanilla_background_arr from "./constants/backgrounds.js"; import vanilla_evidence_arr from "./constants/evidence.js"; import { handleCT } from './packets/handlers/handleCT' import { handleMC } from './packets/handlers/handleMC' +import { handleRMC } from './packets/handlers/handleRMC' import chatbox_arr from "./styles/chatbox/chatboxes.js"; import iniParse from "./iniParse"; import getCookie from "./utils/getCookie"; @@ -216,7 +217,7 @@ class Client extends EventEmitter { this.on("MS", handleMS); this.on("CT", handleCT); this.on("MC", handleMC); - this.on("RMC", this.handleRMC.bind(this)); + this.on("RMC", handleRMC); this.on("CI", this.handleCI.bind(this)); this.on("SC", this.handleSC.bind(this)); this.on("EI", this.handleEI.bind(this)); @@ -438,7 +439,7 @@ class Client extends EventEmitter { (( document.getElementById("client_ooclog") )).value += `wait#${(document.getElementById("client_replaytimer")).value - }#%\r\n`; + }#%\r\n`; } } @@ -745,29 +746,7 @@ class Client extends EventEmitter { - // TODO BUG: - // this.viewport.music is an array. Therefore you must access elements - /** - * Handles a music change to an arbitrary resource, with an offset in seconds. - * @param {Array} args packet arguments - */ - handleRMC(args: string[]) { - this.viewport.music.pause(); - const { music } = this.viewport; - // Music offset + drift from song loading - music.totime = args[1]; - music.offset = new Date().getTime() / 1000; - music.addEventListener( - "loadedmetadata", - () => { - music.currentTime += parseFloat( - music.totime + (new Date().getTime() / 1000 - music.offset) - ).toFixed(3); - music.play(); - }, - false - ); - } + /** * Handles the incoming character information, and downloads the sprite + ini for it diff --git a/webAO/packets/handlers/handleRMC.ts b/webAO/packets/handlers/handleRMC.ts new file mode 100644 index 0000000..ada1ad2 --- /dev/null +++ b/webAO/packets/handlers/handleRMC.ts @@ -0,0 +1,24 @@ +import { client } from '../../client' +// TODO BUG: +// this.viewport.music is an array. Therefore you must access elements +/** + * Handles a music change to an arbitrary resource, with an offset in seconds. + * @param {Array} args packet arguments + */ +export const handleRMC = (args: string[]) => { + client.viewport.music.pause(); + const { music } = client.viewport; + // Music offset + drift from song loading + music.totime = args[1]; + music.offset = new Date().getTime() / 1000; + music.addEventListener( + "loadedmetadata", + () => { + music.currentTime += parseFloat( + music.totime + (new Date().getTime() / 1000 - music.offset) + ).toFixed(3); + music.play(); + }, + false + ); +} \ No newline at end of file -- cgit From 39861acb94feaed7c7833597b14ab99e5acea42f Mon Sep 17 00:00:00 2001 From: Caleb Date: Tue, 30 Aug 2022 17:12:52 -0400 Subject: Three more packets moved --- webAO/client.ts | 81 -------------------------------------- webAO/packets/handlers/handleCI.ts | 26 ++++++++++++ webAO/packets/handlers/handleEI.ts | 29 ++++++++++++++ webAO/packets/handlers/handleSC.ts | 37 +++++++++++++++++ 4 files changed, 92 insertions(+), 81 deletions(-) create mode 100644 webAO/packets/handlers/handleCI.ts create mode 100644 webAO/packets/handlers/handleEI.ts create mode 100644 webAO/packets/handlers/handleSC.ts (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 676aa3f..17065ce 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -845,91 +845,10 @@ class Client extends EventEmitter { } } - /** - * Handles incoming character information, bundling multiple characters - * per packet. - * CI#0#Phoenix&description&&&&#Miles ... - * @param {Array} args packet arguments - */ - handleCI(args: string[]) { - // Loop through the 10 characters that were sent - for (let i = 2; i <= args.length - 2; i++) { - if (i % 2 === 0) { - document.getElementById( - "client_loadingtext" - ).innerHTML = `Loading Character ${args[1]}/${this.char_list_length}`; - const chargs = args[i].split("&"); - const charid = Number(args[i - 1]); - (( - document.getElementById("client_loadingbar") - )).value = charid; - setTimeout(() => this.handleCharacterInfo(chargs, charid), 500); - } - } - // Request the next pack - this.sendServer(`AN#${Number(args[1]) / 10 + 1}#%`); - } - /** - * Handles incoming character information, containing all characters - * in one packet. - * @param {Array} args packet arguments - */ - async handleSC(args: string[]) { - const sleep = (ms: number) => new Promise((r) => setTimeout(r, ms)); - if (mode === "watch") { - // Spectators don't need to pick a character - document.getElementById("client_charselect").style.display = "none"; - } else { - document.getElementById("client_charselect").style.display = "block"; - } - document.getElementById("client_loadingtext").innerHTML = - "Loading Characters"; - for (let i = 1; i < args.length - 1; i++) { - document.getElementById( - "client_loadingtext" - ).innerHTML = `Loading Character ${i}/${this.char_list_length}`; - const chargs = args[i].split("&"); - const charid = i - 1; - (( - document.getElementById("client_loadingbar") - )).value = charid; - await sleep(0.1); // TODO: Too many network calls without this. net::ERR_INSUFFICIENT_RESOURCES - this.handleCharacterInfo(chargs, charid); - } - // We're done with the characters, request the music - this.sendServer("RM#%"); - } - - /** - * Handles incoming evidence information, containing only one evidence - * item per packet. - * - * EI#id#name&description&type&image&##% - * - * @param {Array} args packet arguments - */ - handleEI(args: string[]) { - document.getElementById( - "client_loadingtext" - ).innerHTML = `Loading Evidence ${args[1]}/${this.evidence_list_length}`; - const evidenceID = Number(args[1]); - (document.getElementById("client_loadingbar")).value = - this.char_list_length + evidenceID; - - const arg = args[2].split("&"); - this.evidences[evidenceID] = { - name: prepChat(arg[0]), - desc: prepChat(arg[1]), - filename: safeTags(arg[3]), - icon: `${AO_HOST}evidence/${encodeURI(arg[3].toLowerCase())}`, - }; - - this.sendServer("AE" + (evidenceID + 1) + "#%"); - } /** * Handles incoming evidence list, all evidences at once diff --git a/webAO/packets/handlers/handleCI.ts b/webAO/packets/handlers/handleCI.ts new file mode 100644 index 0000000..74d3039 --- /dev/null +++ b/webAO/packets/handlers/handleCI.ts @@ -0,0 +1,26 @@ +import { client } from '../../client' +/** + * Handles incoming character information, bundling multiple characters + * per packet. + * CI#0#Phoenix&description&&&&#Miles ... + * @param {Array} args packet arguments + */ +export const handleCI = (args: string[]) => { + // Loop through the 10 characters that were sent + + for (let i = 2; i <= args.length - 2; i++) { + if (i % 2 === 0) { + document.getElementById( + "client_loadingtext" + )!.innerHTML = `Loading Character ${args[1]}/${client.char_list_length}`; + const chargs = args[i].split("&"); + const charid = Number(args[i - 1]); + (( + document.getElementById("client_loadingbar") + )).value = charid; + setTimeout(() => client.handleCharacterInfo(chargs, charid), 500); + } + } + // Request the next pack + client.sendServer(`AN#${Number(args[1]) / 10 + 1}#%`); +} \ No newline at end of file diff --git a/webAO/packets/handlers/handleEI.ts b/webAO/packets/handlers/handleEI.ts new file mode 100644 index 0000000..e96f0c9 --- /dev/null +++ b/webAO/packets/handlers/handleEI.ts @@ -0,0 +1,29 @@ +import { AO_HOST, client } from '../../client' +import { prepChat, safeTags } from '../../encoding'; + +/** + * Handles incoming evidence information, containing only one evidence + * item per packet. + * + * EI#id#name&description&type&image&##% + * + * @param {Array} args packet arguments + */ +export const handleEI = (args: string[]) => { + document.getElementById( + "client_loadingtext" + )!.innerHTML = `Loading Evidence ${args[1]}/${client.evidence_list_length}`; + const evidenceID = Number(args[1]); + (document.getElementById("client_loadingbar")).value = + client.char_list_length + evidenceID; + + const arg = args[2].split("&"); + client.evidences[evidenceID] = { + name: prepChat(arg[0]), + desc: prepChat(arg[1]), + filename: safeTags(arg[3]), + icon: `${AO_HOST}evidence/${encodeURI(arg[3].toLowerCase())}`, + }; + + client.sendServer("AE" + (evidenceID + 1) + "#%"); +} \ No newline at end of file diff --git a/webAO/packets/handlers/handleSC.ts b/webAO/packets/handlers/handleSC.ts new file mode 100644 index 0000000..3689a17 --- /dev/null +++ b/webAO/packets/handlers/handleSC.ts @@ -0,0 +1,37 @@ +import queryParser from "../../utils/queryParser"; + +import { client } from '../../client' +let { mode } = queryParser(); + +/** + * Handles incoming character information, containing all characters + * in one packet. + * @param {Array} args packet arguments + */ +export const handleSC = async (args: string[]) => { + const sleep = (ms: number) => new Promise((r) => setTimeout(r, ms)); + + if (mode === "watch") { + // Spectators don't need to pick a character + document.getElementById("client_charselect")!.style.display = "none"; + } else { + document.getElementById("client_charselect")!.style.display = "block"; + } + + document.getElementById("client_loadingtext")!.innerHTML = + "Loading Characters"; + for (let i = 1; i < args.length - 1; i++) { + document.getElementById( + "client_loadingtext" + )!.innerHTML = `Loading Character ${i}/${client.char_list_length}`; + const chargs = args[i].split("&"); + const charid = i - 1; + (( + document.getElementById("client_loadingbar") + )).value = charid; + await sleep(0.1); // TODO: Too many network calls without this. net::ERR_INSUFFICIENT_RESOURCES + client.handleCharacterInfo(chargs, charid); + } + // We're done with the characters, request the music + client.sendServer("RM#%"); +} \ No newline at end of file -- cgit From c54b4545f663dc2ef4d62626360419a32ecf1f60 Mon Sep 17 00:00:00 2001 From: Caleb Date: Tue, 30 Aug 2022 17:14:07 -0400 Subject: Beep bah boop three more down --- webAO/client.ts | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 17065ce..4a1f3f3 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -16,6 +16,9 @@ import vanilla_evidence_arr from "./constants/evidence.js"; import { handleCT } from './packets/handlers/handleCT' import { handleMC } from './packets/handlers/handleMC' import { handleRMC } from './packets/handlers/handleRMC' +import {handleEI} from './packets/handlers/handleEI' +import {handleSC} from './packets/handlers/handleSC' +import {handleCI} from './packets/handlers/handleCI' import chatbox_arr from "./styles/chatbox/chatboxes.js"; import iniParse from "./iniParse"; import getCookie from "./utils/getCookie"; @@ -218,9 +221,9 @@ class Client extends EventEmitter { this.on("CT", handleCT); this.on("MC", handleMC); this.on("RMC", handleRMC); - this.on("CI", this.handleCI.bind(this)); - this.on("SC", this.handleSC.bind(this)); - this.on("EI", this.handleEI.bind(this)); + this.on("CI", handleCI); + this.on("SC", handleSC); + this.on("EI", handleEI); this.on("FL", this.handleFL.bind(this)); this.on("LE", this.handleLE.bind(this)); this.on("EM", this.handleEM.bind(this)); -- cgit From 5d5cb58412bd663aed4897ef7b0f0bd7f263d096 Mon Sep 17 00:00:00 2001 From: Caleb Date: Tue, 30 Aug 2022 17:28:30 -0400 Subject: Add more --- webAO/client.ts | 130 ++++--------------------------------- webAO/packets/handlers/handleEM.ts | 39 +++++++++++ webAO/packets/handlers/handleFL.ts | 48 ++++++++++++++ webAO/packets/handlers/handleLE.ts | 34 ++++++++++ 4 files changed, 134 insertions(+), 117 deletions(-) create mode 100644 webAO/packets/handlers/handleEM.ts create mode 100644 webAO/packets/handlers/handleFL.ts create mode 100644 webAO/packets/handlers/handleLE.ts (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 4a1f3f3..636ac83 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -16,9 +16,12 @@ import vanilla_evidence_arr from "./constants/evidence.js"; import { handleCT } from './packets/handlers/handleCT' import { handleMC } from './packets/handlers/handleMC' import { handleRMC } from './packets/handlers/handleRMC' -import {handleEI} from './packets/handlers/handleEI' -import {handleSC} from './packets/handlers/handleSC' -import {handleCI} from './packets/handlers/handleCI' +import { handleFL } from './packets/handlers/handleFL' +import { handleLE } from './packets/handlers/handleLE' +import { handleEM } from './packets/handlers/handleEM' +import { handleEI } from './packets/handlers/handleEI' +import { handleSC } from './packets/handlers/handleSC' +import { handleCI } from './packets/handlers/handleCI' import chatbox_arr from "./styles/chatbox/chatboxes.js"; import iniParse from "./iniParse"; import getCookie from "./utils/getCookie"; @@ -62,6 +65,10 @@ let selectedMenu = 1; let selectedShout = 0; export let extrafeatures: string[] = []; +export const setExtraFeatures = (val: any) => { + extrafeatures = val +} + let banned: boolean = false; let hdid: string; @@ -224,9 +231,9 @@ class Client extends EventEmitter { this.on("CI", handleCI); this.on("SC", handleSC); this.on("EI", handleEI); - this.on("FL", this.handleFL.bind(this)); - this.on("LE", this.handleLE.bind(this)); - this.on("EM", this.handleEM.bind(this)); + this.on("FL", handleFL); + this.on("LE", handleLE); + this.on("EM", handleEM); this.on("FM", this.handleFM.bind(this)); this.on("FA", this.handleFA.bind(this)); this.on("SM", this.handleSM.bind(this)); @@ -853,37 +860,6 @@ class Client extends EventEmitter { - /** - * Handles incoming evidence list, all evidences at once - * item per packet. - * - * @param {Array} args packet arguments - */ - handleLE(args: string[]) { - this.evidences = []; - for (let i = 1; i < args.length - 1; i++) { - (( - document.getElementById("client_loadingbar") - )).value = this.char_list_length + i; - const arg = args[i].split("&"); - this.evidences[i - 1] = { - name: prepChat(arg[0]), - desc: prepChat(arg[1]), - filename: safeTags(arg[2]), - icon: `${AO_HOST}evidence/${encodeURI(arg[2].toLowerCase())}`, - }; - } - - const evidence_box = document.getElementById("evidences"); - evidence_box.innerHTML = ""; - for (let i = 1; i <= this.evidences.length; i++) { - evidence_box.innerHTML += `${this.evidences[i - 1].name}`; - } - } resetMusicList() { this.musics = []; @@ -1013,42 +989,7 @@ class Client extends EventEmitter { } } - /** - * Handles incoming music information, containing multiple entries - * per packet. - * @param {Array} args packet arguments - */ - handleEM(args: string[]) { - document.getElementById("client_loadingtext").innerHTML = "Loading Music"; - if (args[1] === "0") { - this.resetMusicList(); - this.resetAreaList(); - this.musics_time = false; - } - for (let i = 2; i < args.length - 1; i++) { - if (i % 2 === 0) { - const trackname = safeTags(args[i]); - const trackindex = Number(args[i - 1]); - (( - document.getElementById("client_loadingbar") - )).value = - this.char_list_length + this.evidence_list_length + trackindex; - if (this.musics_time) { - this.addTrack(trackname); - } else if (this.isAudio(trackname)) { - this.musics_time = true; - this.fix_last_area(); - this.addTrack(trackname); - } else { - this.createArea(trackindex, trackname); - } - } - } - - // get the next batch of tracks - this.sendServer(`AM#${Number(args[1]) / 10 + 1}#%`); - } /** * Handles incoming music information, containing all music in one packet. @@ -1447,51 +1388,6 @@ class Client extends EventEmitter { } } - /** - * With this the server tells us which features it supports - * @param {Array} args list of features - */ - handleFL(args: string[]) { - console.info("Server-supported features:"); - console.info(args); - extrafeatures = args; - - if (args.includes("yellowtext")) { - const colorselect = ( - document.getElementById("textcolor") - ); - - colorselect.options[colorselect.options.length] = new Option( - "Yellow", - "5" - ); - colorselect.options[colorselect.options.length] = new Option("Grey", "6"); - colorselect.options[colorselect.options.length] = new Option("Pink", "7"); - colorselect.options[colorselect.options.length] = new Option("Cyan", "8"); - } - - if (args.includes("cccc_ic_support")) { - document.getElementById("cccc").style.display = ""; - document.getElementById("pairing").style.display = ""; - } - - if (args.includes("flipping")) { - document.getElementById("button_flip").style.display = ""; - } - - if (args.includes("looping_sfx")) { - document.getElementById("button_shake").style.display = ""; - document.getElementById("2.7").style.display = ""; - } - - if (args.includes("effects")) { - document.getElementById("2.8").style.display = ""; - } - - if (args.includes("y_offset")) { - document.getElementById("y_offset").style.display = ""; - } - } /** * Received when the server announces its server info, diff --git a/webAO/packets/handlers/handleEM.ts b/webAO/packets/handlers/handleEM.ts new file mode 100644 index 0000000..973d2af --- /dev/null +++ b/webAO/packets/handlers/handleEM.ts @@ -0,0 +1,39 @@ +import { client } from '../../client' +import { safeTags } from '../../encoding'; + +/** + * Handles incoming music information, containing multiple entries + * per packet. + * @param {Array} args packet arguments + */ +export const handleEM = (args: string[]) => { + document.getElementById("client_loadingtext")!.innerHTML = "Loading Music"; + if (args[1] === "0") { + client.resetMusicList(); + client.resetAreaList(); + client.musics_time = false; + } + + for (let i = 2; i < args.length - 1; i++) { + if (i % 2 === 0) { + const trackname = safeTags(args[i]); + const trackindex = Number(args[i - 1]); + (( + document.getElementById("client_loadingbar") + )).value = + client.char_list_length + client.evidence_list_length + trackindex; + if (client.musics_time) { + client.addTrack(trackname); + } else if (client.isAudio(trackname)) { + client.musics_time = true; + client.fix_last_area(); + client.addTrack(trackname); + } else { + client.createArea(trackindex, trackname); + } + } + } + + // get the next batch of tracks + client.sendServer(`AM#${Number(args[1]) / 10 + 1}#%`); +} \ No newline at end of file diff --git a/webAO/packets/handlers/handleFL.ts b/webAO/packets/handlers/handleFL.ts new file mode 100644 index 0000000..d9e67e5 --- /dev/null +++ b/webAO/packets/handlers/handleFL.ts @@ -0,0 +1,48 @@ +import { setExtraFeatures } from "../../client"; + + + /** + * With this the server tells us which features it supports + * @param {Array} args list of features + */ +export const handleFL = (args: string[]) => { + console.info("Server-supported features:"); + console.info(args); + setExtraFeatures(args); + + if (args.includes("yellowtext")) { + const colorselect = ( + document.getElementById("textcolor") + ); + + colorselect.options[colorselect.options.length] = new Option( + "Yellow", + "5" + ); + colorselect.options[colorselect.options.length] = new Option("Grey", "6"); + colorselect.options[colorselect.options.length] = new Option("Pink", "7"); + colorselect.options[colorselect.options.length] = new Option("Cyan", "8"); + } + + if (args.includes("cccc_ic_support")) { + document.getElementById("cccc")!.style.display = ""; + document.getElementById("pairing")!.style.display = ""; + } + + if (args.includes("flipping")) { + document.getElementById("button_flip")!.style.display = ""; + } + + if (args.includes("looping_sfx")) { + document.getElementById("button_shake")!.style.display = ""; + document.getElementById("2.7")!.style.display = ""; + } + + if (args.includes("effects")) { + document.getElementById("2.8")!.style.display = ""; + } + + if (args.includes("y_offset")) { + document.getElementById("y_offset")!.style.display = ""; + } + } diff --git a/webAO/packets/handlers/handleLE.ts b/webAO/packets/handlers/handleLE.ts new file mode 100644 index 0000000..28f0b40 --- /dev/null +++ b/webAO/packets/handlers/handleLE.ts @@ -0,0 +1,34 @@ +import { AO_HOST, client } from '../../client' +import { prepChat, safeTags } from '../../encoding'; + +/** + * Handles incoming evidence list, all evidences at once + * item per packet. + * + * @param {Array} args packet arguments + */ +export const handleLE = (args: string[]) => { + client.evidences = []; + for (let i = 1; i < args.length - 1; i++) { + (( + document.getElementById("client_loadingbar") + )).value = client.char_list_length + i; + const arg = args[i].split("&"); + client.evidences[i - 1] = { + name: prepChat(arg[0]), + desc: prepChat(arg[1]), + filename: safeTags(arg[2]), + icon: `${AO_HOST}evidence/${encodeURI(arg[2].toLowerCase())}`, + }; + } + + const evidence_box = document.getElementById("evidences")!; + evidence_box.innerHTML = ""; + for (let i = 1; i <= client.evidences.length; i++) { + evidence_box.innerHTML += `${client.evidences[i - 1].name}`; + } +} \ No newline at end of file -- cgit From c95c943938b2254bdb9581fc4b00e72d15e91436 Mon Sep 17 00:00:00 2001 From: Caleb Date: Tue, 30 Aug 2022 17:39:51 -0400 Subject: More packets moved --- webAO/client.ts | 68 +++-------------------------- webAO/packets/handlers/handleFA.ts | 14 ++++++ webAO/packets/handlers/handleFL.ts | 88 +++++++++++++++++++------------------- webAO/packets/handlers/handleFM.ts | 16 +++++++ webAO/packets/handlers/handleSM.ts | 36 ++++++++++++++++ 5 files changed, 116 insertions(+), 106 deletions(-) create mode 100644 webAO/packets/handlers/handleFA.ts create mode 100644 webAO/packets/handlers/handleFM.ts create mode 100644 webAO/packets/handlers/handleSM.ts (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 636ac83..c13a6e0 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -22,6 +22,9 @@ import { handleEM } from './packets/handlers/handleEM' import { handleEI } from './packets/handlers/handleEI' import { handleSC } from './packets/handlers/handleSC' import { handleCI } from './packets/handlers/handleCI' +import { handleFM } from './packets/handlers/handleFM' +import { handleFA } from './packets/handlers/handleFA' +import { handleSM } from './packets/handlers/handleSM' import chatbox_arr from "./styles/chatbox/chatboxes.js"; import iniParse from "./iniParse"; import getCookie from "./utils/getCookie"; @@ -234,9 +237,9 @@ class Client extends EventEmitter { this.on("FL", handleFL); this.on("LE", handleLE); this.on("EM", handleEM); - this.on("FM", this.handleFM.bind(this)); - this.on("FA", this.handleFA.bind(this)); - this.on("SM", this.handleSM.bind(this)); + this.on("FM", handleFM); + this.on("FA", handleFA); + this.on("SM", handleSM); this.on("MM", this.handleMM.bind(this)); this.on("BD", this.handleBD.bind(this)); this.on("BB", this.handleBB.bind(this)); @@ -991,66 +994,7 @@ class Client extends EventEmitter { - /** - * Handles incoming music information, containing all music in one packet. - * @param {Array} args packet arguments - */ - handleSM(args: string[]) { - document.getElementById("client_loadingtext").innerHTML = "Loading Music "; - this.resetMusicList(); - this.resetAreaList(); - - this.musics_time = false; - - for (let i = 1; i < args.length - 1; i++) { - // Check when found the song for the first time - const trackname = args[i]; - const trackindex = i - 1; - document.getElementById( - "client_loadingtext" - ).innerHTML = `Loading Music ${i}/${this.music_list_length}`; - (( - document.getElementById("client_loadingbar") - )).value = this.char_list_length + this.evidence_list_length + i; - if (this.musics_time) { - this.addTrack(trackname); - } else if (this.isAudio(trackname)) { - this.musics_time = true; - this.fix_last_area(); - this.addTrack(trackname); - } else { - this.createArea(trackindex, trackname); - } - } - - // Music done, carry on - this.sendServer("RD#%"); - } - /** - * Handles updated music list - * @param {Array} args packet arguments - */ - handleFM(args: string[]) { - this.resetMusicList(); - - for (let i = 1; i < args.length - 1; i++) { - // Check when found the song for the first time - this.addTrack(safeTags(args[i])); - } - } - - /** - * Handles updated area list - * @param {Array} args packet arguments - */ - handleFA(args: string[]) { - this.resetAreaList(); - - for (let i = 1; i < args.length - 1; i++) { - this.createArea(i - 1, safeTags(args[i])); - } - } /** * Handles the "MusicMode" packet diff --git a/webAO/packets/handlers/handleFA.ts b/webAO/packets/handlers/handleFA.ts new file mode 100644 index 0000000..ccfe923 --- /dev/null +++ b/webAO/packets/handlers/handleFA.ts @@ -0,0 +1,14 @@ +import { client } from '../../client' +import { safeTags } from '../../encoding'; + +/** + * Handles updated area list + * @param {Array} args packet arguments + */ +export const handleFA = (args: string[]) => { + client.resetAreaList(); + + for (let i = 1; i < args.length - 1; i++) { + client.createArea(i - 1, safeTags(args[i])); + } +} diff --git a/webAO/packets/handlers/handleFL.ts b/webAO/packets/handlers/handleFL.ts index d9e67e5..378d5a9 100644 --- a/webAO/packets/handlers/handleFL.ts +++ b/webAO/packets/handlers/handleFL.ts @@ -1,48 +1,48 @@ import { setExtraFeatures } from "../../client"; - - /** - * With this the server tells us which features it supports - * @param {Array} args list of features - */ + +/** + * With this the server tells us which features it supports + * @param {Array} args list of features + */ export const handleFL = (args: string[]) => { - console.info("Server-supported features:"); - console.info(args); - setExtraFeatures(args); - - if (args.includes("yellowtext")) { - const colorselect = ( - document.getElementById("textcolor") - ); - - colorselect.options[colorselect.options.length] = new Option( - "Yellow", - "5" - ); - colorselect.options[colorselect.options.length] = new Option("Grey", "6"); - colorselect.options[colorselect.options.length] = new Option("Pink", "7"); - colorselect.options[colorselect.options.length] = new Option("Cyan", "8"); - } - - if (args.includes("cccc_ic_support")) { - document.getElementById("cccc")!.style.display = ""; - document.getElementById("pairing")!.style.display = ""; - } - - if (args.includes("flipping")) { - document.getElementById("button_flip")!.style.display = ""; - } - - if (args.includes("looping_sfx")) { - document.getElementById("button_shake")!.style.display = ""; - document.getElementById("2.7")!.style.display = ""; - } - - if (args.includes("effects")) { - document.getElementById("2.8")!.style.display = ""; - } - - if (args.includes("y_offset")) { - document.getElementById("y_offset")!.style.display = ""; - } + console.info("Server-supported features:"); + console.info(args); + setExtraFeatures(args); + + if (args.includes("yellowtext")) { + const colorselect = ( + document.getElementById("textcolor") + ); + + colorselect.options[colorselect.options.length] = new Option( + "Yellow", + "5" + ); + colorselect.options[colorselect.options.length] = new Option("Grey", "6"); + colorselect.options[colorselect.options.length] = new Option("Pink", "7"); + colorselect.options[colorselect.options.length] = new Option("Cyan", "8"); + } + + if (args.includes("cccc_ic_support")) { + document.getElementById("cccc")!.style.display = ""; + document.getElementById("pairing")!.style.display = ""; + } + + if (args.includes("flipping")) { + document.getElementById("button_flip")!.style.display = ""; + } + + if (args.includes("looping_sfx")) { + document.getElementById("button_shake")!.style.display = ""; + document.getElementById("2.7")!.style.display = ""; + } + + if (args.includes("effects")) { + document.getElementById("2.8")!.style.display = ""; + } + + if (args.includes("y_offset")) { + document.getElementById("y_offset")!.style.display = ""; } +} diff --git a/webAO/packets/handlers/handleFM.ts b/webAO/packets/handlers/handleFM.ts new file mode 100644 index 0000000..630477b --- /dev/null +++ b/webAO/packets/handlers/handleFM.ts @@ -0,0 +1,16 @@ +import { client } from "../../client"; +import { safeTags } from "../../encoding"; + + +/** + * Handles updated music list + * @param {Array} args packet arguments + */ +export const handleFM = (args: string[]) => { + client.resetMusicList(); + + for (let i = 1; i < args.length - 1; i++) { + // Check when found the song for the first time + client.addTrack(safeTags(args[i])); + } +} diff --git a/webAO/packets/handlers/handleSM.ts b/webAO/packets/handlers/handleSM.ts new file mode 100644 index 0000000..5dab83e --- /dev/null +++ b/webAO/packets/handlers/handleSM.ts @@ -0,0 +1,36 @@ +import { client } from '../../client' +/** + * Handles incoming music information, containing all music in one packet. + * @param {Array} args packet arguments + */ +export const handleSM = (args: string[]) => { + document.getElementById("client_loadingtext")!.innerHTML = "Loading Music "; + client.resetMusicList(); + client.resetAreaList(); + + client.musics_time = false; + + for (let i = 1; i < args.length - 1; i++) { + // Check when found the song for the first time + const trackname = args[i]; + const trackindex = i - 1; + document.getElementById( + "client_loadingtext" + )!.innerHTML = `Loading Music ${i}/${client.music_list_length}`; + (( + document.getElementById("client_loadingbar") + )).value = client.char_list_length + client.evidence_list_length + i; + if (client.musics_time) { + client.addTrack(trackname); + } else if (client.isAudio(trackname)) { + client.musics_time = true; + client.fix_last_area(); + client.addTrack(trackname); + } else { + client.createArea(trackindex, trackname); + } + } + + // Music done, carry on + client.sendServer("RD#%"); +} -- cgit From 56026c522ba84bc0211a896398d701cb79725b54 Mon Sep 17 00:00:00 2001 From: Caleb Date: Tue, 30 Aug 2022 17:50:08 -0400 Subject: Five packets --- webAO/client.ts | 62 ++++++++++---------------------------- webAO/packets/handlers/handleBB.ts | 11 +++++++ webAO/packets/handlers/handleBD.ts | 13 ++++++++ webAO/packets/handlers/handleKB.ts | 12 ++++++++ webAO/packets/handlers/handleKK.ts | 11 +++++++ webAO/packets/handlers/handleMM.ts | 8 +++++ 6 files changed, 71 insertions(+), 46 deletions(-) create mode 100644 webAO/packets/handlers/handleBB.ts create mode 100644 webAO/packets/handlers/handleBD.ts create mode 100644 webAO/packets/handlers/handleKB.ts create mode 100644 webAO/packets/handlers/handleKK.ts create mode 100644 webAO/packets/handlers/handleMM.ts (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index c13a6e0..1fdd3c5 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -25,6 +25,11 @@ import { handleCI } from './packets/handlers/handleCI' import { handleFM } from './packets/handlers/handleFM' import { handleFA } from './packets/handlers/handleFA' import { handleSM } from './packets/handlers/handleSM' +import { handleMM } from './packets/handlers/handleMM' +import { handleBD } from './packets/handlers/handleBD' +import { handleBB } from './packets/handlers/handleBB' +import { handleKB } from './packets/handlers/handleKB' +import { handleKK } from './packets/handlers/handleKK' import chatbox_arr from "./styles/chatbox/chatboxes.js"; import iniParse from "./iniParse"; import getCookie from "./utils/getCookie"; @@ -72,7 +77,10 @@ export const setExtraFeatures = (val: any) => { extrafeatures = val } -let banned: boolean = false; +export let banned: boolean = false; +export const setBanned = (val: boolean) => { + banned = val +} let hdid: string; declare global { @@ -240,11 +248,11 @@ class Client extends EventEmitter { this.on("FM", handleFM); this.on("FA", handleFA); this.on("SM", handleSM); - this.on("MM", this.handleMM.bind(this)); - this.on("BD", this.handleBD.bind(this)); - this.on("BB", this.handleBB.bind(this)); - this.on("KB", this.handleKB.bind(this)); - this.on("KK", this.handleKK.bind(this)); + this.on("MM", handleMM); + this.on("BD", handleBD); + this.on("BB", handleBB); + this.on("KB", handleKB); + this.on("KK", handleKK); this.on("DONE", this.handleDONE.bind(this)); this.on("BN", this.handleBN.bind(this)); this.on("HP", this.handleHP.bind(this)); @@ -996,13 +1004,6 @@ class Client extends EventEmitter { - /** - * Handles the "MusicMode" packet - * @param {Array} args packet arguments - */ - handleMM(_args: string[]) { - // It's unused nowadays, as preventing people from changing the music is now serverside - } /** * Handles the kicked packet @@ -1022,42 +1023,11 @@ class Client extends EventEmitter { )).style.display = "none"; } - /** - * Handles the kicked packet - * @param {Array} args kick reason - */ - handleKK(args: string[]) { - this.handleBans("Kicked", safeTags(args[1])); - } - /** - * Handles the banned packet - * this one is sent when you are kicked off the server - * @param {Array} args ban reason - */ - handleKB(args: string[]) { - this.handleBans("Banned", safeTags(args[1])); - banned = true; - } - /** - * Handles the warning packet - * on client this spawns a message box you can't close for 2 seconds - * @param {Array} args ban reason - */ - handleBB(args: string[]) { - alert(safeTags(args[1])); - } - /** - * Handles the banned packet - * this one is sent when you try to reconnect but you're banned - * @param {Array} args ban reason - */ - handleBD(args: string[]) { - this.handleBans("Banned", safeTags(args[1])); - banned = true; - } + + /** * Handles the handshake completion packet, meaning the player diff --git a/webAO/packets/handlers/handleBB.ts b/webAO/packets/handlers/handleBB.ts new file mode 100644 index 0000000..c12c4f6 --- /dev/null +++ b/webAO/packets/handlers/handleBB.ts @@ -0,0 +1,11 @@ +import { safeTags } from "../../encoding"; + + +/** + * Handles the warning packet + * on client this spawns a message box you can't close for 2 seconds + * @param {Array} args ban reason + */ +export const handleBB = (args: string[]) => { + alert(safeTags(args[1])); +} \ No newline at end of file diff --git a/webAO/packets/handlers/handleBD.ts b/webAO/packets/handlers/handleBD.ts new file mode 100644 index 0000000..4ec291e --- /dev/null +++ b/webAO/packets/handlers/handleBD.ts @@ -0,0 +1,13 @@ +import { client, setBanned } from "../../client"; +import { safeTags } from "../../encoding"; + + +/** + * Handles the banned packet + * this one is sent when you try to reconnect but you're banned + * @param {Array} args ban reason + */ +export const handleBD = (args: string[]) => { + client.handleBans("Banned", safeTags(args[1])); + setBanned(true); +} \ No newline at end of file diff --git a/webAO/packets/handlers/handleKB.ts b/webAO/packets/handlers/handleKB.ts new file mode 100644 index 0000000..8705b83 --- /dev/null +++ b/webAO/packets/handlers/handleKB.ts @@ -0,0 +1,12 @@ +import { client, setBanned } from "../../client"; +import { safeTags } from "../../encoding"; + +/** + * Handles the banned packet + * this one is sent when you are kicked off the server + * @param {Array} args ban reason + */ +export const handleKB = (args: string[]) => { + client.handleBans("Banned", safeTags(args[1])); + setBanned(true); +} diff --git a/webAO/packets/handlers/handleKK.ts b/webAO/packets/handlers/handleKK.ts new file mode 100644 index 0000000..fd9a88c --- /dev/null +++ b/webAO/packets/handlers/handleKK.ts @@ -0,0 +1,11 @@ +import { client } from "../../client"; +import { safeTags } from "../../encoding"; + + +/** + * Handles the kicked packet + * @param {Array} args kick reason + */ +export const handleKK = (args: string[]) => { + client.handleBans("Kicked", safeTags(args[1])); +} diff --git a/webAO/packets/handlers/handleMM.ts b/webAO/packets/handlers/handleMM.ts new file mode 100644 index 0000000..077140f --- /dev/null +++ b/webAO/packets/handlers/handleMM.ts @@ -0,0 +1,8 @@ + +/** + * Handles the "MusicMode" packet + * @param {Array} args packet arguments + */ +export const handleMM = (_args: string[]) => { + // It's unused nowadays, as preventing people from changing the music is now serverside +} \ No newline at end of file -- cgit From 357b27c0aae95031a5d94bdbc504d82b797b22e2 Mon Sep 17 00:00:00 2001 From: Caleb Date: Tue, 30 Aug 2022 18:08:05 -0400 Subject: Several packets added --- webAO/client.ts | 214 +++-------------------------------- webAO/packets/handlers/handleBN.ts | 81 +++++++++++++ webAO/packets/handlers/handleDONE.ts | 16 +++ webAO/packets/handlers/handleHI.ts | 14 +++ webAO/packets/handlers/handleHP.ts | 23 ++++ webAO/packets/handlers/handleRT.ts | 25 ++++ webAO/packets/handlers/handleTI.ts | 21 ++++ webAO/packets/handlers/handleZZ.ts | 22 ++++ 8 files changed, 217 insertions(+), 199 deletions(-) create mode 100644 webAO/packets/handlers/handleBN.ts create mode 100644 webAO/packets/handlers/handleDONE.ts create mode 100644 webAO/packets/handlers/handleHI.ts create mode 100644 webAO/packets/handlers/handleHP.ts create mode 100644 webAO/packets/handlers/handleRT.ts create mode 100644 webAO/packets/handlers/handleTI.ts create mode 100644 webAO/packets/handlers/handleZZ.ts (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 1fdd3c5..e871fce 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -30,6 +30,13 @@ import { handleBD } from './packets/handlers/handleBD' import { handleBB } from './packets/handlers/handleBB' import { handleKB } from './packets/handlers/handleKB' import { handleKK } from './packets/handlers/handleKK' +import { handleDONE } from './packets/handlers/handleDONE' +import { handleBN } from './packets/handlers/handleBN' +import { handleHP } from './packets/handlers/handleHP' +import { handleRT } from './packets/handlers/handleRT' +import { handleTI } from './packets/handlers/handleTI' +import { handleZZ } from './packets/handlers/handleZZ' +import { handleHI } from './packets/handlers/handleHI' import chatbox_arr from "./styles/chatbox/chatboxes.js"; import iniParse from "./iniParse"; import getCookie from "./utils/getCookie"; @@ -253,13 +260,13 @@ class Client extends EventEmitter { this.on("BB", handleBB); this.on("KB", handleKB); this.on("KK", handleKK); - this.on("DONE", this.handleDONE.bind(this)); - this.on("BN", this.handleBN.bind(this)); - this.on("HP", this.handleHP.bind(this)); - this.on("RT", this.handleRT.bind(this)); - this.on("TI", this.handleTI.bind(this)); - this.on("ZZ", this.handleZZ.bind(this)); - this.on("HI", this.handleHI.bind(this)); + this.on("DONE", handleDONE); + this.on("BN", handleBN); + this.on("HP", handleHP); + this.on("RT", handleRT); + this.on("TI", handleTI); + this.on("ZZ", handleZZ); + this.on("HI", handleHI); this.on("ID", this.handleID.bind(this)); this.on("PN", this.handlePN.bind(this)); this.on("SI", this.handleSI.bind(this)); @@ -1025,197 +1032,6 @@ class Client extends EventEmitter { - - - - - /** - * Handles the handshake completion packet, meaning the player - * is ready to select a character. - * - * @param {Array} args packet arguments - */ - handleDONE(_args: string[]) { - document.getElementById("client_loading").style.display = "none"; - if (mode === "watch") { - // Spectators don't need to pick a character - document.getElementById("client_waiting").style.display = "none"; - } - } - - /** - * Handles a background change. - * @param {Array} args packet arguments - */ - - handleBN(args: string[]) { - const bgFromArgs = safeTags(args[1]); - this.viewport.setBackgroundName(bgFromArgs); - const bgfolder = this.viewport.getBackgroundFolder(); - const bg_index = getIndexFromSelect( - "bg_select", - this.viewport.getBackgroundName() - ); - (document.getElementById("bg_select")).selectedIndex = - bg_index; - updateBackgroundPreview(); - if (bg_index === 0) { - (document.getElementById("bg_filename")).value = - this.viewport.getBackgroundName(); - } - - tryUrls( - `${AO_HOST}background/${encodeURI(args[1].toLowerCase())}/defenseempty` - ).then((resp) => { - (document.getElementById("bg_preview")).src = resp; - }); - tryUrls(`${bgfolder}defensedesk`).then((resp) => { - (document.getElementById("client_def_bench")).src = - resp; - }); - tryUrls(`${bgfolder}stand`).then((resp) => { - (document.getElementById("client_wit_bench")).src = - resp; - }); - tryUrls(`${bgfolder}prosecutiondesk`).then((resp) => { - (document.getElementById("client_pro_bench")).src = - resp; - }); - tryUrls(`${bgfolder}full`).then((resp) => { - (document.getElementById("client_court")).src = resp; - }); - tryUrls(`${bgfolder}defenseempty`).then((resp) => { - (document.getElementById("client_court_def")).src = - resp; - }); - tryUrls(`${bgfolder}transition_def`).then((resp) => { - (document.getElementById("client_court_deft")).src = - resp; - }); - tryUrls(`${bgfolder}witnessempty`).then((resp) => { - (document.getElementById("client_court_wit")).src = - resp; - }); - tryUrls(`${bgfolder}transition_pro`).then((resp) => { - (document.getElementById("client_court_prot")).src = - resp; - }); - tryUrls(`${bgfolder}prosecutorempty`).then((resp) => { - (document.getElementById("client_court_pro")).src = - resp; - }); - - if (this.charID === -1) { - this.viewport.set_side({ - position: "jud", - showSpeedLines: false, - showDesk: true, - }); - } else { - this.viewport.set_side({ - position: this.chars[this.charID].side, - showSpeedLines: false, - showDesk: true, - }); - } - } - - /** - * Handles a change in the health bars' states. - * @param {Array} args packet arguments - */ - handleHP(args: string[]) { - const percent_hp = Number(args[2]) * 10; - let healthbox; - if (args[1] === "1") { - // Def hp - this.hp[0] = Number(args[2]); - healthbox = document.getElementById("client_defense_hp"); - } else { - // Pro hp - this.hp[1] = Number(args[2]); - healthbox = document.getElementById("client_prosecutor_hp"); - } - (( - healthbox.getElementsByClassName("health-bar")[0] - )).style.width = `${percent_hp}%`; - } - - /** - * Handles a testimony states. - * @param {Array} args packet arguments - */ - handleRT(args: string[]) { - const judgeid = Number(args[2]); - switch (args[1]) { - case "testimony1": - this.testimonyID = 1; - break; - case "testimony2": - // Cross Examination - this.testimonyID = 2; - break; - case "judgeruling": - this.testimonyID = 3 + judgeid; - break; - default: - console.warn("Invalid testimony"); - } - this.viewport.initTestimonyUpdater(); - } - - /** - * Handles a timer update - * @param {Array} args packet arguments - */ - handleTI(args: string[]) { - const timerid = Number(args[1]); - const type = Number(args[2]); - const timer_value = args[3]; - switch (type) { - case 0: - // - case 1: - document.getElementById(`client_timer${timerid}`).innerText = - timer_value; - case 2: - document.getElementById(`client_timer${timerid}`).style.display = ""; - case 3: - document.getElementById(`client_timer${timerid}`).style.display = - "none"; - } - } - - /** - * Handles a modcall - * @param {Array} args packet arguments - */ - handleZZ(args: string[]) { - const oocLog = document.getElementById("client_ooclog"); - oocLog.innerHTML += `$Alert: ${prepChat(args[1])}\r\n`; - if (oocLog.scrollTop > oocLog.scrollHeight - 60) { - oocLog.scrollTop = oocLog.scrollHeight; - } - - this.viewport.getSfxAudio().pause(); - const oldvolume = this.viewport.getSfxAudio().volume; - this.viewport.getSfxAudio().volume = 1; - this.viewport.getSfxAudio().src = `${AO_HOST}sounds/general/sfx-gallery.opus`; - this.viewport.getSfxAudio().play(); - this.viewport.getSfxAudio().volume = oldvolume; - } - - /** - * Handle the player - * @param {Array} args packet arguments - */ - handleHI(_args: string[]) { - this.sendSelf(`ID#1#webAO#${version}#%`); - this.sendSelf( - "FL#fastloading#yellowtext#cccc_ic_support#flipping#looping_sfx#effects#%" - ); - } - /** * Identifies the server and issues a playerID * @param {Array} args packet arguments @@ -1776,7 +1592,7 @@ window.changeCallwords = changeCallwords; * Triggered by the modcall sfx dropdown */ export function modcall_test() { - client.handleZZ("test#test".split("#")); + handleZZ("test#test".split("#")); } window.modcall_test = modcall_test; diff --git a/webAO/packets/handlers/handleBN.ts b/webAO/packets/handlers/handleBN.ts new file mode 100644 index 0000000..3cd3c5a --- /dev/null +++ b/webAO/packets/handlers/handleBN.ts @@ -0,0 +1,81 @@ +import { AO_HOST, client, getIndexFromSelect, updateBackgroundPreview } from "../../client"; +import { safeTags } from "../../encoding"; +import tryUrls from "../../utils/tryUrls"; + + + /** + * Handles a background change. + * @param {Array} args packet arguments + */ + +export const handleBN = (args: string[]) => { + const bgFromArgs = safeTags(args[1]); + client.viewport.setBackgroundName(bgFromArgs); + const bgfolder = client.viewport.getBackgroundFolder(); + const bg_index = getIndexFromSelect( + "bg_select", + client.viewport.getBackgroundName() + ); + (document.getElementById("bg_select")).selectedIndex = + bg_index; + updateBackgroundPreview(); + if (bg_index === 0) { + (document.getElementById("bg_filename")).value = + client.viewport.getBackgroundName(); + } + + tryUrls( + `${AO_HOST}background/${encodeURI(args[1].toLowerCase())}/defenseempty` + ).then((resp) => { + (document.getElementById("bg_preview")).src = resp; + }); + tryUrls(`${bgfolder}defensedesk`).then((resp) => { + (document.getElementById("client_def_bench")).src = + resp; + }); + tryUrls(`${bgfolder}stand`).then((resp) => { + (document.getElementById("client_wit_bench")).src = + resp; + }); + tryUrls(`${bgfolder}prosecutiondesk`).then((resp) => { + (document.getElementById("client_pro_bench")).src = + resp; + }); + tryUrls(`${bgfolder}full`).then((resp) => { + (document.getElementById("client_court")).src = resp; + }); + tryUrls(`${bgfolder}defenseempty`).then((resp) => { + (document.getElementById("client_court_def")).src = + resp; + }); + tryUrls(`${bgfolder}transition_def`).then((resp) => { + (document.getElementById("client_court_deft")).src = + resp; + }); + tryUrls(`${bgfolder}witnessempty`).then((resp) => { + (document.getElementById("client_court_wit")).src = + resp; + }); + tryUrls(`${bgfolder}transition_pro`).then((resp) => { + (document.getElementById("client_court_prot")).src = + resp; + }); + tryUrls(`${bgfolder}prosecutorempty`).then((resp) => { + (document.getElementById("client_court_pro")).src = + resp; + }); + + if (client.charID === -1) { + client.viewport.set_side({ + position: "jud", + showSpeedLines: false, + showDesk: true, + }); + } else { + client.viewport.set_side({ + position: client.chars[client.charID].side, + showSpeedLines: false, + showDesk: true, + }); + } + } \ No newline at end of file diff --git a/webAO/packets/handlers/handleDONE.ts b/webAO/packets/handlers/handleDONE.ts new file mode 100644 index 0000000..3cafd5e --- /dev/null +++ b/webAO/packets/handlers/handleDONE.ts @@ -0,0 +1,16 @@ +import queryParser from "../../utils/queryParser"; + +let { mode } = queryParser() + /** + * Handles the handshake completion packet, meaning the player + * is ready to select a character. + * + * @param {Array} args packet arguments + */ +export const handleDONE = (_args: string[]) => { + document.getElementById("client_loading")!.style.display = "none"; + if (mode === "watch") { + // Spectators don't need to pick a character + document.getElementById("client_waiting")!.style.display = "none"; + } + } \ No newline at end of file diff --git a/webAO/packets/handlers/handleHI.ts b/webAO/packets/handlers/handleHI.ts new file mode 100644 index 0000000..d15be0d --- /dev/null +++ b/webAO/packets/handlers/handleHI.ts @@ -0,0 +1,14 @@ +import { client } from "../../client"; +const version = process.env.npm_package_version; + + +/** + * Handle the player + * @param {Array} args packet arguments + */ +export const handleHI = (_args: string[]) => { + client.sendSelf(`ID#1#webAO#${version}#%`); + client.sendSelf( + "FL#fastloading#yellowtext#cccc_ic_support#flipping#looping_sfx#effects#%" + ); +} diff --git a/webAO/packets/handlers/handleHP.ts b/webAO/packets/handlers/handleHP.ts new file mode 100644 index 0000000..f365590 --- /dev/null +++ b/webAO/packets/handlers/handleHP.ts @@ -0,0 +1,23 @@ +import { client } from "../../client"; + + + /** + * Handles a change in the health bars' states. + * @param {Array} args packet arguments + */ +export const handleHP = (args: string[]) => { + const percent_hp = Number(args[2]) * 10; + let healthbox; + if (args[1] === "1") { + // Def hp + client.hp[0] = Number(args[2]); + healthbox = document.getElementById("client_defense_hp"); + } else { + // Pro hp + client.hp[1] = Number(args[2]); + healthbox = document.getElementById("client_prosecutor_hp"); + } + (( + healthbox.getElementsByClassName("health-bar")[0] + )).style.width = `${percent_hp}%`; + } \ No newline at end of file diff --git a/webAO/packets/handlers/handleRT.ts b/webAO/packets/handlers/handleRT.ts new file mode 100644 index 0000000..5bbf2b2 --- /dev/null +++ b/webAO/packets/handlers/handleRT.ts @@ -0,0 +1,25 @@ +import { client } from "../../client"; + + +/** + * Handles a testimony states. + * @param {Array} args packet arguments + */ +export const handleRT = (args: string[]) => { + const judgeid = Number(args[2]); + switch (args[1]) { + case "testimony1": + client.testimonyID = 1; + break; + case "testimony2": + // Cross Examination + client.testimonyID = 2; + break; + case "judgeruling": + client.testimonyID = 3 + judgeid; + break; + default: + console.warn("Invalid testimony"); + } + client.viewport.initTestimonyUpdater(); +} \ No newline at end of file diff --git a/webAO/packets/handlers/handleTI.ts b/webAO/packets/handlers/handleTI.ts new file mode 100644 index 0000000..e418088 --- /dev/null +++ b/webAO/packets/handlers/handleTI.ts @@ -0,0 +1,21 @@ +/** + * Handles a timer update + * @param {Array} args packet arguments + */ +export const handleTI = (args: string[]) => { + const timerid = Number(args[1]); + const type = Number(args[2]); + const timer_value = args[3]; + switch (type) { + case 0: + // + case 1: + document.getElementById(`client_timer${timerid}`)!.innerText = + timer_value; + case 2: + document.getElementById(`client_timer${timerid}`)!.style.display = ""; + case 3: + document.getElementById(`client_timer${timerid}`)!.style.display = + "none"; + } +} \ No newline at end of file diff --git a/webAO/packets/handlers/handleZZ.ts b/webAO/packets/handlers/handleZZ.ts new file mode 100644 index 0000000..1a56e49 --- /dev/null +++ b/webAO/packets/handlers/handleZZ.ts @@ -0,0 +1,22 @@ +import { AO_HOST, client } from "../../client"; +import { prepChat } from "../../encoding"; + + +/** + * Handles a modcall + * @param {Array} args packet arguments + */ +export const handleZZ = (args: string[]) => { + const oocLog = document.getElementById("client_ooclog")!; + oocLog.innerHTML += `$Alert: ${prepChat(args[1])}\r\n`; + if (oocLog.scrollTop > oocLog.scrollHeight - 60) { + oocLog.scrollTop = oocLog.scrollHeight; + } + + client.viewport.getSfxAudio().pause(); + const oldvolume = client.viewport.getSfxAudio().volume; + client.viewport.getSfxAudio().volume = 1; + client.viewport.getSfxAudio().src = `${AO_HOST}sounds/general/sfx-gallery.opus`; + client.viewport.getSfxAudio().play(); + client.viewport.getSfxAudio().volume = oldvolume; +} \ No newline at end of file -- cgit From e66a37a62b06df5b0f48d64f6b9a14b9f81bd15d Mon Sep 17 00:00:00 2001 From: Caleb Date: Tue, 30 Aug 2022 18:32:27 -0400 Subject: A buncha more --- webAO/client.ts | 153 ++++---------------------------- webAO/packets/handlers/handleARUP.ts | 42 +++++++++ webAO/packets/handlers/handleCC.ts | 9 ++ webAO/packets/handlers/handleID.ts | 24 +++++ webAO/packets/handlers/handlePN.ts | 9 ++ webAO/packets/handlers/handleRC.ts | 10 +++ webAO/packets/handlers/handleSI.ts | 41 +++++++++ webAO/packets/handlers/handleaskchaa.ts | 10 +++ 8 files changed, 163 insertions(+), 135 deletions(-) create mode 100644 webAO/packets/handlers/handleARUP.ts create mode 100644 webAO/packets/handlers/handleCC.ts create mode 100644 webAO/packets/handlers/handleID.ts create mode 100644 webAO/packets/handlers/handlePN.ts create mode 100644 webAO/packets/handlers/handleRC.ts create mode 100644 webAO/packets/handlers/handleSI.ts create mode 100644 webAO/packets/handlers/handleaskchaa.ts (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index e871fce..cacfd77 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -37,6 +37,13 @@ import { handleRT } from './packets/handlers/handleRT' import { handleTI } from './packets/handlers/handleTI' import { handleZZ } from './packets/handlers/handleZZ' import { handleHI } from './packets/handlers/handleHI' +import { handleID } from './packets/handlers/handleID' +import { handlePN } from './packets/handlers/handlePN' +import { handleSI } from './packets/handlers/handleSI' +import { handleARUP } from './packets/handlers/handleARUP' +import { handleaskchaa } from './packets/handlers/handleaskchaa' +import { handleCC } from './packets/handlers/handleCC' +import { handleRC } from './packets/handlers/handleRC' import chatbox_arr from "./styles/chatbox/chatboxes.js"; import iniParse from "./iniParse"; import getCookie from "./utils/getCookie"; @@ -73,7 +80,10 @@ export const UPDATE_INTERVAL = 60; * The old loading uses more smaller packets instead of a single big one, * which caused problems on low-memory devices in the past. */ -let oldLoading = false; +export let oldLoading = false; +export const setOldLoading = (val: boolean) => { + oldLoading = val +} // presettings let selectedMenu = 1; @@ -267,13 +277,13 @@ class Client extends EventEmitter { this.on("TI", handleTI); this.on("ZZ", handleZZ); this.on("HI", handleHI); - this.on("ID", this.handleID.bind(this)); - this.on("PN", this.handlePN.bind(this)); - this.on("SI", this.handleSI.bind(this)); - this.on("ARUP", this.handleARUP.bind(this)); - this.on("askchaa", this.handleaskchaa.bind(this)); - this.on("CC", this.handleCC.bind(this)); - this.on("RC", this.handleRC.bind(this)); + this.on("ID", handleID); + this.on("PN", handlePN); + this.on("SI", handleSI); + this.on("ARUP", handleARUP); + this.on("askchaa", handleaskchaa); + this.on("CC", handleCC); + this.on("RC", handleRC); this.on("RM", this.handleRM.bind(this)); this.on("RD", this.handleRD.bind(this)); this.on("CharsCheck", this.handleCharsCheck.bind(this)); @@ -1032,131 +1042,11 @@ class Client extends EventEmitter { - /** - * Identifies the server and issues a playerID - * @param {Array} args packet arguments - */ - handleID(args: string[]) { - this.playerID = Number(args[1]); - const serverSoftware = args[2].split("&")[0]; - let serverVersion; - if (serverSoftware === "serverD") { - serverVersion = args[2].split("&")[1]; - } else if (serverSoftware === "webAO") { - oldLoading = false; - this.sendSelf("PN#0#1#%"); - } else { - serverVersion = args[3]; - } - - if (serverSoftware === "serverD" && serverVersion === "1377.152") { - oldLoading = true; - } // bugged version - } - - /** - * Indicates how many users are on this server - * @param {Array} args packet arguments - */ - handlePN(_args: string[]) { - this.sendServer("askchaa#%"); - } - - /** - * What? you want a character?? - * @param {Array} args packet arguments - */ - handleCC(args: string[]) { - this.sendSelf(`PV#1#CID#${args[2]}#%`); - } - - /** - * What? you want a character list from me?? - * @param {Array} args packet arguments - */ - handleaskchaa(_args: string[]) { - this.sendSelf(`SI#${vanilla_character_arr.length}#0#0#%`); - } - - /** - * Handle the change of players in an area. - * @param {Array} args packet arguments - */ - handleARUP(args: string[]) { - args = args.slice(1); - for (let i = 0; i < args.length - 2; i++) { - if (this.areas[i]) { - // the server sends us ARUP before we even get the area list - const thisarea = document.getElementById(`area${i}`); - switch (Number(args[0])) { - case 0: // playercount - this.areas[i].players = Number(args[i + 1]); - break; - case 1: // status - this.areas[i].status = safeTags(args[i + 1]); - break; - case 2: - this.areas[i].cm = safeTags(args[i + 1]); - break; - case 3: - this.areas[i].locked = safeTags(args[i + 1]); - break; - } - - thisarea.className = `area-button area-${this.areas[ - i - ].status.toLowerCase()}`; - - thisarea.innerText = `${this.areas[i].name} (${this.areas[i].players}) [${this.areas[i].status}]`; - - thisarea.title = - `Players: ${this.areas[i].players}\n` + - `Status: ${this.areas[i].status}\n` + - `CM: ${this.areas[i].cm}\n` + - `Area lock: ${this.areas[i].locked}`; - } - } - } - /** - * Received when the server announces its server info, - * but we use it as a cue to begin retrieving characters. - * @param {Array} args packet arguments - */ - handleSI(args: string[]) { - this.char_list_length = Number(args[1]); - this.char_list_length += 1; // some servers count starting from 0 some from 1... - this.evidence_list_length = Number(args[2]); - this.music_list_length = Number(args[3]); - (document.getElementById("client_loadingbar")).max = - this.char_list_length + - this.evidence_list_length + - this.music_list_length; - // create the charselect grid, to be filled by the character loader - document.getElementById("client_chartable").innerHTML = ""; - for (let i = 0; i < this.char_list_length; i++) { - const demothing = document.createElement("img"); - - demothing.className = "demothing"; - demothing.id = `demo_${i}`; - const demoonclick = document.createAttribute("onclick"); - demoonclick.value = `pickChar(${i})`; - demothing.setAttributeNode(demoonclick); - - document.getElementById("client_chartable").appendChild(demothing); - } - - // this is determined at the top of this file - if (!oldLoading && extrafeatures.includes("fastloading")) { - this.sendServer("RC#%"); - } else { - this.sendServer("askchar2#%"); - } - } /** * Handles the list of all used and vacant characters. @@ -1290,13 +1180,6 @@ class Client extends EventEmitter { } } - /** - * we are asking ourselves what characters there are - * @param {Array} args packet arguments - */ - handleRC(_args: string[]) { - this.sendSelf(`SC#${vanilla_character_arr.join("#")}#%`); - } /** * we are asking ourselves what characters there are diff --git a/webAO/packets/handlers/handleARUP.ts b/webAO/packets/handlers/handleARUP.ts new file mode 100644 index 0000000..97db9cc --- /dev/null +++ b/webAO/packets/handlers/handleARUP.ts @@ -0,0 +1,42 @@ +import { client } from "../../client"; +import { safeTags } from "../../encoding"; + +/** + * Handle the change of players in an area. + * @param {Array} args packet arguments + */ +export const handleARUP = (args: string[]) => { + args = args.slice(1); + for (let i = 0; i < args.length - 2; i++) { + if (client.areas[i]) { + // the server sends us ARUP before we even get the area list + const thisarea = document.getElementById(`area${i}`)!; + switch (Number(args[0])) { + case 0: // playercount + client.areas[i].players = Number(args[i + 1]); + break; + case 1: // status + client.areas[i].status = safeTags(args[i + 1]); + break; + case 2: + client.areas[i].cm = safeTags(args[i + 1]); + break; + case 3: + client.areas[i].locked = safeTags(args[i + 1]); + break; + } + + thisarea.className = `area-button area-${client.areas[ + i + ].status.toLowerCase()}`; + + thisarea.innerText = `${client.areas[i].name} (${client.areas[i].players}) [${client.areas[i].status}]`; + + thisarea.title = + `Players: ${client.areas[i].players}\n` + + `Status: ${client.areas[i].status}\n` + + `CM: ${client.areas[i].cm}\n` + + `Area lock: ${client.areas[i].locked}`; + } + } +} \ No newline at end of file diff --git a/webAO/packets/handlers/handleCC.ts b/webAO/packets/handlers/handleCC.ts new file mode 100644 index 0000000..84e6ec0 --- /dev/null +++ b/webAO/packets/handlers/handleCC.ts @@ -0,0 +1,9 @@ +import { client } from "../../client"; + +/** + * What? you want a character?? + * @param {Array} args packet arguments + */ +export const handleCC = (args: string[]) => { + client.sendSelf(`PV#1#CID#${args[2]}#%`); +} \ No newline at end of file diff --git a/webAO/packets/handlers/handleID.ts b/webAO/packets/handlers/handleID.ts new file mode 100644 index 0000000..7def483 --- /dev/null +++ b/webAO/packets/handlers/handleID.ts @@ -0,0 +1,24 @@ +import { client, setOldLoading } from "../../client"; + + +/** + * Identifies the server and issues a playerID + * @param {Array} args packet arguments + */ +export const handleID = (args: string[]) => { + client.playerID = Number(args[1]); + const serverSoftware = args[2].split("&")[0]; + let serverVersion; + if (serverSoftware === "serverD") { + serverVersion = args[2].split("&")[1]; + } else if (serverSoftware === "webAO") { + setOldLoading(false); + client.sendSelf("PN#0#1#%"); + } else { + serverVersion = args[3]; + } + + if (serverSoftware === "serverD" && serverVersion === "1377.152") { + setOldLoading(true); + } // bugged version +} \ No newline at end of file diff --git a/webAO/packets/handlers/handlePN.ts b/webAO/packets/handlers/handlePN.ts new file mode 100644 index 0000000..b16f77d --- /dev/null +++ b/webAO/packets/handlers/handlePN.ts @@ -0,0 +1,9 @@ +import { client } from "../../client"; + +/** + * Indicates how many users are on this server + * @param {Array} args packet arguments + */ +export const handlePN = (_args: string[]) => { + client.sendServer("askchaa#%"); +} \ No newline at end of file diff --git a/webAO/packets/handlers/handleRC.ts b/webAO/packets/handlers/handleRC.ts new file mode 100644 index 0000000..92c1e8e --- /dev/null +++ b/webAO/packets/handlers/handleRC.ts @@ -0,0 +1,10 @@ +import { client } from "../../client"; +import vanilla_character_arr from "../../constants/characters.js"; + +/** + * we are asking ourselves what characters there are + * @param {Array} args packet arguments + */ +export const handleRC = (_args: string[]) => { + client.sendSelf(`SC#${vanilla_character_arr.join("#")}#%`); +} \ No newline at end of file diff --git a/webAO/packets/handlers/handleSI.ts b/webAO/packets/handlers/handleSI.ts new file mode 100644 index 0000000..e040c83 --- /dev/null +++ b/webAO/packets/handlers/handleSI.ts @@ -0,0 +1,41 @@ +import { client, extrafeatures, oldLoading } from "../../client"; + + +/** + * Received when the server announces its server info, + * but we use it as a cue to begin retrieving characters. + * @param {Array} args packet arguments + */ +export const handleSI = (args: string[]) => { + client.char_list_length = Number(args[1]); + client.char_list_length += 1; // some servers count starting from 0 some from 1... + client.evidence_list_length = Number(args[2]); + client.music_list_length = Number(args[3]); + + (document.getElementById("client_loadingbar")).max = + client.char_list_length + + client.evidence_list_length + + client.music_list_length; + + // create the charselect grid, to be filled by the character loader + document.getElementById("client_chartable")!.innerHTML = ""; + + for (let i = 0; i < client.char_list_length; i++) { + const demothing = document.createElement("img"); + + demothing.className = "demothing"; + demothing.id = `demo_${i}`; + const demoonclick = document.createAttribute("onclick"); + demoonclick.value = `pickChar(${i})`; + demothing.setAttributeNode(demoonclick); + + document.getElementById("client_chartable")!.appendChild(demothing); + } + + // this is determined at the top of this file + if (!oldLoading && extrafeatures.includes("fastloading")) { + client.sendServer("RC#%"); + } else { + client.sendServer("askchar2#%"); + } +} \ No newline at end of file diff --git a/webAO/packets/handlers/handleaskchaa.ts b/webAO/packets/handlers/handleaskchaa.ts new file mode 100644 index 0000000..5930bf0 --- /dev/null +++ b/webAO/packets/handlers/handleaskchaa.ts @@ -0,0 +1,10 @@ +import { client } from "../../client"; +import vanilla_character_arr from "../../constants/characters.js"; + +/** + * What? you want a character list from me?? + * @param {Array} args packet arguments + */ +export const handleaskchaa = (_args: string[]) => { + client.sendSelf(`SI#${vanilla_character_arr.length}#0#0#%`); +} -- cgit From 1847fcf939c4a079b2f016df212e2b6c832aa2e5 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Wed, 31 Aug 2022 20:31:52 +0200 Subject: clear rain effect when it's empty --- webAO/viewport.ts | 1 + 1 file changed, 1 insertion(+) (limited to 'webAO') diff --git a/webAO/viewport.ts b/webAO/viewport.ts index c778891..58186a0 100644 --- a/webAO/viewport.ts +++ b/webAO/viewport.ts @@ -665,6 +665,7 @@ const viewport = (masterClient: Client): Viewport => { const baseEffectUrl = `${AO_HOST}themes/default/effects/`; fg.src = `${baseEffectUrl}${encodeURI(effectName)}.webp`; } else { + fg.innerHTML = ''; fg.src = transparentPng; } -- cgit From 86b493b881bde4a11214929ebe4317289a7f1da3 Mon Sep 17 00:00:00 2001 From: Caleb Date: Thu, 1 Sep 2022 22:36:22 -0400 Subject: Moved rest of the handlers --- webAO/client.ts | 207 +++-------------------------- webAO/packets/handlers/handleASS.ts | 10 ++ webAO/packets/handlers/handleCharsCheck.ts | 17 +++ webAO/packets/handlers/handleJD.ts | 13 ++ webAO/packets/handlers/handlePV.ts | 82 ++++++++++++ webAO/packets/handlers/handleRD.ts | 18 +++ webAO/packets/handlers/handleRM.ts | 10 ++ webAO/packets/handlers/handleSP.ts | 9 ++ webAO/packets/handlers/handleackMS.ts | 8 ++ 9 files changed, 187 insertions(+), 187 deletions(-) create mode 100644 webAO/packets/handlers/handleASS.ts create mode 100644 webAO/packets/handlers/handleCharsCheck.ts create mode 100644 webAO/packets/handlers/handleJD.ts create mode 100644 webAO/packets/handlers/handlePV.ts create mode 100644 webAO/packets/handlers/handleRD.ts create mode 100644 webAO/packets/handlers/handleRM.ts create mode 100644 webAO/packets/handlers/handleSP.ts create mode 100644 webAO/packets/handlers/handleackMS.ts (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index cacfd77..f216bce 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -44,6 +44,14 @@ import { handleARUP } from './packets/handlers/handleARUP' import { handleaskchaa } from './packets/handlers/handleaskchaa' import { handleCC } from './packets/handlers/handleCC' import { handleRC } from './packets/handlers/handleRC' +import { handleRM } from './packets/handlers/handleRM' +import { handleRD } from './packets/handlers/handleRD' +import { handleCharsCheck } from './packets/handlers/handleCharsCheck' +import { handlePV } from './packets/handlers/handlePV' +import { handleASS } from './packets/handlers/handleASS' +import { handleackMS } from './packets/handlers/handleackMS' +import { handleSP } from './packets/handlers/handleSP' +import { handleJD } from './packets/handlers/handleJD' import chatbox_arr from "./styles/chatbox/chatboxes.js"; import iniParse from "./iniParse"; import getCookie from "./utils/getCookie"; @@ -68,6 +76,9 @@ let { ip: serverIP, mode, asset, theme } = queryParser(); // Unless there is an asset URL specified, use the wasabi one const DEFAULT_HOST = "http://attorneyoffline.de/base/"; export let AO_HOST = asset || DEFAULT_HOST; +export const setAOhost = (val: string) => { + AO_HOST = val +} let THEME: string = theme || "default"; let CHATBOX: string; @@ -284,14 +295,14 @@ class Client extends EventEmitter { this.on("askchaa", handleaskchaa); this.on("CC", handleCC); this.on("RC", handleRC); - this.on("RM", this.handleRM.bind(this)); - this.on("RD", this.handleRD.bind(this)); - this.on("CharsCheck", this.handleCharsCheck.bind(this)); - this.on("PV", this.handlePV.bind(this)); - this.on("ASS", this.handleASS.bind(this)); - this.on("ackMS", this.handleackMS.bind(this)); - this.on("SP", this.handleSP.bind(this)); - this.on("JD", this.handleJD.bind(this)); + this.on("RM", handleRM); + this.on("RD", handleRD); + this.on("CharsCheck", handleCharsCheck); + this.on("PV", handlePV); + this.on("ASS", handleASS); + this.on("ackMS", handleackMS); + this.on("SP", handleSP); + this.on("JD", handleJD); this.on("decryptor", () => { }); this.on("CHECK", () => { }); this.on("CH", () => { }); @@ -778,14 +789,6 @@ class Client extends EventEmitter { (document.getElementById("client_inputbox")).value = ""; }; - - - - - - - - /** * Handles the incoming character information, and downloads the sprite + ini for it * @param {Array} chargs packet arguments @@ -1017,11 +1020,6 @@ class Client extends EventEmitter { } } - - - - - /** * Handles the kicked packet * @param {string} type is it a kick or a ban @@ -1039,171 +1037,6 @@ class Client extends EventEmitter { document.getElementsByClassName("client_reconnect")[1] )).style.display = "none"; } - - - - - - - - - - /** - * Handles the list of all used and vacant characters. - * @param {Array} args list of all characters represented as a 0 for free or a -1 for taken - */ - handleCharsCheck(args: string[]) { - for (let i = 0; i < this.char_list_length; i++) { - const img = document.getElementById(`demo_${i}`); - - if (args[i + 1] === "-1") { - img.style.opacity = "0.25"; - } else if (args[i + 1] === "0") { - img.style.opacity = "1"; - } - } - } - - /** - * Handles the server's assignment of a character for the player to use. - * PV # playerID (unused) # CID # character ID - * @param {Array} args packet arguments - */ - async handlePV(args: string[]) { - this.charID = Number(args[3]); - document.getElementById("client_waiting").style.display = "none"; - document.getElementById("client_charselect").style.display = "none"; - - const me = this.chars[this.charID]; - this.selectedEmote = -1; - const { emotes } = this; - const emotesList = document.getElementById("client_emo"); - emotesList.style.display = ""; - emotesList.innerHTML = ""; // Clear emote box - const ini = me.inifile; - me.side = ini.options.side; - updateActionCommands(me.side); - if (ini.emotions.number === 0) { - emotesList.innerHTML = `No emotes available`; - } else { - for (let i = 1; i <= ini.emotions.number; i++) { - try { - const emoteinfo = ini.emotions[i].split("#"); - let esfx; - let esfxd; - try { - esfx = ini.soundn[i] || "0"; - esfxd = Number(ini.soundt[i]) || 0; - } catch (e) { - console.warn("ini sound is completly missing"); - esfx = "0"; - esfxd = 0; - } - // Make sure the asset server is case insensitive, or that everything on it is lowercase - - emotes[i] = { - desc: emoteinfo[0].toLowerCase(), - preanim: emoteinfo[1].toLowerCase(), - emote: emoteinfo[2].toLowerCase(), - zoom: Number(emoteinfo[3]) || 0, - deskmod: Number(emoteinfo[4]) || 1, - sfx: esfx.toLowerCase(), - sfxdelay: esfxd, - frame_screenshake: "", - frame_realization: "", - frame_sfx: "", - button: `${AO_HOST}characters/${encodeURI( - me.name.toLowerCase() - )}/emotions/button${i}_off.png`, - }; - emotesList.innerHTML += `${emotes[i].desc}`; - } catch (e) { - console.error(`missing emote ${i}`); - } - } - pickEmotion(1); - } - - if ( - await fileExists( - `${AO_HOST}characters/${encodeURI(me.name.toLowerCase())}/custom.gif` - ) - ) { - document.getElementById("button_4").style.display = ""; - } else { - document.getElementById("button_4").style.display = "none"; - } - - } - - /** - * new asset url!! - * @param {Array} args packet arguments - */ - handleASS(args: string[]) { - AO_HOST = args[1]; - } - - /** - * server got our message - */ - handleackMS() { - resetICParams(); - } - - /** -* position change -* @param {string} pos new position -*/ - handleSP(args: string[]) { - updateActionCommands(args[1]); - } - - /** -* show/hide judge controls -* @param {number} show either a 1 or a 0 -*/ - handleJD(args: string[]) { - if (Number(args[1]) === 1) { - document.getElementById("judge_action").style.display = "inline-table"; - document.getElementById("no_action").style.display = "none"; - } else { - document.getElementById("judge_action").style.display = "none"; - document.getElementById("no_action").style.display = "inline-table"; - } - } - - - /** - * we are asking ourselves what characters there are - * @param {Array} args packet arguments - */ - handleRM(_args: string[]) { - this.sendSelf(`SM#${vanilla_music_arr.join("#")}#%`); - } - - /** - * we are asking ourselves what characters there are - * @param {Array} args packet arguments - */ - handleRD(_args: string[]) { - this.sendSelf("BN#gs4#%"); - this.sendSelf("DONE#%"); - const ooclog = document.getElementById("client_ooclog"); - ooclog.value = ""; - ooclog.readOnly = false; - - document.getElementById("client_oocinput").style.display = "none"; - document.getElementById("client_replaycontrols").style.display = - "inline-block"; - } } /** @@ -1487,7 +1320,7 @@ export async function iniedit() { .value; const inicharID = client.charID; await client.handleCharacterInfo(ininame.split("&"), inicharID); - client.handlePV(`PV#0#CID#${inicharID}`.split("#")); + handlePV(`PV#0#CID#${inicharID}`.split("#")); } window.iniedit = iniedit; diff --git a/webAO/packets/handlers/handleASS.ts b/webAO/packets/handlers/handleASS.ts new file mode 100644 index 0000000..d0dfbd5 --- /dev/null +++ b/webAO/packets/handlers/handleASS.ts @@ -0,0 +1,10 @@ +import { setAOhost } from "../../client"; + + +/** +* new asset url!! +* @param {Array} args packet arguments +*/ +export const handleASS = (args: string[]) => { + setAOhost(args[1]); +} diff --git a/webAO/packets/handlers/handleCharsCheck.ts b/webAO/packets/handlers/handleCharsCheck.ts new file mode 100644 index 0000000..2d891ef --- /dev/null +++ b/webAO/packets/handlers/handleCharsCheck.ts @@ -0,0 +1,17 @@ +import { client } from "../../client"; + +/** + * Handles the list of all used and vacant characters. + * @param {Array} args list of all characters represented as a 0 for free or a -1 for taken + */ +export const handleCharsCheck = (args: string[]) => { + for (let i = 0; i < client.char_list_length; i++) { + const img = document.getElementById(`demo_${i}`)!; + + if (args[i + 1] === "-1") { + img.style.opacity = "0.25"; + } else if (args[i + 1] === "0") { + img.style.opacity = "1"; + } + } +} \ No newline at end of file diff --git a/webAO/packets/handlers/handleJD.ts b/webAO/packets/handlers/handleJD.ts new file mode 100644 index 0000000..98d7988 --- /dev/null +++ b/webAO/packets/handlers/handleJD.ts @@ -0,0 +1,13 @@ +/** +* show/hide judge controls +* @param {number} show either a 1 or a 0 +*/ +export const handleJD = (args: string[]) => { + if (Number(args[1]) === 1) { + document.getElementById("judge_action")!.style.display = "inline-table"; + document.getElementById("no_action")!.style.display = "none"; + } else { + document.getElementById("judge_action")!.style.display = "none"; + document.getElementById("no_action")!.style.display = "inline-table"; + } +} \ No newline at end of file diff --git a/webAO/packets/handlers/handlePV.ts b/webAO/packets/handlers/handlePV.ts new file mode 100644 index 0000000..18947c5 --- /dev/null +++ b/webAO/packets/handlers/handlePV.ts @@ -0,0 +1,82 @@ +import { AO_HOST, client, pickEmotion, updateActionCommands } from "../../client"; +import fileExists from "../../utils/fileExists"; + + + /** + * Handles the server's assignment of a character for the player to use. + * PV # playerID (unused) # CID # character ID + * @param {Array} args packet arguments + */ +export const handlePV = async (args: string[]) => { + client.charID = Number(args[3]); + document.getElementById("client_waiting")!.style.display = "none"; + document.getElementById("client_charselect")!.style.display = "none"; + + const me = client.chars[client.charID]; + client.selectedEmote = -1; + const { emotes } = client; + const emotesList = document.getElementById("client_emo")!; + emotesList.style.display = ""; + emotesList.innerHTML = ""; // Clear emote box + const ini = me.inifile; + me.side = ini.options.side; + updateActionCommands(me.side); + if (ini.emotions.number === 0) { + emotesList.innerHTML = `No emotes available`; + } else { + for (let i = 1; i <= ini.emotions.number; i++) { + try { + const emoteinfo = ini.emotions[i].split("#"); + let esfx; + let esfxd; + try { + esfx = ini.soundn[i] || "0"; + esfxd = Number(ini.soundt[i]) || 0; + } catch (e) { + console.warn("ini sound is completly missing"); + esfx = "0"; + esfxd = 0; + } + // Make sure the asset server is case insensitive, or that everything on it is lowercase + + emotes[i] = { + desc: emoteinfo[0].toLowerCase(), + preanim: emoteinfo[1].toLowerCase(), + emote: emoteinfo[2].toLowerCase(), + zoom: Number(emoteinfo[3]) || 0, + deskmod: Number(emoteinfo[4]) || 1, + sfx: esfx.toLowerCase(), + sfxdelay: esfxd, + frame_screenshake: "", + frame_realization: "", + frame_sfx: "", + button: `${AO_HOST}characters/${encodeURI( + me.name.toLowerCase() + )}/emotions/button${i}_off.png`, + }; + emotesList.innerHTML += `${emotes[i].desc}`; + } catch (e) { + console.error(`missing emote ${i}`); + } + } + pickEmotion(1); + } + + if ( + await fileExists( + `${AO_HOST}characters/${encodeURI(me.name.toLowerCase())}/custom.gif` + ) + ) { + document.getElementById("button_4")!.style.display = ""; + } else { + document.getElementById("button_4")!.style.display = "none"; + } + + } diff --git a/webAO/packets/handlers/handleRD.ts b/webAO/packets/handlers/handleRD.ts new file mode 100644 index 0000000..780b43f --- /dev/null +++ b/webAO/packets/handlers/handleRD.ts @@ -0,0 +1,18 @@ +import { client } from "../../client"; + + +/** + * we are asking ourselves what characters there are + * @param {Array} args packet arguments + */ +export const handleRD = (_args: string[]) => { + client.sendSelf("BN#gs4#%"); + client.sendSelf("DONE#%"); + const ooclog = document.getElementById("client_ooclog"); + ooclog.value = ""; + ooclog.readOnly = false; + + document.getElementById("client_oocinput")!.style.display = "none"; + document.getElementById("client_replaycontrols")!.style.display = + "inline-block"; +} \ No newline at end of file diff --git a/webAO/packets/handlers/handleRM.ts b/webAO/packets/handlers/handleRM.ts new file mode 100644 index 0000000..41a78b4 --- /dev/null +++ b/webAO/packets/handlers/handleRM.ts @@ -0,0 +1,10 @@ +import {client} from '../../client' +import vanilla_music_arr from "../../constants/music.js"; + + /** + * we are asking ourselves what characters there are + * @param {Array} args packet arguments + */ +export const handleRM = (_args: string[]) => { + client.sendSelf(`SM#${vanilla_music_arr.join("#")}#%`); + } \ No newline at end of file diff --git a/webAO/packets/handlers/handleSP.ts b/webAO/packets/handlers/handleSP.ts new file mode 100644 index 0000000..e2cad18 --- /dev/null +++ b/webAO/packets/handlers/handleSP.ts @@ -0,0 +1,9 @@ +import { updateActionCommands } from "../../client"; + +/** +* position change +* @param {string} pos new position +*/ +export const handleSP = (args: string[]) => { + updateActionCommands(args[1]); +} \ No newline at end of file diff --git a/webAO/packets/handlers/handleackMS.ts b/webAO/packets/handlers/handleackMS.ts new file mode 100644 index 0000000..2b971b0 --- /dev/null +++ b/webAO/packets/handlers/handleackMS.ts @@ -0,0 +1,8 @@ +import { resetICParams } from "../../client"; + +/** +* server got our message +*/ +export const handleackMS = () => { + resetICParams(); +} \ No newline at end of file -- cgit From b87c498ee3e5fb1e6e90084fc093a66abaa311c6 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Fri, 2 Sep 2022 19:56:57 +0200 Subject: optimize key and add bg --- webAO/styles/chatbox/bricks.svg | 11 +++++++++++ webAO/styles/chatbox/key.css | 17 +++++++++++------ 2 files changed, 22 insertions(+), 6 deletions(-) create mode 100644 webAO/styles/chatbox/bricks.svg (limited to 'webAO') diff --git a/webAO/styles/chatbox/bricks.svg b/webAO/styles/chatbox/bricks.svg new file mode 100644 index 0000000..6baca51 --- /dev/null +++ b/webAO/styles/chatbox/bricks.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/webAO/styles/chatbox/key.css b/webAO/styles/chatbox/key.css index 50d2bc1..f6c8a7d 100644 --- a/webAO/styles/chatbox/key.css +++ b/webAO/styles/chatbox/key.css @@ -146,9 +146,11 @@ left: 1%; width: 12%; height: 15%; - background-color: #d59a9a; + background: url("bricks.svg"); + background-size: 1.5em; border: #ffbe9f 3px ridge; border-radius: 100%; + font-family: serif; } #client_clock_month { @@ -171,12 +173,15 @@ position: absolute; width: 50%; height: 50%; - left: 25%; - top: 25%; + left: 11%; + top: 11%; margin: 0; - color: #fdf5e4; + color: #ffe; text-shadow: -1px -1px 0 #78320b, 1px -1px 0 #78320b, -1px 1px 0 #78320b, 1px 1px 0 #78320b; font-size: 3em; + background: rgba(255,255,255,0.7); + border-radius: 100%; + padding: 0.25em; } #client_clock_weekday { @@ -186,8 +191,8 @@ right: 0; bottom: 0; margin: 0; - color: gray; - text-shadow: -1px -1px 0 darkgray, 1px -1px 0 darkgray, -1px 1px 0 darkgray, 1px 1px 0 darkgray; + color: #ccc; + text-shadow: -1px -1px 0 #333, 1px -1px 0 #333, -1px 1px 0 #333, 1px 1px 0 #333; text-decoration: underline; font-size: smaller; font-weight: bold; -- cgit From 2bfa8207ce40a853d0f62a72e006c9b2b90d69b6 Mon Sep 17 00:00:00 2001 From: Caleb Date: Fri, 2 Sep 2022 21:50:34 -0400 Subject: New handler --- webAO/client.ts | 113 ++++------------------------------------- webAO/packets/ms.js | 28 ---------- webAO/packets/packetHandler.ts | 87 +++++++++++++++++++++++++++++++ 3 files changed, 97 insertions(+), 131 deletions(-) delete mode 100644 webAO/packets/ms.js create mode 100644 webAO/packets/packetHandler.ts (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index f216bce..ef3ab1a 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -13,45 +13,6 @@ import vanilla_character_arr from "./constants/characters.js"; import vanilla_music_arr from "./constants/music.js"; import vanilla_background_arr from "./constants/backgrounds.js"; import vanilla_evidence_arr from "./constants/evidence.js"; -import { handleCT } from './packets/handlers/handleCT' -import { handleMC } from './packets/handlers/handleMC' -import { handleRMC } from './packets/handlers/handleRMC' -import { handleFL } from './packets/handlers/handleFL' -import { handleLE } from './packets/handlers/handleLE' -import { handleEM } from './packets/handlers/handleEM' -import { handleEI } from './packets/handlers/handleEI' -import { handleSC } from './packets/handlers/handleSC' -import { handleCI } from './packets/handlers/handleCI' -import { handleFM } from './packets/handlers/handleFM' -import { handleFA } from './packets/handlers/handleFA' -import { handleSM } from './packets/handlers/handleSM' -import { handleMM } from './packets/handlers/handleMM' -import { handleBD } from './packets/handlers/handleBD' -import { handleBB } from './packets/handlers/handleBB' -import { handleKB } from './packets/handlers/handleKB' -import { handleKK } from './packets/handlers/handleKK' -import { handleDONE } from './packets/handlers/handleDONE' -import { handleBN } from './packets/handlers/handleBN' -import { handleHP } from './packets/handlers/handleHP' -import { handleRT } from './packets/handlers/handleRT' -import { handleTI } from './packets/handlers/handleTI' -import { handleZZ } from './packets/handlers/handleZZ' -import { handleHI } from './packets/handlers/handleHI' -import { handleID } from './packets/handlers/handleID' -import { handlePN } from './packets/handlers/handlePN' -import { handleSI } from './packets/handlers/handleSI' -import { handleARUP } from './packets/handlers/handleARUP' -import { handleaskchaa } from './packets/handlers/handleaskchaa' -import { handleCC } from './packets/handlers/handleCC' -import { handleRC } from './packets/handlers/handleRC' -import { handleRM } from './packets/handlers/handleRM' -import { handleRD } from './packets/handlers/handleRD' -import { handleCharsCheck } from './packets/handlers/handleCharsCheck' -import { handlePV } from './packets/handlers/handlePV' -import { handleASS } from './packets/handlers/handleASS' -import { handleackMS } from './packets/handlers/handleackMS' -import { handleSP } from './packets/handlers/handleSP' -import { handleJD } from './packets/handlers/handleJD' import chatbox_arr from "./styles/chatbox/chatboxes.js"; import iniParse from "./iniParse"; import getCookie from "./utils/getCookie"; @@ -70,8 +31,7 @@ import downloadFile from "./services/downloadFile"; import { getFilenameFromPath } from "./utils/paths"; const version = process.env.npm_package_version; import masterViewport, { Viewport } from "./viewport"; -import { handleMS } from './packets/handlers/handleMS'; - +import { packetHandler } from './packets/packetHandler' let { ip: serverIP, mode, asset, theme } = queryParser(); // Unless there is an asset URL specified, use the wasabi one const DEFAULT_HOST = "http://attorneyoffline.de/base/"; @@ -259,53 +219,6 @@ class Client extends EventEmitter { this.checkUpdater = null; this.viewport = masterViewport(this); - /** - * Assign handlers for all commands - * If you implement a new command, you need to add it here - */ - this.on("MS", handleMS); - this.on("CT", handleCT); - this.on("MC", handleMC); - this.on("RMC", handleRMC); - this.on("CI", handleCI); - this.on("SC", handleSC); - this.on("EI", handleEI); - this.on("FL", handleFL); - this.on("LE", handleLE); - this.on("EM", handleEM); - this.on("FM", handleFM); - this.on("FA", handleFA); - this.on("SM", handleSM); - this.on("MM", handleMM); - this.on("BD", handleBD); - this.on("BB", handleBB); - this.on("KB", handleKB); - this.on("KK", handleKK); - this.on("DONE", handleDONE); - this.on("BN", handleBN); - this.on("HP", handleHP); - this.on("RT", handleRT); - this.on("TI", handleTI); - this.on("ZZ", handleZZ); - this.on("HI", handleHI); - this.on("ID", handleID); - this.on("PN", handlePN); - this.on("SI", handleSI); - this.on("ARUP", handleARUP); - this.on("askchaa", handleaskchaa); - this.on("CC", handleCC); - this.on("RC", handleRC); - this.on("RM", handleRM); - this.on("RD", handleRD); - this.on("CharsCheck", handleCharsCheck); - this.on("PV", handlePV); - this.on("ASS", handleASS); - this.on("ackMS", handleackMS); - this.on("SP", handleSP); - this.on("JD", handleJD); - this.on("decryptor", () => { }); - this.on("CHECK", () => { }); - this.on("CH", () => { }); this._lastTimeICReceived = new Date(0); } @@ -703,20 +616,14 @@ class Client extends EventEmitter { const msg = e.data; console.debug(`S: ${msg}`); - const lines = msg.split("%"); - - for (const msg of lines) { - if (msg === "") { - break; - } - - const args = msg.split("#"); - const header = args[0]; + const data = msg.split("%")[0]; + const splitPacket = data.split('#') + const packetHeader = splitPacket[0]; + + packetHandler.has(packetHeader) + ? packetHandler.get(packetHeader)(splitPacket) + : console.warn(`Invalid packet header ${packetHeader}`); - if (!this.emit(header, args)) { - console.warn(`Invalid packet header ${header}`); - } - } } /** @@ -1308,7 +1215,7 @@ window.changeCallwords = changeCallwords; * Triggered by the modcall sfx dropdown */ export function modcall_test() { - handleZZ("test#test".split("#")); + packetHandler.get("ZZ")("test#test".split("#")); } window.modcall_test = modcall_test; @@ -1320,7 +1227,7 @@ export async function iniedit() { .value; const inicharID = client.charID; await client.handleCharacterInfo(ininame.split("&"), inicharID); - handlePV(`PV#0#CID#${inicharID}`.split("#")); + packetHandler.get("PV")(`PV#0#CID#${inicharID}`.split("#")); } window.iniedit = iniedit; diff --git a/webAO/packets/ms.js b/webAO/packets/ms.js deleted file mode 100644 index 26851bd..0000000 --- a/webAO/packets/ms.js +++ /dev/null @@ -1,28 +0,0 @@ -export default { - deskmod, - preanim, - name, - emote, - message, - side, - sfx_name, - emote_modifier, - sfx_delay, - objection_modifier, - evidence, - flip, - realization, - text_color, - showname, - other_charid, - self_hoffset, - self_yoffset, - noninterrupting_preanim, - looping_sfx, - screenshake, - frame_screenshake, - frame_realization, - frame_sfx, - additive, - effect, -}; diff --git a/webAO/packets/packetHandler.ts b/webAO/packets/packetHandler.ts new file mode 100644 index 0000000..b98eef9 --- /dev/null +++ b/webAO/packets/packetHandler.ts @@ -0,0 +1,87 @@ +import { handleMS } from './handlers/handleMS'; +import { handleCT } from './handlers/handleCT' +import { handleMC } from './handlers/handleMC' +import { handleRMC } from './handlers/handleRMC' +import { handleFL } from './handlers/handleFL' +import { handleLE } from './handlers/handleLE' +import { handleEM } from './handlers/handleEM' +import { handleEI } from './handlers/handleEI' +import { handleSC } from './handlers/handleSC' +import { handleCI } from './handlers/handleCI' +import { handleFM } from './handlers/handleFM' +import { handleFA } from './handlers/handleFA' +import { handleSM } from './handlers/handleSM' +import { handleMM } from './handlers/handleMM' +import { handleBD } from './handlers/handleBD' +import { handleBB } from './handlers/handleBB' +import { handleKB } from './handlers/handleKB' +import { handleKK } from './handlers/handleKK' +import { handleDONE } from './handlers/handleDONE' +import { handleBN } from './handlers/handleBN' +import { handleHP } from './handlers/handleHP' +import { handleRT } from './handlers/handleRT' +import { handleTI } from './handlers/handleTI' +import { handleZZ } from './handlers/handleZZ' +import { handleHI } from './handlers/handleHI' +import { handleID } from './handlers/handleID' +import { handlePN } from './handlers/handlePN' +import { handleSI } from './handlers/handleSI' +import { handleARUP } from './handlers/handleARUP' +import { handleaskchaa } from './handlers/handleaskchaa' +import { handleCC } from './handlers/handleCC' +import { handleRC } from './handlers/handleRC' +import { handleRM } from './handlers/handleRM' +import { handleRD } from './handlers/handleRD' +import { handleCharsCheck } from './handlers/handleCharsCheck' +import { handlePV } from './handlers/handlePV' +import { handleASS } from './handlers/handleASS' +import { handleackMS } from './handlers/handleackMS' +import { handleSP } from './handlers/handleSP' +import { handleJD } from './handlers/handleJD' + +export const packetHandler = new Map([ + ["MS", handleMS], + ["CT", handleCT], + ["MC", handleMC], + ["RMC", handleRMC], + ["CI", handleCI], + ["SC", handleSC], + ["EI", handleEI], + ["FL", handleFL], + ["LE", handleLE], + ["EM", handleEM], + ["FM", handleFM], + ["FA", handleFA], + ["SM", handleSM], + ["MM", handleMM], + ["BD", handleBD], + ["BB", handleBB], + ["KB", handleKB], + ["KK", handleKK], + ["DONE", handleDONE], + ["BN", handleBN], + ["HP", handleHP], + ["RT", handleRT], + ["TI", handleTI], + ["ZZ", handleZZ], + ["HI", handleHI], + ["ID", handleID], + ["PN", handlePN], + ["SI", handleSI], + ["ARUP", handleARUP], + ["askchaa", handleaskchaa], + ["CC", handleCC], + ["RC", handleRC], + ["RM", handleRM], + ["RD", handleRD], + ["CharsCheck", handleCharsCheck], + ["PV", handlePV], + ["ASS", handleASS], + ["ackMS", handleackMS], + ["SP", handleSP], + ["JD", handleJD], + ["decryptor", () => { }], + ["CHECK", () => { }], + ["CH", () => { }], +] +) \ No newline at end of file -- cgit From 317708a352376a31f1410d57e08a2e1a1ceb6812 Mon Sep 17 00:00:00 2001 From: Caleb Date: Sat, 3 Sep 2022 00:46:33 -0400 Subject: Maybe overkill, but I like it more --- webAO/packets/packetHandler.ts | 88 +----------------------------------------- webAO/packets/packets.ts | 86 +++++++++++++++++++++++++++++++++++++++++ 2 files changed, 88 insertions(+), 86 deletions(-) create mode 100644 webAO/packets/packets.ts (limited to 'webAO') diff --git a/webAO/packets/packetHandler.ts b/webAO/packets/packetHandler.ts index b98eef9..a9b567a 100644 --- a/webAO/packets/packetHandler.ts +++ b/webAO/packets/packetHandler.ts @@ -1,87 +1,3 @@ -import { handleMS } from './handlers/handleMS'; -import { handleCT } from './handlers/handleCT' -import { handleMC } from './handlers/handleMC' -import { handleRMC } from './handlers/handleRMC' -import { handleFL } from './handlers/handleFL' -import { handleLE } from './handlers/handleLE' -import { handleEM } from './handlers/handleEM' -import { handleEI } from './handlers/handleEI' -import { handleSC } from './handlers/handleSC' -import { handleCI } from './handlers/handleCI' -import { handleFM } from './handlers/handleFM' -import { handleFA } from './handlers/handleFA' -import { handleSM } from './handlers/handleSM' -import { handleMM } from './handlers/handleMM' -import { handleBD } from './handlers/handleBD' -import { handleBB } from './handlers/handleBB' -import { handleKB } from './handlers/handleKB' -import { handleKK } from './handlers/handleKK' -import { handleDONE } from './handlers/handleDONE' -import { handleBN } from './handlers/handleBN' -import { handleHP } from './handlers/handleHP' -import { handleRT } from './handlers/handleRT' -import { handleTI } from './handlers/handleTI' -import { handleZZ } from './handlers/handleZZ' -import { handleHI } from './handlers/handleHI' -import { handleID } from './handlers/handleID' -import { handlePN } from './handlers/handlePN' -import { handleSI } from './handlers/handleSI' -import { handleARUP } from './handlers/handleARUP' -import { handleaskchaa } from './handlers/handleaskchaa' -import { handleCC } from './handlers/handleCC' -import { handleRC } from './handlers/handleRC' -import { handleRM } from './handlers/handleRM' -import { handleRD } from './handlers/handleRD' -import { handleCharsCheck } from './handlers/handleCharsCheck' -import { handlePV } from './handlers/handlePV' -import { handleASS } from './handlers/handleASS' -import { handleackMS } from './handlers/handleackMS' -import { handleSP } from './handlers/handleSP' -import { handleJD } from './handlers/handleJD' +import { packets } from './packets' -export const packetHandler = new Map([ - ["MS", handleMS], - ["CT", handleCT], - ["MC", handleMC], - ["RMC", handleRMC], - ["CI", handleCI], - ["SC", handleSC], - ["EI", handleEI], - ["FL", handleFL], - ["LE", handleLE], - ["EM", handleEM], - ["FM", handleFM], - ["FA", handleFA], - ["SM", handleSM], - ["MM", handleMM], - ["BD", handleBD], - ["BB", handleBB], - ["KB", handleKB], - ["KK", handleKK], - ["DONE", handleDONE], - ["BN", handleBN], - ["HP", handleHP], - ["RT", handleRT], - ["TI", handleTI], - ["ZZ", handleZZ], - ["HI", handleHI], - ["ID", handleID], - ["PN", handlePN], - ["SI", handleSI], - ["ARUP", handleARUP], - ["askchaa", handleaskchaa], - ["CC", handleCC], - ["RC", handleRC], - ["RM", handleRM], - ["RD", handleRD], - ["CharsCheck", handleCharsCheck], - ["PV", handlePV], - ["ASS", handleASS], - ["ackMS", handleackMS], - ["SP", handleSP], - ["JD", handleJD], - ["decryptor", () => { }], - ["CHECK", () => { }], - ["CH", () => { }], -] -) \ No newline at end of file +export const packetHandler = new Map(Object.entries(packets)) \ No newline at end of file diff --git a/webAO/packets/packets.ts b/webAO/packets/packets.ts new file mode 100644 index 0000000..79c43c1 --- /dev/null +++ b/webAO/packets/packets.ts @@ -0,0 +1,86 @@ +import { handleMS } from './handlers/handleMS'; +import { handleCT } from './handlers/handleCT' +import { handleMC } from './handlers/handleMC' +import { handleRMC } from './handlers/handleRMC' +import { handleFL } from './handlers/handleFL' +import { handleLE } from './handlers/handleLE' +import { handleEM } from './handlers/handleEM' +import { handleEI } from './handlers/handleEI' +import { handleSC } from './handlers/handleSC' +import { handleCI } from './handlers/handleCI' +import { handleFM } from './handlers/handleFM' +import { handleFA } from './handlers/handleFA' +import { handleSM } from './handlers/handleSM' +import { handleMM } from './handlers/handleMM' +import { handleBD } from './handlers/handleBD' +import { handleBB } from './handlers/handleBB' +import { handleKB } from './handlers/handleKB' +import { handleKK } from './handlers/handleKK' +import { handleDONE } from './handlers/handleDONE' +import { handleBN } from './handlers/handleBN' +import { handleHP } from './handlers/handleHP' +import { handleRT } from './handlers/handleRT' +import { handleTI } from './handlers/handleTI' +import { handleZZ } from './handlers/handleZZ' +import { handleHI } from './handlers/handleHI' +import { handleID } from './handlers/handleID' +import { handlePN } from './handlers/handlePN' +import { handleSI } from './handlers/handleSI' +import { handleARUP } from './handlers/handleARUP' +import { handleaskchaa } from './handlers/handleaskchaa' +import { handleCC } from './handlers/handleCC' +import { handleRC } from './handlers/handleRC' +import { handleRM } from './handlers/handleRM' +import { handleRD } from './handlers/handleRD' +import { handleCharsCheck } from './handlers/handleCharsCheck' +import { handlePV } from './handlers/handlePV' +import { handleASS } from './handlers/handleASS' +import { handleackMS } from './handlers/handleackMS' +import { handleSP } from './handlers/handleSP' +import { handleJD } from './handlers/handleJD' + +export const packets = { + "MS": handleMS, + "CT": handleCT, + "MC": handleMC, + "RMC": handleRMC, + "CI": handleCI, + "SC": handleSC, + "EI": handleEI, + "FL": handleFL, + "LE": handleLE, + "EM": handleEM, + "FM": handleFM, + "FA": handleFA, + "SM": handleSM, + "MM": handleMM, + "BD": handleBD, + "BB": handleBB, + "KB": handleKB, + "KK": handleKK, + "DONE": handleDONE, + "BN": handleBN, + "HP": handleHP, + "RT": handleRT, + "TI": handleTI, + "ZZ": handleZZ, + "HI": handleHI, + "ID": handleID, + "PN": handlePN, + "SI": handleSI, + "ARUP": handleARUP, + "askchaa": handleaskchaa, + "CC": handleCC, + "RC": handleRC, + "RM": handleRM, + "RD": handleRD, + "CharsCheck": handleCharsCheck, + "PV": handlePV, + "ASS": handleASS, + "ackMS": handleackMS, + "SP": handleSP, + "JD": handleJD, + "decryptor": () => { }, + "CHECK": () => { }, + "CH": () => { }, +} \ No newline at end of file -- cgit From b383ea7dffa7bc3bdb9556491cf100a811578102 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Sat, 3 Sep 2022 11:30:56 +0200 Subject: fix date being wonky when it's not the 5th --- webAO/styles/chatbox/key.css | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) (limited to 'webAO') diff --git a/webAO/styles/chatbox/key.css b/webAO/styles/chatbox/key.css index f6c8a7d..77f2e99 100644 --- a/webAO/styles/chatbox/key.css +++ b/webAO/styles/chatbox/key.css @@ -171,17 +171,17 @@ #client_clock_date { position: absolute; - width: 50%; - height: 50%; - left: 11%; - top: 11%; + width: 80%; + height: 80%; + left: 10%; + top: 10%; margin: 0; color: #ffe; text-shadow: -1px -1px 0 #78320b, 1px -1px 0 #78320b, -1px 1px 0 #78320b, 1px 1px 0 #78320b; font-size: 3em; background: rgba(255,255,255,0.7); border-radius: 100%; - padding: 0.25em; + line-height: 1.8; } #client_clock_weekday { -- cgit From d37c8330a8e70fcd74549ec52cde8b4be3ad3250 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Sat, 3 Sep 2022 17:11:47 +0200 Subject: provide mouseover for charicons --- webAO/client.ts | 1 + 1 file changed, 1 insertion(+) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index ef3ab1a..980fadd 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -716,6 +716,7 @@ class Client extends EventEmitter { const exists = await fileExists(fileUrl); if (exists) { img.alt = chargs[0]; + img.title = chargs[0]; img.src = fileUrl; return; } -- cgit From d20994bd7c244cc84ab138cec441b05c261a83e4 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Sat, 3 Sep 2022 17:13:39 +0200 Subject: also provide mouseover for emotes --- webAO/packets/handlers/handlePV.ts | 1 + 1 file changed, 1 insertion(+) (limited to 'webAO') diff --git a/webAO/packets/handlers/handlePV.ts b/webAO/packets/handlers/handlePV.ts index 18947c5..ea57331 100644 --- a/webAO/packets/handlers/handlePV.ts +++ b/webAO/packets/handlers/handlePV.ts @@ -60,6 +60,7 @@ export const handlePV = async (args: string[]) => { emotesList.innerHTML += `${emotes[i].desc}`; } catch (e) { -- cgit From 67314a8bc22ea198b8e3de788282a0ca0151cb1e Mon Sep 17 00:00:00 2001 From: Caleb Date: Sun, 4 Sep 2022 00:02:19 -0400 Subject: Several functions moved --- webAO/client.ts | 202 ++--------------------------------- webAO/dom/changeBackgroundOOC.ts | 27 +++++ webAO/dom/musicListClick.ts | 21 ++++ webAO/dom/musicListFilter.ts | 24 +++++ webAO/dom/muteListClick.ts | 20 ++++ webAO/dom/onOOCEnter.ts | 16 +++ webAO/dom/onReplayGo.ts | 9 ++ webAO/dom/resetOffset.ts | 5 + webAO/dom/showNameClick.ts | 26 +++++ webAO/dom/updateActionCommands.ts | 27 +++++ webAO/dom/updateBackgroundPreview.ts | 29 +++++ webAO/packets/handlers/handleBN.ts | 146 ++++++++++++------------- webAO/packets/handlers/handlePV.ts | 130 +++++++++++----------- webAO/packets/handlers/handleSP.ts | 3 +- 14 files changed, 351 insertions(+), 334 deletions(-) create mode 100644 webAO/dom/changeBackgroundOOC.ts create mode 100644 webAO/dom/musicListClick.ts create mode 100644 webAO/dom/musicListFilter.ts create mode 100644 webAO/dom/muteListClick.ts create mode 100644 webAO/dom/onOOCEnter.ts create mode 100644 webAO/dom/onReplayGo.ts create mode 100644 webAO/dom/resetOffset.ts create mode 100644 webAO/dom/showNameClick.ts create mode 100644 webAO/dom/updateActionCommands.ts create mode 100644 webAO/dom/updateBackgroundPreview.ts (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 980fadd..806c0a5 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -35,6 +35,9 @@ import { packetHandler } from './packets/packetHandler' let { ip: serverIP, mode, asset, theme } = queryParser(); // Unless there is an asset URL specified, use the wasabi one const DEFAULT_HOST = "http://attorneyoffline.de/base/"; +import { showname_click } from './dom/showNameClick' +import { onReplayGo } from './dom/onReplayGo' +import { updateActionCommands } from './dom/updateActionCommands' export let AO_HOST = asset || DEFAULT_HOST; export const setAOhost = (val: string) => { AO_HOST = val @@ -619,10 +622,10 @@ class Client extends EventEmitter { const data = msg.split("%")[0]; const splitPacket = data.split('#') const packetHeader = splitPacket[0]; - - packetHandler.has(packetHeader) - ? packetHandler.get(packetHeader)(splitPacket) - : console.warn(`Invalid packet header ${packetHeader}`); + + packetHandler.has(packetHeader) + ? packetHandler.get(packetHeader)(splitPacket) + : console.warn(`Invalid packet header ${packetHeader}`); } @@ -947,29 +950,8 @@ class Client extends EventEmitter { } } -/** - * Triggered when the Return key is pressed on the out-of-character chat input box. - * @param {KeyboardEvent} event - */ -export function onOOCEnter(event: KeyboardEvent) { - if (event.keyCode === 13) { - client.sendOOC( - (document.getElementById("client_oocinputbox")).value - ); - (document.getElementById("client_oocinputbox")).value = - ""; - } -} -window.onOOCEnter = onOOCEnter; -/** - * Triggered when the user click replay GOOOOO - * @param {KeyboardEvent} event - */ -export function onReplayGo(_event: Event) { - client.handleReplay(); -} -window.onReplayGo = onReplayGo; + /** * Triggered when the Return key is pressed on the in-character chat input box. @@ -1091,100 +1073,6 @@ export function resetICParams() { } } -export function resetOffset(_event: Event) { - (document.getElementById("pair_offset")).value = "0"; - (document.getElementById("pair_y_offset")).value = "0"; -} -window.resetOffset = resetOffset; - -/** - * Triggered when the music search bar is changed - * @param {MouseEvent} event - */ -export function musiclist_filter(_event: Event) { - const musiclist_element = ( - document.getElementById("client_musiclist") - ); - const searchname = (( - document.getElementById("client_musicsearch") - )).value; - - musiclist_element.innerHTML = ""; - - for (const trackname of client.musics) { - if (trackname.toLowerCase().indexOf(searchname.toLowerCase()) !== -1) { - const newentry = document.createElement("OPTION"); - newentry.text = trackname; - musiclist_element.options.add(newentry); - } - } -} -window.musiclist_filter = musiclist_filter; - -/** - * Triggered when an item on the music list is clicked. - * @param {MouseEvent} event - */ -export function musiclist_click(_event: Event) { - const playtrack = (( - document.getElementById("client_musiclist") - )).value; - client.sendMusicChange(playtrack); - - // This is here so you can't actually select multiple tracks, - // even though the select tag has the multiple option to render differently - const musiclist_elements = (( - document.getElementById("client_musiclist") - )).selectedOptions; - for (let i = 0; i < musiclist_elements.length; i++) { - musiclist_elements[i].selected = false; - } -} -window.musiclist_click = musiclist_click; - -/** - * Triggered when a character in the mute list is clicked - * @param {MouseEvent} event - */ -export function mutelist_click(_event: Event) { - const mutelist = document.getElementById("mute_select"); - const selected_character = mutelist.options[mutelist.selectedIndex]; - - if (client.chars[selected_character.value].muted === false) { - client.chars[selected_character.value].muted = true; - selected_character.text = `${client.chars[selected_character.value].name - } (muted)`; - console.info(`muted ${client.chars[selected_character.value].name}`); - } else { - client.chars[selected_character.value].muted = false; - selected_character.text = client.chars[selected_character.value].name; - } -} -window.mutelist_click = mutelist_click; - -/** - * Triggered when the showname checkboc is clicked - * @param {MouseEvent} event - */ -export function showname_click(_event: Event) { - setCookie( - "showname", - String((document.getElementById("showname")).checked) - ); - setCookie( - "ic_chat_name", - (document.getElementById("ic_chat_name")).value - ); - - const css_s = document.getElementById("nameplate_setting"); - - if ((document.getElementById("showname")).checked) { - css_s.href = "styles/shownames.css"; - } else { - css_s.href = "styles/nameplates.css"; - } -} -window.showname_click = showname_click; /** * Triggered when an item on the area list is clicked. @@ -1714,55 +1602,9 @@ export function updateEvidenceIcon() { } window.updateEvidenceIcon = updateEvidenceIcon; -/** - * Update evidence icon. - */ -export function updateActionCommands(side: string) { - if (side === "jud") { - document.getElementById("judge_action").style.display = "inline-table"; - document.getElementById("no_action").style.display = "none"; - } else { - document.getElementById("judge_action").style.display = "none"; - document.getElementById("no_action").style.display = "inline-table"; - } - // Update role selector - for ( - let i = 0, - role_select = document.getElementById("role_select"); - i < role_select.options.length; - i++ - ) { - if (side === role_select.options[i].value) { - role_select.options.selectedIndex = i; - return; - } - } -} -window.updateActionCommands = updateActionCommands; -/** - * Change background via OOC. - */ -export function changeBackgroundOOC() { - const selectedBG = document.getElementById("bg_select"); - const changeBGCommand = "bg $1"; - const bgFilename = document.getElementById("bg_filename"); - - let filename = ""; - if (selectedBG.selectedIndex === 0) { - filename = bgFilename.value; - } else { - filename = selectedBG.value; - } - if (mode === "join") { - client.sendOOC(`/${changeBGCommand.replace("$1", filename)}`); - } else if (mode === "replay") { - client.sendSelf(`BN#${filename}#%`); - } -} -window.changeBackgroundOOC = changeBackgroundOOC; /** * Change role via OOC. @@ -1864,34 +1706,6 @@ export function redHPP() { } window.redHPP = redHPP; -/** - * Update background preview. - */ -export function updateBackgroundPreview() { - const background_select = ( - document.getElementById("bg_select") - ); - const background_filename = ( - document.getElementById("bg_filename") - ); - const background_preview = ( - document.getElementById("bg_preview") - ); - - if (background_select.selectedIndex === 0) { - background_filename.style.display = "initial"; - background_preview.src = `${AO_HOST}background/${encodeURI( - background_filename.value.toLowerCase() - )}/defenseempty.png`; - } else { - background_filename.style.display = "none"; - background_preview.src = `${AO_HOST}background/${encodeURI( - background_select.value.toLowerCase() - )}/defenseempty.png`; - } -} -window.updateBackgroundPreview = updateBackgroundPreview; - /** * Highlights and selects a menu. * @param {number} menu the menu to be selected diff --git a/webAO/dom/changeBackgroundOOC.ts b/webAO/dom/changeBackgroundOOC.ts new file mode 100644 index 0000000..abf3a97 --- /dev/null +++ b/webAO/dom/changeBackgroundOOC.ts @@ -0,0 +1,27 @@ +import { client } from "../client"; +import queryParser from "../utils/queryParser"; + +let { mode } = queryParser(); + +/** + * Change background via OOC. + */ +export function changeBackgroundOOC() { + const selectedBG = document.getElementById("bg_select"); + const changeBGCommand = "bg $1"; + const bgFilename = document.getElementById("bg_filename"); + + let filename = ""; + if (selectedBG.selectedIndex === 0) { + filename = bgFilename.value; + } else { + filename = selectedBG.value; + } + + if (mode === "join") { + client.sendOOC(`/${changeBGCommand.replace("$1", filename)}`); + } else if (mode === "replay") { + client.sendSelf(`BN#${filename}#%`); + } +} +window.changeBackgroundOOC = changeBackgroundOOC; \ No newline at end of file diff --git a/webAO/dom/musicListClick.ts b/webAO/dom/musicListClick.ts new file mode 100644 index 0000000..1eb6619 --- /dev/null +++ b/webAO/dom/musicListClick.ts @@ -0,0 +1,21 @@ +import { client } from "../client"; +/** + * Triggered when an item on the music list is clicked. + * @param {MouseEvent} event + */ +export function musiclist_click(_event: Event) { + const playtrack = (( + document.getElementById("client_musiclist") + )).value; + client.sendMusicChange(playtrack); + + // This is here so you can't actually select multiple tracks, + // even though the select tag has the multiple option to render differently + const musiclist_elements = (( + document.getElementById("client_musiclist") + )).selectedOptions; + for (let i = 0; i < musiclist_elements.length; i++) { + musiclist_elements[i].selected = false; + } +} +window.musiclist_click = musiclist_click; \ No newline at end of file diff --git a/webAO/dom/musicListFilter.ts b/webAO/dom/musicListFilter.ts new file mode 100644 index 0000000..c44978d --- /dev/null +++ b/webAO/dom/musicListFilter.ts @@ -0,0 +1,24 @@ +import { client } from "../client"; +/** + * Triggered when the music search bar is changed + * @param {MouseEvent} event + */ +export function musiclist_filter(_event: Event) { + const musiclist_element = ( + document.getElementById("client_musiclist") + ); + const searchname = (( + document.getElementById("client_musicsearch") + )).value; + + musiclist_element.innerHTML = ""; + + for (const trackname of client.musics) { + if (trackname.toLowerCase().indexOf(searchname.toLowerCase()) !== -1) { + const newentry = document.createElement("OPTION"); + newentry.text = trackname; + musiclist_element.options.add(newentry); + } + } +} +window.musiclist_filter = musiclist_filter; \ No newline at end of file diff --git a/webAO/dom/muteListClick.ts b/webAO/dom/muteListClick.ts new file mode 100644 index 0000000..6ae3eea --- /dev/null +++ b/webAO/dom/muteListClick.ts @@ -0,0 +1,20 @@ +import { client } from "../client"; +/** + * Triggered when a character in the mute list is clicked + * @param {MouseEvent} event + */ +export function mutelist_click(_event: Event) { + const mutelist = document.getElementById("mute_select"); + const selected_character = mutelist.options[mutelist.selectedIndex]; + + if (client.chars[selected_character.value].muted === false) { + client.chars[selected_character.value].muted = true; + selected_character.text = `${client.chars[selected_character.value].name + } (muted)`; + console.info(`muted ${client.chars[selected_character.value].name}`); + } else { + client.chars[selected_character.value].muted = false; + selected_character.text = client.chars[selected_character.value].name; + } +} +window.mutelist_click = mutelist_click; \ No newline at end of file diff --git a/webAO/dom/onOOCEnter.ts b/webAO/dom/onOOCEnter.ts new file mode 100644 index 0000000..a24928b --- /dev/null +++ b/webAO/dom/onOOCEnter.ts @@ -0,0 +1,16 @@ +import {client} from '../client' +/** + * Triggered when the Return key is pressed on the out-of-character chat input box. + * @param {KeyboardEvent} event + */ + export function onOOCEnter(event: KeyboardEvent) { + if (event.keyCode === 13) { + client.sendOOC( + (document.getElementById("client_oocinputbox")).value + ); + (document.getElementById("client_oocinputbox")).value = + ""; + } + } + window.onOOCEnter = onOOCEnter; + \ No newline at end of file diff --git a/webAO/dom/onReplayGo.ts b/webAO/dom/onReplayGo.ts new file mode 100644 index 0000000..c13a8e6 --- /dev/null +++ b/webAO/dom/onReplayGo.ts @@ -0,0 +1,9 @@ +import { client } from "../client"; +/** + * Triggered when the user click replay GOOOOO + * @param {KeyboardEvent} event + */ + export function onReplayGo(_event: Event) { + client.handleReplay(); + } + window.onReplayGo = onReplayGo; \ No newline at end of file diff --git a/webAO/dom/resetOffset.ts b/webAO/dom/resetOffset.ts new file mode 100644 index 0000000..2cf8197 --- /dev/null +++ b/webAO/dom/resetOffset.ts @@ -0,0 +1,5 @@ +export function resetOffset(_event: Event) { + (document.getElementById("pair_offset")).value = "0"; + (document.getElementById("pair_y_offset")).value = "0"; + } + window.resetOffset = resetOffset; \ No newline at end of file diff --git a/webAO/dom/showNameClick.ts b/webAO/dom/showNameClick.ts new file mode 100644 index 0000000..265f6c8 --- /dev/null +++ b/webAO/dom/showNameClick.ts @@ -0,0 +1,26 @@ +import setCookie from "../utils/setCookie"; + + +/** + * Triggered when the showname checkboc is clicked + * @param {MouseEvent} event + */ +export function showname_click(_event: Event) { + setCookie( + "showname", + String((document.getElementById("showname")).checked) + ); + setCookie( + "ic_chat_name", + (document.getElementById("ic_chat_name")).value + ); + + const css_s = document.getElementById("nameplate_setting"); + + if ((document.getElementById("showname")).checked) { + css_s.href = "styles/shownames.css"; + } else { + css_s.href = "styles/nameplates.css"; + } +} +window.showname_click = showname_click; diff --git a/webAO/dom/updateActionCommands.ts b/webAO/dom/updateActionCommands.ts new file mode 100644 index 0000000..9d0bd82 --- /dev/null +++ b/webAO/dom/updateActionCommands.ts @@ -0,0 +1,27 @@ + +/** + * Update evidence icon. + */ +export function updateActionCommands(side: string) { + if (side === "jud") { + document.getElementById("judge_action")!.style.display = "inline-table"; + document.getElementById("no_action")!.style.display = "none"; + } else { + document.getElementById("judge_action")!.style.display = "none"; + document.getElementById("no_action")!.style.display = "inline-table"; + } + + // Update role selector + for ( + let i = 0, + role_select = document.getElementById("role_select"); + i < role_select.options.length; + i++ + ) { + if (side === role_select.options[i].value) { + role_select.options.selectedIndex = i; + return; + } + } +} +window.updateActionCommands = updateActionCommands; \ No newline at end of file diff --git a/webAO/dom/updateBackgroundPreview.ts b/webAO/dom/updateBackgroundPreview.ts new file mode 100644 index 0000000..e55bf60 --- /dev/null +++ b/webAO/dom/updateBackgroundPreview.ts @@ -0,0 +1,29 @@ +import { AO_HOST } from "../client"; + +/** + * Update background preview. + */ +export function updateBackgroundPreview() { + const background_select = ( + document.getElementById("bg_select") + ); + const background_filename = ( + document.getElementById("bg_filename") + ); + const background_preview = ( + document.getElementById("bg_preview") + ); + + if (background_select.selectedIndex === 0) { + background_filename.style.display = "initial"; + background_preview.src = `${AO_HOST}background/${encodeURI( + background_filename.value.toLowerCase() + )}/defenseempty.png`; + } else { + background_filename.style.display = "none"; + background_preview.src = `${AO_HOST}background/${encodeURI( + background_select.value.toLowerCase() + )}/defenseempty.png`; + } +} +window.updateBackgroundPreview = updateBackgroundPreview; \ No newline at end of file diff --git a/webAO/packets/handlers/handleBN.ts b/webAO/packets/handlers/handleBN.ts index 3cd3c5a..9dabc15 100644 --- a/webAO/packets/handlers/handleBN.ts +++ b/webAO/packets/handlers/handleBN.ts @@ -1,81 +1,81 @@ -import { AO_HOST, client, getIndexFromSelect, updateBackgroundPreview } from "../../client"; +import { AO_HOST, client, getIndexFromSelect } from "../../client"; import { safeTags } from "../../encoding"; import tryUrls from "../../utils/tryUrls"; +import { updateBackgroundPreview } from '../../dom/updateBackgroundPreview' - - /** - * Handles a background change. - * @param {Array} args packet arguments - */ +/** + * Handles a background change. + * @param {Array} args packet arguments + */ export const handleBN = (args: string[]) => { - const bgFromArgs = safeTags(args[1]); - client.viewport.setBackgroundName(bgFromArgs); - const bgfolder = client.viewport.getBackgroundFolder(); - const bg_index = getIndexFromSelect( - "bg_select", - client.viewport.getBackgroundName() - ); - (document.getElementById("bg_select")).selectedIndex = - bg_index; - updateBackgroundPreview(); - if (bg_index === 0) { - (document.getElementById("bg_filename")).value = - client.viewport.getBackgroundName(); - } + const bgFromArgs = safeTags(args[1]); + client.viewport.setBackgroundName(bgFromArgs); + const bgfolder = client.viewport.getBackgroundFolder(); + const bg_index = getIndexFromSelect( + "bg_select", + client.viewport.getBackgroundName() + ); + (document.getElementById("bg_select")).selectedIndex = + bg_index; + updateBackgroundPreview(); + if (bg_index === 0) { + (document.getElementById("bg_filename")).value = + client.viewport.getBackgroundName(); + } - tryUrls( - `${AO_HOST}background/${encodeURI(args[1].toLowerCase())}/defenseempty` - ).then((resp) => { - (document.getElementById("bg_preview")).src = resp; - }); - tryUrls(`${bgfolder}defensedesk`).then((resp) => { - (document.getElementById("client_def_bench")).src = - resp; - }); - tryUrls(`${bgfolder}stand`).then((resp) => { - (document.getElementById("client_wit_bench")).src = - resp; - }); - tryUrls(`${bgfolder}prosecutiondesk`).then((resp) => { - (document.getElementById("client_pro_bench")).src = - resp; - }); - tryUrls(`${bgfolder}full`).then((resp) => { - (document.getElementById("client_court")).src = resp; - }); - tryUrls(`${bgfolder}defenseempty`).then((resp) => { - (document.getElementById("client_court_def")).src = - resp; - }); - tryUrls(`${bgfolder}transition_def`).then((resp) => { - (document.getElementById("client_court_deft")).src = - resp; - }); - tryUrls(`${bgfolder}witnessempty`).then((resp) => { - (document.getElementById("client_court_wit")).src = - resp; - }); - tryUrls(`${bgfolder}transition_pro`).then((resp) => { - (document.getElementById("client_court_prot")).src = - resp; + tryUrls( + `${AO_HOST}background/${encodeURI(args[1].toLowerCase())}/defenseempty` + ).then((resp) => { + (document.getElementById("bg_preview")).src = resp; + }); + tryUrls(`${bgfolder}defensedesk`).then((resp) => { + (document.getElementById("client_def_bench")).src = + resp; + }); + tryUrls(`${bgfolder}stand`).then((resp) => { + (document.getElementById("client_wit_bench")).src = + resp; + }); + tryUrls(`${bgfolder}prosecutiondesk`).then((resp) => { + (document.getElementById("client_pro_bench")).src = + resp; + }); + tryUrls(`${bgfolder}full`).then((resp) => { + (document.getElementById("client_court")).src = resp; + }); + tryUrls(`${bgfolder}defenseempty`).then((resp) => { + (document.getElementById("client_court_def")).src = + resp; + }); + tryUrls(`${bgfolder}transition_def`).then((resp) => { + (document.getElementById("client_court_deft")).src = + resp; + }); + tryUrls(`${bgfolder}witnessempty`).then((resp) => { + (document.getElementById("client_court_wit")).src = + resp; + }); + tryUrls(`${bgfolder}transition_pro`).then((resp) => { + (document.getElementById("client_court_prot")).src = + resp; + }); + tryUrls(`${bgfolder}prosecutorempty`).then((resp) => { + (document.getElementById("client_court_pro")).src = + resp; + }); + + if (client.charID === -1) { + client.viewport.set_side({ + position: "jud", + showSpeedLines: false, + showDesk: true, }); - tryUrls(`${bgfolder}prosecutorempty`).then((resp) => { - (document.getElementById("client_court_pro")).src = - resp; + } else { + client.viewport.set_side({ + position: client.chars[client.charID].side, + showSpeedLines: false, + showDesk: true, }); - - if (client.charID === -1) { - client.viewport.set_side({ - position: "jud", - showSpeedLines: false, - showDesk: true, - }); - } else { - client.viewport.set_side({ - position: client.chars[client.charID].side, - showSpeedLines: false, - showDesk: true, - }); - } - } \ No newline at end of file + } +} \ No newline at end of file diff --git a/webAO/packets/handlers/handlePV.ts b/webAO/packets/handlers/handlePV.ts index ea57331..5bdb702 100644 --- a/webAO/packets/handlers/handlePV.ts +++ b/webAO/packets/handlers/handlePV.ts @@ -1,83 +1,83 @@ -import { AO_HOST, client, pickEmotion, updateActionCommands } from "../../client"; +import { AO_HOST, client, pickEmotion } from "../../client"; import fileExists from "../../utils/fileExists"; +import { updateActionCommands } from '../../dom/updateActionCommands' - - /** - * Handles the server's assignment of a character for the player to use. - * PV # playerID (unused) # CID # character ID - * @param {Array} args packet arguments - */ +/** + * Handles the server's assignment of a character for the player to use. + * PV # playerID (unused) # CID # character ID + * @param {Array} args packet arguments + */ export const handlePV = async (args: string[]) => { - client.charID = Number(args[3]); - document.getElementById("client_waiting")!.style.display = "none"; - document.getElementById("client_charselect")!.style.display = "none"; + client.charID = Number(args[3]); + document.getElementById("client_waiting")!.style.display = "none"; + document.getElementById("client_charselect")!.style.display = "none"; - const me = client.chars[client.charID]; - client.selectedEmote = -1; - const { emotes } = client; - const emotesList = document.getElementById("client_emo")!; - emotesList.style.display = ""; - emotesList.innerHTML = ""; // Clear emote box - const ini = me.inifile; - me.side = ini.options.side; - updateActionCommands(me.side); - if (ini.emotions.number === 0) { - emotesList.innerHTML = `No emotes available`; - } else { - for (let i = 1; i <= ini.emotions.number; i++) { + } else { + for (let i = 1; i <= ini.emotions.number; i++) { + try { + const emoteinfo = ini.emotions[i].split("#"); + let esfx; + let esfxd; try { - const emoteinfo = ini.emotions[i].split("#"); - let esfx; - let esfxd; - try { - esfx = ini.soundn[i] || "0"; - esfxd = Number(ini.soundt[i]) || 0; - } catch (e) { - console.warn("ini sound is completly missing"); - esfx = "0"; - esfxd = 0; - } - // Make sure the asset server is case insensitive, or that everything on it is lowercase + esfx = ini.soundn[i] || "0"; + esfxd = Number(ini.soundt[i]) || 0; + } catch (e) { + console.warn("ini sound is completly missing"); + esfx = "0"; + esfxd = 0; + } + // Make sure the asset server is case insensitive, or that everything on it is lowercase - emotes[i] = { - desc: emoteinfo[0].toLowerCase(), - preanim: emoteinfo[1].toLowerCase(), - emote: emoteinfo[2].toLowerCase(), - zoom: Number(emoteinfo[3]) || 0, - deskmod: Number(emoteinfo[4]) || 1, - sfx: esfx.toLowerCase(), - sfxdelay: esfxd, - frame_screenshake: "", - frame_realization: "", - frame_sfx: "", - button: `${AO_HOST}characters/${encodeURI( - me.name.toLowerCase() - )}/emotions/button${i}_off.png`, - }; - emotesList.innerHTML += `${emotes[i].desc}`; - } catch (e) { - console.error(`missing emote ${i}`); - } + } catch (e) { + console.error(`missing emote ${i}`); } - pickEmotion(1); - } - - if ( - await fileExists( - `${AO_HOST}characters/${encodeURI(me.name.toLowerCase())}/custom.gif` - ) - ) { - document.getElementById("button_4")!.style.display = ""; - } else { - document.getElementById("button_4")!.style.display = "none"; } + pickEmotion(1); + } + if ( + await fileExists( + `${AO_HOST}characters/${encodeURI(me.name.toLowerCase())}/custom.gif` + ) + ) { + document.getElementById("button_4")!.style.display = ""; + } else { + document.getElementById("button_4")!.style.display = "none"; } + +} diff --git a/webAO/packets/handlers/handleSP.ts b/webAO/packets/handlers/handleSP.ts index e2cad18..e176eeb 100644 --- a/webAO/packets/handlers/handleSP.ts +++ b/webAO/packets/handlers/handleSP.ts @@ -1,5 +1,4 @@ -import { updateActionCommands } from "../../client"; - +import { updateActionCommands } from '../../dom/updateActionCommands' /** * position change * @param {string} pos new position -- cgit From 1e3fde25b9f6d8adbdf087a51a34dc35cc1907d8 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Sun, 4 Sep 2022 22:30:31 +0200 Subject: undo dom stuff --- webAO/client.ts | 141 ++++++++++++++++++++++++++++++++++- webAO/dom/changeBackgroundOOC.ts | 27 ------- webAO/dom/musicListClick.ts | 21 ------ webAO/dom/musicListFilter.ts | 24 ------ webAO/dom/muteListClick.ts | 20 ----- webAO/dom/onOOCEnter.ts | 16 ---- webAO/dom/onReplayGo.ts | 9 --- webAO/dom/updateBackgroundPreview.ts | 29 ------- webAO/packets/handlers/handleBN.ts | 3 +- webAO/viewport.ts | 3 +- 10 files changed, 141 insertions(+), 152 deletions(-) delete mode 100644 webAO/dom/changeBackgroundOOC.ts delete mode 100644 webAO/dom/musicListClick.ts delete mode 100644 webAO/dom/musicListFilter.ts delete mode 100644 webAO/dom/muteListClick.ts delete mode 100644 webAO/dom/onOOCEnter.ts delete mode 100644 webAO/dom/onReplayGo.ts delete mode 100644 webAO/dom/updateBackgroundPreview.ts (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 806c0a5..33f1802 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -36,7 +36,6 @@ let { ip: serverIP, mode, asset, theme } = queryParser(); // Unless there is an asset URL specified, use the wasabi one const DEFAULT_HOST = "http://attorneyoffline.de/base/"; import { showname_click } from './dom/showNameClick' -import { onReplayGo } from './dom/onReplayGo' import { updateActionCommands } from './dom/updateActionCommands' export let AO_HOST = asset || DEFAULT_HOST; export const setAOhost = (val: string) => { @@ -139,16 +138,20 @@ function isLowMemory() { oldLoading = true; } } + const fpPromise = FingerprintJS.load(); + fpPromise .then((fp) => fp.get()) .then((result) => { hdid = result.visitorId; + console.log("NEW CLIENT"); client = new Client(serverIP); isLowMemory(); client.loadResources(); }); + export const delay = (ms: number) => new Promise((res) => setTimeout(res, ms)); let lastICMessageTime = new Date(0); @@ -950,7 +953,29 @@ class Client extends EventEmitter { } } +/** + * Triggered when the Return key is pressed on the out-of-character chat input box. + * @param {KeyboardEvent} event + */ + export function onOOCEnter(event: KeyboardEvent) { + if (event.keyCode === 13) { + client.sendOOC( + (document.getElementById("client_oocinputbox")).value + ); + (document.getElementById("client_oocinputbox")).value = + ""; + } +} +window.onOOCEnter = onOOCEnter; +/** + * Triggered when the user click replay GOOOOO + * @param {KeyboardEvent} event + */ + export function onReplayGo(_event: Event) { + client.handleReplay(); +} +window.onReplayGo = onReplayGo; /** @@ -1073,6 +1098,70 @@ export function resetICParams() { } } +/** + * Triggered when the music search bar is changed + * @param {MouseEvent} event + */ + export function musiclist_filter(_event: Event) { + const musiclist_element = ( + document.getElementById("client_musiclist") + ); + const searchname = (( + document.getElementById("client_musicsearch") + )).value; + + musiclist_element.innerHTML = ""; + + for (const trackname of client.musics) { + if (trackname.toLowerCase().indexOf(searchname.toLowerCase()) !== -1) { + const newentry = document.createElement("OPTION"); + newentry.text = trackname; + musiclist_element.options.add(newentry); + } + } +} +window.musiclist_filter = musiclist_filter; + +/** + * Triggered when an item on the music list is clicked. + * @param {MouseEvent} event + */ +export function musiclist_click(_event: Event) { + const playtrack = (( + document.getElementById("client_musiclist") + )).value; + client.sendMusicChange(playtrack); + + // This is here so you can't actually select multiple tracks, + // even though the select tag has the multiple option to render differently + const musiclist_elements = (( + document.getElementById("client_musiclist") + )).selectedOptions; + for (let i = 0; i < musiclist_elements.length; i++) { + musiclist_elements[i].selected = false; + } +} +window.musiclist_click = musiclist_click; + +/** + * Triggered when a character in the mute list is clicked + * @param {MouseEvent} event + */ +export function mutelist_click(_event: Event) { + const mutelist = document.getElementById("mute_select"); + const selected_character = mutelist.options[mutelist.selectedIndex]; + + if (client.chars[selected_character.value].muted === false) { + client.chars[selected_character.value].muted = true; + selected_character.text = `${client.chars[selected_character.value].name + } (muted)`; + console.info(`muted ${client.chars[selected_character.value].name}`); + } else { + client.chars[selected_character.value].muted = false; + selected_character.text = client.chars[selected_character.value].name; + } +} +window.mutelist_click = mutelist_click; /** * Triggered when an item on the area list is clicked. @@ -1602,9 +1691,29 @@ export function updateEvidenceIcon() { } window.updateEvidenceIcon = updateEvidenceIcon; +/** + * Change background via OOC. + */ + export function changeBackgroundOOC() { + const selectedBG = document.getElementById("bg_select"); + const changeBGCommand = "bg $1"; + const bgFilename = document.getElementById("bg_filename"); + + let filename = ""; + if (selectedBG.selectedIndex === 0) { + filename = bgFilename.value; + } else { + filename = selectedBG.value; + } - + if (mode === "join") { + client.sendOOC(`/${changeBGCommand.replace("$1", filename)}`); + } else if (mode === "replay") { + client.sendSelf(`BN#${filename}#%`); + } +} +window.changeBackgroundOOC = changeBackgroundOOC; /** * Change role via OOC. @@ -1706,6 +1815,34 @@ export function redHPP() { } window.redHPP = redHPP; +/** + * Update background preview. + */ + export function updateBackgroundPreview() { + const background_select = ( + document.getElementById("bg_select") + ); + const background_filename = ( + document.getElementById("bg_filename") + ); + const background_preview = ( + document.getElementById("bg_preview") + ); + + if (background_select.selectedIndex === 0) { + background_filename.style.display = "initial"; + background_preview.src = `${AO_HOST}background/${encodeURI( + background_filename.value.toLowerCase() + )}/defenseempty.png`; + } else { + background_filename.style.display = "none"; + background_preview.src = `${AO_HOST}background/${encodeURI( + background_select.value.toLowerCase() + )}/defenseempty.png`; + } +} +window.updateBackgroundPreview = updateBackgroundPreview; + /** * Highlights and selects a menu. * @param {number} menu the menu to be selected diff --git a/webAO/dom/changeBackgroundOOC.ts b/webAO/dom/changeBackgroundOOC.ts deleted file mode 100644 index abf3a97..0000000 --- a/webAO/dom/changeBackgroundOOC.ts +++ /dev/null @@ -1,27 +0,0 @@ -import { client } from "../client"; -import queryParser from "../utils/queryParser"; - -let { mode } = queryParser(); - -/** - * Change background via OOC. - */ -export function changeBackgroundOOC() { - const selectedBG = document.getElementById("bg_select"); - const changeBGCommand = "bg $1"; - const bgFilename = document.getElementById("bg_filename"); - - let filename = ""; - if (selectedBG.selectedIndex === 0) { - filename = bgFilename.value; - } else { - filename = selectedBG.value; - } - - if (mode === "join") { - client.sendOOC(`/${changeBGCommand.replace("$1", filename)}`); - } else if (mode === "replay") { - client.sendSelf(`BN#${filename}#%`); - } -} -window.changeBackgroundOOC = changeBackgroundOOC; \ No newline at end of file diff --git a/webAO/dom/musicListClick.ts b/webAO/dom/musicListClick.ts deleted file mode 100644 index 1eb6619..0000000 --- a/webAO/dom/musicListClick.ts +++ /dev/null @@ -1,21 +0,0 @@ -import { client } from "../client"; -/** - * Triggered when an item on the music list is clicked. - * @param {MouseEvent} event - */ -export function musiclist_click(_event: Event) { - const playtrack = (( - document.getElementById("client_musiclist") - )).value; - client.sendMusicChange(playtrack); - - // This is here so you can't actually select multiple tracks, - // even though the select tag has the multiple option to render differently - const musiclist_elements = (( - document.getElementById("client_musiclist") - )).selectedOptions; - for (let i = 0; i < musiclist_elements.length; i++) { - musiclist_elements[i].selected = false; - } -} -window.musiclist_click = musiclist_click; \ No newline at end of file diff --git a/webAO/dom/musicListFilter.ts b/webAO/dom/musicListFilter.ts deleted file mode 100644 index c44978d..0000000 --- a/webAO/dom/musicListFilter.ts +++ /dev/null @@ -1,24 +0,0 @@ -import { client } from "../client"; -/** - * Triggered when the music search bar is changed - * @param {MouseEvent} event - */ -export function musiclist_filter(_event: Event) { - const musiclist_element = ( - document.getElementById("client_musiclist") - ); - const searchname = (( - document.getElementById("client_musicsearch") - )).value; - - musiclist_element.innerHTML = ""; - - for (const trackname of client.musics) { - if (trackname.toLowerCase().indexOf(searchname.toLowerCase()) !== -1) { - const newentry = document.createElement("OPTION"); - newentry.text = trackname; - musiclist_element.options.add(newentry); - } - } -} -window.musiclist_filter = musiclist_filter; \ No newline at end of file diff --git a/webAO/dom/muteListClick.ts b/webAO/dom/muteListClick.ts deleted file mode 100644 index 6ae3eea..0000000 --- a/webAO/dom/muteListClick.ts +++ /dev/null @@ -1,20 +0,0 @@ -import { client } from "../client"; -/** - * Triggered when a character in the mute list is clicked - * @param {MouseEvent} event - */ -export function mutelist_click(_event: Event) { - const mutelist = document.getElementById("mute_select"); - const selected_character = mutelist.options[mutelist.selectedIndex]; - - if (client.chars[selected_character.value].muted === false) { - client.chars[selected_character.value].muted = true; - selected_character.text = `${client.chars[selected_character.value].name - } (muted)`; - console.info(`muted ${client.chars[selected_character.value].name}`); - } else { - client.chars[selected_character.value].muted = false; - selected_character.text = client.chars[selected_character.value].name; - } -} -window.mutelist_click = mutelist_click; \ No newline at end of file diff --git a/webAO/dom/onOOCEnter.ts b/webAO/dom/onOOCEnter.ts deleted file mode 100644 index a24928b..0000000 --- a/webAO/dom/onOOCEnter.ts +++ /dev/null @@ -1,16 +0,0 @@ -import {client} from '../client' -/** - * Triggered when the Return key is pressed on the out-of-character chat input box. - * @param {KeyboardEvent} event - */ - export function onOOCEnter(event: KeyboardEvent) { - if (event.keyCode === 13) { - client.sendOOC( - (document.getElementById("client_oocinputbox")).value - ); - (document.getElementById("client_oocinputbox")).value = - ""; - } - } - window.onOOCEnter = onOOCEnter; - \ No newline at end of file diff --git a/webAO/dom/onReplayGo.ts b/webAO/dom/onReplayGo.ts deleted file mode 100644 index c13a8e6..0000000 --- a/webAO/dom/onReplayGo.ts +++ /dev/null @@ -1,9 +0,0 @@ -import { client } from "../client"; -/** - * Triggered when the user click replay GOOOOO - * @param {KeyboardEvent} event - */ - export function onReplayGo(_event: Event) { - client.handleReplay(); - } - window.onReplayGo = onReplayGo; \ No newline at end of file diff --git a/webAO/dom/updateBackgroundPreview.ts b/webAO/dom/updateBackgroundPreview.ts deleted file mode 100644 index e55bf60..0000000 --- a/webAO/dom/updateBackgroundPreview.ts +++ /dev/null @@ -1,29 +0,0 @@ -import { AO_HOST } from "../client"; - -/** - * Update background preview. - */ -export function updateBackgroundPreview() { - const background_select = ( - document.getElementById("bg_select") - ); - const background_filename = ( - document.getElementById("bg_filename") - ); - const background_preview = ( - document.getElementById("bg_preview") - ); - - if (background_select.selectedIndex === 0) { - background_filename.style.display = "initial"; - background_preview.src = `${AO_HOST}background/${encodeURI( - background_filename.value.toLowerCase() - )}/defenseempty.png`; - } else { - background_filename.style.display = "none"; - background_preview.src = `${AO_HOST}background/${encodeURI( - background_select.value.toLowerCase() - )}/defenseempty.png`; - } -} -window.updateBackgroundPreview = updateBackgroundPreview; \ No newline at end of file diff --git a/webAO/packets/handlers/handleBN.ts b/webAO/packets/handlers/handleBN.ts index 9dabc15..f7b8447 100644 --- a/webAO/packets/handlers/handleBN.ts +++ b/webAO/packets/handlers/handleBN.ts @@ -1,7 +1,6 @@ -import { AO_HOST, client, getIndexFromSelect } from "../../client"; +import { AO_HOST, client, getIndexFromSelect, updateBackgroundPreview } from "../../client"; import { safeTags } from "../../encoding"; import tryUrls from "../../utils/tryUrls"; -import { updateBackgroundPreview } from '../../dom/updateBackgroundPreview' /** * Handles a background change. diff --git a/webAO/viewport.ts b/webAO/viewport.ts index 58186a0..e6b8d00 100644 --- a/webAO/viewport.ts +++ b/webAO/viewport.ts @@ -1,7 +1,6 @@ import tryUrls from "./utils/tryUrls"; import fileExists from "./utils/fileExists"; -import Client, { opusCheck } from "./client"; -import { delay } from "./client"; +import Client, { opusCheck, delay } from "./client"; import { UPDATE_INTERVAL } from "./client"; import { setChatbox } from "./client"; import { resizeChatbox } from "./client"; -- cgit From ce708f69ed7878422a6a6371e44faed6857cb79a Mon Sep 17 00:00:00 2001 From: Caleb Date: Sun, 4 Sep 2022 20:22:35 -0400 Subject: Fix AO Host --- webAO/client.ts | 5 +---- webAO/client/aoHost.js | 5 ----- webAO/client/aoHost.ts | 7 +++++++ webAO/components/blip.js | 2 +- webAO/dom/resetOffset.ts | 9 +++++---- webAO/packets/handlers/handleASS.ts | 2 +- webAO/packets/handlers/handleBN.ts | 4 +++- webAO/packets/handlers/handleEI.ts | 3 ++- webAO/packets/handlers/handleLE.ts | 3 ++- webAO/packets/handlers/handleMC.ts | 3 ++- webAO/packets/handlers/handlePV.ts | 3 ++- webAO/packets/handlers/handleZZ.ts | 3 ++- webAO/viewport.ts | 2 +- 13 files changed, 29 insertions(+), 22 deletions(-) delete mode 100644 webAO/client/aoHost.js create mode 100644 webAO/client/aoHost.ts (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 33f1802..5d5eb2c 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -37,10 +37,7 @@ let { ip: serverIP, mode, asset, theme } = queryParser(); const DEFAULT_HOST = "http://attorneyoffline.de/base/"; import { showname_click } from './dom/showNameClick' import { updateActionCommands } from './dom/updateActionCommands' -export let AO_HOST = asset || DEFAULT_HOST; -export const setAOhost = (val: string) => { - AO_HOST = val -} +import { AO_HOST } from './client/aoHost' let THEME: string = theme || "default"; let CHATBOX: string; diff --git a/webAO/client/aoHost.js b/webAO/client/aoHost.js deleted file mode 100644 index b387608..0000000 --- a/webAO/client/aoHost.js +++ /dev/null @@ -1,5 +0,0 @@ -import queryParser from '../utils/queryParser' -let { asset } = queryParser(); -const DEFAULT_HOST = 'http://attorneyoffline.de/base/'; -const AO_HOST = asset || DEFAULT_HOST -export default AO_HOST diff --git a/webAO/client/aoHost.ts b/webAO/client/aoHost.ts new file mode 100644 index 0000000..9b0a768 --- /dev/null +++ b/webAO/client/aoHost.ts @@ -0,0 +1,7 @@ +import queryParser from '../utils/queryParser' +let { asset } = queryParser(); +const DEFAULT_HOST = 'http://attorneyoffline.de/base/'; +export let AO_HOST = asset || DEFAULT_HOST +export const setAOhost = (val: string) => { + AO_HOST = val +} diff --git a/webAO/components/blip.js b/webAO/components/blip.js index eacbeaf..db6a784 100644 --- a/webAO/components/blip.js +++ b/webAO/components/blip.js @@ -1,4 +1,4 @@ -import AO_HOST from '../client/aoHost' +import { AO_HOST } from '../client/aoHost' /** * diff --git a/webAO/dom/resetOffset.ts b/webAO/dom/resetOffset.ts index 2cf8197..86dfd5b 100644 --- a/webAO/dom/resetOffset.ts +++ b/webAO/dom/resetOffset.ts @@ -1,5 +1,6 @@ + export function resetOffset(_event: Event) { - (document.getElementById("pair_offset")).value = "0"; - (document.getElementById("pair_y_offset")).value = "0"; - } - window.resetOffset = resetOffset; \ No newline at end of file + (document.getElementById("pair_offset")).value = "0"; + (document.getElementById("pair_y_offset")).value = "0"; +} +window.resetOffset = resetOffset; \ No newline at end of file diff --git a/webAO/packets/handlers/handleASS.ts b/webAO/packets/handlers/handleASS.ts index d0dfbd5..ea8a0d3 100644 --- a/webAO/packets/handlers/handleASS.ts +++ b/webAO/packets/handlers/handleASS.ts @@ -1,4 +1,4 @@ -import { setAOhost } from "../../client"; +import { setAOhost } from "../../client/aoHost"; /** diff --git a/webAO/packets/handlers/handleBN.ts b/webAO/packets/handlers/handleBN.ts index f7b8447..067130d 100644 --- a/webAO/packets/handlers/handleBN.ts +++ b/webAO/packets/handlers/handleBN.ts @@ -1,7 +1,9 @@ -import { AO_HOST, client, getIndexFromSelect, updateBackgroundPreview } from "../../client"; +import { client, getIndexFromSelect, updateBackgroundPreview } from "../../client"; +import { AO_HOST } from "../../client/aoHost"; import { safeTags } from "../../encoding"; import tryUrls from "../../utils/tryUrls"; + /** * Handles a background change. * @param {Array} args packet arguments diff --git a/webAO/packets/handlers/handleEI.ts b/webAO/packets/handlers/handleEI.ts index e96f0c9..c74e4d4 100644 --- a/webAO/packets/handlers/handleEI.ts +++ b/webAO/packets/handlers/handleEI.ts @@ -1,4 +1,5 @@ -import { AO_HOST, client } from '../../client' +import { client } from '../../client' +import { AO_HOST } from '../../client/aoHost'; import { prepChat, safeTags } from '../../encoding'; /** diff --git a/webAO/packets/handlers/handleLE.ts b/webAO/packets/handlers/handleLE.ts index 28f0b40..1eaeb27 100644 --- a/webAO/packets/handlers/handleLE.ts +++ b/webAO/packets/handlers/handleLE.ts @@ -1,4 +1,5 @@ -import { AO_HOST, client } from '../../client' +import { client } from '../../client' +import { AO_HOST } from '../../client/aoHost'; import { prepChat, safeTags } from '../../encoding'; /** diff --git a/webAO/packets/handlers/handleMC.ts b/webAO/packets/handlers/handleMC.ts index 28254ba..bf60eb9 100644 --- a/webAO/packets/handlers/handleMC.ts +++ b/webAO/packets/handlers/handleMC.ts @@ -1,5 +1,6 @@ import { prepChat } from "../../encoding"; -import { AO_HOST, appendICLog, client } from '../../client' +import { appendICLog, client } from '../../client' +import { AO_HOST } from "../../client/aoHost"; /** * Handles a music change to an arbitrary resource. diff --git a/webAO/packets/handlers/handlePV.ts b/webAO/packets/handlers/handlePV.ts index 5bdb702..fba2a3c 100644 --- a/webAO/packets/handlers/handlePV.ts +++ b/webAO/packets/handlers/handlePV.ts @@ -1,6 +1,7 @@ -import { AO_HOST, client, pickEmotion } from "../../client"; +import { client, pickEmotion } from "../../client"; import fileExists from "../../utils/fileExists"; import { updateActionCommands } from '../../dom/updateActionCommands' +import { AO_HOST } from "../../client/aoHost"; /** * Handles the server's assignment of a character for the player to use. diff --git a/webAO/packets/handlers/handleZZ.ts b/webAO/packets/handlers/handleZZ.ts index 1a56e49..1c1cb1d 100644 --- a/webAO/packets/handlers/handleZZ.ts +++ b/webAO/packets/handlers/handleZZ.ts @@ -1,4 +1,5 @@ -import { AO_HOST, client } from "../../client"; +import { client } from "../../client"; +import { AO_HOST } from "../../client/aoHost"; import { prepChat } from "../../encoding"; diff --git a/webAO/viewport.ts b/webAO/viewport.ts index e6b8d00..f647d86 100644 --- a/webAO/viewport.ts +++ b/webAO/viewport.ts @@ -12,7 +12,7 @@ import setEmote from "./client/setEmote"; import getAnimLength from "./utils/getAnimLength"; import { safeTags } from "./encoding"; import setCookie from "./utils/setCookie"; -import { AO_HOST } from "./client"; +import { AO_HOST } from "./client/aoHost"; interface ChatMsg { content: string; objection: number; -- cgit From fb3590ad774a07f45eaaaeb2b443ae264c302f3b Mon Sep 17 00:00:00 2001 From: Caleb Date: Sun, 4 Sep 2022 20:45:52 -0400 Subject: Prep folder with example --- webAO/client.ts | 20 -------------------- webAO/dom/musicListClick.ts | 21 +++++++++++++++++++++ webAO/index.ts | 0 3 files changed, 21 insertions(+), 20 deletions(-) create mode 100644 webAO/dom/musicListClick.ts create mode 100644 webAO/index.ts (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 5d5eb2c..3bf8854 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -1119,26 +1119,6 @@ export function resetICParams() { } window.musiclist_filter = musiclist_filter; -/** - * Triggered when an item on the music list is clicked. - * @param {MouseEvent} event - */ -export function musiclist_click(_event: Event) { - const playtrack = (( - document.getElementById("client_musiclist") - )).value; - client.sendMusicChange(playtrack); - - // This is here so you can't actually select multiple tracks, - // even though the select tag has the multiple option to render differently - const musiclist_elements = (( - document.getElementById("client_musiclist") - )).selectedOptions; - for (let i = 0; i < musiclist_elements.length; i++) { - musiclist_elements[i].selected = false; - } -} -window.musiclist_click = musiclist_click; /** * Triggered when a character in the mute list is clicked diff --git a/webAO/dom/musicListClick.ts b/webAO/dom/musicListClick.ts new file mode 100644 index 0000000..8fd3be5 --- /dev/null +++ b/webAO/dom/musicListClick.ts @@ -0,0 +1,21 @@ +import { client } from "../client"; +/** + * Triggered when an item on the music list is clicked. + * @param {MouseEvent} event + */ +export function musiclist_click(_event: Event) { + const playtrack = (( + document.getElementById("client_musiclist") + )).value; + client.sendMusicChange(playtrack); + + // This is here so you can't actually select multiple tracks, + // even though the select tag has the multiple option to render differently + const musiclist_elements = (( + document.getElementById("client_musiclist") + )).selectedOptions; + for (let i = 0; i < musiclist_elements.length; i++) { + musiclist_elements[i].selected = false; + } +} +window.musiclist_click = musiclist_click; diff --git a/webAO/index.ts b/webAO/index.ts new file mode 100644 index 0000000..e69de29 -- cgit From 34aba3b5b9572b707971d1fda9216ebcf91909ba Mon Sep 17 00:00:00 2001 From: Caleb Date: Mon, 5 Sep 2022 21:47:38 -0400 Subject: Moving some functions --- webAO/client.ts | 178 ++++++------------------------------------------ webAO/dom/areaClick.ts | 15 ++++ webAO/dom/onEnter.ts | 103 ++++++++++++++++++++++++++++ webAO/dom/onOOCEnter.ts | 16 +++++ webAO/dom/onReplayGo.ts | 10 +++ 5 files changed, 163 insertions(+), 159 deletions(-) create mode 100644 webAO/dom/areaClick.ts create mode 100644 webAO/dom/onEnter.ts create mode 100644 webAO/dom/onOOCEnter.ts create mode 100644 webAO/dom/onReplayGo.ts (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 3bf8854..d57f437 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -6,11 +6,10 @@ import FingerprintJS from "@fingerprintjs/fingerprintjs"; import { EventEmitter } from "events"; -import tryUrls from "./utils/tryUrls"; +import { area_click } from './dom/areaClick' +import { onReplayGo } from './dom/onReplayGo' import { escapeChat, prepChat, safeTags, unescapeChat } from "./encoding"; // Load some defaults for the background and evidence dropdowns -import vanilla_character_arr from "./constants/characters.js"; -import vanilla_music_arr from "./constants/music.js"; import vanilla_background_arr from "./constants/backgrounds.js"; import vanilla_evidence_arr from "./constants/evidence.js"; import chatbox_arr from "./styles/chatbox/chatboxes.js"; @@ -34,10 +33,9 @@ import masterViewport, { Viewport } from "./viewport"; import { packetHandler } from './packets/packetHandler' let { ip: serverIP, mode, asset, theme } = queryParser(); // Unless there is an asset URL specified, use the wasabi one -const DEFAULT_HOST = "http://attorneyoffline.de/base/"; import { showname_click } from './dom/showNameClick' import { updateActionCommands } from './dom/updateActionCommands' -import { AO_HOST } from './client/aoHost' +import { AO_HOST } from './client/aoHost' let THEME: string = theme || "default"; let CHATBOX: string; @@ -57,7 +55,7 @@ export const setOldLoading = (val: boolean) => { // presettings let selectedMenu = 1; -let selectedShout = 0; +export let selectedShout = 0; export let extrafeatures: string[] = []; export const setExtraFeatures = (val: any) => { @@ -950,131 +948,6 @@ class Client extends EventEmitter { } } -/** - * Triggered when the Return key is pressed on the out-of-character chat input box. - * @param {KeyboardEvent} event - */ - export function onOOCEnter(event: KeyboardEvent) { - if (event.keyCode === 13) { - client.sendOOC( - (document.getElementById("client_oocinputbox")).value - ); - (document.getElementById("client_oocinputbox")).value = - ""; - } -} -window.onOOCEnter = onOOCEnter; - -/** - * Triggered when the user click replay GOOOOO - * @param {KeyboardEvent} event - */ - export function onReplayGo(_event: Event) { - client.handleReplay(); -} -window.onReplayGo = onReplayGo; - - -/** - * Triggered when the Return key is pressed on the in-character chat input box. - * @param {KeyboardEvent} event - */ -export function onEnter(event: KeyboardEvent) { - if (event.keyCode === 13) { - const mychar = client.character; - const myemo = client.emote; - const evi = client.evidence; - const flip = Boolean( - document.getElementById("button_flip").classList.contains("dark") - ); - const flash = Boolean( - document.getElementById("button_flash").classList.contains("dark") - ); - const screenshake = Boolean( - document.getElementById("button_shake").classList.contains("dark") - ); - const noninterrupting_preanim = Boolean( - (document.getElementById("check_nonint")).checked - ); - const looping_sfx = Boolean( - (document.getElementById("check_loopsfx")).checked - ); - const color = Number( - (document.getElementById("textcolor")).value - ); - const showname = escapeChat( - (document.getElementById("ic_chat_name")).value - ); - const text = (document.getElementById("client_inputbox")) - .value; - const pairchar = (document.getElementById("pair_select")) - .value; - const pairoffset = Number( - (document.getElementById("pair_offset")).value - ); - const pairyoffset = Number( - (document.getElementById("pair_y_offset")).value - ); - const myrole = (document.getElementById("role_select")) - .value - ? (document.getElementById("role_select")).value - : mychar.side; - const additive = Boolean( - (document.getElementById("check_additive")).checked - ); - const effect = (document.getElementById("effect_select")) - .value; - - let sfxname = "0"; - let sfxdelay = 0; - let emote_mod = myemo.zoom; - if ((document.getElementById("sendsfx")).checked) { - sfxname = myemo.sfx; - sfxdelay = myemo.sfxdelay; - } - - // not to overwrite a 5 from the ini or anything else - if ((document.getElementById("sendpreanim")).checked) { - if (emote_mod === 0) { - emote_mod = 1; - } - } else if (emote_mod === 1) { - emote_mod = 0; - } - - client.sendIC( - myemo.deskmod, - myemo.preanim, - mychar.name, - myemo.emote, - text, - myrole, - sfxname, - emote_mod, - sfxdelay, - selectedShout, - evi, - flip, - flash, - color, - showname, - pairchar, - pairoffset, - pairyoffset, - noninterrupting_preanim, - looping_sfx, - screenshake, - "-", - "-", - "-", - additive, - effect - ); - } - return false; -} -window.onEnter = onEnter; - /** * Resets the IC parameters for the player to enter a new chat message. * This should only be called when the player's previous chat message @@ -1099,7 +972,7 @@ export function resetICParams() { * Triggered when the music search bar is changed * @param {MouseEvent} event */ - export function musiclist_filter(_event: Event) { +export function musiclist_filter(_event: Event) { const musiclist_element = ( document.getElementById("client_musiclist") ); @@ -1140,20 +1013,7 @@ export function mutelist_click(_event: Event) { } window.mutelist_click = mutelist_click; -/** - * Triggered when an item on the area list is clicked. - * @param {HTMLElement} el - */ -export function area_click(el: HTMLElement) { - const area = client.areas[el.id.substr(4)].name; - client.sendMusicChange(area); - - const areaHr = document.createElement("div"); - areaHr.className = "hrtext"; - areaHr.textContent = `switched to ${el.textContent}`; - document.getElementById("client_log").appendChild(areaHr); -} -window.area_click = area_click; + /** * Triggered by a changed callword list @@ -1671,7 +1531,7 @@ window.updateEvidenceIcon = updateEvidenceIcon; /** * Change background via OOC. */ - export function changeBackgroundOOC() { +export function changeBackgroundOOC() { const selectedBG = document.getElementById("bg_select"); const changeBGCommand = "bg $1"; const bgFilename = document.getElementById("bg_filename"); @@ -1795,27 +1655,27 @@ window.redHPP = redHPP; /** * Update background preview. */ - export function updateBackgroundPreview() { +export function updateBackgroundPreview() { const background_select = ( - document.getElementById("bg_select") + document.getElementById("bg_select") ); const background_filename = ( - document.getElementById("bg_filename") + document.getElementById("bg_filename") ); const background_preview = ( - document.getElementById("bg_preview") + document.getElementById("bg_preview") ); if (background_select.selectedIndex === 0) { - background_filename.style.display = "initial"; - background_preview.src = `${AO_HOST}background/${encodeURI( - background_filename.value.toLowerCase() - )}/defenseempty.png`; + background_filename.style.display = "initial"; + background_preview.src = `${AO_HOST}background/${encodeURI( + background_filename.value.toLowerCase() + )}/defenseempty.png`; } else { - background_filename.style.display = "none"; - background_preview.src = `${AO_HOST}background/${encodeURI( - background_select.value.toLowerCase() - )}/defenseempty.png`; + background_filename.style.display = "none"; + background_preview.src = `${AO_HOST}background/${encodeURI( + background_select.value.toLowerCase() + )}/defenseempty.png`; } } window.updateBackgroundPreview = updateBackgroundPreview; diff --git a/webAO/dom/areaClick.ts b/webAO/dom/areaClick.ts new file mode 100644 index 0000000..6c3ff6b --- /dev/null +++ b/webAO/dom/areaClick.ts @@ -0,0 +1,15 @@ +import { client } from '../client' +/** + * Triggered when an item on the area list is clicked. + * @param {HTMLElement} el + */ +export function area_click(el: HTMLElement) { + const area = client.areas[el.id.substr(4)].name; + client.sendMusicChange(area); + + const areaHr = document.createElement("div"); + areaHr.className = "hrtext"; + areaHr.textContent = `switched to ${el.textContent}`; + document.getElementById("client_log")!.appendChild(areaHr); +} +window.area_click = area_click; \ No newline at end of file diff --git a/webAO/dom/onEnter.ts b/webAO/dom/onEnter.ts new file mode 100644 index 0000000..01fbbd5 --- /dev/null +++ b/webAO/dom/onEnter.ts @@ -0,0 +1,103 @@ +import { client, selectedShout } from "../client"; +import { escapeChat } from "../encoding"; + + +/** + * Triggered when the Return key is pressed on the in-character chat input box. + * @param {KeyboardEvent} event + */ + export function onEnter(event: KeyboardEvent) { + if (event.keyCode === 13) { + const mychar = client.character; + const myemo = client.emote; + const evi = client.evidence; + const flip = Boolean( + document.getElementById("button_flip")!.classList.contains("dark") + ); + const flash = Boolean( + document.getElementById("button_flash")!.classList.contains("dark") + ); + const screenshake = Boolean( + document.getElementById("button_shake")!.classList.contains("dark") + ); + const noninterrupting_preanim = Boolean( + (document.getElementById("check_nonint")).checked + ); + const looping_sfx = Boolean( + (document.getElementById("check_loopsfx")).checked + ); + const color = Number( + (document.getElementById("textcolor")).value + ); + const showname = escapeChat( + (document.getElementById("ic_chat_name")).value + ); + const text = (document.getElementById("client_inputbox")) + .value; + const pairchar = (document.getElementById("pair_select")) + .value; + const pairoffset = Number( + (document.getElementById("pair_offset")).value + ); + const pairyoffset = Number( + (document.getElementById("pair_y_offset")).value + ); + const myrole = (document.getElementById("role_select")) + .value + ? (document.getElementById("role_select")).value + : mychar.side; + const additive = Boolean( + (document.getElementById("check_additive")).checked + ); + const effect = (document.getElementById("effect_select")) + .value; + + let sfxname = "0"; + let sfxdelay = 0; + let emote_mod = myemo.zoom; + if ((document.getElementById("sendsfx")).checked) { + sfxname = myemo.sfx; + sfxdelay = myemo.sfxdelay; + } + + // not to overwrite a 5 from the ini or anything else + if ((document.getElementById("sendpreanim")).checked) { + if (emote_mod === 0) { + emote_mod = 1; + } + } else if (emote_mod === 1) { + emote_mod = 0; + } + + client.sendIC( + myemo.deskmod, + myemo.preanim, + mychar.name, + myemo.emote, + text, + myrole, + sfxname, + emote_mod, + sfxdelay, + selectedShout, + evi, + flip, + flash, + color, + showname, + pairchar, + pairoffset, + pairyoffset, + noninterrupting_preanim, + looping_sfx, + screenshake, + "-", + "-", + "-", + additive, + effect + ); + } + return false; + } + window.onEnter = onEnter; \ No newline at end of file diff --git a/webAO/dom/onOOCEnter.ts b/webAO/dom/onOOCEnter.ts new file mode 100644 index 0000000..a6bde4c --- /dev/null +++ b/webAO/dom/onOOCEnter.ts @@ -0,0 +1,16 @@ +import { client } from "../client"; +/** + * Triggered when the Return key is pressed on the out-of-character chat input box. + * @param {KeyboardEvent} event + */ +export function onOOCEnter(event: KeyboardEvent) { + console.log('FUCK') + if (event.keyCode === 13) { + client.sendOOC( + (document.getElementById("client_oocinputbox")).value + ); + (document.getElementById("client_oocinputbox")).value = + ""; + } +} +window.onOOCEnter = onOOCEnter; diff --git a/webAO/dom/onReplayGo.ts b/webAO/dom/onReplayGo.ts new file mode 100644 index 0000000..82a6f2f --- /dev/null +++ b/webAO/dom/onReplayGo.ts @@ -0,0 +1,10 @@ +import { client } from "../client"; + +/** + * Triggered when the user click replay GOOOOO + * @param {KeyboardEvent} event + */ +export function onReplayGo(_event: Event) { + client.handleReplay(); +} +window.onReplayGo = onReplayGo; \ No newline at end of file -- cgit From ccec95a9d3b68e25e24a9168400fc47099a85c81 Mon Sep 17 00:00:00 2001 From: Caleb Date: Tue, 6 Sep 2022 21:55:10 -0400 Subject: More window functions --- webAO/client.ts | 238 +---------------------------------- webAO/dom/cancelEvidence.ts | 35 ++++++ webAO/dom/musicListFilter.ts | 24 ++++ webAO/dom/opusCheck.ts | 22 ++++ webAO/dom/pickEvidence.ts | 48 +++++++ webAO/dom/resizeChatbox.ts | 33 +++++ webAO/dom/toggleShout.ts | 22 ++++ webAO/dom/updateBackgroundPreview.ts | 28 +++++ webAO/packets/handlers/handleBN.ts | 3 +- webAO/viewport.ts | 5 +- 10 files changed, 222 insertions(+), 236 deletions(-) create mode 100644 webAO/dom/cancelEvidence.ts create mode 100644 webAO/dom/musicListFilter.ts create mode 100644 webAO/dom/opusCheck.ts create mode 100644 webAO/dom/pickEvidence.ts create mode 100644 webAO/dom/resizeChatbox.ts create mode 100644 webAO/dom/toggleShout.ts create mode 100644 webAO/dom/updateBackgroundPreview.ts (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index d57f437..321872f 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -32,12 +32,13 @@ const version = process.env.npm_package_version; import masterViewport, { Viewport } from "./viewport"; import { packetHandler } from './packets/packetHandler' let { ip: serverIP, mode, asset, theme } = queryParser(); +import { cancelEvidence } from './dom/cancelEvidence' // Unless there is an asset URL specified, use the wasabi one import { showname_click } from './dom/showNameClick' import { updateActionCommands } from './dom/updateActionCommands' import { AO_HOST } from './client/aoHost' let THEME: string = theme || "default"; -let CHATBOX: string; +export let CHATBOX: string; export let client: Client; @@ -56,7 +57,9 @@ export const setOldLoading = (val: boolean) => { // presettings let selectedMenu = 1; export let selectedShout = 0; - +export const setSelectedShout = (val: number) => { + selectedShout = val +} export let extrafeatures: string[] = []; export const setExtraFeatures = (val: any) => { extrafeatures = val @@ -795,12 +798,6 @@ class Client extends EventEmitter { } } - - - - - - resetMusicList() { this.musics = []; document.getElementById("client_musiclist").innerHTML = ""; @@ -968,53 +965,6 @@ export function resetICParams() { } } -/** - * Triggered when the music search bar is changed - * @param {MouseEvent} event - */ -export function musiclist_filter(_event: Event) { - const musiclist_element = ( - document.getElementById("client_musiclist") - ); - const searchname = (( - document.getElementById("client_musicsearch") - )).value; - - musiclist_element.innerHTML = ""; - - for (const trackname of client.musics) { - if (trackname.toLowerCase().indexOf(searchname.toLowerCase()) !== -1) { - const newentry = document.createElement("OPTION"); - newentry.text = trackname; - musiclist_element.options.add(newentry); - } - } -} -window.musiclist_filter = musiclist_filter; - - -/** - * Triggered when a character in the mute list is clicked - * @param {MouseEvent} event - */ -export function mutelist_click(_event: Event) { - const mutelist = document.getElementById("mute_select"); - const selected_character = mutelist.options[mutelist.selectedIndex]; - - if (client.chars[selected_character.value].muted === false) { - client.chars[selected_character.value].muted = true; - selected_character.text = `${client.chars[selected_character.value].name - } (muted)`; - console.info(`muted ${client.chars[selected_character.value].name}`); - } else { - client.chars[selected_character.value].muted = false; - selected_character.text = client.chars[selected_character.value].name; - } -} -window.mutelist_click = mutelist_click; - - - /** * Triggered by a changed callword list */ @@ -1134,29 +1084,6 @@ export function imgError(image: HTMLImageElement) { } window.imgError = imgError; -/** - * Triggered when there was an error loading a sound - * @param {HTMLAudioElement} image the element containing the missing sound - */ -export function opusCheck( - channel: HTMLAudioElement -): OnErrorEventHandlerNonNull { - const audio = channel.src; - if (audio === "") { - return; - } - console.info(`failed to load sound ${channel.src}`); - let oldsrc = ""; - let newsrc = ""; - oldsrc = channel.src; - if (!oldsrc.endsWith(".opus")) { - newsrc = oldsrc.replace(".mp3", ".opus"); - newsrc = newsrc.replace(".wav", ".opus"); - channel.src = newsrc; // unload so the old sprite doesn't persist - } -} -window.opusCheck = opusCheck; - /** * Triggered when the reconnect button is pushed. */ @@ -1298,52 +1225,6 @@ export function pickEmotion(emo: number) { } window.pickEmotion = pickEmotion; -/** - * Highlights and selects an evidence for in-character chat. - * @param {string} evidence the evidence to be presented - */ -export function pickEvidence(evidence: number) { - if (client.selectedEvidence !== evidence) { - // Update selected evidence - if (client.selectedEvidence > 0) { - document.getElementById(`evi_${client.selectedEvidence}`).className = - "evi_icon"; - } - document.getElementById(`evi_${evidence}`).className = "evi_icon dark"; - client.selectedEvidence = evidence; - - // Show evidence on information window - (document.getElementById("evi_name")).value = - client.evidences[evidence - 1].name; - (document.getElementById("evi_desc")).value = - client.evidences[evidence - 1].desc; - - // Update icon - const icon_id = getIndexFromSelect( - "evi_select", - client.evidences[evidence - 1].filename - ); - (document.getElementById("evi_select")).selectedIndex = - icon_id; - if (icon_id === 0) { - (document.getElementById("evi_filename")).value = - client.evidences[evidence - 1].filename; - } - updateEvidenceIcon(); - - // Update button - document.getElementById("evi_add").className = - "client_button hover_button inactive"; - document.getElementById("evi_edit").className = - "client_button hover_button"; - document.getElementById("evi_cancel").className = - "client_button hover_button"; - document.getElementById("evi_del").className = "client_button hover_button"; - } else { - cancelEvidence(); - } -} -window.pickEvidence = pickEvidence; /** * Add evidence. @@ -1393,37 +1274,6 @@ export function deleteEvidence() { } window.deleteEvidence = deleteEvidence; -/** - * Cancel evidence selection. - */ -export function cancelEvidence() { - // Clear evidence data - if (client.selectedEvidence > 0) { - document.getElementById(`evi_${client.selectedEvidence}`).className = - "evi_icon"; - } - client.selectedEvidence = 0; - - // Clear evidence on information window - (document.getElementById("evi_select")).selectedIndex = 0; - updateEvidenceIcon(); // Update icon widget - (document.getElementById("evi_filename")).value = ""; - (document.getElementById("evi_name")).value = ""; - (document.getElementById("evi_desc")).value = ""; - (( - document.getElementById("evi_preview") - )).src = `${AO_HOST}misc/empty.png`; // Clear icon - - // Update button - document.getElementById("evi_add").className = "client_button hover_button"; - document.getElementById("evi_edit").className = - "client_button hover_button inactive"; - document.getElementById("evi_cancel").className = - "client_button hover_button inactive"; - document.getElementById("evi_del").className = - "client_button hover_button inactive"; -} -window.cancelEvidence = cancelEvidence; /** * Find index of anything in select box. @@ -1467,38 +1317,7 @@ export function setChatbox(style: string) { } 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.0521).toFixed(1)}px`; - - const trackstatus = (document.getElementById("client_trackstatustext")); - trackstatus.width = (trackstatus.offsetWidth - 1) + "px"; - - - //clock - const now = new Date(); - let weekday = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"]; - const month = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]; - document.getElementById("client_clock_month").innerText = month[now.getMonth()]; - console.debug(CHATBOX); - if (CHATBOX == "acww") { - weekday = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"]; - document.getElementById("client_clock_weekday").innerText = weekday[now.getDay()]; - document.getElementById("client_clock_date").innerText = now.getDay() + "/" + now.getMonth(); - document.getElementById("client_clock_time").innerText = now.getHours() + ":" + now.getMinutes(); - } else if (CHATBOX == "key") { - weekday = ["Sun.", "Mon.", "Tue.", "Wed.", "Thu.", "Fri.", "Sat."]; - document.getElementById("client_clock_weekday").innerText = weekday[now.getDay()]; - document.getElementById("client_clock_date").innerText = String(now.getDay()); - } -} -window.resizeChatbox = resizeChatbox; /** * Update evidence icon. @@ -1652,33 +1471,6 @@ export function redHPP() { } window.redHPP = redHPP; -/** - * Update background preview. - */ -export function updateBackgroundPreview() { - const background_select = ( - document.getElementById("bg_select") - ); - const background_filename = ( - document.getElementById("bg_filename") - ); - const background_preview = ( - document.getElementById("bg_preview") - ); - - if (background_select.selectedIndex === 0) { - background_filename.style.display = "initial"; - background_preview.src = `${AO_HOST}background/${encodeURI( - background_filename.value.toLowerCase() - )}/defenseempty.png`; - } else { - background_filename.style.display = "none"; - background_preview.src = `${AO_HOST}background/${encodeURI( - background_select.value.toLowerCase() - )}/defenseempty.png`; - } -} -window.updateBackgroundPreview = updateBackgroundPreview; /** * Highlights and selects a menu. @@ -1697,24 +1489,4 @@ export function toggleMenu(menu: number) { } window.toggleMenu = toggleMenu; -/** - * Highlights and selects a shout for in-character chat. - * If the same shout button is selected, then the shout is canceled. - * @param {number} shout the new shout to be selected - */ -export function toggleShout(shout: number) { - if (shout === selectedShout) { - document.getElementById(`button_${shout}`).className = "client_button"; - selectedShout = 0; - } else { - document.getElementById(`button_${shout}`).className = "client_button dark"; - if (selectedShout) { - document.getElementById(`button_${selectedShout}`).className = - "client_button"; - } - selectedShout = shout; - } -} -window.toggleShout = toggleShout; - export default Client; diff --git a/webAO/dom/cancelEvidence.ts b/webAO/dom/cancelEvidence.ts new file mode 100644 index 0000000..6565288 --- /dev/null +++ b/webAO/dom/cancelEvidence.ts @@ -0,0 +1,35 @@ +import { client, updateEvidenceIcon } from "../client"; +import { AO_HOST } from "../client/aoHost"; + + +/** + * Cancel evidence selection. + */ +export function cancelEvidence() { + // Clear evidence data + if (client.selectedEvidence > 0) { + document.getElementById(`evi_${client.selectedEvidence}`)!.className = + "evi_icon"; + } + client.selectedEvidence = 0; + + // Clear evidence on information window + (document.getElementById("evi_select")).selectedIndex = 0; + updateEvidenceIcon(); // Update icon widget + (document.getElementById("evi_filename")).value = ""; + (document.getElementById("evi_name")).value = ""; + (document.getElementById("evi_desc")).value = ""; + (( + document.getElementById("evi_preview") + )).src = `${AO_HOST}misc/empty.png`; // Clear icon + + // Update button + document.getElementById("evi_add")!.className = "client_button hover_button"; + document.getElementById("evi_edit")!.className = + "client_button hover_button inactive"; + document.getElementById("evi_cancel")!.className = + "client_button hover_button inactive"; + document.getElementById("evi_del")!.className = + "client_button hover_button inactive"; +} +window.cancelEvidence = cancelEvidence; \ No newline at end of file diff --git a/webAO/dom/musicListFilter.ts b/webAO/dom/musicListFilter.ts new file mode 100644 index 0000000..3db7fcd --- /dev/null +++ b/webAO/dom/musicListFilter.ts @@ -0,0 +1,24 @@ +import { client } from '../client' +/** + * Triggered when the music search bar is changed + * @param {MouseEvent} event + */ +export function musiclist_filter(_event: Event) { + const musiclist_element = ( + document.getElementById("client_musiclist") + ); + const searchname = (( + document.getElementById("client_musicsearch") + )).value; + + musiclist_element.innerHTML = ""; + + for (const trackname of client.musics) { + if (trackname.toLowerCase().indexOf(searchname.toLowerCase()) !== -1) { + const newentry = document.createElement("OPTION"); + newentry.text = trackname; + musiclist_element.options.add(newentry); + } + } +} +window.musiclist_filter = musiclist_filter; \ No newline at end of file diff --git a/webAO/dom/opusCheck.ts b/webAO/dom/opusCheck.ts new file mode 100644 index 0000000..939fdc6 --- /dev/null +++ b/webAO/dom/opusCheck.ts @@ -0,0 +1,22 @@ +/** + * Triggered when there was an error loading a sound + * @param {HTMLAudioElement} image the element containing the missing sound + */ +export function opusCheck( + channel: HTMLAudioElement +): OnErrorEventHandlerNonNull { + const audio = channel.src; + if (audio === "") { + return; + } + console.info(`failed to load sound ${channel.src}`); + let oldsrc = ""; + let newsrc = ""; + oldsrc = channel.src; + if (!oldsrc.endsWith(".opus")) { + newsrc = oldsrc.replace(".mp3", ".opus"); + newsrc = newsrc.replace(".wav", ".opus"); + channel.src = newsrc; // unload so the old sprite doesn't persist + } +} +window.opusCheck = opusCheck; \ No newline at end of file diff --git a/webAO/dom/pickEvidence.ts b/webAO/dom/pickEvidence.ts new file mode 100644 index 0000000..32e52ba --- /dev/null +++ b/webAO/dom/pickEvidence.ts @@ -0,0 +1,48 @@ +import { cancelEvidence, client, getIndexFromSelect, updateEvidenceIcon } from '../client' + +/** + * Highlights and selects an evidence for in-character chat. + * @param {string} evidence the evidence to be presented + */ +export function pickEvidence(evidence: number) { + if (client.selectedEvidence !== evidence) { + // Update selected evidence + if (client.selectedEvidence > 0) { + document.getElementById(`evi_${client.selectedEvidence}`)!.className = + "evi_icon"; + } + document.getElementById(`evi_${evidence}`)!.className = "evi_icon dark"; + client.selectedEvidence = evidence; + + // Show evidence on information window + (document.getElementById("evi_name")).value = + client.evidences[evidence - 1].name; + (document.getElementById("evi_desc")).value = + client.evidences[evidence - 1].desc; + + // Update icon + const icon_id = getIndexFromSelect( + "evi_select", + client.evidences[evidence - 1].filename + ); + (document.getElementById("evi_select")).selectedIndex = + icon_id; + if (icon_id === 0) { + (document.getElementById("evi_filename")).value = + client.evidences[evidence - 1].filename; + } + updateEvidenceIcon(); + + // Update button + document.getElementById("evi_add")!.className = + "client_button hover_button inactive"; + document.getElementById("evi_edit")!.className = + "client_button hover_button"; + document.getElementById("evi_cancel")!.className = + "client_button hover_button"; + document.getElementById("evi_del")!.className = "client_button hover_button"; + } else { + cancelEvidence(); + } +} +window.pickEvidence = pickEvidence; diff --git a/webAO/dom/resizeChatbox.ts b/webAO/dom/resizeChatbox.ts new file mode 100644 index 0000000..efb8bdc --- /dev/null +++ b/webAO/dom/resizeChatbox.ts @@ -0,0 +1,33 @@ +import { CHATBOX } from "../client"; +/** + * 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.0521).toFixed(1)}px`; + + const trackstatus = (document.getElementById("client_trackstatustext")); + trackstatus.width = (trackstatus.offsetWidth - 1) + "px"; + + + //clock + const now = new Date(); + let weekday = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"]; + const month = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]; + document.getElementById("client_clock_month")!.innerText = month[now.getMonth()]; + console.debug(CHATBOX); + if (CHATBOX == "acww") { + weekday = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"]; + document.getElementById("client_clock_weekday")!.innerText = weekday[now.getDay()]; + document.getElementById("client_clock_date")!.innerText = now.getDay() + "/" + now.getMonth(); + document.getElementById("client_clock_time")!.innerText = now.getHours() + ":" + now.getMinutes(); + } else if (CHATBOX == "key") { + weekday = ["Sun.", "Mon.", "Tue.", "Wed.", "Thu.", "Fri.", "Sat."]; + document.getElementById("client_clock_weekday")!.innerText = weekday[now.getDay()]; + document.getElementById("client_clock_date")!.innerText = String(now.getDay()); + } + +} +window.resizeChatbox = resizeChatbox; \ No newline at end of file diff --git a/webAO/dom/toggleShout.ts b/webAO/dom/toggleShout.ts new file mode 100644 index 0000000..8094691 --- /dev/null +++ b/webAO/dom/toggleShout.ts @@ -0,0 +1,22 @@ +import { selectedShout, setSelectedShout } from "../client"; + + +/** + * Highlights and selects a shout for in-character chat. + * If the same shout button is selected, then the shout is canceled. + * @param {number} shout the new shout to be selected + */ +export function toggleShout(shout: number) { + if (shout === selectedShout) { + document.getElementById(`button_${shout}`)!.className = "client_button"; + selectedShout = 0; + } else { + document.getElementById(`button_${shout}`)!.className = "client_button dark"; + if (selectedShout) { + document.getElementById(`button_${selectedShout}`)!.className = + "client_button"; + } + selectedShout = shout; + } +} +window.toggleShout = toggleShout; diff --git a/webAO/dom/updateBackgroundPreview.ts b/webAO/dom/updateBackgroundPreview.ts new file mode 100644 index 0000000..b41ee8f --- /dev/null +++ b/webAO/dom/updateBackgroundPreview.ts @@ -0,0 +1,28 @@ +import { AO_HOST } from '../client/aoHost' +/** + * Update background preview. + */ +export function updateBackgroundPreview() { + const background_select = ( + document.getElementById("bg_select") + ); + const background_filename = ( + document.getElementById("bg_filename") + ); + const background_preview = ( + document.getElementById("bg_preview") + ); + + if (background_select.selectedIndex === 0) { + background_filename.style.display = "initial"; + background_preview.src = `${AO_HOST}background/${encodeURI( + background_filename.value.toLowerCase() + )}/defenseempty.png`; + } else { + background_filename.style.display = "none"; + background_preview.src = `${AO_HOST}background/${encodeURI( + background_select.value.toLowerCase() + )}/defenseempty.png`; + } +} +window.updateBackgroundPreview = updateBackgroundPreview; \ No newline at end of file diff --git a/webAO/packets/handlers/handleBN.ts b/webAO/packets/handlers/handleBN.ts index 067130d..94029b3 100644 --- a/webAO/packets/handlers/handleBN.ts +++ b/webAO/packets/handlers/handleBN.ts @@ -1,6 +1,7 @@ -import { client, getIndexFromSelect, updateBackgroundPreview } from "../../client"; +import { client, getIndexFromSelect } from "../../client"; import { AO_HOST } from "../../client/aoHost"; import { safeTags } from "../../encoding"; +import { updateBackgroundPreview } from '../../dom/updateBackgroundPreview' import tryUrls from "../../utils/tryUrls"; diff --git a/webAO/viewport.ts b/webAO/viewport.ts index f647d86..d0e7b77 100644 --- a/webAO/viewport.ts +++ b/webAO/viewport.ts @@ -1,9 +1,10 @@ import tryUrls from "./utils/tryUrls"; import fileExists from "./utils/fileExists"; -import Client, { opusCheck, delay } from "./client"; +import Client, { delay } from "./client"; +import {opusCheck} from './dom/opusCheck' import { UPDATE_INTERVAL } from "./client"; import { setChatbox } from "./client"; -import { resizeChatbox } from "./client"; +import { resizeChatbox } from "./dom/resizeChatbox"; import transparentPng from "./constants/transparentPng"; import mlConfig from "./utils/aoml"; import { appendICLog } from "./client"; -- cgit From 3f8d0974b327e663328bc36cd97f1ba1855a2269 Mon Sep 17 00:00:00 2001 From: Caleb Date: Wed, 7 Sep 2022 17:01:25 -0400 Subject: Added more functions --- webAO/client.ts | 158 +------------------------------------ webAO/dom/cancelEvidence.ts | 3 +- webAO/dom/changeBackgroundOOC.ts | 28 +++++++ webAO/dom/changeCallwords.ts | 13 +++ webAO/dom/editEvidence.ts | 22 ++++++ webAO/dom/getIndexFromSelect.ts | 16 ++++ webAO/dom/iniEdit.ts | 14 ++++ webAO/dom/modCallTest.ts | 8 ++ webAO/dom/pickEmotion.ts | 24 ++++++ webAO/dom/pickEvidence.ts | 5 +- webAO/dom/switchPanTilt.ts | 16 ++++ webAO/dom/toggleShout.ts | 5 +- webAO/dom/updateEvidenceIcon.ts | 28 +++++++ webAO/packets/handlers/handleBN.ts | 3 +- webAO/packets/handlers/handlePV.ts | 3 +- 15 files changed, 183 insertions(+), 163 deletions(-) create mode 100644 webAO/dom/changeBackgroundOOC.ts create mode 100644 webAO/dom/changeCallwords.ts create mode 100644 webAO/dom/editEvidence.ts create mode 100644 webAO/dom/getIndexFromSelect.ts create mode 100644 webAO/dom/iniEdit.ts create mode 100644 webAO/dom/modCallTest.ts create mode 100644 webAO/dom/pickEmotion.ts create mode 100644 webAO/dom/switchPanTilt.ts create mode 100644 webAO/dom/updateEvidenceIcon.ts (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 321872f..5618f3e 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -965,54 +965,6 @@ export function resetICParams() { } } -/** - * Triggered by a changed callword list - */ -export function changeCallwords() { - client.callwords = (( - document.getElementById("client_callwords") - )).value.split("\n"); - setCookie("callwords", client.callwords.join("\n")); -} -window.changeCallwords = changeCallwords; - -/** - * Triggered by the modcall sfx dropdown - */ -export function modcall_test() { - packetHandler.get("ZZ")("test#test".split("#")); -} -window.modcall_test = modcall_test; - -/** - * Triggered by the ini button. - */ -export async function iniedit() { - const ininame = (document.getElementById("client_ininame")) - .value; - const inicharID = client.charID; - await client.handleCharacterInfo(ininame.split("&"), inicharID); - packetHandler.get("PV")(`PV#0#CID#${inicharID}`.split("#")); -} -window.iniedit = iniedit; - -/** - * Triggered by the pantilt checkbox - */ -export async function switchPanTilt() { - const fullview = document.getElementById("client_fullview"); - const checkbox = document.getElementById("client_pantilt"); - - if (checkbox.checked) { - fullview.style.transition = "0.5s ease-in-out"; - } else { - fullview.style.transition = "none"; - } - - return; -} -window.switchPanTilt = switchPanTilt; - /** * Triggered by the change aspect ratio checkbox */ @@ -1201,29 +1153,7 @@ export function pickChar(ccharacter: number) { } window.pickChar = pickChar; -/** - * Highlights and selects an emotion for in-character chat. - * @param {string} emo the new emotion to be selected - */ -export function pickEmotion(emo: number) { - try { - if (client.selectedEmote !== -1) { - document.getElementById(`emo_${client.selectedEmote}`).className = - "emote_button"; - } - } catch (err) { - // do nothing - } - client.selectedEmote = emo; - document.getElementById(`emo_${emo}`).className = "emote_button dark"; - - (document.getElementById("sendsfx")).checked = - client.emote.sfx.length > 1; - (document.getElementById("sendpreanim")).checked = - client.emote.zoom == 1; -} -window.pickEmotion = pickEmotion; /** @@ -1244,25 +1174,7 @@ export function addEvidence() { } window.addEvidence = addEvidence; -/** - * Edit selected evidence. - */ -export function editEvidence() { - const evidence_select = ( - document.getElementById("evi_select") - ); - const id = client.selectedEvidence - 1; - client.sendEE( - id, - (document.getElementById("evi_name")).value, - (document.getElementById("evi_desc")).value, - evidence_select.selectedIndex === 0 - ? (document.getElementById("evi_filename")).value - : evidence_select.options[evidence_select.selectedIndex].text - ); - cancelEvidence(); -} -window.editEvidence = editEvidence; + /** * Delete selected evidence. @@ -1275,22 +1187,7 @@ export function deleteEvidence() { window.deleteEvidence = deleteEvidence; -/** - * Find index of anything in select box. - * @param {string} select_box the select element name - * @param {string} value the value that need to be compared - */ -export function getIndexFromSelect(select_box: string, value: string) { - // Find if icon alraedy existed in select box - const select_element = document.getElementById(select_box); - for (let i = 1; i < select_element.length; ++i) { - if (select_element.options[i].value === value) { - return i; - } - } - return 0; -} -window.getIndexFromSelect = getIndexFromSelect; + /** * Set the style of the chatbox @@ -1319,57 +1216,6 @@ window.setChatbox = setChatbox; -/** - * Update evidence icon. - */ -export function updateEvidenceIcon() { - const evidence_select = ( - document.getElementById("evi_select") - ); - const evidence_filename = ( - document.getElementById("evi_filename") - ); - const evidence_iconbox = ( - document.getElementById("evi_preview") - ); - - if (evidence_select.selectedIndex === 0) { - evidence_filename.style.display = "initial"; - evidence_iconbox.src = `${AO_HOST}evidence/${encodeURI( - evidence_filename.value.toLowerCase() - )}`; - } else { - evidence_filename.style.display = "none"; - evidence_iconbox.src = `${AO_HOST}evidence/${encodeURI( - evidence_select.value.toLowerCase() - )}`; - } -} -window.updateEvidenceIcon = updateEvidenceIcon; - -/** - * Change background via OOC. - */ -export function changeBackgroundOOC() { - const selectedBG = document.getElementById("bg_select"); - const changeBGCommand = "bg $1"; - const bgFilename = document.getElementById("bg_filename"); - - let filename = ""; - if (selectedBG.selectedIndex === 0) { - filename = bgFilename.value; - } else { - filename = selectedBG.value; - } - - - if (mode === "join") { - client.sendOOC(`/${changeBGCommand.replace("$1", filename)}`); - } else if (mode === "replay") { - client.sendSelf(`BN#${filename}#%`); - } -} -window.changeBackgroundOOC = changeBackgroundOOC; /** * Change role via OOC. diff --git a/webAO/dom/cancelEvidence.ts b/webAO/dom/cancelEvidence.ts index 6565288..a906613 100644 --- a/webAO/dom/cancelEvidence.ts +++ b/webAO/dom/cancelEvidence.ts @@ -1,4 +1,5 @@ -import { client, updateEvidenceIcon } from "../client"; +import { client, } from "../client"; +import { updateEvidenceIcon } from './updateEvidenceIcon' import { AO_HOST } from "../client/aoHost"; diff --git a/webAO/dom/changeBackgroundOOC.ts b/webAO/dom/changeBackgroundOOC.ts new file mode 100644 index 0000000..f840729 --- /dev/null +++ b/webAO/dom/changeBackgroundOOC.ts @@ -0,0 +1,28 @@ + +import queryParser from '../utils/queryParser' +import { client } from '../client' +let { mode } = queryParser() + +/** + * Change background via OOC. + */ +export function changeBackgroundOOC() { + const selectedBG = document.getElementById("bg_select"); + const changeBGCommand = "bg $1"; + const bgFilename = document.getElementById("bg_filename"); + + let filename = ""; + if (selectedBG.selectedIndex === 0) { + filename = bgFilename.value; + } else { + filename = selectedBG.value; + } + + + if (mode === "join") { + client.sendOOC(`/${changeBGCommand.replace("$1", filename)}`); + } else if (mode === "replay") { + client.sendSelf(`BN#${filename}#%`); + } +} +window.changeBackgroundOOC = changeBackgroundOOC; \ No newline at end of file diff --git a/webAO/dom/changeCallwords.ts b/webAO/dom/changeCallwords.ts new file mode 100644 index 0000000..28be674 --- /dev/null +++ b/webAO/dom/changeCallwords.ts @@ -0,0 +1,13 @@ +import { client } from '../client' +import setCookie from '../utils/setCookie'; + +/** + * Triggered by a changed callword list + */ +export function changeCallwords() { + client.callwords = (( + document.getElementById("client_callwords") + )).value.split("\n"); + setCookie("callwords", client.callwords.join("\n")); +} +window.changeCallwords = changeCallwords; \ No newline at end of file diff --git a/webAO/dom/editEvidence.ts b/webAO/dom/editEvidence.ts new file mode 100644 index 0000000..2cc4565 --- /dev/null +++ b/webAO/dom/editEvidence.ts @@ -0,0 +1,22 @@ +import { client } from '../client' +import { cancelEvidence } from './cancelEvidence'; + +/** + * Edit selected evidence. + */ +export function editEvidence() { + const evidence_select = ( + document.getElementById("evi_select") + ); + const id = client.selectedEvidence - 1; + client.sendEE( + id, + (document.getElementById("evi_name")).value, + (document.getElementById("evi_desc")).value, + evidence_select.selectedIndex === 0 + ? (document.getElementById("evi_filename")).value + : evidence_select.options[evidence_select.selectedIndex].text + ); + cancelEvidence(); +} +window.editEvidence = editEvidence; \ No newline at end of file diff --git a/webAO/dom/getIndexFromSelect.ts b/webAO/dom/getIndexFromSelect.ts new file mode 100644 index 0000000..2f21653 --- /dev/null +++ b/webAO/dom/getIndexFromSelect.ts @@ -0,0 +1,16 @@ +/** + * Find index of anything in select box. + * @param {string} select_box the select element name + * @param {string} value the value that need to be compared + */ +export function getIndexFromSelect(select_box: string, value: string) { + // Find if icon alraedy existed in select box + const select_element = document.getElementById(select_box); + for (let i = 1; i < select_element.length; ++i) { + if (select_element.options[i].value === value) { + return i; + } + } + return 0; +} +window.getIndexFromSelect = getIndexFromSelect; \ No newline at end of file diff --git a/webAO/dom/iniEdit.ts b/webAO/dom/iniEdit.ts new file mode 100644 index 0000000..359a226 --- /dev/null +++ b/webAO/dom/iniEdit.ts @@ -0,0 +1,14 @@ +import { client } from "../client"; +import { packetHandler } from "../packets/packetHandler"; + +/** + * Triggered by the ini button. + */ +export async function iniedit() { + const ininame = (document.getElementById("client_ininame")) + .value; + const inicharID = client.charID; + await client.handleCharacterInfo(ininame.split("&"), inicharID); + packetHandler.get("PV")!(`PV#0#CID#${inicharID}`.split("#")); +} +window.iniedit = iniedit; diff --git a/webAO/dom/modCallTest.ts b/webAO/dom/modCallTest.ts new file mode 100644 index 0000000..7058caf --- /dev/null +++ b/webAO/dom/modCallTest.ts @@ -0,0 +1,8 @@ +import { packetHandler } from "../packets/packetHandler"; +/** + * Triggered by the modcall sfx dropdown + */ +export function modcall_test() { + packetHandler.get("ZZ")!("test#test".split("#")); +} +window.modcall_test = modcall_test; \ No newline at end of file diff --git a/webAO/dom/pickEmotion.ts b/webAO/dom/pickEmotion.ts new file mode 100644 index 0000000..b72583f --- /dev/null +++ b/webAO/dom/pickEmotion.ts @@ -0,0 +1,24 @@ +import { client } from '../client' +/** + * Highlights and selects an emotion for in-character chat. + * @param {string} emo the new emotion to be selected + */ +export function pickEmotion(emo: number) { + try { + if (client.selectedEmote !== -1) { + document.getElementById(`emo_${client.selectedEmote}`)!.className = + "emote_button"; + } + } catch (err) { + // do nothing + } + client.selectedEmote = emo; + document.getElementById(`emo_${emo}`)!.className = "emote_button dark"; + + (document.getElementById("sendsfx")).checked = + client.emote.sfx.length > 1; + + (document.getElementById("sendpreanim")).checked = + client.emote.zoom == 1; +} +window.pickEmotion = pickEmotion; \ No newline at end of file diff --git a/webAO/dom/pickEvidence.ts b/webAO/dom/pickEvidence.ts index 32e52ba..411acc1 100644 --- a/webAO/dom/pickEvidence.ts +++ b/webAO/dom/pickEvidence.ts @@ -1,4 +1,7 @@ -import { cancelEvidence, client, getIndexFromSelect, updateEvidenceIcon } from '../client' +import { client } from '../client' +import { cancelEvidence } from './cancelEvidence'; +import { updateEvidenceIcon } from './updateEvidenceIcon' +import { getIndexFromSelect } from './getIndexFromSelect' /** * Highlights and selects an evidence for in-character chat. diff --git a/webAO/dom/switchPanTilt.ts b/webAO/dom/switchPanTilt.ts new file mode 100644 index 0000000..7ceea06 --- /dev/null +++ b/webAO/dom/switchPanTilt.ts @@ -0,0 +1,16 @@ +/** + * Triggered by the pantilt checkbox + */ +export async function switchPanTilt() { + const fullview = document.getElementById("client_fullview")!; + const checkbox = document.getElementById("client_pantilt"); + + if (checkbox.checked) { + fullview.style.transition = "0.5s ease-in-out"; + } else { + fullview.style.transition = "none"; + } + + return; +} +window.switchPanTilt = switchPanTilt; \ No newline at end of file diff --git a/webAO/dom/toggleShout.ts b/webAO/dom/toggleShout.ts index 8094691..cb12f49 100644 --- a/webAO/dom/toggleShout.ts +++ b/webAO/dom/toggleShout.ts @@ -1,6 +1,5 @@ import { selectedShout, setSelectedShout } from "../client"; - /** * Highlights and selects a shout for in-character chat. * If the same shout button is selected, then the shout is canceled. @@ -9,14 +8,14 @@ import { selectedShout, setSelectedShout } from "../client"; export function toggleShout(shout: number) { if (shout === selectedShout) { document.getElementById(`button_${shout}`)!.className = "client_button"; - selectedShout = 0; + setSelectedShout(0); } else { document.getElementById(`button_${shout}`)!.className = "client_button dark"; if (selectedShout) { document.getElementById(`button_${selectedShout}`)!.className = "client_button"; } - selectedShout = shout; + setSelectedShout(shout); } } window.toggleShout = toggleShout; diff --git a/webAO/dom/updateEvidenceIcon.ts b/webAO/dom/updateEvidenceIcon.ts new file mode 100644 index 0000000..bff0475 --- /dev/null +++ b/webAO/dom/updateEvidenceIcon.ts @@ -0,0 +1,28 @@ +import { AO_HOST } from "../client/aoHost"; +/** + * Update evidence icon. + */ +export function updateEvidenceIcon() { + const evidence_select = ( + document.getElementById("evi_select") + ); + const evidence_filename = ( + document.getElementById("evi_filename") + ); + const evidence_iconbox = ( + document.getElementById("evi_preview") + ); + + if (evidence_select.selectedIndex === 0) { + evidence_filename.style.display = "initial"; + evidence_iconbox.src = `${AO_HOST}evidence/${encodeURI( + evidence_filename.value.toLowerCase() + )}`; + } else { + evidence_filename.style.display = "none"; + evidence_iconbox.src = `${AO_HOST}evidence/${encodeURI( + evidence_select.value.toLowerCase() + )}`; + } +} +window.updateEvidenceIcon = updateEvidenceIcon; diff --git a/webAO/packets/handlers/handleBN.ts b/webAO/packets/handlers/handleBN.ts index 94029b3..3c5d95f 100644 --- a/webAO/packets/handlers/handleBN.ts +++ b/webAO/packets/handlers/handleBN.ts @@ -1,7 +1,8 @@ -import { client, getIndexFromSelect } from "../../client"; +import { client } from "../../client"; import { AO_HOST } from "../../client/aoHost"; import { safeTags } from "../../encoding"; import { updateBackgroundPreview } from '../../dom/updateBackgroundPreview' +import { getIndexFromSelect } from '../../dom/getIndexFromSelect' import tryUrls from "../../utils/tryUrls"; diff --git a/webAO/packets/handlers/handlePV.ts b/webAO/packets/handlers/handlePV.ts index fba2a3c..3c669b9 100644 --- a/webAO/packets/handlers/handlePV.ts +++ b/webAO/packets/handlers/handlePV.ts @@ -1,6 +1,7 @@ -import { client, pickEmotion } from "../../client"; +import { client } from "../../client"; import fileExists from "../../utils/fileExists"; import { updateActionCommands } from '../../dom/updateActionCommands' +import { pickEmotion } from '../../dom/pickEmotion' import { AO_HOST } from "../../client/aoHost"; /** -- cgit From d99a619e26f38c729d74d8dc585e8ce13236ffb7 Mon Sep 17 00:00:00 2001 From: Caleb Date: Thu, 8 Sep 2022 00:51:31 -0400 Subject: Removed all window functions from client --- webAO/client.ts | 402 +++------------------------------------- webAO/dom/addEvidence.ts | 20 ++ webAO/dom/addHPD.ts | 9 + webAO/dom/addHPP.ts | 9 + webAO/dom/callMod.ts | 16 ++ webAO/dom/changeCharacter.ts | 11 ++ webAO/dom/changeRoleOOC.ts | 13 ++ webAO/dom/charError.ts | 12 ++ webAO/dom/charTableFilter.ts | 20 ++ webAO/dom/deleteEvidence.ts | 12 ++ webAO/dom/guilty.ts | 9 + webAO/dom/imgError.ts | 10 + webAO/dom/initCE.ts | 9 + webAO/dom/initWT.ts | 9 + webAO/dom/notGuilty.ts | 9 + webAO/dom/pickChar.ts | 16 ++ webAO/dom/randomCharacterOOC.ts | 8 + webAO/dom/reconnectButton.ts | 16 ++ webAO/dom/redHPD.ts | 9 + webAO/dom/redHPP.ts | 9 + webAO/dom/setChatbox.ts | 28 +++ webAO/dom/switchAspectRatio.ts | 19 ++ webAO/dom/switchChatOffset.ts | 17 ++ webAO/dom/toggleMenu.ts | 18 ++ webAO/dom/window.ts | 56 ++++++ webAO/viewport.ts | 2 +- 26 files changed, 390 insertions(+), 378 deletions(-) create mode 100644 webAO/dom/addEvidence.ts create mode 100644 webAO/dom/addHPD.ts create mode 100644 webAO/dom/addHPP.ts create mode 100644 webAO/dom/callMod.ts create mode 100644 webAO/dom/changeCharacter.ts create mode 100644 webAO/dom/changeRoleOOC.ts create mode 100644 webAO/dom/charError.ts create mode 100644 webAO/dom/charTableFilter.ts create mode 100644 webAO/dom/deleteEvidence.ts create mode 100644 webAO/dom/guilty.ts create mode 100644 webAO/dom/imgError.ts create mode 100644 webAO/dom/initCE.ts create mode 100644 webAO/dom/initWT.ts create mode 100644 webAO/dom/notGuilty.ts create mode 100644 webAO/dom/pickChar.ts create mode 100644 webAO/dom/randomCharacterOOC.ts create mode 100644 webAO/dom/reconnectButton.ts create mode 100644 webAO/dom/redHPD.ts create mode 100644 webAO/dom/redHPP.ts create mode 100644 webAO/dom/setChatbox.ts create mode 100644 webAO/dom/switchAspectRatio.ts create mode 100644 webAO/dom/switchChatOffset.ts create mode 100644 webAO/dom/toggleMenu.ts create mode 100644 webAO/dom/window.ts (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 5618f3e..62539ea 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -5,42 +5,44 @@ */ import FingerprintJS from "@fingerprintjs/fingerprintjs"; -import { EventEmitter } from "events"; -import { area_click } from './dom/areaClick' -import { onReplayGo } from './dom/onReplayGo' -import { escapeChat, prepChat, safeTags, unescapeChat } from "./encoding"; -// Load some defaults for the background and evidence dropdowns import vanilla_background_arr from "./constants/backgrounds.js"; import vanilla_evidence_arr from "./constants/evidence.js"; -import chatbox_arr from "./styles/chatbox/chatboxes.js"; import iniParse from "./iniParse"; import getCookie from "./utils/getCookie"; import setCookie from "./utils/setCookie"; +import fileExists from "./utils/fileExists.js"; +import queryParser from "./utils/queryParser"; +import getResources from "./utils/getResources.js"; +import downloadFile from "./services/downloadFile"; +import masterViewport, { Viewport } from "./viewport"; +import { EventEmitter } from "events"; +import { area_click } from './dom/areaClick' +import { onReplayGo } from './dom/onReplayGo' +import { escapeChat, safeTags, unescapeChat } from "./encoding"; +import { setChatbox } from "./dom/setChatbox"; import { request } from "./services/request.js"; import { changeShoutVolume, changeSFXVolume, changeTestimonyVolume, } from "./dom/changeVolume.js"; -import fileExists from "./utils/fileExists.js"; -import queryParser from "./utils/queryParser"; -import getResources from "./utils/getResources.js"; -import transparentPng from "./constants/transparentPng"; -import downloadFile from "./services/downloadFile"; import { getFilenameFromPath } from "./utils/paths"; -const version = process.env.npm_package_version; -import masterViewport, { Viewport } from "./viewport"; import { packetHandler } from './packets/packetHandler' -let { ip: serverIP, mode, asset, theme } = queryParser(); -import { cancelEvidence } from './dom/cancelEvidence' -// Unless there is an asset URL specified, use the wasabi one import { showname_click } from './dom/showNameClick' -import { updateActionCommands } from './dom/updateActionCommands' import { AO_HOST } from './client/aoHost' + +const version = process.env.npm_package_version; +let { ip: serverIP, mode, theme } = queryParser(); + let THEME: string = theme || "default"; export let CHATBOX: string; - +export const setCHATBOX = (val: string) => { + CHATBOX = val +} export let client: Client; +export const setClient = (val: Client) => { + client = val +} export const UPDATE_INTERVAL = 60; @@ -55,7 +57,10 @@ export const setOldLoading = (val: boolean) => { } // presettings -let selectedMenu = 1; +export let selectedMenu = 1; +export const setSelectedMenu = (val: number) => { + selectedMenu = val +} export let selectedShout = 0; export const setSelectedShout = (val: number) => { selectedShout = val @@ -71,62 +76,6 @@ export const setBanned = (val: boolean) => { } let hdid: string; -declare global { - interface Window { - toggleShout: (shout: number) => void; - toggleMenu: (menu: number) => void; - updateBackgroundPreview: () => void; - redHPP: () => void; - addHPP: () => void; - redHPD: () => void; - addHPD: () => void; - guilty: () => void; - notguilty: () => void; - initCE: () => void; - initWT: () => void; - callMod: () => void; - randomCharacterOOC: () => void; - changeRoleOOC: () => void; - changeBackgroundOOC: () => void; - updateActionCommands: (side: string) => void; - updateEvidenceIcon: () => void; - resizeChatbox: () => void; - setChatbox: (style: string) => void; - getIndexFromSelect: (select_box: string, value: string) => Number; - cancelEvidence: () => void; - deleteEvidence: () => void; - editEvidence: () => void; - addEvidence: () => void; - pickEvidence: (evidence: any) => void; - pickEmotion: (emo: any) => void; - pickChar: (ccharacter: any) => void; - chartable_filter: (_event: any) => void; - ReconnectButton: (_event: any) => void; - opusCheck: (channel: HTMLAudioElement) => OnErrorEventHandlerNonNull; - imgError: (image: any) => void; - charError: (image: any) => void; - changeCharacter: (_event: any) => void; - switchChatOffset: () => void; - switchAspectRatio: () => void; - switchPanTilt: (addcheck: number) => void; - iniedit: () => void; - modcall_test: () => void; - reloadTheme: () => void; - changeCallwords: () => void; - changeBlipVolume: () => void; - changeMusicVolume: () => void; - area_click: (el: any) => void; - showname_click: (_event: any) => void; - mutelist_click: (_event: any) => void; - musiclist_click: (_event: any) => void; - musiclist_filter: (_event: any) => void; - resetOffset: (_event: any) => void; - onEnter: (event: any) => void; - onReplayGo: (_event: any) => void; - onOOCEnter: (_event: any) => void; - } -} - function isLowMemory() { if ( /webOS|iPod|BlackBerry|BB|PlayBook|IEMobile|Windows Phone|Kindle|Silk|PlayStation|Nintendo|Opera Mini/i.test( @@ -965,90 +914,6 @@ export function resetICParams() { } } -/** - * Triggered by the change aspect ratio checkbox - */ -export async function switchAspectRatio() { - const background = document.getElementById("client_gamewindow"); - const offsetCheck = ( - document.getElementById("client_hdviewport_offset") - ); - if ( - (document.getElementById("client_hdviewport")).checked - ) { - background.style.paddingBottom = "56.25%"; - offsetCheck.disabled = false; - } else { - background.style.paddingBottom = "75%"; - offsetCheck.disabled = true; - } -} -window.switchAspectRatio = switchAspectRatio; - -/** - * Triggered by the change aspect ratio checkbox - */ -export async function switchChatOffset() { - const container = document.getElementById("client_chatcontainer"); - if ( - (document.getElementById("client_hdviewport_offset")) - .checked - ) { - container.style.width = "80%"; - container.style.left = "10%"; - } else { - container.style.width = "100%"; - container.style.left = "0"; - } -} -window.switchChatOffset = switchChatOffset; - -/** - * Triggered when a character icon is clicked in the character selection menu. - * @param {MouseEvent} event - */ -export function changeCharacter(_event: Event) { - document.getElementById("client_waiting").style.display = "block"; - document.getElementById("client_charselect").style.display = "block"; - document.getElementById("client_emo").innerHTML = ""; -} -window.changeCharacter = changeCharacter; - -/** - * Triggered when there was an error loading a character sprite. - * @param {HTMLImageElement} image the element containing the missing image - */ -export function charError(image: HTMLImageElement) { - console.warn(`${image.src} is missing from webAO`); - image.src = transparentPng; - return true; -} -window.charError = charError; - -/** - * Triggered when there was an error loading a generic sprite. - * @param {HTMLImageElement} image the element containing the missing image - */ -export function imgError(image: HTMLImageElement) { - image.onerror = null; - image.src = ""; // unload so the old sprite doesn't persist - return true; -} -window.imgError = imgError; - -/** - * Triggered when the reconnect button is pushed. - */ -export function ReconnectButton() { - client.cleanup(); - client = new Client(serverIP); - - if (client) { - document.getElementById("client_error").style.display = "none"; - } -} -window.ReconnectButton = ReconnectButton; - /** * Appends a message to the in-character chat log. * @param {string} msg the string to be added @@ -1118,221 +983,4 @@ export function checkCallword(message: string, sfxAudio: HTMLAudioElement) { } } -/** - * Triggered when the music search bar is changed - * @param {MouseEvent} event - */ -export function chartable_filter(_event: Event) { - const searchname = (( - document.getElementById("client_charactersearch") - )).value; - - client.chars.forEach((character: any, charid: number) => { - const demothing = document.getElementById(`demo_${charid}`); - if (character.name.toLowerCase().indexOf(searchname.toLowerCase()) === -1) { - demothing.style.display = "none"; - } else { - demothing.style.display = "inline-block"; - } - }); -} -window.chartable_filter = chartable_filter; - -/** - * Requests to play as a character. - * @param {number} ccharacter the character ID; if this is a large number, - * then spectator is chosen instead. - */ -export function pickChar(ccharacter: number) { - if (ccharacter === -1) { - // Spectator - document.getElementById("client_waiting").style.display = "none"; - document.getElementById("client_charselect").style.display = "none"; - } - client.sendCharacter(ccharacter); -} -window.pickChar = pickChar; - - - - -/** - * Add evidence. - */ -export function addEvidence() { - const evidence_select = ( - document.getElementById("evi_select") - ); - client.sendPE( - (document.getElementById("evi_name")).value, - (document.getElementById("evi_desc")).value, - evidence_select.selectedIndex === 0 - ? (document.getElementById("evi_filename")).value - : evidence_select.options[evidence_select.selectedIndex].text - ); - cancelEvidence(); -} -window.addEvidence = addEvidence; - - - -/** - * Delete selected evidence. - */ -export function deleteEvidence() { - const id = client.selectedEvidence - 1; - client.sendDE(id); - cancelEvidence(); -} -window.deleteEvidence = deleteEvidence; - - - - -/** - * Set the style of the chatbox - */ -export function setChatbox(style: string) { - const chatbox_theme = ( - document.getElementById("chatbox_theme") - ); - const themeselect = ( - document.getElementById("client_chatboxselect") - ); - CHATBOX = themeselect.value; - - setCookie("chatbox", CHATBOX); - if (CHATBOX === "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/${CHATBOX}.css`; - } -} -window.setChatbox = setChatbox; - - - - -/** - * Change role via OOC. - */ -export function changeRoleOOC() { - const roleselect = document.getElementById("role_select"); - - client.sendOOC(`/pos ${roleselect.value}`); - client.sendServer(`SP#${roleselect.value}#%`); - updateActionCommands(roleselect.value); -} -window.changeRoleOOC = changeRoleOOC; - -/** - * Random character via OOC. - */ -export function randomCharacterOOC() { - client.sendOOC(`/randomchar`); -} -window.randomCharacterOOC = randomCharacterOOC; - -/** - * Call mod. - */ -export function callMod() { - let modcall; - if (extrafeatures.includes("modcall_reason")) { - modcall = prompt("Please enter the reason for the modcall", ""); - } - if (modcall == null || modcall === "") { - // cancel - } else { - client.sendZZ(modcall); - } -} -window.callMod = callMod; - -/** - * Declare witness testimony. - */ -export function initWT() { - client.sendRT("testimony1"); -} -window.initWT = initWT; - -/** - * Declare cross examination. - */ -export function initCE() { - client.sendRT("testimony2"); -} -window.initCE = initCE; - -/** - * Declare the defendant not guilty - */ -export function notguilty() { - client.sendRT("judgeruling#0"); -} -window.notguilty = notguilty; - -/** - * Declare the defendant not guilty - */ -export function guilty() { - client.sendRT("judgeruling#1"); -} -window.guilty = guilty; - -/** - * Increment defense health point. - */ -export function addHPD() { - client.sendHP(1, client.hp[0] + 1); -} -window.addHPD = addHPD; - -/** - * Decrement defense health point. - */ -export function redHPD() { - client.sendHP(1, client.hp[0] - 1); -} -window.redHPD = redHPD; - -/** - * Increment prosecution health point. - */ -export function addHPP() { - client.sendHP(2, client.hp[1] + 1); -} -window.addHPP = addHPP; - -/** - * Decrement prosecution health point. - */ -export function redHPP() { - client.sendHP(2, client.hp[1] - 1); -} -window.redHPP = redHPP; - - -/** - * Highlights and selects a menu. - * @param {number} menu the menu to be selected - */ -export function toggleMenu(menu: number) { - if (menu !== selectedMenu) { - document.getElementById(`menu_${menu}`).className = "menu_button active"; - document.getElementById(`content_${menu}`).className = - "menu_content active"; - document.getElementById(`menu_${selectedMenu}`).className = "menu_button"; - document.getElementById(`content_${selectedMenu}`).className = - "menu_content"; - selectedMenu = menu; - } -} -window.toggleMenu = toggleMenu; - -export default Client; +export default Client; \ No newline at end of file diff --git a/webAO/dom/addEvidence.ts b/webAO/dom/addEvidence.ts new file mode 100644 index 0000000..89bb4d5 --- /dev/null +++ b/webAO/dom/addEvidence.ts @@ -0,0 +1,20 @@ +import { client } from "../client"; +import { cancelEvidence } from "./cancelEvidence"; + +/** + * Add evidence. + */ + export function addEvidence() { + const evidence_select = ( + document.getElementById("evi_select") + ); + client.sendPE( + (document.getElementById("evi_name")).value, + (document.getElementById("evi_desc")).value, + evidence_select.selectedIndex === 0 + ? (document.getElementById("evi_filename")).value + : evidence_select.options[evidence_select.selectedIndex].text + ); + cancelEvidence(); + } + window.addEvidence = addEvidence; \ No newline at end of file diff --git a/webAO/dom/addHPD.ts b/webAO/dom/addHPD.ts new file mode 100644 index 0000000..12d1c07 --- /dev/null +++ b/webAO/dom/addHPD.ts @@ -0,0 +1,9 @@ +import { client } from "../client"; + +/** + * Increment defense health point. + */ +export function addHPD() { + client.sendHP(1, client.hp[0] + 1); +} +window.addHPD = addHPD; \ No newline at end of file diff --git a/webAO/dom/addHPP.ts b/webAO/dom/addHPP.ts new file mode 100644 index 0000000..4a1521c --- /dev/null +++ b/webAO/dom/addHPP.ts @@ -0,0 +1,9 @@ +import { client } from "../client"; + +/** + * Increment prosecution health point. + */ +export function addHPP() { + client.sendHP(2, client.hp[1] + 1); +} +window.addHPP = addHPP; \ No newline at end of file diff --git a/webAO/dom/callMod.ts b/webAO/dom/callMod.ts new file mode 100644 index 0000000..0c52433 --- /dev/null +++ b/webAO/dom/callMod.ts @@ -0,0 +1,16 @@ +import { client, extrafeatures } from "../client"; +/** + * Call mod. + */ +export function callMod() { + let modcall; + if (extrafeatures.includes("modcall_reason")) { + modcall = prompt("Please enter the reason for the modcall", ""); + } + if (modcall == null || modcall === "") { + // cancel + } else { + client.sendZZ(modcall); + } +} +window.callMod = callMod; \ No newline at end of file diff --git a/webAO/dom/changeCharacter.ts b/webAO/dom/changeCharacter.ts new file mode 100644 index 0000000..7ecefe5 --- /dev/null +++ b/webAO/dom/changeCharacter.ts @@ -0,0 +1,11 @@ + +/** + * Triggered when a character icon is clicked in the character selection menu. + * @param {MouseEvent} event + */ +export function changeCharacter(_event: Event) { + document.getElementById("client_waiting")!.style.display = "block"; + document.getElementById("client_charselect")!.style.display = "block"; + document.getElementById("client_emo")!.innerHTML = ""; +} +window.changeCharacter = changeCharacter; \ No newline at end of file diff --git a/webAO/dom/changeRoleOOC.ts b/webAO/dom/changeRoleOOC.ts new file mode 100644 index 0000000..d838cb3 --- /dev/null +++ b/webAO/dom/changeRoleOOC.ts @@ -0,0 +1,13 @@ +import { updateActionCommands } from './updateActionCommands' +import { client } from '../client' +/** + * Change role via OOC. + */ +export function changeRoleOOC() { + const roleselect = document.getElementById("role_select"); + + client.sendOOC(`/pos ${roleselect.value}`); + client.sendServer(`SP#${roleselect.value}#%`); + updateActionCommands(roleselect.value); +} +window.changeRoleOOC = changeRoleOOC; \ No newline at end of file diff --git a/webAO/dom/charError.ts b/webAO/dom/charError.ts new file mode 100644 index 0000000..8cb672a --- /dev/null +++ b/webAO/dom/charError.ts @@ -0,0 +1,12 @@ +import transparentPng from "../constants/transparentPng"; + +/** + * Triggered when there was an error loading a character sprite. + * @param {HTMLImageElement} image the element containing the missing image + */ +export function charError(image: HTMLImageElement) { + console.warn(`${image.src} is missing from webAO`); + image.src = transparentPng; + return true; +} +window.charError = charError; \ No newline at end of file diff --git a/webAO/dom/charTableFilter.ts b/webAO/dom/charTableFilter.ts new file mode 100644 index 0000000..d81fb88 --- /dev/null +++ b/webAO/dom/charTableFilter.ts @@ -0,0 +1,20 @@ +import { client } from '../client' +/** + * Triggered when the music search bar is changed + * @param {MouseEvent} event + */ +export function chartable_filter(_event: Event) { + const searchname = (( + document.getElementById("client_charactersearch") + )).value; + + client.chars.forEach((character: any, charid: number) => { + const demothing = document.getElementById(`demo_${charid}`)!; + if (character.name.toLowerCase().indexOf(searchname.toLowerCase()) === -1) { + demothing.style.display = "none"; + } else { + demothing.style.display = "inline-block"; + } + }); +} +window.chartable_filter = chartable_filter; \ No newline at end of file diff --git a/webAO/dom/deleteEvidence.ts b/webAO/dom/deleteEvidence.ts new file mode 100644 index 0000000..f007cdf --- /dev/null +++ b/webAO/dom/deleteEvidence.ts @@ -0,0 +1,12 @@ +import { client } from "../client"; +import { cancelEvidence } from "./cancelEvidence"; + +/** + * Delete selected evidence. + */ +export function deleteEvidence() { + const id = client.selectedEvidence - 1; + client.sendDE(id); + cancelEvidence(); +} +window.deleteEvidence = deleteEvidence; \ No newline at end of file diff --git a/webAO/dom/guilty.ts b/webAO/dom/guilty.ts new file mode 100644 index 0000000..f7fa5b8 --- /dev/null +++ b/webAO/dom/guilty.ts @@ -0,0 +1,9 @@ +import { client } from "../client"; + +/** + * Declare the defendant not guilty + */ +export function guilty() { + client.sendRT("judgeruling#1"); +} +window.guilty = guilty; \ No newline at end of file diff --git a/webAO/dom/imgError.ts b/webAO/dom/imgError.ts new file mode 100644 index 0000000..fdb6122 --- /dev/null +++ b/webAO/dom/imgError.ts @@ -0,0 +1,10 @@ +/** + * Triggered when there was an error loading a generic sprite. + * @param {HTMLImageElement} image the element containing the missing image + */ +export function imgError(image: HTMLImageElement) { + image.onerror = null; + image.src = ""; // unload so the old sprite doesn't persist + return true; +} +window.imgError = imgError; \ No newline at end of file diff --git a/webAO/dom/initCE.ts b/webAO/dom/initCE.ts new file mode 100644 index 0000000..87bc256 --- /dev/null +++ b/webAO/dom/initCE.ts @@ -0,0 +1,9 @@ +import { client } from "../client"; + +/** + * Declare cross examination. + */ +export function initCE() { + client.sendRT("testimony2"); +} +window.initCE = initCE; \ No newline at end of file diff --git a/webAO/dom/initWT.ts b/webAO/dom/initWT.ts new file mode 100644 index 0000000..b6268fc --- /dev/null +++ b/webAO/dom/initWT.ts @@ -0,0 +1,9 @@ +import { client } from "../client"; + +/** + * Declare witness testimony. + */ +export function initWT() { + client.sendRT("testimony1"); +} +window.initWT = initWT; \ No newline at end of file diff --git a/webAO/dom/notGuilty.ts b/webAO/dom/notGuilty.ts new file mode 100644 index 0000000..e15ee4b --- /dev/null +++ b/webAO/dom/notGuilty.ts @@ -0,0 +1,9 @@ +import { client } from "../client"; + +/** + * Declare the defendant not guilty + */ +export function notguilty() { + client.sendRT("judgeruling#0"); +} +window.notguilty = notguilty; \ No newline at end of file diff --git a/webAO/dom/pickChar.ts b/webAO/dom/pickChar.ts new file mode 100644 index 0000000..5773125 --- /dev/null +++ b/webAO/dom/pickChar.ts @@ -0,0 +1,16 @@ +import { client } from "../client"; + +/** + * Requests to play as a character. + * @param {number} ccharacter the character ID; if this is a large number, + * then spectator is chosen instead. + */ +export function pickChar(ccharacter: number) { + if (ccharacter === -1) { + // Spectator + document.getElementById("client_waiting")!.style.display = "none"; + document.getElementById("client_charselect")!.style.display = "none"; + } + client.sendCharacter(ccharacter); +} +window.pickChar = pickChar; \ No newline at end of file diff --git a/webAO/dom/randomCharacterOOC.ts b/webAO/dom/randomCharacterOOC.ts new file mode 100644 index 0000000..507c3f0 --- /dev/null +++ b/webAO/dom/randomCharacterOOC.ts @@ -0,0 +1,8 @@ +import { client } from '../client' +/** + * Random character via OOC. + */ +export function randomCharacterOOC() { + client.sendOOC(`/randomchar`); +} +window.randomCharacterOOC = randomCharacterOOC; \ No newline at end of file diff --git a/webAO/dom/reconnectButton.ts b/webAO/dom/reconnectButton.ts new file mode 100644 index 0000000..4031ccd --- /dev/null +++ b/webAO/dom/reconnectButton.ts @@ -0,0 +1,16 @@ +import Client, { client, setClient } from "../client"; +import queryParser from "../utils/queryParser"; +let { ip: serverIP } = queryParser(); + +/** + * Triggered when the reconnect button is pushed. + */ +export function ReconnectButton() { + client.cleanup(); + setClient(new Client(serverIP)); + + if (client) { + document.getElementById("client_error")!.style.display = "none"; + } +} +window.ReconnectButton = ReconnectButton; \ No newline at end of file diff --git a/webAO/dom/redHPD.ts b/webAO/dom/redHPD.ts new file mode 100644 index 0000000..7b47c23 --- /dev/null +++ b/webAO/dom/redHPD.ts @@ -0,0 +1,9 @@ +import { client } from "../client"; + +/** + * Decrement defense health point. + */ +export function redHPD() { + client.sendHP(1, client.hp[0] - 1); +} +window.redHPD = redHPD; \ No newline at end of file diff --git a/webAO/dom/redHPP.ts b/webAO/dom/redHPP.ts new file mode 100644 index 0000000..fb6711e --- /dev/null +++ b/webAO/dom/redHPP.ts @@ -0,0 +1,9 @@ +import { client } from "../client"; + +/** + * Decrement prosecution health point. + */ +export function redHPP() { + client.sendHP(2, client.hp[1] - 1); +} +window.redHPP = redHPP; \ No newline at end of file diff --git a/webAO/dom/setChatbox.ts b/webAO/dom/setChatbox.ts new file mode 100644 index 0000000..6d1a78c --- /dev/null +++ b/webAO/dom/setChatbox.ts @@ -0,0 +1,28 @@ +import { CHATBOX, setCHATBOX } from "../client"; +import chatbox_arr from "../styles/chatbox/chatboxes.js"; +import setCookie from "../utils/setCookie"; + +/** + * Set the style of the chatbox + */ +export function setChatbox(style: string) { + const chatbox_theme = ( + document.getElementById("chatbox_theme") + ); + const themeselect = ( + document.getElementById("client_chatboxselect") + ); + setCHATBOX(themeselect.value); + + setCookie("chatbox", CHATBOX); + if (CHATBOX === "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/${CHATBOX}.css`; + } +} +window.setChatbox = setChatbox; \ No newline at end of file diff --git a/webAO/dom/switchAspectRatio.ts b/webAO/dom/switchAspectRatio.ts new file mode 100644 index 0000000..79d4110 --- /dev/null +++ b/webAO/dom/switchAspectRatio.ts @@ -0,0 +1,19 @@ +/** + * Triggered by the change aspect ratio checkbox + */ +export async function switchAspectRatio() { + const background = document.getElementById("client_gamewindow")!; + const offsetCheck = ( + document.getElementById("client_hdviewport_offset") + ); + if ( + (document.getElementById("client_hdviewport")).checked + ) { + background.style.paddingBottom = "56.25%"; + offsetCheck.disabled = false; + } else { + background.style.paddingBottom = "75%"; + offsetCheck.disabled = true; + } +} +window.switchAspectRatio = switchAspectRatio; \ No newline at end of file diff --git a/webAO/dom/switchChatOffset.ts b/webAO/dom/switchChatOffset.ts new file mode 100644 index 0000000..6552cbd --- /dev/null +++ b/webAO/dom/switchChatOffset.ts @@ -0,0 +1,17 @@ +/** + * Triggered by the change aspect ratio checkbox + */ +export async function switchChatOffset() { + const container = document.getElementById("client_chatcontainer")!; + if ( + (document.getElementById("client_hdviewport_offset")) + .checked + ) { + container.style.width = "80%"; + container.style.left = "10%"; + } else { + container.style.width = "100%"; + container.style.left = "0"; + } +} +window.switchChatOffset = switchChatOffset; \ No newline at end of file diff --git a/webAO/dom/toggleMenu.ts b/webAO/dom/toggleMenu.ts new file mode 100644 index 0000000..6d5e1fc --- /dev/null +++ b/webAO/dom/toggleMenu.ts @@ -0,0 +1,18 @@ +import { selectedMenu, setSelectedMenu } from "../client"; + +/** + * Highlights and selects a menu. + * @param {number} menu the menu to be selected + */ +export function toggleMenu(menu: number) { + if (menu !== selectedMenu) { + document.getElementById(`menu_${menu}`)!.className = "menu_button active"; + document.getElementById(`content_${menu}`)!.className = + "menu_content active"; + document.getElementById(`menu_${selectedMenu}`)!.className = "menu_button"; + document.getElementById(`content_${selectedMenu}`)!.className = + "menu_content"; + setSelectedMenu(menu); + } +} +window.toggleMenu = toggleMenu; diff --git a/webAO/dom/window.ts b/webAO/dom/window.ts new file mode 100644 index 0000000..2535768 --- /dev/null +++ b/webAO/dom/window.ts @@ -0,0 +1,56 @@ +declare global { + interface Window { + toggleShout: (shout: number) => void; + toggleMenu: (menu: number) => void; + updateBackgroundPreview: () => void; + redHPP: () => void; + addHPP: () => void; + redHPD: () => void; + addHPD: () => void; + guilty: () => void; + notguilty: () => void; + initCE: () => void; + initWT: () => void; + callMod: () => void; + randomCharacterOOC: () => void; + changeRoleOOC: () => void; + changeBackgroundOOC: () => void; + updateActionCommands: (side: string) => void; + updateEvidenceIcon: () => void; + resizeChatbox: () => void; + setChatbox: (style: string) => void; + getIndexFromSelect: (select_box: string, value: string) => Number; + cancelEvidence: () => void; + deleteEvidence: () => void; + editEvidence: () => void; + addEvidence: () => void; + pickEvidence: (evidence: any) => void; + pickEmotion: (emo: any) => void; + pickChar: (ccharacter: any) => void; + chartable_filter: (_event: any) => void; + ReconnectButton: (_event: any) => void; + opusCheck: (channel: HTMLAudioElement) => OnErrorEventHandlerNonNull; + imgError: (image: any) => void; + charError: (image: any) => void; + changeCharacter: (_event: any) => void; + switchChatOffset: () => void; + switchAspectRatio: () => void; + switchPanTilt: (addcheck: number) => void; + iniedit: () => void; + modcall_test: () => void; + reloadTheme: () => void; + changeCallwords: () => void; + changeBlipVolume: () => void; + changeMusicVolume: () => void; + area_click: (el: any) => void; + showname_click: (_event: any) => void; + mutelist_click: (_event: any) => void; + musiclist_click: (_event: any) => void; + musiclist_filter: (_event: any) => void; + resetOffset: (_event: any) => void; + onEnter: (event: any) => void; + onReplayGo: (_event: any) => void; + onOOCEnter: (_event: any) => void; + } +} +export { } \ No newline at end of file diff --git a/webAO/viewport.ts b/webAO/viewport.ts index d0e7b77..6c39784 100644 --- a/webAO/viewport.ts +++ b/webAO/viewport.ts @@ -3,7 +3,7 @@ import fileExists from "./utils/fileExists"; import Client, { delay } from "./client"; import {opusCheck} from './dom/opusCheck' import { UPDATE_INTERVAL } from "./client"; -import { setChatbox } from "./client"; +import { setChatbox } from "./dom/setChatbox"; import { resizeChatbox } from "./dom/resizeChatbox"; import transparentPng from "./constants/transparentPng"; import mlConfig from "./utils/aoml"; -- cgit From 9b8f8c3f5310b6af15edf8ff933e2d63e05707a7 Mon Sep 17 00:00:00 2001 From: Caleb Date: Thu, 8 Sep 2022 12:13:14 -0400 Subject: Add Sender support --- webAO/client.ts | 199 +++++++------------------------- webAO/client/sender/index.ts | 39 +++++++ webAO/client/sender/sendIC.ts | 106 +++++++++++++++++ webAO/client/sender/sendSelf.ts | 13 +++ webAO/client/sender/sendServer.ts | 10 ++ webAO/dom/changeBackgroundOOC.ts | 2 +- webAO/dom/changeRoleOOC.ts | 2 +- webAO/dom/onEnter.ts | 2 +- webAO/packets/handlers/handleCC.ts | 2 +- webAO/packets/handlers/handleCI.ts | 2 +- webAO/packets/handlers/handleEI.ts | 2 +- webAO/packets/handlers/handleEM.ts | 2 +- webAO/packets/handlers/handleHI.ts | 4 +- webAO/packets/handlers/handleID.ts | 2 +- webAO/packets/handlers/handlePN.ts | 2 +- webAO/packets/handlers/handleRC.ts | 2 +- webAO/packets/handlers/handleRD.ts | 4 +- webAO/packets/handlers/handleRM.ts | 2 +- webAO/packets/handlers/handleSC.ts | 2 +- webAO/packets/handlers/handleSI.ts | 4 +- webAO/packets/handlers/handleSM.ts | 2 +- webAO/packets/handlers/handleaskchaa.ts | 2 +- 22 files changed, 231 insertions(+), 176 deletions(-) create mode 100644 webAO/client/sender/index.ts create mode 100644 webAO/client/sender/sendIC.ts create mode 100644 webAO/client/sender/sendSelf.ts create mode 100644 webAO/client/sender/sendServer.ts (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 62539ea..4d01cfd 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -7,6 +7,7 @@ import FingerprintJS from "@fingerprintjs/fingerprintjs"; import vanilla_background_arr from "./constants/backgrounds.js"; import vanilla_evidence_arr from "./constants/evidence.js"; +import {sender, ISender} from './client/sender/index' import iniParse from "./iniParse"; import getCookie from "./utils/getCookie"; import setCookie from "./utils/setCookie"; @@ -87,13 +88,18 @@ function isLowMemory() { } const fpPromise = FingerprintJS.load(); +const connect = (address: string) => { +} fpPromise .then((fp) => fp.get()) .then((result) => { hdid = result.visitorId; console.log("NEW CLIENT"); + + // Create the new client and connect it client = new Client(serverIP); + client.connect() isLowMemory(); client.loadResources(); @@ -123,56 +129,51 @@ class Client extends EventEmitter { resources: any; selectedEmote: number; selectedEvidence: number; + sender: ISender; checkUpdater: any; _lastTimeICReceived: any; viewport: Viewport; + connect: () => void; constructor(address: string) { super(); - if (mode !== "replay") { - this.serv = new WebSocket(`ws://${address}`); - // Assign the websocket events - this.serv.addEventListener("open", this.emit.bind(this, "open")); - this.serv.addEventListener("close", this.emit.bind(this, "close")); - this.serv.addEventListener("message", this.emit.bind(this, "message")); - this.serv.addEventListener("error", this.emit.bind(this, "error")); - } else { - this.joinServer(); - } - this.on("open", this.onOpen.bind(this)); - this.on("close", this.onClose.bind(this)); - this.on("message", this.onMessage.bind(this)); - this.on("error", this.onError.bind(this)); - - // Preset some of the variables + this.connect = () => { + this.on("open", this.onOpen.bind(this)); + this.on("close", this.onClose.bind(this)); + this.on("message", this.onMessage.bind(this)); + this.on("error", this.onError.bind(this)); + if (mode !== "replay") { + this.serv = new WebSocket(`ws://${address}`); + // Assign the websocket events + this.serv.addEventListener("open", this.emit.bind(this, "open")); + this.serv.addEventListener("close", this.emit.bind(this, "close")); + this.serv.addEventListener("message", this.emit.bind(this, "message")); + this.serv.addEventListener("error", this.emit.bind(this, "error")); + } else { + this.joinServer(); + } + } this.hp = [0, 0]; - this.playerID = 1; this.charID = -1; this.char_list_length = 0; this.evidence_list_length = 0; this.music_list_length = 0; this.testimonyID = 0; - this.chars = []; this.emotes = []; this.evidences = []; this.areas = []; this.musics = []; - this.musics_time = false; - this.callwords = []; - this.resources = getResources(AO_HOST, THEME); - this.selectedEmote = -1; this.selectedEvidence = 0; - this.checkUpdater = null; + this.sender = sender this.viewport = masterViewport(this); - this._lastTimeICReceived = new Date(0); } @@ -199,13 +200,7 @@ class Client extends EventEmitter { : 0; } - /** - * Hook for sending messages to the server - * @param {string} message the message to send - */ - sendServer(message: string) { - mode === "replay" ? this.sendSelf(message) : this.serv.send(message); - } + /** * Hook for sending messages to the client @@ -216,17 +211,6 @@ class Client extends EventEmitter { setTimeout(() => this.onMessage(message_event), 1); } - /** - * Hook for sending messages to the client - * @param {string} message the message to send - */ - sendSelf(message: string) { - (( - document.getElementById("client_ooclog") - )).value += `${message}\r\n`; - this.handleSelf(message); - } - /** * Sends an out-of-character chat message. * @param {string} message the message to send @@ -253,110 +237,11 @@ class Client extends EventEmitter { // Command Not Recognized } } else { - this.sendServer(`CT#${oocName}#${oocMessage}#%`); + this.sender.sendServer(`CT#${oocName}#${oocMessage}#%`); } } - /** - * Sends an in-character chat message. - * @param {number} deskmod controls the desk - * @param {string} speaking who is speaking - * @param {string} name the name of the current character - * @param {string} silent whether or not it's silent - * @param {string} message the message to be sent - * @param {string} side the name of the side in the background - * @param {string} sfx_name the name of the sound effect - * @param {number} emote_modifier whether or not to zoom - * @param {number} sfx_delay the delay (in milliseconds) to play the sound effect - * @param {number} objection_modifier the number of the shout to play - * @param {string} evidence the filename of evidence to show - * @param {boolean} flip change to 1 to reverse sprite for position changes - * @param {boolean} realization screen flash effect - * @param {number} text_color text color - * @param {string} showname custom name to be displayed (optional) - * @param {number} other_charid paired character (optional) - * @param {number} self_offset offset to paired character (optional) - * @param {number} noninterrupting_preanim play the full preanim (optional) - */ - sendIC( - deskmod: number, - preanim: string, - name: string, - emote: string, - message: string, - side: string, - sfx_name: string, - emote_modifier: number, - sfx_delay: number, - objection_modifier: number, - evidence: number, - flip: boolean, - realization: boolean, - text_color: number, - showname: string, - other_charid: string, - self_hoffset: number, - self_yoffset: number, - noninterrupting_preanim: boolean, - looping_sfx: boolean, - screenshake: boolean, - frame_screenshake: string, - frame_realization: string, - frame_sfx: string, - additive: boolean, - effect: string - ) { - let extra_cccc = ""; - let other_emote = ""; - let other_offset = ""; - let extra_27 = ""; - let extra_28 = ""; - - if (extrafeatures.includes("cccc_ic_support")) { - const self_offset = extrafeatures.includes("y_offset") - ? `${self_hoffset}${self_yoffset}` - : self_hoffset; // HACK: this should be an & but client fucked it up and all the servers adopted it - if (mode === "replay") { - other_emote = "##"; - other_offset = "#0#0"; - } - extra_cccc = `${escapeChat( - showname - )}#${other_charid}${other_emote}#${self_offset}${other_offset}#${Number( - noninterrupting_preanim - )}#`; - - if (extrafeatures.includes("looping_sfx")) { - extra_27 = `${Number(looping_sfx)}#${Number( - screenshake - )}#${frame_screenshake}#${frame_realization}#${frame_sfx}#`; - if (extrafeatures.includes("effects")) { - extra_28 = `${Number(additive)}#${escapeChat(effect)}#`; - } - } - } - const serverMessage = - `MS#${deskmod}#${escapeChat(preanim)}#${escapeChat(name)}#${escapeChat( - emote - )}` + - `#${escapeChat(message)}#${escapeChat(side)}#${escapeChat( - sfx_name - )}#${emote_modifier}` + - `#${this.charID}#${sfx_delay}#${Number(objection_modifier)}#${Number( - evidence - )}#${Number(flip)}#${Number( - realization - )}#${text_color}#${extra_cccc}${extra_27}${extra_28}%`; - - this.sendServer(serverMessage); - if (mode === "replay") { - (( - document.getElementById("client_ooclog") - )).value += `wait#${(document.getElementById("client_replaytimer")).value - }#%\r\n`; - } - } /** * Sends add evidence command. @@ -365,7 +250,7 @@ class Client extends EventEmitter { * @param {string} evidence image filename */ sendPE(name: string, desc: string, img: string) { - this.sendServer( + this.sender.sendServer( `PE#${escapeChat(name)}#${escapeChat(desc)}#${escapeChat(img)}#%` ); } @@ -378,7 +263,7 @@ class Client extends EventEmitter { * @param {string} evidence image filename */ sendEE(id: number, name: string, desc: string, img: string) { - this.sendServer( + this.sender.sendServer( `EE#${id}#${escapeChat(name)}#${escapeChat(desc)}#${escapeChat(img)}#%` ); } @@ -388,16 +273,17 @@ class Client extends EventEmitter { * @param {number} evidence id */ sendDE(id: number) { - this.sendServer(`DE#${id}#%`); + this.sender.sendServer(`DE#${id}#%`); + } - + /** * Sends health point command. * @param {number} side the position * @param {number} hp the health point */ sendHP(side: number, hp: number) { - this.sendServer(`HP#${side}#${hp}#%`); + this.sender.sendServer(`HP#${side}#${hp}#%`); } /** @@ -406,9 +292,9 @@ class Client extends EventEmitter { */ sendZZ(msg: string) { if (extrafeatures.includes("modcall_reason")) { - this.sendServer(`ZZ#${msg}#%`); + this.sender.sendServer(`ZZ#${msg}#%`); } else { - this.sendServer("ZZ#%"); + this.sender.sendServer("ZZ#%"); } } @@ -417,7 +303,7 @@ class Client extends EventEmitter { * @param {string} testimony type */ sendRT(testimony: string) { - this.sendServer(`RT#${testimony}#%`); + this.sender.sendServer(`RT#${testimony}#%`); } /** @@ -425,7 +311,7 @@ class Client extends EventEmitter { * @param {string} track the track ID */ sendMusicChange(track: string) { - this.sendServer(`MC#${track}#${this.charID}#%`); + this.sender.sendServer(`MC#${track}#${this.charID}#%`); } /** @@ -433,8 +319,9 @@ class Client extends EventEmitter { * to the server. */ joinServer() { - this.sendServer(`HI#${hdid}#%`); - this.sendServer("ID#webAO#webAO#%"); + console.log(this.sender) + this.sender.sendServer(`HI#${hdid}#%`); + this.sender.sendServer("ID#webAO#webAO#%"); if (mode !== "replay") { this.checkUpdater = setInterval(() => this.sendCheck(), 5000); } @@ -518,7 +405,7 @@ class Client extends EventEmitter { */ sendCharacter(character: number) { if (character === -1 || this.chars[character].name) { - this.sendServer(`CC#${this.playerID}#${character}#web#%`); + this.sender.sendServer(`CC#${this.playerID}#${character}#web#%`); } } @@ -527,14 +414,14 @@ class Client extends EventEmitter { * @param {number?} song the song to be played */ sendMusic(song: string) { - this.sendServer(`MC#${song}#${this.charID}#%`); + this.sender.sendServer(`MC#${song}#${this.charID}#%`); } /** * Sends a keepalive packet. */ sendCheck() { - this.sendServer(`CH#${this.charID}#%`); + this.sender.sendServer(`CH#${this.charID}#%`); } /** diff --git a/webAO/client/sender/index.ts b/webAO/client/sender/index.ts new file mode 100644 index 0000000..ce5b488 --- /dev/null +++ b/webAO/client/sender/index.ts @@ -0,0 +1,39 @@ +import { sendIC } from "./sendIC"; +import { sendSelf } from './sendSelf' +import { sendServer } from './sendServer' +export interface ISender { + sendIC: (deskmod: number, + preanim: string, + name: string, + emote: string, + message: string, + side: string, + sfx_name: string, + emote_modifier: number, + sfx_delay: number, + objection_modifier: number, + evidence: number, + flip: boolean, + realization: boolean, + text_color: number, + showname: string, + other_charid: string, + self_hoffset: number, + self_yoffset: number, + noninterrupting_preanim: boolean, + looping_sfx: boolean, + screenshake: boolean, + frame_screenshake: string, + frame_realization: string, + frame_sfx: string, + additive: boolean, + effect: string) => void + sendSelf: (message: string) => void + sendServer: (message: string) => void +} +export const sender = { + sendIC, + sendSelf, + sendServer + +} \ No newline at end of file diff --git a/webAO/client/sender/sendIC.ts b/webAO/client/sender/sendIC.ts new file mode 100644 index 0000000..9064115 --- /dev/null +++ b/webAO/client/sender/sendIC.ts @@ -0,0 +1,106 @@ +import { extrafeatures } from "../../client"; +import { escapeChat } from "../../encoding"; +import {client} from '../../client' +import queryParser from "../../utils/queryParser"; +let {mode} = queryParser() + +/** + * Sends an in-character chat message. + * @param {number} deskmod controls the desk + * @param {string} speaking who is speaking + * @param {string} name the name of the current character + * @param {string} silent whether or not it's silent + * @param {string} message the message to be sent + * @param {string} side the name of the side in the background + * @param {string} sfx_name the name of the sound effect + * @param {number} emote_modifier whether or not to zoom + * @param {number} sfx_delay the delay (in milliseconds) to play the sound effect + * @param {number} objection_modifier the number of the shout to play + * @param {string} evidence the filename of evidence to show + * @param {boolean} flip change to 1 to reverse sprite for position changes + * @param {boolean} realization screen flash effect + * @param {number} text_color text color + * @param {string} showname custom name to be displayed (optional) + * @param {number} other_charid paired character (optional) + * @param {number} self_offset offset to paired character (optional) + * @param {number} noninterrupting_preanim play the full preanim (optional) + */ +export const sendIC = ( + deskmod: number, + preanim: string, + name: string, + emote: string, + message: string, + side: string, + sfx_name: string, + emote_modifier: number, + sfx_delay: number, + objection_modifier: number, + evidence: number, + flip: boolean, + realization: boolean, + text_color: number, + showname: string, + other_charid: string, + self_hoffset: number, + self_yoffset: number, + noninterrupting_preanim: boolean, + looping_sfx: boolean, + screenshake: boolean, + frame_screenshake: string, + frame_realization: string, + frame_sfx: string, + additive: boolean, + effect: string +) => { + let extra_cccc = ""; + let other_emote = ""; + let other_offset = ""; + let extra_27 = ""; + let extra_28 = ""; + + if (extrafeatures.includes("cccc_ic_support")) { + const self_offset = extrafeatures.includes("y_offset") + ? `${self_hoffset}${self_yoffset}` + : self_hoffset; // HACK: this should be an & but client fucked it up and all the servers adopted it + if (mode === "replay") { + other_emote = "##"; + other_offset = "#0#0"; + } + extra_cccc = `${escapeChat( + showname + )}#${other_charid}${other_emote}#${self_offset}${other_offset}#${Number( + noninterrupting_preanim + )}#`; + + if (extrafeatures.includes("looping_sfx")) { + extra_27 = `${Number(looping_sfx)}#${Number( + screenshake + )}#${frame_screenshake}#${frame_realization}#${frame_sfx}#`; + if (extrafeatures.includes("effects")) { + extra_28 = `${Number(additive)}#${escapeChat(effect)}#`; + } + } + } + + const serverMessage = + `MS#${deskmod}#${escapeChat(preanim)}#${escapeChat(name)}#${escapeChat( + emote + )}` + + `#${escapeChat(message)}#${escapeChat(side)}#${escapeChat( + sfx_name + )}#${emote_modifier}` + + `#${client.charID}#${sfx_delay}#${Number(objection_modifier)}#${Number( + evidence + )}#${Number(flip)}#${Number( + realization + )}#${text_color}#${extra_cccc}${extra_27}${extra_28}%`; + + client.sender.sendServer(serverMessage); + if (mode === "replay") { + (( + document.getElementById("client_ooclog") + )).value += `wait#${(document.getElementById("client_replaytimer")).value + }#%\r\n`; + } +} \ No newline at end of file diff --git a/webAO/client/sender/sendSelf.ts b/webAO/client/sender/sendSelf.ts new file mode 100644 index 0000000..66c35fa --- /dev/null +++ b/webAO/client/sender/sendSelf.ts @@ -0,0 +1,13 @@ +import { client } from "../../client"; + + +/** + * Hook for sending messages to the client + * @param {string} message the message to send + */ +export const sendSelf = (message: string) => { + (( + document.getElementById("client_ooclog") + )).value += `${message}\r\n`; + client.handleSelf(message); +} \ No newline at end of file diff --git a/webAO/client/sender/sendServer.ts b/webAO/client/sender/sendServer.ts new file mode 100644 index 0000000..a9da3bd --- /dev/null +++ b/webAO/client/sender/sendServer.ts @@ -0,0 +1,10 @@ +import { client } from "../../client"; +import queryParser from "../../utils/queryParser"; +let { mode } = queryParser() +/** + * Hook for sending messages to the server + * @param {string} message the message to send + */ +export const sendServer = (message: string) => { + mode === "replay" ? client.sender.sendSelf(message) : client.serv.send(message); +} \ No newline at end of file diff --git a/webAO/dom/changeBackgroundOOC.ts b/webAO/dom/changeBackgroundOOC.ts index f840729..ff5aaaa 100644 --- a/webAO/dom/changeBackgroundOOC.ts +++ b/webAO/dom/changeBackgroundOOC.ts @@ -22,7 +22,7 @@ export function changeBackgroundOOC() { if (mode === "join") { client.sendOOC(`/${changeBGCommand.replace("$1", filename)}`); } else if (mode === "replay") { - client.sendSelf(`BN#${filename}#%`); + client.sender.sendSelf(`BN#${filename}#%`); } } window.changeBackgroundOOC = changeBackgroundOOC; \ No newline at end of file diff --git a/webAO/dom/changeRoleOOC.ts b/webAO/dom/changeRoleOOC.ts index d838cb3..ec7b65d 100644 --- a/webAO/dom/changeRoleOOC.ts +++ b/webAO/dom/changeRoleOOC.ts @@ -7,7 +7,7 @@ export function changeRoleOOC() { const roleselect = document.getElementById("role_select"); client.sendOOC(`/pos ${roleselect.value}`); - client.sendServer(`SP#${roleselect.value}#%`); + client.sender.sendServer(`SP#${roleselect.value}#%`); updateActionCommands(roleselect.value); } window.changeRoleOOC = changeRoleOOC; \ No newline at end of file diff --git a/webAO/dom/onEnter.ts b/webAO/dom/onEnter.ts index 01fbbd5..5ab532c 100644 --- a/webAO/dom/onEnter.ts +++ b/webAO/dom/onEnter.ts @@ -69,7 +69,7 @@ import { escapeChat } from "../encoding"; emote_mod = 0; } - client.sendIC( + client.sender.sendIC( myemo.deskmod, myemo.preanim, mychar.name, diff --git a/webAO/packets/handlers/handleCC.ts b/webAO/packets/handlers/handleCC.ts index 84e6ec0..36bcdc7 100644 --- a/webAO/packets/handlers/handleCC.ts +++ b/webAO/packets/handlers/handleCC.ts @@ -5,5 +5,5 @@ import { client } from "../../client"; * @param {Array} args packet arguments */ export const handleCC = (args: string[]) => { - client.sendSelf(`PV#1#CID#${args[2]}#%`); + client.sender.sendSelf(`PV#1#CID#${args[2]}#%`); } \ No newline at end of file diff --git a/webAO/packets/handlers/handleCI.ts b/webAO/packets/handlers/handleCI.ts index 74d3039..53e42f7 100644 --- a/webAO/packets/handlers/handleCI.ts +++ b/webAO/packets/handlers/handleCI.ts @@ -22,5 +22,5 @@ export const handleCI = (args: string[]) => { } } // Request the next pack - client.sendServer(`AN#${Number(args[1]) / 10 + 1}#%`); + client.sender.sendServer(`AN#${Number(args[1]) / 10 + 1}#%`); } \ No newline at end of file diff --git a/webAO/packets/handlers/handleEI.ts b/webAO/packets/handlers/handleEI.ts index c74e4d4..428baf1 100644 --- a/webAO/packets/handlers/handleEI.ts +++ b/webAO/packets/handlers/handleEI.ts @@ -26,5 +26,5 @@ export const handleEI = (args: string[]) => { icon: `${AO_HOST}evidence/${encodeURI(arg[3].toLowerCase())}`, }; - client.sendServer("AE" + (evidenceID + 1) + "#%"); + client.sender.sendServer("AE" + (evidenceID + 1) + "#%"); } \ No newline at end of file diff --git a/webAO/packets/handlers/handleEM.ts b/webAO/packets/handlers/handleEM.ts index 973d2af..9f3cb87 100644 --- a/webAO/packets/handlers/handleEM.ts +++ b/webAO/packets/handlers/handleEM.ts @@ -35,5 +35,5 @@ export const handleEM = (args: string[]) => { } // get the next batch of tracks - client.sendServer(`AM#${Number(args[1]) / 10 + 1}#%`); + client.sender.sendServer(`AM#${Number(args[1]) / 10 + 1}#%`); } \ No newline at end of file diff --git a/webAO/packets/handlers/handleHI.ts b/webAO/packets/handlers/handleHI.ts index d15be0d..b4f00a8 100644 --- a/webAO/packets/handlers/handleHI.ts +++ b/webAO/packets/handlers/handleHI.ts @@ -7,8 +7,8 @@ const version = process.env.npm_package_version; * @param {Array} args packet arguments */ export const handleHI = (_args: string[]) => { - client.sendSelf(`ID#1#webAO#${version}#%`); - client.sendSelf( + client.sender.sendSelf(`ID#1#webAO#${version}#%`); + client.sender.sendSelf( "FL#fastloading#yellowtext#cccc_ic_support#flipping#looping_sfx#effects#%" ); } diff --git a/webAO/packets/handlers/handleID.ts b/webAO/packets/handlers/handleID.ts index 7def483..cd7b6ed 100644 --- a/webAO/packets/handlers/handleID.ts +++ b/webAO/packets/handlers/handleID.ts @@ -13,7 +13,7 @@ export const handleID = (args: string[]) => { serverVersion = args[2].split("&")[1]; } else if (serverSoftware === "webAO") { setOldLoading(false); - client.sendSelf("PN#0#1#%"); + client.sender.sendSelf("PN#0#1#%"); } else { serverVersion = args[3]; } diff --git a/webAO/packets/handlers/handlePN.ts b/webAO/packets/handlers/handlePN.ts index b16f77d..1b66fb9 100644 --- a/webAO/packets/handlers/handlePN.ts +++ b/webAO/packets/handlers/handlePN.ts @@ -5,5 +5,5 @@ import { client } from "../../client"; * @param {Array} args packet arguments */ export const handlePN = (_args: string[]) => { - client.sendServer("askchaa#%"); + client.sender.sendServer("askchaa#%"); } \ No newline at end of file diff --git a/webAO/packets/handlers/handleRC.ts b/webAO/packets/handlers/handleRC.ts index 92c1e8e..0b5679f 100644 --- a/webAO/packets/handlers/handleRC.ts +++ b/webAO/packets/handlers/handleRC.ts @@ -6,5 +6,5 @@ import vanilla_character_arr from "../../constants/characters.js"; * @param {Array} args packet arguments */ export const handleRC = (_args: string[]) => { - client.sendSelf(`SC#${vanilla_character_arr.join("#")}#%`); + client.sender.sendSelf(`SC#${vanilla_character_arr.join("#")}#%`); } \ No newline at end of file diff --git a/webAO/packets/handlers/handleRD.ts b/webAO/packets/handlers/handleRD.ts index 780b43f..dde994c 100644 --- a/webAO/packets/handlers/handleRD.ts +++ b/webAO/packets/handlers/handleRD.ts @@ -6,8 +6,8 @@ import { client } from "../../client"; * @param {Array} args packet arguments */ export const handleRD = (_args: string[]) => { - client.sendSelf("BN#gs4#%"); - client.sendSelf("DONE#%"); + client.sender.sendSelf("BN#gs4#%"); + client.sender.sendSelf("DONE#%"); const ooclog = document.getElementById("client_ooclog"); ooclog.value = ""; ooclog.readOnly = false; diff --git a/webAO/packets/handlers/handleRM.ts b/webAO/packets/handlers/handleRM.ts index 41a78b4..c18821b 100644 --- a/webAO/packets/handlers/handleRM.ts +++ b/webAO/packets/handlers/handleRM.ts @@ -6,5 +6,5 @@ import vanilla_music_arr from "../../constants/music.js"; * @param {Array} args packet arguments */ export const handleRM = (_args: string[]) => { - client.sendSelf(`SM#${vanilla_music_arr.join("#")}#%`); + client.sender.sendSelf(`SM#${vanilla_music_arr.join("#")}#%`); } \ No newline at end of file diff --git a/webAO/packets/handlers/handleSC.ts b/webAO/packets/handlers/handleSC.ts index 3689a17..f4953e0 100644 --- a/webAO/packets/handlers/handleSC.ts +++ b/webAO/packets/handlers/handleSC.ts @@ -33,5 +33,5 @@ export const handleSC = async (args: string[]) => { client.handleCharacterInfo(chargs, charid); } // We're done with the characters, request the music - client.sendServer("RM#%"); + client.sender.sendServer("RM#%"); } \ No newline at end of file diff --git a/webAO/packets/handlers/handleSI.ts b/webAO/packets/handlers/handleSI.ts index e040c83..b32fbc1 100644 --- a/webAO/packets/handlers/handleSI.ts +++ b/webAO/packets/handlers/handleSI.ts @@ -34,8 +34,8 @@ export const handleSI = (args: string[]) => { // this is determined at the top of this file if (!oldLoading && extrafeatures.includes("fastloading")) { - client.sendServer("RC#%"); + client.sender.sendServer("RC#%"); } else { - client.sendServer("askchar2#%"); + client.sender.sendServer("askchar2#%"); } } \ No newline at end of file diff --git a/webAO/packets/handlers/handleSM.ts b/webAO/packets/handlers/handleSM.ts index 5dab83e..48f9cd9 100644 --- a/webAO/packets/handlers/handleSM.ts +++ b/webAO/packets/handlers/handleSM.ts @@ -32,5 +32,5 @@ export const handleSM = (args: string[]) => { } // Music done, carry on - client.sendServer("RD#%"); + client.sender.sendServer("RD#%"); } diff --git a/webAO/packets/handlers/handleaskchaa.ts b/webAO/packets/handlers/handleaskchaa.ts index 5930bf0..0f9e730 100644 --- a/webAO/packets/handlers/handleaskchaa.ts +++ b/webAO/packets/handlers/handleaskchaa.ts @@ -6,5 +6,5 @@ import vanilla_character_arr from "../../constants/characters.js"; * @param {Array} args packet arguments */ export const handleaskchaa = (_args: string[]) => { - client.sendSelf(`SI#${vanilla_character_arr.length}#0#0#%`); + client.sender.sendSelf(`SI#${vanilla_character_arr.length}#0#0#%`); } -- cgit From 776fe2f4241a67be354908df546f300f413a7d42 Mon Sep 17 00:00:00 2001 From: Caleb Date: Thu, 8 Sep 2022 22:20:32 -0400 Subject: I'm so sorry --- webAO/client.ts | 130 +-------------------------------- webAO/client/sender/index.ts | 33 ++++++++- webAO/client/sender/sendCharacter.ts | 11 +++ webAO/client/sender/sendCheck.ts | 8 ++ webAO/client/sender/sendDE.ts | 9 +++ webAO/client/sender/sendEE.ts | 16 ++++ webAO/client/sender/sendHP.ts | 10 +++ webAO/client/sender/sendMusic.ts | 10 +++ webAO/client/sender/sendMusicChange.ts | 10 +++ webAO/client/sender/sendOOC.ts | 33 +++++++++ webAO/client/sender/sendPE.ts | 14 ++++ webAO/client/sender/sendRT.ts | 9 +++ webAO/client/sender/sendZZ.ts | 13 ++++ webAO/dom/addEvidence.ts | 2 +- webAO/dom/addHPD.ts | 2 +- webAO/dom/addHPP.ts | 2 +- webAO/dom/areaClick.ts | 2 +- webAO/dom/callMod.ts | 2 +- webAO/dom/changeBackgroundOOC.ts | 2 +- webAO/dom/changeRoleOOC.ts | 2 +- webAO/dom/deleteEvidence.ts | 2 +- webAO/dom/editEvidence.ts | 2 +- webAO/dom/guilty.ts | 2 +- webAO/dom/initCE.ts | 2 +- webAO/dom/initWT.ts | 2 +- webAO/dom/musicListClick.ts | 2 +- webAO/dom/notGuilty.ts | 2 +- webAO/dom/onOOCEnter.ts | 3 +- webAO/dom/pickChar.ts | 2 +- webAO/dom/randomCharacterOOC.ts | 2 +- webAO/dom/redHPD.ts | 2 +- webAO/dom/redHPP.ts | 2 +- 32 files changed, 194 insertions(+), 151 deletions(-) create mode 100644 webAO/client/sender/sendCharacter.ts create mode 100644 webAO/client/sender/sendCheck.ts create mode 100644 webAO/client/sender/sendDE.ts create mode 100644 webAO/client/sender/sendEE.ts create mode 100644 webAO/client/sender/sendHP.ts create mode 100644 webAO/client/sender/sendMusic.ts create mode 100644 webAO/client/sender/sendMusicChange.ts create mode 100644 webAO/client/sender/sendOOC.ts create mode 100644 webAO/client/sender/sendPE.ts create mode 100644 webAO/client/sender/sendRT.ts create mode 100644 webAO/client/sender/sendZZ.ts (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 4d01cfd..e92489c 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -211,109 +211,6 @@ class Client extends EventEmitter { setTimeout(() => this.onMessage(message_event), 1); } - /** - * Sends an out-of-character chat message. - * @param {string} message the message to send - */ - sendOOC(message: string) { - setCookie( - "OOC_name", - (document.getElementById("OOC_name")).value - ); - const oocName = `${escapeChat( - (document.getElementById("OOC_name")).value - )}`; - const oocMessage = `${escapeChat(message)}`; - - const commands = { - "/save_chatlog": this.saveChatlogHandle, - }; - const commandsMap = new Map(Object.entries(commands)); - - if (oocMessage && commandsMap.has(oocMessage.toLowerCase())) { - try { - commandsMap.get(oocMessage.toLowerCase())(); - } catch (e) { - // Command Not Recognized - } - } else { - this.sender.sendServer(`CT#${oocName}#${oocMessage}#%`); - } - } - - - - /** - * Sends add evidence command. - * @param {string} evidence name - * @param {string} evidence description - * @param {string} evidence image filename - */ - sendPE(name: string, desc: string, img: string) { - this.sender.sendServer( - `PE#${escapeChat(name)}#${escapeChat(desc)}#${escapeChat(img)}#%` - ); - } - - /** - * Sends edit evidence command. - * @param {number} evidence id - * @param {string} evidence name - * @param {string} evidence description - * @param {string} evidence image filename - */ - sendEE(id: number, name: string, desc: string, img: string) { - this.sender.sendServer( - `EE#${id}#${escapeChat(name)}#${escapeChat(desc)}#${escapeChat(img)}#%` - ); - } - - /** - * Sends delete evidence command. - * @param {number} evidence id - */ - sendDE(id: number) { - this.sender.sendServer(`DE#${id}#%`); - - } - - /** - * Sends health point command. - * @param {number} side the position - * @param {number} hp the health point - */ - sendHP(side: number, hp: number) { - this.sender.sendServer(`HP#${side}#${hp}#%`); - } - - /** - * Sends call mod command. - * @param {string} message to mod - */ - sendZZ(msg: string) { - if (extrafeatures.includes("modcall_reason")) { - this.sender.sendServer(`ZZ#${msg}#%`); - } else { - this.sender.sendServer("ZZ#%"); - } - } - - /** - * Sends testimony command. - * @param {string} testimony type - */ - sendRT(testimony: string) { - this.sender.sendServer(`RT#${testimony}#%`); - } - - /** - * Requests to change the music to the specified track. - * @param {string} track the track ID - */ - sendMusicChange(track: string) { - this.sender.sendServer(`MC#${track}#${this.charID}#%`); - } - /** * Begins the handshake process by sending an identifier * to the server. @@ -323,7 +220,7 @@ class Client extends EventEmitter { this.sender.sendServer(`HI#${hdid}#%`); this.sender.sendServer("ID#webAO#webAO#%"); if (mode !== "replay") { - this.checkUpdater = setInterval(() => this.sendCheck(), 5000); + this.checkUpdater = setInterval(() => this.sender.sendCheck(), 5000); } } @@ -399,31 +296,6 @@ class Client extends EventEmitter { getCookie("callwords"); } - /** - * Requests to play as a specified character. - * @param {number} character the character ID - */ - sendCharacter(character: number) { - if (character === -1 || this.chars[character].name) { - this.sender.sendServer(`CC#${this.playerID}#${character}#web#%`); - } - } - - /** - * Requests to select a music track. - * @param {number?} song the song to be played - */ - sendMusic(song: string) { - this.sender.sendServer(`MC#${song}#${this.charID}#%`); - } - - /** - * Sends a keepalive packet. - */ - sendCheck() { - this.sender.sendServer(`CH#${this.charID}#%`); - } - /** * Triggered when a connection is established to the server. */ diff --git a/webAO/client/sender/index.ts b/webAO/client/sender/index.ts index ce5b488..41a6bd5 100644 --- a/webAO/client/sender/index.ts +++ b/webAO/client/sender/index.ts @@ -1,6 +1,16 @@ import { sendIC } from "./sendIC"; import { sendSelf } from './sendSelf' import { sendServer } from './sendServer' +import { sendCheck } from './sendCheck' +import {sendHP} from './sendHP' +import {sendOOC} from './sendOOC' +import {sendCharacter} from './sendCharacter' +import {sendRT} from './sendRT' +import {sendMusicChange} from './sendMusicChange' +import {sendZZ} from './sendZZ' +import {sendEE} from './sendEE' +import {sendDE} from './sendDE' +import {sendPE} from './sendPE' export interface ISender { sendIC: (deskmod: number, preanim: string, @@ -30,10 +40,29 @@ export interface ISender { effect: string) => void sendSelf: (message: string) => void sendServer: (message: string) => void + sendCheck: () => void + sendHP: (side: number, hp: number) => void + sendOOC: (message: string) => void + sendCharacter: (character: number) => void + sendRT: (testimony: string) => void + sendMusicChange: (track: string) => void + sendZZ: (msg: string) => void + sendEE: (id: number, name: string, desc: string, img: string) => void + sendDE: (id: number) => void + sendPE: (name: string, desc: string, img: string) => void } export const sender = { sendIC, sendSelf, - sendServer - + sendServer, + sendCheck, + sendHP, + sendOOC, + sendCharacter, + sendRT, + sendMusicChange, + sendZZ, + sendEE, + sendDE, + sendPE } \ No newline at end of file diff --git a/webAO/client/sender/sendCharacter.ts b/webAO/client/sender/sendCharacter.ts new file mode 100644 index 0000000..5e81727 --- /dev/null +++ b/webAO/client/sender/sendCharacter.ts @@ -0,0 +1,11 @@ +import { client } from "../../client"; + +/** + * Requests to play as a specified character. + * @param {number} character the character ID + */ +export const sendCharacter = (character: number) => { + if (character === -1 || client.chars[character].name) { + client.sender.sendServer(`CC#${client.playerID}#${character}#web#%`); + } +} \ No newline at end of file diff --git a/webAO/client/sender/sendCheck.ts b/webAO/client/sender/sendCheck.ts new file mode 100644 index 0000000..91b3a02 --- /dev/null +++ b/webAO/client/sender/sendCheck.ts @@ -0,0 +1,8 @@ +import { client } from "../../client"; + +/** + * Sends a keepalive packet. + */ +export const sendCheck = () => { + client.sender.sendServer(`CH#${client.charID}#%`); +} diff --git a/webAO/client/sender/sendDE.ts b/webAO/client/sender/sendDE.ts new file mode 100644 index 0000000..4d94d65 --- /dev/null +++ b/webAO/client/sender/sendDE.ts @@ -0,0 +1,9 @@ +import { client } from "../../client"; + +/** + * Sends delete evidence command. + * @param {number} evidence id + */ +export const sendDE = (id: number) => { + client.sender.sendServer(`DE#${id}#%`); +} \ No newline at end of file diff --git a/webAO/client/sender/sendEE.ts b/webAO/client/sender/sendEE.ts new file mode 100644 index 0000000..7c5bfe3 --- /dev/null +++ b/webAO/client/sender/sendEE.ts @@ -0,0 +1,16 @@ +import { client } from "../../client"; +import { escapeChat } from "../../encoding"; + + +/** + * Sends edit evidence command. + * @param {number} evidence id + * @param {string} evidence name + * @param {string} evidence description + * @param {string} evidence image filename + */ +export const sendEE = (id: number, name: string, desc: string, img: string) => { + client.sender.sendServer( + `EE#${id}#${escapeChat(name)}#${escapeChat(desc)}#${escapeChat(img)}#%` + ); +} \ No newline at end of file diff --git a/webAO/client/sender/sendHP.ts b/webAO/client/sender/sendHP.ts new file mode 100644 index 0000000..d007094 --- /dev/null +++ b/webAO/client/sender/sendHP.ts @@ -0,0 +1,10 @@ +import { client } from "../../client"; + +/** + * Sends health point command. + * @param {number} side the position + * @param {number} hp the health point + */ +export const sendHP = (side: number, hp: number) => { + client.sender.sendServer(`HP#${side}#${hp}#%`); +} \ No newline at end of file diff --git a/webAO/client/sender/sendMusic.ts b/webAO/client/sender/sendMusic.ts new file mode 100644 index 0000000..eceba08 --- /dev/null +++ b/webAO/client/sender/sendMusic.ts @@ -0,0 +1,10 @@ +import { client } from "../../client"; + + +/** + * Requests to select a music track. + * @param {number?} song the song to be played + */ +export const sendMusic = (song: string) => { + client.sender.sendServer(`MC#${song}#${client.charID}#%`); +} \ No newline at end of file diff --git a/webAO/client/sender/sendMusicChange.ts b/webAO/client/sender/sendMusicChange.ts new file mode 100644 index 0000000..50c6306 --- /dev/null +++ b/webAO/client/sender/sendMusicChange.ts @@ -0,0 +1,10 @@ +import { client } from "../../client"; + + +/** + * Requests to change the music to the specified track. + * @param {string} track the track ID + */ +export const sendMusicChange = (track: string) => { + client.sender.sendServer(`MC#${track}#${client.charID}#%`); +} diff --git a/webAO/client/sender/sendOOC.ts b/webAO/client/sender/sendOOC.ts new file mode 100644 index 0000000..a410b5f --- /dev/null +++ b/webAO/client/sender/sendOOC.ts @@ -0,0 +1,33 @@ +import { client } from '../../client' +import { escapeChat } from '../../encoding'; +import setCookie from '../../utils/setCookie'; + +/** + * Sends an out-of-character chat message. + * @param {string} message the message to send + */ +export const sendOOC = (message: string) => { + setCookie( + "OOC_name", + (document.getElementById("OOC_name")).value + ); + const oocName = `${escapeChat( + (document.getElementById("OOC_name")).value + )}`; + const oocMessage = `${escapeChat(message)}`; + + const commands = { + "/save_chatlog": client.saveChatlogHandle, + }; + const commandsMap = new Map(Object.entries(commands)); + + if (oocMessage && commandsMap.has(oocMessage.toLowerCase())) { + try { + commandsMap.get(oocMessage.toLowerCase())(); + } catch (e) { + // Command Not Recognized + } + } else { + client.sender.sendServer(`CT#${oocName}#${oocMessage}#%`); + } +} \ No newline at end of file diff --git a/webAO/client/sender/sendPE.ts b/webAO/client/sender/sendPE.ts new file mode 100644 index 0000000..984fc4d --- /dev/null +++ b/webAO/client/sender/sendPE.ts @@ -0,0 +1,14 @@ +import { client } from "../../client"; +import { escapeChat } from "../../encoding"; + +/** + * Sends add evidence command. + * @param {string} evidence name + * @param {string} evidence description + * @param {string} evidence image filename + */ +export const sendPE = (name: string, desc: string, img: string) => { + client.sender.sendServer( + `PE#${escapeChat(name)}#${escapeChat(desc)}#${escapeChat(img)}#%` + ); +} \ No newline at end of file diff --git a/webAO/client/sender/sendRT.ts b/webAO/client/sender/sendRT.ts new file mode 100644 index 0000000..2d6c60a --- /dev/null +++ b/webAO/client/sender/sendRT.ts @@ -0,0 +1,9 @@ +import { client } from "../../client"; + +/** + * Sends testimony command. + * @param {string} testimony type + */ +export const sendRT = (testimony: string) => { + client.sender.sendServer(`RT#${testimony}#%`); +} \ No newline at end of file diff --git a/webAO/client/sender/sendZZ.ts b/webAO/client/sender/sendZZ.ts new file mode 100644 index 0000000..237ab37 --- /dev/null +++ b/webAO/client/sender/sendZZ.ts @@ -0,0 +1,13 @@ +import { client, extrafeatures } from "../../client"; + +/** + * Sends call mod command. + * @param {string} message to mod + */ +export const sendZZ = (msg: string) => { + if (extrafeatures.includes("modcall_reason")) { + client.sender.sendServer(`ZZ#${msg}#%`); + } else { + client.sender.sendServer("ZZ#%"); + } +} \ No newline at end of file diff --git a/webAO/dom/addEvidence.ts b/webAO/dom/addEvidence.ts index 89bb4d5..8a13f06 100644 --- a/webAO/dom/addEvidence.ts +++ b/webAO/dom/addEvidence.ts @@ -8,7 +8,7 @@ import { cancelEvidence } from "./cancelEvidence"; const evidence_select = ( document.getElementById("evi_select") ); - client.sendPE( + client.sender.sendPE( (document.getElementById("evi_name")).value, (document.getElementById("evi_desc")).value, evidence_select.selectedIndex === 0 diff --git a/webAO/dom/addHPD.ts b/webAO/dom/addHPD.ts index 12d1c07..8f7e1f7 100644 --- a/webAO/dom/addHPD.ts +++ b/webAO/dom/addHPD.ts @@ -4,6 +4,6 @@ import { client } from "../client"; * Increment defense health point. */ export function addHPD() { - client.sendHP(1, client.hp[0] + 1); + client.sender.sendHP(1, client.hp[0] + 1); } window.addHPD = addHPD; \ No newline at end of file diff --git a/webAO/dom/addHPP.ts b/webAO/dom/addHPP.ts index 4a1521c..1379f7c 100644 --- a/webAO/dom/addHPP.ts +++ b/webAO/dom/addHPP.ts @@ -4,6 +4,6 @@ import { client } from "../client"; * Increment prosecution health point. */ export function addHPP() { - client.sendHP(2, client.hp[1] + 1); + client.sender.sendHP(2, client.hp[1] + 1); } window.addHPP = addHPP; \ No newline at end of file diff --git a/webAO/dom/areaClick.ts b/webAO/dom/areaClick.ts index 6c3ff6b..1b0fe52 100644 --- a/webAO/dom/areaClick.ts +++ b/webAO/dom/areaClick.ts @@ -5,7 +5,7 @@ import { client } from '../client' */ export function area_click(el: HTMLElement) { const area = client.areas[el.id.substr(4)].name; - client.sendMusicChange(area); + client.sender.sendMusicChange(area); const areaHr = document.createElement("div"); areaHr.className = "hrtext"; diff --git a/webAO/dom/callMod.ts b/webAO/dom/callMod.ts index 0c52433..a2e2685 100644 --- a/webAO/dom/callMod.ts +++ b/webAO/dom/callMod.ts @@ -10,7 +10,7 @@ export function callMod() { if (modcall == null || modcall === "") { // cancel } else { - client.sendZZ(modcall); + client.sender.sendZZ(modcall); } } window.callMod = callMod; \ No newline at end of file diff --git a/webAO/dom/changeBackgroundOOC.ts b/webAO/dom/changeBackgroundOOC.ts index ff5aaaa..1608ebe 100644 --- a/webAO/dom/changeBackgroundOOC.ts +++ b/webAO/dom/changeBackgroundOOC.ts @@ -20,7 +20,7 @@ export function changeBackgroundOOC() { if (mode === "join") { - client.sendOOC(`/${changeBGCommand.replace("$1", filename)}`); + client.sender.sendOOC(`/${changeBGCommand.replace("$1", filename)}`); } else if (mode === "replay") { client.sender.sendSelf(`BN#${filename}#%`); } diff --git a/webAO/dom/changeRoleOOC.ts b/webAO/dom/changeRoleOOC.ts index ec7b65d..7d89bee 100644 --- a/webAO/dom/changeRoleOOC.ts +++ b/webAO/dom/changeRoleOOC.ts @@ -6,7 +6,7 @@ import { client } from '../client' export function changeRoleOOC() { const roleselect = document.getElementById("role_select"); - client.sendOOC(`/pos ${roleselect.value}`); + client.sender.sendOOC(`/pos ${roleselect.value}`); client.sender.sendServer(`SP#${roleselect.value}#%`); updateActionCommands(roleselect.value); } diff --git a/webAO/dom/deleteEvidence.ts b/webAO/dom/deleteEvidence.ts index f007cdf..cd299e4 100644 --- a/webAO/dom/deleteEvidence.ts +++ b/webAO/dom/deleteEvidence.ts @@ -6,7 +6,7 @@ import { cancelEvidence } from "./cancelEvidence"; */ export function deleteEvidence() { const id = client.selectedEvidence - 1; - client.sendDE(id); + client.sender.sendDE(id); cancelEvidence(); } window.deleteEvidence = deleteEvidence; \ No newline at end of file diff --git a/webAO/dom/editEvidence.ts b/webAO/dom/editEvidence.ts index 2cc4565..931caad 100644 --- a/webAO/dom/editEvidence.ts +++ b/webAO/dom/editEvidence.ts @@ -9,7 +9,7 @@ export function editEvidence() { document.getElementById("evi_select") ); const id = client.selectedEvidence - 1; - client.sendEE( + client.sender.sendEE( id, (document.getElementById("evi_name")).value, (document.getElementById("evi_desc")).value, diff --git a/webAO/dom/guilty.ts b/webAO/dom/guilty.ts index f7fa5b8..f008065 100644 --- a/webAO/dom/guilty.ts +++ b/webAO/dom/guilty.ts @@ -4,6 +4,6 @@ import { client } from "../client"; * Declare the defendant not guilty */ export function guilty() { - client.sendRT("judgeruling#1"); + client.sender.sendRT("judgeruling#1"); } window.guilty = guilty; \ No newline at end of file diff --git a/webAO/dom/initCE.ts b/webAO/dom/initCE.ts index 87bc256..fd57d74 100644 --- a/webAO/dom/initCE.ts +++ b/webAO/dom/initCE.ts @@ -4,6 +4,6 @@ import { client } from "../client"; * Declare cross examination. */ export function initCE() { - client.sendRT("testimony2"); + client.sender.sendRT("testimony2"); } window.initCE = initCE; \ No newline at end of file diff --git a/webAO/dom/initWT.ts b/webAO/dom/initWT.ts index b6268fc..d99fc3e 100644 --- a/webAO/dom/initWT.ts +++ b/webAO/dom/initWT.ts @@ -4,6 +4,6 @@ import { client } from "../client"; * Declare witness testimony. */ export function initWT() { - client.sendRT("testimony1"); + client.sender.sendRT("testimony1"); } window.initWT = initWT; \ No newline at end of file diff --git a/webAO/dom/musicListClick.ts b/webAO/dom/musicListClick.ts index 8fd3be5..2243553 100644 --- a/webAO/dom/musicListClick.ts +++ b/webAO/dom/musicListClick.ts @@ -7,7 +7,7 @@ export function musiclist_click(_event: Event) { const playtrack = (( document.getElementById("client_musiclist") )).value; - client.sendMusicChange(playtrack); + client.sender.sendMusicChange(playtrack); // This is here so you can't actually select multiple tracks, // even though the select tag has the multiple option to render differently diff --git a/webAO/dom/notGuilty.ts b/webAO/dom/notGuilty.ts index e15ee4b..95b830b 100644 --- a/webAO/dom/notGuilty.ts +++ b/webAO/dom/notGuilty.ts @@ -4,6 +4,6 @@ import { client } from "../client"; * Declare the defendant not guilty */ export function notguilty() { - client.sendRT("judgeruling#0"); + client.sender.sendRT("judgeruling#0"); } window.notguilty = notguilty; \ No newline at end of file diff --git a/webAO/dom/onOOCEnter.ts b/webAO/dom/onOOCEnter.ts index a6bde4c..d7ec21b 100644 --- a/webAO/dom/onOOCEnter.ts +++ b/webAO/dom/onOOCEnter.ts @@ -4,9 +4,8 @@ import { client } from "../client"; * @param {KeyboardEvent} event */ export function onOOCEnter(event: KeyboardEvent) { - console.log('FUCK') if (event.keyCode === 13) { - client.sendOOC( + client.sender.sendOOC( (document.getElementById("client_oocinputbox")).value ); (document.getElementById("client_oocinputbox")).value = diff --git a/webAO/dom/pickChar.ts b/webAO/dom/pickChar.ts index 5773125..82fb6af 100644 --- a/webAO/dom/pickChar.ts +++ b/webAO/dom/pickChar.ts @@ -11,6 +11,6 @@ export function pickChar(ccharacter: number) { document.getElementById("client_waiting")!.style.display = "none"; document.getElementById("client_charselect")!.style.display = "none"; } - client.sendCharacter(ccharacter); + client.sender.sendCharacter(ccharacter); } window.pickChar = pickChar; \ No newline at end of file diff --git a/webAO/dom/randomCharacterOOC.ts b/webAO/dom/randomCharacterOOC.ts index 507c3f0..657a474 100644 --- a/webAO/dom/randomCharacterOOC.ts +++ b/webAO/dom/randomCharacterOOC.ts @@ -3,6 +3,6 @@ import { client } from '../client' * Random character via OOC. */ export function randomCharacterOOC() { - client.sendOOC(`/randomchar`); + client.sender.sendOOC(`/randomchar`); } window.randomCharacterOOC = randomCharacterOOC; \ No newline at end of file diff --git a/webAO/dom/redHPD.ts b/webAO/dom/redHPD.ts index 7b47c23..e228d21 100644 --- a/webAO/dom/redHPD.ts +++ b/webAO/dom/redHPD.ts @@ -4,6 +4,6 @@ import { client } from "../client"; * Decrement defense health point. */ export function redHPD() { - client.sendHP(1, client.hp[0] - 1); + client.sender.sendHP(1, client.hp[0] - 1); } window.redHPD = redHPD; \ No newline at end of file diff --git a/webAO/dom/redHPP.ts b/webAO/dom/redHPP.ts index fb6711e..efde941 100644 --- a/webAO/dom/redHPP.ts +++ b/webAO/dom/redHPP.ts @@ -4,6 +4,6 @@ import { client } from "../client"; * Decrement prosecution health point. */ export function redHPP() { - client.sendHP(2, client.hp[1] - 1); + client.sender.sendHP(2, client.hp[1] - 1); } window.redHPP = redHPP; \ No newline at end of file -- cgit From 1e3f34e03c9dd8fda7e2b24e4533e23fcb7e1de7 Mon Sep 17 00:00:00 2001 From: Caleb Date: Fri, 9 Sep 2022 18:12:48 -0400 Subject: Moved more functions out of client --- webAO/client.ts | 113 +++--------------------------------------- webAO/client/appendICLog.ts | 57 +++++++++++++++++++++ webAO/client/checkCallword.ts | 17 +++++++ webAO/client/isLowMemory.ts | 10 ++++ webAO/client/resetICParams.ts | 21 ++++++++ 5 files changed, 111 insertions(+), 107 deletions(-) create mode 100644 webAO/client/appendICLog.ts create mode 100644 webAO/client/checkCallword.ts create mode 100644 webAO/client/isLowMemory.ts create mode 100644 webAO/client/resetICParams.ts (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index e92489c..9588812 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -3,14 +3,13 @@ * made by sD, refactored by oldmud0 and Qubrick * credits to aleks for original idea and source */ - +import {isLowMemory} from './client/isLowMemory' import FingerprintJS from "@fingerprintjs/fingerprintjs"; import vanilla_background_arr from "./constants/backgrounds.js"; import vanilla_evidence_arr from "./constants/evidence.js"; import {sender, ISender} from './client/sender/index' import iniParse from "./iniParse"; import getCookie from "./utils/getCookie"; -import setCookie from "./utils/setCookie"; import fileExists from "./utils/fileExists.js"; import queryParser from "./utils/queryParser"; import getResources from "./utils/getResources.js"; @@ -19,7 +18,7 @@ import masterViewport, { Viewport } from "./viewport"; import { EventEmitter } from "events"; import { area_click } from './dom/areaClick' import { onReplayGo } from './dom/onReplayGo' -import { escapeChat, safeTags, unescapeChat } from "./encoding"; +import { safeTags, unescapeChat } from "./encoding"; import { setChatbox } from "./dom/setChatbox"; import { request } from "./services/request.js"; import { @@ -77,20 +76,8 @@ export const setBanned = (val: boolean) => { } let hdid: string; -function isLowMemory() { - if ( - /webOS|iPod|BlackBerry|BB|PlayBook|IEMobile|Windows Phone|Kindle|Silk|PlayStation|Nintendo|Opera Mini/i.test( - navigator.userAgent - ) - ) { - oldLoading = true; - } -} - const fpPromise = FingerprintJS.load(); -const connect = (address: string) => { -} fpPromise .then((fp) => fp.get()) .then((result) => { @@ -100,15 +87,16 @@ fpPromise // Create the new client and connect it client = new Client(serverIP); client.connect() - isLowMemory(); client.loadResources(); }); export const delay = (ms: number) => new Promise((res) => setTimeout(res, ms)); -let lastICMessageTime = new Date(0); - +export let lastICMessageTime = new Date(0); +export const setLastICMessageTime = (val: Date) => { + lastICMessageTime = val +} class Client extends EventEmitter { serv: any; hp: number[]; @@ -335,7 +323,6 @@ class Client extends EventEmitter { packetHandler.has(packetHeader) ? packetHandler.get(packetHeader)(splitPacket) : console.warn(`Invalid packet header ${packetHeader}`); - } /** @@ -353,7 +340,6 @@ class Client extends EventEmitter { */ cleanup() { clearInterval(this.checkUpdater); - this.serv.close(); } @@ -653,93 +639,6 @@ class Client extends EventEmitter { } } -/** - * Resets the IC parameters for the player to enter a new chat message. - * This should only be called when the player's previous chat message - * was successfully sent/presented. - */ -export function resetICParams() { - (document.getElementById("client_inputbox")).value = ""; - document.getElementById("button_flash").className = "client_button"; - document.getElementById("button_shake").className = "client_button"; - - (document.getElementById("sendpreanim")).checked = false; - (document.getElementById("sendsfx")).checked = false; - - if (selectedShout) { - document.getElementById(`button_${selectedShout}`).className = - "client_button"; - selectedShout = 0; - } -} -/** - * Appends a message to the in-character chat log. - * @param {string} msg the string to be added - * @param {string} name the name of the sender - */ -export function appendICLog( - msg: string, - showname = "", - nameplate = "", - time = new Date() -) { - const entry = document.createElement("p"); - const shownameField = document.createElement("span"); - const nameplateField = document.createElement("span"); - const textField = document.createElement("span"); - nameplateField.className = "iclog_name iclog_nameplate"; - nameplateField.appendChild(document.createTextNode(nameplate)); - - shownameField.className = "iclog_name iclog_showname"; - if (showname === "" || !showname) { - shownameField.appendChild(document.createTextNode(nameplate)); - } else { - shownameField.appendChild(document.createTextNode(showname)); - } - - textField.className = "iclog_text"; - textField.appendChild(document.createTextNode(msg)); - - entry.appendChild(shownameField); - entry.appendChild(nameplateField); - entry.appendChild(textField); - - // Only put a timestamp if the minute has changed. - if (lastICMessageTime.getMinutes() !== time.getMinutes()) { - const timeStamp = document.createElement("span"); - timeStamp.className = "iclog_time"; - timeStamp.innerText = time.toLocaleTimeString(undefined, { - hour: "numeric", - minute: "2-digit", - }); - entry.appendChild(timeStamp); - } - - const clientLog = document.getElementById("client_log"); - clientLog.appendChild(entry); - - /* This is a little buggy - some troubleshooting might be desirable */ - if (clientLog.scrollTop > clientLog.scrollHeight - 800) { - clientLog.scrollTop = clientLog.scrollHeight; - } - - lastICMessageTime = new Date(); -} - -/** - * check if the message contains an entry on our callword list - * @param {string} message - */ -export function checkCallword(message: string, sfxAudio: HTMLAudioElement) { - client.callwords.forEach(testCallword); - function testCallword(item: string) { - if (item !== "" && message.toLowerCase().includes(item.toLowerCase())) { - sfxAudio.pause(); - sfxAudio.src = `${AO_HOST}sounds/general/sfx-gallery.opus`; - sfxAudio.play(); - } - } -} export default Client; \ No newline at end of file diff --git a/webAO/client/appendICLog.ts b/webAO/client/appendICLog.ts new file mode 100644 index 0000000..f8b7852 --- /dev/null +++ b/webAO/client/appendICLog.ts @@ -0,0 +1,57 @@ +import { lastICMessageTime, setLastICMessageTime } from "../client"; + + + +/** + * Appends a message to the in-character chat log. + * @param {string} msg the string to be added + * @param {string} name the name of the sender + */ +export function appendICLog( + msg: string, + showname = "", + nameplate = "", + time = new Date() +) { + const entry = document.createElement("p"); + const shownameField = document.createElement("span"); + const nameplateField = document.createElement("span"); + const textField = document.createElement("span"); + nameplateField.className = "iclog_name iclog_nameplate"; + nameplateField.appendChild(document.createTextNode(nameplate)); + + shownameField.className = "iclog_name iclog_showname"; + if (showname === "" || !showname) { + shownameField.appendChild(document.createTextNode(nameplate)); + } else { + shownameField.appendChild(document.createTextNode(showname)); + } + + textField.className = "iclog_text"; + textField.appendChild(document.createTextNode(msg)); + + entry.appendChild(shownameField); + entry.appendChild(nameplateField); + entry.appendChild(textField); + + // Only put a timestamp if the minute has changed. + if (lastICMessageTime.getMinutes() !== time.getMinutes()) { + const timeStamp = document.createElement("span"); + timeStamp.className = "iclog_time"; + timeStamp.innerText = time.toLocaleTimeString(undefined, { + hour: "numeric", + minute: "2-digit", + }); + entry.appendChild(timeStamp); + } + + const clientLog = document.getElementById("client_log")!; + clientLog.appendChild(entry); + + /* This is a little buggy - some troubleshooting might be desirable */ + if (clientLog.scrollTop > clientLog.scrollHeight - 800) { + clientLog.scrollTop = clientLog.scrollHeight; + } + + setLastICMessageTime(new Date()); +} \ No newline at end of file diff --git a/webAO/client/checkCallword.ts b/webAO/client/checkCallword.ts new file mode 100644 index 0000000..f6cffbc --- /dev/null +++ b/webAO/client/checkCallword.ts @@ -0,0 +1,17 @@ +import { client } from "../client"; +import { AO_HOST } from "./aoHost"; + +/** + * check if the message contains an entry on our callword list + * @param {string} message + */ +export function checkCallword(message: string, sfxAudio: HTMLAudioElement) { + client.callwords.forEach(testCallword); + function testCallword(item: string) { + if (item !== "" && message.toLowerCase().includes(item.toLowerCase())) { + sfxAudio.pause(); + sfxAudio.src = `${AO_HOST}sounds/general/sfx-gallery.opus`; + sfxAudio.play(); + } + } +} \ No newline at end of file diff --git a/webAO/client/isLowMemory.ts b/webAO/client/isLowMemory.ts new file mode 100644 index 0000000..caa6784 --- /dev/null +++ b/webAO/client/isLowMemory.ts @@ -0,0 +1,10 @@ +import { setOldLoading } from '../client' +export const isLowMemory = () => { + if ( + /webOS|iPod|BlackBerry|BB|PlayBook|IEMobile|Windows Phone|Kindle|Silk|PlayStation|Nintendo|Opera Mini/i.test( + navigator.userAgent + ) + ) { + setOldLoading(true); + } +} diff --git a/webAO/client/resetICParams.ts b/webAO/client/resetICParams.ts new file mode 100644 index 0000000..414da27 --- /dev/null +++ b/webAO/client/resetICParams.ts @@ -0,0 +1,21 @@ +import { selectedShout, setSelectedShout } from "../client"; + +/** + * Resets the IC parameters for the player to enter a new chat message. + * This should only be called when the player's previous chat message + * was successfully sent/presented. + */ +export function resetICParams() { + (document.getElementById("client_inputbox")).value = ""; + document.getElementById("button_flash")!.className = "client_button"; + document.getElementById("button_shake")!.className = "client_button"; + + (document.getElementById("sendpreanim")).checked = false; + (document.getElementById("sendsfx")).checked = false; + + if (selectedShout) { + document.getElementById(`button_${selectedShout}`)!.className = + "client_button"; + setSelectedShout(0); + } +} \ No newline at end of file -- cgit From e50167a8077b0ada769cdf785971972c3ad865f7 Mon Sep 17 00:00:00 2001 From: Caleb Date: Fri, 9 Sep 2022 18:30:07 -0400 Subject: Pulled out everything I wanted --- webAO/client.ts | 369 ++---------------------------------- webAO/client/addTrack.ts | 15 ++ webAO/client/createArea.ts | 30 +++ webAO/client/fetchLists.ts | 60 ++++++ webAO/client/fixLastArea.ts | 14 ++ webAO/client/handleBans.ts | 17 ++ webAO/client/handleCharacterInfo.ts | 105 ++++++++++ webAO/client/isAudio.ts | 6 + webAO/client/loadResources.ts | 79 ++++++++ webAO/client/saveChatLogHandle.ts | 26 +++ webAO/dom/showNameClick.ts | 2 +- 11 files changed, 364 insertions(+), 359 deletions(-) create mode 100644 webAO/client/addTrack.ts create mode 100644 webAO/client/createArea.ts create mode 100644 webAO/client/fetchLists.ts create mode 100644 webAO/client/fixLastArea.ts create mode 100644 webAO/client/handleBans.ts create mode 100644 webAO/client/handleCharacterInfo.ts create mode 100644 webAO/client/isAudio.ts create mode 100644 webAO/client/loadResources.ts create mode 100644 webAO/client/saveChatLogHandle.ts (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 9588812..8b2f691 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -3,35 +3,18 @@ * made by sD, refactored by oldmud0 and Qubrick * credits to aleks for original idea and source */ -import {isLowMemory} from './client/isLowMemory' +import { isLowMemory } from './client/isLowMemory' import FingerprintJS from "@fingerprintjs/fingerprintjs"; -import vanilla_background_arr from "./constants/backgrounds.js"; -import vanilla_evidence_arr from "./constants/evidence.js"; -import {sender, ISender} from './client/sender/index' -import iniParse from "./iniParse"; -import getCookie from "./utils/getCookie"; -import fileExists from "./utils/fileExists.js"; +import { sender, ISender } from './client/sender/index' import queryParser from "./utils/queryParser"; import getResources from "./utils/getResources.js"; -import downloadFile from "./services/downloadFile"; import masterViewport, { Viewport } from "./viewport"; import { EventEmitter } from "events"; -import { area_click } from './dom/areaClick' import { onReplayGo } from './dom/onReplayGo' -import { safeTags, unescapeChat } from "./encoding"; -import { setChatbox } from "./dom/setChatbox"; -import { request } from "./services/request.js"; -import { - changeShoutVolume, - changeSFXVolume, - changeTestimonyVolume, -} from "./dom/changeVolume.js"; -import { getFilenameFromPath } from "./utils/paths"; import { packetHandler } from './packets/packetHandler' -import { showname_click } from './dom/showNameClick' +import { loadResources } from './client/loadResources' import { AO_HOST } from './client/aoHost' - -const version = process.env.npm_package_version; +import { fetchBackgroundList, fetchEvidenceList } from './client/fetchLists' let { ip: serverIP, mode, theme } = queryParser(); let THEME: string = theme || "default"; @@ -82,12 +65,10 @@ fpPromise .then((fp) => fp.get()) .then((result) => { hdid = result.visitorId; - console.log("NEW CLIENT"); - // Create the new client and connect it client = new Client(serverIP); client.connect() - isLowMemory(); + client.isLowMemory(); client.loadResources(); }); @@ -122,6 +103,8 @@ class Client extends EventEmitter { _lastTimeICReceived: any; viewport: Viewport; connect: () => void; + loadResources: () => void + isLowMemory: () => void constructor(address: string) { super(); @@ -163,6 +146,8 @@ class Client extends EventEmitter { this.sender = sender this.viewport = masterViewport(this); this._lastTimeICReceived = new Date(0); + loadResources + isLowMemory } /** @@ -188,8 +173,6 @@ class Client extends EventEmitter { : 0; } - - /** * Hook for sending messages to the client * @param {string} message the message to send @@ -204,7 +187,6 @@ class Client extends EventEmitter { * to the server. */ joinServer() { - console.log(this.sender) this.sender.sendServer(`HI#${hdid}#%`); this.sender.sendServer("ID#webAO#webAO#%"); if (mode !== "replay") { @@ -212,78 +194,6 @@ class Client extends EventEmitter { } } - /** - * Load game resources and stored settings. - */ - loadResources() { - document.getElementById("client_version").innerText = `version ${version}`; - - // Load background array to select - const background_select = ( - document.getElementById("bg_select") - ); - background_select.add(new Option("Custom", "0")); - vanilla_background_arr.forEach((background) => { - background_select.add(new Option(background)); - }); - - // Load evidence array to select - const evidence_select = ( - document.getElementById("evi_select") - ); - evidence_select.add(new Option("Custom", "0")); - vanilla_evidence_arr.forEach((evidence) => { - evidence_select.add(new Option(evidence)); - }); - - // Read cookies and set the UI to its values - (document.getElementById("OOC_name")).value = - getCookie("OOC_name") || - `web${String(Math.round(Math.random() * 100 + 10))}`; - - // Read cookies and set the UI to its values - const cookietheme = getCookie("theme") || "default"; - - (( - document.querySelector(`#client_themeselect [value="${cookietheme}"]`) - )).selected = true; - this.viewport.reloadTheme(); - - const cookiechatbox = getCookie("chatbox") || "dynamic"; - - (( - document.querySelector(`#client_chatboxselect [value="${cookiechatbox}"]`) - )).selected = true; - setChatbox(cookiechatbox); - - (document.getElementById("client_mvolume")).value = - getCookie("musicVolume") || "1"; - this.viewport.changeMusicVolume(); - (document.getElementById("client_sfxaudio")).volume = - Number(getCookie("sfxVolume")) || 1; - changeSFXVolume(); - (document.getElementById("client_shoutaudio")).volume = - Number(getCookie("shoutVolume")) || 1; - changeShoutVolume(); - (( - document.getElementById("client_testimonyaudio") - )).volume = Number(getCookie("testimonyVolume")) || 1; - changeTestimonyVolume(); - (document.getElementById("client_bvolume")).value = - getCookie("blipVolume") || "1"; - this.viewport.changeBlipVolume(); - - (document.getElementById("ic_chat_name")).value = - getCookie("ic_chat_name"); - (document.getElementById("showname")).checked = Boolean( - getCookie("showname") - ); - showname_click(null); - - (document.getElementById("client_callwords")).value = - getCookie("callwords"); - } - /** * Triggered when a connection is established to the server. */ @@ -369,129 +279,6 @@ class Client extends EventEmitter { } } - saveChatlogHandle = async () => { - const clientLog = document.getElementById("client_log"); - const icMessageLogs = clientLog.getElementsByTagName("p"); - const messages = []; - - for (let i = 0; i < icMessageLogs.length; i++) { - const SHOWNAME_POSITION = 0; - const TEXT_POSITION = 2; - const showname = icMessageLogs[i].children[SHOWNAME_POSITION].innerHTML; - const text = icMessageLogs[i].children[TEXT_POSITION].innerHTML; - const message = `${showname}: ${text}`; - messages.push(message); - } - const d = new Date(); - let ye = new Intl.DateTimeFormat("en", { year: "numeric" }).format(d); - let mo = new Intl.DateTimeFormat("en", { month: "short" }).format(d); - let da = new Intl.DateTimeFormat("en", { day: "2-digit" }).format(d); - - const filename = `chatlog-${da}-${mo}-${ye}`.toLowerCase(); - downloadFile(messages.join("\n"), filename); - - // Reset Chatbox to Empty - (document.getElementById("client_inputbox")).value = ""; - }; - - /** - * Handles the incoming character information, and downloads the sprite + ini for it - * @param {Array} chargs packet arguments - * @param {Number} charid character ID - */ - async handleCharacterInfo(chargs: string[], charid: number) { - const img = document.getElementById(`demo_${charid}`); - if (chargs[0]) { - let cini: any = {}; - const getCharIcon = async () => { - const extensions = [".png", ".webp"]; - img.alt = chargs[0]; - const charIconBaseUrl = `${AO_HOST}characters/${encodeURI( - chargs[0].toLowerCase() - )}/char_icon`; - for (let i = 0; i < extensions.length; i++) { - const fileUrl = charIconBaseUrl + extensions[i]; - const exists = await fileExists(fileUrl); - if (exists) { - img.alt = chargs[0]; - img.title = chargs[0]; - img.src = fileUrl; - return; - } - } - }; - getCharIcon(); - - // If the ini doesn't exist on the server this will throw an error - try { - const cinidata = await request( - `${AO_HOST}characters/${encodeURI(chargs[0].toLowerCase())}/char.ini` - ); - cini = iniParse(cinidata); - } catch (err) { - cini = {}; - img.classList.add("noini"); - console.warn(`character ${chargs[0]} is missing from webAO`); - // If it does, give the user a visual indication that the character is unusable - } - - const mute_select = ( - document.getElementById("mute_select") - ); - mute_select.add(new Option(safeTags(chargs[0]), String(charid))); - const pair_select = ( - document.getElementById("pair_select") - ); - pair_select.add(new Option(safeTags(chargs[0]), String(charid))); - - // sometimes ini files lack important settings - const default_options = { - name: chargs[0], - showname: chargs[0], - side: "def", - blips: "male", - chat: "", - category: "", - }; - cini.options = Object.assign(default_options, cini.options); - - // sometimes ini files lack important settings - const default_emotions = { - number: 0, - }; - cini.emotions = Object.assign(default_emotions, cini.emotions); - - this.chars[charid] = { - name: safeTags(chargs[0]), - showname: safeTags(cini.options.showname), - desc: safeTags(chargs[1]), - blips: safeTags(cini.options.blips).toLowerCase(), - gender: safeTags(cini.options.gender).toLowerCase(), - side: safeTags(cini.options.side).toLowerCase(), - chat: - cini.options.chat === "" - ? safeTags(cini.options.category).toLowerCase() - : safeTags(cini.options.chat).toLowerCase(), - evidence: chargs[3], - icon: img.src, - inifile: cini, - muted: false, - }; - - if ( - this.chars[charid].blips === "male" && - this.chars[charid].gender !== "male" && - this.chars[charid].gender !== "" - ) { - this.chars[charid].blips = this.chars[charid].gender; - } - - } else { - console.warn(`missing charid ${charid}`); - img.style.display = "none"; - } - } - resetMusicList() { this.musics = []; document.getElementById("client_musiclist").innerHTML = ""; @@ -501,144 +288,10 @@ class Client extends EventEmitter { this.areas = []; document.getElementById("areas").innerHTML = ""; - this.fetchBackgroundList(); - this.fetchEvidenceList(); - } - - async fetchBackgroundList() { - try { - const bgdata = await request(`${AO_HOST}backgrounds.json`); - const bg_array = JSON.parse(bgdata); - // the try catch will fail before here when there is no file - - const bg_select = document.getElementById("bg_select"); - bg_select.innerHTML = ""; - - bg_select.add(new Option("Custom", "0")); - bg_array.forEach((background: string) => { - bg_select.add(new Option(background)); - }); - } catch (err) { - console.warn("there was no backgrounds.json file"); - } - } - - async fetchCharacterList() { - try { - const chardata = await request(`${AO_HOST}characters.json`); - const char_array = JSON.parse(chardata); - // the try catch will fail before here when there is no file - - const char_select = ( - document.getElementById("client_ininame") - ); - char_select.innerHTML = ""; - - char_array.forEach((character: string) => { - char_select.add(new Option(character)); - }); - } catch (err) { - console.warn("there was no characters.json file"); - } - } - - async fetchEvidenceList() { - try { - const evidata = await request(`${AO_HOST}evidence.json`); - const evi_array = JSON.parse(evidata); - // the try catch will fail before here when there is no file - - const evi_select = ( - document.getElementById("evi_select") - ); - evi_select.innerHTML = ""; - - evi_array.forEach((evi: string) => { - evi_select.add(new Option(evi)); - }); - evi_select.add(new Option("Custom", "0")); - } catch (err) { - console.warn("there was no evidence.json file"); - } - } - - isAudio(trackname: string) { - const audioEndings = [".wav", ".mp3", ".ogg", ".opus"]; - return ( - audioEndings.filter((ending) => trackname.endsWith(ending)).length === 1 - ); - } - - addTrack(trackname: string) { - const newentry = document.createElement("OPTION"); - const songName = getFilenameFromPath(trackname); - newentry.text = unescapeChat(songName); - newentry.value = trackname; - (( - document.getElementById("client_musiclist") - )).options.add(newentry); - this.musics.push(trackname); + fetchBackgroundList(); + fetchEvidenceList(); } - createArea(id: number, name: string) { - const thisarea = { - name, - players: 0, - status: "IDLE", - cm: "", - locked: "FREE", - }; - - this.areas.push(thisarea); - - // Create area button - const newarea = document.createElement("SPAN"); - newarea.className = "area-button area-default"; - newarea.id = `area${id}`; - newarea.innerText = thisarea.name; - newarea.title = - `Players: ${thisarea.players}\n` + - `Status: ${thisarea.status}\n` + - `CM: ${thisarea.cm}\n` + - `Area lock: ${thisarea.locked}`; - newarea.onclick = function () { - area_click(newarea); - }; - - document.getElementById("areas").appendChild(newarea); - } - - /** - * Area list fuckery - */ - fix_last_area() { - if (this.areas.length > 0) { - const malplaced = this.areas.pop().name; - const areas = document.getElementById("areas"); - areas.removeChild(areas.lastChild); - this.addTrack(malplaced); - } - } - - /** - * Handles the kicked packet - * @param {string} type is it a kick or a ban - * @param {string} reason why - */ - handleBans(type: string, reason: string) { - document.getElementById("client_error").style.display = "flex"; - document.getElementById( - "client_errortext" - ).innerHTML = `${type}:
${reason.replace(/\n/g, "
")}`; - (( - document.getElementsByClassName("client_reconnect")[0] - )).style.display = "none"; - (( - document.getElementsByClassName("client_reconnect")[1] - )).style.display = "none"; - } } - - export default Client; \ No newline at end of file diff --git a/webAO/client/addTrack.ts b/webAO/client/addTrack.ts new file mode 100644 index 0000000..247f07e --- /dev/null +++ b/webAO/client/addTrack.ts @@ -0,0 +1,15 @@ +import { client } from "../client"; +import { unescapeChat } from "../encoding"; +import { getFilenameFromPath } from "../utils/paths"; + + +export const addTrack = (trackname: string) => { + const newentry = document.createElement("OPTION"); + const songName = getFilenameFromPath(trackname); + newentry.text = unescapeChat(songName); + newentry.value = trackname; + (( + document.getElementById("client_musiclist") + )).options.add(newentry); + client.musics.push(trackname); +} \ No newline at end of file diff --git a/webAO/client/createArea.ts b/webAO/client/createArea.ts new file mode 100644 index 0000000..63af644 --- /dev/null +++ b/webAO/client/createArea.ts @@ -0,0 +1,30 @@ +import { client } from "../client"; +import { area_click } from "../dom/areaClick"; + +export const createArea = (id: number, name: string) => { + const thisarea = { + name, + players: 0, + status: "IDLE", + cm: "", + locked: "FREE", + }; + + client.areas.push(thisarea); + + // Create area button + const newarea = document.createElement("SPAN"); + newarea.className = "area-button area-default"; + newarea.id = `area${id}`; + newarea.innerText = thisarea.name; + newarea.title = + `Players: ${thisarea.players}\n` + + `Status: ${thisarea.status}\n` + + `CM: ${thisarea.cm}\n` + + `Area lock: ${thisarea.locked}`; + newarea.onclick = function () { + area_click(newarea); + }; + + document.getElementById("areas")!.appendChild(newarea); +} \ No newline at end of file diff --git a/webAO/client/fetchLists.ts b/webAO/client/fetchLists.ts new file mode 100644 index 0000000..e9772cb --- /dev/null +++ b/webAO/client/fetchLists.ts @@ -0,0 +1,60 @@ +import { AO_HOST } from "./aoHost"; +import { request } from "../services/request.js"; + +export const fetchBackgroundList = async () => { + try { + const bgdata = await request(`${AO_HOST}backgrounds.json`); + const bg_array = JSON.parse(bgdata); + // the try catch will fail before here when there is no file + + const bg_select = document.getElementById("bg_select"); + bg_select.innerHTML = ""; + + bg_select.add(new Option("Custom", "0")); + bg_array.forEach((background: string) => { + bg_select.add(new Option(background)); + }); + } catch (err) { + console.warn("there was no backgrounds.json file"); + } +} + +export const fetchCharacterList = async () => { + try { + const chardata = await request(`${AO_HOST}characters.json`); + const char_array = JSON.parse(chardata); + // the try catch will fail before here when there is no file + + const char_select = ( + document.getElementById("client_ininame") + ); + char_select.innerHTML = ""; + + char_array.forEach((character: string) => { + char_select.add(new Option(character)); + }); + } catch (err) { + console.warn("there was no characters.json file"); + } +} + + +export const fetchEvidenceList = async () => { + try { + const evidata = await request(`${AO_HOST}evidence.json`); + const evi_array = JSON.parse(evidata); + // the try catch will fail before here when there is no file + + const evi_select = ( + document.getElementById("evi_select") + ); + evi_select.innerHTML = ""; + + evi_array.forEach((evi: string) => { + evi_select.add(new Option(evi)); + }); + evi_select.add(new Option("Custom", "0")); + } catch (err) { + console.warn("there was no evidence.json file"); + } +} \ No newline at end of file diff --git a/webAO/client/fixLastArea.ts b/webAO/client/fixLastArea.ts new file mode 100644 index 0000000..e4d8725 --- /dev/null +++ b/webAO/client/fixLastArea.ts @@ -0,0 +1,14 @@ +import { client } from "../client"; + + +/** + * Area list fuckery + */ +export const fix_last_area = () => { + if (client.areas.length > 0) { + const malplaced = client.areas.pop().name; + const areas = document.getElementById("areas")!; + areas.removeChild(areas.lastChild); + client.addTrack(malplaced); + } +} \ No newline at end of file diff --git a/webAO/client/handleBans.ts b/webAO/client/handleBans.ts new file mode 100644 index 0000000..b977fc8 --- /dev/null +++ b/webAO/client/handleBans.ts @@ -0,0 +1,17 @@ +/** + * Handles the kicked packet + * @param {string} type is it a kick or a ban + * @param {string} reason why + */ +export const handleBans = (type: string, reason: string) => { + document.getElementById("client_error")!.style.display = "flex"; + document.getElementById( + "client_errortext" + )!.innerHTML = `${type}:
${reason.replace(/\n/g, "
")}`; + (( + document.getElementsByClassName("client_reconnect")[0] + )).style.display = "none"; + (( + document.getElementsByClassName("client_reconnect")[1] + )).style.display = "none"; +} \ No newline at end of file diff --git a/webAO/client/handleCharacterInfo.ts b/webAO/client/handleCharacterInfo.ts new file mode 100644 index 0000000..9d74a8b --- /dev/null +++ b/webAO/client/handleCharacterInfo.ts @@ -0,0 +1,105 @@ +import { client } from "../client"; +import { safeTags } from "../encoding"; +import iniParse from "../iniParse"; +import request from "../services/request"; +import fileExists from "../utils/fileExists"; +import { AO_HOST } from "./aoHost"; + + +/** + * Handles the incoming character information, and downloads the sprite + ini for it + * @param {Array} chargs packet arguments + * @param {Number} charid character ID + */ +export const handleCharacterInfo = async (chargs: string[], charid: number) => { + const img = document.getElementById(`demo_${charid}`); + if (chargs[0]) { + let cini: any = {}; + const getCharIcon = async () => { + const extensions = [".png", ".webp"]; + img.alt = chargs[0]; + const charIconBaseUrl = `${AO_HOST}characters/${encodeURI( + chargs[0].toLowerCase() + )}/char_icon`; + for (let i = 0; i < extensions.length; i++) { + const fileUrl = charIconBaseUrl + extensions[i]; + const exists = await fileExists(fileUrl); + if (exists) { + img.alt = chargs[0]; + img.title = chargs[0]; + img.src = fileUrl; + return; + } + } + }; + getCharIcon(); + + // If the ini doesn't exist on the server this will throw an error + try { + const cinidata = await request( + `${AO_HOST}characters/${encodeURI(chargs[0].toLowerCase())}/char.ini` + ); + cini = iniParse(cinidata); + } catch (err) { + cini = {}; + img.classList.add("noini"); + console.warn(`character ${chargs[0]} is missing from webAO`); + // If it does, give the user a visual indication that the character is unusable + } + + const mute_select = ( + document.getElementById("mute_select") + ); + mute_select.add(new Option(safeTags(chargs[0]), String(charid))); + const pair_select = ( + document.getElementById("pair_select") + ); + pair_select.add(new Option(safeTags(chargs[0]), String(charid))); + + // sometimes ini files lack important settings + const default_options = { + name: chargs[0], + showname: chargs[0], + side: "def", + blips: "male", + chat: "", + category: "", + }; + cini.options = Object.assign(default_options, cini.options); + + // sometimes ini files lack important settings + const default_emotions = { + number: 0, + }; + cini.emotions = Object.assign(default_emotions, cini.emotions); + + client.chars[charid] = { + name: safeTags(chargs[0]), + showname: safeTags(cini.options.showname), + desc: safeTags(chargs[1]), + blips: safeTags(cini.options.blips).toLowerCase(), + gender: safeTags(cini.options.gender).toLowerCase(), + side: safeTags(cini.options.side).toLowerCase(), + chat: + cini.options.chat === "" + ? safeTags(cini.options.category).toLowerCase() + : safeTags(cini.options.chat).toLowerCase(), + evidence: chargs[3], + icon: img.src, + inifile: cini, + muted: false, + }; + + if ( + client.chars[charid].blips === "male" && + client.chars[charid].gender !== "male" && + client.chars[charid].gender !== "" + ) { + client.chars[charid].blips = client.chars[charid].gender; + } + + } else { + console.warn(`missing charid ${charid}`); + img.style.display = "none"; + } +} \ No newline at end of file diff --git a/webAO/client/isAudio.ts b/webAO/client/isAudio.ts new file mode 100644 index 0000000..430f543 --- /dev/null +++ b/webAO/client/isAudio.ts @@ -0,0 +1,6 @@ +export const isAudio = (trackname: string) => { + const audioEndings = [".wav", ".mp3", ".ogg", ".opus"]; + return ( + audioEndings.filter((ending) => trackname.endsWith(ending)).length === 1 + ); +} \ No newline at end of file diff --git a/webAO/client/loadResources.ts b/webAO/client/loadResources.ts new file mode 100644 index 0000000..7039333 --- /dev/null +++ b/webAO/client/loadResources.ts @@ -0,0 +1,79 @@ +import getCookie from "../utils/getCookie"; +import vanilla_evidence_arr from "../constants/evidence.js"; +import vanilla_background_arr from "../constants/backgrounds.js"; +import { client } from "../client"; +import { setChatbox } from "../dom/setChatbox"; +import { changeSFXVolume, changeShoutVolume, changeTestimonyVolume } from "../dom/changeVolume"; +import { showname_click } from "../dom/showNameClick"; + +const version = process.env.npm_package_version; +/** + * Load game resources and stored settings. + */ +export const loadResources = () => { + document.getElementById("client_version")!.innerText = `version ${version}`; + // Load background array to select + const background_select = ( + document.getElementById("bg_select") + ); + background_select.add(new Option("Custom", "0")); + vanilla_background_arr.forEach((background) => { + background_select.add(new Option(background)); + }); + + // Load evidence array to select + const evidence_select = ( + document.getElementById("evi_select") + ); + evidence_select.add(new Option("Custom", "0")); + vanilla_evidence_arr.forEach((evidence) => { + evidence_select.add(new Option(evidence)); + }); + + // Read cookies and set the UI to its values + (document.getElementById("OOC_name")).value = + getCookie("OOC_name") || + `web${String(Math.round(Math.random() * 100 + 10))}`; + + // Read cookies and set the UI to its values + const cookietheme = getCookie("theme") || "default"; + + (( + document.querySelector(`#client_themeselect [value="${cookietheme}"]`) + )).selected = true; + client.viewport.reloadTheme(); + + const cookiechatbox = getCookie("chatbox") || "dynamic"; + + (( + document.querySelector(`#client_chatboxselect [value="${cookiechatbox}"]`) + )).selected = true; + setChatbox(cookiechatbox); + + (document.getElementById("client_mvolume")).value = + getCookie("musicVolume") || "1"; + client.viewport.changeMusicVolume(); + (document.getElementById("client_sfxaudio")).volume = + Number(getCookie("sfxVolume")) || 1; + changeSFXVolume(); + (document.getElementById("client_shoutaudio")).volume = + Number(getCookie("shoutVolume")) || 1; + changeShoutVolume(); + (( + document.getElementById("client_testimonyaudio") + )).volume = Number(getCookie("testimonyVolume")) || 1; + changeTestimonyVolume(); + (document.getElementById("client_bvolume")).value = + getCookie("blipVolume") || "1"; + client.viewport.changeBlipVolume(); + + (document.getElementById("ic_chat_name")).value = + getCookie("ic_chat_name"); + (document.getElementById("showname")).checked = Boolean( + getCookie("showname") + ); + showname_click(null); + + (document.getElementById("client_callwords")).value = + getCookie("callwords"); +} \ No newline at end of file diff --git a/webAO/client/saveChatLogHandle.ts b/webAO/client/saveChatLogHandle.ts new file mode 100644 index 0000000..bcc1075 --- /dev/null +++ b/webAO/client/saveChatLogHandle.ts @@ -0,0 +1,26 @@ +import downloadFile from "../services/downloadFile"; + +export const saveChatlogHandle = async () => { + const clientLog = document.getElementById("client_log")!; + const icMessageLogs = clientLog.getElementsByTagName("p"); + const messages: string[] = []; + + for (let i = 0; i < icMessageLogs.length; i++) { + const SHOWNAME_POSITION = 0; + const TEXT_POSITION = 2; + const showname = icMessageLogs[i].children[SHOWNAME_POSITION].innerHTML; + const text = icMessageLogs[i].children[TEXT_POSITION].innerHTML; + const message = `${showname}: ${text}`; + messages.push(message); + } + const d = new Date(); + let ye = new Intl.DateTimeFormat("en", { year: "numeric" }).format(d); + let mo = new Intl.DateTimeFormat("en", { month: "short" }).format(d); + let da = new Intl.DateTimeFormat("en", { day: "2-digit" }).format(d); + + const filename = `chatlog-${da}-${mo}-${ye}`.toLowerCase(); + downloadFile(messages.join("\n"), filename); + + // Reset Chatbox to Empty + (document.getElementById("client_inputbox")).value = ""; +}; \ No newline at end of file diff --git a/webAO/dom/showNameClick.ts b/webAO/dom/showNameClick.ts index 265f6c8..3e48b70 100644 --- a/webAO/dom/showNameClick.ts +++ b/webAO/dom/showNameClick.ts @@ -5,7 +5,7 @@ import setCookie from "../utils/setCookie"; * Triggered when the showname checkboc is clicked * @param {MouseEvent} event */ -export function showname_click(_event: Event) { +export function showname_click(_event: Event | null) { setCookie( "showname", String((document.getElementById("showname")).checked) -- cgit From 93979636fb5d1c60f0da3290e80eb3ca9ead992f Mon Sep 17 00:00:00 2001 From: Caleb Date: Fri, 9 Sep 2022 18:46:42 -0400 Subject: Migrated functions --- webAO/client/fixLastArea.ts | 3 +- webAO/client/sender/sendOOC.ts | 4 +- webAO/dom/iniEdit.ts | 3 +- webAO/packets/handlers/handleBD.ts | 5 +- webAO/packets/handlers/handleCI.ts | 3 +- webAO/packets/handlers/handleEM.ts | 14 ++- webAO/packets/handlers/handleFA.ts | 3 +- webAO/packets/handlers/handleFM.ts | 4 +- webAO/packets/handlers/handleKB.ts | 5 +- webAO/packets/handlers/handleKK.ts | 5 +- webAO/packets/handlers/handleMC.ts | 3 +- webAO/packets/handlers/handleMS.ts | 226 +++++++++++++++++----------------- webAO/packets/handlers/handleSC.ts | 3 +- webAO/packets/handlers/handleSM.ts | 15 ++- webAO/packets/handlers/handleackMS.ts | 2 +- webAO/viewport.ts | 25 ++-- 16 files changed, 171 insertions(+), 152 deletions(-) (limited to 'webAO') diff --git a/webAO/client/fixLastArea.ts b/webAO/client/fixLastArea.ts index e4d8725..f1aa99f 100644 --- a/webAO/client/fixLastArea.ts +++ b/webAO/client/fixLastArea.ts @@ -1,4 +1,5 @@ import { client } from "../client"; +import { addTrack } from "./addTrack"; /** @@ -9,6 +10,6 @@ export const fix_last_area = () => { const malplaced = client.areas.pop().name; const areas = document.getElementById("areas")!; areas.removeChild(areas.lastChild); - client.addTrack(malplaced); + addTrack(malplaced); } } \ No newline at end of file diff --git a/webAO/client/sender/sendOOC.ts b/webAO/client/sender/sendOOC.ts index a410b5f..9674ad9 100644 --- a/webAO/client/sender/sendOOC.ts +++ b/webAO/client/sender/sendOOC.ts @@ -1,7 +1,7 @@ import { client } from '../../client' import { escapeChat } from '../../encoding'; import setCookie from '../../utils/setCookie'; - +import { saveChatlogHandle } from '../../client/saveChatLogHandle' /** * Sends an out-of-character chat message. * @param {string} message the message to send @@ -17,7 +17,7 @@ export const sendOOC = (message: string) => { const oocMessage = `${escapeChat(message)}`; const commands = { - "/save_chatlog": client.saveChatlogHandle, + "/save_chatlog": saveChatlogHandle, }; const commandsMap = new Map(Object.entries(commands)); diff --git a/webAO/dom/iniEdit.ts b/webAO/dom/iniEdit.ts index 359a226..0710de9 100644 --- a/webAO/dom/iniEdit.ts +++ b/webAO/dom/iniEdit.ts @@ -1,4 +1,5 @@ import { client } from "../client"; +import { handleCharacterInfo } from "../client/handleCharacterInfo"; import { packetHandler } from "../packets/packetHandler"; /** @@ -8,7 +9,7 @@ export async function iniedit() { const ininame = (document.getElementById("client_ininame")) .value; const inicharID = client.charID; - await client.handleCharacterInfo(ininame.split("&"), inicharID); + await handleCharacterInfo(ininame.split("&"), inicharID); packetHandler.get("PV")!(`PV#0#CID#${inicharID}`.split("#")); } window.iniedit = iniedit; diff --git a/webAO/packets/handlers/handleBD.ts b/webAO/packets/handlers/handleBD.ts index 4ec291e..dbfb54b 100644 --- a/webAO/packets/handlers/handleBD.ts +++ b/webAO/packets/handlers/handleBD.ts @@ -1,5 +1,6 @@ -import { client, setBanned } from "../../client"; +import { setBanned } from "../../client"; import { safeTags } from "../../encoding"; +import { handleBans } from '../../client/handleBans' /** @@ -8,6 +9,6 @@ import { safeTags } from "../../encoding"; * @param {Array} args ban reason */ export const handleBD = (args: string[]) => { - client.handleBans("Banned", safeTags(args[1])); + handleBans("Banned", safeTags(args[1])); setBanned(true); } \ No newline at end of file diff --git a/webAO/packets/handlers/handleCI.ts b/webAO/packets/handlers/handleCI.ts index 53e42f7..cb693bc 100644 --- a/webAO/packets/handlers/handleCI.ts +++ b/webAO/packets/handlers/handleCI.ts @@ -1,4 +1,5 @@ import { client } from '../../client' +import { handleCharacterInfo } from '../../client/handleCharacterInfo' /** * Handles incoming character information, bundling multiple characters * per packet. @@ -18,7 +19,7 @@ export const handleCI = (args: string[]) => { (( document.getElementById("client_loadingbar") )).value = charid; - setTimeout(() => client.handleCharacterInfo(chargs, charid), 500); + setTimeout(() => handleCharacterInfo(chargs, charid), 500); } } // Request the next pack diff --git a/webAO/packets/handlers/handleEM.ts b/webAO/packets/handlers/handleEM.ts index 9f3cb87..5e49ea4 100644 --- a/webAO/packets/handlers/handleEM.ts +++ b/webAO/packets/handlers/handleEM.ts @@ -1,4 +1,8 @@ import { client } from '../../client' +import { addTrack } from '../../client/addTrack'; +import { createArea } from '../../client/createArea'; +import { fix_last_area } from '../../client/fixLastArea'; +import { isAudio } from '../../client/isAudio'; import { safeTags } from '../../encoding'; /** @@ -23,13 +27,13 @@ export const handleEM = (args: string[]) => { )).value = client.char_list_length + client.evidence_list_length + trackindex; if (client.musics_time) { - client.addTrack(trackname); - } else if (client.isAudio(trackname)) { + addTrack(trackname); + } else if (isAudio(trackname)) { client.musics_time = true; - client.fix_last_area(); - client.addTrack(trackname); + fix_last_area(); + addTrack(trackname); } else { - client.createArea(trackindex, trackname); + createArea(trackindex, trackname); } } } diff --git a/webAO/packets/handlers/handleFA.ts b/webAO/packets/handlers/handleFA.ts index ccfe923..7a373e8 100644 --- a/webAO/packets/handlers/handleFA.ts +++ b/webAO/packets/handlers/handleFA.ts @@ -1,4 +1,5 @@ import { client } from '../../client' +import { createArea } from '../../client/createArea'; import { safeTags } from '../../encoding'; /** @@ -9,6 +10,6 @@ export const handleFA = (args: string[]) => { client.resetAreaList(); for (let i = 1; i < args.length - 1; i++) { - client.createArea(i - 1, safeTags(args[i])); + createArea(i - 1, safeTags(args[i])); } } diff --git a/webAO/packets/handlers/handleFM.ts b/webAO/packets/handlers/handleFM.ts index 630477b..fce10e3 100644 --- a/webAO/packets/handlers/handleFM.ts +++ b/webAO/packets/handlers/handleFM.ts @@ -1,7 +1,7 @@ import { client } from "../../client"; +import { addTrack } from "../../client/addTrack"; import { safeTags } from "../../encoding"; - /** * Handles updated music list * @param {Array} args packet arguments @@ -11,6 +11,6 @@ export const handleFM = (args: string[]) => { for (let i = 1; i < args.length - 1; i++) { // Check when found the song for the first time - client.addTrack(safeTags(args[i])); + addTrack(safeTags(args[i])); } } diff --git a/webAO/packets/handlers/handleKB.ts b/webAO/packets/handlers/handleKB.ts index 8705b83..b0aa2b2 100644 --- a/webAO/packets/handlers/handleKB.ts +++ b/webAO/packets/handlers/handleKB.ts @@ -1,5 +1,6 @@ -import { client, setBanned } from "../../client"; +import { setBanned } from "../../client"; import { safeTags } from "../../encoding"; +import { handleBans } from '../../client/handleBans' /** * Handles the banned packet @@ -7,6 +8,6 @@ import { safeTags } from "../../encoding"; * @param {Array} args ban reason */ export const handleKB = (args: string[]) => { - client.handleBans("Banned", safeTags(args[1])); + handleBans("Banned", safeTags(args[1])); setBanned(true); } diff --git a/webAO/packets/handlers/handleKK.ts b/webAO/packets/handlers/handleKK.ts index fd9a88c..c8a97b1 100644 --- a/webAO/packets/handlers/handleKK.ts +++ b/webAO/packets/handlers/handleKK.ts @@ -1,11 +1,10 @@ -import { client } from "../../client"; import { safeTags } from "../../encoding"; - +import { handleBans } from '../../client/handleBans' /** * Handles the kicked packet * @param {Array} args kick reason */ export const handleKK = (args: string[]) => { - client.handleBans("Kicked", safeTags(args[1])); + handleBans("Kicked", safeTags(args[1])); } diff --git a/webAO/packets/handlers/handleMC.ts b/webAO/packets/handlers/handleMC.ts index bf60eb9..aeb178d 100644 --- a/webAO/packets/handlers/handleMC.ts +++ b/webAO/packets/handlers/handleMC.ts @@ -1,6 +1,7 @@ import { prepChat } from "../../encoding"; -import { appendICLog, client } from '../../client' +import { client } from '../../client' import { AO_HOST } from "../../client/aoHost"; +import { appendICLog } from '../../client/appendICLog' /** * Handles a music change to an arbitrary resource. diff --git a/webAO/packets/handlers/handleMS.ts b/webAO/packets/handlers/handleMS.ts index 0aad19a..1256900 100644 --- a/webAO/packets/handlers/handleMS.ts +++ b/webAO/packets/handlers/handleMS.ts @@ -1,4 +1,6 @@ -import { client, extrafeatures, resetICParams, UPDATE_INTERVAL } from "../../client"; +import { client, extrafeatures, UPDATE_INTERVAL } from "../../client"; +import { handleCharacterInfo } from "../../client/handleCharacterInfo"; +import { resetICParams } from "../../client/resetICParams"; import { prepChat, safeTags } from "../../encoding"; /** @@ -6,119 +8,104 @@ import { prepChat, safeTags } from "../../encoding"; * @param {*} args packet arguments */ export const handleMS = (args: string[]) => { - // TODO: this if-statement might be a bug. - if (args[4] !== client.viewport.chatmsg.content) { - document.getElementById("client_inner_chat")!.innerHTML = ""; + // TODO: this if-statement might be a bug. + if (args[4] !== client.viewport.chatmsg.content) { + document.getElementById("client_inner_chat")!.innerHTML = ""; - const char_id = Number(args[9]); - const char_name = safeTags(args[3]); + const char_id = Number(args[9]); + const char_name = safeTags(args[3]); - let msg_nameplate = args[3]; - let msg_blips = "male"; - let char_chatbox = "default"; - let char_muted = false; + let msg_nameplate = args[3]; + let msg_blips = "male"; + let char_chatbox = "default"; + let char_muted = false; - if (char_id < client.char_list_length && char_id >= 0) { - if(client.chars[char_id].name !== char_name) { + if (char_id < client.char_list_length && char_id >= 0) { + if (client.chars[char_id].name !== char_name) { console.info( `${client.chars[char_id].name} is iniediting to ${char_name}` ); const chargs = (`${char_name}&` + "iniediter").split("&"); - client.handleCharacterInfo(chargs, char_id); - } + handleCharacterInfo(chargs, char_id); } + } - try { - msg_nameplate = client.chars[char_id].showname; - } catch (e) { - msg_nameplate = args[3]; - } + try { + msg_nameplate = client.chars[char_id].showname; + } catch (e) { + msg_nameplate = args[3]; + } - try { - msg_blips = client.chars[char_id].blips; - } catch (e) {} + try { + msg_blips = client.chars[char_id].blips; + } catch (e) { } - try { - char_chatbox = client.chars[char_id].chat; - } catch (e) { - char_chatbox = "default"; - } + try { + char_chatbox = client.chars[char_id].chat; + } catch (e) { + char_chatbox = "default"; + } - try { - char_muted = client.chars[char_id].muted; - } catch (e) { - char_muted = false; - console.error("we're still missing some character data"); - } + try { + char_muted = client.chars[char_id].muted; + } catch (e) { + char_muted = false; + console.error("we're still missing some character data"); + } + + if (char_muted === false) { + let chatmsg = { + deskmod: safeTags(args[1]).toLowerCase(), + preanim: safeTags(args[2]).toLowerCase(), // get preanim + nameplate: msg_nameplate, + chatbox: char_chatbox, + name: char_name, + sprite: safeTags(args[4]).toLowerCase(), + content: prepChat(args[5]), // Escape HTML tags + side: args[6].toLowerCase(), + sound: safeTags(args[7]).toLowerCase(), + blips: safeTags(msg_blips), + type: Number(args[8]), + charid: char_id, + snddelay: Number(args[10]), + objection: Number(args[11]), + evidence: safeTags(args[12]), + flip: Number(args[13]), + flash: Number(args[14]), + color: Number(args[15]), + speed: UPDATE_INTERVAL, + }; - if (char_muted === false) { - let chatmsg = { - deskmod: safeTags(args[1]).toLowerCase(), - preanim: safeTags(args[2]).toLowerCase(), // get preanim - nameplate: msg_nameplate, - chatbox: char_chatbox, - name: char_name, - sprite: safeTags(args[4]).toLowerCase(), - content: prepChat(args[5]), // Escape HTML tags - side: args[6].toLowerCase(), - sound: safeTags(args[7]).toLowerCase(), - blips: safeTags(msg_blips), - type: Number(args[8]), - charid: char_id, - snddelay: Number(args[10]), - objection: Number(args[11]), - evidence: safeTags(args[12]), - flip: Number(args[13]), - flash: Number(args[14]), - color: Number(args[15]), - speed: UPDATE_INTERVAL, + if (extrafeatures.includes("cccc_ic_support")) { + const extra_cccc = { + showname: safeTags(args[16]), + other_charid: Number(args[17]), + other_name: safeTags(args[18]), + other_emote: safeTags(args[19]), + self_offset: args[20].split(""), // HACK: here as well, client is fucked and uses this instead of & + other_offset: args[21].split(""), + other_flip: Number(args[22]), + noninterrupting_preanim: Number(args[23]), }; + chatmsg = Object.assign(extra_cccc, chatmsg); - if (extrafeatures.includes("cccc_ic_support")) { - const extra_cccc = { - showname: safeTags(args[16]), - other_charid: Number(args[17]), - other_name: safeTags(args[18]), - other_emote: safeTags(args[19]), - self_offset: args[20].split(""), // HACK: here as well, client is fucked and uses this instead of & - other_offset: args[21].split(""), - other_flip: Number(args[22]), - noninterrupting_preanim: Number(args[23]), + if (extrafeatures.includes("looping_sfx")) { + const extra_27 = { + looping_sfx: Number(args[24]), + screenshake: Number(args[25]), + frame_screenshake: safeTags(args[26]), + frame_realization: safeTags(args[27]), + frame_sfx: safeTags(args[28]), }; - chatmsg = Object.assign(extra_cccc, chatmsg); + chatmsg = Object.assign(extra_27, chatmsg); - if (extrafeatures.includes("looping_sfx")) { - const extra_27 = { - looping_sfx: Number(args[24]), - screenshake: Number(args[25]), - frame_screenshake: safeTags(args[26]), - frame_realization: safeTags(args[27]), - frame_sfx: safeTags(args[28]), + if (extrafeatures.includes("effects")) { + const extra_28 = { + additive: Number(args[29]), + effects: args[30].split("|"), }; - chatmsg = Object.assign(extra_27, chatmsg); - - if (extrafeatures.includes("effects")) { - const extra_28 = { - additive: Number(args[29]), - effects: args[30].split("|"), - }; - chatmsg = Object.assign(extra_28, chatmsg); - } else { - const extra_28 = { - additive: 0, - effects: ["", "", ""], - }; - chatmsg = Object.assign(extra_28, chatmsg); - } + chatmsg = Object.assign(extra_28, chatmsg); } else { - const extra_27 = { - looping_sfx: 0, - screenshake: 0, - frame_screenshake: "", - frame_realization: "", - frame_sfx: "", - }; - chatmsg = Object.assign(extra_27, chatmsg); const extra_28 = { additive: 0, effects: ["", "", ""], @@ -126,17 +113,6 @@ export const handleMS = (args: string[]) => { chatmsg = Object.assign(extra_28, chatmsg); } } else { - const extra_cccc = { - showname: "", - other_charid: 0, - other_name: "", - other_emote: "", - self_offset: [0, 0], - other_offset: [0, 0], - other_flip: 0, - noninterrupting_preanim: 0, - }; - chatmsg = Object.assign(extra_cccc, chatmsg); const extra_27 = { looping_sfx: 0, screenshake: 0, @@ -151,12 +127,38 @@ export const handleMS = (args: string[]) => { }; chatmsg = Object.assign(extra_28, chatmsg); } + } else { + const extra_cccc = { + showname: "", + other_charid: 0, + other_name: "", + other_emote: "", + self_offset: [0, 0], + other_offset: [0, 0], + other_flip: 0, + noninterrupting_preanim: 0, + }; + chatmsg = Object.assign(extra_cccc, chatmsg); + const extra_27 = { + looping_sfx: 0, + screenshake: 0, + frame_screenshake: "", + frame_realization: "", + frame_sfx: "", + }; + chatmsg = Object.assign(extra_27, chatmsg); + const extra_28 = { + additive: 0, + effects: ["", "", ""], + }; + chatmsg = Object.assign(extra_28, chatmsg); + } - // our own message appeared, reset the buttons - if (chatmsg.charid === client.charID) { - resetICParams(); - } - client.viewport.handle_ic_speaking(chatmsg); // no await + // our own message appeared, reset the buttons + if (chatmsg.charid === client.charID) { + resetICParams(); } + client.viewport.handle_ic_speaking(chatmsg); // no await } - } \ No newline at end of file + } +} \ No newline at end of file diff --git a/webAO/packets/handlers/handleSC.ts b/webAO/packets/handlers/handleSC.ts index f4953e0..b42a4cd 100644 --- a/webAO/packets/handlers/handleSC.ts +++ b/webAO/packets/handlers/handleSC.ts @@ -1,6 +1,7 @@ import queryParser from "../../utils/queryParser"; import { client } from '../../client' +import { handleCharacterInfo } from "../../client/handleCharacterInfo"; let { mode } = queryParser(); /** @@ -30,7 +31,7 @@ export const handleSC = async (args: string[]) => { document.getElementById("client_loadingbar") )).value = charid; await sleep(0.1); // TODO: Too many network calls without this. net::ERR_INSUFFICIENT_RESOURCES - client.handleCharacterInfo(chargs, charid); + handleCharacterInfo(chargs, charid); } // We're done with the characters, request the music client.sender.sendServer("RM#%"); diff --git a/webAO/packets/handlers/handleSM.ts b/webAO/packets/handlers/handleSM.ts index 48f9cd9..08bf7e0 100644 --- a/webAO/packets/handlers/handleSM.ts +++ b/webAO/packets/handlers/handleSM.ts @@ -1,4 +1,8 @@ import { client } from '../../client' +import { addTrack } from '../../client/addTrack' +import { isAudio } from '../../client/isAudio' +import { fix_last_area } from '../../client/fixLastArea' +import { createArea } from '../../client/createArea' /** * Handles incoming music information, containing all music in one packet. * @param {Array} args packet arguments @@ -21,14 +25,15 @@ export const handleSM = (args: string[]) => { document.getElementById("client_loadingbar") )).value = client.char_list_length + client.evidence_list_length + i; if (client.musics_time) { - client.addTrack(trackname); - } else if (client.isAudio(trackname)) { + addTrack(trackname); + } else if (isAudio(trackname)) { client.musics_time = true; - client.fix_last_area(); - client.addTrack(trackname); + fix_last_area(); + addTrack(trackname); } else { - client.createArea(trackindex, trackname); + createArea(trackindex, trackname); } + } // Music done, carry on diff --git a/webAO/packets/handlers/handleackMS.ts b/webAO/packets/handlers/handleackMS.ts index 2b971b0..dcca118 100644 --- a/webAO/packets/handlers/handleackMS.ts +++ b/webAO/packets/handlers/handleackMS.ts @@ -1,4 +1,4 @@ -import { resetICParams } from "../../client"; +import { resetICParams } from '../../client/resetICParams' /** * server got our message diff --git a/webAO/viewport.ts b/webAO/viewport.ts index 6c39784..7716409 100644 --- a/webAO/viewport.ts +++ b/webAO/viewport.ts @@ -1,19 +1,20 @@ import tryUrls from "./utils/tryUrls"; import fileExists from "./utils/fileExists"; import Client, { delay } from "./client"; -import {opusCheck} from './dom/opusCheck' +import { opusCheck } from './dom/opusCheck' import { UPDATE_INTERVAL } from "./client"; import { setChatbox } from "./dom/setChatbox"; import { resizeChatbox } from "./dom/resizeChatbox"; import transparentPng from "./constants/transparentPng"; import mlConfig from "./utils/aoml"; -import { appendICLog } from "./client"; -import { checkCallword } from "./client"; import setEmote from "./client/setEmote"; import getAnimLength from "./utils/getAnimLength"; import { safeTags } from "./encoding"; import setCookie from "./utils/setCookie"; import { AO_HOST } from "./client/aoHost"; +import { appendICLog } from "./client/appendICLog"; +import { checkCallword } from './client/checkCallword' + interface ChatMsg { content: string; objection: number; @@ -449,7 +450,7 @@ const viewport = (masterClient: Client): Viewport => { const displayname = (document.getElementById("showname")).checked && - chatmsg.showname !== "" + chatmsg.showname !== "" ? chatmsg.showname : chatmsg.nameplate; @@ -620,9 +621,9 @@ const viewport = (masterClient: Client): Viewport => { blipChannels.forEach( (channel: HTMLAudioElement) => - (channel.src = `${AO_HOST}sounds/general/sfx-blip${encodeURI( - chatmsg.blips.toLowerCase() - )}.opus`) + (channel.src = `${AO_HOST}sounds/general/sfx-blip${encodeURI( + chatmsg.blips.toLowerCase() + )}.opus`) ); // process markup @@ -637,15 +638,15 @@ const viewport = (masterClient: Client): Viewport => { fg.style.animation = ""; const effectName = chatmsg.effects[0].toLowerCase(); const badEffects = ["", "-", "none"]; - if (effectName.startsWith("rain") ) { + if (effectName.startsWith("rain")) { (document.getElementById("effect_css")).href = "styles/effects/rain.css"; let intensity = 200; - if(effectName.endsWith("weak")) { + if (effectName.endsWith("weak")) { intensity = 100; } else if (effectName.endsWith("strong")) { intensity = 400; } - if ( intensity < fg.childElementCount) + if (intensity < fg.childElementCount) fg.innerHTML = ''; else intensity = intensity - fg.childElementCount; @@ -653,9 +654,9 @@ const viewport = (masterClient: Client): Viewport => { for (let i = 0; i < intensity; i++) { let drop = document.createElement("p"); drop.style.left = (Math.random() * 100) + "%"; - drop.style.animationDelay = String(Math.random())+"s"; + drop.style.animationDelay = String(Math.random()) + "s"; fg.appendChild(drop) - } + } } else if ( chatmsg.effects[0] && !badEffects.includes(effectName) -- cgit From 108636666d474119892c4b3a2f3beadb767b006e Mon Sep 17 00:00:00 2001 From: Caleb Date: Sat, 10 Sep 2022 11:09:49 -0400 Subject: Structured viewport a little differently --- webAO/client.ts | 3 +- webAO/client/loadResources.ts | 4 +- webAO/dom/changeBlipVolume.ts | 15 + webAO/viewport.ts | 1092 -------------------------- webAO/viewport/constants/colors.ts | 11 + webAO/viewport/constants/defaultChatMsg.ts | 15 + webAO/viewport/constants/positions.ts | 45 ++ webAO/viewport/constants/shouts.ts | 1 + webAO/viewport/interfaces/ChatMsg.ts | 34 + webAO/viewport/interfaces/Desk.ts | 4 + webAO/viewport/interfaces/Position.ts | 7 + webAO/viewport/interfaces/Positions.ts | 5 + webAO/viewport/interfaces/Testimony.ts | 3 + webAO/viewport/interfaces/Viewport.ts | 24 + webAO/viewport/utils/createBlipChannels.ts | 15 + webAO/viewport/utils/createMusic.ts | 13 + webAO/viewport/utils/createSfxAudio.ts | 9 + webAO/viewport/utils/createShoutAudio.ts | 9 + webAO/viewport/utils/createTestimonyAudio.ts | 9 + webAO/viewport/viewport.ts | 901 +++++++++++++++++++++ 20 files changed, 1124 insertions(+), 1095 deletions(-) create mode 100644 webAO/dom/changeBlipVolume.ts delete mode 100644 webAO/viewport.ts create mode 100644 webAO/viewport/constants/colors.ts create mode 100644 webAO/viewport/constants/defaultChatMsg.ts create mode 100644 webAO/viewport/constants/positions.ts create mode 100644 webAO/viewport/constants/shouts.ts create mode 100644 webAO/viewport/interfaces/ChatMsg.ts create mode 100644 webAO/viewport/interfaces/Desk.ts create mode 100644 webAO/viewport/interfaces/Position.ts create mode 100644 webAO/viewport/interfaces/Positions.ts create mode 100644 webAO/viewport/interfaces/Testimony.ts create mode 100644 webAO/viewport/interfaces/Viewport.ts create mode 100644 webAO/viewport/utils/createBlipChannels.ts create mode 100644 webAO/viewport/utils/createMusic.ts create mode 100644 webAO/viewport/utils/createSfxAudio.ts create mode 100644 webAO/viewport/utils/createShoutAudio.ts create mode 100644 webAO/viewport/utils/createTestimonyAudio.ts create mode 100644 webAO/viewport/viewport.ts (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index 8b2f691..b908b62 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -8,7 +8,8 @@ import FingerprintJS from "@fingerprintjs/fingerprintjs"; import { sender, ISender } from './client/sender/index' import queryParser from "./utils/queryParser"; import getResources from "./utils/getResources.js"; -import masterViewport, { Viewport } from "./viewport"; +import masterViewport from "./viewport/viewport"; +import { Viewport } from './viewport/interfaces/Viewport'; import { EventEmitter } from "events"; import { onReplayGo } from './dom/onReplayGo' import { packetHandler } from './packets/packetHandler' diff --git a/webAO/client/loadResources.ts b/webAO/client/loadResources.ts index 7039333..65d0895 100644 --- a/webAO/client/loadResources.ts +++ b/webAO/client/loadResources.ts @@ -5,7 +5,7 @@ import { client } from "../client"; import { setChatbox } from "../dom/setChatbox"; import { changeSFXVolume, changeShoutVolume, changeTestimonyVolume } from "../dom/changeVolume"; import { showname_click } from "../dom/showNameClick"; - +import { changeBlipVolume } from '../dom/changeBlipVolume' const version = process.env.npm_package_version; /** * Load game resources and stored settings. @@ -65,7 +65,7 @@ export const loadResources = () => { changeTestimonyVolume(); (document.getElementById("client_bvolume")).value = getCookie("blipVolume") || "1"; - client.viewport.changeBlipVolume(); + changeBlipVolume(); (document.getElementById("ic_chat_name")).value = getCookie("ic_chat_name"); diff --git a/webAO/dom/changeBlipVolume.ts b/webAO/dom/changeBlipVolume.ts new file mode 100644 index 0000000..572f389 --- /dev/null +++ b/webAO/dom/changeBlipVolume.ts @@ -0,0 +1,15 @@ +import setCookie from "../utils/setCookie"; +import { client } from '../client' +/** + * Triggered by the blip volume slider. + */ +export const changeBlipVolume = () => { + const blipVolume = (( + document.getElementById("client_bvolume") + )).value; + client.viewport.blipChannels.forEach( + (channel: HTMLAudioElement) => (channel.volume = Number(blipVolume)) + ); + setCookie("blipVolume", blipVolume); +} +window.changeBlipVolume = changeBlipVolume; diff --git a/webAO/viewport.ts b/webAO/viewport.ts deleted file mode 100644 index 7716409..0000000 --- a/webAO/viewport.ts +++ /dev/null @@ -1,1092 +0,0 @@ -import tryUrls from "./utils/tryUrls"; -import fileExists from "./utils/fileExists"; -import Client, { delay } from "./client"; -import { opusCheck } from './dom/opusCheck' -import { UPDATE_INTERVAL } from "./client"; -import { setChatbox } from "./dom/setChatbox"; -import { resizeChatbox } from "./dom/resizeChatbox"; -import transparentPng from "./constants/transparentPng"; -import mlConfig from "./utils/aoml"; -import setEmote from "./client/setEmote"; -import getAnimLength from "./utils/getAnimLength"; -import { safeTags } from "./encoding"; -import setCookie from "./utils/setCookie"; -import { AO_HOST } from "./client/aoHost"; -import { appendICLog } from "./client/appendICLog"; -import { checkCallword } from './client/checkCallword' - -interface ChatMsg { - content: string; - objection: number; - sound: string; - startpreanim: boolean; - startspeaking: boolean; - side: any; - color: number; - snddelay: number; - preanimdelay: number; - speed: number; - blips: string; - self_offset?: number[]; - other_offset?: number[]; - showname?: string; - nameplate?: string; - flip?: number; - other_flip?: number; - effects?: string[]; - deskmod?: number; - preanim?: string; - other_name?: string; - sprite?: string; - name?: string; - chatbox?: string; - other_emote?: string; - parsed?: HTMLSpanElement[]; - screenshake?: number; - flash?: number; - type?: number; - evidence?: number; - looping_sfx?: boolean; - noninterrupting_preanim?: number; -} -interface Testimony { - [key: number]: string; -} -export interface Viewport { - chat_tick: Function; - changeMusicVolume: Function; - changeBlipVolume: Function; - reloadTheme: Function; - playSFX: Function; - set_side: Function; - initTestimonyUpdater: Function; - updateTestimony: Function; - disposeTestimony: Function; - handle_ic_speaking: Function; - handleTextTick: Function; - theme: string; - chatmsg: ChatMsg; - setSfxAudio: Function; - getSfxAudio: Function; - getBackgroundFolder: Function; - blipChannels: HTMLAudioElement[]; - music: any; - musicVolume: number; - setBackgroundName: Function; - lastChar: string; - getBackgroundName: Function; -} -const SHOUTS = [undefined, "holdit", "objection", "takethat", "custom"]; - -const COLORS = [ - "white", - "green", - "red", - "orange", - "blue", - "yellow", - "pink", - "cyan", - "grey", -]; -const createMusic = () => { - const audioChannels = document.getElementsByClassName( - "audioChannel" - ) as HTMLCollectionOf; - let music = [...audioChannels]; - music.forEach((channel: HTMLAudioElement) => (channel.volume = 0.5)); - music.forEach( - (channel: HTMLAudioElement) => (channel.onerror = opusCheck(channel)) - ); - return music; -}; -const createTestimonyAudio = () => { - const testimonyAudio = document.getElementById( - "client_testimonyaudio" - ) as HTMLAudioElement; - testimonyAudio.src = `${AO_HOST}sounds/general/sfx-guilty.opus`; - return testimonyAudio; -}; - -const createShoutAudio = () => { - const shoutAudio = document.getElementById( - "client_shoutaudio" - ) as HTMLAudioElement; - shoutAudio.src = `${AO_HOST}misc/default/objection.opus`; - return shoutAudio; -}; -const createSfxAudio = () => { - const sfxAudio = document.getElementById( - "client_sfxaudio" - ) as HTMLAudioElement; - sfxAudio.src = `${AO_HOST}sounds/general/sfx-realization.opus`; - return sfxAudio; -}; -const createBlipsChannels = () => { - const blipSelectors = document.getElementsByClassName( - "blipSound" - ) as HTMLCollectionOf; - - const blipChannels = [...blipSelectors]; - // Allocate multiple blip audio channels to make blips less jittery - blipChannels.forEach((channel: HTMLAudioElement) => (channel.volume = 0.5)); - blipChannels.forEach( - (channel: HTMLAudioElement) => (channel.onerror = opusCheck(channel)) - ); - return blipChannels; -}; -const defaultChatMsg = { - content: "", - objection: 0, - sound: "", - startpreanim: true, - startspeaking: false, - side: null, - color: 0, - snddelay: 0, - preanimdelay: 0, - speed: UPDATE_INTERVAL, -} as ChatMsg; -interface Desk { - ao2?: string; - ao1?: string; -} -interface Position { - bg?: string; - desk?: Desk; - speedLines: string; -} - -interface Positions { - [key: string]: Position; -} - -const positions: Positions = { - def: { - bg: "defenseempty", - desk: { ao2: "defensedesk.png", ao1: "bancodefensa.png" } as Desk, - speedLines: "defense_speedlines.gif", - }, - pro: { - bg: "prosecutorempty", - desk: { ao2: "prosecutiondesk.png", ao1: "bancoacusacion.png" } as Desk, - speedLines: "prosecution_speedlines.gif", - }, - hld: { - bg: "helperstand", - desk: null as Desk, - speedLines: "defense_speedlines.gif", - }, - hlp: { - bg: "prohelperstand", - desk: null as Desk, - speedLines: "prosecution_speedlines.gif", - }, - wit: { - bg: "witnessempty", - desk: { ao2: "stand.png", ao1: "estrado.png" } as Desk, - speedLines: "prosecution_speedlines.gif", - }, - jud: { - bg: "judgestand", - desk: { ao2: "judgedesk.png", ao1: "judgedesk.gif" } as Desk, - speedLines: "prosecution_speedlines.gif", - }, - jur: { - bg: "jurystand", - desk: { ao2: "jurydesk.png", ao1: "estrado.png" } as Desk, - speedLines: "defense_speedlines.gif", - }, - sea: { - bg: "seancestand", - desk: { ao2: "seancedesk.png", ao1: "estrado.png" } as Desk, - speedLines: "prosecution_speedlines.gif", - }, -}; -const viewport = (masterClient: Client): Viewport => { - let animating = false; - let attorneyMarkdown = mlConfig(AO_HOST); - let blipChannels = createBlipsChannels(); - let chatmsg = defaultChatMsg; - let client = masterClient; - let currentBlipChannel = 0; - let lastChar = ""; - let lastEvi = 0; - let music = createMusic(); - let musicVolume = 0; - let sfxAudio = createSfxAudio(); - let sfxplayed = 0; - let shoutTimer = 0; - let shoutaudio = createShoutAudio(); - let startFirstTickCheck: boolean; - let startSecondTickCheck: boolean; - let startThirdTickCheck: boolean; - let testimonyAudio = createTestimonyAudio(); - let testimonyTimer = 0; - let testimonyUpdater: any; - let textnow = ""; - let theme: string; - let tickTimer = 0; - let updater: any; - let backgroundName = ""; - const getSfxAudio = () => sfxAudio; - const setSfxAudio = (value: HTMLAudioElement) => (sfxAudio = value); - const getBackgroundName = () => backgroundName; - const setBackgroundName = (value: string) => (backgroundName = value); - const getBackgroundFolder = () => - `${AO_HOST}background/${encodeURI(backgroundName.toLowerCase())}/`; - - const playSFX = async (sfxname: string, looping: boolean) => { - sfxAudio.pause(); - sfxAudio.loop = looping; - sfxAudio.src = sfxname; - sfxAudio.play(); - }; - - /** - * Changes the viewport background based on a given position. - * - * Valid positions: `def, pro, hld, hlp, wit, jud, jur, sea` - * @param {string} position the position to change into - */ - const set_side = async ({ - position, - showSpeedLines, - showDesk, - }: { - position: string; - showSpeedLines: boolean; - showDesk: boolean; - }) => { - const view = document.getElementById("client_fullview"); - - let bench: HTMLImageElement; - if ("def,pro,wit".includes(position)) { - bench = ( - document.getElementById(`client_${position}_bench`) - ); - } else { - bench = document.getElementById("client_bench_classic"); - } - - let court: HTMLImageElement; - if ("def,pro,wit".includes(position)) { - court = ( - document.getElementById(`client_court_${position}`) - ); - } else { - court = document.getElementById("client_court_classic"); - } - - let bg; - let desk; - let speedLines; - - if ("def,pro,hld,hlp,wit,jud,jur,sea".includes(position)) { - bg = positions[position].bg; - desk = positions[position].desk; - speedLines = positions[position].speedLines; - } else { - bg = `${position}`; - desk = { ao2: `${position}_overlay.png`, ao1: "_overlay.png" }; - speedLines = "defense_speedlines.gif"; - } - - if (showSpeedLines === true) { - court.src = `${AO_HOST}themes/default/${encodeURI(speedLines)}`; - } else { - court.src = await tryUrls(getBackgroundFolder() + bg); - } - - if (showDesk === true && desk) { - const deskFilename = (await fileExists(getBackgroundFolder() + desk.ao2)) - ? desk.ao2 - : desk.ao1; - bench.src = getBackgroundFolder() + deskFilename; - bench.style.opacity = "1"; - } else { - bench.style.opacity = "0"; - } - - if ("def,pro,wit".includes(position)) { - view.style.display = ""; - document.getElementById("client_classicview").style.display = "none"; - switch (position) { - case "def": - view.style.left = "0"; - break; - case "wit": - view.style.left = "-200%"; - break; - case "pro": - view.style.left = "-400%"; - break; - } - } else { - view.style.display = "none"; - document.getElementById("client_classicview").style.display = ""; - } - }; - - /** - * Intialize testimony updater - */ - const initTestimonyUpdater = () => { - const testimonyFilenames: Testimony = { - 1: "witnesstestimony", - 2: "crossexamination", - 3: "notguilty", - 4: "guilty", - }; - - const testimony = testimonyFilenames[masterClient.testimonyID]; - if (!testimony) { - console.warn(`Invalid testimony ID ${masterClient.testimonyID}`); - return; - } - - testimonyAudio.src = masterClient.resources[testimony].sfx; - testimonyAudio.play(); - - const testimonyOverlay = ( - document.getElementById("client_testimony") - ); - testimonyOverlay.src = masterClient.resources[testimony].src; - testimonyOverlay.style.opacity = "1"; - - testimonyTimer = 0; - testimonyUpdater = setTimeout(() => updateTestimony(), UPDATE_INTERVAL); - }; - - /** - * Updates the testimony overaly - */ - const updateTestimony = () => { - const testimonyFilenames: Testimony = { - 1: "witnesstestimony", - 2: "crossexamination", - 3: "notguilty", - 4: "guilty", - }; - - // Update timer - testimonyTimer += UPDATE_INTERVAL; - - const testimony = testimonyFilenames[masterClient.testimonyID]; - const resource = masterClient.resources[testimony]; - if (!resource) { - disposeTestimony(); - return; - } - - if (testimonyTimer >= resource.duration) { - disposeTestimony(); - } else { - testimonyUpdater = setTimeout(() => updateTestimony(), UPDATE_INTERVAL); - } - }; - - /** - * Dispose the testimony overlay - */ - const disposeTestimony = () => { - masterClient.testimonyID = 0; - testimonyTimer = 0; - document.getElementById("client_testimony").style.opacity = "0"; - clearTimeout(testimonyUpdater); - }; - - /** - * Sets a new emote. - * This sets up everything before the tick() loops starts - * a lot of things can probably be moved here, like starting the shout animation if there is one - * TODO: the preanim logic, on the other hand, should probably be moved to tick() - * @param {object} chatmsg the new chat message - */ - const handle_ic_speaking = async (playerChatMsg: ChatMsg) => { - chatmsg = playerChatMsg; - client.viewport.chatmsg = playerChatMsg; - - textnow = ""; - sfxplayed = 0; - tickTimer = 0; - animating = true; - startFirstTickCheck = true; - startSecondTickCheck = false; - startThirdTickCheck = false; - let charLayers = document.getElementById("client_char"); - let pairLayers = document.getElementById("client_pair_char"); - // stop updater - clearTimeout(updater); - - // stop last sfx from looping any longer - sfxAudio.loop = false; - - const fg = document.getElementById("client_fg"); - const gamewindow = document.getElementById("client_gamewindow"); - const waitingBox = document.getElementById("client_chatwaiting"); - - // Reset CSS animation - gamewindow.style.animation = ""; - waitingBox.style.opacity = "0"; - - const eviBox = document.getElementById("client_evi"); - - if (lastEvi !== chatmsg.evidence) { - eviBox.style.opacity = "0"; - eviBox.style.height = "0%"; - } - lastEvi = chatmsg.evidence; - - const validSides: string[] = ["def", "pro", "wit"]; // these are for the full view pan, the other positions use 'client_char' - if (validSides.includes(chatmsg.side)) { - charLayers = document.getElementById(`client_${chatmsg.side}_char`); - pairLayers = document.getElementById(`client_${chatmsg.side}_pair_char`); - } - - const chatContainerBox = document.getElementById("client_chatcontainer"); - const nameBoxInner = document.getElementById("client_inner_name"); - const chatBoxInner = document.getElementById("client_inner_chat"); - - const displayname = - (document.getElementById("showname")).checked && - chatmsg.showname !== "" - ? chatmsg.showname - : chatmsg.nameplate; - - // Clear out the last message - chatBoxInner.innerText = textnow; - nameBoxInner.innerText = displayname; - - if (lastChar !== chatmsg.name) { - charLayers.style.opacity = "0"; - pairLayers.style.opacity = "0"; - } - - lastChar = chatmsg.name; - client.viewport.lastChar = chatmsg.name; - - appendICLog(chatmsg.content, chatmsg.showname, chatmsg.nameplate); - - checkCallword(chatmsg.content, sfxAudio); - - setEmote( - AO_HOST, - client, - chatmsg.name.toLowerCase(), - chatmsg.sprite, - "(a)", - false, - chatmsg.side - ); - - if (chatmsg.other_name) { - setEmote( - AO_HOST, - client, - chatmsg.other_name.toLowerCase(), - chatmsg.other_emote, - "(a)", - false, - chatmsg.side - ); - } - - // gets which shout shall played - const shoutSprite = ( - document.getElementById("client_shout") - ); - const shout = SHOUTS[chatmsg.objection]; - if (shout) { - // Hide message box - chatContainerBox.style.opacity = "0"; - if (chatmsg.objection === 4) { - shoutSprite.src = `${AO_HOST}characters/${encodeURI( - chatmsg.name.toLowerCase() - )}/custom.gif`; - } else { - shoutSprite.src = masterClient.resources[shout].src; - shoutSprite.style.animation = "bubble 700ms steps(10, jump-both)"; - } - shoutSprite.style.opacity = "1"; - - shoutaudio.src = `${AO_HOST}characters/${encodeURI( - chatmsg.name.toLowerCase() - )}/${shout}.opus`; - shoutaudio.play(); - shoutTimer = masterClient.resources[shout].duration; - } else { - shoutTimer = 0; - } - - chatmsg.startpreanim = true; - let gifLength = 0; - - if (chatmsg.type === 1 && chatmsg.preanim !== "-") { - //we have a preanim - chatContainerBox.style.opacity = "0"; - gifLength = await getAnimLength( - `${AO_HOST}characters/${encodeURI( - chatmsg.name.toLowerCase() - )}/${encodeURI(chatmsg.preanim)}` - ); - console.debug("preanim is " + gifLength + " long"); - chatmsg.startspeaking = false; - } else { - chatmsg.startspeaking = true; - if (chatmsg.content !== "") chatContainerBox.style.opacity = "1"; - } - chatmsg.preanimdelay = gifLength; - const setAside = { - position: chatmsg.side, - showSpeedLines: false, - showDesk: false, - }; - let skipoffset: boolean = false; - if (chatmsg.type === 5) { - setAside.showSpeedLines = true; - setAside.showDesk = false; - set_side(setAside); - } else { - switch (Number(chatmsg.deskmod)) { - case 0: //desk is hidden - setAside.showSpeedLines = false; - setAside.showDesk = false; - set_side(setAside); - break; - case 1: //desk is shown - setAside.showSpeedLines = false; - setAside.showDesk = true; - set_side(setAside); - break; - case 2: //desk is hidden during preanim, but shown during idle/talk - setAside.showSpeedLines = false; - setAside.showDesk = false; - set_side(setAside); - break; - case 3: //opposite of 2 - setAside.showSpeedLines = false; - setAside.showDesk = false; - set_side(setAside); - break; - case 4: //desk is hidden, character offset is ignored, pair character is hidden during preanim, normal behavior during idle/talk - setAside.showSpeedLines = false; - setAside.showDesk = false; - set_side(setAside); - skipoffset = true; - break; - case 5: //opposite of 4 - setAside.showSpeedLines = false; - setAside.showDesk = true; - set_side(setAside); - break; - default: - setAside.showSpeedLines = false; - setAside.showDesk = true; - set_side(setAside); - break; - } - } - - setChatbox(chatmsg.chatbox); - resizeChatbox(); - - if (!skipoffset) { - // Flip the character - charLayers.style.transform = - chatmsg.flip === 1 ? "scaleX(-1)" : "scaleX(1)"; - pairLayers.style.transform = - chatmsg.other_flip === 1 ? "scaleX(-1)" : "scaleX(1)"; - - // Shift by the horizontal offset - switch (chatmsg.side) { - case "wit": - pairLayers.style.left = `${200 + Number(chatmsg.other_offset[0])}%`; - charLayers.style.left = `${200 + Number(chatmsg.self_offset[0])}%`; - break; - case "pro": - pairLayers.style.left = `${400 + Number(chatmsg.other_offset[0])}%`; - charLayers.style.left = `${400 + Number(chatmsg.self_offset[0])}%`; - break; - default: - pairLayers.style.left = `${Number(chatmsg.other_offset[0])}%`; - charLayers.style.left = `${Number(chatmsg.self_offset[0])}%`; - break; - } - - // New vertical offsets - pairLayers.style.top = `${Number(chatmsg.other_offset[1])}%`; - charLayers.style.top = `${Number(chatmsg.self_offset[1])}%`; - } - - blipChannels.forEach( - (channel: HTMLAudioElement) => - (channel.src = `${AO_HOST}sounds/general/sfx-blip${encodeURI( - chatmsg.blips.toLowerCase() - )}.opus`) - ); - - // process markup - if (chatmsg.content.startsWith("~~")) { - chatBoxInner.style.textAlign = "center"; - chatmsg.content = chatmsg.content.substring(2, chatmsg.content.length); - } else { - chatBoxInner.style.textAlign = "inherit"; - } - - // apply effects - fg.style.animation = ""; - const effectName = chatmsg.effects[0].toLowerCase(); - const badEffects = ["", "-", "none"]; - if (effectName.startsWith("rain")) { - (document.getElementById("effect_css")).href = "styles/effects/rain.css"; - let intensity = 200; - if (effectName.endsWith("weak")) { - intensity = 100; - } else if (effectName.endsWith("strong")) { - intensity = 400; - } - if (intensity < fg.childElementCount) - fg.innerHTML = ''; - else - intensity = intensity - fg.childElementCount; - - for (let i = 0; i < intensity; i++) { - let drop = document.createElement("p"); - drop.style.left = (Math.random() * 100) + "%"; - drop.style.animationDelay = String(Math.random()) + "s"; - fg.appendChild(drop) - } - } else if ( - chatmsg.effects[0] && - !badEffects.includes(effectName) - ) { - (document.getElementById("effect_css")).href = ""; - fg.innerHTML = ''; - const baseEffectUrl = `${AO_HOST}themes/default/effects/`; - fg.src = `${baseEffectUrl}${encodeURI(effectName)}.webp`; - } else { - fg.innerHTML = ''; - fg.src = transparentPng; - } - - charLayers.style.opacity = "1"; - - const soundChecks = ["0", "1", "", undefined]; - if (soundChecks.some((check) => chatmsg.sound === check)) { - chatmsg.sound = chatmsg.effects[2]; - } - chatmsg.parsed = await attorneyMarkdown.applyMarkdown( - chatmsg.content, - COLORS[chatmsg.color] - ); - chat_tick(); - }; - - const handleTextTick = async (charLayers: HTMLImageElement) => { - const chatBox = document.getElementById("client_chat"); - const waitingBox = document.getElementById("client_chatwaiting"); - const chatBoxInner = document.getElementById("client_inner_chat"); - const charName = chatmsg.name.toLowerCase(); - const charEmote = chatmsg.sprite.toLowerCase(); - - if (chatmsg.content.charAt(textnow.length) !== " ") { - blipChannels[currentBlipChannel].play(); - currentBlipChannel++; - currentBlipChannel %= blipChannels.length; - } - textnow = chatmsg.content.substring(0, textnow.length + 1); - const characterElement = chatmsg.parsed[textnow.length - 1]; - if (characterElement) { - const COMMAND_IDENTIFIER = "\\"; - - const nextCharacterElement = chatmsg.parsed[textnow.length]; - const flash = async () => { - const effectlayer = document.getElementById("client_fg"); - playSFX(`${AO_HOST}sounds/general/sfx-realization.opus`, false); - effectlayer.style.animation = "flash 0.4s 1"; - await delay(400); - effectlayer.style.removeProperty("animation"); - }; - - const shake = async () => { - const gamewindow = document.getElementById("client_gamewindow"); - playSFX(`${AO_HOST}sounds/general/sfx-stab.opus`, false); - gamewindow.style.animation = "shake 0.2s 1"; - await delay(200); - gamewindow.style.removeProperty("animation"); - }; - - const commands = new Map( - Object.entries({ - s: shake, - f: flash, - }) - ); - const textSpeeds = new Set(["{", "}"]); - - // Changing Text Speed - if (textSpeeds.has(characterElement.innerHTML)) { - // Grab them all in a row - const MAX_SLOW_CHATSPEED = 120; - for (let i = textnow.length; i < chatmsg.content.length; i++) { - const currentCharacter = chatmsg.parsed[i - 1].innerHTML; - if (currentCharacter === "}") { - if (chatmsg.speed > 0) { - chatmsg.speed -= 20; - } - } else if (currentCharacter === "{") { - if (chatmsg.speed < MAX_SLOW_CHATSPEED) { - chatmsg.speed += 20; - } - } else { - // No longer at a speed character - textnow = chatmsg.content.substring(0, i); - break; - } - } - } - - if ( - characterElement.innerHTML === COMMAND_IDENTIFIER && - commands.has(nextCharacterElement?.innerHTML) - ) { - textnow = chatmsg.content.substring(0, textnow.length + 1); - await commands.get(nextCharacterElement.innerHTML)(); - } else { - chatBoxInner.appendChild(chatmsg.parsed[textnow.length - 1]); - } - } - // scroll to bottom - chatBox.scrollTop = chatBox.scrollHeight; - - if (textnow === chatmsg.content) { - animating = false; - setEmote( - AO_HOST, - client, - charName, - charEmote, - "(a)", - false, - chatmsg.side - ); - charLayers.style.opacity = "1"; - waitingBox.style.opacity = "1"; - clearTimeout(updater); - } - }; - /** - * Updates the chatbox based on the given text. - * - * OK, here's the documentation on how this works: - * - * 1 _animating - * If we're not done with this characters animation, i.e. his text isn't fully there, set a timeout for the next tick/step to happen - * - * 2 startpreanim - * If the shout timer is over it starts with the preanim - * The first thing it checks for is the shake effect (TODO on client this is handled by the @ symbol and not a flag ) - * Then is the flash/realization effect - * After that, the shout image set to be transparent - * and the main characters preanim gif is loaded - * If pairing is supported the paired character will just stand around with his idle sprite - * - * 3 preanimdelay over - * this animates the evidence popup and finally shows the character name and message box - * it sets the text color and the character speaking sprite - * - * 4 textnow != content - * this adds a character to the textbox and stops the animations if the entire message is present in the textbox - * - * 5 sfx - * independent of the stuff above, this will play any sound effects specified by the emote the character sent. - * happens after the shout delay + an sfx delay that comes with the message packet - * - * XXX: This relies on a global variable `chatmsg`! - */ - const chat_tick = async () => { - // note: this is called fairly often - // do not perform heavy operations here - - await delay(chatmsg.speed); - if (textnow === chatmsg.content) { - return; - } - - const gamewindow = document.getElementById("client_gamewindow"); - const waitingBox = document.getElementById("client_chatwaiting"); - const eviBox = document.getElementById("client_evi"); - const shoutSprite = ( - document.getElementById("client_shout") - ); - const effectlayer = document.getElementById("client_fg"); - const chatBoxInner = document.getElementById("client_inner_chat"); - let charLayers = document.getElementById("client_char"); - let pairLayers = ( - document.getElementById("client_pair_char") - ); - - const validSides: string[] = ["def", "pro", "wit"]; // these are for the full view pan, the other positions use 'client_char' - if (validSides.includes(chatmsg.side)) { - charLayers = ( - document.getElementById(`client_${chatmsg.side}_char`) - ); - pairLayers = ( - document.getElementById(`client_${chatmsg.side}_pair_char`) - ); - } - - const charName = chatmsg.name.toLowerCase(); - const charEmote = chatmsg.sprite.toLowerCase(); - - const pairName = chatmsg.other_name.toLowerCase(); - const pairEmote = chatmsg.other_emote.toLowerCase(); - - // TODO: preanims sometimes play when they're not supposed to - const isShoutOver = tickTimer >= shoutTimer; - const isShoutAndPreanimOver = - tickTimer >= shoutTimer + chatmsg.preanimdelay; - if (isShoutOver && startFirstTickCheck) { - // Effect stuff - if (chatmsg.screenshake === 1) { - // Shake screen - playSFX(`${AO_HOST}sounds/general/sfx-stab.opus`, false); - gamewindow.style.animation = "shake 0.2s 1"; - } - if (chatmsg.flash === 1) { - // Flash screen - playSFX(`${AO_HOST}sounds/general/sfx-realization.opus`, false); - effectlayer.style.animation = "flash 0.4s 1"; - } - - // Pre-animation stuff - if (chatmsg.preanimdelay > 0) { - shoutSprite.style.opacity = "0"; - shoutSprite.style.animation = ""; - const preanim = chatmsg.preanim.toLowerCase(); - setEmote(AO_HOST, client, charName, preanim, "", false, chatmsg.side); - } - - if (chatmsg.other_name) { - pairLayers.style.opacity = "1"; - } else { - pairLayers.style.opacity = "0"; - } - // Done with first check, move to second - startFirstTickCheck = false; - startSecondTickCheck = true; - - chatmsg.startpreanim = false; - chatmsg.startspeaking = true; - } - - const hasNonInterruptingPreAnim = chatmsg.noninterrupting_preanim === 1; - if (textnow !== chatmsg.content && hasNonInterruptingPreAnim) { - const chatContainerBox = document.getElementById("client_chatcontainer"); - chatContainerBox.style.opacity = "1"; - await handleTextTick(charLayers); - } else if (isShoutAndPreanimOver && startSecondTickCheck) { - if (chatmsg.startspeaking) { - chatmsg.startspeaking = false; - - // Evidence Bullshit - if (chatmsg.evidence > 0) { - // Prepare evidence - eviBox.src = safeTags( - masterClient.evidences[chatmsg.evidence - 1].icon - ); - - eviBox.style.width = "auto"; - eviBox.style.height = "36.5%"; - eviBox.style.opacity = "1"; - - testimonyAudio.src = `${AO_HOST}sounds/general/sfx-evidenceshoop.opus`; - testimonyAudio.play(); - - if (chatmsg.side === "def") { - // Only def show evidence on right - eviBox.style.right = "1em"; - eviBox.style.left = "initial"; - } else { - eviBox.style.right = "initial"; - eviBox.style.left = "1em"; - } - } - chatBoxInner.className = `text_${COLORS[chatmsg.color]}`; - - if (chatmsg.preanimdelay === 0) { - shoutSprite.style.opacity = "0"; - shoutSprite.style.animation = ""; - } - - switch (Number(chatmsg.deskmod)) { - case 2: - set_side({ - position: chatmsg.side, - showSpeedLines: false, - showDesk: true, - }); - break; - case 3: - set_side({ - position: chatmsg.side, - showSpeedLines: false, - showDesk: false, - }); - break; - case 4: - set_side({ - position: chatmsg.side, - showSpeedLines: false, - showDesk: true, - }); - break; - case 5: - set_side({ - position: chatmsg.side, - showSpeedLines: false, - showDesk: false, - }); - break; - } - - if (chatmsg.other_name) { - setEmote( - AO_HOST, - client, - pairName, - pairEmote, - "(a)", - true, - chatmsg.side - ); - pairLayers.style.opacity = "1"; - } else { - pairLayers.style.opacity = "0"; - } - - setEmote( - AO_HOST, - client, - charName, - charEmote, - "(b)", - false, - chatmsg.side - ); - charLayers.style.opacity = "1"; - - if (textnow === chatmsg.content) { - setEmote( - AO_HOST, - client, - charName, - charEmote, - "(a)", - false, - chatmsg.side - ); - charLayers.style.opacity = "1"; - waitingBox.style.opacity = "1"; - animating = false; - clearTimeout(updater); - return; - } - } else if (textnow !== chatmsg.content) { - const chatContainerBox = document.getElementById( - "client_chatcontainer" - ); - chatContainerBox.style.opacity = "1"; - await handleTextTick(charLayers); - } - } - - if (!sfxplayed && chatmsg.snddelay + shoutTimer >= tickTimer) { - sfxplayed = 1; - if ( - chatmsg.sound !== "0" && - chatmsg.sound !== "1" && - chatmsg.sound !== "" && - chatmsg.sound !== undefined && - (chatmsg.type == 1 || chatmsg.type == 2 || chatmsg.type == 6) - ) { - playSFX( - `${AO_HOST}sounds/general/${encodeURI( - chatmsg.sound.toLowerCase() - )}.opus`, - chatmsg.looping_sfx - ); - } - } - if (animating) { - chat_tick(); - } - tickTimer += UPDATE_INTERVAL; - }; - /** - * Triggered by the theme selector. - */ - function reloadTheme() { - theme = (document.getElementById("client_themeselect")) - .value; - - setCookie("theme", theme); - (( - document.getElementById("client_theme") - )).href = `styles/${theme}.css`; - } - window.reloadTheme = reloadTheme; - /** - * Triggered by the blip volume slider. - */ - function changeBlipVolume() { - const blipVolume = (( - document.getElementById("client_bvolume") - )).value; - blipChannels.forEach( - (channel: HTMLAudioElement) => (channel.volume = Number(blipVolume)) - ); - setCookie("blipVolume", blipVolume); - } - window.changeBlipVolume = changeBlipVolume; - - const changeMusicVolume = (volume: number = -1) => { - const clientVolume = Number( - (document.getElementById("client_mvolume")).value - ); - let musicVolume = volume === -1 ? clientVolume : volume; - music.forEach( - (channel: HTMLAudioElement) => (channel.volume = musicVolume) - ); - setCookie("musicVolume", String(musicVolume)); - }; - window.changeMusicVolume = changeMusicVolume; - - return { - chat_tick, - changeMusicVolume, - changeBlipVolume, - reloadTheme, - playSFX, - set_side, - setBackgroundName, - initTestimonyUpdater, - updateTestimony, - disposeTestimony, - handle_ic_speaking, - handleTextTick, - getBackgroundFolder, - getBackgroundName, - getSfxAudio, - setSfxAudio, - theme, - chatmsg, - blipChannels, - lastChar, - music, - musicVolume, - }; -}; - -export default viewport; diff --git a/webAO/viewport/constants/colors.ts b/webAO/viewport/constants/colors.ts new file mode 100644 index 0000000..aad3530 --- /dev/null +++ b/webAO/viewport/constants/colors.ts @@ -0,0 +1,11 @@ +export const COLORS = [ + "white", + "green", + "red", + "orange", + "blue", + "yellow", + "pink", + "cyan", + "grey", + ]; \ No newline at end of file diff --git a/webAO/viewport/constants/defaultChatMsg.ts b/webAO/viewport/constants/defaultChatMsg.ts new file mode 100644 index 0000000..8a5db6b --- /dev/null +++ b/webAO/viewport/constants/defaultChatMsg.ts @@ -0,0 +1,15 @@ +import { UPDATE_INTERVAL } from "../../client"; +import { ChatMsg } from "../interfaces/ChatMsg"; + +export const defaultChatMsg = { + content: "", + objection: 0, + sound: "", + startpreanim: true, + startspeaking: false, + side: null, + color: 0, + snddelay: 0, + preanimdelay: 0, + speed: UPDATE_INTERVAL, + } as ChatMsg; \ No newline at end of file diff --git a/webAO/viewport/constants/positions.ts b/webAO/viewport/constants/positions.ts new file mode 100644 index 0000000..1712ac6 --- /dev/null +++ b/webAO/viewport/constants/positions.ts @@ -0,0 +1,45 @@ +import { Positions } from '../interfaces/Positions' +import { Desk } from '../interfaces/Desk'; + +export const positions: Positions = { + def: { + bg: "defenseempty", + desk: { ao2: "defensedesk.png", ao1: "bancodefensa.png" } as Desk, + speedLines: "defense_speedlines.gif", + }, + pro: { + bg: "prosecutorempty", + desk: { ao2: "prosecutiondesk.png", ao1: "bancoacusacion.png" } as Desk, + speedLines: "prosecution_speedlines.gif", + }, + hld: { + bg: "helperstand", + desk: {} as Desk, + speedLines: "defense_speedlines.gif", + }, + hlp: { + bg: "prohelperstand", + desk: {} as Desk, + speedLines: "prosecution_speedlines.gif", + }, + wit: { + bg: "witnessempty", + desk: { ao2: "stand.png", ao1: "estrado.png" } as Desk, + speedLines: "prosecution_speedlines.gif", + }, + jud: { + bg: "judgestand", + desk: { ao2: "judgedesk.png", ao1: "judgedesk.gif" } as Desk, + speedLines: "prosecution_speedlines.gif", + }, + jur: { + bg: "jurystand", + desk: { ao2: "jurydesk.png", ao1: "estrado.png" } as Desk, + speedLines: "defense_speedlines.gif", + }, + sea: { + bg: "seancestand", + desk: { ao2: "seancedesk.png", ao1: "estrado.png" } as Desk, + speedLines: "prosecution_speedlines.gif", + }, +}; \ No newline at end of file diff --git a/webAO/viewport/constants/shouts.ts b/webAO/viewport/constants/shouts.ts new file mode 100644 index 0000000..eddd6d3 --- /dev/null +++ b/webAO/viewport/constants/shouts.ts @@ -0,0 +1 @@ +export const SHOUTS = [undefined, "holdit", "objection", "takethat", "custom"]; diff --git a/webAO/viewport/interfaces/ChatMsg.ts b/webAO/viewport/interfaces/ChatMsg.ts new file mode 100644 index 0000000..293a774 --- /dev/null +++ b/webAO/viewport/interfaces/ChatMsg.ts @@ -0,0 +1,34 @@ +export interface ChatMsg { + content: string; + objection: number; + sound: string; + startpreanim: boolean; + startspeaking: boolean; + side: any; + color: number; + snddelay: number; + preanimdelay: number; + speed: number; + blips: string; + self_offset?: number[]; + other_offset?: number[]; + showname?: string; + nameplate?: string; + flip?: number; + other_flip?: number; + effects?: string[]; + deskmod?: number; + preanim?: string; + other_name?: string; + sprite?: string; + name?: string; + chatbox?: string; + other_emote?: string; + parsed?: HTMLSpanElement[]; + screenshake?: number; + flash?: number; + type?: number; + evidence?: number; + looping_sfx?: boolean; + noninterrupting_preanim?: number; + } \ No newline at end of file diff --git a/webAO/viewport/interfaces/Desk.ts b/webAO/viewport/interfaces/Desk.ts new file mode 100644 index 0000000..872426a --- /dev/null +++ b/webAO/viewport/interfaces/Desk.ts @@ -0,0 +1,4 @@ +export interface Desk { + ao2?: string; + ao1?: string; +} \ No newline at end of file diff --git a/webAO/viewport/interfaces/Position.ts b/webAO/viewport/interfaces/Position.ts new file mode 100644 index 0000000..dea7238 --- /dev/null +++ b/webAO/viewport/interfaces/Position.ts @@ -0,0 +1,7 @@ +import { Desk } from './Desk' + +export interface Position { + bg?: string; + desk?: Desk; + speedLines: string; +} \ No newline at end of file diff --git a/webAO/viewport/interfaces/Positions.ts b/webAO/viewport/interfaces/Positions.ts new file mode 100644 index 0000000..0644962 --- /dev/null +++ b/webAO/viewport/interfaces/Positions.ts @@ -0,0 +1,5 @@ +import { Position } from './Position' + +export interface Positions { + [key: string]: Position; +} \ No newline at end of file diff --git a/webAO/viewport/interfaces/Testimony.ts b/webAO/viewport/interfaces/Testimony.ts new file mode 100644 index 0000000..61a7491 --- /dev/null +++ b/webAO/viewport/interfaces/Testimony.ts @@ -0,0 +1,3 @@ +export interface Testimony { + [key: number]: string; +} \ No newline at end of file diff --git a/webAO/viewport/interfaces/Viewport.ts b/webAO/viewport/interfaces/Viewport.ts new file mode 100644 index 0000000..3ffbcc8 --- /dev/null +++ b/webAO/viewport/interfaces/Viewport.ts @@ -0,0 +1,24 @@ +import { ChatMsg } from "./ChatMsg"; +export interface Viewport { + chat_tick: Function; + changeMusicVolume: Function; + reloadTheme: Function; + playSFX: Function; + set_side: Function; + initTestimonyUpdater: Function; + updateTestimony: Function; + disposeTestimony: Function; + handle_ic_speaking: Function; + handleTextTick: Function; + theme: string; + chatmsg: ChatMsg; + setSfxAudio: Function; + getSfxAudio: Function; + getBackgroundFolder: Function; + blipChannels: HTMLAudioElement[]; + music: any; + musicVolume: number; + setBackgroundName: Function; + lastChar: string; + getBackgroundName: Function; +} \ No newline at end of file diff --git a/webAO/viewport/utils/createBlipChannels.ts b/webAO/viewport/utils/createBlipChannels.ts new file mode 100644 index 0000000..6296b3b --- /dev/null +++ b/webAO/viewport/utils/createBlipChannels.ts @@ -0,0 +1,15 @@ +import { opusCheck } from "../../dom/opusCheck"; + +export const createBlipsChannels = () => { + const blipSelectors = document.getElementsByClassName( + "blipSound" + ) as HTMLCollectionOf; + + const blipChannels = [...blipSelectors]; + // Allocate multiple blip audio channels to make blips less jittery + blipChannels.forEach((channel: HTMLAudioElement) => (channel.volume = 0.5)); + blipChannels.forEach( + (channel: HTMLAudioElement) => (channel.onerror = opusCheck(channel)) + ); + return blipChannels; +}; \ No newline at end of file diff --git a/webAO/viewport/utils/createMusic.ts b/webAO/viewport/utils/createMusic.ts new file mode 100644 index 0000000..9bf5240 --- /dev/null +++ b/webAO/viewport/utils/createMusic.ts @@ -0,0 +1,13 @@ +import { opusCheck } from '../../dom/opusCheck' + +export const createMusic = () => { + const audioChannels = document.getElementsByClassName( + "audioChannel" + ) as HTMLCollectionOf; + let music = [...audioChannels]; + music.forEach((channel: HTMLAudioElement) => (channel.volume = 0.5)); + music.forEach( + (channel: HTMLAudioElement) => (channel.onerror = opusCheck(channel)) + ); + return music; +}; \ No newline at end of file diff --git a/webAO/viewport/utils/createSfxAudio.ts b/webAO/viewport/utils/createSfxAudio.ts new file mode 100644 index 0000000..7e03563 --- /dev/null +++ b/webAO/viewport/utils/createSfxAudio.ts @@ -0,0 +1,9 @@ +import { AO_HOST } from "../../client/aoHost"; + +export const createSfxAudio = () => { + const sfxAudio = document.getElementById( + "client_sfxaudio" + ) as HTMLAudioElement; + sfxAudio.src = `${AO_HOST}sounds/general/sfx-realization.opus`; + return sfxAudio; +}; \ No newline at end of file diff --git a/webAO/viewport/utils/createShoutAudio.ts b/webAO/viewport/utils/createShoutAudio.ts new file mode 100644 index 0000000..8211116 --- /dev/null +++ b/webAO/viewport/utils/createShoutAudio.ts @@ -0,0 +1,9 @@ +import { AO_HOST } from "../../client/aoHost"; + +export const createShoutAudio = () => { + const shoutAudio = document.getElementById( + "client_shoutaudio" + ) as HTMLAudioElement; + shoutAudio.src = `${AO_HOST}misc/default/objection.opus`; + return shoutAudio; +}; \ No newline at end of file diff --git a/webAO/viewport/utils/createTestimonyAudio.ts b/webAO/viewport/utils/createTestimonyAudio.ts new file mode 100644 index 0000000..2ff98f6 --- /dev/null +++ b/webAO/viewport/utils/createTestimonyAudio.ts @@ -0,0 +1,9 @@ +import { AO_HOST } from '../../client/aoHost' + +export const createTestimonyAudio = () => { + const testimonyAudio = document.getElementById( + "client_testimonyaudio" + ) as HTMLAudioElement; + testimonyAudio.src = `${AO_HOST}sounds/general/sfx-guilty.opus`; + return testimonyAudio; +}; \ No newline at end of file diff --git a/webAO/viewport/viewport.ts b/webAO/viewport/viewport.ts new file mode 100644 index 0000000..9772796 --- /dev/null +++ b/webAO/viewport/viewport.ts @@ -0,0 +1,901 @@ +import tryUrls from "../utils/tryUrls"; +import fileExists from "../utils/fileExists"; +import Client, { delay } from "../client"; +import { UPDATE_INTERVAL } from "../client"; +import { setChatbox } from "../dom/setChatbox"; +import { resizeChatbox } from "../dom/resizeChatbox"; +import transparentPng from "../constants/transparentPng"; +import mlConfig from "../utils/aoml"; +import setEmote from "../client/setEmote"; +import getAnimLength from "../utils/getAnimLength"; +import { safeTags } from "../encoding"; +import setCookie from "../utils/setCookie"; +import { AO_HOST } from "../client/aoHost"; +import { appendICLog } from "../client/appendICLog"; +import { checkCallword } from '../client/checkCallword' +import { Viewport } from './interfaces/Viewport' +import { createBlipsChannels } from './utils/createBlipChannels' +import { defaultChatMsg } from './constants/defaultChatMsg' +import { createMusic } from './utils/createMusic' +import { createSfxAudio } from './utils/createSfxAudio' +import { createShoutAudio } from './utils/createShoutAudio' +import { createTestimonyAudio } from './utils/createTestimonyAudio' +import { ChatMsg } from "./interfaces/ChatMsg"; +import { Testimony } from './interfaces/Testimony' +import { COLORS } from './constants/colors' +import { SHOUTS } from './constants/shouts' +import { positions } from './constants/positions' + +const viewport = (masterClient: Client): Viewport => { + let animating = false; + let attorneyMarkdown = mlConfig(AO_HOST); + let blipChannels = createBlipsChannels(); + let chatmsg = defaultChatMsg; + let client = masterClient; + let currentBlipChannel = 0; + let lastChar = ""; + let lastEvi = 0; + let music = createMusic(); + let musicVolume = 0; + let sfxAudio = createSfxAudio(); + let sfxplayed = 0; + let shoutTimer = 0; + let shoutaudio = createShoutAudio(); + let startFirstTickCheck: boolean; + let startSecondTickCheck: boolean; + let startThirdTickCheck: boolean; + let testimonyAudio = createTestimonyAudio(); + let testimonyTimer = 0; + let testimonyUpdater: any; + let textnow = ""; + let theme: string; + let tickTimer = 0; + let updater: any; + let backgroundName = ""; + const getSfxAudio = () => sfxAudio; + const setSfxAudio = (value: HTMLAudioElement) => { sfxAudio = value }; + const getBackgroundName = () => backgroundName; + const setBackgroundName = (value: string) => { backgroundName = value }; + const getBackgroundFolder = () => + `${AO_HOST}background/${encodeURI(backgroundName.toLowerCase())}/`; + + const playSFX = async (sfxname: string, looping: boolean) => { + sfxAudio.pause(); + sfxAudio.loop = looping; + sfxAudio.src = sfxname; + sfxAudio.play(); + }; + + /** + * Changes the viewport background based on a given position. + * + * Valid positions: `def, pro, hld, hlp, wit, jud, jur, sea` + * @param {string} position the position to change into + */ + const set_side = async ({ + position, + showSpeedLines, + showDesk, + }: { + position: string; + showSpeedLines: boolean; + showDesk: boolean; + }) => { + const view = document.getElementById("client_fullview"); + + let bench: HTMLImageElement; + if ("def,pro,wit".includes(position)) { + bench = ( + document.getElementById(`client_${position}_bench`) + ); + } else { + bench = document.getElementById("client_bench_classic"); + } + + let court: HTMLImageElement; + if ("def,pro,wit".includes(position)) { + court = ( + document.getElementById(`client_court_${position}`) + ); + } else { + court = document.getElementById("client_court_classic"); + } + + let bg; + let desk; + let speedLines; + + if ("def,pro,hld,hlp,wit,jud,jur,sea".includes(position)) { + bg = positions[position].bg; + desk = positions[position].desk; + speedLines = positions[position].speedLines; + } else { + bg = `${position}`; + desk = { ao2: `${position}_overlay.png`, ao1: "_overlay.png" }; + speedLines = "defense_speedlines.gif"; + } + + if (showSpeedLines === true) { + court.src = `${AO_HOST}themes/default/${encodeURI(speedLines)}`; + } else { + court.src = await tryUrls(getBackgroundFolder() + bg); + } + + if (showDesk === true && desk) { + const deskFilename = (await fileExists(getBackgroundFolder() + desk.ao2)) + ? desk.ao2 + : desk.ao1; + bench.src = getBackgroundFolder() + deskFilename; + bench.style.opacity = "1"; + } else { + bench.style.opacity = "0"; + } + + if ("def,pro,wit".includes(position)) { + view.style.display = ""; + document.getElementById("client_classicview").style.display = "none"; + switch (position) { + case "def": + view.style.left = "0"; + break; + case "wit": + view.style.left = "-200%"; + break; + case "pro": + view.style.left = "-400%"; + break; + } + } else { + view.style.display = "none"; + document.getElementById("client_classicview").style.display = ""; + } + }; + + /** + * Intialize testimony updater + */ + const initTestimonyUpdater = () => { + const testimonyFilenames: Testimony = { + 1: "witnesstestimony", + 2: "crossexamination", + 3: "notguilty", + 4: "guilty", + }; + + const testimony = testimonyFilenames[masterClient.testimonyID]; + if (!testimony) { + console.warn(`Invalid testimony ID ${masterClient.testimonyID}`); + return; + } + + testimonyAudio.src = masterClient.resources[testimony].sfx; + testimonyAudio.play(); + + const testimonyOverlay = ( + document.getElementById("client_testimony") + ); + testimonyOverlay.src = masterClient.resources[testimony].src; + testimonyOverlay.style.opacity = "1"; + + testimonyTimer = 0; + testimonyUpdater = setTimeout(() => updateTestimony(), UPDATE_INTERVAL); + }; + + /** + * Updates the testimony overaly + */ + const updateTestimony = () => { + const testimonyFilenames: Testimony = { + 1: "witnesstestimony", + 2: "crossexamination", + 3: "notguilty", + 4: "guilty", + }; + + // Update timer + testimonyTimer += UPDATE_INTERVAL; + + const testimony = testimonyFilenames[masterClient.testimonyID]; + const resource = masterClient.resources[testimony]; + if (!resource) { + disposeTestimony(); + return; + } + + if (testimonyTimer >= resource.duration) { + disposeTestimony(); + } else { + testimonyUpdater = setTimeout(() => updateTestimony(), UPDATE_INTERVAL); + } + }; + + /** + * Dispose the testimony overlay + */ + const disposeTestimony = () => { + masterClient.testimonyID = 0; + testimonyTimer = 0; + document.getElementById("client_testimony").style.opacity = "0"; + clearTimeout(testimonyUpdater); + }; + + /** + * Sets a new emote. + * This sets up everything before the tick() loops starts + * a lot of things can probably be moved here, like starting the shout animation if there is one + * TODO: the preanim logic, on the other hand, should probably be moved to tick() + * @param {object} chatmsg the new chat message + */ + const handle_ic_speaking = async (playerChatMsg: ChatMsg) => { + chatmsg = playerChatMsg; + client.viewport.chatmsg = playerChatMsg; + + textnow = ""; + sfxplayed = 0; + tickTimer = 0; + animating = true; + startFirstTickCheck = true; + startSecondTickCheck = false; + startThirdTickCheck = false; + let charLayers = document.getElementById("client_char"); + let pairLayers = document.getElementById("client_pair_char"); + // stop updater + clearTimeout(updater); + + // stop last sfx from looping any longer + sfxAudio.loop = false; + + const fg = document.getElementById("client_fg"); + const gamewindow = document.getElementById("client_gamewindow"); + const waitingBox = document.getElementById("client_chatwaiting"); + + // Reset CSS animation + gamewindow.style.animation = ""; + waitingBox.style.opacity = "0"; + + const eviBox = document.getElementById("client_evi"); + + if (lastEvi !== chatmsg.evidence) { + eviBox.style.opacity = "0"; + eviBox.style.height = "0%"; + } + lastEvi = chatmsg.evidence; + + const validSides: string[] = ["def", "pro", "wit"]; // these are for the full view pan, the other positions use 'client_char' + if (validSides.includes(chatmsg.side)) { + charLayers = document.getElementById(`client_${chatmsg.side}_char`); + pairLayers = document.getElementById(`client_${chatmsg.side}_pair_char`); + } + + const chatContainerBox = document.getElementById("client_chatcontainer"); + const nameBoxInner = document.getElementById("client_inner_name"); + const chatBoxInner = document.getElementById("client_inner_chat"); + + const displayname = + (document.getElementById("showname")).checked && + chatmsg.showname !== "" + ? chatmsg.showname + : chatmsg.nameplate; + + // Clear out the last message + chatBoxInner.innerText = textnow; + nameBoxInner.innerText = displayname; + + if (lastChar !== chatmsg.name) { + charLayers.style.opacity = "0"; + pairLayers.style.opacity = "0"; + } + + lastChar = chatmsg.name; + client.viewport.lastChar = chatmsg.name; + + appendICLog(chatmsg.content, chatmsg.showname, chatmsg.nameplate); + + checkCallword(chatmsg.content, sfxAudio); + + setEmote( + AO_HOST, + client, + chatmsg.name.toLowerCase(), + chatmsg.sprite, + "(a)", + false, + chatmsg.side + ); + + if (chatmsg.other_name) { + setEmote( + AO_HOST, + client, + chatmsg.other_name.toLowerCase(), + chatmsg.other_emote, + "(a)", + false, + chatmsg.side + ); + } + + // gets which shout shall played + const shoutSprite = ( + document.getElementById("client_shout") + ); + const shout = SHOUTS[chatmsg.objection]; + if (shout) { + // Hide message box + chatContainerBox.style.opacity = "0"; + if (chatmsg.objection === 4) { + shoutSprite.src = `${AO_HOST}characters/${encodeURI( + chatmsg.name.toLowerCase() + )}/custom.gif`; + } else { + shoutSprite.src = masterClient.resources[shout].src; + shoutSprite.style.animation = "bubble 700ms steps(10, jump-both)"; + } + shoutSprite.style.opacity = "1"; + + shoutaudio.src = `${AO_HOST}characters/${encodeURI( + chatmsg.name.toLowerCase() + )}/${shout}.opus`; + shoutaudio.play(); + shoutTimer = masterClient.resources[shout].duration; + } else { + shoutTimer = 0; + } + + chatmsg.startpreanim = true; + let gifLength = 0; + + if (chatmsg.type === 1 && chatmsg.preanim !== "-") { + //we have a preanim + chatContainerBox.style.opacity = "0"; + gifLength = await getAnimLength( + `${AO_HOST}characters/${encodeURI( + chatmsg.name.toLowerCase() + )}/${encodeURI(chatmsg.preanim)}` + ); + console.debug("preanim is " + gifLength + " long"); + chatmsg.startspeaking = false; + } else { + chatmsg.startspeaking = true; + if (chatmsg.content !== "") chatContainerBox.style.opacity = "1"; + } + chatmsg.preanimdelay = gifLength; + const setAside = { + position: chatmsg.side, + showSpeedLines: false, + showDesk: false, + }; + let skipoffset: boolean = false; + if (chatmsg.type === 5) { + setAside.showSpeedLines = true; + setAside.showDesk = false; + set_side(setAside); + } else { + switch (Number(chatmsg.deskmod)) { + case 0: //desk is hidden + setAside.showSpeedLines = false; + setAside.showDesk = false; + set_side(setAside); + break; + case 1: //desk is shown + setAside.showSpeedLines = false; + setAside.showDesk = true; + set_side(setAside); + break; + case 2: //desk is hidden during preanim, but shown during idle/talk + setAside.showSpeedLines = false; + setAside.showDesk = false; + set_side(setAside); + break; + case 3: //opposite of 2 + setAside.showSpeedLines = false; + setAside.showDesk = false; + set_side(setAside); + break; + case 4: //desk is hidden, character offset is ignored, pair character is hidden during preanim, normal behavior during idle/talk + setAside.showSpeedLines = false; + setAside.showDesk = false; + set_side(setAside); + skipoffset = true; + break; + case 5: //opposite of 4 + setAside.showSpeedLines = false; + setAside.showDesk = true; + set_side(setAside); + break; + default: + setAside.showSpeedLines = false; + setAside.showDesk = true; + set_side(setAside); + break; + } + } + + setChatbox(chatmsg.chatbox); + resizeChatbox(); + + if (!skipoffset) { + // Flip the character + charLayers.style.transform = + chatmsg.flip === 1 ? "scaleX(-1)" : "scaleX(1)"; + pairLayers.style.transform = + chatmsg.other_flip === 1 ? "scaleX(-1)" : "scaleX(1)"; + + // Shift by the horizontal offset + switch (chatmsg.side) { + case "wit": + pairLayers.style.left = `${200 + Number(chatmsg.other_offset[0])}%`; + charLayers.style.left = `${200 + Number(chatmsg.self_offset[0])}%`; + break; + case "pro": + pairLayers.style.left = `${400 + Number(chatmsg.other_offset[0])}%`; + charLayers.style.left = `${400 + Number(chatmsg.self_offset[0])}%`; + break; + default: + pairLayers.style.left = `${Number(chatmsg.other_offset[0])}%`; + charLayers.style.left = `${Number(chatmsg.self_offset[0])}%`; + break; + } + + // New vertical offsets + pairLayers.style.top = `${Number(chatmsg.other_offset[1])}%`; + charLayers.style.top = `${Number(chatmsg.self_offset[1])}%`; + } + + blipChannels.forEach( + (channel: HTMLAudioElement) => + (channel.src = `${AO_HOST}sounds/general/sfx-blip${encodeURI( + chatmsg.blips.toLowerCase() + )}.opus`) + ); + + // process markup + if (chatmsg.content.startsWith("~~")) { + chatBoxInner.style.textAlign = "center"; + chatmsg.content = chatmsg.content.substring(2, chatmsg.content.length); + } else { + chatBoxInner.style.textAlign = "inherit"; + } + + // apply effects + fg.style.animation = ""; + const effectName = chatmsg.effects[0].toLowerCase(); + const badEffects = ["", "-", "none"]; + if (effectName.startsWith("rain")) { + (document.getElementById("effect_css")).href = "styles/effects/rain.css"; + let intensity = 200; + if (effectName.endsWith("weak")) { + intensity = 100; + } else if (effectName.endsWith("strong")) { + intensity = 400; + } + if (intensity < fg.childElementCount) + fg.innerHTML = ''; + else + intensity = intensity - fg.childElementCount; + + for (let i = 0; i < intensity; i++) { + let drop = document.createElement("p"); + drop.style.left = (Math.random() * 100) + "%"; + drop.style.animationDelay = String(Math.random()) + "s"; + fg.appendChild(drop) + } + } else if ( + chatmsg.effects[0] && + !badEffects.includes(effectName) + ) { + (document.getElementById("effect_css")).href = ""; + fg.innerHTML = ''; + const baseEffectUrl = `${AO_HOST}themes/default/effects/`; + fg.src = `${baseEffectUrl}${encodeURI(effectName)}.webp`; + } else { + fg.innerHTML = ''; + fg.src = transparentPng; + } + + charLayers.style.opacity = "1"; + + const soundChecks = ["0", "1", "", undefined]; + if (soundChecks.some((check) => chatmsg.sound === check)) { + chatmsg.sound = chatmsg.effects[2]; + } + chatmsg.parsed = await attorneyMarkdown.applyMarkdown( + chatmsg.content, + COLORS[chatmsg.color] + ); + chat_tick(); + }; + + const handleTextTick = async (charLayers: HTMLImageElement) => { + const chatBox = document.getElementById("client_chat"); + const waitingBox = document.getElementById("client_chatwaiting"); + const chatBoxInner = document.getElementById("client_inner_chat"); + const charName = chatmsg.name.toLowerCase(); + const charEmote = chatmsg.sprite.toLowerCase(); + + if (chatmsg.content.charAt(textnow.length) !== " ") { + blipChannels[currentBlipChannel].play(); + currentBlipChannel++; + currentBlipChannel %= blipChannels.length; + } + textnow = chatmsg.content.substring(0, textnow.length + 1); + const characterElement = chatmsg.parsed[textnow.length - 1]; + if (characterElement) { + const COMMAND_IDENTIFIER = "\\"; + + const nextCharacterElement = chatmsg.parsed[textnow.length]; + const flash = async () => { + const effectlayer = document.getElementById("client_fg"); + playSFX(`${AO_HOST}sounds/general/sfx-realization.opus`, false); + effectlayer.style.animation = "flash 0.4s 1"; + await delay(400); + effectlayer.style.removeProperty("animation"); + }; + + const shake = async () => { + const gamewindow = document.getElementById("client_gamewindow"); + playSFX(`${AO_HOST}sounds/general/sfx-stab.opus`, false); + gamewindow.style.animation = "shake 0.2s 1"; + await delay(200); + gamewindow.style.removeProperty("animation"); + }; + + const commands = new Map( + Object.entries({ + s: shake, + f: flash, + }) + ); + const textSpeeds = new Set(["{", "}"]); + + // Changing Text Speed + if (textSpeeds.has(characterElement.innerHTML)) { + // Grab them all in a row + const MAX_SLOW_CHATSPEED = 120; + for (let i = textnow.length; i < chatmsg.content.length; i++) { + const currentCharacter = chatmsg.parsed[i - 1].innerHTML; + if (currentCharacter === "}") { + if (chatmsg.speed > 0) { + chatmsg.speed -= 20; + } + } else if (currentCharacter === "{") { + if (chatmsg.speed < MAX_SLOW_CHATSPEED) { + chatmsg.speed += 20; + } + } else { + // No longer at a speed character + textnow = chatmsg.content.substring(0, i); + break; + } + } + } + + if ( + characterElement.innerHTML === COMMAND_IDENTIFIER && + commands.has(nextCharacterElement?.innerHTML) + ) { + textnow = chatmsg.content.substring(0, textnow.length + 1); + await commands.get(nextCharacterElement.innerHTML)(); + } else { + chatBoxInner.appendChild(chatmsg.parsed[textnow.length - 1]); + } + } + // scroll to bottom + chatBox.scrollTop = chatBox.scrollHeight; + + if (textnow === chatmsg.content) { + animating = false; + setEmote( + AO_HOST, + client, + charName, + charEmote, + "(a)", + false, + chatmsg.side + ); + charLayers.style.opacity = "1"; + waitingBox.style.opacity = "1"; + clearTimeout(updater); + } + }; + /** + * Updates the chatbox based on the given text. + * + * OK, here's the documentation on how this works: + * + * 1 _animating + * If we're not done with this characters animation, i.e. his text isn't fully there, set a timeout for the next tick/step to happen + * + * 2 startpreanim + * If the shout timer is over it starts with the preanim + * The first thing it checks for is the shake effect (TODO on client this is handled by the @ symbol and not a flag ) + * Then is the flash/realization effect + * After that, the shout image set to be transparent + * and the main characters preanim gif is loaded + * If pairing is supported the paired character will just stand around with his idle sprite + * + * 3 preanimdelay over + * this animates the evidence popup and finally shows the character name and message box + * it sets the text color and the character speaking sprite + * + * 4 textnow != content + * this adds a character to the textbox and stops the animations if the entire message is present in the textbox + * + * 5 sfx + * independent of the stuff above, this will play any sound effects specified by the emote the character sent. + * happens after the shout delay + an sfx delay that comes with the message packet + * + * XXX: This relies on a global variable `chatmsg`! + */ + const chat_tick = async () => { + // note: this is called fairly often + // do not perform heavy operations here + + await delay(chatmsg.speed); + if (textnow === chatmsg.content) { + return; + } + + const gamewindow = document.getElementById("client_gamewindow"); + const waitingBox = document.getElementById("client_chatwaiting"); + const eviBox = document.getElementById("client_evi"); + const shoutSprite = ( + document.getElementById("client_shout") + ); + const effectlayer = document.getElementById("client_fg"); + const chatBoxInner = document.getElementById("client_inner_chat"); + let charLayers = document.getElementById("client_char"); + let pairLayers = ( + document.getElementById("client_pair_char") + ); + + const validSides: string[] = ["def", "pro", "wit"]; // these are for the full view pan, the other positions use 'client_char' + if (validSides.includes(chatmsg.side)) { + charLayers = ( + document.getElementById(`client_${chatmsg.side}_char`) + ); + pairLayers = ( + document.getElementById(`client_${chatmsg.side}_pair_char`) + ); + } + + const charName = chatmsg.name.toLowerCase(); + const charEmote = chatmsg.sprite.toLowerCase(); + + const pairName = chatmsg.other_name.toLowerCase(); + const pairEmote = chatmsg.other_emote.toLowerCase(); + + // TODO: preanims sometimes play when they're not supposed to + const isShoutOver = tickTimer >= shoutTimer; + const isShoutAndPreanimOver = + tickTimer >= shoutTimer + chatmsg.preanimdelay; + if (isShoutOver && startFirstTickCheck) { + // Effect stuff + if (chatmsg.screenshake === 1) { + // Shake screen + playSFX(`${AO_HOST}sounds/general/sfx-stab.opus`, false); + gamewindow.style.animation = "shake 0.2s 1"; + } + if (chatmsg.flash === 1) { + // Flash screen + playSFX(`${AO_HOST}sounds/general/sfx-realization.opus`, false); + effectlayer.style.animation = "flash 0.4s 1"; + } + + // Pre-animation stuff + if (chatmsg.preanimdelay > 0) { + shoutSprite.style.opacity = "0"; + shoutSprite.style.animation = ""; + const preanim = chatmsg.preanim.toLowerCase(); + setEmote(AO_HOST, client, charName, preanim, "", false, chatmsg.side); + } + + if (chatmsg.other_name) { + pairLayers.style.opacity = "1"; + } else { + pairLayers.style.opacity = "0"; + } + // Done with first check, move to second + startFirstTickCheck = false; + startSecondTickCheck = true; + + chatmsg.startpreanim = false; + chatmsg.startspeaking = true; + } + + const hasNonInterruptingPreAnim = chatmsg.noninterrupting_preanim === 1; + if (textnow !== chatmsg.content && hasNonInterruptingPreAnim) { + const chatContainerBox = document.getElementById("client_chatcontainer"); + chatContainerBox.style.opacity = "1"; + await handleTextTick(charLayers); + } else if (isShoutAndPreanimOver && startSecondTickCheck) { + if (chatmsg.startspeaking) { + chatmsg.startspeaking = false; + + // Evidence Bullshit + if (chatmsg.evidence > 0) { + // Prepare evidence + eviBox.src = safeTags( + masterClient.evidences[chatmsg.evidence - 1].icon + ); + + eviBox.style.width = "auto"; + eviBox.style.height = "36.5%"; + eviBox.style.opacity = "1"; + + testimonyAudio.src = `${AO_HOST}sounds/general/sfx-evidenceshoop.opus`; + testimonyAudio.play(); + + if (chatmsg.side === "def") { + // Only def show evidence on right + eviBox.style.right = "1em"; + eviBox.style.left = "initial"; + } else { + eviBox.style.right = "initial"; + eviBox.style.left = "1em"; + } + } + chatBoxInner.className = `text_${COLORS[chatmsg.color]}`; + + if (chatmsg.preanimdelay === 0) { + shoutSprite.style.opacity = "0"; + shoutSprite.style.animation = ""; + } + + switch (Number(chatmsg.deskmod)) { + case 2: + set_side({ + position: chatmsg.side, + showSpeedLines: false, + showDesk: true, + }); + break; + case 3: + set_side({ + position: chatmsg.side, + showSpeedLines: false, + showDesk: false, + }); + break; + case 4: + set_side({ + position: chatmsg.side, + showSpeedLines: false, + showDesk: true, + }); + break; + case 5: + set_side({ + position: chatmsg.side, + showSpeedLines: false, + showDesk: false, + }); + break; + } + + if (chatmsg.other_name) { + setEmote( + AO_HOST, + client, + pairName, + pairEmote, + "(a)", + true, + chatmsg.side + ); + pairLayers.style.opacity = "1"; + } else { + pairLayers.style.opacity = "0"; + } + + setEmote( + AO_HOST, + client, + charName, + charEmote, + "(b)", + false, + chatmsg.side + ); + charLayers.style.opacity = "1"; + + if (textnow === chatmsg.content) { + setEmote( + AO_HOST, + client, + charName, + charEmote, + "(a)", + false, + chatmsg.side + ); + charLayers.style.opacity = "1"; + waitingBox.style.opacity = "1"; + animating = false; + clearTimeout(updater); + return; + } + } else if (textnow !== chatmsg.content) { + const chatContainerBox = document.getElementById( + "client_chatcontainer" + ); + chatContainerBox.style.opacity = "1"; + await handleTextTick(charLayers); + } + } + + if (!sfxplayed && chatmsg.snddelay + shoutTimer >= tickTimer) { + sfxplayed = 1; + if ( + chatmsg.sound !== "0" && + chatmsg.sound !== "1" && + chatmsg.sound !== "" && + chatmsg.sound !== undefined && + (chatmsg.type == 1 || chatmsg.type == 2 || chatmsg.type == 6) + ) { + playSFX( + `${AO_HOST}sounds/general/${encodeURI( + chatmsg.sound.toLowerCase() + )}.opus`, + chatmsg.looping_sfx + ); + } + } + if (animating) { + chat_tick(); + } + tickTimer += UPDATE_INTERVAL; + }; + /** + * Triggered by the theme selector. + */ + function reloadTheme() { + theme = (document.getElementById("client_themeselect")) + .value; + + setCookie("theme", theme); + (( + document.getElementById("client_theme") + )).href = `styles/${theme}.css`; + } + window.reloadTheme = reloadTheme; + + const changeMusicVolume = (volume: number = -1) => { + const clientVolume = Number( + (document.getElementById("client_mvolume")).value + ); + let musicVolume = volume === -1 ? clientVolume : volume; + music.forEach( + (channel: HTMLAudioElement) => (channel.volume = musicVolume) + ); + setCookie("musicVolume", String(musicVolume)); + }; + window.changeMusicVolume = changeMusicVolume; + + return { + chat_tick, + changeMusicVolume, + reloadTheme, + playSFX, + set_side, + setBackgroundName, + initTestimonyUpdater, + updateTestimony, + disposeTestimony, + handle_ic_speaking, + handleTextTick, + getBackgroundFolder, + getBackgroundName, + getSfxAudio, + setSfxAudio, + theme, + chatmsg, + blipChannels, + lastChar, + music, + musicVolume, + }; +}; + +export default viewport; -- cgit From 7c67d6e8009fd054466b26f33b63b7c9c74606f9 Mon Sep 17 00:00:00 2001 From: Caleb Date: Sun, 11 Sep 2022 15:41:30 -0400 Subject: Viewport can import client --- webAO/client.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'webAO') diff --git a/webAO/client.ts b/webAO/client.ts index b908b62..f3711e9 100644 --- a/webAO/client.ts +++ b/webAO/client.ts @@ -145,7 +145,7 @@ class Client extends EventEmitter { this.selectedEvidence = 0; this.checkUpdater = null; this.sender = sender - this.viewport = masterViewport(this); + this.viewport = masterViewport(); this._lastTimeICReceived = new Date(0); loadResources isLowMemory -- cgit From ac66008a36f58d564a13e8e1fb31a0cd965f165a Mon Sep 17 00:00:00 2001 From: Caleb Date: Sun, 11 Sep 2022 15:41:54 -0400 Subject: Viewport no longer has specific functions --- webAO/client/loadResources.ts | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) (limited to 'webAO') diff --git a/webAO/client/loadResources.ts b/webAO/client/loadResources.ts index 65d0895..4954966 100644 --- a/webAO/client/loadResources.ts +++ b/webAO/client/loadResources.ts @@ -1,12 +1,14 @@ import getCookie from "../utils/getCookie"; import vanilla_evidence_arr from "../constants/evidence.js"; import vanilla_background_arr from "../constants/backgrounds.js"; -import { client } from "../client"; +import { changeMusicVolume } from '../dom/changeMusicVolume' import { setChatbox } from "../dom/setChatbox"; import { changeSFXVolume, changeShoutVolume, changeTestimonyVolume } from "../dom/changeVolume"; import { showname_click } from "../dom/showNameClick"; import { changeBlipVolume } from '../dom/changeBlipVolume' +import { reloadTheme } from '../dom/reloadTheme' const version = process.env.npm_package_version; + /** * Load game resources and stored settings. */ @@ -41,7 +43,7 @@ export const loadResources = () => { (( document.querySelector(`#client_themeselect [value="${cookietheme}"]`) )).selected = true; - client.viewport.reloadTheme(); + reloadTheme(); const cookiechatbox = getCookie("chatbox") || "dynamic"; @@ -52,7 +54,7 @@ export const loadResources = () => { (document.getElementById("client_mvolume")).value = getCookie("musicVolume") || "1"; - client.viewport.changeMusicVolume(); + changeMusicVolume(); (document.getElementById("client_sfxaudio")).volume = Number(getCookie("sfxVolume")) || 1; changeSFXVolume(); -- cgit From 766bef212c09dc85a7afda085cbb9690f985ed8f Mon Sep 17 00:00:00 2001 From: Caleb Date: Sun, 11 Sep 2022 15:42:34 -0400 Subject: Music volume moved out of viewport --- webAO/dom/changeMusicVolume.ts | 14 ++++++++++++++ 1 file changed, 14 insertions(+) create mode 100644 webAO/dom/changeMusicVolume.ts (limited to 'webAO') diff --git a/webAO/dom/changeMusicVolume.ts b/webAO/dom/changeMusicVolume.ts new file mode 100644 index 0000000..9e5d51a --- /dev/null +++ b/webAO/dom/changeMusicVolume.ts @@ -0,0 +1,14 @@ +import { client } from '../client' +import setCookie from '../utils/setCookie'; + +export const changeMusicVolume = (volume: number = -1) => { + const clientVolume = Number( + (document.getElementById("client_mvolume")).value + ); + let musicVolume = volume === -1 ? clientVolume : volume; + client.viewport.music.forEach( + (channel: HTMLAudioElement) => (channel.volume = musicVolume) + ); + setCookie("musicVolume", String(musicVolume)); +}; +window.changeMusicVolume = changeMusicVolume; \ No newline at end of file -- cgit From 383991dd82af6bd867ef29af37fb694d64c28450 Mon Sep 17 00:00:00 2001 From: Caleb Date: Sun, 11 Sep 2022 15:42:52 -0400 Subject: Typechecking changed --- webAO/packets/handlers/handleMS.ts | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) (limited to 'webAO') diff --git a/webAO/packets/handlers/handleMS.ts b/webAO/packets/handlers/handleMS.ts index 1256900..22bbab6 100644 --- a/webAO/packets/handlers/handleMS.ts +++ b/webAO/packets/handlers/handleMS.ts @@ -2,7 +2,7 @@ import { client, extrafeatures, UPDATE_INTERVAL } from "../../client"; import { handleCharacterInfo } from "../../client/handleCharacterInfo"; import { resetICParams } from "../../client/resetICParams"; import { prepChat, safeTags } from "../../encoding"; - +import { handle_ic_speaking } from '../../viewport/utils/handleICSpeaking' /** * Handles an in-character chat message. * @param {*} args packet arguments @@ -55,7 +55,7 @@ export const handleMS = (args: string[]) => { if (char_muted === false) { let chatmsg = { - deskmod: safeTags(args[1]).toLowerCase(), + deskmod: Number(safeTags(args[1]).toLowerCase()), preanim: safeTags(args[2]).toLowerCase(), // get preanim nameplate: msg_nameplate, chatbox: char_chatbox, @@ -69,7 +69,7 @@ export const handleMS = (args: string[]) => { charid: char_id, snddelay: Number(args[10]), objection: Number(args[11]), - evidence: safeTags(args[12]), + evidence: Number(safeTags(args[12])), flip: Number(args[13]), flash: Number(args[14]), color: Number(args[15]), @@ -158,7 +158,8 @@ export const handleMS = (args: string[]) => { if (chatmsg.charid === client.charID) { resetICParams(); } - client.viewport.handle_ic_speaking(chatmsg); // no await + + handle_ic_speaking(chatmsg); // no await } } } \ No newline at end of file -- cgit From b3229eb72ba04152f1df97cd3800e1bc17c5646c Mon Sep 17 00:00:00 2001 From: Caleb Date: Sun, 11 Sep 2022 15:43:05 -0400 Subject: Function movement --- webAO/packets/handlers/handleRT.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'webAO') diff --git a/webAO/packets/handlers/handleRT.ts b/webAO/packets/handlers/handleRT.ts index 5bbf2b2..62ebb1e 100644 --- a/webAO/packets/handlers/handleRT.ts +++ b/webAO/packets/handlers/handleRT.ts @@ -1,5 +1,5 @@ import { client } from "../../client"; - +import { initTestimonyUpdater } from '../../viewport/utils/initTestimonyUpdater' /** * Handles a testimony states. @@ -21,5 +21,5 @@ export const handleRT = (args: string[]) => { default: console.warn("Invalid testimony"); } - client.viewport.initTestimonyUpdater(); + initTestimonyUpdater(); } \ No newline at end of file -- cgit From a2cc1596e1dbacbb6d4a478c17fcc1f16964ce4b Mon Sep 17 00:00:00 2001 From: Caleb Date: Sun, 11 Sep 2022 15:43:16 -0400 Subject: Typechecking change --- webAO/viewport/interfaces/ChatMsg.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) (limited to 'webAO') diff --git a/webAO/viewport/interfaces/ChatMsg.ts b/webAO/viewport/interfaces/ChatMsg.ts index 293a774..6b96c6e 100644 --- a/webAO/viewport/interfaces/ChatMsg.ts +++ b/webAO/viewport/interfaces/ChatMsg.ts @@ -2,12 +2,12 @@ export interface ChatMsg { content: string; objection: number; sound: string; - startpreanim: boolean; - startspeaking: boolean; + startpreanim?: boolean; + startspeaking?: boolean; side: any; color: number; snddelay: number; - preanimdelay: number; + preanimdelay?: number; speed: number; blips: string; self_offset?: number[]; -- cgit From c5c277c8d8264dadd8a9e4171764698dd02d136a Mon Sep 17 00:00:00 2001 From: Caleb Date: Sun, 11 Sep 2022 15:43:37 -0400 Subject: Setting side moved out --- webAO/viewport/utils/setSide.ts | 91 +++++++++++++++++++++++++++++++++++++++++ 1 file changed, 91 insertions(+) create mode 100644 webAO/viewport/utils/setSide.ts (limited to 'webAO') diff --git a/webAO/viewport/utils/setSide.ts b/webAO/viewport/utils/setSide.ts new file mode 100644 index 0000000..15cb7c6 --- /dev/null +++ b/webAO/viewport/utils/setSide.ts @@ -0,0 +1,91 @@ +import { positions } from '../constants/positions' +import { AO_HOST } from '../../client/aoHost' +import { client } from '../../client' +import tryUrls from '../../utils/tryUrls'; +import fileExists from '../../utils/fileExists'; + +/** + * Changes the viewport background based on a given position. + * + * Valid positions: `def, pro, hld, hlp, wit, jud, jur, sea` + * @param {string} position the position to change into + */ +export const set_side = async ({ + position, + showSpeedLines, + showDesk, +}: { + position: string; + showSpeedLines: boolean; + showDesk: boolean; +}) => { + const view = document.getElementById("client_fullview")!; + console.log(position) + let bench: HTMLImageElement; + if (['def','pro','wit'].includes(position)) { + bench = ( + document.getElementById(`client_${position}_bench`) + ); + } else { + bench = document.getElementById("client_bench_classic"); + } + + let court: HTMLImageElement; + if ("def,pro,wit".includes(position)) { + court = ( + document.getElementById(`client_court_${position}`) + ); + } else { + court = document.getElementById("client_court_classic"); + } + + let bg; + let desk; + let speedLines; + + if ("def,pro,hld,hlp,wit,jud,jur,sea".includes(position)) { + bg = positions[position].bg; + desk = positions[position].desk; + speedLines = positions[position].speedLines; + } else { + bg = `${position}`; + desk = { ao2: `${position}_overlay.png`, ao1: "_overlay.png" }; + speedLines = "defense_speedlines.gif"; + } + + if (showSpeedLines === true) { + court.src = `${AO_HOST}themes/default/${encodeURI(speedLines)}`; + } else { + court.src = await tryUrls(client.viewport.getBackgroundFolder() + bg); + } + + + if (showDesk === true && desk) { + const deskFilename = (await fileExists(client.viewport.getBackgroundFolder() + desk.ao2)) + ? desk.ao2 + : desk.ao1; + bench.src = client.viewport.getBackgroundFolder() + deskFilename; + bench.style.opacity = "1"; + } else { + bench.style.opacity = "0"; + } + + if ("def,pro,wit".includes(position)) { + view.style.display = ""; + document.getElementById("client_classicview")!.style.display = "none"; + switch (position) { + case "def": + view.style.left = "0"; + break; + case "wit": + view.style.left = "-200%"; + break; + case "pro": + view.style.left = "-400%"; + break; + } + } else { + view.style.display = "none"; + document.getElementById("client_classicview").style.display = ""; + } +}; -- cgit From 9272ecb2a5e154029e9eef08133386a4eedecb83 Mon Sep 17 00:00:00 2001 From: Caleb Date: Sun, 11 Sep 2022 16:24:43 -0400 Subject: Refactor with getter --- webAO/client/setEmote.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'webAO') diff --git a/webAO/client/setEmote.ts b/webAO/client/setEmote.ts index 161eb51..f4fbdbb 100644 --- a/webAO/client/setEmote.ts +++ b/webAO/client/setEmote.ts @@ -28,7 +28,7 @@ const setEmote = async ( for (const extension of extensionsMap) { // Hides all sprites before creating a new sprite - if (client.viewport.lastChar !== client.viewport.chatmsg.name) { + if (client.viewport.getLastCharacter() !== client.viewport.getChatmsg().name) { emoteSelector.src = transparentPng; } let url; -- cgit From 3929d4cc4c217738cdda8ec02d1668d0fea20935 Mon Sep 17 00:00:00 2001 From: Caleb Date: Sun, 11 Sep 2022 16:26:37 -0400 Subject: Refactor theme --- webAO/dom/reloadTheme.ts | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) create mode 100644 webAO/dom/reloadTheme.ts (limited to 'webAO') diff --git a/webAO/dom/reloadTheme.ts b/webAO/dom/reloadTheme.ts new file mode 100644 index 0000000..bfa46b6 --- /dev/null +++ b/webAO/dom/reloadTheme.ts @@ -0,0 +1,16 @@ +import { client } from '../client' +import setCookie from '../utils/setCookie'; + +/** + * Triggered by the theme selector. + */ +export const reloadTheme = () => { + client.viewport.setTheme((document.getElementById("client_themeselect")) + .value); + + setCookie("theme", client.viewport.getTheme()); + (( + document.getElementById("client_theme") + )).href = `styles/${client.viewport.getTheme()}.css`; +} +window.reloadTheme = reloadTheme; \ No newline at end of file -- cgit From 3bc1d8ca5bc74f40d96c9f4edf7f5b1adee188a4 Mon Sep 17 00:00:00 2001 From: Caleb Date: Sun, 11 Sep 2022 16:26:49 -0400 Subject: Refactor getChatmsg --- webAO/packets/handlers/handleMS.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'webAO') diff --git a/webAO/packets/handlers/handleMS.ts b/webAO/packets/handlers/handleMS.ts index 22bbab6..92d65db 100644 --- a/webAO/packets/handlers/handleMS.ts +++ b/webAO/packets/handlers/handleMS.ts @@ -9,7 +9,7 @@ import { handle_ic_speaking } from '../../viewport/utils/handleICSpeaking' */ export const handleMS = (args: string[]) => { // TODO: this if-statement might be a bug. - if (args[4] !== client.viewport.chatmsg.content) { + if (args[4] !== client.viewport.getChatmsg().content) { document.getElementById("client_inner_chat")!.innerHTML = ""; const char_id = Number(args[9]); -- cgit From f8e8ab1b0d0edcddc55f57df76ee81fa14a1e5e8 Mon Sep 17 00:00:00 2001 From: Caleb Date: Sun, 11 Sep 2022 16:31:04 -0400 Subject: Finishing of refactor --- webAO/viewport/interfaces/Viewport.ts | 35 +- webAO/viewport/utils/handleICSpeaking.ts | 312 ++++++++++++++++ webAO/viewport/utils/initTestimonyUpdater.ts | 31 ++ webAO/viewport/viewport.ts | 529 ++++----------------------- 4 files changed, 433 insertions(+), 474 deletions(-) create mode 100644 webAO/viewport/utils/handleICSpeaking.ts create mode 100644 webAO/viewport/utils/initTestimonyUpdater.ts (limited to 'webAO') diff --git a/webAO/viewport/interfaces/Viewport.ts b/webAO/viewport/interfaces/Viewport.ts index 3ffbcc8..5b428c1 100644 --- a/webAO/viewport/interfaces/Viewport.ts +++ b/webAO/viewport/interfaces/Viewport.ts @@ -1,17 +1,35 @@ import { ChatMsg } from "./ChatMsg"; + export interface Viewport { + getTextNow: Function; + setTextNow: Function; + getChatmsg: Function; + setChatmsg: Function; + getSfxPlayed: Function; + setSfxPlayed: Function; + setTickTimer: Function; + getTickTimer: Function; + getAnimating: Function; + setAnimating: Function; + getLastEvidence: Function; + setLastEvidence: Function; + setLastCharacter: Function; + getLastCharacter: Function; + setShoutTimer: Function; + getShoutTimer: Function; + setTestimonyTimer: Function; + getTestimonyTimer: Function; + setTestimonyUpdater: Function; + getTestimonyUpdater: Function; + getTheme: Function; + setTheme: Function; + testimonyAudio: HTMLAudioElement; chat_tick: Function; - changeMusicVolume: Function; - reloadTheme: Function; playSFX: Function; set_side: Function; - initTestimonyUpdater: Function; updateTestimony: Function; disposeTestimony: Function; - handle_ic_speaking: Function; handleTextTick: Function; - theme: string; - chatmsg: ChatMsg; setSfxAudio: Function; getSfxAudio: Function; getBackgroundFolder: Function; @@ -19,6 +37,7 @@ export interface Viewport { music: any; musicVolume: number; setBackgroundName: Function; - lastChar: string; getBackgroundName: Function; -} \ No newline at end of file + shoutaudio: HTMLAudioElement; + updater: any; +} diff --git a/webAO/viewport/utils/handleICSpeaking.ts b/webAO/viewport/utils/handleICSpeaking.ts new file mode 100644 index 0000000..c396093 --- /dev/null +++ b/webAO/viewport/utils/handleICSpeaking.ts @@ -0,0 +1,312 @@ +import { ChatMsg } from "../interfaces/ChatMsg"; +import { client } from "../../client"; +import { appendICLog } from "../../client/appendICLog"; +import { checkCallword } from "../../client/checkCallword"; +import setEmote from "../../client/setEmote"; +import { AO_HOST } from "../../client/aoHost"; +import { SHOUTS } from "../constants/shouts"; +import getAnimLength from "../../utils/getAnimLength"; +import { setChatbox } from "../../dom/setChatbox"; +import { resizeChatbox } from "../../dom/resizeChatbox"; +import transparentPng from "../../constants/transparentPng"; +import { COLORS } from "../constants/colors"; +import mlConfig from "../../utils/aoml"; + +const attorneyMarkdown = mlConfig(AO_HOST); + +export let startFirstTickCheck: boolean; +export const setStartFirstTickCheck = (val: boolean) => {startFirstTickCheck = val} +export let startSecondTickCheck: boolean; +export const setStartSecondTickCheck = (val: boolean) => {startSecondTickCheck = val} +export let startThirdTickCheck: boolean; +export const setStartThirdTickCheck = (val: boolean) => {startThirdTickCheck = val} +/** + * Sets a new emote. + * This sets up everything before the tick() loops starts + * a lot of things can probably be moved here, like starting the shout animation if there is one + * TODO: the preanim logic, on the other hand, should probably be moved to tick() + * @param {object} chatmsg the new chat message + */ +export const handle_ic_speaking = async (playerChatMsg: ChatMsg) => { + client.viewport.setChatmsg(playerChatMsg); + client.viewport.setTextNow(""); + client.viewport.setSfxPlayed(0); + client.viewport.setTickTimer(0); + client.viewport.setAnimating(true); + + startFirstTickCheck = true; + startSecondTickCheck = false; + startThirdTickCheck = false; + let charLayers = document.getElementById("client_char")!; + let pairLayers = document.getElementById("client_pair_char")!; + // stop updater + clearTimeout(client.viewport.updater); + + // stop last sfx from looping any longer + client.viewport.getSfxAudio().loop = false; + + const fg = document.getElementById("client_fg"); + const gamewindow = document.getElementById("client_gamewindow")!; + const waitingBox = document.getElementById("client_chatwaiting")!; + + // Reset CSS animation + gamewindow.style.animation = ""; + waitingBox.style.opacity = "0"; + + const eviBox = document.getElementById("client_evi")!; + + if (client.viewport.getLastEvidence() !== client.viewport.getChatmsg().evidence) { + eviBox.style.opacity = "0"; + eviBox.style.height = "0%"; + } + client.viewport.setLastEvidence(client.viewport.getChatmsg().evidence); + + const validSides: string[] = ["def", "pro", "wit"]; // these are for the full view pan, the other positions use 'client_char' + if (validSides.includes(client.viewport.getChatmsg().side)) { + charLayers = document.getElementById(`client_${client.viewport.getChatmsg().side}_char`); + pairLayers = document.getElementById(`client_${client.viewport.getChatmsg().side}_pair_char`); + } + + const chatContainerBox = document.getElementById("client_chatcontainer")!; + const nameBoxInner = document.getElementById("client_inner_name")!; + const chatBoxInner = document.getElementById("client_inner_chat")!; + + const displayname = + (document.getElementById("showname")).checked && + client.viewport.getChatmsg().showname !== "" + ? client.viewport.getChatmsg().showname! + : client.viewport.getChatmsg().nameplate!; + + // Clear out the last message + chatBoxInner.innerText = client.viewport.getTextNow(); + nameBoxInner.innerText = displayname; + + if (client.viewport.getLastCharacter() !== client.viewport.getChatmsg().name) { + charLayers.style.opacity = "0"; + pairLayers.style.opacity = "0"; + } + + client.viewport.setLastCharacter(client.viewport.getChatmsg().name); + + appendICLog(client.viewport.getChatmsg().content, client.viewport.getChatmsg().showname, client.viewport.getChatmsg().nameplate); + + checkCallword(client.viewport.getChatmsg().content, client.viewport.getSfxAudio()); + + setEmote( + AO_HOST, + client, + client.viewport.getChatmsg().name!.toLowerCase(), + client.viewport.getChatmsg().sprite!, + "(a)", + false, + client.viewport.getChatmsg().side + ); + + if (client.viewport.getChatmsg().other_name) { + setEmote( + AO_HOST, + client, + client.viewport.getChatmsg().other_name.toLowerCase(), + client.viewport.getChatmsg().other_emote!, + "(a)", + false, + client.viewport.getChatmsg().side + ); + } + + // gets which shout shall played + const shoutSprite = ( + document.getElementById("client_shout") + ); + + const shout = SHOUTS[client.viewport.getChatmsg().objection]; + if (shout) { + // Hide message box + chatContainerBox.style.opacity = "0"; + if (client.viewport.getChatmsg().objection === 4) { + shoutSprite.src = `${AO_HOST}characters/${encodeURI( + client.viewport.getChatmsg().name!.toLowerCase() + )}/custom.gif`; + } else { + shoutSprite.src = client.resources[shout].src; + shoutSprite.style.animation = "bubble 700ms steps(10, jump-both)"; + } + shoutSprite.style.opacity = "1"; + + client.viewport.shoutaudio.src = `${AO_HOST}characters/${encodeURI( + client.viewport.getChatmsg().name.toLowerCase() + )}/${shout}.opus`; + client.viewport.shoutaudio.play(); + client.viewport.setShoutTimer(client.resources[shout].duration); + } else { + client.viewport.setShoutTimer(0); + } + + client.viewport.getChatmsg().startpreanim = true; + let gifLength = 0; + + if (client.viewport.getChatmsg().type === 1 && client.viewport.getChatmsg().preanim !== "-") { + //we have a preanim + chatContainerBox.style.opacity = "0"; + + gifLength = await getAnimLength( + `${AO_HOST}characters/${encodeURI( + client.viewport.getChatmsg().name!.toLowerCase() + )}/${encodeURI(client.viewport.getChatmsg().preanim)}` + ); + console.debug("preanim is " + gifLength + " long"); + client.viewport.getChatmsg().startspeaking = false; + } else { + client.viewport.getChatmsg().startspeaking = true; + if (client.viewport.getChatmsg().content !== "") chatContainerBox.style.opacity = "1"; + } + client.viewport.getChatmsg().preanimdelay = gifLength; + const setAside = { + position: client.viewport.getChatmsg().side, + showSpeedLines: false, + showDesk: false, + }; + let skipoffset: boolean = false; + if (client.viewport.getChatmsg().type === 5) { + setAside.showSpeedLines = true; + setAside.showDesk = false; + client.viewport.set_side(setAside); + } else { + switch (Number(client.viewport.getChatmsg().deskmod)) { + case 0: //desk is hidden + setAside.showSpeedLines = false; + setAside.showDesk = false; + client.viewport.set_side(setAside); + break; + case 1: //desk is shown + setAside.showSpeedLines = false; + setAside.showDesk = true; + client.viewport.set_side(setAside); + break; + case 2: //desk is hidden during preanim, but shown during idle/talk + setAside.showSpeedLines = false; + setAside.showDesk = false; + client.viewport.set_side(setAside); + break; + case 3: //opposite of 2 + setAside.showSpeedLines = false; + setAside.showDesk = false; + client.viewport.set_side(setAside); + break; + case 4: //desk is hidden, character offset is ignored, pair character is hidden during preanim, normal behavior during idle/talk + setAside.showSpeedLines = false; + setAside.showDesk = false; + client.viewport.set_side(setAside); + skipoffset = true; + break; + case 5: //opposite of 4 + setAside.showSpeedLines = false; + setAside.showDesk = true; + client.viewport.set_side(setAside); + break; + default: + setAside.showSpeedLines = false; + setAside.showDesk = true; + client.viewport.set_side(setAside); + break; + } + } + + setChatbox(client.viewport.getChatmsg().chatbox); + resizeChatbox(); + + if (!skipoffset) { + // Flip the character + charLayers.style.transform = + client.viewport.getChatmsg().flip === 1 ? "scaleX(-1)" : "scaleX(1)"; + pairLayers.style.transform = + client.viewport.getChatmsg().other_flip === 1 ? "scaleX(-1)" : "scaleX(1)"; + + // Shift by the horizontal offset + switch (client.viewport.getChatmsg().side) { + case "wit": + pairLayers.style.left = `${200 + Number(client.viewport.getChatmsg().other_offset[0])}%`; + charLayers.style.left = `${200 + Number(client.viewport.getChatmsg().self_offset[0])}%`; + break; + case "pro": + pairLayers.style.left = `${400 + Number(client.viewport.getChatmsg().other_offset[0])}%`; + charLayers.style.left = `${400 + Number(client.viewport.getChatmsg().self_offset[0])}%`; + break; + default: + pairLayers.style.left = `${Number(client.viewport.getChatmsg().other_offset[0])}%`; + charLayers.style.left = `${Number(client.viewport.getChatmsg().self_offset[0])}%`; + break; + } + + // New vertical offsets + pairLayers.style.top = `${Number(client.viewport.getChatmsg().other_offset[1])}%`; + charLayers.style.top = `${Number(client.viewport.getChatmsg().self_offset[1])}%`; + } + + client.viewport.blipChannels.forEach( + (channel: HTMLAudioElement) => + (channel.src = `${AO_HOST}sounds/general/sfx-blip${encodeURI( + client.viewport.getChatmsg().blips.toLowerCase() + )}.opus`) + ); + + // process markup + if (client.viewport.getChatmsg().content.startsWith("~~")) { + chatBoxInner.style.textAlign = "center"; + client.viewport.getChatmsg().content = client.viewport.getChatmsg().content.substring(2, client.viewport.getChatmsg().content.length); + } else { + chatBoxInner.style.textAlign = "inherit"; + } + + // apply effects + fg.style.animation = ""; + const effectName = client.viewport.getChatmsg().effects[0].toLowerCase(); + const badEffects = ["", "-", "none"]; + if (effectName.startsWith("rain")) { + (document.getElementById("effect_css")).href = "styles/effects/rain.css"; + let intensity = 200; + if (effectName.endsWith("weak")) { + intensity = 100; + } else if (effectName.endsWith("strong")) { + intensity = 400; + } + if (intensity < fg.childElementCount) + fg.innerHTML = ''; + else + intensity = intensity - fg.childElementCount; + + for (let i = 0; i < intensity; i++) { + let drop = document.createElement("p"); + drop.style.left = (Math.random() * 100) + "%"; + drop.style.animationDelay = String(Math.random()) + "s"; + fg.appendChild(drop) + } + } else if ( + client.viewport.getChatmsg().effects[0] && + !badEffects.includes(effectName) + ) { + (document.getElementById("effect_css")).href = ""; + fg.innerHTML = ''; + const baseEffectUrl = `${AO_HOST}themes/default/effects/`; + fg.src = `${baseEffectUrl}${encodeURI(effectName)}.webp`; + } else { + fg.innerHTML = ''; + fg.src = transparentPng; + } + + + charLayers.style.opacity = "1"; + + const soundChecks = ["0", "1", "", undefined]; + if (soundChecks.some((check) => client.viewport.getChatmsg().sound === check)) { + client.viewport.getChatmsg().sound = client.viewport.getChatmsg().effects[2]; + } + + client.viewport.getChatmsg().parsed = await attorneyMarkdown.applyMarkdown( + client.viewport.getChatmsg().content, + + COLORS[client.viewport.getChatmsg().color] + + ); + client.viewport.chat_tick(); +}; \ No newline at end of file diff --git a/webAO/viewport/utils/initTestimonyUpdater.ts b/webAO/viewport/utils/initTestimonyUpdater.ts new file mode 100644 index 0000000..e6f6e9d --- /dev/null +++ b/webAO/viewport/utils/initTestimonyUpdater.ts @@ -0,0 +1,31 @@ +import { Testimony } from '../interfaces/Testimony' +import { client, UPDATE_INTERVAL } from '../../client' +/** + * Intialize testimony updater + */ +export const initTestimonyUpdater = () => { + const testimonyFilenames: Testimony = { + 1: "witnesstestimony", + 2: "crossexamination", + 3: "notguilty", + 4: "guilty", + }; + + const testimony = testimonyFilenames[client.testimonyID]; + if (!testimony) { + console.warn(`Invalid testimony ID ${client.testimonyID}`); + return; + } + + client.viewport.testimonyAudio.src = client.resources[testimony].sfx; + client.viewport.testimonyAudio.play(); + + const testimonyOverlay = ( + document.getElementById("client_testimony") + ); + testimonyOverlay.src = client.resources[testimony].src; + testimonyOverlay.style.opacity = "1"; + + client.viewport.setTestimonyTimer(0); + client.viewport.setTestimonyUpdater(setTimeout(() => client.viewport.updateTestimony(), UPDATE_INTERVAL)); +}; \ No newline at end of file diff --git a/webAO/viewport/viewport.ts b/webAO/viewport/viewport.ts index 9772796..9ac6e96 100644 --- a/webAO/viewport/viewport.ts +++ b/webAO/viewport/viewport.ts @@ -1,18 +1,8 @@ -import tryUrls from "../utils/tryUrls"; -import fileExists from "../utils/fileExists"; -import Client, { delay } from "../client"; +import { client, delay } from "../client"; import { UPDATE_INTERVAL } from "../client"; -import { setChatbox } from "../dom/setChatbox"; -import { resizeChatbox } from "../dom/resizeChatbox"; -import transparentPng from "../constants/transparentPng"; -import mlConfig from "../utils/aoml"; import setEmote from "../client/setEmote"; -import getAnimLength from "../utils/getAnimLength"; import { safeTags } from "../encoding"; -import setCookie from "../utils/setCookie"; import { AO_HOST } from "../client/aoHost"; -import { appendICLog } from "../client/appendICLog"; -import { checkCallword } from '../client/checkCallword' import { Viewport } from './interfaces/Viewport' import { createBlipsChannels } from './utils/createBlipChannels' import { defaultChatMsg } from './constants/defaultChatMsg' @@ -20,18 +10,16 @@ import { createMusic } from './utils/createMusic' import { createSfxAudio } from './utils/createSfxAudio' import { createShoutAudio } from './utils/createShoutAudio' import { createTestimonyAudio } from './utils/createTestimonyAudio' -import { ChatMsg } from "./interfaces/ChatMsg"; import { Testimony } from './interfaces/Testimony' import { COLORS } from './constants/colors' -import { SHOUTS } from './constants/shouts' -import { positions } from './constants/positions' +import { set_side } from './utils/setSide' +import { ChatMsg } from "./interfaces/ChatMsg"; +import { setStartFirstTickCheck, setStartSecondTickCheck, startFirstTickCheck, startSecondTickCheck } from "./utils/handleICSpeaking"; -const viewport = (masterClient: Client): Viewport => { +const viewport = (): Viewport => { let animating = false; - let attorneyMarkdown = mlConfig(AO_HOST); let blipChannels = createBlipsChannels(); let chatmsg = defaultChatMsg; - let client = masterClient; let currentBlipChannel = 0; let lastChar = ""; let lastEvi = 0; @@ -41,9 +29,6 @@ const viewport = (masterClient: Client): Viewport => { let sfxplayed = 0; let shoutTimer = 0; let shoutaudio = createShoutAudio(); - let startFirstTickCheck: boolean; - let startSecondTickCheck: boolean; - let startThirdTickCheck: boolean; let testimonyAudio = createTestimonyAudio(); let testimonyTimer = 0; let testimonyUpdater: any; @@ -58,129 +43,34 @@ const viewport = (masterClient: Client): Viewport => { const setBackgroundName = (value: string) => { backgroundName = value }; const getBackgroundFolder = () => `${AO_HOST}background/${encodeURI(backgroundName.toLowerCase())}/`; - + const getTextNow = () => {return textnow} + const setTextNow = (val: string) => {textnow = val} + const getChatmsg = () => {return chatmsg} + const setChatmsg = (val: ChatMsg) => {chatmsg = val} + const getSfxPlayed = () => sfxplayed + const setSfxPlayed = (val: number) => {sfxplayed = val} + const getTickTimer = () => tickTimer + const setTickTimer = (val: number) => {tickTimer = val} + const getAnimating = () => animating + const setAnimating = (val: boolean) => {animating = val} + const getLastEvidence = () => lastEvi + const setLastEvidence = (val: number) => {lastEvi = val} + const setLastCharacter = (val: string) => {lastChar = val} + const getLastCharacter = () => lastChar + const getShoutTimer = () => shoutTimer + const setShoutTimer = (val: number) => {shoutTimer = val} + const getTheme = () => theme + const setTheme = (val: string) => {theme = val} + const getTestimonyTimer = () => testimonyTimer; + const setTestimonyTimer = (val: number) => {testimonyTimer = val} + const setTestimonyUpdater = (val: any) => {testimonyUpdater = val} + const getTestimonyUpdater = () => testimonyUpdater const playSFX = async (sfxname: string, looping: boolean) => { sfxAudio.pause(); sfxAudio.loop = looping; sfxAudio.src = sfxname; sfxAudio.play(); }; - - /** - * Changes the viewport background based on a given position. - * - * Valid positions: `def, pro, hld, hlp, wit, jud, jur, sea` - * @param {string} position the position to change into - */ - const set_side = async ({ - position, - showSpeedLines, - showDesk, - }: { - position: string; - showSpeedLines: boolean; - showDesk: boolean; - }) => { - const view = document.getElementById("client_fullview"); - - let bench: HTMLImageElement; - if ("def,pro,wit".includes(position)) { - bench = ( - document.getElementById(`client_${position}_bench`) - ); - } else { - bench = document.getElementById("client_bench_classic"); - } - - let court: HTMLImageElement; - if ("def,pro,wit".includes(position)) { - court = ( - document.getElementById(`client_court_${position}`) - ); - } else { - court = document.getElementById("client_court_classic"); - } - - let bg; - let desk; - let speedLines; - - if ("def,pro,hld,hlp,wit,jud,jur,sea".includes(position)) { - bg = positions[position].bg; - desk = positions[position].desk; - speedLines = positions[position].speedLines; - } else { - bg = `${position}`; - desk = { ao2: `${position}_overlay.png`, ao1: "_overlay.png" }; - speedLines = "defense_speedlines.gif"; - } - - if (showSpeedLines === true) { - court.src = `${AO_HOST}themes/default/${encodeURI(speedLines)}`; - } else { - court.src = await tryUrls(getBackgroundFolder() + bg); - } - - if (showDesk === true && desk) { - const deskFilename = (await fileExists(getBackgroundFolder() + desk.ao2)) - ? desk.ao2 - : desk.ao1; - bench.src = getBackgroundFolder() + deskFilename; - bench.style.opacity = "1"; - } else { - bench.style.opacity = "0"; - } - - if ("def,pro,wit".includes(position)) { - view.style.display = ""; - document.getElementById("client_classicview").style.display = "none"; - switch (position) { - case "def": - view.style.left = "0"; - break; - case "wit": - view.style.left = "-200%"; - break; - case "pro": - view.style.left = "-400%"; - break; - } - } else { - view.style.display = "none"; - document.getElementById("client_classicview").style.display = ""; - } - }; - - /** - * Intialize testimony updater - */ - const initTestimonyUpdater = () => { - const testimonyFilenames: Testimony = { - 1: "witnesstestimony", - 2: "crossexamination", - 3: "notguilty", - 4: "guilty", - }; - - const testimony = testimonyFilenames[masterClient.testimonyID]; - if (!testimony) { - console.warn(`Invalid testimony ID ${masterClient.testimonyID}`); - return; - } - - testimonyAudio.src = masterClient.resources[testimony].sfx; - testimonyAudio.play(); - - const testimonyOverlay = ( - document.getElementById("client_testimony") - ); - testimonyOverlay.src = masterClient.resources[testimony].src; - testimonyOverlay.style.opacity = "1"; - - testimonyTimer = 0; - testimonyUpdater = setTimeout(() => updateTestimony(), UPDATE_INTERVAL); - }; - /** * Updates the testimony overaly */ @@ -195,8 +85,8 @@ const viewport = (masterClient: Client): Viewport => { // Update timer testimonyTimer += UPDATE_INTERVAL; - const testimony = testimonyFilenames[masterClient.testimonyID]; - const resource = masterClient.resources[testimony]; + const testimony = testimonyFilenames[client.testimonyID]; + const resource = client.resources[testimony]; if (!resource) { disposeTestimony(); return; @@ -208,304 +98,15 @@ const viewport = (masterClient: Client): Viewport => { testimonyUpdater = setTimeout(() => updateTestimony(), UPDATE_INTERVAL); } }; - /** * Dispose the testimony overlay */ const disposeTestimony = () => { - masterClient.testimonyID = 0; + client.testimonyID = 0; testimonyTimer = 0; document.getElementById("client_testimony").style.opacity = "0"; clearTimeout(testimonyUpdater); }; - - /** - * Sets a new emote. - * This sets up everything before the tick() loops starts - * a lot of things can probably be moved here, like starting the shout animation if there is one - * TODO: the preanim logic, on the other hand, should probably be moved to tick() - * @param {object} chatmsg the new chat message - */ - const handle_ic_speaking = async (playerChatMsg: ChatMsg) => { - chatmsg = playerChatMsg; - client.viewport.chatmsg = playerChatMsg; - - textnow = ""; - sfxplayed = 0; - tickTimer = 0; - animating = true; - startFirstTickCheck = true; - startSecondTickCheck = false; - startThirdTickCheck = false; - let charLayers = document.getElementById("client_char"); - let pairLayers = document.getElementById("client_pair_char"); - // stop updater - clearTimeout(updater); - - // stop last sfx from looping any longer - sfxAudio.loop = false; - - const fg = document.getElementById("client_fg"); - const gamewindow = document.getElementById("client_gamewindow"); - const waitingBox = document.getElementById("client_chatwaiting"); - - // Reset CSS animation - gamewindow.style.animation = ""; - waitingBox.style.opacity = "0"; - - const eviBox = document.getElementById("client_evi"); - - if (lastEvi !== chatmsg.evidence) { - eviBox.style.opacity = "0"; - eviBox.style.height = "0%"; - } - lastEvi = chatmsg.evidence; - - const validSides: string[] = ["def", "pro", "wit"]; // these are for the full view pan, the other positions use 'client_char' - if (validSides.includes(chatmsg.side)) { - charLayers = document.getElementById(`client_${chatmsg.side}_char`); - pairLayers = document.getElementById(`client_${chatmsg.side}_pair_char`); - } - - const chatContainerBox = document.getElementById("client_chatcontainer"); - const nameBoxInner = document.getElementById("client_inner_name"); - const chatBoxInner = document.getElementById("client_inner_chat"); - - const displayname = - (document.getElementById("showname")).checked && - chatmsg.showname !== "" - ? chatmsg.showname - : chatmsg.nameplate; - - // Clear out the last message - chatBoxInner.innerText = textnow; - nameBoxInner.innerText = displayname; - - if (lastChar !== chatmsg.name) { - charLayers.style.opacity = "0"; - pairLayers.style.opacity = "0"; - } - - lastChar = chatmsg.name; - client.viewport.lastChar = chatmsg.name; - - appendICLog(chatmsg.content, chatmsg.showname, chatmsg.nameplate); - - checkCallword(chatmsg.content, sfxAudio); - - setEmote( - AO_HOST, - client, - chatmsg.name.toLowerCase(), - chatmsg.sprite, - "(a)", - false, - chatmsg.side - ); - - if (chatmsg.other_name) { - setEmote( - AO_HOST, - client, - chatmsg.other_name.toLowerCase(), - chatmsg.other_emote, - "(a)", - false, - chatmsg.side - ); - } - - // gets which shout shall played - const shoutSprite = ( - document.getElementById("client_shout") - ); - const shout = SHOUTS[chatmsg.objection]; - if (shout) { - // Hide message box - chatContainerBox.style.opacity = "0"; - if (chatmsg.objection === 4) { - shoutSprite.src = `${AO_HOST}characters/${encodeURI( - chatmsg.name.toLowerCase() - )}/custom.gif`; - } else { - shoutSprite.src = masterClient.resources[shout].src; - shoutSprite.style.animation = "bubble 700ms steps(10, jump-both)"; - } - shoutSprite.style.opacity = "1"; - - shoutaudio.src = `${AO_HOST}characters/${encodeURI( - chatmsg.name.toLowerCase() - )}/${shout}.opus`; - shoutaudio.play(); - shoutTimer = masterClient.resources[shout].duration; - } else { - shoutTimer = 0; - } - - chatmsg.startpreanim = true; - let gifLength = 0; - - if (chatmsg.type === 1 && chatmsg.preanim !== "-") { - //we have a preanim - chatContainerBox.style.opacity = "0"; - gifLength = await getAnimLength( - `${AO_HOST}characters/${encodeURI( - chatmsg.name.toLowerCase() - )}/${encodeURI(chatmsg.preanim)}` - ); - console.debug("preanim is " + gifLength + " long"); - chatmsg.startspeaking = false; - } else { - chatmsg.startspeaking = true; - if (chatmsg.content !== "") chatContainerBox.style.opacity = "1"; - } - chatmsg.preanimdelay = gifLength; - const setAside = { - position: chatmsg.side, - showSpeedLines: false, - showDesk: false, - }; - let skipoffset: boolean = false; - if (chatmsg.type === 5) { - setAside.showSpeedLines = true; - setAside.showDesk = false; - set_side(setAside); - } else { - switch (Number(chatmsg.deskmod)) { - case 0: //desk is hidden - setAside.showSpeedLines = false; - setAside.showDesk = false; - set_side(setAside); - break; - case 1: //desk is shown - setAside.showSpeedLines = false; - setAside.showDesk = true; - set_side(setAside); - break; - case 2: //desk is hidden during preanim, but shown during idle/talk - setAside.showSpeedLines = false; - setAside.showDesk = false; - set_side(setAside); - break; - case 3: //opposite of 2 - setAside.showSpeedLines = false; - setAside.showDesk = false; - set_side(setAside); - break; - case 4: //desk is hidden, character offset is ignored, pair character is hidden during preanim, normal behavior during idle/talk - setAside.showSpeedLines = false; - setAside.showDesk = false; - set_side(setAside); - skipoffset = true; - break; - case 5: //opposite of 4 - setAside.showSpeedLines = false; - setAside.showDesk = true; - set_side(setAside); - break; - default: - setAside.showSpeedLines = false; - setAside.showDesk = true; - set_side(setAside); - break; - } - } - - setChatbox(chatmsg.chatbox); - resizeChatbox(); - - if (!skipoffset) { - // Flip the character - charLayers.style.transform = - chatmsg.flip === 1 ? "scaleX(-1)" : "scaleX(1)"; - pairLayers.style.transform = - chatmsg.other_flip === 1 ? "scaleX(-1)" : "scaleX(1)"; - - // Shift by the horizontal offset - switch (chatmsg.side) { - case "wit": - pairLayers.style.left = `${200 + Number(chatmsg.other_offset[0])}%`; - charLayers.style.left = `${200 + Number(chatmsg.self_offset[0])}%`; - break; - case "pro": - pairLayers.style.left = `${400 + Number(chatmsg.other_offset[0])}%`; - charLayers.style.left = `${400 + Number(chatmsg.self_offset[0])}%`; - break; - default: - pairLayers.style.left = `${Number(chatmsg.other_offset[0])}%`; - charLayers.style.left = `${Number(chatmsg.self_offset[0])}%`; - break; - } - - // New vertical offsets - pairLayers.style.top = `${Number(chatmsg.other_offset[1])}%`; - charLayers.style.top = `${Number(chatmsg.self_offset[1])}%`; - } - - blipChannels.forEach( - (channel: HTMLAudioElement) => - (channel.src = `${AO_HOST}sounds/general/sfx-blip${encodeURI( - chatmsg.blips.toLowerCase() - )}.opus`) - ); - - // process markup - if (chatmsg.content.startsWith("~~")) { - chatBoxInner.style.textAlign = "center"; - chatmsg.content = chatmsg.content.substring(2, chatmsg.content.length); - } else { - chatBoxInner.style.textAlign = "inherit"; - } - - // apply effects - fg.style.animation = ""; - const effectName = chatmsg.effects[0].toLowerCase(); - const badEffects = ["", "-", "none"]; - if (effectName.startsWith("rain")) { - (document.getElementById("effect_css")).href = "styles/effects/rain.css"; - let intensity = 200; - if (effectName.endsWith("weak")) { - intensity = 100; - } else if (effectName.endsWith("strong")) { - intensity = 400; - } - if (intensity < fg.childElementCount) - fg.innerHTML = ''; - else - intensity = intensity - fg.childElementCount; - - for (let i = 0; i < intensity; i++) { - let drop = document.createElement("p"); - drop.style.left = (Math.random() * 100) + "%"; - drop.style.animationDelay = String(Math.random()) + "s"; - fg.appendChild(drop) - } - } else if ( - chatmsg.effects[0] && - !badEffects.includes(effectName) - ) { - (document.getElementById("effect_css")).href = ""; - fg.innerHTML = ''; - const baseEffectUrl = `${AO_HOST}themes/default/effects/`; - fg.src = `${baseEffectUrl}${encodeURI(effectName)}.webp`; - } else { - fg.innerHTML = ''; - fg.src = transparentPng; - } - - charLayers.style.opacity = "1"; - - const soundChecks = ["0", "1", "", undefined]; - if (soundChecks.some((check) => chatmsg.sound === check)) { - chatmsg.sound = chatmsg.effects[2]; - } - chatmsg.parsed = await attorneyMarkdown.applyMarkdown( - chatmsg.content, - COLORS[chatmsg.color] - ); - chat_tick(); - }; - const handleTextTick = async (charLayers: HTMLImageElement) => { const chatBox = document.getElementById("client_chat"); const waitingBox = document.getElementById("client_chatwaiting"); @@ -631,7 +232,8 @@ const viewport = (masterClient: Client): Viewport => { const chat_tick = async () => { // note: this is called fairly often // do not perform heavy operations here - + console.log(textnow) + console.log(chatmsg.content) await delay(chatmsg.speed); if (textnow === chatmsg.content) { return; @@ -696,14 +298,15 @@ const viewport = (masterClient: Client): Viewport => { } else { pairLayers.style.opacity = "0"; } + // Done with first check, move to second - startFirstTickCheck = false; - startSecondTickCheck = true; + setStartFirstTickCheck(false) + setStartSecondTickCheck(true) chatmsg.startpreanim = false; chatmsg.startspeaking = true; } - + const hasNonInterruptingPreAnim = chatmsg.noninterrupting_preanim === 1; if (textnow !== chatmsg.content && hasNonInterruptingPreAnim) { const chatContainerBox = document.getElementById("client_chatcontainer"); @@ -717,7 +320,7 @@ const viewport = (masterClient: Client): Viewport => { if (chatmsg.evidence > 0) { // Prepare evidence eviBox.src = safeTags( - masterClient.evidences[chatmsg.evidence - 1].icon + client.evidences[chatmsg.evidence - 1].icon ); eviBox.style.width = "auto"; @@ -842,59 +445,53 @@ const viewport = (masterClient: Client): Viewport => { ); } } + console.log(animating) if (animating) { chat_tick(); } tickTimer += UPDATE_INTERVAL; }; - /** - * Triggered by the theme selector. - */ - function reloadTheme() { - theme = (document.getElementById("client_themeselect")) - .value; - - setCookie("theme", theme); - (( - document.getElementById("client_theme") - )).href = `styles/${theme}.css`; - } - window.reloadTheme = reloadTheme; - - const changeMusicVolume = (volume: number = -1) => { - const clientVolume = Number( - (document.getElementById("client_mvolume")).value - ); - let musicVolume = volume === -1 ? clientVolume : volume; - music.forEach( - (channel: HTMLAudioElement) => (channel.volume = musicVolume) - ); - setCookie("musicVolume", String(musicVolume)); - }; - window.changeMusicVolume = changeMusicVolume; return { + getTextNow, + setTextNow, + getChatmsg, + setChatmsg, + getSfxPlayed, + setSfxPlayed, + setTickTimer, + getTickTimer, + setAnimating, + getAnimating, + getLastEvidence, + setLastEvidence, + setLastCharacter, + getLastCharacter, + getShoutTimer, + setShoutTimer, + setTheme, + getTheme, + setTestimonyTimer, + getTestimonyTimer, + setTestimonyUpdater, + getTestimonyUpdater, + testimonyAudio, chat_tick, - changeMusicVolume, - reloadTheme, playSFX, set_side, setBackgroundName, - initTestimonyUpdater, updateTestimony, disposeTestimony, - handle_ic_speaking, handleTextTick, getBackgroundFolder, getBackgroundName, getSfxAudio, setSfxAudio, - theme, - chatmsg, blipChannels, - lastChar, music, musicVolume, + shoutaudio, + updater, }; }; -- cgit From 0bff001a1dd5ed8ba83aba4a9de116d566347124 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Fri, 23 Sep 2022 17:53:12 +0200 Subject: no more undefined --- webAO/master.ts | 11 ++++------- 1 file changed, 4 insertions(+), 7 deletions(-) (limited to 'webAO') diff --git a/webAO/master.ts b/webAO/master.ts index 5a31024..2527323 100644 --- a/webAO/master.ts +++ b/webAO/master.ts @@ -20,10 +20,10 @@ let selectedServer: number = -1; let servers: { name: string, description: string, ip: string, port: number, ws_port: number, assets: string, online: string }[] = []; servers[-2] = { - name: 'Singleplayer', description: 'Build cases, try out new things', ip: '127.0.0.1', port: 50001, ws_port: 50001, assets: '', online: '', + name: 'Singleplayer', description: 'Build cases, try out new things', ip: '127.0.0.1', port: 50001, ws_port: 50001, assets: '', online: 'Online: 0/1', }; servers[-1] = { - name: 'Localhost', description: 'This is your computer on port 50001', ip: '127.0.0.1', port: 50001, ws_port: 50001, assets: '', online: 'Online: ?/?', + name: 'Localhost', description: 'This is your computer on port 50001', ip: '127.0.0.1', port: 50001, ws_port: 50001, assets: '', online: 'Offline', }; const fpPromise = FingerprintJS.load(); @@ -58,11 +58,7 @@ export function setServ(ID: number) { if (document.getElementById(`server${ID}`).className === '') { checkOnline(ID, `${servers[ID].ip}:${servers[ID].ws_port}`); } - if (servers[ID].description !== undefined) { - document.getElementById('serverdescription_content').innerHTML = `${servers[ID].online}
${safeTags(servers[ID].description)}`; - } else { - document.getElementById('serverdescription_content').innerHTML = ''; - } + document.getElementById('serverdescription_content').innerHTML = `${servers[ID].online}
${safeTags(servers[ID].description)}`; } window.setServ = setServ; @@ -136,6 +132,7 @@ function processServerlist(thelist: { name: string, description: string, ip: str for (let i = 0; i < thelist.length - 1; i++) { const serverEntry: { name: string, description: string, ip: string, port: number, ws_port: number, assets: string, online: string } = thelist[i]; + servers[i].online = "Offline"; servers[i] = serverEntry; const ipport = `${serverEntry.ip}:${serverEntry.ws_port}`; -- cgit From a732a654c058842e39917210e47ca7476fa7ef68 Mon Sep 17 00:00:00 2001 From: stonedDiscord Date: Fri, 23 Sep 2022 17:56:54 +0200 Subject: swap lines --- webAO/master.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'webAO') diff --git a/webAO/master.ts b/webAO/master.ts index 2527323..7e9c994 100644 --- a/webAO/master.ts +++ b/webAO/master.ts @@ -132,8 +132,8 @@ function processServerlist(thelist: { name: string, description: string, ip: str for (let i = 0; i < thelist.length - 1; i++) { const serverEntry: { name: string, description: string, ip: string, port: number, ws_port: number, assets: string, online: string } = thelist[i]; - servers[i].online = "Offline"; servers[i] = serverEntry; + servers[i].online = "Offline"; const ipport = `${serverEntry.ip}:${serverEntry.ws_port}`; -- cgit