diff options
Diffstat (limited to 'js/controllers/presets-controller.js')
-rw-r--r-- | js/controllers/presets-controller.js | 130 |
1 files changed, 130 insertions, 0 deletions
diff --git a/js/controllers/presets-controller.js b/js/controllers/presets-controller.js new file mode 100644 index 00000000..4c177189 --- /dev/null +++ b/js/controllers/presets-controller.js | |||
@@ -0,0 +1,130 @@ | |||
1 | /* <copyright> | ||
2 | This file contains proprietary software owned by Motorola Mobility, Inc.<br/> | ||
3 | No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> | ||
4 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | ||
5 | </copyright> */ | ||
6 | |||
7 | |||
8 | var Montage = require("montage/core/core").Montage, | ||
9 | Component = require("montage/ui/component").Component; | ||
10 | |||
11 | exports.PresetsController = Montage.create(Component, { | ||
12 | |||
13 | hasTemplate : { | ||
14 | value: false | ||
15 | }, | ||
16 | |||
17 | transitionClass : { | ||
18 | value : "nj-preset-transition" | ||
19 | }, | ||
20 | |||
21 | addTransition: { | ||
22 | value: function(element) { | ||
23 | var transitionDuration; | ||
24 | |||
25 | element.classList.add(this.transitionClass); | ||
26 | element.addEventListener("webkitTransitionEnd", this, true); | ||
27 | |||
28 | |||
29 | //// TODO: replace this hack when webkit supports transitionStart event | ||
30 | transitionDuration = this.application.ninja.stylesController.getElementStyle(element, '-webkit-transition-duration', true); | ||
31 | element.njTimeout = window.setTimeout(function() { | ||
32 | this.captureWebkitTransitionEnd({ | ||
33 | 'target': element | ||
34 | }); | ||
35 | }.bind(this), this._getMilliseconds(transitionDuration) + 100); | ||
36 | } | ||
37 | }, | ||
38 | |||
39 | _getMilliseconds : { | ||
40 | value: function(duration) { | ||
41 | if(duration.indexOf('ms') !== -1) { | ||
42 | return parseInt(duration); | ||
43 | } else { | ||
44 | return parseFloat(duration)*1000; | ||
45 | } | ||
46 | } | ||
47 | }, | ||
48 | |||
49 | captureWebkitTransitionEnd : { | ||
50 | value : function(e) { | ||
51 | var el = e.target; | ||
52 | |||
53 | //// TODO: replace this hack when webkit supports transitionStart event (see above) | ||
54 | window.clearTimeout(el.njTimeout); | ||
55 | |||
56 | el.classList.remove(this.transitionClass); | ||
57 | el.removeEventListener("webkitTransitionEnd", this, true); | ||
58 | } | ||
59 | }, | ||
60 | |||
61 | applyPreset : { | ||
62 | value: function(presetData, useTransition) { | ||
63 | var selection = this.application.ninja.selectedElements; | ||
64 | |||
65 | if(!selection || !selection.length || selection.length === 0) { return false; } | ||
66 | |||
67 | var stylesController = this.application.ninja.stylesController, | ||
68 | selectorBase = presetData.selectorBase, | ||
69 | rules = [], | ||
70 | animationNames = []; | ||
71 | |||
72 | selectorBase = stylesController.generateClassName(selectorBase); | ||
73 | |||
74 | selection.forEach(function(element) { | ||
75 | var animationName; | ||
76 | |||
77 | if(useTransition) { | ||
78 | this.addTransition(element); | ||
79 | } | ||
80 | |||
81 | ///// TODO: remove when we find out what to do with competing animations | ||
82 | animationName = stylesController.getElementStyle(element, '-webkit-animation-name'); | ||
83 | if(animationName) { | ||
84 | animationNames.push(animationName); | ||
85 | } | ||
86 | |||
87 | element.classList.add(selectorBase); | ||
88 | |||
89 | }, this); | ||
90 | |||
91 | presetData.rules.forEach(function(rule, i) { | ||
92 | ///// Treat keyframed rules differently | ||
93 | if(rule.isKeyFrameRule) { | ||
94 | this.application.ninja.stylesController.addRule( | ||
95 | '@-webkit-keyframes ' + presetData.selectorBase, | ||
96 | this.stringifyKeys(rule.keys) | ||
97 | ); | ||
98 | } else { | ||
99 | var suffix = rule.selectorSuffix || ''; | ||
100 | |||
101 | ///// TODO: remove when we find out what to do with competing animations | ||
102 | if(rule.styles['-webkit-animation-name'] && animationNames.length) { | ||
103 | rule.styles['-webkit-animation-name'] += ',' + animationNames.join(','); | ||
104 | } | ||
105 | |||
106 | rules.push(stylesController.addRule('.'+selectorBase + suffix, rule.styles)); | ||
107 | } | ||
108 | }, this); | ||
109 | |||
110 | } | ||
111 | }, | ||
112 | |||
113 | stringifyKeys : { | ||
114 | value: function(keysArray) { | ||
115 | var keysString = ''; | ||
116 | |||
117 | keysArray.forEach(function(key) { | ||
118 | var styles = '', style; | ||
119 | |||
120 | for(style in key.styles) { | ||
121 | styles += style + ':' + key.styles[style] + '; '; | ||
122 | } | ||
123 | |||
124 | keysString += key.keyText + ' {' + styles + ' }'; | ||
125 | }); | ||
126 | |||
127 | return keysString; | ||
128 | } | ||
129 | } | ||
130 | }); \ No newline at end of file | ||