From a7facd6e825e3a2d60752df0b8526482b19a12de Mon Sep 17 00:00:00 2001 From: "caleb.mabry.15@cnu.edu" Date: Wed, 23 Mar 2022 14:40:25 -0400 Subject: Added support for custom backgrounds --- webAO/client.js | 51 ++++++++++++++++++++++++------------------------ webAO/client/setEmote.js | 6 +++--- webAO/utils/tryUrls.js | 20 +++++++++++++++++++ 3 files changed, 49 insertions(+), 28 deletions(-) create mode 100644 webAO/utils/tryUrls.js diff --git a/webAO/client.js b/webAO/client.js index 14bfd08..dd7989b 100644 --- a/webAO/client.js +++ b/webAO/client.js @@ -6,7 +6,7 @@ import FingerprintJS from '@fingerprintjs/fingerprintjs'; import { EventEmitter } from 'events'; -import fileExistsSync from './utils/fileExistsSync'; +import tryUrls from './utils/tryUrls' import { escapeChat, encodeChat, prepChat, safeTags, } from './encoding.js'; @@ -1220,11 +1220,12 @@ class Client extends EventEmitter { document.getElementById('client_charselect').style.display = 'none'; } } - + /** * Handles a background change. * @param {Array} args packet arguments */ + handleBN(args) { viewport.bgname = safeTags(args[1]); const bgfolder = viewport.bgFolder; @@ -1234,19 +1235,17 @@ class Client extends EventEmitter { if (bg_index === 0) { document.getElementById('bg_filename').value = viewport.bgname; } - document.getElementById('bg_preview').src = `${AO_HOST}background/${encodeURI(args[1].toLowerCase())}/defenseempty.png`; - - document.getElementById('client_def_bench').src = `${bgfolder}defensedesk.png`; - document.getElementById('client_wit_bench').src = `${bgfolder}stand.png`; - document.getElementById('client_pro_bench').src = `${bgfolder}prosecutiondesk.png`; - - document.getElementById('client_court').src = `${bgfolder}full.png`; - - document.getElementById('client_court_def').src = `${bgfolder}defenseempty.png`; - document.getElementById('client_court_deft').src = `${bgfolder}transition_def.png`; - document.getElementById('client_court_wit').src = `${bgfolder}witnessempty.png`; - document.getElementById('client_court_prot').src = `${bgfolder}transition_pro.png`; - document.getElementById('client_court_pro').src = `${bgfolder}prosecutorempty.png`; + + 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.changeBackground('jud'); @@ -1774,42 +1773,42 @@ class Viewport { const positions = { def: { - bg: 'defenseempty.png', + bg: 'defenseempty', desk: { ao2: 'defensedesk.png', ao1: 'bancodefensa.png' }, speedLines: 'defense_speedlines.gif', }, pro: { - bg: 'prosecutorempty.png', + bg: 'prosecutorempty', desk: { ao2: 'prosecutiondesk.png', ao1: 'bancoacusacion.png' }, speedLines: 'prosecution_speedlines.gif', }, hld: { - bg: 'helperstand.png', + bg: 'helperstand', desk: null, speedLines: 'defense_speedlines.gif', }, hlp: { - bg: 'prohelperstand.png', + bg: 'prohelperstand', desk: null, speedLines: 'prosecution_speedlines.gif', }, wit: { - bg: 'witnessempty.png', + bg: 'witnessempty', desk: { ao2: 'stand.png', ao1: 'estrado.png' }, speedLines: 'prosecution_speedlines.gif', }, jud: { - bg: 'judgestand.png', + bg: 'judgestand', desk: { ao2: 'judgedesk.png', ao1: 'judgedesk.gif' }, speedLines: 'prosecution_speedlines.gif', }, jur: { - bg: 'jurystand.png', + bg: 'jurystand', desk: { ao2: 'jurydesk.png', ao1: 'estrado.png' }, speedLines: 'defense_speedlines.gif', }, sea: { - bg: 'seancestand.png', + bg: 'seancestand', desk: { ao2: 'seancedesk.png', ao1: 'estrado.png' }, speedLines: 'prosecution_speedlines.gif', }, @@ -1824,7 +1823,7 @@ class Viewport { desk = positions[position].desk; speedLines = positions[position].speedLines; } else { - bg = `${position}.png`; + bg = `${position}`; desk = { ao2: `${position}_overlay.png`, ao1: '_overlay.png' }; speedLines = 'defense_speedlines.gif'; } @@ -1834,7 +1833,9 @@ class Viewport { court.src = `${AO_HOST}themes/default/${encodeURI(speedLines)}`; bench.style.opacity = 0; } else { - court.src = bgfolder + bg; + // 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; diff --git a/webAO/client/setEmote.js b/webAO/client/setEmote.js index 4bbaab7..f682fe5 100644 --- a/webAO/client/setEmote.js +++ b/webAO/client/setEmote.js @@ -1,12 +1,12 @@ import transparentPng from '../constants/transparentPng'; -import fileExistsSync from '../utils/fileExistsSync'; +import fileExists from '../utils/fileExists'; /** * Sets all the img tags to the right sources * @param {*} chatmsg */ -const setEmote = (AO_HOST, client, charactername, emotename, prefix, pair, side) => { +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']; @@ -30,7 +30,7 @@ const setEmote = (AO_HOST, client, charactername, emotename, prefix, pair, side) } else { url = `${characterFolder}${encodeURI(charactername)}/${encodeURI(prefix)}${encodeURI(emotename)}${extension}`; } - const exists = fileExistsSync(url); + const exists = await fileExists(url); if (exists) { emoteSelector.src = url; break; diff --git a/webAO/utils/tryUrls.js b/webAO/utils/tryUrls.js new file mode 100644 index 0000000..db07ec7 --- /dev/null +++ b/webAO/utils/tryUrls.js @@ -0,0 +1,20 @@ +import fileExists from './fileExists' +import transparentPng from '../constants/transparentPng' +const urlExtensionsToTry = [ + '.png', + '.gif', + '.webp', + '.apng' +] +const tryUrls = async (url) => { + for (let i = 0; i < urlExtensionsToTry.length; i++) { + const extension = urlExtensionsToTry[i] + const fullFileUrl = url + extension + const exists = await fileExists(fullFileUrl); + if (exists) { + return fullFileUrl + } + } + return transparentPng +} +export default tryUrls \ No newline at end of file -- cgit From 08916f6d4eb8db40e6e54f78c744071f3b5298d7 Mon Sep 17 00:00:00 2001 From: "caleb.mabry.15@cnu.edu" Date: Thu, 24 Mar 2022 00:42:24 -0400 Subject: Adding typescript support and unit tests --- webAO/utils/__tests__/tryUrls.test.ts | 31 +++++++++++++++++++++++++++++++ webAO/utils/tryUrls.js | 20 -------------------- webAO/utils/tryUrls.ts | 20 ++++++++++++++++++++ 3 files changed, 51 insertions(+), 20 deletions(-) create mode 100644 webAO/utils/__tests__/tryUrls.test.ts delete mode 100644 webAO/utils/tryUrls.js create mode 100644 webAO/utils/tryUrls.ts diff --git a/webAO/utils/__tests__/tryUrls.test.ts b/webAO/utils/__tests__/tryUrls.test.ts new file mode 100644 index 0000000..444664e --- /dev/null +++ b/webAO/utils/__tests__/tryUrls.test.ts @@ -0,0 +1,31 @@ +import fileExists from '../fileExists' +import tryUrls from '../tryUrls'; +import transparentPng from '../../constants/transparentPng' +jest.mock('../fileExists') + +const mockFileExists = fileExists as jest.MockedFunction; + +describe('tryUrls', () => { + it('Should try multiple file extensions', async () => { + const url = "localhost/stoneddiscord/assets" + mockFileExists + .mockReturnValueOnce(Promise.resolve(false)) + .mockReturnValueOnce(Promise.resolve(false)) + .mockReturnValueOnce(Promise.resolve(false)) + .mockReturnValueOnce(Promise.resolve(true)) + const actual = await tryUrls(url) + const expected = 'localhost/stoneddiscord/assets.apng' + expect(actual).toBe(expected); + }); + + it('Should return a transparent png if it cant find any assets', async () => { + const url = "localhost/stoneddiscord/assets" + mockFileExists + .mockReturnValue(Promise.resolve(false)) + const actual = await tryUrls(url) + const expected = transparentPng + expect(actual).toBe(expected); + }); +}) + + diff --git a/webAO/utils/tryUrls.js b/webAO/utils/tryUrls.js deleted file mode 100644 index db07ec7..0000000 --- a/webAO/utils/tryUrls.js +++ /dev/null @@ -1,20 +0,0 @@ -import fileExists from './fileExists' -import transparentPng from '../constants/transparentPng' -const urlExtensionsToTry = [ - '.png', - '.gif', - '.webp', - '.apng' -] -const tryUrls = async (url) => { - for (let i = 0; i < urlExtensionsToTry.length; i++) { - const extension = urlExtensionsToTry[i] - const fullFileUrl = url + extension - const exists = await fileExists(fullFileUrl); - if (exists) { - return fullFileUrl - } - } - return transparentPng -} -export default tryUrls \ No newline at end of file diff --git a/webAO/utils/tryUrls.ts b/webAO/utils/tryUrls.ts new file mode 100644 index 0000000..14ef885 --- /dev/null +++ b/webAO/utils/tryUrls.ts @@ -0,0 +1,20 @@ +import fileExists from './fileExists' +import transparentPng from '../constants/transparentPng' +const urlExtensionsToTry = [ + '.png', + '.gif', + '.webp', + '.apng' +] +const tryUrls = async (url: string) => { + for (let i = 0; i < urlExtensionsToTry.length; i++) { + const extension = urlExtensionsToTry[i] + const fullFileUrl = url + extension + const exists = await fileExists(fullFileUrl); + if (exists) { + return fullFileUrl + } + } + return transparentPng +} +export default tryUrls \ No newline at end of file -- cgit From 8406b6f1fb6ce6e61dab3e39f1a5751c49e6d184 Mon Sep 17 00:00:00 2001 From: Caleb Mabry Date: Fri, 25 Mar 2022 13:27:17 -0400 Subject: Updated tests --- webAO/client/__tests__/setEmote.test.js | 50 ++++++++++++++++----------------- 1 file changed, 25 insertions(+), 25 deletions(-) diff --git a/webAO/client/__tests__/setEmote.test.js b/webAO/client/__tests__/setEmote.test.js index d81c2cc..1db13c9 100644 --- a/webAO/client/__tests__/setEmote.test.js +++ b/webAO/client/__tests__/setEmote.test.js @@ -1,10 +1,10 @@ import setEmote from '../setEmote'; import Client from '../../client'; -import fileExistsSync from '../../utils/fileExistsSync'; +import fileExists from '../../utils/fileExists'; import transparentPng from '../../constants/transparentPng'; jest.mock('../../client'); -jest.mock('../../utils/fileExistsSync'); +jest.mock('../../utils/fileExists'); describe('setEmote', () => { const AO_HOST = ''; @@ -17,98 +17,98 @@ describe('setEmote', () => { const client = new Client('127.0.0.1'); const firstExtension = '.gif'; - test('Should have a client_def_char_img with a valid source', () => { - fileExistsSync.mockReturnValue(true); + test('Should have a client_def_char_img with a valid source', async () => { + fileExists.mockReturnValue(true); document.body.innerHTML = ` `; - setEmote(AO_HOST, client, 'salanto', 'coding', '(a)', 0, 'def'); + await setEmote(AO_HOST, client, 'salanto', 'coding', '(a)', 0, 'def'); const expected = `http://localhost/characters/salanto/(a)coding${firstExtension}`; expect(document.getElementById('client_def_char_img').src).toEqual(expected); }); - test('Should have a client_pro_char_img to have a valid src', () => { + test('Should have a client_pro_char_img to have a valid src', async () => { document.body.innerHTML = ` `; - setEmote(AO_HOST, client, 'salanto', 'coding', '(a)', 0, 'pro'); + await setEmote(AO_HOST, client, 'salanto', 'coding', '(a)', 0, 'pro'); const expected = `http://localhost/characters/salanto/(a)coding${firstExtension}`; expect(document.getElementById('client_pro_char_img').src).toEqual(expected); }); - test('Should have a client_wit_char_img', () => { + test('Should have a client_wit_char_img', async () => { document.body.innerHTML = ` `; - setEmote(AO_HOST, client, 'salanto', 'coding', '(a)', 0, 'wit'); + await setEmote(AO_HOST, client, 'salanto', 'coding', '(a)', 0, 'wit'); const expected = `http://localhost/characters/salanto/(a)coding${firstExtension}`; expect(document.getElementById('client_wit_char_img').src).toEqual(expected); }); - test('Should have a client_def_pair_img', () => { + test('Should have a client_def_pair_img', async () => { document.body.innerHTML = ` `; - setEmote(AO_HOST, client, 'salanto', 'coding', '(a)', 1, 'def'); + await setEmote(AO_HOST, client, 'salanto', 'coding', '(a)', 1, 'def'); const expected = `http://localhost/characters/salanto/(a)coding${firstExtension}`; expect(document.getElementById('client_def_pair_img').src).toEqual(expected); }); - test('Should have a client_pro_pair_img', () => { + test('Should have a client_pro_pair_img', async () => { document.body.innerHTML = ` `; - setEmote(AO_HOST, client, 'salanto', 'coding', '(a)', 1, 'pro'); + await setEmote(AO_HOST, client, 'salanto', 'coding', '(a)', 1, 'pro'); const expected = `http://localhost/characters/salanto/(a)coding${firstExtension}`; expect(document.getElementById('client_pro_pair_img').src).toEqual(expected); }); - test('Should have a client_wit_pair_img', () => { + test('Should have a client_wit_pair_img', async () => { document.body.innerHTML = ` `; - setEmote(AO_HOST, client, 'salanto', 'coding', '(a)', 1, 'wit'); + await setEmote(AO_HOST, client, 'salanto', 'coding', '(a)', 1, 'wit'); const expected = `http://localhost/characters/salanto/(a)coding${firstExtension}`; expect(document.getElementById('client_wit_pair_img').src).toEqual(expected); }); - test('Should have a client_char_img', () => { + test('Should have a client_char_img', async () => { document.body.innerHTML = ` `; - setEmote(AO_HOST, client, 'salanto', 'coding', '(a)', 0, 'notvalid'); + await setEmote(AO_HOST, client, 'salanto', 'coding', '(a)', 0, 'notvalid'); const expected = `http://localhost/characters/salanto/(a)coding${firstExtension}`; expect(document.getElementById('client_char_img').src).toEqual(expected); }); - test('Should have a client_pair_img', () => { + test('Should have a client_pair_img', async () => { document.body.innerHTML = ` `; - setEmote(AO_HOST, client, 'salanto', 'coding', '(a)', 1, 'notvalid'); + await setEmote(AO_HOST, client, 'salanto', 'coding', '(a)', 1, 'notvalid'); const expected = `http://localhost/characters/salanto/(a)coding${firstExtension}`; expect(document.getElementById('client_pair_img').src).toEqual(expected); }); - test('Should handle .png urls differently', () => { - fileExistsSync.mockReturnValueOnce(false); + test('Should handle .png urls differently', async () => { + fileExists.mockReturnValueOnce(false); document.body.innerHTML = ` `; - setEmote(AO_HOST, client, 'salanto', 'coding', 'prefixNotValid', 1, 'notvalid'); + await setEmote(AO_HOST, client, 'salanto', 'coding', 'prefixNotValid', 1, 'notvalid'); const expected = 'http://localhost/characters/salanto/coding.png'; expect(document.getElementById('client_pair_img').src).toEqual(expected); }); - test('Should replace character if new character responds', () => { - fileExistsSync.mockReturnValue(false); + test('Should replace character if new character responds', async () => { + fileExists.mockReturnValue(false); document.body.innerHTML = ` `; - setEmote(AO_HOST, client, 'salanto', 'coding', 'prefixNotValid', 1, 'notvalid'); + await setEmote(AO_HOST, client, 'salanto', 'coding', 'prefixNotValid', 1, 'notvalid'); const expected = transparentPng; expect(document.getElementById('client_pair_img').src).toEqual(expected); }); -- cgit