Formatting for consistency

This commit is contained in:
sole 2013-10-13 19:09:09 +01:00
parent d8b2deb02c
commit 80485bf0c5
3 changed files with 62 additions and 55 deletions

View File

@ -12,67 +12,70 @@
<p>Tween#stopChainedTweens</p>
</div>
<div style="position: absolute; top: 250px; left: 50px; ">
<button id="start">Start</button>
<button id="stop">Stop</button>
<button id="start">Start</button>
<button id="stop">Stop</button>
<div id="target1" data-rotation="0" data-y="0" class="box" style="left: 0px; top: 50px">
Box One
Box One
</div>
<div id="target2" data-rotation="0" data-y="0" class="box" style="left: 0px; top: 200px">
Box Two
Box Two
</div>
</div>
<script src="../build/tween.min.js"></script>
<script src="js/RequestAnimationFrame.js"></script>
<script>
function animate() {
requestAnimationFrame( animate );
TWEEN.update();
}
animate();
function animate() {
requestAnimationFrame( animate );
TWEEN.update();
}
var a = document.getElementById('target1');
var b = document.getElementById('target2');
var start = document.getElementById('start');
var stop = document.getElementById('stop');
var t0, t1;
var p0 = { x: 0 }, p1 = { x: 0 }
animate();
start.onclick = function () {
if (!t0 && !t1) {
t0 = new TWEEN.Tween(p0)
.to({x: 700}, 2000)
.delay(1000)
.easing(TWEEN.Easing.Elastic.InOut)
.onUpdate(function () {
a.style.left = p0.x + 'px';
})
.onComplete(function () {
p0.x = 0;
a.style.left = p0.x + 'px';
});
var a = document.getElementById('target1');
var b = document.getElementById('target2');
var start = document.getElementById('start');
var stop = document.getElementById('stop');
var t0, t1;
var p0 = { x: 0 },
p1 = { x: 0 }
t1 = new TWEEN.Tween(p1)
.to({x: 1000}, 3000)
.delay(1000)
.easing(TWEEN.Easing.Elastic.InOut)
.onUpdate(function () {
b.style.left = p1.x + 'px';
})
.onComplete(function () {
p1.x = 0;
b.style.left = p1.x + 'px';
});
start.onclick = function() {
if (!t0 && !t1) {
t0 = new TWEEN.Tween(p0)
.to({ x: 700 }, 2000)
.delay(1000)
.easing(TWEEN.Easing.Elastic.InOut)
.onUpdate(function() {
a.style.left = p0.x + 'px';
})
.onComplete(function() {
p0.x = 0;
a.style.left = p0.x + 'px';
});
t0.chain(t1);
t1.chain(t0);
}
t0.start();
};
t1 = new TWEEN.Tween(p1)
.to({ x: 1000 }, 3000)
.delay(1000)
.easing(TWEEN.Easing.Elastic.InOut)
.onUpdate(function() {
b.style.left = p1.x + 'px';
})
.onComplete(function() {
p1.x = 0;
b.style.left = p1.x + 'px';
});
stop.onclick = function () {
t0.stop();
};
t0.chain(t1);
t1.chain(t0);
}
t0.start();
};
stop.onclick = function () {
t0.stop();
};
</script>
<style type="text/css">
@ -88,9 +91,11 @@
font-size: 10px;
padding: 20px;
}
#target1 {
background: #fcc;
}
#target2 {
background: #cfc;
}

View File

@ -188,13 +188,13 @@ TWEEN.Tween = function ( object ) {
this.stopChainedTweens = function () {
for ( var i = 0, numChainedTweens = _chainedTweens.length; i < numChainedTweens; i ++ ) {
for ( var i = 0, numChainedTweens = _chainedTweens.length; i < numChainedTweens; i++ ) {
_chainedTweens[ i ].stop();
}
};
};
this.delay = function ( amount ) {
@ -355,7 +355,7 @@ TWEEN.Tween = function ( object ) {
}
for ( var i = 0, numChainedTweens = _chainedTweens.length; i < numChainedTweens; i ++ ) {
for ( var i = 0, numChainedTweens = _chainedTweens.length; i < numChainedTweens; i++ ) {
_chainedTweens[ i ].start( time );

View File

@ -262,7 +262,7 @@ test( "Test TWEEN.Tween.chain --with one tween", function() {
test( "Test TWEEN.Tween.chain --with several tweens in an array", function() {
var t = new TWEEN.Tween( {} ),
var t = new TWEEN.Tween( {} ),
chainedTweens = [],
numChained = 3,
numChainedStarted = 0;
@ -271,15 +271,17 @@ test( "Test TWEEN.Tween.chain --with several tweens in an array", function() {
t.to( {}, 1000 );
function onChainedStart() {
numChainedStarted++;
}
for(var i = 0; i < numChained; i++ ){
var chained = new TWEEN.Tween( {} );
chained.to( {}, 1000 );
chainedTweens.push( chained );
chained.onStart(function() {
numChainedStarted++;
});
chained.onStart(onChainedStart);
}
// NOTE: This is not the normal way to chain several tweens simultaneously
@ -301,7 +303,7 @@ test( "Test TWEEN.Tween.chain --with several tweens in an array", function() {
test( "Test TWEEN.Tween.chain allows endless loops", function() {
var obj = { x: 0 },
var obj = { x: 0 },
t1 = new TWEEN.Tween( obj ).to( { x: 100 }, 1000 ),
t2 = new TWEEN.Tween( obj ).to( { x: 0 }, 1000 );