From 38b8068e897b89b99c1357db248b8e447282d8a2 Mon Sep 17 00:00:00 2001 From: Headedbranch225 <95239405+Headedbranch225@users.noreply.github.com> Date: Tue, 9 Jan 2024 21:59:41 +0000 Subject: [PATCH 1/4] Update index.html Make the code show above the background, currently I only see the background but this fixes it --- web/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/web/index.html b/web/index.html index eb243e5..d1fbb91 100644 --- a/web/index.html +++ b/web/index.html @@ -43,7 +43,7 @@ background-color: #3C3D82; background-image: linear-gradient(135deg, rgba(249, 249, 249, 0.1) 0%, rgba(249, 249, 249, 0.1) 18%,rgba(70, 70, 70, 0.1) 18%, rgba(70, 70, 70, 0.1) 33%,rgba(229, 229, 229, 0.1) 33%, rgba(229, 229, 229, 0.1) 35%,rgba(53, 53, 53, 0.1) 35%, rgba(53, 53, 53, 0.1) 47%,rgba(156, 156, 156, 0.1) 47%, rgba(156, 156, 156, 0.1) 100%),linear-gradient(135deg, rgba(106, 106, 106, 0.08) 0%, rgba(106, 106, 106, 0.08) 9%,rgba(123, 123, 123, 0.08) 9%, rgba(123, 123, 123, 0.08) 10%,rgba(69, 69, 69, 0.08) 10%, rgba(69, 69, 69, 0.08) 38%,rgba(33, 33, 33, 0.08) 38%, rgba(33, 33, 33, 0.08) 65%,rgba(24, 24, 24, 0.08) 65%, rgba(24, 24, 24, 0.08) 77%,rgba(210, 210, 210, 0.08) 77%, rgba(210, 210, 210, 0.08) 100%),linear-gradient(45deg, rgba(70, 70, 70, 0.02) 0%, rgba(70, 70, 70, 0.02) 23%,rgba(225, 225, 225, 0.02) 23%, rgba(225, 225, 225, 0.02) 29%,rgba(118, 118, 118, 0.02) 29%, rgba(118, 118, 118, 0.02) 36%,rgba(28, 28, 28, 0.02) 36%, rgba(28, 28, 28, 0.02) 42%,rgba(142, 142, 142, 0.02) 42%, rgba(142, 142, 142, 0.02) 85%,rgba(95, 95, 95, 0.02) 85%, rgba(95, 95, 95, 0.02) 93%,rgba(32, 32, 32, 0.02) 93%, rgba(32, 32, 32, 0.02) 98%,rgba(71, 71, 71, 0.02) 98%, rgba(71, 71, 71, 0.02) 100%),linear-gradient(135deg, rgba(207, 207, 207, 0.05) 0%, rgba(207, 207, 207, 0.05) 12%,rgba(32, 32, 32, 0.05) 12%, rgba(32, 32, 32, 0.05) 27%,rgba(79, 79, 79, 0.05) 27%, rgba(79, 79, 79, 0.05) 32%,rgba(139, 139, 139, 0.05) 32%, rgba(139, 139, 139, 0.05) 43%,rgba(150, 150, 150, 0.05) 43%, rgba(150, 150, 150, 0.05) 79%,rgba(139, 139, 139, 0.05) 79%, rgba(139, 139, 139, 0.05) 87%,rgba(55, 55, 55, 0.05) 87%, rgba(55, 55, 55, 0.05) 91%,rgba(68, 68, 68, 0.05) 91%, rgba(68, 68, 68, 0.05) 100%),linear-gradient(0deg, rgba(108, 108, 108, 0.1) 0%, rgba(108, 108, 108, 0.1) 16%,rgba(163, 163, 163, 0.1) 16%, rgba(163, 163, 163, 0.1) 18%,rgba(32, 32, 32, 0.1) 18%, rgba(32, 32, 32, 0.1) 29%,rgba(122, 122, 122, 0.1) 29%, rgba(122, 122, 122, 0.1) 61%,rgba(141, 141, 141, 0.1) 61%, rgba(141, 141, 141, 0.1) 67%,rgba(53, 53, 53, 0.1) 67%, rgba(53, 53, 53, 0.1) 78%,rgba(142, 142, 142, 0.1) 78%, rgba(142, 142, 142, 0.1) 100%),linear-gradient(0deg, rgba(160, 160, 160, 0.08) 0%, rgba(160, 160, 160, 0.08) 27%,rgba(163, 163, 163, 0.08) 27%, rgba(163, 163, 163, 0.08) 29%,rgba(37, 37, 37, 0.08) 29%, rgba(37, 37, 37, 0.08) 35%,rgba(96, 96, 96, 0.08) 35%, rgba(96, 96, 96, 0.08) 73%,rgba(250, 250, 250, 0.08) 73%, rgba(250, 250, 250, 0.08) 90%,rgba(91, 91, 91, 0.08) 90%, rgba(91, 91, 91, 0.08) 100%),linear-gradient(90deg, rgba(191, 191, 191, 0.08) 0%, rgba(191, 191, 191, 0.08) 2%,rgba(170, 170, 170, 0.08) 2%, rgba(170, 170, 170, 0.08) 7%,rgba(49, 49, 49, 0.08) 7%, rgba(49, 49, 49, 0.08) 9%,rgba(131, 131, 131, 0.08) 9%, rgba(131, 131, 131, 0.08) 23%,rgba(197, 197, 197, 0.08) 23%, rgba(197, 197, 197, 0.08) 29%,rgba(154, 154, 154, 0.08) 29%, rgba(154, 154, 154, 0.08) 91%,rgba(211, 211, 211, 0.08) 91%, rgba(211, 211, 211, 0.08) 100%),linear-gradient(90deg, rgb(0,119,100),rgb(0,0,119)); margin: 0 auto; - z-index: -1; + z-index: auto; color: #F0F0F0; outline: 6px solid black; box-shadow: 0px 0px 12px black, 0px 0px 18px black; From 8f9caa18bc8b7787831123e96b565c95a02a7303 Mon Sep 17 00:00:00 2001 From: sz Date: Thu, 11 Jan 2024 02:05:04 -0600 Subject: [PATCH 2/4] If negative z-index is bad vibes, we should set z-index+1 various places All for 3 words of intro text... But this might be fine? --- web/index.html | 11 ++++++++--- 1 file changed, 8 insertions(+), 3 deletions(-) diff --git a/web/index.html b/web/index.html index d1fbb91..f8c780c 100644 --- a/web/index.html +++ b/web/index.html @@ -34,16 +34,23 @@ top: 0; } +#invisible_click, #canvas, #nav-container { + z-index: 1; +} + +#nav-button { + z-index: 2; +} #canvas { display: block; + position: relative; } #dragdrop { background-color: #3C3D82; background-image: linear-gradient(135deg, rgba(249, 249, 249, 0.1) 0%, rgba(249, 249, 249, 0.1) 18%,rgba(70, 70, 70, 0.1) 18%, rgba(70, 70, 70, 0.1) 33%,rgba(229, 229, 229, 0.1) 33%, rgba(229, 229, 229, 0.1) 35%,rgba(53, 53, 53, 0.1) 35%, rgba(53, 53, 53, 0.1) 47%,rgba(156, 156, 156, 0.1) 47%, rgba(156, 156, 156, 0.1) 100%),linear-gradient(135deg, rgba(106, 106, 106, 0.08) 0%, rgba(106, 106, 106, 0.08) 9%,rgba(123, 123, 123, 0.08) 9%, rgba(123, 123, 123, 0.08) 10%,rgba(69, 69, 69, 0.08) 10%, rgba(69, 69, 69, 0.08) 38%,rgba(33, 33, 33, 0.08) 38%, rgba(33, 33, 33, 0.08) 65%,rgba(24, 24, 24, 0.08) 65%, rgba(24, 24, 24, 0.08) 77%,rgba(210, 210, 210, 0.08) 77%, rgba(210, 210, 210, 0.08) 100%),linear-gradient(45deg, rgba(70, 70, 70, 0.02) 0%, rgba(70, 70, 70, 0.02) 23%,rgba(225, 225, 225, 0.02) 23%, rgba(225, 225, 225, 0.02) 29%,rgba(118, 118, 118, 0.02) 29%, rgba(118, 118, 118, 0.02) 36%,rgba(28, 28, 28, 0.02) 36%, rgba(28, 28, 28, 0.02) 42%,rgba(142, 142, 142, 0.02) 42%, rgba(142, 142, 142, 0.02) 85%,rgba(95, 95, 95, 0.02) 85%, rgba(95, 95, 95, 0.02) 93%,rgba(32, 32, 32, 0.02) 93%, rgba(32, 32, 32, 0.02) 98%,rgba(71, 71, 71, 0.02) 98%, rgba(71, 71, 71, 0.02) 100%),linear-gradient(135deg, rgba(207, 207, 207, 0.05) 0%, rgba(207, 207, 207, 0.05) 12%,rgba(32, 32, 32, 0.05) 12%, rgba(32, 32, 32, 0.05) 27%,rgba(79, 79, 79, 0.05) 27%, rgba(79, 79, 79, 0.05) 32%,rgba(139, 139, 139, 0.05) 32%, rgba(139, 139, 139, 0.05) 43%,rgba(150, 150, 150, 0.05) 43%, rgba(150, 150, 150, 0.05) 79%,rgba(139, 139, 139, 0.05) 79%, rgba(139, 139, 139, 0.05) 87%,rgba(55, 55, 55, 0.05) 87%, rgba(55, 55, 55, 0.05) 91%,rgba(68, 68, 68, 0.05) 91%, rgba(68, 68, 68, 0.05) 100%),linear-gradient(0deg, rgba(108, 108, 108, 0.1) 0%, rgba(108, 108, 108, 0.1) 16%,rgba(163, 163, 163, 0.1) 16%, rgba(163, 163, 163, 0.1) 18%,rgba(32, 32, 32, 0.1) 18%, rgba(32, 32, 32, 0.1) 29%,rgba(122, 122, 122, 0.1) 29%, rgba(122, 122, 122, 0.1) 61%,rgba(141, 141, 141, 0.1) 61%, rgba(141, 141, 141, 0.1) 67%,rgba(53, 53, 53, 0.1) 67%, rgba(53, 53, 53, 0.1) 78%,rgba(142, 142, 142, 0.1) 78%, rgba(142, 142, 142, 0.1) 100%),linear-gradient(0deg, rgba(160, 160, 160, 0.08) 0%, rgba(160, 160, 160, 0.08) 27%,rgba(163, 163, 163, 0.08) 27%, rgba(163, 163, 163, 0.08) 29%,rgba(37, 37, 37, 0.08) 29%, rgba(37, 37, 37, 0.08) 35%,rgba(96, 96, 96, 0.08) 35%, rgba(96, 96, 96, 0.08) 73%,rgba(250, 250, 250, 0.08) 73%, rgba(250, 250, 250, 0.08) 90%,rgba(91, 91, 91, 0.08) 90%, rgba(91, 91, 91, 0.08) 100%),linear-gradient(90deg, rgba(191, 191, 191, 0.08) 0%, rgba(191, 191, 191, 0.08) 2%,rgba(170, 170, 170, 0.08) 2%, rgba(170, 170, 170, 0.08) 7%,rgba(49, 49, 49, 0.08) 7%, rgba(49, 49, 49, 0.08) 9%,rgba(131, 131, 131, 0.08) 9%, rgba(131, 131, 131, 0.08) 23%,rgba(197, 197, 197, 0.08) 23%, rgba(197, 197, 197, 0.08) 29%,rgba(154, 154, 154, 0.08) 29%, rgba(154, 154, 154, 0.08) 91%,rgba(211, 211, 211, 0.08) 91%, rgba(211, 211, 211, 0.08) 100%),linear-gradient(90deg, rgb(0,119,100),rgb(0,0,119)); margin: 0 auto; - z-index: auto; color: #F0F0F0; outline: 6px solid black; box-shadow: 0px 0px 12px black, 0px 0px 18px black; @@ -57,7 +64,6 @@ left: 0; text-align: center; width: 100%; - z-index: -1; } #invisible_click { @@ -114,7 +120,6 @@ display: flex; flex-direction: column; justify-content: center; - z-index: 1; height: 60px; width: 30px; margin-left: 15px; From d2ddcc2149854d06f6f9b2229655effe1e6e16fa Mon Sep 17 00:00:00 2001 From: sz Date: Tue, 9 Jan 2024 22:41:25 -0600 Subject: [PATCH 3/4] Use innerWidth to avert android firefox shenanigans Why would you make the width >100%. Why --- web/main.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/web/main.js b/web/main.js index 17f94b6..ca51a76 100644 --- a/web/main.js +++ b/web/main.js @@ -49,8 +49,7 @@ return { { // reset zoom var canvas = document.getElementById('canvas'); - canvas.style.zoom = (window.innerWidth / window.outerWidth); - var width = window.outerWidth; + var width = window.innerWidth; var height = window.outerHeight; Main.scaleCanvas(canvas, width, height); Main.alignInvisibleClick(canvas); From 0f2d7188a56d8f17fed75739e7a10125981fef51 Mon Sep 17 00:00:00 2001 From: sz Date: Tue, 9 Jan 2024 21:14:13 -0600 Subject: [PATCH 4/4] Tweak to make package-portable-linux slightly less docker dependent Still probably need an if block --- package-portable-linux.sh | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/package-portable-linux.sh b/package-portable-linux.sh index f0f1641..edf0679 100644 --- a/package-portable-linux.sh +++ b/package-portable-linux.sh @@ -2,7 +2,8 @@ ## targeting old glibc # docker run --mount type=bind,source="$(pwd)",target="/usr/src/app" -it ubuntu:16.04 -cd /usr/src/app +SCRIPT_DIR=$(dirname "${BASH_SOURCE[0]}") +cd $SCRIPT_DIR # https://gist.github.com/jlblancoc/99521194aba975286c80f93e47966dc5 apt update @@ -25,7 +26,7 @@ mkdir build-portable/ && cd build-portable/ /usr/local/bin/cmake .. -DCMAKE_BUILD_TYPE=RELEASE -DBUILD_SHARED_LIBS=OFF -DOPENCV_GENERATE_PKGCONFIG=YES -DOPENCV_FORCE_3RDPARTY_BUILD=YES make -j5 install -cd /usr/src/app +cd $SCRIPT_DIR mkdir build-portable/ && cd build-portable/ /usr/local/bin/cmake .. -DBUILD_PORTABLE_LINUX=1 make -j5 install