From fea875906664f12feaad0f282901fa8d9a8b054a Mon Sep 17 00:00:00 2001
From: Eric Guzman
Date: Thu, 22 Mar 2012 11:52:44 -0700
Subject: Presets Panel - Adding presets controller and removing functionality
from panel code
---
js/controllers/presets-controller.js | 108 +++++++++++++++++++++++++++++++++++
1 file changed, 108 insertions(+)
create mode 100644 js/controllers/presets-controller.js
(limited to 'js/controllers/presets-controller.js')
diff --git a/js/controllers/presets-controller.js b/js/controllers/presets-controller.js
new file mode 100644
index 00000000..7152ba93
--- /dev/null
+++ b/js/controllers/presets-controller.js
@@ -0,0 +1,108 @@
+/* <copyright>
+ This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
+ </copyright> */
+
+
+var Montage = require("montage/core/core").Montage,
+ Component = require("montage/ui/component").Component;
+
+exports.PresetsController = Montage.create(Component, {
+
+ hasTemplate : {
+ value: false
+ },
+
+ transitionClass : {
+ value : "nj-preset-transition"
+ },
+
+ addTransition: {
+ value: function(element) {
+ element.classList.add(this.transitionClass);
+ element.addEventListener("webkitTransitionEnd", this, true);
+ }
+ },
+
+ captureWebkitTransitionEnd : {
+ value : function(e) {
+ var el = e.target;
+ el.classList.remove(this.transitionClass);
+ el.removeEventListener("webkitTransitionEnd", this, true);
+ }
+ },
+
+ applyPreset : {
+ value: function(presetData, useTransition) {
+ var selection = this.application.ninja.selectedElements;
+
+ if(!selection || !selection.length || selection.length === 0) { return false; }
+
+ var stylesController = this.application.ninja.stylesController,
+ selectorBase = presetData.selectorBase,
+ rules = [];
+
+ selectorBase = stylesController.generateClassName(selectorBase);
+
+ presetData.rules.forEach(function(rule, i) {
+ ///// Treat keyframed rules differently
+ if(rule.isKeyFrameRule) {
+ this.application.ninja.stylesController.addRule(
+ '@-webkit-keyframes ' + presetData.selectorBase,
+ this.stringifyKeys(rule.keys)
+ );
+ } else {
+ var suffix = rule.selectorSuffix || '';
+ rules.push(stylesController.addRule('.'+selectorBase + suffix, rule.styles));
+ }
+ }, this);
+
+ selection.forEach(function(element) {
+ var el = element._element;
+
+ if(useTransition) {
+ this.addTransition(el);
+ }
+
+ el.classList.add(selectorBase);
+
+ //// Keep track of elements with presets and don't add duplicates
+ this.setCachedPreset(el, presetData.id, rules);
+
+ }, this);
+
+ }
+ },
+
+ setCachedPreset : {
+ value: function(el, presetId, rules) {
+
+ }
+ },
+
+ getPresets : {
+ value: function(element) {
+
+ }
+
+ },
+
+ stringifyKeys : {
+ value: function(keysArray) {
+ var keysString = '';
+
+ keysArray.forEach(function(key) {
+ var styles = '', style;
+
+ for(style in key.styles) {
+ styles += style + ':' + key.styles[style] + '; ';
+ }
+
+ keysString += key.keyText + ' {' + styles + ' }';
+ });
+
+ return keysString;
+ }
+ }
+});
\ No newline at end of file
--
cgit v1.2.3
From 7aefa059c79c9bef5c7a8a93cdfbd1ce55f69118 Mon Sep 17 00:00:00 2001
From: Eric Guzman
Date: Thu, 29 Mar 2012 16:28:34 -0700
Subject: Presets - Remove style transition when transition doesn't start. Also
added temporary fix for aggregating animations (from timeline/presets)
---
js/controllers/presets-controller.js | 76 ++++++++++++++++++++++++------------
1 file changed, 51 insertions(+), 25 deletions(-)
(limited to 'js/controllers/presets-controller.js')
diff --git a/js/controllers/presets-controller.js b/js/controllers/presets-controller.js
index 7152ba93..e436023a 100644
--- a/js/controllers/presets-controller.js
+++ b/js/controllers/presets-controller.js
@@ -20,14 +20,39 @@ exports.PresetsController = Montage.create(Component, {
addTransition: {
value: function(element) {
+ var transitionDuration;
+
element.classList.add(this.transitionClass);
element.addEventListener("webkitTransitionEnd", this, true);
+
+
+ //// TODO: replace this hack when webkit supports transitionStart event
+ transitionDuration = this.application.ninja.stylesController.getElementStyle(element, '-webkit-transition-duration', true);
+ element.njTimeout = window.setTimeout(function() {
+ this.captureWebkitTransitionEnd({
+ 'target': element
+ });
+ }.bind(this), this._getMilliseconds(transitionDuration) + 100);
+ }
+ },
+
+ _getMilliseconds : {
+ value: function(duration) {
+ if(duration.indexOf('ms') !== -1) {
+ return parseInt(duration);
+ } else {
+ return parseFloat(duration)*1000;
+ }
}
},
captureWebkitTransitionEnd : {
value : function(e) {
var el = e.target;
+
+ //// TODO: replace this hack when webkit supports transitionStart event (see above)
+ window.clearTimeout(el.njTimeout);
+
el.classList.remove(this.transitionClass);
el.removeEventListener("webkitTransitionEnd", this, true);
}
@@ -41,30 +66,25 @@ exports.PresetsController = Montage.create(Component, {
var stylesController = this.application.ninja.stylesController,
selectorBase = presetData.selectorBase,
- rules = [];
+ rules = [],
+ animationNames = [];
selectorBase = stylesController.generateClassName(selectorBase);
- presetData.rules.forEach(function(rule, i) {
- ///// Treat keyframed rules differently
- if(rule.isKeyFrameRule) {
- this.application.ninja.stylesController.addRule(
- '@-webkit-keyframes ' + presetData.selectorBase,
- this.stringifyKeys(rule.keys)
- );
- } else {
- var suffix = rule.selectorSuffix || '';
- rules.push(stylesController.addRule('.'+selectorBase + suffix, rule.styles));
- }
- }, this);
-
selection.forEach(function(element) {
- var el = element._element;
+ var el = element._element,
+ animationName;
if(useTransition) {
this.addTransition(el);
}
+ ///// TODO: remove when we find out what to do with competing animations
+ animationName = stylesController.getElementStyle(el, '-webkit-animation-name');
+ if(animationName) {
+ animationNames.push(animationName);
+ }
+
el.classList.add(selectorBase);
//// Keep track of elements with presets and don't add duplicates
@@ -72,20 +92,26 @@ exports.PresetsController = Montage.create(Component, {
}, this);
- }
- },
-
- setCachedPreset : {
- value: function(el, presetId, rules) {
+ presetData.rules.forEach(function(rule, i) {
+ ///// Treat keyframed rules differently
+ if(rule.isKeyFrameRule) {
+ this.application.ninja.stylesController.addRule(
+ '@-webkit-keyframes ' + presetData.selectorBase,
+ this.stringifyKeys(rule.keys)
+ );
+ } else {
+ var suffix = rule.selectorSuffix || '';
- }
- },
+ ///// TODO: remove when we find out what to do with competing animations
+ if(rule.styles['-webkit-animation-name']) {
+ rule.styles['-webkit-animation-name'] += ',' + animationNames.join(',');
+ }
- getPresets : {
- value: function(element) {
+ rules.push(stylesController.addRule('.'+selectorBase + suffix, rule.styles));
+ }
+ }, this);
}
-
},
stringifyKeys : {
--
cgit v1.2.3
From 0491907d1cba1534d88c49f2bb4035484831bbe5 Mon Sep 17 00:00:00 2001
From: Eric Guzman
Date: Fri, 30 Mar 2012 09:43:48 -0700
Subject: Presets Controller - Remove unused method call
---
js/controllers/presets-controller.js | 3 ---
1 file changed, 3 deletions(-)
(limited to 'js/controllers/presets-controller.js')
diff --git a/js/controllers/presets-controller.js b/js/controllers/presets-controller.js
index e436023a..9d898a53 100644
--- a/js/controllers/presets-controller.js
+++ b/js/controllers/presets-controller.js
@@ -87,9 +87,6 @@ exports.PresetsController = Montage.create(Component, {
el.classList.add(selectorBase);
- //// Keep track of elements with presets and don't add duplicates
- this.setCachedPreset(el, presetData.id, rules);
-
}, this);
presetData.rules.forEach(function(rule, i) {
--
cgit v1.2.3
From b7ca1821ad43403a2a54361ffc6a0cdf9cba0e59 Mon Sep 17 00:00:00 2001
From: Eric Guzman
Date: Mon, 2 Apr 2012 15:10:10 -0700
Subject: Animation Presets - Only combine animations if pre-existing
animations exist
---
js/controllers/presets-controller.js | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
(limited to 'js/controllers/presets-controller.js')
diff --git a/js/controllers/presets-controller.js b/js/controllers/presets-controller.js
index 9d898a53..975f9f7a 100644
--- a/js/controllers/presets-controller.js
+++ b/js/controllers/presets-controller.js
@@ -100,7 +100,7 @@ exports.PresetsController = Montage.create(Component, {
var suffix = rule.selectorSuffix || '';
///// TODO: remove when we find out what to do with competing animations
- if(rule.styles['-webkit-animation-name']) {
+ if(rule.styles['-webkit-animation-name'] && animationNames.length) {
rule.styles['-webkit-animation-name'] += ',' + animationNames.join(',');
}
--
cgit v1.2.3