aboutsummaryrefslogtreecommitdiff
path: root/js
diff options
context:
space:
mode:
authorNivesh Rajbhandari2012-05-08 09:43:32 -0700
committerNivesh Rajbhandari2012-05-08 09:43:32 -0700
commit4baed156932f5875755532939a411953fa41c59d (patch)
treeb67d1de1196c1a940020afda49ba61b814d1e7d0 /js
parent377c57c7debc98071593056be033978bd337c37e (diff)
downloadninja-4baed156932f5875755532939a411953fa41c59d.tar.gz
Stage should update scroll offsets when scrolled. Note that this is not always correct because we don't get a scroll end event. Updating Pan Tool to update scroll bars.
Signed-off-by: Nivesh Rajbhandari <mqg734@motorola.com>
Diffstat (limited to 'js')
-rwxr-xr-xjs/stage/stage.reel/stage.js15
-rwxr-xr-xjs/tools/PanTool.js66
2 files changed, 60 insertions, 21 deletions
diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js
index 171c4f36..1f661513 100755
--- a/js/stage/stage.reel/stage.js
+++ b/js/stage/stage.reel/stage.js
@@ -118,6 +118,9 @@ exports.Stage = Montage.create(Component, {
118 _userContentTop: { value: 0 }, 118 _userContentTop: { value: 0 },
119 _userContentBorder: { value: 0 }, 119 _userContentBorder: { value: 0 },
120 120
121 _maxHorizontalScroll: { value: 0 },
122 _maxVerticalScroll: { value: 0 },
123
121 documentRoot: { 124 documentRoot: {
122 get: function () { return this._documentRoot; }, 125 get: function () { return this._documentRoot; },
123 set: function(value) { this._documentRoot = value; } 126 set: function(value) { this._documentRoot = value; }
@@ -264,7 +267,9 @@ exports.Stage = Montage.create(Component, {
264 this._userContentLeft = 0; 267 this._userContentLeft = 0;
265 this._userContentTop = 0; 268 this._userContentTop = 0;
266 269
267 //this.application.ninja.currentDocument._window.addEventListener("scroll", this, false); 270 this._maxHorizontalScroll = this._documentRoot.scrollWidth - this._canvas.width - 11;
271 this._maxVerticalScroll = this._documentRoot.scrollHeight - this._canvas.height - 11;
272 this.application.ninja.currentDocument.model.views.design.iframe.contentWindow.addEventListener("scroll", this, false);
268 } 273 }
269 274
270 275
@@ -464,6 +469,12 @@ exports.Stage = Montage.create(Component, {
464 469
465 this.userContentLeft = -this._scrollLeft; 470 this.userContentLeft = -this._scrollLeft;
466 this.userContentTop = -this._scrollTop; 471 this.userContentTop = -this._scrollTop;
472
473 // TODO - scroll events are not dependable. We may need to use a timer to simulate
474 // scrollBegin and scrollEnd. For now, the Pan Tool will keep track of the stage's scroll values
475 // on mouse down.
476// this._maxHorizontalScroll = this._documentRoot.scrollWidth - this._canvas.width - 11;
477// this._maxVerticalScroll = this._documentRoot.scrollHeight - this._canvas.height - 11;
467 } 478 }
468 479
469 // Need to clear the snap cache and set up the drag plane 480 // Need to clear the snap cache and set up the drag plane
@@ -543,7 +554,7 @@ exports.Stage = Montage.create(Component, {
543 var point, element; 554 var point, element;
544 555
545 point = webkitConvertPointFromPageToNode(this.canvas, new WebKitPoint(position.pageX, position.pageY)); 556 point = webkitConvertPointFromPageToNode(this.canvas, new WebKitPoint(position.pageX, position.pageY));
546 element = this.application.ninja.currentDocument.model.views.design.getElementFromPoint(point.x + this.scrollLeft,point.y + this.scrollTop); 557 element = this.application.ninja.currentDocument.model.views.design.getElementFromPoint(point.x + this.userContentLeft,point.y + this.userContentTop);
547 558
548 // workaround Chrome 3d bug 559 // workaround Chrome 3d bug
549 if(this.application.ninja.toolsData.selectedToolInstance._canSnap && this.application.ninja.currentDocument.inExclusion(element) !== -1) { 560 if(this.application.ninja.toolsData.selectedToolInstance._canSnap && this.application.ninja.currentDocument.inExclusion(element) !== -1) {
diff --git a/js/tools/PanTool.js b/js/tools/PanTool.js
index ce7606a1..132ac0b1 100755
--- a/js/tools/PanTool.js
+++ b/js/tools/PanTool.js
@@ -21,6 +21,9 @@ exports.PanTool = Montage.create(toolBase,
21 _lastGPt :{value: [0,0], writable:true}, 21 _lastGPt :{value: [0,0], writable:true},
22 _lastY :{value: 0, writable:true}, 22 _lastY :{value: 0, writable:true},
23 23
24 _maxHorizontalScroll: {value: 0, writable:true},
25 _maxVerticalScroll: {value: 0, writable:true},
26
24 Configure: { 27 Configure: {
25 value: function ( doActivate ) 28 value: function ( doActivate )
26 { 29 {
@@ -43,10 +46,19 @@ exports.PanTool = Montage.create(toolBase,
43 46
44 HandleLeftButtonDown: { 47 HandleLeftButtonDown: {
45 value : function ( event ) { 48 value : function ( event ) {
46 this._isDrawing = true; 49 // Determine the maximum horizontal and vertical scroll values
47 this.isDrawing = true; 50 this._maxHorizontalScroll = this.application.ninja.currentDocument.documentRoot.scrollWidth - this.application.ninja.stage._canvas.width - 11;
48 51 this._maxVerticalScroll = this.application.ninja.currentDocument.documentRoot.scrollHeight - this.application.ninja.stage._canvas.height - 11;
49 this.mouseDown( event ); 52 if((this._maxHorizontalScroll > 0) || (this._maxVerticalScroll > 0) || this._altKeyDown)
53 {
54 this._isDrawing = true;
55 this.isDrawing = true;
56 this.mouseDown( event );
57 }
58// else
59// {
60// console.log("nothing to scroll");
61// }
50 } 62 }
51 }, 63 },
52 64
@@ -136,8 +148,8 @@ exports.PanTool = Montage.create(toolBase,
136 delta = 10*event.wheelDelta/120; 148 delta = 10*event.wheelDelta/120;
137 //console.log( "delta: " + delta ); 149 //console.log( "delta: " + delta );
138 150
139 this.application.ninja.stage._iframeContainer.scrollLeft += delta; 151 this.application.ninja.currentDocument.documentRoot.scrollLeft += delta;
140 this.application.ninja.stage._scrollLeft += delta; 152// this.application.ninja.stage._scrollLeft += delta;
141 153
142 delta *= zoom; 154 delta *= zoom;
143 155
@@ -291,17 +303,19 @@ exports.PanTool = Montage.create(toolBase,
291 if (this._isDrawing) 303 if (this._isDrawing)
292 { 304 {
293 // get the global screen point 305 // get the global screen point
294 var gPt = [point.x, point.y, this._globalPt[2]]; 306 var gPt = [point.x, point.y, this._globalPt[2]],
307 dx,
308 dy;
295 if (this._altKeyDown) 309 if (this._altKeyDown)
296 { 310 {
297 var dy = 5*(point.y - this._lastY); 311 dy = 5*(point.y - this._lastY);
298 this._globalPt[2] += dy; 312 this._globalPt[2] += dy;
299 gPt = [this._lastGPt[0], this._lastGPt[1], this._globalPt[2]]; 313 gPt = [this._lastGPt[0], this._lastGPt[1], this._globalPt[2]];
300 } 314 }
301 else if (this._shiftKeyDown) 315 else if (this._shiftKeyDown)
302 { 316 {
303 var dx = Math.abs( this._shiftPt[0] - gPt[0] ), 317 dx = Math.abs( this._shiftPt[0] - gPt[0] );
304 dy = Math.abs( this._shiftPt[1] - gPt[1] ); 318 dy = Math.abs( this._shiftPt[1] - gPt[1] );
305 319
306 if (dx >= dy) 320 if (dx >= dy)
307 gPt[1] = this._shiftPt[1]; 321 gPt[1] = this._shiftPt[1];
@@ -310,16 +324,28 @@ exports.PanTool = Montage.create(toolBase,
310 } 324 }
311 325
312 // update the scrollbars 326 // update the scrollbars
313 var deltaGPt = VecUtils.vecSubtract(2, gPt, this._lastGPt); 327 var deltaGPt = vecUtils.vecSubtract(2, gPt, this._lastGPt);
314 this._lastGPt = gPt.slice(); 328 this._lastGPt = gPt.slice();
315 this._lastY = point.y; 329 this._lastY = point.y;
316 330 var limitX = false;
317 var oldLeft = this.application.ninja.stage._iframeContainer.scrollLeft, 331 var limitY = false;
318 oldTop = this.application.ninja.stage._iframeContainer.scrollTop; 332
319 this.application.ninja.stage._iframeContainer.scrollLeft -= deltaGPt[0]; 333 var oldLeft = this.application.ninja.currentDocument.documentRoot.scrollLeft,
320 this.application.ninja.stage._iframeContainer.scrollTop -= deltaGPt[1]; 334 oldTop = this.application.ninja.currentDocument.documentRoot.scrollTop,
321 deltaGPt[0] = oldLeft - this.application.ninja.stage._iframeContainer.scrollLeft; 335 newLeft = oldLeft - deltaGPt[0],
322 deltaGPt[1] = oldTop - this.application.ninja.stage._iframeContainer.scrollTop; 336 newTop = oldTop - deltaGPt[1];
337 if((newLeft < 0) || (newLeft > this._maxHorizontalScroll))
338 {
339 limitX = true;
340 }
341 if((newTop < 0) || (newTop > this._maxVerticalScroll))
342 {
343 limitY = true;
344 }
345 this.application.ninja.currentDocument.documentRoot.scrollLeft -= deltaGPt[0];
346 this.application.ninja.currentDocument.documentRoot.scrollTop -= deltaGPt[1];
347 deltaGPt[0] = oldLeft - this.application.ninja.currentDocument.documentRoot.scrollLeft;
348 deltaGPt[1] = oldTop - this.application.ninja.currentDocument.documentRoot.scrollTop;
323 349
324 gPt[0] -= deltaGPt[0]; 350 gPt[0] -= deltaGPt[0];
325 gPt[1] -= deltaGPt[1]; 351 gPt[1] -= deltaGPt[1];
@@ -334,7 +360,7 @@ exports.PanTool = Montage.create(toolBase,
334 360
335 // limit the change 361 // limit the change
336 var ucMat = viewUtils.getMatrixFromElement(this.application.ninja.currentDocument.documentRoot); 362 var ucMat = viewUtils.getMatrixFromElement(this.application.ninja.currentDocument.documentRoot);
337 var tooMuch = false 363 var tooMuch = false;
338 if ((ucMat[12] > 12000) && (delta[0] > 0)) tooMuch = true; 364 if ((ucMat[12] > 12000) && (delta[0] > 0)) tooMuch = true;
339 if ((ucMat[12] < -12000) && (delta[0] < 0)) tooMuch = true; 365 if ((ucMat[12] < -12000) && (delta[0] < 0)) tooMuch = true;
340 if ((ucMat[13] > 12000) && (delta[1] > 0)) tooMuch = true; 366 if ((ucMat[13] > 12000) && (delta[1] > 0)) tooMuch = true;
@@ -349,6 +375,8 @@ exports.PanTool = Montage.create(toolBase,
349 else 375 else
350 this._worldPt = wPt; 376 this._worldPt = wPt;
351 377
378 if(limitX) delta[0] = 0;
379 if(limitY) delta[1] = 0;
352 // update everything 380 // update everything
353 var transMat = Matrix.Translation( delta ); 381 var transMat = Matrix.Translation( delta );
354 this.applyDeltaMat( transMat ); 382 this.applyDeltaMat( transMat );