From 238586be0df568c6804268d97bf9d3ef7cd33fda Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Thu, 26 Apr 2012 15:33:48 -0700 Subject: Simplifying the getElement method from stage and adding an exclusion list to the new template Signed-off-by: Valerio Virgillito --- js/document/document-html.js | 15 ++++++++ js/stage/stage.reel/stage.js | 73 +++++++++++++++++++-------------------- js/tools/EyedropperTool.js | 2 +- js/tools/FillTool.js | 2 +- js/tools/InkBottleTool.js | 2 +- js/tools/ShapeTool.js | 2 +- js/tools/ToolBase.js | 4 +-- js/tools/TranslateObject3DTool.js | 2 +- js/tools/modifier-tool-base.js | 2 +- 9 files changed, 58 insertions(+), 46 deletions(-) diff --git a/js/document/document-html.js b/js/document/document-html.js index 24eb4f47..d9789cd2 100755 --- a/js/document/document-html.js +++ b/js/document/document-html.js @@ -31,6 +31,10 @@ exports.HtmlDocument = Montage.create(Component, { value: null }, + exclusionList: { + value: ["HTML"] + }, + // Getters for the model. // TODO: Change how these properties are accessed through Ninja name: { @@ -316,6 +320,17 @@ exports.HtmlDocument = Montage.create(Component, { } }, + inExclusion: { + value: function(element) { + if(this.exclusionList.indexOf(element.nodeName) === -1) { + return -1; + } + + return 1; + + } + }, + // Handler for user content main reel. Gets called once the main reel of the template // gets deserialized. // Setting up the currentSelectedContainer to the document body. diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js index 8382135d..fb7abf48 100755 --- a/js/stage/stage.reel/stage.js +++ b/js/stage/stage.reel/stage.js @@ -521,62 +521,59 @@ exports.Stage = Montage.create(Component, { }, /** - * GetSelectableElement: Returns a selectable object (direct child of current container) at clicked point + * GetElement: Returns the element or selectable element under the X,Y coordinates passed as an obj with x,y * - * @param: X,Y - * @return: Returns the current container if the the X,Y hits an element in the exclusion list + * @param position: mouse event + * @param selectable (default == null) if true this will return the current container element + * @return: Returns the element or container or null if the the X,Y hits the exclusion list and tool cannot operate on stage */ - GetSelectableElement: { - value: function(pos) { - var item = this.GetElement(pos); - if(this.application.ninja.currentDocument.inExclusion(item) !== -1) { - return this.application.ninja.currentSelectedContainer; + getElement: { + value: function(position, selectable) { + 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); + + // workaround Chrome 3d bug + if(this.application.ninja.toolsData.selectedToolInstance._canSnap && this.application.ninja.currentDocument.inExclusion(element) !== -1) { + element = this.getElementUsingSnapping(point); } - var activeContainerId = this.application.ninja.currentSelectedContainer.uuid; - if(item.parentNode.uuid === activeContainerId) { - return item; - } else { - var outerElement = item.parentNode; - while(outerElement.parentNode && outerElement.parentNode.uuid !== activeContainerId) { - // If element is higher up than current container then return - if(outerElement.id === "UserContent") return; - // else keep going up the chain - outerElement = outerElement.parentNode; + if(selectable) { + + if(this.application.ninja.currentDocument.inExclusion(element) !== -1) { + return this.application.ninja.currentSelectedContainer; } - return outerElement; - } - } - }, + var activeContainerId = this.application.ninja.currentSelectedContainer.uuid; + if(element.parentNode.uuid === activeContainerId) { + return element; + } else { + var outerElement = element.parentNode; - /** - * GetElement: Returns the object under the X,Y coordinates passed as an obj with x,y - * - * @param: X,Y - * @return: Returns the Object or null if the the X,Y hits the exclusion list and tool cannot operate on stage - */ - GetElement: { - value: function(pos) { - var point = webkitConvertPointFromPageToNode(this.canvas, new WebKitPoint(pos.pageX, pos.pageY)), - elt = this.application.ninja.currentDocument.GetElementFromPoint(point.x + this.scrollLeft,point.y + this.scrollTop); + while(outerElement.parentNode && outerElement.parentNode.uuid !== activeContainerId) { + // If element is higher up than current container then return + if(outerElement.id === "UserContent") return; + // else keep going up the chain + outerElement = outerElement.parentNode; + } + + return outerElement; + } - // workaround Chrome 3d bug - if(this.application.ninja.toolsData.selectedToolInstance._canSnap && this.application.ninja.currentDocument.inExclusion(elt) !== -1) { - return this._getElementUsingSnapping(point); } else { - return elt; + return element; } } }, /** - * _getElementUsingSnapping: Returns the object at point using snap manager + * getElementUsingSnapping: Returns the object at point using snap manager * * @param: point * @return: Returns the Object in the user document under the point */ - _getElementUsingSnapping: { + getElementUsingSnapping: { value: function(point) { this.stageDeps.snapManager.enableElementSnap( true ); var hitRec = this.stageDeps.snapManager.snap(point.x, point.y, true); diff --git a/js/tools/EyedropperTool.js b/js/tools/EyedropperTool.js index d627f03b..346975b2 100755 --- a/js/tools/EyedropperTool.js +++ b/js/tools/EyedropperTool.js @@ -104,7 +104,7 @@ exports.EyedropperTool = Montage.create(toolBase, { value : function (event) { var c, color, - obj = this.application.ninja.stage.GetElement(event); + obj = this.application.ninja.stage.getElement(event); if (obj) { if(this.application.ninja.currentDocument.inExclusion(obj) !== -1) diff --git a/js/tools/FillTool.js b/js/tools/FillTool.js index 746f20cf..87a093ff 100755 --- a/js/tools/FillTool.js +++ b/js/tools/FillTool.js @@ -22,7 +22,7 @@ exports.FillTool = Montage.create(ModifierToolBase, { HandleMouseMove: { value : function (event) { - var obj = this.application.ninja.stage.GetSelectableElement(event); + var obj = this.application.ninja.stage.getElement(event, true); var cursor = "url('images/cursors/fill.png') 14 14, default"; var canColor = true; if (obj) diff --git a/js/tools/InkBottleTool.js b/js/tools/InkBottleTool.js index 960c19fa..fd17f4d6 100755 --- a/js/tools/InkBottleTool.js +++ b/js/tools/InkBottleTool.js @@ -16,7 +16,7 @@ exports.InkBottleTool = Montage.create(ModifierToolBase, { HandleMouseMove: { value : function (event) { - var obj = this.application.ninja.stage.GetSelectableElement(event); + var obj = this.application.ninja.stage.getElement(event, true); var cursor = "url('images/cursors/ink.png') 6 11, default"; var canColor = true; if (obj) diff --git a/js/tools/ShapeTool.js b/js/tools/ShapeTool.js index f3b5e92d..21a5a025 100755 --- a/js/tools/ShapeTool.js +++ b/js/tools/ShapeTool.js @@ -138,7 +138,7 @@ exports.ShapeTool = Montage.create(DrawingTool, { _showFeedbackOnMouseMove: { value: function (event) { // TODO - This call is causing the canvas to redraw 3 times per mouse move - var targetedObject = this.application.ninja.stage.GetSelectableElement(event); + var targetedObject = this.application.ninja.stage.getElement(event, true); if (targetedObject) { if((targetedObject.nodeName === "CANVAS") && !ShapesController.isElementAShape(targetedObject)) diff --git a/js/tools/ToolBase.js b/js/tools/ToolBase.js index 69ac5727..f43b1b58 100755 --- a/js/tools/ToolBase.js +++ b/js/tools/ToolBase.js @@ -89,9 +89,9 @@ exports.toolBase = Montage.create(Component, { if(this._canOperateOnStage) { if(event.shiftKey) { - this.application.ninja.selectionController.shiftSelectElement(this.application.ninja.stage.GetElement(event)); + this.application.ninja.selectionController.shiftSelectElement(this.application.ninja.stage.getElement(event)); } else { - this.application.ninja.selectionController.selectElement(this.application.ninja.stage.GetElement(event)); + this.application.ninja.selectionController.selectElement(this.application.ninja.stage.getElement(event)); } } diff --git a/js/tools/TranslateObject3DTool.js b/js/tools/TranslateObject3DTool.js index 72a55322..b4f55bd9 100755 --- a/js/tools/TranslateObject3DTool.js +++ b/js/tools/TranslateObject3DTool.js @@ -83,7 +83,7 @@ exports.TranslateObject3DTool = Montage.create(Translate3DToolBase, { // Check that hitRec's element matches element that browser says we clicked on // TODO - This is still not working when using a handle that is on top of an // element that is not currently selected - var elt = this.application.ninja.stage.GetSelectableElement(event); + var elt = this.application.ninja.stage.getElement(event, true); if(elt && (elt !== hitRec.getElement())) { hitRec = snapManager.findHitRecordForElement(elt); diff --git a/js/tools/modifier-tool-base.js b/js/tools/modifier-tool-base.js index 2e006c35..d023206a 100755 --- a/js/tools/modifier-tool-base.js +++ b/js/tools/modifier-tool-base.js @@ -134,7 +134,7 @@ exports.ModifierToolBase = Montage.create(DrawingTool, { var hitRec = snapManager.snap(point.x, point.y, do3DSnap); // TODO - Check that hitRec's element matches element that browser says we clicked on - var elt = this.application.ninja.stage.GetSelectableElement(event); + var elt = this.application.ninja.stage.getElement(event, true); if(elt !== hitRec.getElement()) { hitRec = snapManager.findHitRecordForElement(elt); -- cgit v1.2.3