Permalink
Browse files

added template, transform origin

  • Loading branch information...
koenbok committed Dec 21, 2012
1 parent 5bdeb37 commit bfdceafb2b8dbada30a80274d01d0e2310ecfeff
Showing with 27 additions and 4 deletions.
  1. +1 −0 Makefile
  2. +15 −2 build/framer.js
  3. +6 −2 src/animation.coffee
  4. +5 −0 src/views/view.coffee
View
@@ -4,6 +4,7 @@ build:
make clean
mkdir -p build
./node_modules/browserify/bin/cmd.js src/init.coffee -o build/framer.js
cp build/framer.js template/framer.js
clean:
rm -rf dist
View
@@ -564,6 +564,7 @@ require.define("/views/view.coffee",function(require,module,exports,__dirname,__
this._insertElement();
}
this._subViews = [];
this._animations = [];
this._postCreate();
}
@@ -784,6 +785,15 @@ require.define("/views/view.coffee",function(require,module,exports,__dirname,__
}
});
View.define("_animationTransformOrigin", {
get: function() {
return this.computedStyle["-webkit-transform-origin"];
},
set: function(value) {
return this.style["-webkit-transform-origin"] = value;
}
});
View.prototype.animate = function(args, callback) {
var animation;
args.view = this;
@@ -1405,7 +1415,7 @@ require.define("/animation.coffee",function(require,module,exports,__dirname,__f
require("./utils");
PROPERTIES = ["view", "curve", "time"];
PROPERTIES = ["view", "curve", "time", "origin"];
parseCurve = function(a) {
a = a.replace("spring", "");
@@ -1446,6 +1456,7 @@ require.define("/animation.coffee",function(require,module,exports,__dirname,__f
Animation.prototype.start = function(callback) {
var _this = this;
this.beginProperties = this.view.properties;
this.view._animationTransformOrigin = this.origin;
return setTimeout(function() {
return _this._start(callback);
}, 0);
@@ -1457,13 +1468,15 @@ require.define("/animation.coffee",function(require,module,exports,__dirname,__f
Animation.prototype._end = function(callback) {
this.emit("end", this);
utils.remove(this.view._animations, this);
return typeof callback === "function" ? callback() : void 0;
};
Animation.prototype._start = function(callback) {
var curve, options, time, values,
_this = this;
this.emit("start", this);
this.view._animations.push(this);
this._stop = false;
time = this.time || 300;
curve = this.curve || "linear";
@@ -1726,7 +1739,7 @@ require.define("/init.coffee",function(require,module,exports,__dirname,__filena
Global.ViewList = ViewList;
if (window) {
window.Prothese = Global;
window.Framer = Global;
for (k in Global) {
v = Global[k];
window[k] = v;
View
@@ -3,7 +3,7 @@
require "./utils"
PROPERTIES = ["view", "curve", "time"]
PROPERTIES = ["view", "curve", "time", "origin"]
parseCurve = (a) ->
@@ -32,6 +32,7 @@ class exports.Animation extends EventEmitter
start: (callback) =>
@beginProperties = @view.properties
@view._animationTransformOrigin = @origin
setTimeout =>
@_start callback
, 0
@@ -42,16 +43,19 @@ class exports.Animation extends EventEmitter
_end: (callback) =>
@emit "end", @
utils.remove @view._animations, @
callback?()
_start: (callback) =>
@emit "start", @
@view._animations.push @
@_stop = false
time = @time or 300
curve = @curve or "linear"
# linear, ease, ease-in, ease-out, ease-in-out
# cubic-bezier(0.76, 0.18, 0.25, 0.75)
# spring(tension, friction, velocity)
@@ -119,7 +123,7 @@ class exports.Animation extends EventEmitter
# @view._animated = true
@view._animationDuration = time
@view._animationTimingFunction = curve
# FIX: we should probarbly do it like this:
# http://stackoverflow.com/questions/2087510/callback-on-css-transition
View
@@ -36,6 +36,7 @@ class View extends Frame
@_insertElement()
@_subViews = []
@_animations = []
# Override this prototype to change all behaviour
@_postCreate()
@@ -209,6 +210,10 @@ class View extends Frame
get: -> @computedStyle["-webkit-transition-timing-function"]
set: (value) -> @style["-webkit-transition-timing-function"] = value
@define "_animationTransformOrigin"
get: -> @computedStyle["-webkit-transform-origin"]
set: (value) -> @style["-webkit-transform-origin"] = value
animate: (args, callback) =>
args.view = @
animation = new Animation args

0 comments on commit bfdceaf

Please sign in to comment.