From 4ba680a7e9168d0f505a81e42a287dfbc54b4d7d Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Date: Tue, 1 May 2012 15:26:37 -0700 Subject: Preliminary IO to new DOM view --- js/stage/stage.reel/stage.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'js/stage/stage.reel/stage.js') diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js index 515165bf..2e49fc04 100755 --- a/js/stage/stage.reel/stage.js +++ b/js/stage/stage.reel/stage.js @@ -264,7 +264,7 @@ exports.Stage = Montage.create(Component, { this._userContentLeft = 0; this._userContentTop = 0; - this.application.ninja.currentDocument._window.addEventListener("scroll", this, false); + //this.application.ninja.currentDocument._window.addEventListener("scroll", this, false); } @@ -543,7 +543,7 @@ exports.Stage = Montage.create(Component, { var point, element; point = webkitConvertPointFromPageToNode(this.canvas, new WebKitPoint(position.pageX, position.pageY)); - element = this.application.ninja.currentDocument.GetElementFromPoint(point.x + this.scrollLeft,point.y + this.scrollTop); + element = this.application.ninja.currentDocument.model.views.design.getElementFromPoint(point.x + this.scrollLeft,point.y + this.scrollTop); // workaround Chrome 3d bug if(this.application.ninja.toolsData.selectedToolInstance._canSnap && this.application.ninja.currentDocument.inExclusion(element) !== -1) { -- cgit v1.2.3 From 4baed156932f5875755532939a411953fa41c59d Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Tue, 8 May 2012 09:43:32 -0700 Subject: 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 --- js/stage/stage.reel/stage.js | 15 +++++++++++++-- 1 file changed, 13 insertions(+), 2 deletions(-) (limited to 'js/stage/stage.reel/stage.js') 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, { _userContentTop: { value: 0 }, _userContentBorder: { value: 0 }, + _maxHorizontalScroll: { value: 0 }, + _maxVerticalScroll: { value: 0 }, + documentRoot: { get: function () { return this._documentRoot; }, set: function(value) { this._documentRoot = value; } @@ -264,7 +267,9 @@ exports.Stage = Montage.create(Component, { this._userContentLeft = 0; this._userContentTop = 0; - //this.application.ninja.currentDocument._window.addEventListener("scroll", this, false); + this._maxHorizontalScroll = this._documentRoot.scrollWidth - this._canvas.width - 11; + this._maxVerticalScroll = this._documentRoot.scrollHeight - this._canvas.height - 11; + this.application.ninja.currentDocument.model.views.design.iframe.contentWindow.addEventListener("scroll", this, false); } @@ -464,6 +469,12 @@ exports.Stage = Montage.create(Component, { this.userContentLeft = -this._scrollLeft; this.userContentTop = -this._scrollTop; + + // TODO - scroll events are not dependable. We may need to use a timer to simulate + // scrollBegin and scrollEnd. For now, the Pan Tool will keep track of the stage's scroll values + // on mouse down. +// this._maxHorizontalScroll = this._documentRoot.scrollWidth - this._canvas.width - 11; +// this._maxVerticalScroll = this._documentRoot.scrollHeight - this._canvas.height - 11; } // Need to clear the snap cache and set up the drag plane @@ -543,7 +554,7 @@ exports.Stage = Montage.create(Component, { var point, element; point = webkitConvertPointFromPageToNode(this.canvas, new WebKitPoint(position.pageX, position.pageY)); - element = this.application.ninja.currentDocument.model.views.design.getElementFromPoint(point.x + this.scrollLeft,point.y + this.scrollTop); + element = this.application.ninja.currentDocument.model.views.design.getElementFromPoint(point.x + this.userContentLeft,point.y + this.userContentTop); // workaround Chrome 3d bug if(this.application.ninja.toolsData.selectedToolInstance._canSnap && this.application.ninja.currentDocument.inExclusion(element) !== -1) { -- cgit v1.2.3 From c79814664f3002613b3f12106edffc64932fa4ac Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Tue, 8 May 2012 16:27:50 -0700 Subject: Get clicked element when body is scrolled. Signed-off-by: Nivesh Rajbhandari --- js/stage/stage.reel/stage.js | 11 +++++++---- 1 file changed, 7 insertions(+), 4 deletions(-) (limited to 'js/stage/stage.reel/stage.js') diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js index 1f661513..dc6444ff 100755 --- a/js/stage/stage.reel/stage.js +++ b/js/stage/stage.reel/stage.js @@ -551,13 +551,16 @@ exports.Stage = Montage.create(Component, { */ getElement: { value: function(position, selectable) { - var point, element; + var point, element, + docView = this.application.ninja.currentDocument.model.views.design; - point = webkitConvertPointFromPageToNode(this.canvas, new WebKitPoint(position.pageX, position.pageY)); - element = this.application.ninja.currentDocument.model.views.design.getElementFromPoint(point.x + this.userContentLeft,point.y + this.userContentTop); + point = webkitConvertPointFromPageToNode(this.canvas, new WebKitPoint(position.pageX - docView.iframe.contentWindow.pageXOffset, position.pageY - docView.iframe.contentWindow.pageYOffset)); + element = this.application.ninja.currentDocument.model.views.design.getElementFromPoint(point.x - this.userContentLeft,point.y - this.userContentTop); + if(!element) debugger; // workaround Chrome 3d bug if(this.application.ninja.toolsData.selectedToolInstance._canSnap && this.application.ninja.currentDocument.inExclusion(element) !== -1) { + point = webkitConvertPointFromPageToNode(this.canvas, new WebKitPoint(position.pageX, position.pageY)); element = this.getElementUsingSnapping(point); } @@ -888,7 +891,7 @@ exports.Stage = Montage.create(Component, { //TODO - Maybe move to mediator. var newVal = value/100.0; if (newVal >= 1) - this.application.ninja.currentDocument.iframe.style.zoom = value/100; + this.application.ninja.currentDocument.model.views.design.iframe.style.zoom = value/100; this.updatedStage = true; -- cgit v1.2.3 From 253b8803c71c88a6f87fb1caccd42fa081fc6eca Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Tue, 15 May 2012 14:17:41 -0700 Subject: Fixing scrollbar syncing, including pan tool, for banner templates. Signed-off-by: Nivesh Rajbhandari --- js/stage/stage.reel/stage.js | 17 +++++++++++------ 1 file changed, 11 insertions(+), 6 deletions(-) (limited to 'js/stage/stage.reel/stage.js') diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js index dc6444ff..e66c5b7b 100755 --- a/js/stage/stage.reel/stage.js +++ b/js/stage/stage.reel/stage.js @@ -464,8 +464,8 @@ exports.Stage = Montage.create(Component, { this.userContentLeft = this._documentOffsetLeft - this._scrollLeft + this._userContentBorder; this.userContentTop = this._documentOffsetTop - this._scrollTop + this._userContentBorder; } else { - this._scrollLeft = this.application.ninja.currentDocument.documentRoot.scrollLeft; - this._scrollTop = this.application.ninja.currentDocument.documentRoot.scrollTop; + this._scrollLeft = this.application.ninja.currentDocument.model.views.design.document.body.scrollLeft; + this._scrollTop = this.application.ninja.currentDocument.model.views.design.document.body.scrollTop; this.userContentLeft = -this._scrollLeft; this.userContentTop = -this._scrollTop; @@ -512,11 +512,16 @@ exports.Stage = Montage.create(Component, { */ centerStage: { value: function() { - this._iframeContainer.scrollLeft = this._documentOffsetLeft - (this._iframeContainer.offsetWidth - this._documentRoot.parentNode.offsetWidth)/2; - this._iframeContainer.scrollTop = this._documentOffsetTop - (this._iframeContainer.offsetHeight - this._documentRoot.parentNode.offsetHeight)/2; + if(this.application.ninja.currentDocument.documentRoot.id === "UserContent") { + this._iframeContainer.scrollLeft = this._documentOffsetLeft - (this._iframeContainer.offsetWidth - this._documentRoot.parentNode.offsetWidth)/2; + this._iframeContainer.scrollTop = this._documentOffsetTop - (this._iframeContainer.offsetHeight - this._documentRoot.parentNode.offsetHeight)/2; - this._scrollLeft = this._iframeContainer.scrollLeft; - this._scrollTop = this._iframeContainer.scrollTop; + this._scrollLeft = this._iframeContainer.scrollLeft; + this._scrollTop = this._iframeContainer.scrollTop; + } else { + this._scrollLeft = this._userContentLeft = this.application.ninja.currentDocument.model.views.design.document.body.scrollLeft = 0; + this._scrollTop = this._userContentTop = this.application.ninja.currentDocument.model.views.design.document.body.scrollTop = 0; + } } }, -- cgit v1.2.3 From 94855a2c1074f67f158b94ca0d61c51ee46c51b5 Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Tue, 15 May 2012 16:08:37 -0700 Subject: fixed the mouse wheel scroll Signed-off-by: Valerio Virgillito --- js/stage/stage.reel/stage.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'js/stage/stage.reel/stage.js') diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js index e66c5b7b..deed4112 100755 --- a/js/stage/stage.reel/stage.js +++ b/js/stage/stage.reel/stage.js @@ -387,9 +387,9 @@ exports.Stage = Montage.create(Component, { handleMousewheel: { value: function(event) { if(event._event.wheelDelta > 0) { - this._iframeContainer.scrollTop -= 20; + this.application.ninja.currentDocument.model.views.design.document.body.scrollTop -= 20; } else { - this._iframeContainer.scrollTop += 20; + this.application.ninja.currentDocument.model.views.design.document.body.scrollTop += 20; } } }, -- cgit v1.2.3 From 0ebb822b0535bf1bb100b3f3cb396c8b6d3383f1 Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Wed, 16 May 2012 11:23:12 -0700 Subject: fixing some of the document bindings. Signed-off-by: Valerio Virgillito --- js/stage/stage.reel/stage.js | 23 +++++++++++++++++++++++ 1 file changed, 23 insertions(+) (limited to 'js/stage/stage.reel/stage.js') diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js index deed4112..125155d8 100755 --- a/js/stage/stage.reel/stage.js +++ b/js/stage/stage.reel/stage.js @@ -164,6 +164,29 @@ exports.Stage = Montage.create(Component, { set: function(value) { this._userContentBorder = value; } }, + _activeDocument : { + value : null, + enumerable : false + }, + + activeDocument : { + get : function() { + return this._activeDocument; + }, + set : function(document) { + ///// If the document is null set default stylesheets to null + + if(!document) { + return false; + } + + ///// setting document via binding + this._activeDocument = document; + + }, + enumerable : false + }, + willDraw: { value: function() { if(this.resizeCanvases) { -- cgit v1.2.3 From 4f46850b376b2d428a3d9415b1dc69b36b875a2c Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Wed, 16 May 2012 13:06:34 -0700 Subject: Automatically add scrollbars when moving content to negative space. Signed-off-by: Nivesh Rajbhandari --- js/stage/stage.reel/stage.js | 31 +++++++++++++++++++++++++++++-- 1 file changed, 29 insertions(+), 2 deletions(-) (limited to 'js/stage/stage.reel/stage.js') diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js index 125155d8..05376527 100755 --- a/js/stage/stage.reel/stage.js +++ b/js/stage/stage.reel/stage.js @@ -187,6 +187,33 @@ exports.Stage = Montage.create(Component, { enumerable : false }, + _userPaddingLeft: { value: 0 }, + _userPaddingTop: { value: 0 }, + + userPaddingLeft: { + get: function() { return this._userPaddingLeft; }, + set: function(value) { + this._userPaddingLeft = value; + this._documentOffsetLeft = -value; + this.application.ninja.stylesController.setElementStyle(this._documentRoot.ownerDocument.getElementsByTagName("HTML")[0], + "padding-left", -value + "px", true); + this.userContentLeft = this._documentOffsetLeft; + this.updatedStage = true; + } + }, + + userPaddingTop: { + get: function() { return this._userPaddingTop; }, + set: function(value) { + this._userPaddingTop = value; + this._documentOffsetTop = -value; + this.application.ninja.stylesController.setElementStyle(this._documentRoot.ownerDocument.getElementsByTagName("HTML")[0], + "padding-top", -value + "px", true); + this.userContentTop = this._documentOffsetTop; + this.updatedStage = true; + } + }, + willDraw: { value: function() { if(this.resizeCanvases) { @@ -490,8 +517,8 @@ exports.Stage = Montage.create(Component, { this._scrollLeft = this.application.ninja.currentDocument.model.views.design.document.body.scrollLeft; this._scrollTop = this.application.ninja.currentDocument.model.views.design.document.body.scrollTop; - this.userContentLeft = -this._scrollLeft; - this.userContentTop = -this._scrollTop; + this.userContentLeft = this._documentOffsetLeft - this._scrollLeft; + this.userContentTop = this._documentOffsetTop - this._scrollTop; // TODO - scroll events are not dependable. We may need to use a timer to simulate // scrollBegin and scrollEnd. For now, the Pan Tool will keep track of the stage's scroll values -- cgit v1.2.3 From 96c92ab93bdb6eb2dd42ef275b84d83aef8254bf Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Wed, 16 May 2012 14:36:47 -0700 Subject: Fixing selection bugs in new templates. Signed-off-by: Nivesh Rajbhandari --- js/stage/stage.reel/stage.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'js/stage/stage.reel/stage.js') diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js index 05376527..854b5a2d 100755 --- a/js/stage/stage.reel/stage.js +++ b/js/stage/stage.reel/stage.js @@ -609,7 +609,7 @@ exports.Stage = Montage.create(Component, { var point, element, docView = this.application.ninja.currentDocument.model.views.design; - point = webkitConvertPointFromPageToNode(this.canvas, new WebKitPoint(position.pageX - docView.iframe.contentWindow.pageXOffset, position.pageY - docView.iframe.contentWindow.pageYOffset)); + point = webkitConvertPointFromPageToNode(this.canvas, new WebKitPoint(position.pageX - docView.iframe.contentWindow.pageXOffset + this.documentOffsetLeft, position.pageY - docView.iframe.contentWindow.pageYOffset + this.documentOffsetTop)); element = this.application.ninja.currentDocument.model.views.design.getElementFromPoint(point.x - this.userContentLeft,point.y - this.userContentTop); if(!element) debugger; -- cgit v1.2.3 From fd54dabad7cbc27a0efb0957155c00d578912909 Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Wed, 16 May 2012 15:32:36 -0700 Subject: changing @change to propertyChangeListener Signed-off-by: Valerio Virgillito --- js/stage/stage.reel/stage.js | 9 ++++----- 1 file changed, 4 insertions(+), 5 deletions(-) (limited to 'js/stage/stage.reel/stage.js') diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js index 125155d8..93270561 100755 --- a/js/stage/stage.reel/stage.js +++ b/js/stage/stage.reel/stage.js @@ -300,7 +300,7 @@ exports.Stage = Montage.create(Component, { // TODO - We will need to modify this once we support switching between multiple documents this.application.ninja.toolsData.selectedToolInstance._configure(true); - this.addEventListener("change@appModel.show3dGrid", this, false); + this.addPropertyChangeListener("appModel.show3dGrid", this, false); this.layout.handleOpenDocument(); } @@ -309,10 +309,9 @@ exports.Stage = Montage.create(Component, { /** * Event handler for the change @ 3DGrid */ - handleEvent: { - value: function(e) { - if(e.type === "change@appModel.show3dGrid") { - + handleChange: { + value: function(notification) { + if("appModel.show3dGrid" === notification.currentPropertyPath) { if(this.appModel.show3dGrid) { drawUtils.drawXY = true; -- cgit v1.2.3 From 727ad95f6828821f0682aa98104783e4bbda78b4 Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Wed, 16 May 2012 15:56:54 -0700 Subject: Inline style for html's padding for content in negative space to guarantee highest specificity. Also, set up scrollbars when opening files with content in negative space. Signed-off-by: Nivesh Rajbhandari --- js/stage/stage.reel/stage.js | 16 ++++++++++------ 1 file changed, 10 insertions(+), 6 deletions(-) (limited to 'js/stage/stage.reel/stage.js') diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js index 854b5a2d..28356d1a 100755 --- a/js/stage/stage.reel/stage.js +++ b/js/stage/stage.reel/stage.js @@ -195,8 +195,10 @@ exports.Stage = Montage.create(Component, { set: function(value) { this._userPaddingLeft = value; this._documentOffsetLeft = -value; - this.application.ninja.stylesController.setElementStyle(this._documentRoot.ownerDocument.getElementsByTagName("HTML")[0], - "padding-left", -value + "px", true); + if(!this._documentRoot) { + this._documentRoot = this.application.ninja.currentDocument.documentRoot; + } + this._documentRoot.ownerDocument.getElementsByTagName("HTML")[0].style["padding-left"] = -value + "px"; this.userContentLeft = this._documentOffsetLeft; this.updatedStage = true; } @@ -207,8 +209,10 @@ exports.Stage = Montage.create(Component, { set: function(value) { this._userPaddingTop = value; this._documentOffsetTop = -value; - this.application.ninja.stylesController.setElementStyle(this._documentRoot.ownerDocument.getElementsByTagName("HTML")[0], - "padding-top", -value + "px", true); + if(!this._documentRoot) { + this._documentRoot = this.application.ninja.currentDocument.documentRoot; + } + this._documentRoot.ownerDocument.getElementsByTagName("HTML")[0].style["padding-top"] = -value + "px"; this.userContentTop = this._documentOffsetTop; this.updatedStage = true; } @@ -314,8 +318,8 @@ exports.Stage = Montage.create(Component, { this._scrollLeft = 0; this._scrollTop = 0; - this._userContentLeft = 0; - this._userContentTop = 0; + this._userContentLeft = this._documentOffsetLeft; + this._userContentTop = this._documentOffsetTop; this._maxHorizontalScroll = this._documentRoot.scrollWidth - this._canvas.width - 11; this._maxVerticalScroll = this._documentRoot.scrollHeight - this._canvas.height - 11; -- cgit v1.2.3