aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--js/panels/css-panel/declaration.reel/declaration.html7
-rw-r--r--js/panels/css-panel/declaration.reel/declaration.js10
-rw-r--r--js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.js8
-rw-r--r--js/panels/css-panel/rule-list-container.reel/rule-list-container.js8
-rw-r--r--js/panels/css-panel/rule-list.reel/rule-list.js9
-rw-r--r--js/panels/css-panel/style-shorthand.reel/style-shorthand.html4
-rw-r--r--js/panels/css-panel/style.reel/style.css22
-rw-r--r--js/panels/css-panel/style.reel/style.html22
-rw-r--r--js/panels/css-panel/style.reel/style.js126
-rw-r--r--js/panels/css-panel/styles-view-container.reel/styles-view-container.html5
-rw-r--r--js/panels/css-panel/styles-view-mediator.js77
11 files changed, 277 insertions, 21 deletions
diff --git a/js/panels/css-panel/declaration.reel/declaration.html b/js/panels/css-panel/declaration.reel/declaration.html
index 79865fed..3a513871 100644
--- a/js/panels/css-panel/declaration.reel/declaration.html
+++ b/js/panels/css-panel/declaration.reel/declaration.html
@@ -14,7 +14,8 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
14 "module" : "js/panels/css-panel/declaration.reel", 14 "module" : "js/panels/css-panel/declaration.reel",
15 "name" : "Declaration", 15 "name" : "Declaration",
16 "properties" : { 16 "properties" : {
17 "element" : {"#" : "container"} 17 "element" : {"#" : "container"},
18 "treeController": {"@": "treeController"}
18 } 19 }
19 }, 20 },
20 "styleShorthand": { 21 "styleShorthand": {
@@ -26,9 +27,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
26 "name": "TreeController", 27 "name": "TreeController",
27 "properties" : { 28 "properties" : {
28 "branchKey" : "properties", 29 "branchKey" : "properties",
29 "labelKey" : "name", 30 "labelKey" : "name"
30
31 "delegate": {"@": "owner" }
32 }, 31 },
33 "bindings": { 32 "bindings": {
34 "content": { 33 "content": {
diff --git a/js/panels/css-panel/declaration.reel/declaration.js b/js/panels/css-panel/declaration.reel/declaration.js
index 55fe0e18..9685510b 100644
--- a/js/panels/css-panel/declaration.reel/declaration.js
+++ b/js/panels/css-panel/declaration.reel/declaration.js
@@ -9,12 +9,16 @@ var Montage = require("montage/core/core").Montage,
9 ShorthandProps = require("js/panels/CSSPanel/css-shorthand-map"); 9 ShorthandProps = require("js/panels/CSSPanel/css-shorthand-map");
10 10
11exports.Declaration = Montage.create(Component, { 11exports.Declaration = Montage.create(Component, {
12 focusDelegate : {
13 value: null
14 },
12 includeEmptyStyle : { 15 includeEmptyStyle : {
13 value: true 16 value: true
14 }, 17 },
15 templateDidLoad : { 18 templateDidLoad : {
16 value: function() { 19 value: function() {
17 console.log("declaration - template did load"); 20 console.log("declaration - template did load");
21 this.treeController.delegate = this.focusDelegate || this;
18 } 22 }
19 }, 23 },
20 prepareForDraw : { 24 prepareForDraw : {
@@ -115,6 +119,12 @@ exports.Declaration = Montage.create(Component, {
115 distinct: true 119 distinct: true
116 }, 120 },
117 121
122 addNewStyle : {
123 value: function() {
124 debugger;
125 }
126 },
127
118 /* drag/drop events */ 128 /* drag/drop events */
119 handleDrop : { 129 handleDrop : {
120 value: function(e) { 130 value: function(e) {
diff --git a/js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.js b/js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.js
index dd51565a..d85b5797 100644
--- a/js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.js
+++ b/js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.js
@@ -14,6 +14,10 @@ exports.CssStyleRule = Montage.create(Component, {
14 hasTemplate: { 14 hasTemplate: {
15 value: true 15 value: true
16 }, 16 },
17 focusDelegate : {
18 value: null
19 },
20
17 _rule : { 21 _rule : {
18 value : null 22 value : null
19 }, 23 },
@@ -67,6 +71,10 @@ exports.CssStyleRule = Montage.create(Component, {
67 if(this._declaration) { 71 if(this._declaration) {
68 this.declarationComponent.declaration = this._declaration; 72 this.declarationComponent.declaration = this._declaration;
69 } 73 }
74
75 if(this.focusDelegate) {
76 this.declarationComponent.focusDelegate = this.focusDelegate;
77 }
70 } 78 }
71 }, 79 },
72 prepareForDraw : { 80 prepareForDraw : {
diff --git a/js/panels/css-panel/rule-list-container.reel/rule-list-container.js b/js/panels/css-panel/rule-list-container.reel/rule-list-container.js
index 4bad8350..a059af12 100644
--- a/js/panels/css-panel/rule-list-container.reel/rule-list-container.js
+++ b/js/panels/css-panel/rule-list-container.reel/rule-list-container.js
@@ -116,6 +116,14 @@ exports.RuleListContainer = Montage.create(Component, {
116 distinct: true 116 distinct: true
117 }, 117 },
118 118
119 templateDidLoad : {
120 value: function() {
121 if(this.focusDelegate) {
122 this.ruleListComponent.focusDelegate = this.focusDelegate;
123 }
124 }
125 },
126
119 draw : { 127 draw : {
120 value: function() { 128 value: function() {
121 if(this._appendElement) { 129 if(this._appendElement) {
diff --git a/js/panels/css-panel/rule-list.reel/rule-list.js b/js/panels/css-panel/rule-list.reel/rule-list.js
index ebd7428b..0faff07e 100644
--- a/js/panels/css-panel/rule-list.reel/rule-list.js
+++ b/js/panels/css-panel/rule-list.reel/rule-list.js
@@ -8,7 +8,9 @@ var Montage = require("montage/core/core").Montage,
8 Component = require("montage/ui/component").Component; 8 Component = require("montage/ui/component").Component;
9 9
10exports.RuleList = Montage.create(Component, { 10exports.RuleList = Montage.create(Component, {
11 11 focusDelegate : {
12 value: null
13 },
12 ruleNodeName : { value: 'li' }, 14 ruleNodeName : { value: 'li' },
13 15
14 _rules: { value: null }, 16 _rules: { value: null },
@@ -59,6 +61,11 @@ exports.RuleList = Montage.create(Component, {
59 if(componentBase) { 61 if(componentBase) {
60 instance = Montage.create(componentBase); 62 instance = Montage.create(componentBase);
61 instance.rule = rule; 63 instance.rule = rule;
64
65 if(this.focusDelegate) {
66 instance.focusDelegate = this.focusDelegate;
67 }
68
62 this.rulesToDraw.push(instance); 69 this.rulesToDraw.push(instance);
63 this.needsDraw = true; 70 this.needsDraw = true;
64 } 71 }
diff --git a/js/panels/css-panel/style-shorthand.reel/style-shorthand.html b/js/panels/css-panel/style-shorthand.reel/style-shorthand.html
index 243d9cc7..0311798b 100644
--- a/js/panels/css-panel/style-shorthand.reel/style-shorthand.html
+++ b/js/panels/css-panel/style-shorthand.reel/style-shorthand.html
@@ -19,8 +19,8 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
19 "branchList": {"#" : "branchList"}, 19 "branchList": {"#" : "branchList"},
20 "arrayController": {"@": "arrayController" }, 20 "arrayController": {"@": "arrayController" },
21 "repetition": {"@": "repetition"}, 21 "repetition": {"@": "repetition"},
22 "leafComponent": {"@": "leaf"}, 22 "leafComponent": {"@": "style"},
23 "branchComponent": {"@": "branch"}, 23 "branchComponent": {"@": "shorthand"},
24 "branchCollapser": {"#": "collapser" } 24 "branchCollapser": {"#": "collapser" }
25 } 25 }
26 }, 26 },
diff --git a/js/panels/css-panel/style.reel/style.css b/js/panels/css-panel/style.reel/style.css
index f8750eea..ff410951 100644
--- a/js/panels/css-panel/style.reel/style.css
+++ b/js/panels/css-panel/style.reel/style.css
@@ -11,7 +11,7 @@
11 border-bottom: 1px solid rgba(0,0,0,0); 11 border-bottom: 1px solid rgba(0,0,0,0);
12 cursor: url(/js/../images/tools/hand_down.png), default; 12 cursor: url(/js/../images/tools/hand_down.png), default;
13 display: block; 13 display: block;
14 /*overflow: hidden;*/ 14 overflow: hidden;
15 white-space: nowrap; 15 white-space: nowrap;
16 text-overflow: ellipsis; 16 text-overflow: ellipsis;
17} 17}
@@ -21,6 +21,21 @@
21} 21}
22 22
23/* ------------------------ 23/* ------------------------
24 Invalid Style
25------------------------ */
26.style-item-invalid {
27 background-repeat: no-repeat;
28 background-position: 6px 2px;
29 background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAALCAYAAABGbhwYAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw%2FeHBhY2tldCBiZWdpbj0i77u%2FIiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8%2BIDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYxIDY0LjE0MDk0OSwgMjAxMC8xMi8wNy0xMDo1NzowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNS4xIE1hY2ludG9zaCIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDowMzYyMERFNTQwNzMxMUUxQTREQ0IxQTRGNEI2MTE3RiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDowMzYyMERFNjQwNzMxMUUxQTREQ0IxQTRGNEI2MTE3RiI%2BIDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjAzNjIwREUzNDA3MzExRTFBNERDQjFBNEY0QjYxMTdGIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjAzNjIwREU0NDA3MzExRTFBNERDQjFBNEY0QjYxMTdGIi8%2BIDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY%2BIDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8%2Bc4fwegAAAWpJREFUeNo8kLtLA0EQxr%2B9l3lcDAaCBsEqEOysBFEQsRAsRVCEpBREsbIUSxtBrAxEewsrK8VHQIhK%2FoIUUVJIQFFjYi65XDZ36%2Bz5GFgWZr75fjPDhBD4C%2BucjWgaphjQdTgK%2FfPi5a%2FGpPDtjEVjERyqKlag%2FlY8gHPsfzSwPbQgbDyfIs6vURa3EKK8Jf6jmhUy51yiWDlBUDED2NF0JKGQS3IPVn4ATXqIL0EYJgwD42YQG4quE45EggOtCwbWrUM1Ej%2F0jkXDAYaOtOa6iIH2YSQOBugPj4KN3aFdnIThkprynoeUYjtwIRO0hCLxiU3wp12odgl0AXhUa3VQ0xoWCqEApiNhEpFzt7Tm%2F4Tzo9kGvtq4UjNzqJB1mswURvNoqayP57V7KcB7HfZnE8v%2BHYtZtmiGcBzqQ1TSZUPP85HVlo1MfCaX94WPpSO83qwO6wbWCTtBQocoD70eDgZncw3Z%2BC3AAFMzlxlnnpevAAAAAElFTkSuQmCC);
30 opacity: 0.5;
31}
32.style-item.style-item-invalid:hover input {
33 visibility: hidden;
34}
35.style-item-invalid.edit-style-item {
36 opacity: 1;
37}
38/* ------------------------
24 Checkbox 39