aboutsummaryrefslogtreecommitdiff
path: root/js/panels/css-panel/rule-list-container.reel/rule-list-container.js
diff options
context:
space:
mode:
authorArmen Kesablyan2012-05-23 14:34:58 -0700
committerArmen Kesablyan2012-05-23 14:34:58 -0700
commitc21db7f1e4a0582777bdb5366df5d023a915b779 (patch)
treec4d29cb4686101d4a480ae836d20187879cf5400 /js/panels/css-panel/rule-list-container.reel/rule-list-container.js
parent3ed95247e9ea4b0a7833401ed6809647b7c4acbf (diff)
parent1a7e347810401e6262d9d7bad1c3583e6773993b (diff)
downloadninja-c21db7f1e4a0582777bdb5366df5d023a915b779.tar.gz
Merge branch 'refs/heads/dom-architecture' into binding
Conflicts: js/data/panels-data.js Signed-off-by: Armen Kesablyan <armen@motorola.com>
Diffstat (limited to 'js/panels/css-panel/rule-list-container.reel/rule-list-container.js')
-rw-r--r--js/panels/css-panel/rule-list-container.reel/rule-list-container.js185
1 files changed, 185 insertions, 0 deletions
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
new file mode 100644
index 00000000..e2e269ba
--- /dev/null
+++ b/js/panels/css-panel/rule-list-container.reel/rule-list-container.js
@@ -0,0 +1,185 @@
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
7var Montage = require("montage/core/core").Montage,
8 Component = require("montage/ui/component").Component;
9
10exports.RuleListContainer = Montage.create(Component, {
11 _instanceToAdd : { value: null },
12 _appendElement : { value: null },
13 _lastDisplayedList : { value: null },
14 ruleListDrawn : { value: null },
15
16 _displayedList : { value: null },
17 displayedList : {
18 get: function() {
19 return this._displayedList;
20 },
21 set: function(list) {
22 this._lastDisplayedList = this._displayedList;
23 this._displayedList = list;
24 this.needsDraw = true;
25 }
26 },
27
28 displayListForSelection : {
29 value: function(selection) {
30 var list = this._getListForSelection(selection);
31
32 if(!list) {
33 list = this.add(selection);
34 }
35
36 this.displayedList = list;
37 }
38 },
39
40 //// Get the element containing list based on selection
41 _getListForSelection : {
42 value: function(selection) {
43 var i, list, matchesAll;
44
45 for(i = 0; i<this.ruleLists.length; i++) {
46 list = this.ruleLists[i];
47
48 if(selection.length > 1) {
49 matchesAll = selection.every(function(element, index, array) {
50 return list.selection.indexOf(element) !== -1;
51 });
52
53 if(matchesAll) {
54 break;
55 }
56 } else {
57 ///// Selection (single element or stylesheet) is the same,
58 ///// Use the existing rule list
59 if(list.selection[0] === selection[0]) {
60 break;
61 }
62 }
63
64 list = null;
65 }
66
67 return list;
68
69 }
70 },
71
72 //// Creates a new rule list to be added to the container
73 add : {
74 value: function(selection) {
75 var stylesController = this.application.ninja.stylesController,
76 instance = Montage.create(this.ruleListComponent),
77 container = document.createElement('div'),
78 rules, ruleListLog;
79
80 rules = this.getRulesForSelection(selection);
81 instance.rules = rules;
82
83 ruleListLog = {
84 selection: selection,
85 component : instance
86 };
87
88 this.ruleLists.push(ruleListLog);
89
90 this.ruleListsToDraw.push({
91 element : container,
92 component : instance
93 });
94
95 this.needsDraw = true;
96
97 return ruleListLog;
98 }
99 },
100
101 ruleListsToDraw : {
102 value: []
103 },
104
105 getRulesForSelection : {
106 value: function(selection) {
107 var rules;
108
109 if(selection.length > 1) {
110 rules = this.stylesController.getCommonRules(selection);
111 } else if(selection.length === 1) {
112 rules = this.stylesController.getMatchingRules(selection[0]);
113
114 ///// Add inline style to rule list
115 rules.splice(0, 0, {
116 type : 'inline',
117 selectorText : 'element.style',
118 parentStyleSheet : 'Inline Style',
119 style : selection[0].style
120 });
121
122 }
123
124 return rules;
125 }
126 },
127
128 update : {
129 value: function() {
130 this.displayedList.component.rules = this.getRulesForSelection(this.displayedList.selection);
131 }
132 },
133
134 //// Array of lists that have been added to the container
135 //// Lists include selection type (element/stylesheet), and
136 //// the selection itself
137 ruleLists : {
138 value: [],
139 distinct: true
140 },
141
142 templateDidLoad : {
143 value: function() {
144 if(this.focusDelegate) {
145 this.ruleListComponent.focusDelegate = this.focusDelegate;
146 }
147 this.stylesController = this.application.ninja.stylesController;
148 }
149 },
150
151 willDraw : {
152 value: function() {
153 //// hide all rule lists
154 this.ruleLists.forEach(function(ruleListDescriptor) {
155 ruleListDescriptor.component.hide = true;
156 });
157
158 if(this.displayedList) {
159 this.displayedList.component.hide = false;
160 }
161 }
162 },
163
164 draw : {
165 value: function() {
166 this.ruleListsToDraw.forEach(function(ruleListDescriptor) {
167 this.element.appendChild(ruleListDescriptor.element);
168 ruleListDescriptor.component.element = ruleListDescriptor.element;
169 ruleListDescriptor.component.needsDraw = true;
170 }, this);
171 this.ruleListsToDraw.length = 0;
172 }
173
174 },
175
176 didDraw: {
177 value: function() {
178 if(this.ruleListDrawn === true) {
179 var stylesView = this.parentComponent.parentComponent;
180 stylesView.needsDraw = stylesView.hasStyles = true;
181 }
182
183 }
184 }
185}); \ No newline at end of file