// Generated by CoffeeScript 1.6.2 (function() { var __hasProp = {}.hasOwnProperty, __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; }; define(['marionette'], function(Marionette) { var PanningRegion, getPrefixedCssProp, _ref; getPrefixedCssProp = function(baseProp) { var str; str = Modernizr.prefixed(baseProp); str = str.replace(/([A-Z])/g, function(str, m1) { return "-" + m1.toLowerCase(); }).replace(/^ms-/, "-ms-"); return str; }; PanningRegion = (function(_super) { __extends(PanningRegion, _super); function PanningRegion() { _ref = PanningRegion.__super__.constructor.apply(this, arguments); return _ref; } PanningRegion.prototype.el = "#content"; PanningRegion.prototype.initialize = function() { var transEndEventNames; transEndEventNames = { WebkitTransition: "webkitTransitionEnd", MozTransition: "transitionend", OTransition: "oTransitionEnd", msTransition: "MSTransitionEnd", transition: "transitionend" }; this.transEndEventName = transEndEventNames[Modernizr.prefixed("transition")]; this.transformPropName = getPrefixedCssProp("transform"); console.log(this.transEndEventName, this.transformPropName); return true; }; PanningRegion.prototype.transitionToView = function(newView, type) { var self, view; self = this; view = this.currentView; if (!view || view.isClosed) { this.show(newView); return; } Marionette.triggerMethod.call(this, "willTransition", view); newView.on("render", function() { var $background, newViewMatrix, translation, worldBgMatrix, worldContentMatrix; self.$el.off(self.transEndEventName); translation = void 0; if (type === "slide") { translation = "translateX(100%)"; } else if (type === "rotate") { translation = "translateX(100%) translateY(100%) rotate(" + ["20", "40", "60", "80", "90"][_.random(0, 4)] + "deg)"; } else { if (type === "drop") { translation = "translateY(100%)"; } } newView.$el.css(self.transformPropName, translation); self.$el.append(newView.el); $background = jQuery("#world-bg"); worldContentMatrix = Matrix.initWithElem(self.$el); worldBgMatrix = Matrix.initWithElem($background); newViewMatrix = Matrix.initWithElem(newView.$el); self.$el.addClass("animated"); $background.addClass("animated"); self.$el.css(self.transformPropName, newViewMatrix.clone().invert().toMatrixString()); $background.css(self.transformPropName, newViewMatrix.clone().invert().toMatrixString()); return self.$el.on(self.transEndEventName, function() { self.$el.off(self.transEndEventName); self.close(); self.currentView = newView; self.$el.removeClass("animated"); $background.removeClass("animated"); self.$el.css(self.transformPropName, (new Matrix()).toMatrixString()); newView.$el.css(self.transformPropName, (new Matrix()).toMatrixString()); $background.css("webkit-transform", (new Matrix()).toMatrixString()); Marionette.triggerMethod.call(newView, "show"); return Marionette.triggerMethod.call(self, "show", newView); }); }); newView.render(); return true; }; return PanningRegion; })(Marionette.Region); return PanningRegion; }); }).call(this);