loading bar
This commit is contained in:
parent
af8befcf72
commit
9ca6c3a2e9
@ -143,7 +143,7 @@
|
||||
</head>
|
||||
<body>
|
||||
<div id="container"></div>
|
||||
<span id="message"><a href="" title="Rejouer">Libre !</a></span>
|
||||
<span id="message" class="loading"></span>
|
||||
|
||||
<script type="module" src="main.js"></script>
|
||||
|
||||
|
12
main.js
12
main.js
@ -35,7 +35,18 @@ piano.loop = false
|
||||
|
||||
const loadMngr = new THREE.LoadingManager();
|
||||
const loader = new THREE.TextureLoader(loadMngr);
|
||||
loadMngr.onStart = function (url, itemsLoaded, itemsTotal) {
|
||||
message.innerHTML = 'Chargement : 0%...'
|
||||
}
|
||||
loadMngr.onProgress = function (url, itemsLoaded, itemsTotal) {
|
||||
message.innerHTML = 'Chargement : ' + 100 * itemsLoaded / itemsTotal + '%...'
|
||||
}
|
||||
loadMngr.onError = function (url) {
|
||||
message.innerHTML = 'Erreur de chargement'
|
||||
}
|
||||
loadMngr.onLoad = () => {
|
||||
message.innerHTML = ""
|
||||
message.className = ""
|
||||
animate();
|
||||
};
|
||||
|
||||
@ -503,6 +514,7 @@ function playerCollisions() {
|
||||
function gameEnd() {
|
||||
|
||||
escaped = true;
|
||||
message.innerHTML = '<a href="" title="Rejouer">Libre !</a>';
|
||||
message.className = "escaped";
|
||||
piano.play();
|
||||
|
||||
|
11
style.css
11
style.css
@ -30,21 +30,28 @@ body {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
font-size: 10vh;
|
||||
font-family: Georgia, serif;
|
||||
background: transparent;
|
||||
justify-content: center;
|
||||
z-index: 1;
|
||||
color: gray;
|
||||
}
|
||||
|
||||
#message.loading {
|
||||
display: flex;
|
||||
top: 30vh;
|
||||
font-size: 4vh;
|
||||
}
|
||||
|
||||
#message a {
|
||||
color: gray;
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
#message.escaped {
|
||||
display: flex;
|
||||
opacity: 100%;
|
||||
font-size: 10vh;
|
||||
top: 30vh;
|
||||
animation: escaped 5s;
|
||||
}
|
||||
|
Loading…
x
Reference in New Issue
Block a user