[wip] local ~= ok, colision = ok, queue != ok, front (looks) = ok, sock Shapes ~= ok (missing new shapes)

This commit is contained in:
bgoulard 2025-12-16 14:14:54 +01:00 committed by Maix0
parent 0033956ca1
commit dded33f5fa
12 changed files with 243 additions and 172 deletions

184
frontend/pnpm-lock.yaml generated
View file

@ -214,113 +214,113 @@ packages:
'@jridgewell/trace-mapping@0.3.31':
resolution: {integrity: sha512-zzNR+SdQSDJzc8joaeP8QQoCQr8NuYx2dIIytl1QeBEZHJ9uW6hebsrYgbz8hJwUQao3TWCMtmfV8Nu1twOLAw==}
'@rollup/rollup-android-arm-eabi@4.53.4':
resolution: {integrity: sha512-PWU3Y92H4DD0bOqorEPp1Y0tbzwAurFmIYpjcObv5axGVOtcTlB0b2UKMd2echo08MgN7jO8WQZSSysvfisFSQ==}
'@rollup/rollup-android-arm-eabi@4.53.5':
resolution: {integrity: sha512-iDGS/h7D8t7tvZ1t6+WPK04KD0MwzLZrG0se1hzBjSi5fyxlsiggoJHwh18PCFNn7tG43OWb6pdZ6Y+rMlmyNQ==}
cpu: [arm]
os: [android]
'@rollup/rollup-android-arm64@4.53.4':
resolution: {integrity: sha512-Gw0/DuVm3rGsqhMGYkSOXXIx20cC3kTlivZeuaGt4gEgILivykNyBWxeUV5Cf2tDA2nPLah26vq3emlRrWVbng==}
'@rollup/rollup-android-arm64@4.53.5':
resolution: {integrity: sha512-wrSAViWvZHBMMlWk6EJhvg8/rjxzyEhEdgfMMjREHEq11EtJ6IP6yfcCH57YAEca2Oe3FNCE9DSTgU70EIGmVw==}
cpu: [arm64]
os: [android]
'@rollup/rollup-darwin-arm64@4.53.4':
resolution: {integrity: sha512-+w06QvXsgzKwdVg5qRLZpTHh1bigHZIqoIUPtiqh05ZiJVUQ6ymOxaPkXTvRPRLH88575ZCRSRM3PwIoNma01Q==}
'@rollup/rollup-darwin-arm64@4.53.5':
resolution: {integrity: sha512-S87zZPBmRO6u1YXQLwpveZm4JfPpAa6oHBX7/ghSiGH3rz/KDgAu1rKdGutV+WUI6tKDMbaBJomhnT30Y2t4VQ==}
cpu: [arm64]
os: [darwin]
'@rollup/rollup-darwin-x64@4.53.4':
resolution: {integrity: sha512-EB4Na9G2GsrRNRNFPuxfwvDRDUwQEzJPpiK1vo2zMVhEeufZ1k7J1bKnT0JYDfnPC7RNZ2H5YNQhW6/p2QKATw==}
'@rollup/rollup-darwin-x64@4.53.5':
resolution: {integrity: sha512-YTbnsAaHo6VrAczISxgpTva8EkfQus0VPEVJCEaboHtZRIb6h6j0BNxRBOwnDciFTZLDPW5r+ZBmhL/+YpTZgA==}
cpu: [x64]
os: [darwin]
'@rollup/rollup-freebsd-arm64@4.53.4':
resolution: {integrity: sha512-bldA8XEqPcs6OYdknoTMaGhjytnwQ0NClSPpWpmufOuGPN5dDmvIa32FygC2gneKK4A1oSx86V1l55hyUWUYFQ==}
'@rollup/rollup-freebsd-arm64@4.53.5':
resolution: {integrity: sha512-1T8eY2J8rKJWzaznV7zedfdhD1BqVs1iqILhmHDq/bqCUZsrMt+j8VCTHhP0vdfbHK3e1IQ7VYx3jlKqwlf+vw==}
cpu: [arm64]
os: [freebsd]
'@rollup/rollup-freebsd-x64@4.53.4':
resolution: {integrity: sha512-3T8GPjH6mixCd0YPn0bXtcuSXi1Lj+15Ujw2CEb7dd24j9thcKscCf88IV7n76WaAdorOzAgSSbuVRg4C8V8Qw==}
'@rollup/rollup-freebsd-x64@4.53.5':
resolution: {integrity: sha512-sHTiuXyBJApxRn+VFMaw1U+Qsz4kcNlxQ742snICYPrY+DDL8/ZbaC4DVIB7vgZmp3jiDaKA0WpBdP0aqPJoBQ==}
cpu: [x64]
os: [freebsd]
'@rollup/rollup-linux-arm-gnueabihf@4.53.4':
resolution: {integrity: sha512-UPMMNeC4LXW7ZSHxeP3Edv09aLsFUMaD1TSVW6n1CWMECnUIJMFFB7+XC2lZTdPtvB36tYC0cJWc86mzSsaviw==}
'@rollup/rollup-linux-arm-gnueabihf@4.53.5':
resolution: {integrity: sha512-dV3T9MyAf0w8zPVLVBptVlzaXxka6xg1f16VAQmjg+4KMSTWDvhimI/Y6mp8oHwNrmnmVl9XxJ/w/mO4uIQONA==}
cpu: [arm]
os: [linux]
'@rollup/rollup-linux-arm-musleabihf@4.53.4':
resolution: {integrity: sha512-H8uwlV0otHs5Q7WAMSoyvjV9DJPiy5nJ/xnHolY0QptLPjaSsuX7tw+SPIfiYH6cnVx3fe4EWFafo6gH6ekZKA==}
'@rollup/rollup-linux-arm-musleabihf@4.53.5':
resolution: {integrity: sha512-wIGYC1x/hyjP+KAu9+ewDI+fi5XSNiUi9Bvg6KGAh2TsNMA3tSEs+Sh6jJ/r4BV/bx/CyWu2ue9kDnIdRyafcQ==}
cpu: [arm]
os: [linux]
'@rollup/rollup-linux-arm64-gnu@4.53.4':
resolution: {integrity: sha512-BLRwSRwICXz0TXkbIbqJ1ibK+/dSBpTJqDClF61GWIrxTXZWQE78ROeIhgl5MjVs4B4gSLPCFeD4xML9vbzvCQ==}
'@rollup/rollup-linux-arm64-gnu@4.53.5':
resolution: {integrity: sha512-Y+qVA0D9d0y2FRNiG9oM3Hut/DgODZbU9I8pLLPwAsU0tUKZ49cyV1tzmB/qRbSzGvY8lpgGkJuMyuhH7Ma+Vg==}
cpu: [arm64]
os: [linux]
'@rollup/rollup-linux-arm64-musl@4.53.4':
resolution: {integrity: sha512-6bySEjOTbmVcPJAywjpGLckK793A0TJWSbIa0sVwtVGfe/Nz6gOWHOwkshUIAp9j7wg2WKcA4Snu7Y1nUZyQew==}
'@rollup/rollup-linux-arm64-musl@4.53.5':
resolution: {integrity: sha512-juaC4bEgJsyFVfqhtGLz8mbopaWD+WeSOYr5E16y+1of6KQjc0BpwZLuxkClqY1i8sco+MdyoXPNiCkQou09+g==}
cpu: [arm64]
os: [linux]
'@rollup/rollup-linux-loong64-gnu@4.53.4':
resolution: {integrity: sha512-U0ow3bXYJZ5MIbchVusxEycBw7bO6C2u5UvD31i5IMTrnt2p4Fh4ZbHSdc/31TScIJQYHwxbj05BpevB3201ug==}
'@rollup/rollup-linux-loong64-gnu@4.53.5':
resolution: {integrity: sha512-rIEC0hZ17A42iXtHX+EPJVL/CakHo+tT7W0pbzdAGuWOt2jxDFh7A/lRhsNHBcqL4T36+UiAgwO8pbmn3dE8wA==}
cpu: [loong64]
os: [linux]
'@rollup/rollup-linux-ppc64-gnu@4.53.4':
resolution: {integrity: sha512-iujDk07ZNwGLVn0YIWM80SFN039bHZHCdCCuX9nyx3Jsa2d9V/0Y32F+YadzwbvDxhSeVo9zefkoPnXEImnM5w==}
'@rollup/rollup-linux-ppc64-gnu@4.53.5':
resolution: {integrity: sha512-T7l409NhUE552RcAOcmJHj3xyZ2h7vMWzcwQI0hvn5tqHh3oSoclf9WgTl+0QqffWFG8MEVZZP1/OBglKZx52Q==}
cpu: [ppc64]
os: [linux]
'@rollup/rollup-linux-riscv64-gnu@4.53.4':
resolution: {integrity: sha512-MUtAktiOUSu+AXBpx1fkuG/Bi5rhlorGs3lw5QeJ2X3ziEGAq7vFNdWVde6XGaVqi0LGSvugwjoxSNJfHFTC0g==}
'@rollup/rollup-linux-riscv64-gnu@4.53.5':
resolution: {integrity: sha512-7OK5/GhxbnrMcxIFoYfhV/TkknarkYC1hqUw1wU2xUN3TVRLNT5FmBv4KkheSG2xZ6IEbRAhTooTV2+R5Tk0lQ==}
cpu: [riscv64]
os: [linux]
'@rollup/rollup-linux-riscv64-musl@4.53.4':
resolution: {integrity: sha512-btm35eAbDfPtcFEgaXCI5l3c2WXyzwiE8pArhd66SDtoLWmgK5/M7CUxmUglkwtniPzwvWioBKKl6IXLbPf2sQ==}
'@rollup/rollup-linux-riscv64-musl@4.53.5':
resolution: {integrity: sha512-GwuDBE/PsXaTa76lO5eLJTyr2k8QkPipAyOrs4V/KJufHCZBJ495VCGJol35grx9xryk4V+2zd3Ri+3v7NPh+w==}
cpu: [riscv64]
os: [linux]
'@rollup/rollup-linux-s390x-gnu@4.53.4':
resolution: {integrity: sha512-uJlhKE9ccUTCUlK+HUz/80cVtx2RayadC5ldDrrDUFaJK0SNb8/cCmC9RhBhIWuZ71Nqj4Uoa9+xljKWRogdhA==}
'@rollup/rollup-linux-s390x-gnu@4.53.5':
resolution: {integrity: sha512-IAE1Ziyr1qNfnmiQLHBURAD+eh/zH1pIeJjeShleII7Vj8kyEm2PF77o+lf3WTHDpNJcu4IXJxNO0Zluro8bOw==}
cpu: [s390x]
os: [linux]
'@rollup/rollup-linux-x64-gnu@4.53.4':
resolution: {integrity: sha512-jjEMkzvASQBbzzlzf4os7nzSBd/cvPrpqXCUOqoeCh1dQ4BP3RZCJk8XBeik4MUln3m+8LeTJcY54C/u8wb3DQ==}
'@rollup/rollup-linux-x64-gnu@4.53.5':
resolution: {integrity: sha512-Pg6E+oP7GvZ4XwgRJBuSXZjcqpIW3yCBhK4BcsANvb47qMvAbCjR6E+1a/U2WXz1JJxp9/4Dno3/iSJLcm5auw==}
cpu: [x64]
os: [linux]
'@rollup/rollup-linux-x64-musl@4.53.4':
resolution: {integrity: sha512-lu90KG06NNH19shC5rBPkrh6mrTpq5kviFylPBXQVpdEu0yzb0mDgyxLr6XdcGdBIQTH/UAhDJnL+APZTBu1aQ==}
'@rollup/rollup-linux-x64-musl@4.53.5':
resolution: {integrity: sha512-txGtluxDKTxaMDzUduGP0wdfng24y1rygUMnmlUJ88fzCCULCLn7oE5kb2+tRB+MWq1QDZT6ObT5RrR8HFRKqg==}
cpu: [x64]
os: [linux]
'@rollup/rollup-openharmony-arm64@4.53.4':
resolution: {integrity: sha512-dFDcmLwsUzhAm/dn0+dMOQZoONVYBtgik0VuY/d5IJUUb787L3Ko/ibvTvddqhb3RaB7vFEozYevHN4ox22R/w==}
'@rollup/rollup-openharmony-arm64@4.53.5':
resolution: {integrity: sha512-3DFiLPnTxiOQV993fMc+KO8zXHTcIjgaInrqlG8zDp1TlhYl6WgrOHuJkJQ6M8zHEcntSJsUp1XFZSY8C1DYbg==}
cpu: [arm64]
os: [openharmony]
'@rollup/rollup-win32-arm64-msvc@4.53.4':
resolution: {integrity: sha512-WvUpUAWmUxZKtRnQWpRKnLW2DEO8HB/l8z6oFFMNuHndMzFTJEXzaYJ5ZAmzNw0L21QQJZsUQFt2oPf3ykAD/w==}
'@rollup/rollup-win32-arm64-msvc@4.53.5':
resolution: {integrity: sha512-nggc/wPpNTgjGg75hu+Q/3i32R00Lq1B6N1DO7MCU340MRKL3WZJMjA9U4K4gzy3dkZPXm9E1Nc81FItBVGRlA==}
cpu: [arm64]
os: [win32]
'@rollup/rollup-win32-ia32-msvc@4.53.4':
resolution: {integrity: sha512-JGbeF2/FDU0x2OLySw/jgvkwWUo05BSiJK0dtuI4LyuXbz3wKiC1xHhLB1Tqm5VU6ZZDmAorj45r/IgWNWku5g==}
'@rollup/rollup-win32-ia32-msvc@4.53.5':
resolution: {integrity: sha512-U/54pTbdQpPLBdEzCT6NBCFAfSZMvmjr0twhnD9f4EIvlm9wy3jjQ38yQj1AGznrNO65EWQMgm/QUjuIVrYF9w==}
cpu: [ia32]
os: [win32]
'@rollup/rollup-win32-x64-gnu@4.53.4':
resolution: {integrity: sha512-zuuC7AyxLWLubP+mlUwEyR8M1ixW1ERNPHJfXm8x7eQNP4Pzkd7hS3qBuKBR70VRiQ04Kw8FNfRMF5TNxuZq2g==}
'@rollup/rollup-win32-x64-gnu@4.53.5':
resolution: {integrity: sha512-2NqKgZSuLH9SXBBV2dWNRCZmocgSOx8OJSdpRaEcRlIfX8YrKxUT6z0F1NpvDVhOsl190UFTRh2F2WDWWCYp3A==}
cpu: [x64]
os: [win32]
'@rollup/rollup-win32-x64-msvc@4.53.4':
resolution: {integrity: sha512-Sbx45u/Lbb5RyptSbX7/3deP+/lzEmZ0BTSHxwxN/IMOZDZf8S0AGo0hJD5n/LQssxb5Z3B4og4P2X6Dd8acCA==}
'@rollup/rollup-win32-x64-msvc@4.53.5':
resolution: {integrity: sha512-JRpZUhCfhZ4keB5v0fe02gQJy05GqboPOaxvjugW04RLSYYoB/9t2lx2u/tMs/Na/1NXfY8QYjgRljRpN+MjTQ==}
cpu: [x64]
os: [win32]
@ -658,8 +658,8 @@ packages:
require-main-filename@2.0.0:
resolution: {integrity: sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg==}
rollup@4.53.4:
resolution: {integrity: sha512-YpXaaArg0MvrnJpvduEDYIp7uGOqKXbH9NsHGQ6SxKCOsNAjZF018MmxefFUulVP2KLtiGw1UvZbr+/ekjvlDg==}
rollup@4.53.5:
resolution: {integrity: sha512-iTNAbFSlRpcHeeWu73ywU/8KuU/LZmNCSxp6fjQkJBD3ivUb8tpDrXhIxEzA05HlYMEwmtaUnb3RP+YNv162OQ==}
engines: {node: '>=18.0.0', npm: '>=8.0.0'}
hasBin: true
@ -896,70 +896,70 @@ snapshots:
'@jridgewell/resolve-uri': 3.1.2
'@jridgewell/sourcemap-codec': 1.5.5
'@rollup/rollup-android-arm-eabi@4.53.4':
'@rollup/rollup-android-arm-eabi@4.53.5':
optional: true
'@rollup/rollup-android-arm64@4.53.4':
'@rollup/rollup-android-arm64@4.53.5':
optional: true
'@rollup/rollup-darwin-arm64@4.53.4':
'@rollup/rollup-darwin-arm64@4.53.5':
optional: true
'@rollup/rollup-darwin-x64@4.53.4':
'@rollup/rollup-darwin-x64@4.53.5':
optional: true
'@rollup/rollup-freebsd-arm64@4.53.4':
'@rollup/rollup-freebsd-arm64@4.53.5':
optional: true
'@rollup/rollup-freebsd-x64@4.53.4':
'@rollup/rollup-freebsd-x64@4.53.5':
optional: true
'@rollup/rollup-linux-arm-gnueabihf@4.53.4':
'@rollup/rollup-linux-arm-gnueabihf@4.53.5':
optional: true
'@rollup/rollup-linux-arm-musleabihf@4.53.4':
'@rollup/rollup-linux-arm-musleabihf@4.53.5':
optional: true
'@rollup/rollup-linux-arm64-gnu@4.53.4':
'@rollup/rollup-linux-arm64-gnu@4.53.5':
optional: true
'@rollup/rollup-linux-arm64-musl@4.53.4':
'@rollup/rollup-linux-arm64-musl@4.53.5':
optional: true
'@rollup/rollup-linux-loong64-gnu@4.53.4':
'@rollup/rollup-linux-loong64-gnu@4.53.5':
optional: true
'@rollup/rollup-linux-ppc64-gnu@4.53.4':
'@rollup/rollup-linux-ppc64-gnu@4.53.5':
optional: true
'@rollup/rollup-linux-riscv64-gnu@4.53.4':
'@rollup/rollup-linux-riscv64-gnu@4.53.5':
optional: true
'@rollup/rollup-linux-riscv64-musl@4.53.4':
'@rollup/rollup-linux-riscv64-musl@4.53.5':
optional: true
'@rollup/rollup-linux-s390x-gnu@4.53.4':
'@rollup/rollup-linux-s390x-gnu@4.53.5':
optional: true
'@rollup/rollup-linux-x64-gnu@4.53.4':
'@rollup/rollup-linux-x64-gnu@4.53.5':
optional: true
'@rollup/rollup-linux-x64-musl@4.53.4':
'@rollup/rollup-linux-x64-musl@4.53.5':
optional: true
'@rollup/rollup-openharmony-arm64@4.53.4':
'@rollup/rollup-openharmony-arm64@4.53.5':
optional: true
'@rollup/rollup-win32-arm64-msvc@4.53.4':
'@rollup/rollup-win32-arm64-msvc@4.53.5':
optional: true
'@rollup/rollup-win32-ia32-msvc@4.53.4':
'@rollup/rollup-win32-ia32-msvc@4.53.5':
optional: true
'@rollup/rollup-win32-x64-gnu@4.53.4':
'@rollup/rollup-win32-x64-gnu@4.53.5':
optional: true
'@rollup/rollup-win32-x64-msvc@4.53.4':
'@rollup/rollup-win32-x64-msvc@4.53.5':
optional: true
'@socket.io/component-emitter@3.1.2': {}
@ -1243,32 +1243,32 @@ snapshots:
require-main-filename@2.0.0: {}
rollup@4.53.4:
rollup@4.53.5:
dependencies:
'@types/estree': 1.0.8
optionalDependencies:
'@rollup/rollup-android-arm-eabi': 4.53.4
'@rollup/rollup-android-arm64': 4.53.4
'@rollup/rollup-darwin-arm64': 4.53.4
'@rollup/rollup-darwin-x64': 4.53.4
'@rollup/rollup-freebsd-arm64': 4.53.4
'@rollup/rollup-freebsd-x64': 4.53.4
'@rollup/rollup-linux-arm-gnueabihf': 4.53.4
'@rollup/rollup-linux-arm-musleabihf': 4.53.4
'@rollup/rollup-linux-arm64-gnu': 4.53.4
'@rollup/rollup-linux-arm64-musl': 4.53.4
'@rollup/rollup-linux-loong64-gnu': 4.53.4
'@rollup/rollup-linux-ppc64-gnu': 4.53.4
'@rollup/rollup-linux-riscv64-gnu': 4.53.4
'@rollup/rollup-linux-riscv64-musl': 4.53.4
'@rollup/rollup-linux-s390x-gnu': 4.53.4
'@rollup/rollup-linux-x64-gnu': 4.53.4
'@rollup/rollup-linux-x64-musl': 4.53.4
'@rollup/rollup-openharmony-arm64': 4.53.4
'@rollup/rollup-win32-arm64-msvc': 4.53.4
'@rollup/rollup-win32-ia32-msvc': 4.53.4
'@rollup/rollup-win32-x64-gnu': 4.53.4
'@rollup/rollup-win32-x64-msvc': 4.53.4
'@rollup/rollup-android-arm-eabi': 4.53.5
'@rollup/rollup-android-arm64': 4.53.5
'@rollup/rollup-darwin-arm64': 4.53.5
'@rollup/rollup-darwin-x64': 4.53.5
'@rollup/rollup-freebsd-arm64': 4.53.5
'@rollup/rollup-freebsd-x64': 4.53.5
'@rollup/rollup-linux-arm-gnueabihf': 4.53.5
'@rollup/rollup-linux-arm-musleabihf': 4.53.5
'@rollup/rollup-linux-arm64-gnu': 4.53.5
'@rollup/rollup-linux-arm64-musl': 4.53.5
'@rollup/rollup-linux-loong64-gnu': 4.53.5
'@rollup/rollup-linux-ppc64-gnu': 4.53.5
'@rollup/rollup-linux-riscv64-gnu': 4.53.5
'@rollup/rollup-linux-riscv64-musl': 4.53.5
'@rollup/rollup-linux-s390x-gnu': 4.53.5
'@rollup/rollup-linux-x64-gnu': 4.53.5
'@rollup/rollup-linux-x64-musl': 4.53.5
'@rollup/rollup-openharmony-arm64': 4.53.5
'@rollup/rollup-win32-arm64-msvc': 4.53.5
'@rollup/rollup-win32-ia32-msvc': 4.53.5
'@rollup/rollup-win32-x64-gnu': 4.53.5
'@rollup/rollup-win32-x64-msvc': 4.53.5
fsevents: 2.3.3
set-blocking@2.0.0: {}
@ -1337,7 +1337,7 @@ snapshots:
fdir: 6.5.0(picomatch@4.0.3)
picomatch: 4.0.3
postcss: 8.5.6
rollup: 4.53.4
rollup: 4.53.5
tinyglobby: 0.2.15
optionalDependencies:
'@types/node': 25.0.3

View file

@ -1,8 +1,8 @@
@import "tailwindcss";
/* @font-face {
@font-face {
font-family: "Nimbus Mono L";
src: url("/fonts/NimbusMonoL.woff2") format("woff2");
} */
}
@tailwind utilities;

View file

@ -2,13 +2,26 @@
<div id="mainbox" class="mainboxDisplay">
<button id="b-whoami" class="btn-style absolute top-4 left-6">Who am i</button>
<br>
<button id="b-joinQueu" class="btn-style absolute top-16 left-6">Queu Up</button>
<button id="b-joinQueu" class="btn-style absolute top-16 left-6">Queue Up</button>
<br>
<h1 class="text-3xl font-bold text-gray-800">
Pong Box<span id="t-username"></span>
</h1><br>
<label class="inline-flex items-center gap-3 cursor-pointer select-none">
<!-- Checkbox -->
<input id="modeToggle" type="checkbox" class="sr-only"/>
<!-- Switch -->
<div id="toggleTrack" class="relative w-14 h-7 rounded-full bg-gray-300 transition-colors duration-300">
<span id="toggleKnob" class="absolute top-0.5 left-0.5 w-6 h-6 bg-white rounded-full transition-transform duration-300"></span>
</div>
<!-- Label -->
<span id="toggleLabel" class="text-sm font-medium text-gray-700"> Local </span>
</label>
<!-- Horizontal Message Box -->
<div id="system-box" class="system-info">System: connecting ... </div>
<h1 id="score-board" class="text-p10 font-bold text-gray-800">0:0</h1>
<!-- Pong Box -->
<div class="flex justify-center mt-2">
<div id="pongspace" class="flex flex-col">

View file

@ -34,6 +34,9 @@ document.addEventListener('ft:pageChange', () => { // dont regen socket on page
console.log("Page changed");
});
/**
* @returns the initialized socket
*/
export function getSocket(): Socket {
let addressHost = `wss://${machineHostName}:8888`;
@ -46,6 +49,11 @@ export function getSocket(): Socket {
return __socket;
};
/**
*
* @param socket The socket to wait for
* @returns voir or a promise<void>
*/
function waitSocketConnected(socket: Socket): Promise<void> {
return new Promise(resolve => {
if (socket.connected) return resolve();
@ -53,6 +61,11 @@ function waitSocketConnected(socket: Socket): Promise<void> {
});
};
/**
*
* @param socket The socket to communicat
* @returns nothing
*/
async function whoami(socket: Socket) {
try {
const chatWindow = document.getElementById("t-chatbox") as HTMLDivElement;
@ -193,7 +206,7 @@ function pongClient(_url: string, _args: RouteHandlerParams): RouteHandlerReturn
}
});
socket.on("ballPos_update", (x:number, y : number) => {
console.log('ballPos_update recieved: ', x, ' / ', y);
console.log('ballPos_update recieved');
const ball = document.getElementById("ball") as HTMLDivElement | null;
if (!ball) {
@ -216,6 +229,7 @@ function pongClient(_url: string, _args: RouteHandlerParams): RouteHandlerReturn
// Listen for messages from the server "MsgObjectServer"
socket.on("MsgObjectServer", (data: { message: ClientMessage}) => {
// Display the message in the chat window
console.log("message recieved : ", data.message.text);
const systemWindow = document.getElementById('system-box') as HTMLDivElement;
const MAX_SYSTEM_MESSAGES = 10;
@ -230,7 +244,17 @@ function pongClient(_url: string, _args: RouteHandlerParams): RouteHandlerReturn
}
systemWindow.scrollTop = systemWindow.scrollHeight;
}
console.log("Getuser():", getUser());
if (systemWindow && data.message.destination === "score-info") {
console.log("score update:", data.message.text);
const scoreboard = document.getElementById('score-board') as HTMLHeadingElement ;
if (!scoreboard) {
console.log("update score failed :(");
return ;
}
scoreboard.textContent = `${data.message.text}`;
}
// console.log("Getuser():", getUser());
});
setTitle('Pong Game Page');
@ -247,6 +271,22 @@ function pongClient(_url: string, _args: RouteHandlerParams): RouteHandlerReturn
joinQueu(socket);
});
const checkbox = document.getElementById("modeToggle") as HTMLInputElement;
const label = document.getElementById("toggleLabel") as HTMLSpanElement;
const track = document.getElementById("toggleTrack") as HTMLDivElement;
const knob = document.getElementById("toggleKnob") as HTMLSpanElement;
checkbox.addEventListener("change", () => { // web vs local
if (checkbox.checked) {
label.textContent = "Web";
track.classList.replace("bg-gray-300", "bg-blue-600");
knob.classList.add("translate-x-7");
} else {
label.textContent = "Local";
track.classList.replace("bg-blue-600", "bg-gray-300");
knob.classList.remove("translate-x-7");
}
});
}
}
};

View file

@ -103,7 +103,6 @@
.text-style {
@apply
text-black
}
.pong-field {

View file

@ -27,7 +27,7 @@
"fastify": "^5.6.2",
"fastify-plugin": "^5.1.0",
"socket.io": "^4.8.1",
"typebox": "^1.0.62"
"typebox": "^1.0.63"
},
"devDependencies": {
"@types/node": "^22.19.3",

View file

@ -11,7 +11,7 @@ import type { ClientProfil, ClientMessage } from './chat_types';
import { sendInvite } from './sendInvite';
import { setGameLink } from './setGameLink';
import { emit } from 'process';
import { Record } from 'typebox/type';
import { Boolean, Record } from 'typebox/type';
import { UserId } from '@shared/database/mixin/user';
@ -25,7 +25,6 @@ export const color = {
reset: '\x1b[0m',
};
declare const __SERVICE_NAME: string;
// Global map of clients
@ -35,8 +34,6 @@ interface ClientInfo {
lastSeen: number;
}
export const clientChat = new Map<string, ClientInfo>();
// @ts-expect-error: import.meta.glob is a vite thing. Typescript doesn't know this...
@ -90,16 +87,18 @@ declare module 'fastify' {
}
}
function batColision(ball_origin_x : number, ball_origin_y : number, ball_height : number, origin_bat_x : number, origin_bat_y : number, bat_w : number, bat_h : number)
{
if (((ball_origin_x >= origin_bat_x && ball_origin_x <= origin_bat_x + bat_w) ||
(ball_origin_x + ball_height >= origin_bat_x && ball_origin_x + ball_height <= origin_bat_x + bat_w))
&& ((ball_origin_y >= origin_bat_y && ball_origin_y <= origin_bat_y + bat_h) ||
(ball_origin_y + ball_height >= origin_bat_y && ball_origin_y + ball_height <= origin_bat_y + bat_h)))
function isInRange(x : number, low : number, high : number) {
if (x >= low && x <= high)
return (true);
return (false);
}
async function sendScore(socket : Socket, scoreLeft : number, scoreRight : number) { // idk why, sometimes... it fails?
let msg : ClientMessage = {destination : "score-info", command: "", user:"", text:scoreLeft.toString() + ":" + scoreRight.toString(), SenderWindowID:""};
socket.emit('MsgObjectServer', {message : msg});
}
async function onReady(fastify: FastifyInstance) {
// shows address for connection au server transcendance
@ -131,8 +130,8 @@ async function onReady(fastify: FastifyInstance) {
const START_BALLX = (RIGHT_EDGE / 2) - BALL_SIZE;
const START_BALLY = (BOTTOM_EDGE / 2) - BALL_SIZE;
const ACCELERATION_FACTOR = 1.0001;
const ABS_MAX_BALL_SPEED = 10;
const ACCELERATION_FACTOR = 1.15;
const ABS_MAX_BALL_SPEED = 3;
// val inits
let paddleLeft = PADDLE_START; //shared start bat position
@ -140,8 +139,10 @@ async function onReady(fastify: FastifyInstance) {
let ballPosX = START_BALLX;
let ballPosY = START_BALLY;
let ballSpeedX = 1;
let ballSpeedY = 1;
let ballSpeedX = -1;
let ballSpeedY = -1;
let scoreL = 0;
let scoreR = 0;
let games : Record<UserId, string> = {}; // uuid, game uid - if not in game empty string
@ -150,6 +151,7 @@ async function onReady(fastify: FastifyInstance) {
socket.emit("batLeft_update", paddleLeft);
socket.emit("batRight_update", paddleRight);
socket.emit("ballPos_update", ballPosX, ballPosY);
sendScore(socket, scoreL, scoreR);
// GAME
// paddle handling
@ -162,6 +164,7 @@ async function onReady(fastify: FastifyInstance) {
}
// position of bat leftplokoplpl
paddleLeft = Math.max(TOP_EDGE, Math.min(MAX_PADDLE_Y, paddleLeft));
console.log("batLeft_update:", paddleLeft);
socket.emit("batLeft_update", paddleLeft);
});
socket.on('batmove_Right', (direction: "up" | "down") => {
@ -176,14 +179,14 @@ async function onReady(fastify: FastifyInstance) {
socket.emit("batRight_update", paddleRight);
});
// ball handling:
// TODO 1: l/r bat hit
// TODO 2: l/r wall hit : score 5pt gagne
setInterval(async () => {
const new_ballPosX = ballPosX + ballSpeedX;
const new_ballPosY = ballPosY + ballSpeedY;
if (batColision(new_ballPosX, new_ballPosY, BALL_SIZE, PADDLE_X_OFFSET, paddleLeft, PADDLE_WIDTH, PADDLE_HEIGHT) ||
batColision(new_ballPosX, new_ballPosY, BALL_SIZE, RIGHT_EDGE - PADDLE_X_OFFSET, paddleRight, PADDLE_WIDTH, PADDLE_HEIGHT))
if (((isInRange(new_ballPosY, paddleLeft, paddleLeft + PADDLE_HEIGHT) || isInRange(new_ballPosY + BALL_SIZE *2, paddleLeft, paddleLeft + PADDLE_HEIGHT)) // y ok ?
&& isInRange(new_ballPosX, PADDLE_X_OFFSET, PADDLE_X_OFFSET + PADDLE_WIDTH) && ballSpeedX < 0) || // x ok? && ball going toward paddle?
((isInRange(new_ballPosY, paddleRight, paddleRight + PADDLE_HEIGHT) || isInRange(new_ballPosY + BALL_SIZE *2, paddleRight, paddleRight + PADDLE_HEIGHT)) // right side equations
&& isInRange(new_ballPosX + BALL_SIZE * 2, RIGHT_EDGE - PADDLE_X_OFFSET - PADDLE_WIDTH, RIGHT_EDGE - PADDLE_X_OFFSET)) && ballSpeedX > 0)
{
ballSpeedX *= -1;
ballSpeedX *= ACCELERATION_FACTOR;
@ -191,10 +194,26 @@ async function onReady(fastify: FastifyInstance) {
console.log('bat colision');
}
else if (new_ballPosX < 0 || new_ballPosX + BALL_SIZE*2 > RIGHT_EDGE) {
ballSpeedX *= -1;
ballSpeedX *= ACCELERATION_FACTOR;
ballSpeedY *= ACCELERATION_FACTOR;
console.log('wall colision');
ballPosX = START_BALLX;
ballPosY = START_BALLY;
ballSpeedX = (Math.random() - .5) < 0 ? -1 : 1;
if (new_ballPosX < 0) {
scoreR += 1;
ballSpeedY = -1;
} else {
scoreL += 1;
ballSpeedY = 1;
}
if (scoreL >= 5 || scoreR >= 5)
{
console.log('game should stop + board reset');
ballSpeedX = 0; // temp solution
ballSpeedY = 0;
// reset board :D
}
console.log('point scored');
sendScore(socket, scoreL, scoreR);
// TODO: score point + ball reset + spd reset
}
else if (new_ballPosY < 0 || new_ballPosY + BALL_SIZE*2 > BOTTOM_EDGE) {
@ -211,7 +230,7 @@ async function onReady(fastify: FastifyInstance) {
socket.emit("ballPos_update", ballPosX, ballPosY);
}, 16)
// QUEU HANDL
// QUEUE HANDL
socket.on('queuJoin', async (uuid: UserId) => {
console.log('queu join recieved for : ', uuid);
if (!games.hasOwnProperty(uuid)) {