aboutsummaryrefslogtreecommitdiff
path: root/js/panels/css-panel/style-sheets-view.reel/style-sheets-view.js
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/css-panel/style-sheets-view.reel/style-sheets-view.js')
-rw-r--r--js/panels/css-panel/style-sheets-view.reel/style-sheets-view.js178
1 files changed, 178 insertions, 0 deletions
diff --git a/js/panels/css-panel/style-sheets-view.reel/style-sheets-view.js b/js/panels/css-panel/style-sheets-view.reel/style-sheets-view.js
new file mode 100644
index 00000000..b2d2c0fb
--- /dev/null
+++ b/js/panels/css-panel/style-sheets-view.reel/style-sheets-view.js
@@ -0,0 +1,178 @@
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.StyleSheetsView = Montage.create(Component, {
11 noDocumentCondition : { value: true },
12 showToolbar : { value: false },
13 stylesController : { value: null },
14 styleSheets : { value: [] },
15 _initView : { value: false },
16 _needsScroll : { value: false },
17 documentNameLabel : { value: null },
18 noDocumentLabelClass : { value: "no-document" },
19
20 _documentName : { value: null },
21 documentName : {
22 get: function() {
23 return this._documentName;
24 },
25 set: function(label) {
26 if(label === this._documentName) { return false; }
27
28 this._documentName = label;
29 this.needsDraw = true;
30 }
31 },
32 _defaultStyleSheet: { value: null },
33 defaultStyleSheet: {
34 get: function() {
35 return this._defaultStyleSheet;
36 },
37 set: function(sheet) {
38 if(sheet === this._defaultStyleSheet) { return false; }
39
40 var sheetComponent, oldDefaultSheet;
41
42 if(this.styleSheetList) {
43 sheetComponent = this.styleSheetList.childComponents[this.styleSheets.indexOf(sheet)];
44 sheetComponent.default = true;
45 if(this._defaultStyleSheet) {
46 oldDefaultSheet = this.styleSheetList.childComponents[this.styleSheets.indexOf(this._defaultStyleSheet)];
47 oldDefaultSheet.default = false;
48 }
49 }
50
51 this._defaultStyleSheet = sheet;
52 this.needsDraw = true;
53 }
54 },
55
56 /// Toolbar Button Actions
57 /// --------------------------------
58
59 ///// Add rule button action
60 handleAddAction : {
61 value: function(e) {
62 this.stylesController.createStylesheet();
63 this.needsDraw = this._needsScroll = true;
64
65 }
66 },
67
68 /// App event handlers
69 /// --------------------------------
70
71 handleStyleSheetsReady : {
72 value: function(e) {
73 this.documentName = this.stylesController.activeDocument.name;
74 this.styleSheets = this.stylesController.userStyleSheets;
75
76 Object.defineBinding(this, 'defaultStyleSheet', {
77 'boundObject': this.stylesController,
78 'boundObjectPropertyPath': 'defaultStylesheet',
79 'oneway': false
80 });
81
82 this._initView = this.needsDraw = true;
83 }
84 },
85
86 /// Draw cycle
87 /// --------------------------------
88
89 templateDidLoad : {
90 value: function() {
91 this.stylesController = this.application.ninja.stylesController;
92 }
93 },
94 prepareForDraw : {
95 value: function() {
96 this.eventManager.addEventListener("styleSheetsReady", this, false);
97 }
98 },
99 draw : {
100 value: function() {
101 if(this._initView) {
102 this.noDocumentCondition = false;
103 this.showToolbar = true;
104 this._initView = false;
105 }
106
107 if(this.height) {
108 this.styleSheetList.element.style.height = (this.height + this._resizedHeight) + "px";
109 }
110
111 if(this.documentName && this.documentNameLabel) {
112 this.documentNameLabel.innerHTML = this.documentName;
113 this.documentNameLabel.classList.remove(this.noDocumentLabelClass);
114 } else {
115 this.documentNameLabel.classList.add(this.noDocumentLabelClass);
116 }
117
118 if(this._needsScroll) {
119
120 setTimeout(function() {
121 console.log('setting scroll top to:', this.styleSheetList.element.scrollHeight);
122 //debugger;
123 this.styleSheetList.element.scrollTop = this.styleSheetList.element.scrollHeight;
124 }.bind(this), 50);
125
126 this._needsScroll = false;
127 }
128 }
129 },
130 didDraw: {
131 value: function() {
132 if(!this.isResizing) {
133 this.height = this.styleSheetList.element.offsetHeight;
134 }
135 }
136 },
137
138
139 /// Resize properties
140 /// --------------------------------
141
142 _resizedHeight : { value: null },
143 isResizing : { value: null },
144 _height : { value: null },
145 height: {
146 get: function() {
147 return this._height;
148 },
149 set: function(val) {
150 if(this._height !== val) {
151 this._height = val;
152 this.needsDraw = true;
153 }
154 }
155 },
156 handleResizeStart: {
157 value:function(e) {
158 this.isResizing = true;
159 this.needsDraw = true;
160 }
161 },
162
163 handleResizeMove: {
164 value:function(e) {
165 this._resizedHeight = e._event.dY;
166 this.needsDraw = true;
167 }
168 },
169
170 handleResizeEnd: {
171 value: function(e) {
172 this.height += this._resizedHeight;
173 this._resizedHeight = 0;
174 this.isResizing = false;
175 this.needsDraw = true;
176 }
177 },
178}); \ No newline at end of file