From 3c98ae556b955175906c2640f44cb0f3512e90ea Mon Sep 17 00:00:00 2001 From: SymphonyVR Date: Wed, 22 Nov 2023 10:23:10 -0400 Subject: [PATCH 1/6] Smarter upscaling/downscaling By default it used to make all images pixelated. --- webAO/styles/default.css | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/webAO/styles/default.css b/webAO/styles/default.css index 5e941e07..8a090cb8 100644 --- a/webAO/styles/default.css +++ b/webAO/styles/default.css @@ -2,11 +2,25 @@ body { font-family: sans-serif; } +@media (max-height: 270x) { + img { + image-rendering: crisp-edges; + image-rendering: pixelated; + } + +} + img { + image-rendering: auto; +} + +img[src$=".gif"], +img[src$=".apng"] { image-rendering: crisp-edges; image-rendering: pixelated; } + .client_button { margin: 1px; padding: 2px 15px; From 19287c6e1568a5f90f4e15d524972b37f51fd98c Mon Sep 17 00:00:00 2001 From: SymphonyVR Date: Wed, 22 Nov 2023 10:25:23 -0400 Subject: [PATCH 2/6] Fix "Empty messages don't play the preanimation" Fix for: Empty messages don't play the preanimation #191 --- webAO/viewport/viewport.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/webAO/viewport/viewport.ts b/webAO/viewport/viewport.ts index af147da4..8a1e97d9 100644 --- a/webAO/viewport/viewport.ts +++ b/webAO/viewport/viewport.ts @@ -234,9 +234,6 @@ const viewport = (): Viewport => { // 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"); @@ -444,6 +441,9 @@ const viewport = (): Viewport => { ); } } + if (textnow === chatmsg.content) { + return; + } if (animating) { chat_tick(); } From 8ba20bd40cb9be9f019bd5bdb812fa238bea84f2 Mon Sep 17 00:00:00 2001 From: SymphonyVR Date: Wed, 22 Nov 2023 10:26:16 -0400 Subject: [PATCH 3/6] Add support for webp on the char buttons. --- webAO/packets/handlers/handlePV.ts | 18 +++++++++++++++--- 1 file changed, 15 insertions(+), 3 deletions(-) diff --git a/webAO/packets/handlers/handlePV.ts b/webAO/packets/handlers/handlePV.ts index 938fb0d3..247845b2 100644 --- a/webAO/packets/handlers/handlePV.ts +++ b/webAO/packets/handlers/handlePV.ts @@ -44,6 +44,20 @@ export const handlePV = async (args: string[]) => { } // Make sure the asset server is case insensitive, or that everything on it is lowercase + const extensionsMap = [".png", ".webp"]; + let url; + for (const extension of extensionsMap) { + url = `${AO_HOST}characters/${encodeURI( + me.name.toLowerCase() + )}/emotions/button${i}_off${extension}`; + + const exists = await fileExists(url); + + if (exists) { + break; + } + } + emotes[i] = { desc: emoteinfo[0].toLowerCase(), preanim: emoteinfo[1].toLowerCase(), @@ -55,9 +69,7 @@ export const handlePV = async (args: string[]) => { frame_screenshake: "", frame_realization: "", frame_sfx: "", - button: `${AO_HOST}characters/${encodeURI( - me.name.toLowerCase() - )}/emotions/button${i}_off.png`, + button: url, }; const emote_item = new Image(); From c959f01c93ca6e106f1ce4426a098c8205873961 Mon Sep 17 00:00:00 2001 From: SymphonyVR Date: Wed, 22 Nov 2023 10:33:40 -0400 Subject: [PATCH 4/6] Make the web client UI behave more like AO2 client Fix: background scaling #92 Changes: Now every image on the viewport is centered in the X and Y. --- webAO/styles/client.css | 37 +++++++++++++++++++++++++++---------- 1 file changed, 27 insertions(+), 10 deletions(-) diff --git a/webAO/styles/client.css b/webAO/styles/client.css index 9671a9a0..cdf9ab3f 100644 --- a/webAO/styles/client.css +++ b/webAO/styles/client.css @@ -206,9 +206,11 @@ #client_court_static { position: absolute; height: 100%; - width: 100%; top: 0; left: 0; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); } #client_court { @@ -216,6 +218,9 @@ height: 100%; top: 0; left: 0; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); } #client_stitch_court { @@ -229,8 +234,10 @@ #client_stitch_court>img { position: absolute; height: 100%; - width: 100%; bottom: 0; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); } #client_court_classic { @@ -238,10 +245,13 @@ height: 100%; top: 0; left: 0; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); } .def_court { - object-position: left; + object-position: center; } .wit_court { @@ -249,7 +259,7 @@ } .pro_court { - object-position: right; + object-position: center; } #client_fullview { @@ -275,16 +285,20 @@ bottom: 0; } + .client_char>img { position: absolute; height: 100%; - width: 100%; bottom: 0; left: 0; - object-fit: cover; - object-position: 50% 0; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + } + + #client_bench_classic { left: 0; } @@ -311,17 +325,20 @@ .client_bench { position: absolute; - height: auto; - width: 100%; + height: 100%; + width: 1; bottom: 0; + object-fit: contain; } #client_fg { position: absolute; height: 100%; - width: 100%; bottom: 0; left: 0; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); } #client_evi { From e44929a7d1db3e2eb7186060d93bbcdf66591876 Mon Sep 17 00:00:00 2001 From: SymphonyVR Date: Wed, 22 Nov 2023 12:26:28 -0400 Subject: [PATCH 5/6] Reverted some bugs caused by experimenting Now is stable --- webAO/styles/client.css | 20 +++----------------- 1 file changed, 3 insertions(+), 17 deletions(-) diff --git a/webAO/styles/client.css b/webAO/styles/client.css index cdf9ab3f..7d3438b1 100644 --- a/webAO/styles/client.css +++ b/webAO/styles/client.css @@ -206,11 +206,9 @@ #client_court_static { position: absolute; height: 100%; + width: 100%; top: 0; left: 0; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); } #client_court { @@ -218,9 +216,6 @@ height: 100%; top: 0; left: 0; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); } #client_stitch_court { @@ -234,10 +229,8 @@ #client_stitch_court>img { position: absolute; height: 100%; + width: 100%; bottom: 0; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); } #client_court_classic { @@ -245,9 +238,6 @@ height: 100%; top: 0; left: 0; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); } .def_court { @@ -285,7 +275,6 @@ bottom: 0; } - .client_char>img { position: absolute; height: 100%; @@ -297,8 +286,6 @@ } - - #client_bench_classic { left: 0; } @@ -326,7 +313,6 @@ .client_bench { position: absolute; height: 100%; - width: 1; bottom: 0; object-fit: contain; } @@ -742,4 +728,4 @@ .hrtext:after { left: 0.5em; margin-right: -50%; -} +} \ No newline at end of file From f126caa2931b4ca8e41364d23d48e4406e146362 Mon Sep 17 00:00:00 2001 From: SymphonyVR Date: Wed, 22 Nov 2023 12:33:16 -0400 Subject: [PATCH 6/6] Remove old "left" field --- webAO/styles/client.css | 1 - 1 file changed, 1 deletion(-) diff --git a/webAO/styles/client.css b/webAO/styles/client.css index 7d3438b1..702766e6 100644 --- a/webAO/styles/client.css +++ b/webAO/styles/client.css @@ -279,7 +279,6 @@ position: absolute; height: 100%; bottom: 0; - left: 0; top: 50%; left: 50%; transform: translate(-50%, -50%);