diff options
author | Eric Guzman | 2012-02-15 21:44:01 -0800 |
---|---|---|
committer | Eric Guzman | 2012-02-15 21:44:01 -0800 |
commit | 98b3083849b71155a8cb37d300b216150db0dcb5 (patch) | |
tree | 785836fd020849a25643d2e505f0d1f5c1b9a2a3 /js | |
parent | 20321291a2dd44787a460d956163383cd040314c (diff) | |
download | ninja-98b3083849b71155a8cb37d300b216150db0dcb5.tar.gz |
Presets - Modify application of preset classes for new json structure
Diffstat (limited to 'js')
3 files changed, 43 insertions, 64 deletions
diff --git a/js/panels/presets/style-presets.reel/style-presets.js b/js/panels/presets/style-presets.reel/style-presets.js index 0c44e20c..7871683e 100644 --- a/js/panels/presets/style-presets.reel/style-presets.js +++ b/js/panels/presets/style-presets.reel/style-presets.js | |||
@@ -15,25 +15,17 @@ exports.StylesLibrary = Montage.create(Component, { | |||
15 | presetData : { | 15 | presetData : { |
16 | value : null | 16 | value : null |
17 | }, | 17 | }, |
18 | contentPanel : { | ||
19 | value: "presets" // get from local storage | ||
20 | }, | ||
21 | templateDidLoad : { | 18 | templateDidLoad : { |
22 | value: function() { | 19 | value: function() { |
23 | this.presetData = DefaultPresets; | 20 | this.presetData = DefaultPresets; |
24 | } | 21 | } |
25 | }, | 22 | }, |
26 | treeList : { | ||
27 | value : null | ||
28 | }, | ||
29 | didDraw: { | ||
30 | value : function() { | ||
31 | } | ||
32 | }, | ||
33 | handleNodeActivation: { | 23 | handleNodeActivation: { |
34 | value: function(presetData) { | 24 | value: function(presetData) { |
35 | var selection = this.application.ninja.selectedElements, | 25 | var selection = this.application.ninja.selectedElements, |
36 | self = this; | 26 | stylesController = this.application.ninja.stylesController, |
27 | selectorBase = presetData.selectorBase, | ||
28 | self = this, className; | ||
37 | 29 | ||
38 | if(!selection || !selection.length || selection.length === 0) { | 30 | if(!selection || !selection.length || selection.length === 0) { |
39 | return false; | 31 | return false; |
@@ -46,19 +38,27 @@ exports.StylesLibrary = Montage.create(Component, { | |||
46 | .changeSelector(self.application.ninja.currentDocument.documentRoot, null, selector); | 38 | .changeSelector(self.application.ninja.currentDocument.documentRoot, null, selector); |
47 | } | 39 | } |
48 | 40 | ||
41 | selectorBase = stylesController.generateClassName(selectorBase); | ||
42 | |||
43 | presetData.rules.forEach(function(rule) { | ||
44 | stylesController.addRule('.'+selectorBase + rule.selectorSuffix, rule.styles); | ||
45 | }, this); | ||
46 | |||
49 | selection.forEach(function(el) { | 47 | selection.forEach(function(el) { |
50 | el._element.style.webkitTransition = "all 450ms linear"; | 48 | el._element.style.webkitTransition = "all 450ms linear"; |
51 | 49 | ||
52 | el._element.addEventListener("webkitTransitionEnd", function(e) { | 50 | el._element.addEventListener("webkitTransitionEnd", function(e) { |
53 | console.log("calling transition end"); | 51 | el._element.style.webkitTransition = ''; |
54 | setStopRuleSelector("*"); | 52 | setStopRuleSelector("*"); |
55 | }); | 53 | }, true); |
56 | |||
57 | setStopRuleSelector("transitionStopRule"); | 54 | setStopRuleSelector("transitionStopRule"); |
55 | el._element.classList.add(selectorBase); | ||
56 | |||
57 | //// Keep track of elements with presets and don't add duplicates | ||
58 | 58 | ||
59 | this.application.ninja.stylesController.setElementStyles(el._element, presetData.styles); | ||
60 | }, this); | 59 | }, this); |
61 | 60 | ||
61 | |||
62 | } | 62 | } |
63 | }, | 63 | }, |
64 | handleDragEnd : { | 64 | handleDragEnd : { |
diff --git a/js/panels/presets/transitions-presets.reel/transitions-presets.html b/js/panels/presets/transitions-presets.reel/transitions-presets.html index e3bf0aba..c22ed351 100644 --- a/js/panels/presets/transitions-presets.reel/transitions-presets.html +++ b/js/panels/presets/transitions-presets.reel/transitions-presets.html | |||
@@ -22,7 +22,6 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot | |||
22 | "module": "js/controllers/tree-controller", | 22 | "module": "js/controllers/tree-controller", |
23 | "name": "TreeController", | 23 | "name": "TreeController", |
24 | "properties" : { | 24 | "properties" : { |
25 | "rootKey" : "data", | ||
26 | "branchKey" : "children", | 25 | "branchKey" : "children", |
27 | "labelKey" : "text", | 26 | "labelKey" : "text", |
28 | "delegate": {"@": "owner" } | 27 | "delegate": {"@": "owner" } |
@@ -30,7 +29,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot | |||
30 | "bindings": { | 29 | "bindings": { |
31 | "content": { | 30 | "content": { |
32 | "boundObject": {"@": "owner"}, | 31 | "boundObject": {"@": "owner"}, |
33 | "boundObjectPropertyPath": "data2" | 32 | "boundObjectPropertyPath": "presetData" |
34 | } | 33 | } |
35 | } | 34 | } |
36 | }, | 35 | }, |
@@ -40,7 +39,8 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot | |||
40 | "properties" : { | 39 | "properties" : { |
41 | "element" : {"#": "libraryContainer"}, | 40 | "element" : {"#": "libraryContainer"}, |
42 | "branchComponent" : {"@": "branch" }, | 41 | "branchComponent" : {"@": "branch" }, |
43 | "contentController": {"@": "presetsController"} | 42 | "contentController": {"@": "presetsController"}, |
43 | "showRoot": false | ||
44 | } | 44 | } |
45 | }, | 45 | }, |
46 | "branch" : { | 46 | "branch" : { |
diff --git a/js/panels/presets/transitions-presets.reel/transitions-presets.js b/js/panels/presets/transitions-presets.reel/transitions-presets.js index bc91b3ad..f7d84085 100644 --- a/js/panels/presets/transitions-presets.reel/transitions-presets.js +++ b/js/panels/presets/transitions-presets.reel/transitions-presets.js | |||
@@ -5,63 +5,42 @@ | |||
5 | </copyright> */ | 5 | </copyright> */ |
6 | 6 | ||
7 | var Montage = require("montage/core/core").Montage, | 7 | var Montage = require("montage/core/core").Montage, |
8 | Component = require("montage/ui/component").Component; | 8 | Component = require("montage/ui/component").Component, |
9 | DefaultPresets = require("js/panels/presets/default-transition-presets").transitionPresets; | ||
9 | 10 | ||
10 | exports.TransitionsLibrary = Montage.create(Component, { | 11 | exports.TransitionsLibrary = Montage.create(Component, { |
11 | hasTemplate: { | 12 | hasTemplate: { |
12 | value: true | 13 | value: true |
13 | }, | 14 | }, |
14 | contentPanel : { | 15 | presetData : { |
15 | value: "presets" // get from local storage | 16 | value: null |
16 | }, | 17 | }, |
17 | templateDidLoad : { | 18 | deserializedFromTemplate : { |
18 | value: function() { | 19 | value: function() { |
19 | console.log('deserialized'); | 20 | this.presetData = DefaultPresets; |
20 | } | 21 | } |
21 | }, | 22 | }, |
22 | treeList : { | 23 | handleNodeActivation: { |
23 | value : null | 24 | value: function(presetData) { |
24 | }, | 25 | var selection = this.application.ninja.selectedElements, |
25 | data2: { | 26 | stylesController = this.application.ninja.stylesController, |
26 | value: { | 27 | selectorBase = presetData.selectorBase, |
27 | "meta": "Blah", | 28 | self = this; |
28 | "status": "OK", | ||
29 | "text" : "Root", | ||
30 | "data" : { | ||
31 | "date": "1.1.01", | ||
32 | "text": "Transitions", | ||
33 | "children": [{ | ||
34 | "date": "3.3.01", | ||
35 | "text": "Kid 1" | ||
36 | }, | ||
37 | { | ||
38 | "date": "3.3.01", | ||
39 | "text": "Kid 2", | ||
40 | "children": [{ | ||
41 | "date": "3.4.01", | ||
42 | "text": "Grand Kid 1", | ||
43 | "children": [{ | ||
44 | "date": "4.4.01", | ||
45 | "text": "Great Grand Kid 1" | ||
46 | }] | ||
47 | }] | ||
48 | 29 | ||
49 | },{ | 30 | if(!selection || !selection.length || selection.length === 0) { |
50 | "date": "5.5.01", | 31 | return false; |
51 | "text": "Kid 3" | ||
52 | }] | ||
53 | } | 32 | } |
54 | } | ||
55 | }, | ||
56 | didDraw: { | ||
57 | value : function() { | ||
58 | console.log('Presets Panel prepare for draw.'); | ||
59 | // this.treeList.items.push({ | ||
60 | // label : "Box Style", | ||
61 | // type : 'leaf' | ||
62 | // }); | ||
63 | } | ||
64 | } | ||
65 | 33 | ||
34 | selectorBase = stylesController.generateClassName(selectorBase); | ||
66 | 35 | ||
36 | presetData.rules.forEach(function(rule) { | ||
37 | this.application.ninja.stylesController.addRule('.' + selectorBase + rule.selectorSuffix, rule.styles); | ||
38 | }, this); | ||
39 | |||
40 | selection. |