From 10e035557677d6dc80010240a14a801342f6a458 Mon Sep 17 00:00:00 2001 From: Peter Cottle Date: Sat, 29 Aug 2015 08:37:55 -0700 Subject: [PATCH] Resolves #306 speed up animation and then stop showing --- src/js/level/index.js | 27 ++++++++++++++++++++++++--- src/js/visuals/index.js | 21 +++++++++++++-------- src/js/visuals/visNode.js | 16 ++++++++++------ 3 files changed, 47 insertions(+), 17 deletions(-) diff --git a/src/js/level/index.js b/src/js/level/index.js index 2682e2ce..934aa68b 100644 --- a/src/js/level/index.js +++ b/src/js/level/index.js @@ -34,6 +34,8 @@ var regexMap = { 'objective': /^(objective|assignment)$/ }; +var MAX_TIMES_SHOW_ANIMATION = 5; + var parse = util.genParseCommand(regexMap, 'processLevelCommand'); var Level = Sandbox.extend({ @@ -437,6 +439,8 @@ var Level = Sandbox.extend({ } this.hideGoal(); + window.numLevelsSolved = window.numLevelsSolved || 0; + window.numLevelsSolved++; var nextLevel = LevelStore.getNextLevel(this.level.id); var numCommands = this.gitCommandsIssued.length; @@ -444,7 +448,24 @@ var Level = Sandbox.extend({ var skipFinishDialog = this.testOption('noFinishDialog') || this.wasResetAfterSolved; - var skipFinishAnimation = this.wasResetAfterSolved; + var skipFinishAnimation = this.wasResetAfterSolved || + window.numLevelsSolved > MAX_TIMES_SHOW_ANIMATION; + + var speed = 1.0; + switch (window.numLevelsSolved) { + case 2: + speed = 1.5; + break; + case 3: + speed = 1.8; + break; + case 4: + speed = 2.1; + break; + case 5: + speed = 2.4; + break; + } var finishAnimationChain = null; if (skipFinishAnimation) { @@ -457,10 +478,10 @@ var Level = Sandbox.extend({ ); } else { GlobalStateActions.changeIsAnimating(true); - finishAnimationChain = this.mainVis.gitVisuals.finishAnimation(); + finishAnimationChain = this.mainVis.gitVisuals.finishAnimation(speed); if (this.mainVis.originVis) { finishAnimationChain = finishAnimationChain.then( - this.mainVis.originVis.gitVisuals.finishAnimation() + this.mainVis.originVis.gitVisuals.finishAnimation(speed) ); } } diff --git a/src/js/visuals/index.js b/src/js/visuals/index.js index 5ade50f6..3897fbd9 100644 --- a/src/js/visuals/index.js +++ b/src/js/visuals/index.js @@ -208,7 +208,12 @@ GitVisuals.prototype.animateAllAttrKeys = function(keys, attr, speed, easing) { return deferred.promise; }; -GitVisuals.prototype.finishAnimation = function() { +GitVisuals.prototype.finishAnimation = function(speed) { + speed = speed || 1.0; + if (!speed) { + throw new Error('need speed by time i finish animation' + speed); + } + var _this = this; var deferred = Q.defer(); var animationDone = Q.defer(); @@ -247,7 +252,7 @@ GitVisuals.prototype.finishAnimation = function() { return this.animateAllAttrKeys( { exclude: ['circle'] }, { opacity: 0 }, - defaultTime * 1.1 + defaultTime * 1.1 / speed ); }.bind(this)) // then make circle radii bigger @@ -255,7 +260,7 @@ GitVisuals.prototype.finishAnimation = function() { return this.animateAllAttrKeys( { exclude: ['arrow', 'rect', 'path', 'text'] }, { r: nodeRadius * 2 }, - defaultTime * 1.5 + defaultTime * 1.5 / speed ); }.bind(this)) // then shrink em super fast @@ -263,16 +268,16 @@ GitVisuals.prototype.finishAnimation = function() { return this.animateAllAttrKeys( { exclude: ['arrow', 'rect', 'path', 'text'] }, { r: nodeRadius * 0.75 }, - defaultTime * 0.5 + defaultTime * 0.5 / speed ); }.bind(this)) // then explode them and display text .then(function() { makeText(); - return this.explodeNodes(); + return this.explodeNodes(speed); }.bind(this)) .then(function() { - return this.explodeNodes(); + return this.explodeNodes(speed); }.bind(this)) // then fade circles (aka everything) in and back .then(function() { @@ -305,11 +310,11 @@ GitVisuals.prototype.finishAnimation = function() { return animationDone.promise; }; -GitVisuals.prototype.explodeNodes = function() { +GitVisuals.prototype.explodeNodes = function(speed) { var deferred = Q.defer(); var funcs = []; _.each(this.visNodeMap, function(visNode) { - funcs.push(visNode.getExplodeStepFunc()); + funcs.push(visNode.getExplodeStepFunc(speed)); }); var interval = setInterval(function() { diff --git a/src/js/visuals/visNode.js b/src/js/visuals/visNode.js index ca87f30a..ac3c198a 100644 --- a/src/js/visuals/visNode.js +++ b/src/js/visuals/visNode.js @@ -376,15 +376,18 @@ var VisNode = VisBase.extend({ }, this); }, - getExplodeStepFunc: function() { + getExplodeStepFunc: function(speed) { + if (!speed) { + throw new Error('need speed by now'); + } var circle = this.get('circle'); // decide on a speed - var speedMag = 20; + var speedMag = 20 / speed; // aim upwards var angle = Math.PI + Math.random() * 1 * Math.PI; - var gravity = 1 / 5; - var drag = 1 / 100; + var gravity = (1 / 5) * speed; + var drag = (1 / 100) * speed; var vx = speedMag * Math.cos(angle); var vy = speedMag * Math.sin(angle); @@ -393,7 +396,7 @@ var VisNode = VisBase.extend({ var maxWidth = this.gitVisuals.paper.width; var maxHeight = this.gitVisuals.paper.height; - var elasticity = 0.8; + var elasticity = 0.8 / speed; var dt = 1.0; var stepFunc = function() { @@ -417,7 +420,8 @@ var VisNode = VisBase.extend({ cy: y }); // continuation calculation - if ((vx * vx + vy * vy) < 0.01 && Math.abs(y - maxHeight) === 0) { + console.log('our speed', (vx * vx + vy * vy), 'height', Math.abs(y- maxHeight)); + if ((vx * vx + vy * vy) < 0.1 && Math.abs(y - maxHeight) <= 0.1) { // dont need to animate anymore, we are on ground return false; }