diff options
Diffstat (limited to 'js')
-rw-r--r-- | js/controllers/presets-controller.js | 108 | ||||
-rwxr-xr-x | js/document/templates/montage-html/default_html.css | 4 | ||||
-rwxr-xr-x | js/ninja.reel/ninja.html | 6 | ||||
-rw-r--r-- | js/panels/presets/animations-presets.reel/animations-presets.js | 47 | ||||
-rw-r--r-- | js/panels/presets/default-animation-presets.js | 2 | ||||
-rw-r--r-- | js/panels/presets/default-style-presets.js | 11 | ||||
-rw-r--r-- | js/panels/presets/default-transition-presets.js | 8 | ||||
-rw-r--r-- | js/panels/presets/style-presets.reel/style-presets.js | 49 | ||||
-rw-r--r-- | js/panels/presets/transitions-presets.reel/transitions-presets.js | 20 | ||||
-rwxr-xr-x | js/tools/TextTool.js | 5 |
10 files changed, 130 insertions, 130 deletions
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 @@ | |||
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 | element.classList.add(this.transitionClass); | ||
24 | element.addEventListener("webkitTransitionEnd", this, true); | ||
25 | } | ||
26 | }, | ||
27 | |||
28 | captureWebkitTransitionEnd : { | ||
29 | value : function(e) { | ||
30 | var el = e.target; | ||
31 | el.classList.remove(this.transitionClass); | ||
32 | el.removeEventListener("webkitTransitionEnd", this, true); | ||
33 | } | ||
34 | }, | ||
35 | |||
36 | applyPreset : { | ||
37 | value: function(presetData, useTransition) { | ||
38 | var selection = this.application.ninja.selectedElements; | ||
39 | |||
40 | if(!selection || !selection.length || selection.length === 0) { return false; } | ||
41 | |||
42 | var stylesController = this.application.ninja.stylesController, | ||
43 | selectorBase = presetData.selectorBase, | ||
44 | rules = []; | ||
45 | |||
46 | selectorBase = stylesController.generateClassName(selectorBase); | ||
47 | |||
48 | presetData.rules.forEach(function(rule, i) { | ||
49 | ///// Treat keyframed rules differently | ||
50 | if(rule.isKeyFrameRule) { | ||
51 | this.application.ninja.stylesController.addRule( | ||
52 | '@-webkit-keyframes ' + presetData.selectorBase, | ||
53 | this.stringifyKeys(rule.keys) | ||
54 | ); | ||
55 | } else { | ||
56 | var suffix = rule.selectorSuffix || ''; | ||
57 | rules.push(stylesController.addRule('.'+selectorBase + suffix, rule.styles)); | ||
58 | } | ||
59 | }, this); | ||
60 | |||
61 | selection.forEach(function(element) { | ||
62 | var el = element._element; | ||
63 | |||
64 | if(useTransition) { | ||
65 | this.addTransition(el); | ||
66 | } | ||
67 | |||
68 | el.classList.add(selectorBase); | ||
69 | |||
70 | //// Keep track of elements with presets and don't add duplicates | ||
71 | this.setCachedPreset(el, presetData.id, rules); | ||
72 | |||
73 | }, this); | ||
74 | |||
75 | } | ||
76 | }, | ||
77 | |||
78 | setCachedPreset : { | ||
79 | value: function(el, presetId, rules) { | ||
80 | |||
81 | } | ||
82 | }, | ||
83 | |||
84 | getPresets : { | ||
85 | value: function(element) { | ||
86 | |||
87 | } | ||
88 | |||
89 | }, | ||
90 | |||
91 | stringifyKeys : { | ||
92 | value: function(keysArray) { | ||
93 | var keysString = ''; | ||
94 | |||
95 | keysArray.forEach(function(key) { | ||
96 | var styles = '', style; | ||
97 | |||
98 | for(style in key.styles) { | ||
99 | styles += style + ':' + key.styles[style] + '; '; | ||
100 | } | ||
101 | |||
102 | keysString += key.keyText + ' {' + styles + ' }'; | ||
103 | }); | ||
104 | |||
105 | return keysString; | ||
106 | } | ||
107 | } | ||
108 | }); \ No newline at end of file | ||
diff --git a/js/document/templates/montage-html/default_html.css b/js/document/templates/montage-html/default_html.css index 68300edf..6c2b415f 100755 --- a/js/document/templates/montage-html/default_html.css +++ b/js/document/templates/montage-html/default_html.css | |||
@@ -72,4 +72,8 @@ body | |||
72 | 72 | ||
73 | .elem-red-outline { | 73 | .elem-red-outline { |
74 | outline: red solid thin; | 74 | outline: red solid thin; |
75 | } | ||
76 | |||
77 | .nj-preset-transition { | ||
78 | -webkit-transition: all 450ms linear !important; | ||
75 | } \ No newline at end of file | 79 | } \ No newline at end of file |
diff --git a/js/ninja.reel/ninja.html b/js/ninja.reel/ninja.html index 7b5a6e52..ead7f576 100755 --- a/js/ninja.reel/ninja.html +++ b/js/ninja.reel/ninja.html | |||
@@ -316,6 +316,11 @@ | |||
316 | "name": "StylesController" | 316 | "name": "StylesController" |
317 | }, | 317 | }, |
318 | 318 | ||
319 | "presetsController": { | ||
320 | "module": "js/controllers/presets-controller", | ||
321 | "name": "PresetsController" | ||
322 | }, | ||
323 | |||
319 | "filePickerController": { | 324 | "filePickerController": { |
320 | "module": "js/io/ui/file-picker/file-picker-controller", | 325 | "module": "js/io/ui/file-picker/file-picker-controller", |
321 | "name": "FilePickerController" | 326 | "name": "FilePickerController" |
@@ -364,6 +369,7 @@ | |||
364 | "popupManager": {"@": "popupManager1"}, | 369 | "popupManager": {"@": "popupManager1"}, |
365 | "colorController": {"@": "colorController1"}, | 370 | "colorController": {"@": "colorController1"}, |
366 | "stylesController": {"@": "stylesController"}, | 371 | "stylesController": {"@": "stylesController"}, |
372 | "presetsController": {"@": "presetsController"}, | ||
367 | "filePickerController": {"@": "filePickerController"}, | 373 | "filePickerController": {"@": "filePickerController"}, |
368 | "newFileController": {"@": "newFileController"}, | 374 | "newFileController": {"@": "newFileController"}, |
369 | "coreIoApi": {"@": "coreIoApi1"}, | 375 | "coreIoApi": {"@": "coreIoApi1"}, |
diff --git a/js/panels/presets/animations-presets.reel/animations-presets.js b/js/panels/presets/animations-presets.reel/animations-presets.js index ab200212..6a16da54 100644 --- a/js/panels/presets/animations-presets.reel/animations-presets.js +++ b/js/panels/presets/animations-presets.reel/animations-presets.js | |||
@@ -22,52 +22,7 @@ exports.AnimationsLibrary = Montage.create(Component, { | |||
22 | }, | 22 | }, |
23 | handleNodeActivation: { | 23 | handleNodeActivation: { |
24 | value: function(presetData) { | 24 | value: function(presetData) { |
25 | //debugger; | 25 | this.application.ninja.presetsController.applyPreset(presetData); |
26 | var selection = this.application.ninja.selectedElements, | ||
27 | stylesController = this.application.ninja.stylesController, | ||
28 | selectorBase = presetData.selectorBase, | ||
29 | self = this; | ||
30 | |||
31 | if(!selection || !selection.length || selection.length === 0) { | ||
32 | return false; | ||
33 | } | ||
34 | |||
35 | selectorBase = stylesController.generateClassName(selectorBase); | ||
36 | |||
37 | presetData.rules.forEach(function(rule) { | ||
38 | if(rule.isKeyFrameRule) { | ||
39 | this.application.ninja.stylesController.addRule( | ||
40 | '@-webkit-keyframes ' + presetData.selectorBase, | ||
41 | this.stringifyKeys(rule.keys) | ||
42 | ); | ||
43 | } else { | ||
44 | this.application.ninja.stylesController.addRule('.' + selectorBase + rule.selectorSuffix, rule.styles); | ||
45 | } | ||
46 | |||
47 | }, this); | ||
48 | |||
49 | selection.forEach(function(el) { | ||
50 | el._element.classList.add(selectorBase); | ||
51 | }, this); | ||
52 | |||
53 | } | ||
54 | }, | ||
55 | |||
56 | stringifyKeys : { | ||
57 | value: function(keysArray) { | ||
58 | var keysString = ''; | ||
59 | |||
60 | keysArray.forEach(function(key) { | ||
61 | var styles = '', style; | ||
62 | |||
63 | for(style in key.styles) { | ||
64 | styles += style + ':' + key.styles[style] + '; '; | ||
65 | } | ||
66 | |||
67 | keysString += key.keyText + ' {' + styles + ' }'; | ||
68 | }); | ||
69 | |||
70 | return keysString; | ||
71 | } | 26 | } |
72 | } | 27 | } |
73 | }); | 28 | }); |
diff --git a/js/panels/presets/default-animation-presets.js b/js/panels/presets/default-animation-presets.js index 64f91ea6..b12a94b2 100644 --- a/js/panels/presets/default-animation-presets.js +++ b/js/panels/presets/default-animation-presets.js | |||
@@ -13,7 +13,6 @@ exports.animationPresets = { | |||
13 | "text": "Border Morph", | 13 | "text": "Border Morph", |
14 | "selectorBase" : "border-morph", | 14 | "selectorBase" : "border-morph", |
15 | "rules" : [{ | 15 | "rules" : [{ |
16 | "selectorSuffix" : "", | ||
17 | <