From 3713464ecb854719f25cf5196d4a3ebb87851eef Mon Sep 17 00:00:00 2001 From: Sven Slootweg Date: Thu, 8 May 2014 22:34:37 +0200 Subject: [PATCH] WHOO EASE CHAINING! --- compiled/radium.js | 781 ++++++++++++++++++++++---------------- gemswap/core.coffee | 10 +- gemswap/gemswap.js | 44 ++- radium/engine.coffee | 5 +- radium/engine.ease.coffee | 167 ++++---- 5 files changed, 590 insertions(+), 417 deletions(-) diff --git a/compiled/radium.js b/compiled/radium.js index 445f588..93fd714 100644 --- a/compiled/radium.js +++ b/compiled/radium.js @@ -43,6 +43,7 @@ this.tilesets = {}; this.named_timers = {}; this.unnamed_timers = []; + this.ease.engine = this; } Engine.prototype.addCanvas = function(canvas, label) { @@ -94,7 +95,6 @@ this.current_frameskip = 0; this.last_frameskip_collection = Math.floor(current_frame); } - this.updateEasings(); this.updateTimers(); _ref = this.scenes; for (name in _ref) { @@ -247,323 +247,449 @@ })(); Engine.prototype.ease = { - _calculateElasticValues: (function(_this) { - return function(amplitude, period, change, inout) { - var overshoot; - if (inout == null) { - inout = false; - } - if (period == null) { - if (inout) { - period = duration * (0.3 * 1.5); - } else { - period = duration * 0.3; - } - } - if ((amplitude == null) || amplitude < Math.abs(change)) { - amplitude = change; - overshoot = period / 4; + _calculateElasticValues: function(amplitude, period, change, inout) { + var overshoot; + if (inout == null) { + inout = false; + } + if (period == null) { + if (inout) { + period = duration * (0.3 * 1.5); } else { - overshoot = period / (2 * Math.PI) * Math.asin(change / amplitude); - } - return [amplitude, period, change]; - }; - })(this), - backIn: (function(_this) { - return function(start, end, duration, infinite, overshoot) { - if (infinite == null) { - infinite = false; - } - if (overshoot == null) { - overshoot = 1.70158; - } - return new Ease(_this, "backIn", infinite, start, end, _this.current_frame, duration, overshoot); - }; - })(this), - backOut: (function(_this) { - return function(start, end, duration, infinite, overshoot) { - if (infinite == null) { - infinite = false; - } - if (overshoot == null) { - overshoot = 1.70158; - } - return new Ease(_this, "backOut", infinite, start, end, _this.current_frame, duration, overshoot); - }; - })(this), - backInOut: (function(_this) { - return function(start, end, duration, infinite, overshoot) { - if (infinite == null) { - infinite = false; - } - if (overshoot == null) { - overshoot = 1.70158; - } - return new Ease(_this, "backInOut", infinite, start, end, _this.current_frame, duration, overshoot); - }; - })(this), - bounceOut: (function(_this) { - return function(start, end, duration, infinite) { - if (infinite == null) { - infinite = false; - } - return new Ease(_this, "bounceOut", infinite, start, end, _this.current_frame, duration); - }; - })(this), - bounceIn: (function(_this) { - return function(start, end, duration, infinite) { - if (infinite == null) { - infinite = false; - } - return new Ease(_this, "bounceIn", infinite, start, end, _this.current_frame, duration); - }; - })(this), - bounceInOut: (function(_this) { - return function(start, end, duration, infinite) { - if (infinite == null) { - infinite = false; - } - return new Ease(_this, "bounceInOut", infinite, start, end, _this.current_frame, duration); - }; - })(this), - circOut: (function(_this) { - return function(start, end, duration, infinite) { - if (infinite == null) { - infinite = false; - } - return new Ease(_this, "circOut", infinite, start, end, _this.current_frame, duration); - }; - })(this), - circIn: (function(_this) { - return function(start, end, duration, infinite) { - if (infinite == null) { - infinite = false; - } - return new Ease(_this, "circIn", infinite, start, end, _this.current_frame, duration); - }; - })(this), - circInOut: (function(_this) { - return function(start, end, duration, infinite) { - if (infinite == null) { - infinite = false; - } - return new Ease(_this, "circInOut", infinite, start, end, _this.current_frame, duration); - }; - })(this), - cubicOut: (function(_this) { - return function(start, end, duration, infinite) { - if (infinite == null) { - infinite = false; - } - return new Ease(_this, "cubicOut", infinite, start, end, _this.current_frame, duration); - }; - })(this), - cubicIn: (function(_this) { - return function(start, end, duration, infinite) { - if (infinite == null) { - infinite = false; - } - return new Ease(_this, "cubicIn", infinite, start, end, _this.current_frame, duration); - }; - })(this), - cubicInOut: (function(_this) { - return function(start, end, duration, infinite) { - if (infinite == null) { - infinite = false; - } - return new Ease(_this, "cubicInOut", infinite, start, end, _this.current_frame, duration); - }; - })(this), - elasticOut: (function(_this) { - return function(start, end, duration, infinite, amplitude, period) { - var change, _ref; - if (infinite == null) { - infinite = false; - } - if (amplitude == null) { - amplitude = null; - } - if (period == null) { - period = null; - } - _ref = _this._calculateElasticValues(amplitude, period, end - start), amplitude = _ref[0], period = _ref[1], change = _ref[2]; - end = start + change; - return new Ease(_this, "elasticOut", infinite, start, end, _this.current_frame, duration); - }; - })(this), - elasticIn: (function(_this) { - return function(start, end, duration, infinite, amplitude, period) { - var change, _ref; - if (infinite == null) { - infinite = false; - } - if (amplitude == null) { - amplitude = null; - } - if (period == null) { - period = null; - } - _ref = _this._calculateElasticValues(amplitude, period, end - start), amplitude = _ref[0], period = _ref[1], change = _ref[2]; - end = start + change; - return new Ease(_this, "elasticIn", infinite, start, end, _this.current_frame, duration); - }; - })(this), - elasticInOut: (function(_this) { - return function(start, end, duration, infinite, amplitude, period) { - var change, _ref; - if (infinite == null) { - infinite = false; - } - if (amplitude == null) { - amplitude = null; - } - if (period == null) { - period = null; - } - _ref = _this._calculateElasticValues(amplitude, period, end - start, true), amplitude = _ref[0], period = _ref[1], change = _ref[2]; - end = start + change; - return new Ease(_this, "elasticInOut", infinite, start, end, _this.current_frame, duration); - }; - })(this), - expoOut: (function(_this) { - return function(start, end, duration, infinite) { - if (infinite == null) { - infinite = false; - } - return new Ease(_this, "expoOut", infinite, start, end, _this.current_frame, duration); - }; - })(this), - expoIn: (function(_this) { - return function(start, end, duration, infinite) { - if (infinite == null) { - infinite = false; - } - return new Ease(_this, "expoIn", infinite, start, end, _this.current_frame, duration); - }; - })(this), - expoInOut: (function(_this) { - return function(start, end, duration, infinite) { - if (infinite == null) { - infinite = false; - } - return new Ease(_this, "expoInOut", infinite, start, end, _this.current_frame, duration); - }; - })(this), - linearNone: (function(_this) { - return function(start, end, duration, infinite) { - if (infinite == null) { - infinite = false; - } - return new Ease(_this, "linearNone", infinite, start, end, _this.current_frame, duration); - }; - })(this), - linearOut: (function(_this) { - return function(start, end, duration, infinite) { - if (infinite == null) { - infinite = false; - } - return new Ease(_this, "linearNone", infinite, start, end, _this.current_frame, duration); - }; - })(this), - linearIn: (function(_this) { - return function(start, end, duration, infinite) { - if (infinite == null) { - infinite = false; - } - return new Ease(_this, "linearNone", infinite, start, end, _this.current_frame, duration); - }; - })(this), - linearInOut: (function(_this) { - return function(start, end, duration, infinite) { - if (infinite == null) { - infinite = false; - } - return new Ease(_this, "linearNone", infinite, start, end, _this.current_frame, duration); - }; - })(this), - quadOut: (function(_this) { - return function(start, end, duration, infinite) { - if (infinite == null) { - infinite = false; - } - return new Ease(_this, "quadOut", infinite, start, end, _this.current_frame, duration); - }; - })(this), - quadIn: (function(_this) { - return function(start, end, duration, infinite) { - if (infinite == null) { - infinite = false; - } - return new Ease(_this, "quadIn", infinite, start, end, _this.current_frame, duration); - }; - })(this), - quadInOut: (function(_this) { - return function(start, end, duration, infinite) { - if (infinite == null) { - infinite = false; - } - return new Ease(_this, "quadInOut", infinite, start, end, _this.current_frame, duration); - }; - })(this), - quartOut: (function(_this) { - return function(start, end, duration, infinite) { - if (infinite == null) { - infinite = false; - } - return new Ease(_this, "quartOut", infinite, start, end, _this.current_frame, duration); - }; - })(this), - quartIn: (function(_this) { - return function(start, end, duration, infinite) { - if (infinite == null) { - infinite = false; + period = duration * 0.3; } - return new Ease(_this, "quartIn", infinite, start, end, _this.current_frame, duration); - }; - })(this), - quartInOut: (function(_this) { - return function(start, end, duration, infinite) { - if (infinite == null) { - infinite = false; - } - return new Ease(_this, "quartInOut", infinite, start, end, _this.current_frame, duration); - }; - })(this), - sineOut: (function(_this) { - return function(start, end, duration, infinite) { - if (infinite == null) { - infinite = false; - } - return new Ease(_this, "sineOut", infinite, start, end, _this.current_frame, duration); - }; - })(this), - sineIn: (function(_this) { - return function(start, end, duration, infinite) { - if (infinite == null) { - infinite = false; - } - return new Ease(_this, "sineIn", infinite, start, end, _this.current_frame, duration); - }; - })(this), - sineInOut: (function(_this) { - return function(start, end, duration, infinite) { - if (infinite == null) { - infinite = false; - } - return new Ease(_this, "sineInOut", infinite, start, end, _this.current_frame, duration); - }; - })(this) + } + if ((amplitude == null) || amplitude < Math.abs(change)) { + amplitude = change; + overshoot = period / 4; + } else { + overshoot = period / (2 * Math.PI) * Math.asin(change / amplitude); + } + return [amplitude, period, change]; + }, + backIn: function(start, end, duration, next, infinite, invert_repeat, overshoot) { + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + if (overshoot == null) { + overshoot = 1.70158; + } + return new Ease(this.engine, "backIn", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next, overshoot); + }, + backOut: function(start, end, duration, next, infinite, invert_repeat, overshoot) { + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + if (overshoot == null) { + overshoot = 1.70158; + } + return new Ease(this.engine, "backOut", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next, overshoot); + }, + backInOut: function(start, end, duration, next, infinite, invert_repeat, overshoot) { + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + if (overshoot == null) { + overshoot = 1.70158; + } + return new Ease(this.engine, "backInOut", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next, overshoot); + }, + bounceOut: function(start, end, duration, next, infinite, invert_repeat) { + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + console.log("this", this.engine); + return new Ease(this.engine, "bounceOut", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next); + }, + bounceIn: function(start, end, duration, next, infinite, invert_repeat) { + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + return new Ease(this.engine, "bounceIn", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next); + }, + bounceInOut: function(start, end, duration, next, infinite, invert_repeat) { + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + return new Ease(this.engine, "bounceInOut", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next); + }, + circOut: function(start, end, duration, next, infinite, invert_repeat) { + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + return new Ease(this.engine, "circOut", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next); + }, + circIn: function(start, end, duration, next, infinite, invert_repeat) { + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + return new Ease(this.engine, "circIn", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next); + }, + circInOut: function(start, end, duration, next, infinite, invert_repeat) { + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + return new Ease(this.engine, "circInOut", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next); + }, + cubicOut: function(start, end, duration, next, infinite, invert_repeat) { + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + return new Ease(this.engine, "cubicOut", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next); + }, + cubicIn: function(start, end, duration, next, infinite, invert_repeat) { + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + return new Ease(this.engine, "cubicIn", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next); + }, + cubicInOut: function(start, end, duration, next, infinite, invert_repeat) { + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + return new Ease(this.engine, "cubicInOut", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next); + }, + elasticOut: function(start, end, duration, next, infinite, invert_repeat, amplitude, period) { + var change, _ref; + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + if (amplitude == null) { + amplitude = null; + } + if (period == null) { + period = null; + } + _ref = this._calculateElasticValues(amplitude, period, end - start), amplitude = _ref[0], period = _ref[1], change = _ref[2]; + end = start + change; + return new Ease(this.engine, "elasticOut", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next); + }, + elasticIn: function(start, end, duration, next, infinite, invert_repeat, amplitude, period) { + var change, _ref; + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + if (amplitude == null) { + amplitude = null; + } + if (period == null) { + period = null; + } + _ref = this._calculateElasticValues(amplitude, period, end - start), amplitude = _ref[0], period = _ref[1], change = _ref[2]; + end = start + change; + return new Ease(this.engine, "elasticIn", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next); + }, + elasticInOut: function(start, end, duration, next, infinite, invert_repeat, amplitude, period) { + var change, _ref; + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + if (amplitude == null) { + amplitude = null; + } + if (period == null) { + period = null; + } + _ref = this._calculateElasticValues(amplitude, period, end - start, true), amplitude = _ref[0], period = _ref[1], change = _ref[2]; + end = start + change; + return new Ease(this.engine, "elasticInOut", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next); + }, + expoOut: function(start, end, duration, next, infinite, invert_repeat) { + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + return new Ease(this.engine, "expoOut", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next); + }, + expoIn: function(start, end, duration, next, infinite, invert_repeat) { + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + return new Ease(this.engine, "expoIn", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next); + }, + expoInOut: function(start, end, duration, next, infinite, invert_repeat) { + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + return new Ease(this.engine, "expoInOut", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next); + }, + linearNone: function(start, end, duration, next, infinite, invert_repeat) { + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + return new Ease(this.engine, "linearNone", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next); + }, + linearOut: function(start, end, duration, next, infinite, invert_repeat) { + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + return new Ease(this.engine, "linearNone", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next); + }, + linearIn: function(start, end, duration, next, infinite, invert_repeat) { + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + return new Ease(this.engine, "linearNone", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next); + }, + linearInOut: function(start, end, duration, next, infinite, invert_repeat) { + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + return new Ease(this.engine, "linearNone", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next); + }, + quadOut: function(start, end, duration, next, infinite, invert_repeat) { + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + return new Ease(this.engine, "quadOut", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next); + }, + quadIn: function(start, end, duration, next, infinite, invert_repeat) { + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + return new Ease(this.engine, "quadIn", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next); + }, + quadInOut: function(start, end, duration, next, infinite, invert_repeat) { + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + return new Ease(this.engine, "quadInOut", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next); + }, + quartOut: function(start, end, duration, next, infinite, invert_repeat) { + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + return new Ease(this.engine, "quartOut", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next); + }, + quartIn: function(start, end, duration, next, infinite, invert_repeat) { + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + return new Ease(this.engine, "quartIn", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next); + }, + quartInOut: function(start, end, duration, next, infinite, invert_repeat) { + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + return new Ease(this.engine, "quartInOut", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next); + }, + sineOut: function(start, end, duration, next, infinite, invert_repeat) { + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + return new Ease(this.engine, "sineOut", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next); + }, + sineIn: function(start, end, duration, next, infinite, invert_repeat) { + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + return new Ease(this.engine, "sineIn", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next); + }, + sineInOut: function(start, end, duration, next, infinite, invert_repeat) { + if (next == null) { + next = null; + } + if (infinite == null) { + infinite = false; + } + if (invert_repeat == null) { + invert_repeat = false; + } + return new Ease(this.engine, "sineInOut", infinite, start, end, this.engine.current_frame, duration, invert_repeat, next); + } }; Ease = (function() { function Ease() { - var duration, end, engine, infinite, params, start, start_frame, type; - engine = arguments[0], type = arguments[1], infinite = arguments[2], start = arguments[3], end = arguments[4], start_frame = arguments[5], duration = arguments[6], params = 8 <= arguments.length ? __slice.call(arguments, 7) : []; + var duration, end, engine, infinite, invert_repeat, next, params, start, start_frame, type; + engine = arguments[0], type = arguments[1], infinite = arguments[2], start = arguments[3], end = arguments[4], start_frame = arguments[5], duration = arguments[6], invert_repeat = arguments[7], next = arguments[8], params = 10 <= arguments.length ? __slice.call(arguments, 9) : []; this.engine = engine; + this.type = type; this.infinite = infinite; this.start = start; this.start_frame = start_frame; this.duration = duration; + this.invert_repeat = invert_repeat; + this.next = next; this.params = params; this.circInOut = __bind(this.circInOut, this); this.circOut = __bind(this.circOut, this); @@ -576,31 +702,48 @@ this.backIn = __bind(this.backIn, this); this.valueOf = __bind(this.valueOf, this); this.updateValue = __bind(this.updateValue, this); - this.func = this[type]; + this.goToNext = __bind(this.goToNext, this); + this.func = this[this.type]; this.change = end - this.start; this.value = this.start; this.last_updated = this.start_frame; this.finished = false; + console.log(this); } + Ease.prototype.goToNext = function() { + console.log("next", this.next); + this.func = this[this.next.type]; + this.change = this.next.change; + this.value = this.next.value; + this.start_frame = this.last_updated = this.engine.current_frame; + this.infinite = this.next.infinite; + this.start = this.next.start; + this.change = this.next.change; + this.invert_repeat = this.next.invert_repeat; + this.params = this.next.params; + this.finished = false; + return this.next = this.next.next; + }; + Ease.prototype.updateValue = function(current_frame) { - if (!this.finished) { - if (current_frame >= (this.start_frame = this.duration)) { - if (this.infinite) { - this.start_frame = this.current_frame; - return this.value = this.start; - } else { - this.finished = true; - return this.value = this.start + this.change; - } + if (current_frame >= this.start_frame + this.duration) { + if (this.infinite) { + this.start_frame = current_frame; + return this.value = this.start; + } else if (this.next != null) { + return this.goToNext(); } else { - return this.value = this.func(current_frame - this.start_frame); + this.finished = true; + return this.value = this.start + this.change; } + } else { + return this.value = this.func(current_frame - this.start_frame); } }; Ease.prototype.valueOf = function() { - if (this.engine.current_frame > this.last_updated) { + if (!this.finished && this.engine.current_frame > this.last_updated) { this.updateValue(this.engine.current_frame); this.last_updated = this.engine.current_frame; } diff --git a/gemswap/core.coffee b/gemswap/core.coffee index 58691e1..d745b7f 100644 --- a/gemswap/core.coffee +++ b/gemswap/core.coffee @@ -58,11 +58,14 @@ $(-> diamond.draw_sprite = false diamond.onCreate = -> + ### @fade_step = 0.045 @fade_current_step = @fade_step @fade_value = 0 @fade_decay_current = 9999 # Disable by default @fade_decay_max = 8 + ### + @fade_value = 0 @shimmer_step = @engine.random.number(0.003, 0.007, 0.0005) * Math.random() @shimmer_current_step = @shimmer_step @@ -71,6 +74,7 @@ $(-> @gem_type = @engine.random.pick("diamond", "yellow", "blue") diamond.onStep = -> + ### if @fade_decay_current < Math.pow(2, @fade_decay_max) @fade_value += @fade_current_step @@ -84,7 +88,8 @@ $(-> @fade_value = 0 @fade_decay_current *= 1.5 @fade_current_step = @fade_step - + ### + @shimmer_value += @shimmer_current_step if @shimmer_value > 0.7 @@ -109,7 +114,8 @@ $(-> }) diamond.onMouseOver = -> - @fade_decay_current = 1 + #@fade_decay_current = 1 + @fade_value = @engine.ease.circOut(0, 1, 30, @engine.ease.bounceOut(1, 0, 45)) cursor = @engine.getObject("cursor").getInstances()[0] cursor.x = @x - 9 diff --git a/gemswap/gemswap.js b/gemswap/gemswap.js index 4c5393e..675cc72 100644 --- a/gemswap/gemswap.js +++ b/gemswap/gemswap.js @@ -41,31 +41,37 @@ diamond.sprite = engine.getSprite("diamond"); diamond.draw_sprite = false; diamond.onCreate = function() { - this.fade_step = 0.045; - this.fade_current_step = this.fade_step; + + /* + @fade_step = 0.045 + @fade_current_step = @fade_step + @fade_value = 0 + @fade_decay_current = 9999 # Disable by default + @fade_decay_max = 8 + */ this.fade_value = 0; - this.fade_decay_current = 9999; - this.fade_decay_max = 8; this.shimmer_step = this.engine.random.number(0.003, 0.007, 0.0005) * Math.random(); this.shimmer_current_step = this.shimmer_step; this.shimmer_value = 0; return this.gem_type = this.engine.random.pick("diamond", "yellow", "blue"); }; diamond.onStep = function() { - var max; - if (this.fade_decay_current < Math.pow(2, this.fade_decay_max)) { - this.fade_value += this.fade_current_step; - max = 1.5 / this.fade_decay_current; - if (this.fade_value > Math.min(max, 1)) { - this.fade_value = Math.min(max, 1); - this.fade_current_step = -this.fade_step; - } - if (this.fade_value <= 0) { - this.fade_value = 0; - this.fade_decay_current *= 1.5; - this.fade_current_step = this.fade_step; - } - } + + /* + if @fade_decay_current < Math.pow(2, @fade_decay_max) + @fade_value += @fade_current_step + + max = 1.5 / @fade_decay_current + + if @fade_value > Math.min(max, 1) + @fade_value = Math.min(max, 1) + @fade_current_step = -@fade_step + + if @fade_value <= 0 + @fade_value = 0 + @fade_decay_current *= 1.5 + @fade_current_step = @fade_step + */ this.shimmer_value += this.shimmer_current_step; if (this.shimmer_value > 0.7) { this.shimmer_value = 0.7; @@ -87,7 +93,7 @@ }); }; diamond.onMouseOver = function() { - this.fade_decay_current = 1; + this.fade_value = this.engine.ease.circOut(0, 1, 30, this.engine.ease.bounceOut(1, 0, 45)); cursor = this.engine.getObject("cursor").getInstances()[0]; cursor.x = this.x - 9; return cursor.y = this.y - 9; diff --git a/radium/engine.coffee b/radium/engine.coffee index 2727da6..eac7feb 100644 --- a/radium/engine.coffee +++ b/radium/engine.coffee @@ -16,6 +16,9 @@ class Engine @tilesets = {} @named_timers = {} @unnamed_timers = [] + + # The following is to make the engine object available in library methods + @ease.engine = this addCanvas: (canvas, label = "") => @canvases[label] = util.unpackElement(canvas) @@ -59,8 +62,6 @@ class Engine @last_frameskip_collection = Math.floor(current_frame) # Actual iteration code... - # First update the registered easings. - @updateEasings() # Then process registered timers. @updateTimers() # Now we run the scene-specific code. diff --git a/radium/engine.ease.coffee b/radium/engine.ease.coffee index a340a1d..df94210 100644 --- a/radium/engine.ease.coffee +++ b/radium/engine.ease.coffee @@ -1,5 +1,5 @@ Engine::ease = - _calculateElasticValues: (amplitude, period, change, inout = false) => + _calculateElasticValues: (amplitude, period, change, inout = false) -> if !period? if inout period = duration * (0.3 * 1.5) @@ -14,104 +14,121 @@ Engine::ease = return [amplitude, period, change] - backIn: (start, end, duration, infinite = false, overshoot = 1.70158) => - return new Ease(this, "backIn", infinite, start, end, @current_frame, duration, overshoot) - backOut: (start, end, duration, infinite = false, overshoot = 1.70158) => - return new Ease(this, "backOut", infinite, start, end, @current_frame, duration, overshoot) - backInOut: (start, end, duration, infinite = false, overshoot = 1.70158) => - return new Ease(this, "backInOut", infinite, start, end, @current_frame, duration, overshoot) - bounceOut: (start, end, duration, infinite = false) => - return new Ease(this, "bounceOut", infinite, start, end, @current_frame, duration) - bounceIn: (start, end, duration, infinite = false) => - return new Ease(this, "bounceIn", infinite, start, end, @current_frame, duration) - bounceInOut: (start, end, duration, infinite = false) => - return new Ease(this, "bounceInOut", infinite, start, end, @current_frame, duration) - circOut: (start, end, duration, infinite = false) => - return new Ease(this, "circOut", infinite, start, end, @current_frame, duration) - circIn: (start, end, duration, infinite = false) => - return new Ease(this, "circIn", infinite, start, end, @current_frame, duration) - circInOut: (start, end, duration, infinite = false) => - return new Ease(this, "circInOut", infinite, start, end, @current_frame, duration) - cubicOut: (start, end, duration, infinite = false) => - return new Ease(this, "cubicOut", infinite, start, end, @current_frame, duration) - cubicIn: (start, end, duration, infinite = false) => - return new Ease(this, "cubicIn", infinite, start, end, @current_frame, duration) - cubicInOut: (start, end, duration, infinite = false) => - return new Ease(this, "cubicInOut", infinite, start, end, @current_frame, duration) - elasticOut: (start, end, duration, infinite = false, amplitude = null, period = null) => + backIn: (start, end, duration, next = null, infinite = false , invert_repeat = false, overshoot = 1.70158) -> + return new Ease(this.engine, "backIn", infinite, start, end, @engine.current_frame, duration, invert_repeat, next, overshoot) + backOut: (start, end, duration, next = null, infinite = false , invert_repeat = false, overshoot = 1.70158) -> + return new Ease(this.engine, "backOut", infinite, start, end, @engine.current_frame, duration, invert_repeat, next, overshoot) + backInOut: (start, end, duration, next = null, infinite = false , invert_repeat = false, overshoot = 1.70158) -> + return new Ease(this.engine, "backInOut", infinite, start, end, @engine.current_frame, duration, invert_repeat, next, overshoot) + bounceOut: (start, end, duration, next = null, infinite = false , invert_repeat = false) -> + console.log("this", this.engine) + return new Ease(this.engine, "bounceOut", infinite, start, end, @engine.current_frame, duration, invert_repeat, next) + bounceIn: (start, end, duration, next = null, infinite = false , invert_repeat = false) -> + return new Ease(this.engine, "bounceIn", infinite, start, end, @engine.current_frame, duration, invert_repeat, next) + bounceInOut: (start, end, duration, next = null, infinite = false , invert_repeat = false) -> + return new Ease(this.engine, "bounceInOut", infinite, start, end, @engine.current_frame, duration, invert_repeat, next) + circOut: (start, end, duration, next = null, infinite = false , invert_repeat = false) -> + return new Ease(this.engine, "circOut", infinite, start, end, @engine.current_frame, duration, invert_repeat, next) + circIn: (start, end, duration, next = null, infinite = false , invert_repeat = false) -> + return new Ease(this.engine, "circIn", infinite, start, end, @engine.current_frame, duration, invert_repeat, next) + circInOut: (start, end, duration, next = null, infinite = false , invert_repeat = false) -> + return new Ease(this.engine, "circInOut", infinite, start, end, @engine.current_frame, duration, invert_repeat, next) + cubicOut: (start, end, duration, next = null, infinite = false , invert_repeat = false) -> + return new Ease(this.engine, "cubicOut", infinite, start, end, @engine.current_frame, duration, invert_repeat, next) + cubicIn: (start, end, duration, next = null, infinite = false , invert_repeat = false) -> + return new Ease(this.engine, "cubicIn", infinite, start, end, @engine.current_frame, duration, invert_repeat, next) + cubicInOut: (start, end, duration, next = null, infinite = false , invert_repeat = false) -> + return new Ease(this.engine, "cubicInOut", infinite, start, end, @engine.current_frame, duration, invert_repeat, next) + elasticOut: (start, end, duration, next = null, infinite = false , invert_repeat = false, amplitude = null, period = null) -> [amplitude, period, change] = @_calculateElasticValues(amplitude, period, end - start) end = start + change - return new Ease(this, "elasticOut", infinite, start, end, @current_frame, duration) - elasticIn: (start, end, duration, infinite = false, amplitude = null, period = null) => + return new Ease(this.engine, "elasticOut", infinite, start, end, @engine.current_frame, duration, invert_repeat, next) + elasticIn: (start, end, duration, next = null, infinite = false , invert_repeat = false, amplitude = null, period = null) -> [amplitude, period, change] = @_calculateElasticValues(amplitude, period, end - start) end = start + change - return new Ease(this, "elasticIn", infinite, start, end, @current_frame, duration) - elasticInOut: (start, end, duration, infinite = false, amplitude = null, period = null) => + return new Ease(this.engine, "elasticIn", infinite, start, end, @engine.current_frame, duration, invert_repeat, next) + elasticInOut: (start, end, duration, next = null, infinite = false , invert_repeat = false, amplitude = null, period = null) -> [amplitude, period, change] = @_calculateElasticValues(amplitude, period, end - start, true) end = start + change - return new Ease(this, "elasticInOut", infinite, start, end, @current_frame, duration) - expoOut: (start, end, duration, infinite = false) => - return new Ease(this, "expoOut", infinite, start, end, @current_frame, duration) - expoIn: (start, end, duration, infinite = false) => - return new Ease(this, "expoIn", infinite, start, end, @current_frame, duration) - expoInOut: (start, end, duration, infinite = false) => - return new Ease(this, "expoInOut", infinite, start, end, @current_frame, duration) - linearNone: (start, end, duration, infinite = false) => - return new Ease(this, "linearNone", infinite, start, end, @current_frame, duration) - linearOut: (start, end, duration, infinite = false) => - return new Ease(this, "linearNone", infinite, start, end, @current_frame, duration) - linearIn: (start, end, duration, infinite = false) => - return new Ease(this, "linearNone", infinite, start, end, @current_frame, duration) - linearInOut: (start, end, duration, infinite = false) => - return new Ease(this, "linearNone", infinite, start, end, @current_frame, duration) - quadOut: (start, end, duration, infinite = false) => - return new Ease(this, "quadOut", infinite, start, end, @current_frame, duration) - quadIn: (start, end, duration, infinite = false) => - return new Ease(this, "quadIn", infinite, start, end, @current_frame, duration) - quadInOut: (start, end, duration, infinite = false) => - return new Ease(this, "quadInOut", infinite, start, end, @current_frame, duration) - quartOut: (start, end, duration, infinite = false) => - return new Ease(this, "quartOut", infinite, start, end, @current_frame, duration) - quartIn: (start, end, duration, infinite = false) => - return new Ease(this, "quartIn", infinite, start, end, @current_frame, duration) - quartInOut: (start, end, duration, infinite = false) => - return new Ease(this, "quartInOut", infinite, start, end, @current_frame, duration) - sineOut: (start, end, duration, infinite = false) => - return new Ease(this, "sineOut", infinite, start, end, @current_frame, duration) - sineIn: (start, end, duration, infinite = false) => - return new Ease(this, "sineIn", infinite, start, end, @current_frame, duration) - sineInOut: (start, end, duration, infinite = false) => - return new Ease(this, "sineInOut", infinite, start, end, @current_frame, duration) + return new Ease(this.engine, "elasticInOut", infinite, start, end, @engine.current_frame, duration, invert_repeat, next) + expoOut: (start, end, duration, next = null, infinite = false , invert_repeat = false) -> + return new Ease(this.engine, "expoOut", infinite, start, end, @engine.current_frame, duration, invert_repeat, next) + expoIn: (start, end, duration, next = null, infinite = false , invert_repeat = false) -> + return new Ease(this.engine, "expoIn", infinite, start, end, @engine.current_frame, duration, invert_repeat, next) + expoInOut: (start, end, duration, next = null, infinite = false , invert_repeat = false) -> + return new Ease(this.engine, "expoInOut", infinite, start, end, @engine.current_frame, duration, invert_repeat, next) + linearNone: (start, end, duration, next = null, infinite = false , invert_repeat = false) -> + return new Ease(this.engine, "linearNone", infinite, start, end, @engine.current_frame, duration, invert_repeat, next) + linearOut: (start, end, duration, next = null, infinite = false , invert_repeat = false) -> + return new Ease(this.engine, "linearNone", infinite, start, end, @engine.current_frame, duration, invert_repeat, next) + linearIn: (start, end, duration, next = null, infinite = false , invert_repeat = false) -> + return new Ease(this.engine, "linearNone", infinite, start, end, @engine.current_frame, duration, invert_repeat, next) + linearInOut: (start, end, duration, next = null, infinite = false , invert_repeat = false) -> + return new Ease(this.engine, "linearNone", infinite, start, end, @engine.current_frame, duration, invert_repeat, next) + quadOut: (start, end, duration, next = null, infinite = false , invert_repeat = false) -> + return new Ease(this.engine, "quadOut", infinite, start, end, @engine.current_frame, duration, invert_repeat, next) + quadIn: (start, end, duration, next = null, infinite = false , invert_repeat = false) -> + return new Ease(this.engine, "quadIn", infinite, start, end, @engine.current_frame, duration, invert_repeat, next) + quadInOut: (start, end, duration, next = null, infinite = false , invert_repeat = false) -> + return new Ease(this.engine, "quadInOut", infinite, start, end, @engine.current_frame, duration, invert_repeat, next) + quartOut: (start, end, duration, next = null, infinite = false , invert_repeat = false) -> + return new Ease(this.engine, "quartOut", infinite, start, end, @engine.current_frame, duration, invert_repeat, next) + quartIn: (start, end, duration, next = null, infinite = false , invert_repeat = false) -> + return new Ease(this.engine, "quartIn", infinite, start, end, @engine.current_frame, duration, invert_repeat, next) + quartInOut: (start, end, duration, next = null, infinite = false , invert_repeat = false) -> + return new Ease(this.engine, "quartInOut", infinite, start, end, @engine.current_frame, duration, invert_repeat, next) + sineOut: (start, end, duration, next = null, infinite = false , invert_repeat = false) -> + return new Ease(this.engine, "sineOut", infinite, start, end, @engine.current_frame, duration, invert_repeat, next) + sineIn: (start, end, duration, next = null, infinite = false , invert_repeat = false) -> + return new Ease(this.engine, "sineIn", infinite, start, end, @engine.current_frame, duration, invert_repeat, next) + sineInOut: (start, end, duration, next = null, infinite = false , invert_repeat = false) -> + return new Ease(this.engine, "sineInOut", infinite, start, end, @engine.current_frame, duration, invert_repeat, next) class Ease # Port based on https://github.com/jimjeffers/Easie. I don't think this qualifies as a "bad thing" :) - constructor: (@engine, type, @infinite, @start, end, @start_frame, @duration, @params...) -> - @func = this[type] + constructor: (@engine, @type, @infinite, @start, end, @start_frame, @duration, @invert_repeat, @next, @params...) -> + @func = this[@type] @change = end - @start @value = @start @last_updated = @start_frame @finished = false + console.log(this) # TODO: Investigate whether JS engines cache deterministic outcomes by themselves. If not, # the below could provide some performance gain. #@bounce_constant_1 = 1 / 2.75 #@bounce_constant_2 = 2 / 2.75 #@bounce_constant_3 = 2.5 / 2.75 + goToNext: => + console.log("next", @next) + @func = this[@next.type] + @change = @next.change + @value = @next.value + @start_frame = @last_updated = @engine.current_frame + @infinite = @next.infinite + @start = @next.start + @change = @next.change + @invert_repeat = @next.invert_repeat + @params = @next.params + @finished = false + @next = @next.next + updateValue: (current_frame) => - if not @finished - if current_frame >= @start_frame = @duration - if @infinite - @start_frame = @current_frame - @value = @start - else - @finished = true - @value = @start + @change + if current_frame >= @start_frame + @duration + if @infinite + @start_frame = current_frame + @value = @start + else if @next? + @goToNext() else - @value = @func(current_frame - @start_frame) + @finished = true + @value = @start + @change + else + @value = @func(current_frame - @start_frame) valueOf: => - if @engine.current_frame > @last_updated + if not @finished and @engine.current_frame > @last_updated @updateValue(@engine.current_frame) @last_updated = @engine.current_frame return @value