diff --git a/assets/scripts/africa.js b/assets/scripts/africa.js index d359c95..ca40788 100644 --- a/assets/scripts/africa.js +++ b/assets/scripts/africa.js @@ -1,18 +1,7 @@ var sound = null; -var playing = true; -var control = document.getElementById('control'); +var play = document.getElementById('play'); var background = document.getElementById('background'); -function toggle() { - if(playing) { - sound.pause(); - playing = false; - } else { - sound.play(); - playing = true; - } -} - function load() { makeItRain(); makeItPlay(); @@ -27,6 +16,7 @@ function makeItPlay() { control.style.visibility = 'hidden'; } }); + setTimeout(enableToggle, 2500); } @@ -37,14 +27,16 @@ function makeItRain() { }); engine.rain([ [3, 2, 2] ], 100); }; - background.src = 'assets/images/africa.png'; + background.src = 'assets/images/africa.png'; background.crossOrigin = 'anonymous'; } +function play() { + sound.play(); +} + var enableToggle = function() { if(0 === sound.pos()) { - playing = false; - control.className = 'icon-play'; - control.style.visibility = 'visible'; + play.style.visibility = 'visible'; } } diff --git a/assets/styles/style.css b/assets/styles/style.css index 5fbdeb3..2e2f44b 100644 --- a/assets/styles/style.css +++ b/assets/styles/style.css @@ -15,7 +15,7 @@ html, body, img, #container { text-align: center; } -#control { +#play { visibility: hidden; display: inline-block; border-radius: 10px; diff --git a/index.html b/index.html index b7f80ac..0c3d71b 100644 --- a/index.html +++ b/index.html @@ -13,7 +13,7 @@