aboutsummaryrefslogtreecommitdiff
path: root/js/ninja.reel/ninja.js
diff options
context:
space:
mode:
Diffstat (limited to 'js/ninja.reel/ninja.js')
-rwxr-xr-xjs/ninja.reel/ninja.js141
1 files changed, 141 insertions, 0 deletions
diff --git a/js/ninja.reel/ninja.js b/js/ninja.reel/ninja.js
index 2a6e49f7..ca094936 100755
--- a/js/ninja.reel/ninja.js
+++ b/js/ninja.reel/ninja.js
@@ -23,6 +23,93 @@ exports.Ninja = Montage.create(Component, {
23 value: null 23 value: null
24 }, 24 },
25 25
26 _isResizing: {
27 value: false
28 },
29 _resizedHeight : {
30 value: 0
31 },
32 _height: {
33 value: null
34 },
35
36 height: {
37 get: function() {
38 return this._height;
39 },
40 set: function(val) {
41 if(this._height != val) {
42 this._height = val;
43 this.needsDraw = true;
44 }
45
46 }
47 },
48
49 _resizedWidth : {
50 value: 0
51 },
52 _width: {
53 value: null
54 },
55
56 width: {
57 get: function() {
58 return this._width;
59 },
60 set: function(val) {
61 if(this._width != val) {
62 this._width = val;
63 this.needsDraw = true;
64 }
65
66 }
67 },
68
69 handleResizeStart: {
70 value:function(e) {
71 this.isResizing = true;
72 this.height = parseInt(this.timeline.element.offsetHeight);
73 this.width = parseInt(this.rightPanelContainer.offsetWidth);
74 this.needsDraw = true;
75 }
76 },
77
78 handleResizeMove: {
79 value:function(e) {
80 this._resizedHeight = e._event.dY;
81 this._resizedWidth = e._event.dX;
82 console.log("resizing");
83 this.stage.resizeCanvases = true;
84 this.needsDraw = true;
85 }
86 },
87
88 handleResizeEnd: {
89 value: function(e) {
90 this.height -= this._resizedHeight;
91 this.width -= this._resizedWidth;
92 this.stage.resizeCanvases = true;
93 this._resizedHeight = 0;
94 this._resizedWidth = 0;
95 this.isResizing = false;
96 this.needsDraw = true;
97 }
98 },
99
100 handleResizeReset: {
101 value: function(e) {
102 this.width = 253;
103 this.height = 140;
104 this._resizedHeight = 0;
105 this._resizedWidth = 0;
106 this.needsDraw = true;
107 this.timelineSplitter.collapsed = false;
108 this.panelSplitter.collapsed = false;
109 }
110 },
111
112
26 selectedElements: { 113 selectedElements: {
27 value: [] 114 value: []
28 }, 115 },
@@ -78,12 +165,45 @@ exports.Ninja = Montage.create(Component, {
78 } 165 }
79 }, 166 },
80 167
168 willDraw: {
169 value: function() {
170 if (this.height === null) {
171 this.height = parseInt(this.timeline.element.offsetHeight);
172 }
173 if (this.width === null) {
174 this.width = parseInt(this.rightPanelContainer.offsetWidth);
175 }
176 }
177 },
178
179 draw: {
180 value: function() {
181 if (this.height - this._resizedHeight < 46) {
182 this.timelineSplitter.collapsed = true;
183 } else {
184 this.timelineSplitter.collapsed = false;
185 }
186 if (this.width - this._resizedWidth < 30) {
187 this.panelSplitter.collapsed = true;
188 } else {
189 this.panelSplitter.collapsed = false;
190 }
191
192 this.timeline.element.style.height = (this.height - this._resizedHeight) + "px";
193 this.rightPanelContainer.style.width = (this.width - this._resizedWidth) + "px";
194 }
195 },
196
81 _didDraw: { 197 _didDraw: {
82 value: false 198 value: false
83 }, 199 },
84 200
85 didDraw: { 201 didDraw: {
86 value: function() { 202 value: function() {
203 if (!this.isResizing) {
204 this.height = this.timeline.element.offsetHeight;
205 this.width = this.rightPanelContainer.offsetWidth;
206 }
87 if(!this._didDraw) { 207 if(!this._didDraw) {
88 if (!this.application.ninja.coreIoApi.ioServiceDetected) { 208 if (!this.application.ninja.coreIoApi.ioServiceDetected) {
89 var check = this.application.ninja.coreIoApi.cloudAvailable(); 209 var check = this.application.ninja.coreIoApi.cloudAvailable();
@@ -166,6 +286,27 @@ exports.Ninja = Montage.create(Component, {
166 this.currentDocument.documentRoot.elementModel.controller.setProperty(this.currentDocument.documentRoot, "overflow", overflow); 286 this.currentDocument.documentRoot.elementModel.controller.setProperty(this.currentDocument.documentRoot, "overflow", overflow);
167 this.currentDocument.documentRoot.elementModel.controller.changeSelector(this.currentDocument.documentRoot, "transitionStopRule", transitionStopRule); 287 this.currentDocument.documentRoot.elementModel.controller.changeSelector(this.currentDocument.documentRoot, "transitionStopRule", transitionStopRule);
168 288
289 this._toggleWebGlAnimation(this.appModel.livePreview);
290 }
291 },
292
293 // Turn on WebGL animation during preview
294 _toggleWebGlAnimation: {
295 value: function(inLivePreview) {
296 var glCanvases = this.currentDocument.iframe.contentWindow.document.querySelectorAll('[data-RDGE-id]'),
297 glShapeModel;
298 if(glCanvases) {
299 for(var i = 0, len = glCanvases.length; i<len; i++) {
300 glShapeModel = glCanvases[i].elementModel.shapeModel;
301 if(inLivePreview) {
302 glShapeModel.GLWorld._previewAnimation = true;
303 glShapeModel.GLWorld.restartRenderLoop();
304 } else if (!glShapeModel.animate ) {
305 glShapeModel.GLWorld._previewAnimation = false;
306 glShapeModel.GLWorld._canvas.task.stop();
307 }
308 }
309 }
169 } 310 }
170 }, 311 },
171 312