diff options
author | Ananya Sen | 2012-05-31 10:13:40 -0700 |
---|---|---|
committer | Ananya Sen | 2012-05-31 10:13:40 -0700 |
commit | 286457b4f23974277274ba388afd283e8aa085cb (patch) | |
tree | c21bf791e7c4f572d12f97987ea6b89e74da67fe /js/panels/css-panel/styles-view-container.reel/styles-view-container.js | |
parent | 4d9b481c58090e8f1fc7b0e9d73a81b0f49cccc8 (diff) | |
parent | d49c909cff7f0c5e5d0b127ad84a2fefc6677dc6 (diff) | |
download | ninja-286457b4f23974277274ba388afd283e8aa085cb.tar.gz |
Merge branch 'refs/heads/ninja-internal-master' into cut-copy-paste
Conflicts:
js/controllers/styles-controller.js
Signed-off-by: Ananya Sen <Ananya.Sen@motorola.com>
Diffstat (limited to 'js/panels/css-panel/styles-view-container.reel/styles-view-container.js')
-rw-r--r-- | js/panels/css-panel/styles-view-container.reel/styles-view-container.js | 184 |
1 files changed, 184 insertions, 0 deletions
diff --git a/js/panels/css-panel/styles-view-container.reel/styles-view-container.js b/js/panels/css-panel/styles-view-container.reel/styles-view-container.js new file mode 100644 index 00000000..4a391421 --- /dev/null +++ b/js/panels/css-panel/styles-view-container.reel/styles-view-container.js | |||
@@ -0,0 +1,184 @@ | |||
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 | var Montage = require("montage/core/core").Montage, | ||
8 | Component = require("montage/ui/component").Component; | ||
9 | |||
10 | exports.StylesViewContainer = Montage.create(Component, { | ||
11 | contentController : { | ||
12 | value: null | ||
13 | }, | ||
14 | contentPanel : { | ||
15 | value: 'rules' | ||
16 | }, | ||
17 | _selectionNameLabelText : { | ||
18 | value: null | ||
19 | }, | ||
20 | selectionNameLabelText : { | ||
21 | get: function() { | ||
22 | return this._selectionNameLabelText; | ||
23 | }, | ||
24 | set: function(value) { | ||
25 | if(value === this._selectionNameLabelText) { return false; } | ||
26 | |||
27 | this._selectionNameLabelText = value; | ||
28 | |||
29 | this.needsDraw = true; | ||
30 | } | ||
31 | }, | ||
32 | _prevSelection : { | ||
33 | value: null | ||
34 | }, | ||
35 | prevSelection : { | ||
36 | get: function() { | ||
37 | return this._prevSelection; | ||
38 | }, | ||
39 | set: function(value) { | ||
40 | this._prevSelection = value; | ||
41 | } | ||
42 | }, | ||
43 | _hasStyles : { | ||
44 | value: false | ||
45 | }, | ||
46 | hasStyles : { | ||
47 | get: function() { | ||
48 | return this._hasStyles; | ||
49 | }, | ||
50 | set: function(hasThem) { | ||
51 | this._hasStyles = hasThem; | ||
52 | //caller needs to set ndt | ||
53 | //this.needsDraw = true; | ||
54 | } | ||
55 | }, | ||
56 | |||
57 | _getElementLabel : { | ||
58 | value: function(el) { | ||
59 | var id = '#'+el.id, | ||
60 | className = '.'+Array.prototype.slice.call(el.classList).join('.'), | ||
61 | nodeName = el.nodeName; | ||
62 | |||
63 | if(id.length > 1) { | ||
64 | return nodeName + id; | ||
65 | } else if(className.length > 1) { | ||
66 | return nodeName + className; | ||
67 | } | ||
68 | |||
69 | return nodeName; | ||
70 | } | ||
71 | }, | ||
72 | |||
73 | templateDidLoad : { | ||
74 | value: function() { | ||
75 | this.eventManager.addEventListener('styleSheetsReady', this, false); | ||
76 | this.eventManager.addEventListener('elementChange', this, false); | ||
77 | this.eventManager.addEventListener("closeDocument", this, false); | ||
78 | } | ||
79 | }, | ||
80 | handleStyleSheetsReady: { | ||
81 | value: function(e) { | ||
82 | this.eventManager.addEventListener( "selectionChange", this, false); | ||
83 | } | ||
84 | }, | ||
85 | _copy : { | ||
86 | value: function(array) { | ||
87 | return array.map(function(item) { return item; }); | ||
88 | } | ||
89 | }, | ||
90 | handleSelectionChange: { | ||
91 | value: function() { | ||
92 | var elements = this.application.ninja.selectedElements, | ||
93 | elementsCopy = this._copy(elements); | ||
94 | |||
95 | ///// Is selection identical? If so, do nothing. | ||
96 | if(this._isSameArray(elements, this.prevSelection) && this.contentPanel === "rules") { | ||
97 | return false; | ||
98 | } | ||
99 | |||
100 | // TODO: should selection always create new array | ||
101 | // TODO: pushing to selection array makes prevSelection | ||
102 | // TODO: invalid | ||
103 | this.prevSelection = elementsCopy; | ||
104 | |||
105 | if(elements.length === 0) { | ||
106 | this.hasStyles = false; | ||
107 | this.needsDraw = true; | ||
108 | return false; | ||
109 | } else if(elements.length === 1) { | ||
110 | |||
111 | ///// update the selection status label with the label of the element | ||
112 | this.selectionNameLabelText = this._getElementLabel(elements[0]); | ||
113 | |||
114 | if(this.contentPanel === "rules") { | ||
115 | this.ruleListContainer.displayListForSelection(elementsCopy); | ||
116 | } else { | ||
117 | this.computedStyleView.declaration = elements[0]; | ||
118 | } | ||
119 | this.toolbar.showButton('computed'); | ||
120 | } else { | ||
121 | this.toolbar.hideButton('computed'); | ||
122 | this.contentPanel = "rules"; | ||
123 | this.selectionNameLabelText = elements.length + " elements selected."; | ||
124 | ///// find common rules | ||
125 | this.ruleListContainer.displayListForSelection(elementsCopy); | ||
126 | |||
127 | } | ||
128 | |||
129 | this.hasStyles = true; | ||
130 | } | ||
131 | }, | ||
132 | handleElementChange : { | ||
133 | value: function(e) { | ||
134 | var elements = this.application.ninja.selectedElements; | ||
135 | |||
136 | if(elements.length === 0) { | ||
137 | return false; | ||
138 | } else if(elements.length === 1) { | ||
139 | if(this.contentPanel === "rules") { | ||
140 | if(e._event.detail.type !== 'cssChange') { | ||
141 | this.ruleListContainer.update(); | ||
142 | } | ||
143 | } else { | ||
144 | this.computedStyleView.declaration = elements[0]; | ||
145 | } | ||
146 | } else { | ||
147 | return false; | ||
148 | } | ||
149 | |||
150 | } | ||
151 | }, | ||
152 | |||
153 | handleCloseDocument: { | ||
154 | value: function(e) { | ||
155 | this.hasStyles = false; | ||
156 | this.needsDraw = true; | ||
157 | } | ||
158 | }, | ||
159 | |||
160 | draw : { | ||
161 | value: function() { | ||
162 | if(this.hasStyles) { | ||
163 | this.element.classList.remove('no-styles'); | ||
164 | //this.selectionNameLabel.classList.remove('no-styles'); | ||
165 | this.selectionName.element.classList.remove('no-styles'); | ||
166 | } else { | ||
167 | this.element.classList.add('no-styles'); | ||
168 | //this.selectionNameLabel.classList.add('no-styles'); | ||
169 | this.selectionName.element.classList.add('no-styles'); | ||
170 | } | ||
171 | } | ||
172 | }, | ||
173 | |||
174 | _isSameArray : { | ||
175 | value: function(left, right) { | ||
176 | if(!left || !right) { return false; } | ||
177 | if(left.length !== right.length) { return false; } | ||
178 | |||
179 | return left.every(function(item, i) { | ||
180 | return item === right[i]; | ||
181 | }); | ||
182 | } | ||
183 | } | ||
184 | }); \ No newline at end of file | ||