diff options
Diffstat (limited to 'js/panels/Resizer.js')
-rwxr-xr-x | js/panels/Resizer.js | 78 |
1 files changed, 49 insertions, 29 deletions
diff --git a/js/panels/Resizer.js b/js/panels/Resizer.js index 3afe5d5b..60fdde4f 100755 --- a/js/panels/Resizer.js +++ b/js/panels/Resizer.js | |||
@@ -8,11 +8,42 @@ var Montage = require("montage/core/core").Montage; | |||
8 | var Component = require("montage/ui/component").Component; | 8 | var Component = require("montage/ui/component").Component; |
9 | 9 | ||
10 | exports.Resizer = Montage.create(Component, { | 10 | exports.Resizer = Montage.create(Component, { |
11 | 11 | ||
12 | version: { | ||
13 | value: "1.0" | ||
14 | }, | ||
15 | |||
12 | hasTemplate: { | 16 | hasTemplate: { |
13 | value: false | 17 | value: false |
14 | }, | 18 | }, |
15 | 19 | ||
20 | // This property might not be needed anymore. | ||
21 | // TODO - Review this once we the the new panels in place | ||
22 | ownerId: { | ||
23 | value: "" | ||
24 | }, | ||
25 | |||
26 | willSave: { | ||
27 | value: true | ||
28 | }, | ||
29 | |||
30 | _value: { | ||
31 | value: null | ||
32 | }, | ||
33 | |||
34 | value: { | ||
35 | get: function() { | ||
36 | return this._value; | ||
37 | }, | ||
38 | set: function(val) { | ||
39 | this._value = val; | ||
40 | } | ||
41 | }, | ||
42 | |||
43 | redrawStage: { | ||
44 | value:false | ||
45 | }, | ||
46 | |||
16 | _isInversed: { | 47 | _isInversed: { |
17 | value: false | 48 | value: false |
18 | }, | 49 | }, |
@@ -74,7 +105,6 @@ exports.Resizer = Montage.create(Component, { | |||
74 | e.preventDefault(); | 105 | e.preventDefault(); |
75 | this.panel.addEventListener("webkitTransitionEnd", this, true); | 106 | this.panel.addEventListener("webkitTransitionEnd", this, true); |
76 | if (this.isVertical) { | 107 | if (this.isVertical) { |
77 | //console.log("y: " + e.y + " startPosition: " + this._startPosition + " initDimension: " + this._initDimension); | ||
78 | this._startPosition = e.y; | 108 | this._startPosition = e.y; |
79 | this._initDimension = this.panel.offsetHeight; | 109 | this._initDimension = this.panel.offsetHeight; |
80 | } | 110 | } |
@@ -98,7 +128,8 @@ exports.Resizer = Montage.create(Component, { | |||
98 | } else { | 128 | } else { |
99 | this.panel.style.width = ""; | 129 | this.panel.style.width = ""; |
100 | } | 130 | } |
101 | this.application.ninja.settings.setSetting(this.element.id,"value", ""); | 131 | |
132 | this.application.localStorage.setItem(this.element.getAttribute("data-montage-id"), {"version": this.version, "value": ""}); | ||
102 | } | 133 | } |
103 | }, | 134 | }, |
104 | 135 | ||
@@ -113,6 +144,15 @@ exports.Resizer = Montage.create(Component, { | |||
113 | 144 | ||
114 | prepareForDraw: { | 145 | prepareForDraw: { |
115 | value: function() { | 146 | value: function() { |
147 | if(this.willSave) { | ||
148 | var storedData = this.application.localStorage.getItem(this.element.getAttribute("data-montage-id")); | ||
149 | |||
150 | if(storedData && storedData.value) { | ||
151 | this.value = storedData.value; | ||
152 | } | ||
153 | |||
154 | } | ||
155 | |||
116 | if(this.value != null) { | 156 | if(this.value != null) { |
117 | if (this.isVertical) { | 157 | if (this.isVertical) { |
118 | this.panel.style.height = this.value + "px"; | 158 | this.panel.style.height = this.value + "px"; |
@@ -137,15 +177,19 @@ exports.Resizer = Montage.create(Component, { | |||
137 | window.removeEventListener("mousemove", this); | 177 | window.removeEventListener("mousemove", this); |
138 | window.removeEventListener("mouseup", this); | 178 | window.removeEventListener("mouseup", this); |
139 | this.panel.classList.remove("disableTransition"); | 179 | this.panel.classList.remove("disableTransition"); |
180 | |||
140 | if (this.isVertical) { | 181 | if (this.isVertical) { |
141 | this.panel.style.height = this.panel.offsetHeight; | 182 | this.panel.style.height = this.panel.offsetHeight; |
142 | } else { | 183 | } else { |
143 | this.panel.style.width = this.panel.offsetWidth; | 184 | this.panel.style.width = this.panel.offsetWidth; |
144 | } | 185 | } |
145 | this.application.ninja.settings.setSetting(this.element.id,"value", this.value); | 186 | |
187 | this.application.localStorage.setItem(this.element.getAttribute("data-montage-id"), {"version": this.version, "value": this.value}); | ||
188 | |||
146 | if(this.redrawStage) { | 189 | if(this.redrawStage) { |
147 | this.application.ninja.stage.resizeCanvases = true; | 190 | this.application.ninja.stage.resizeCanvases = true; |
148 | } | 191 | } |
192 | |||
149 | NJevent("panelResizedEnd", this) | 193 | NJevent("panelResizedEnd", this) |
150 | } | 194 | } |
151 | }, | 195 | }, |
@@ -154,7 +198,6 @@ exports.Resizer = Montage.create(Component, { | |||
154 | value: function(e) { | 198 | value: function(e) { |
155 | if(this.isVertical) { | 199 | if(this.isVertical) { |
156 | this.value = this._isInversed ? this._initDimension + (this._startPosition - e.y) : this._initDimension + (e.y - this._startPosition); | 200 | this.value = this._isInversed ? this._initDimension + (this._startPosition - e.y) : this._initDimension + (e.y - this._startPosition); |
157 | //console.log("y: " + e.y + " startPosition: " + this._startPosition + " initDimension: " + this._initDimension + " finalPosition: " + pos); | ||
158 | this.panel.style.height = this.value + "px"; | 201 | this.panel.style.height = this.value + "px"; |
159 | } | 202 | } |
160 | else { | 203 | else { |
@@ -172,28 +215,5 @@ exports.Resizer = Montage.create(Component, { | |||
172 | 215 | ||
173 | NJevent("panelResizing", this); | 216 | NJevent("panelResizing", this); |
174 | } | 217 | } |
175 | }, | ||
176 | |||
177 | _value: { | ||
178 | value: null | ||
179 | }, | ||
180 | |||
181 | redrawStage: { | ||
182 | value:false | ||
183 | }, | ||
184 | |||
185 | value: { | ||
186 | get: function() { | ||
187 | if(this.application.ninja.settings) { | ||
188 | var gottenValue = this.application.ninja.settings.getSetting(this.id, "value"); | ||
189 | if (this._value == null && gottenValue !=null) { | ||
190 | this.value = gottenValue; | ||
191 | } | ||
192 | } | ||
193 | return this._value; | ||
194 | }, | ||
195 | set: function(val) { | ||
196 | this._value = val; | ||
197 | } | ||
198 | } | 218 | } |
199 | }); \ No newline at end of file | 219 | }); \ No newline at end of file |