diff options
author | Armen Kesablyan | 2012-05-15 16:34:46 -0700 |
---|---|---|
committer | Armen Kesablyan | 2012-05-15 16:34:46 -0700 |
commit | c8d61c8e72e0eba266575f9df54325fa77fde73d (patch) | |
tree | 556cafd76ab9b2cf4cc2b4cc3ea17b12ce690b69 /js/stage | |
parent | 15a3aaebb56cb2c9409bfe55c862868726c7fd44 (diff) | |
parent | 46bd3712329cd3c9311e50ed9ee4c2245bd1be5a (diff) | |
download | ninja-c8d61c8e72e0eba266575f9df54325fa77fde73d.tar.gz |
Merge branch 'dom-architecture' of github.com:Motorola-Mobility/ninja-internal into binding
Diffstat (limited to 'js/stage')
-rwxr-xr-x | js/stage/stage-deps.js | 4 | ||||
-rwxr-xr-x | js/stage/stage.reel/stage.js | 45 |
2 files changed, 34 insertions, 15 deletions
diff --git a/js/stage/stage-deps.js b/js/stage/stage-deps.js index a71b77be..33ba2359 100755 --- a/js/stage/stage-deps.js +++ b/js/stage/stage-deps.js | |||
@@ -52,7 +52,7 @@ exports.StageDeps = Montage.create(Component, { | |||
52 | userContentLeft: { | 52 | userContentLeft: { |
53 | get: function() { return this._userContentLeft; }, | 53 | get: function() { return this._userContentLeft; }, |
54 | set: function(value) { | 54 | set: function(value) { |
55 | if(value) { | 55 | if(value != null) { |
56 | viewUtils.setUserContentLeft(value); | 56 | viewUtils.setUserContentLeft(value); |
57 | } | 57 | } |
58 | } | 58 | } |
@@ -65,7 +65,7 @@ exports.StageDeps = Montage.create(Component, { | |||
65 | userContentTop: { | 65 | userContentTop: { |
66 | get: function() { return this._userContentTop; }, | 66 | get: function() { return this._userContentTop; }, |
67 | set: function(value) { | 67 | set: function(value) { |
68 | if(value) { | 68 | if(value != null) { |
69 | viewUtils.setUserContentTop(value); | 69 | viewUtils.setUserContentTop(value); |
70 | } | 70 | } |
71 | } | 71 | } |
diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js index 171c4f36..deed4112 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 | ||
@@ -382,9 +387,9 @@ exports.Stage = Montage.create(Component, { | |||
382 | handleMousewheel: { | 387 | handleMousewheel: { |
383 | value: function(event) { | 388 | value: function(event) { |
384 | if(event._event.wheelDelta > 0) { | 389 | if(event._event.wheelDelta > 0) { |
385 | this._iframeContainer.scrollTop -= 20; | 390 | this.application.ninja.currentDocument.model.views.design.document.body.scrollTop -= 20; |
386 | } else { | 391 | } else { |
387 | this._iframeContainer.scrollTop += 20; | 392 | this.application.ninja.currentDocument.model.views.design.document.body.scrollTop += 20; |
388 | } | 393 | } |
389 | } | 394 | } |
390 | }, | 395 | }, |
@@ -459,11 +464,17 @@ exports.Stage = Montage.create(Component, { | |||
459 | this.userContentLeft = this._documentOffsetLeft - this._scrollLeft + this._userContentBorder; | 464 | this.userContentLeft = this._documentOffsetLeft - this._scrollLeft + this._userContentBorder; |
460 | this.userContentTop = this._documentOffsetTop - this._scrollTop + this._userContentBorder; | 465 | this.userContentTop = this._documentOffsetTop - this._scrollTop + this._userContentBorder; |
461 | } else { | 466 | } else { |
462 | this._scrollLeft = this.application.ninja.currentDocument.documentRoot.scrollLeft; | 467 | this._scrollLeft = this.application.ninja.currentDocument.model.views.design.document.body.scrollLeft; |
463 | this._scrollTop = this.application.ninja.currentDocument.documentRoot.scrollTop; | 468 | this._scrollTop = this.application.ninja.currentDocument.model.views.design.document.body.scrollTop; |
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 |
@@ -501,11 +512,16 @@ exports.Stage = Montage.create(Component, { | |||
501 | */ | 512 | */ |
502 | centerStage: { | 513 | centerStage: { |
503 | value: function() { | 514 | value: function() { |
504 | this._iframeContainer.scrollLeft = this._documentOffsetLeft - (this._iframeContainer.offsetWidth - this._documentRoot.parentNode.offsetWidth)/2; | 515 | if(this.application.ninja.currentDocument.documentRoot.id === "UserContent") { |
505 | this._iframeContainer.scrollTop = this._documentOffsetTop - (this._iframeContainer.offsetHeight - this._documentRoot.parentNode.offsetHeight)/2; | 516 | this._iframeContainer.scrollLeft = this._documentOffsetLeft - (this._iframeContainer.offsetWidth - this._documentRoot.parentNode.offsetWidth)/2; |
517 | this._iframeContainer.scrollTop = this._documentOffsetTop - (this._iframeContainer.offsetHeight - this._documentRoot.parentNode.offsetHeight)/2; | ||
506 | 518 | ||
507 | this._scrollLeft = this._iframeContainer.scrollLeft; | 519 | this._scrollLeft = this._iframeContainer.scrollLeft; |
508 | this._scrollTop = this._iframeContainer.scrollTop; | 520 | this._scrollTop = this._iframeContainer.scrollTop; |
521 | } else { | ||
522 | this._scrollLeft = this._userContentLeft = this.application.ninja.currentDocument.model.views.design.document.body.scrollLeft = 0; | ||
523 | this._scrollTop = this._userContentTop = this.application.ninja.currentDocument.model.views.design.document.body.scrollTop = 0; | ||
524 | } | ||
509 | } | 525 | } |
510 | }, | 526 | }, |
511 | 527 | ||
@@ -540,13 +556,16 @@ exports.Stage = Montage.create(Component, { | |||
540 | */ | 556 | */ |
541 | getElement: { | 557 | getElement: { |
542 | value: function(position, selectable) { | 558 | value: function(position, selectable) { |
543 | var point, element; | 559 | var point, element, |
560 | docView = this.application.ninja.currentDocument.model.views.design; | ||
544 | 561 | ||
545 | point = webkitConvertPointFromPageToNode(this.canvas, new WebKitPoint(position.pageX, position.pageY)); | 562 | point = webkitConvertPointFromPageToNode(this.canvas, new WebKitPoint(position.pageX - docView.iframe.contentWindow.pageXOffset, position.pageY - docView.iframe.contentWindow.pageYOffset)); |
546 | element = this.application.ninja.currentDocument.model.views.design.getElementFromPoint(point.x + this.scrollLeft,point.y + this.scrollTop); | 563 | element = this.application.ninja.currentDocument.model.views.design.getElementFromPoint(point.x - this.userContentLeft,point.y - this.userContentTop); |
547 | 564 | ||
565 | if(!element) debugger; | ||
548 | // workaround Chrome 3d bug | 566 | // workaround Chrome 3d bug |
549 | if(this.application.ninja.toolsData.selectedToolInstance._canSnap && this.application.ninja.currentDocument.inExclusion(element) !== -1) { | 567 | if(this.application.ninja.toolsData.selectedToolInstance._canSnap && this.application.ninja.currentDocument.inExclusion(element) !== -1) { |
568 | point = webkitConvertPointFromPageToNode(this.canvas, new WebKitPoint(position.pageX, position.pageY)); | ||
550 | element = this.getElementUsingSnapping(point); | 569 | element = this.getElementUsingSnapping(point); |
551 | } | 570 | } |
552 | 571 | ||
@@ -877,7 +896,7 @@ exports.Stage = Montage.create(Component, { | |||
877 | //TODO - Maybe move to mediator. | 896 | //TODO - Maybe move to mediator. |
878 | var newVal = value/100.0; | 897 | var newVal = value/100.0; |
879 | if (newVal >= 1) | 898 | if (newVal >= 1) |
880 | this.application.ninja.currentDocument.iframe.style.zoom = value/100; | 899 | this.application.ninja.currentDocument.model.views.design.iframe.style.zoom = value/100; |
881 | 900 | ||
882 | this.updatedStage = true; | 901 | this.updatedStage = true; |
883 | 902 | ||