KingOfDog/tetris.js
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Add transition to menu opening

Browse Source
This commit is contained in:
Marcel
2017-12-17 19:50:46 +01:00
parent e42d65f4b6
commit 41f702a18b
5 changed files with 64 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
menu.js
View File

@@ -55,22 +55,55 @@ function toggleMenu() {
}
}
function fadeBlurIn() {
const blurEl = document.getElementById("f1").children[0];
const finalVal = 15;
let currentVal = 0;
const id = setInterval(frame, 1);
function frame() {
if(currentVal >= finalVal) {
clearInterval(id);
} else {
currentVal += 0.1;
blurEl.setAttribute("stdDeviation", currentVal);
}
}
}
function fadeBlurOut() {
const blurEl = document.getElementById("f1").children[0];
const finalVal = 0;
let currentVal = 15;
const id = setInterval(frame, 1);
function frame() {
if(currentVal <= finalVal) {
clearInterval(id);
} else {
currentVal -= 0.1;
blurEl.setAttribute("stdDeviation", currentVal);
}
}
}
function showMenu() {
isPaused = true;
document.getElementById("background").classList.add("blurred");
document.getElementById("game-title").style.display = "block";
document.getElementById("game-play").style.display = "block";
document.getElementById("game-title").style.opacity = "1";
document.getElementById("game-play").style.opacity = "1";
fadeBlurIn();
if(!firstRun) {
document.getElementById("game-reset").style.display = "block";
document.getElementById("game-reset").style.opacity = "1";
}
}
function hideMenu() {
isPaused = false;
document.getElementById("background").classList.remove("blurred");
document.getElementById("game-title").style.display = "none";
document.getElementById("game-play").style.display = "none";
document.getElementById("game-reset").style.display = "none";
// document.getElementById("background").classList.remove("blurred");
document.getElementById("game-title").style.opacity = "0";
document.getElementById("game-play").style.opacity = "0";
document.getElementById("game-reset").style.opacity = "0";
fadeBlurOut();
if(!firstRun) {
update(lastTime);
}