Compare commits

...

10 Commits

Author SHA1 Message Date
1b8e4b2676 little fixes 2024-03-13 03:18:35 +01:00
dd8361cf33 - new loading screen
- huge loading time reducing by simplifiying ocean
2024-03-13 02:29:02 +01:00
4f20dce37f loading circle before instructions 2024-02-26 23:59:36 +01:00
eb36acac39 fov 2024-02-24 15:14:35 +01:00
ebe7c41578 use webp textures 2024-02-22 23:18:34 +01:00
97172aedf3 use cdn.jsdelivr.net 2024-02-22 23:16:43 +01:00
6ddf3b2949 use avif to reduce textures size 2024-02-19 15:18:55 +01:00
4722783018 remove hex tiling 2023-11-20 01:44:03 +01:00
96d485aabb format 2023-11-20 00:30:56 +01:00
d53b6a97c9 rename pressedMouseButtons 2023-11-18 16:33:38 +01:00
29 changed files with 436 additions and 464 deletions

View File

@ -8,12 +8,12 @@
<link rel="stylesheet" href="style.css"> <link rel="stylesheet" href="style.css">
<!-- Import maps polyfill --> <!-- Import maps polyfill -->
<!-- Remove this when import maps will be widely supported --> <!-- Remove this when import maps will be widely supported -->
<script async src="https://unpkg.com/es-module-shims@1.6.3/dist/es-module-shims.js"></script> <script async src="https://cdn.jsdelivr.net/npm/es-module-shims@1.8.3/dist/es-module-shims.min.js"></script>
<script type="importmap"> <script type="importmap">
{ {
"imports": { "imports": {
"three": "https://unpkg.com/three@0.158/build/three.module.js?module", "three": "https://cdn.jsdelivr.net/npm/three@0.161.0/build/three.module.min.js",
"three/addons/": "https://unpkg.com/three@0.158/examples/jsm/", "three/addons/": "https://cdn.jsdelivr.net/npm/three@0.161.0/examples/jsm/",
"three-hex-tiling": "https://cdn.jsdelivr.net/npm/three-hex-tiling@0.1.1/dist/index.js" "three-hex-tiling": "https://cdn.jsdelivr.net/npm/three-hex-tiling@0.1.1/dist/index.js"
} }
} }
@ -143,15 +143,17 @@
</script> </script>
</head> </head>
<body> <body>
<div id="container"></div> <div id="loading">
<span id="message" class="loading"> <table id="labyTable"></table>
<div id="loadingMessage">Construction du labyrinthe : <span id="progress">0</span>%</div>
<div> <div>
Se déplacer : ↑←↓→, ZQSD ou clic<br/> Se déplacer : ↑←↓→, ZQSD ou clic<br/>
Sauter : ESPACE<br/> Sauter : ESPACE<br/>
Regarder : Souris Regarder : Souris
</div> </div>
<div id="progressCircle" style="--progress: 0deg;">0%</div> </div>
</span> <div id="container"></div>
<span id="message"></span>
<script type="module" src="./main.js"></script> <script type="module" src="./main.js"></script>
</body> </body>

793
main.js

File diff suppressed because it is too large Load Diff

View File

@ -1,9 +1,47 @@
body { body {
margin: 0; margin: 0;
background-color: #000; background-color: #041626;
color: #fff; font-size: 1.3em;
font-family: Georgia, serif;
overscroll-behavior: none; overscroll-behavior: none;
cursor: wait;
}
#loading {
width: fit-content;
color: #2c5c88;
font-size: 1.3em;
top: 20vh;
margin: auto;
}
#loadingMessage {
margin-bottom: 0.5em;
}
#labyTable {
width: 230px;
height: 230px;
margin-left: auto;
margin-right: auto;
margin-top: 20vh;
margin-bottom: 5vh;
border-collapse: collapse;
}
#labyTable td {
width: 10px;
height: 10px;
transition: background-color 1s;
border: 0;
padding: 0;
}
.wall {
background-color: transparent;
}
.ground {
background-color: #214464;
} }
#container { #container {
@ -32,48 +70,7 @@ body {
justify-content: center; justify-content: center;
z-index: 1; z-index: 1;
color: gray; color: gray;
} font-family: Times, "Times New Roman", Georgia, serif;
#message.loading {
display: flex;
flex-direction: column;
top: 20vh;
width: 100%;
margin: auto;
align-items: center;
gap: 5rem;
text-align: center;
font-size: 1.7em;
cursor: progress;
}
#progressCircle {
display: flex;
justify-content: center;
align-items: center;
position: relative;
width: 200px;
height: 200px;
border: 4px solid dimgray;
border-radius: 50%;
font-size: 0;
font-size: 3vh;
font-weight: 700;
font-family: system-ui;
text-align: center;
}
#progressCircle::after {
content: "";
display: flex;
position: absolute;
width: 200px;
height: 200px;
top: -4px;
left: -4px;
border: 4px solid #1da8b7;
border-radius: 50%;
mask: conic-gradient(black var(--progress), transparent var(--progress));
} }
#message a { #message a {

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 209 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 324 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 372 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 595 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 184 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 803 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 128 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 566 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 76 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 60 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 32 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 61 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 160 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 52 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 69 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 98 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 27 KiB

BIN
textures/waternormals.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 81 KiB