From: Luigi Pinca Date: Sun, 7 Apr 2013 16:38:14 +0000 (+0200) Subject: simplified audio cassette animation code X-Git-Url: https://git.saalbach.dev/?a=commitdiff_plain;h=d8aec96f8fab5c67f438703f66253cc8ce995411;p=binbsis50.git simplified audio cassette animation code --- diff --git a/package.json b/package.json index 18733e8..dff585f 100644 --- a/package.json +++ b/package.json @@ -24,5 +24,5 @@ "start": "node app.js" }, "subdomain": "binb", - "version": "0.3.5-15" + "version": "0.3.5-16" } diff --git a/public/js/app.js b/public/js/app.js index 4017f6b..4ea11d1 100644 --- a/public/js/app.js +++ b/public/js/app.js @@ -301,48 +301,46 @@ // Start cassette animation var cassetteAnimation = function(endtime, forward) { - var millisleft = endtime - Date.now() - , secleft = millisleft / 1000 - , width - , deg + var deg + , factor + , millisleft = endtime - Date.now() , offsetleft , offsetright - , css; + , secleft = millisleft / 1000 + , width; - if (forward) { - width = 148 - (148*secleft/30); - deg = 360 - (360*secleft/30); - offsetleft = 44 - 24*secleft/30; - offsetright = 130 - 24*secleft/30; - DOM.progress.width(width); - DOM.cassettewheels.css('transform', 'rotate('+deg+'deg)'); - DOM.tapeleft.css('left', offsetleft+'px'); - DOM.taperight.css('left', offsetright+'px'); - } - else { - width = 148*secleft/5; - deg = 360*secleft/5; - offsetleft = 20 + 24*secleft/5; - offsetright = 106 + 24*secleft/5; - DOM.progress.width(width); - DOM.cassettewheels.css('transform', 'rotate('+deg+'deg)'); - DOM.tapeleft.css('left', offsetleft+'px'); - DOM.taperight.css('left', offsetright+'px'); + if (stopanimation || millisleft < 50) { + return; } if (forward) { + if (touchplay) { + elapsedtime = 30 - Math.round(secleft); + } DOM.countdown.text(secleft.toFixed(1)); - if (touchplay) {elapsedtime = 30 - Math.round(secleft);} + factor = secleft / 30; + width = 148 - 148 * factor; + deg = 360 - 360 * factor; + offsetleft = 44 - 24 * factor; + offsetright = 130 - 24 * factor; } else { DOM.countdown.text(Math.round(secleft)); + factor = secleft / 5; + width = 148 * factor; + deg = 360 * factor; + offsetleft = 20 + 24 * factor; + offsetright = 106 + 24 * factor; } - if (stopanimation || millisleft < 50) { - return; - } + DOM.progress.width(width); + DOM.cassettewheels.css('transform', 'rotate('+deg+'deg)'); + DOM.tapeleft.css('left', offsetleft+'px'); + DOM.taperight.css('left', offsetright+'px'); - setTimeout(function() {cassetteAnimation(endtime, forward);}, 50); + setTimeout(function() { + cassetteAnimation(endtime, forward); + }, 50); }; var clearPrivate = function() {