aboutsummaryrefslogtreecommitdiff
path: root/js/panels/CSSPanel/CSSPanelBase.reel/CSSPanelBase.js
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/CSSPanel/CSSPanelBase.reel/CSSPanelBase.js')
-rwxr-xr-xjs/panels/CSSPanel/CSSPanelBase.reel/CSSPanelBase.js581
1 files changed, 291 insertions, 290 deletions
diff --git a/js/panels/CSSPanel/CSSPanelBase.reel/CSSPanelBase.js b/js/panels/CSSPanel/CSSPanelBase.reel/CSSPanelBase.js
index f593073a..573e165c 100755
--- a/js/panels/CSSPanel/CSSPanelBase.reel/CSSPanelBase.js
+++ b/js/panels/CSSPanel/CSSPanelBase.reel/CSSPanelBase.js
@@ -1,24 +1,25 @@
1/* <copyright> 1/* <copyright>
2Copyright (c) 2012, Motorola Mobility, Inc 2Copyright (c) 2012, Motorola Mobility LLC.
3All Rights Reserved. 3All Rights Reserved.
4BSD License.
5 4
6Redistribution and use in source and binary forms, with or without 5Redistribution and use in source and binary forms, with or without
7modification, are permitted provided that the following conditions are met: 6modification, are permitted provided that the following conditions are met:
8 7
9 - Redistributions of source code must retain the above copyright notice, 8* Redistributions of source code must retain the above copyright notice,
10 this list of conditions and the following disclaimer. 9 this list of conditions and the following disclaimer.
11 - Redistributions in binary form must reproduce the above copyright 10
12 notice, this list of conditions and the following disclaimer in the 11* Redistributions in binary form must reproduce the above copyright notice,
13 documentation and/or other materials provided with the distribution. 12 this list of conditions and the following disclaimer in the documentation
14 - Neither the name of Motorola Mobility nor the names of its contributors 13 and/or other materials provided with the distribution.
15 may be used to endorse or promote products derived from this software 14
16 without specific prior written permission. 15* Neither the name of Motorola Mobility LLC nor the names of its
16 contributors may be used to endorse or promote products derived from this
17 software without specific prior written permission.
17 18
18THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" 19THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
19AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE 20AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
20IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE 21IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
21ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE 22ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE
22LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR 23LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
23CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF 24CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
24SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS 25SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
@@ -71,7 +72,7 @@ var CSSPanel = exports.CSSPanelBase = (require("montage/core/core").Montage).cre
71 72
72 ///// Set up collapsible sub sections 73 ///// Set up collapsible sub sections
73 ['sheets', 'styles'].forEach(function(section) { 74 ['sheets', 'styles'].forEach(function(section) {
74 var s = section; 75 var s = section;
75 self.sections[s].heading.addEventListener('click', function(e) { 76 self.sections[s].heading.addEventListener('click', function(e) {
76 self.toggleSectionCollapse(s); 77 self.toggleSectionCollapse(s);
77 }, false); 78 }, false);
@@ -132,24 +133,24 @@ var CSSPanel = exports.CSSPanelBase = (require("montage/core/core").Montage).cre
132 contEl = sect.container, 133 contEl = sect.container,
133 userDocName = nj.getFileNameFromPath(sect.doc.defaultView.location.href), 134 userDocName = nj.getFileNameFromPath(sect.doc.defaultView.location.href),
134 self = this; 135 self = this;
135 136
136 ///// Set current document name in Stylesheets section header 137 ///// Set current document name in Stylesheets section header
137 nj.empty(sect.docNameEl).appendChild(nj.textNode(' - ' + userDocName)); 138 nj.empty(sect.docNameEl).appendChild(nj.textNode(' - ' + userDocName));
138 139
139 ///// LOOP through stylesheet list 140 ///// LOOP through stylesheet list
140 ///// ------------------------------------------------------- 141 ///// -------------------------------------------------------
141 sheetsArray.forEach(function(sheet, index) { 142 sheetsArray.forEach(function(sheet, index) {
142 var isStageStyleSheet = (sheet.ownerNode.id === this._stageStyleSheetId), 143 var isStageStyleSheet = (sheet.ownerNode.id === this._stageStyleSheetId),
143 isDefaultStyleSheet = (sheet.ownerNode.id === this._defaultStyleSheetId), 144 isDefaultStyleSheet = (sheet.ownerNode.id === this._defaultStyleSheetId),
144 sheetObj; 145 sheetObj;
145 146
146 if(!isStageStyleSheet) { 147 if(!isStageStyleSheet) {
147 sheetObj = new NJStyleSheet(sheet, index); 148 sheetObj = new NJStyleSheet(sheet, index);
148 if(isDefaultStyleSheet) { 149 if(isDefaultStyleSheet) {
149 sheetObj.isProtected = sheetObj.isCurrent = true; 150 sheetObj.isProtected = sheetObj.isCurrent = true;
150 this.currentStyleSheet = this.defaultStyleSheet = sheetObj; 151 this.currentStyleSheet = this.defaultStyleSheet = sheetObj;
151 } 152 }
152 153
153 //// Add Default stylesheet selection 154 //// Add Default stylesheet selection
154 sheetObj.sheetNameEl.addEventListener('click', function(e) { 155 sheetObj.sheetNameEl.addEventListener('click', function(e) {
155 //console.log('clicking sheet'); 156 //console.log('clicking sheet');
@@ -157,27 +158,27 @@ var CSSPanel = exports.CSSPanelBase = (require("montage/core/core").Montage).cre
157 //e.stopPropagation(); 158 //e.stopPropagation();
158 self.currentStyleSheet = sheetObj; 159 self.currentStyleSheet = sheetObj;
159 }, false); 160 }, false);
160 161
161 sheetObj.deleteEl.addEventListener('click', function(e) { 162 sheetObj.deleteEl.addEventListener('click', function(e) {
162 if(sheetObj.isCurrent) { 163 if(sheetObj.isCurrent) {
163 self.defaultStyleSheet.makeCurrent(); 164 self.defaultStyleSheet.makeCurrent();
164 } 165 }
165 }, false); 166 }, false);
166 167
167 sheetObj.render(listEl); 168 sheetObj.render(listEl);
168 } 169 }
169 170
170 171
171 }, this); 172 }, this);
172 ///// ________________________________________________________ 173 ///// ________________________________________________________
173 174
174 ///// save height of content, and convert height from "auto" to pixels 175 ///// save height of content, and convert height from "auto" to pixels
175 //sect.height = contEl.style.height = nj.height(contEl); 176 //sect.height = contEl.style.height = nj.height(contEl);
176 177
177 178
178 179
179 //contEl.style.webkitTransition = 'all 0.15s ease-out'; 180 //contEl.style.webkitTransition = 'all 0.15s ease-out';
180 181
181 } 182 }
182 }, 183 },
183 clearStyleSheetList : { 184 clearStyleSheetList : {
@@ -195,7 +196,7 @@ var CSSPanel = exports.CSSPanelBase = (require("montage/core/core").Montage).cre
195 NJCSSStyle.prototype.onStyleChange.push(function() { 196 NJCSSStyle.prototype.onStyleChange.push(function() {
196 self._stageUpdate(); 197 self._stageUpdate();
197 }); 198 });
198 199
199 ///// Add some NJEditable functionality 200 ///// Add some NJEditable functionality
200 NJEditable.prototype.onStartEdit.push(function(e) { 201 NJEditable.prototype.onStartEdit.push(function(e) {
201 if(this.isSelector && this.el.nodeContent === 'element.style') { 202 if(this.isSelector && this.el.nodeContent === 'element.style') {
@@ -204,7 +205,7 @@ var CSSPanel = exports.CSSPanelBase = (require("montage/core/core").Montage).cre
204 var njStyle = this.el.parentNode.njcssstyle; 205 var njStyle = this.el.parentNode.njcssstyle;
205 // //console.log('added start edit'); 206 // //console.log('added start edit');
206 this.el.parentNode.classList.add('nj-editing'); 207 this.el.parentNode.classList.add('nj-editing');
207 if(this.el.nodeName === "DD") { 208 if(this.el.nodeName === "DD") {
208 this.el.parentNode.classList.add('nj-editing-val'); // controls wrapping of text 209 this.el.parentNode.classList.add('nj-editing-val'); // controls wrapping of text
209 if(cssCompletionMap[njStyle.property]) { 210 if(cssCompletionMap[njStyle.property]) {
210 this.suggestions = cssCompletionMap[njStyle.property]; 211 this.suggestions = cssCompletionMap[njStyle.property];
@@ -240,7 +241,7 @@ var CSSPanel = exports.CSSPanelBase = (require("montage/core/core").Montage).cre
240 } 241 }
241 242
242 ////console.log('NJEditable onStopEdit callback'); 243 ////console.log('NJEditable onStopEdit callback');
243 244
244 if(e && [9,13,186].indexOf(e._event.keyCode) !== -1) { // if the user is tabbing between styles 245 if(e && [9,13,186].indexOf(e._event.keyCode) !== -1) { // if the user is tabbing between styles
245 e.preventDefault(); 246 e.preventDefault();
246 sibling = (e._event.keyCode === 9 && e._event.shiftKey) ? ['previousSibling', 'lastChild'] : ['nextSibling', 'firstChild']; 247 sibling = (e._event.keyCode === 9 && e._event.shiftKey) ? ['previousSibling', 'lastChild'] : ['nextSibling', 'firstChild'];
@@ -250,9 +251,9 @@ var CSSPanel = exports.CSSPanelBase = (require("montage/core/core").Montage).cre
250 if(nextEl[sibling[0]]) { 251 if(nextEl[sibling[0]]) {
251 nextEl = nextEl[sibling[0]]; 252 nextEl = nextEl[sibling[0]];
252 } else { 253 } else {
253 254
254 if(!nextEl.parentNode[sibling[0]]) { // no next style element 255 if(!nextEl.parentNode[sibling[0]]) { // no next style element
255 /// get njcssrule and create add button, 256 /// get njcssrule and create add button,
256 /// and activate it if the new styles isn't dirtied 257 /// and activate it if the new styles isn't dirtied
257 // //console.log('reached the end'); 258 // //console.log('reached the end');
258 njStyle = nextEl.parentNode.njcssstyle; 259 njStyle = nextEl.parentNode.njcssstyle;
@@ -269,8 +270,8 @@ var CSSPanel = exports.CSSPanelBase = (require("montage/core/core").Montage).cre
269 nextEl = false; 270 nextEl = false;
270 break; 271 break;
271 } else { 272 } else {
272 nextEl = (nextEl.parentNode[sibling[0]]) ? 273 nextEl = (nextEl.parentNode[sibling[0]]) ?
273 nextEl.parentNode[sibling[0]][sibling[1]]: 274 nextEl.parentNode[sibling[0]][sibling[1]]:
274 nextEl.parentNode.parentNode[sibling[1]][sibling[1]]; 275 nextEl.parentNode.parentNode[sibling[1]][sibling[1]];
275 } 276 }
276 } 277 }
@@ -299,14 +300,14 @@ var CSSPanel = exports.CSSPanelBase = (require("montage/core/core").Montage).cre
299 } 300 }
300 }