From d7d78d4a4e8cf82c56379d25efbe679b3b823abc Mon Sep 17 00:00:00 2001 From: Pushkar Joshi Date: Thu, 1 Mar 2012 11:22:46 -0800 Subject: show feedback on mouseover on a part of the path where a new anchor will be added if clicked --- js/tools/PenTool.js | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) (limited to 'js/tools') diff --git a/js/tools/PenTool.js b/js/tools/PenTool.js index ddc8bc04..02367328 100755 --- a/js/tools/PenTool.js +++ b/js/tools/PenTool.js @@ -275,6 +275,9 @@ exports.PenTool = Montage.create(ShapeTool, { this.application.ninja.stage.clearDrawingCanvas(); this._hoveredAnchorIndex = -1; + //set the cursor to be the default cursor + this.application.ninja.stage.drawingCanvas.style.cursor = "auto"; + if (this._isDrawing) { var point = webkitConvertPointFromPageToNode(this.application.ninja.stage.canvas, new WebKitPoint(event.pageX, event.pageY)); //go through the drawing toolbase to get the position of the mouse @@ -345,6 +348,14 @@ exports.PenTool = Montage.create(ShapeTool, { var selAnchor = this._selectedSubpath.pickAnchor(currMousePos[0], currMousePos[1], currMousePos[2], this._PICK_POINT_RADIUS); if (selAnchor >=0) { this._hoveredAnchorIndex = selAnchor; + } else { + //detect if the current mouse position will hit the path + var pathHitTestData = this._selectedSubpath.pathHitTest(currMousePos[0], currMousePos[1], currMousePos[2], this._PICK_POINT_RADIUS); + if (pathHitTestData[0]!==-1){ + //change the cursor + var cursor = "url('images/cursors/penAdd.png') 10 10,default"; + this.application.ninja.stage.drawingCanvas.style.cursor = cursor; + } } } } //else of if (this._isDrawing) { @@ -353,7 +364,6 @@ exports.PenTool = Montage.create(ShapeTool, { if (this._selectedSubpath){ this.DrawSubpathAnchors(this._selectedSubpath); } - }//value: function(event) },//HandleMouseMove -- cgit v1.2.3 From 0b7f2f54738d2c1ea480b9bac7d3a750b1ef4df6 Mon Sep 17 00:00:00 2001 From: Pushkar Joshi Date: Thu, 1 Mar 2012 15:29:17 -0800 Subject: first attempt at rendering the brush stroke as a collection of polylines (number of polylines equals the stroke width) --- js/tools/BrushTool.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'js/tools') diff --git a/js/tools/BrushTool.js b/js/tools/BrushTool.js index fec89eb2..dc9e022e 100644 --- a/js/tools/BrushTool.js +++ b/js/tools/BrushTool.js @@ -72,7 +72,7 @@ exports.BrushTool = Montage.create(ShapeTool, { this._selectedBrushStroke.addPoint(currMousePos); //TODO get these values from the options - this._selectedBrushStroke.setStrokeWidth(20); + this._selectedBrushStroke.setStrokeWidth(10); } NJevent("enableStageMove");//stageManagerModule.stageManager.enableMouseMove(); } //value: function (event) { @@ -112,7 +112,7 @@ exports.BrushTool = Montage.create(ShapeTool, { if (this._isDrawing) { var currMousePos = this._getUnsnappedPosition(event.pageX, event.pageY); - if (this._selectedBrushStroke && this._selectedBrushStroke.getNumPoints()<100){ + if (this._selectedBrushStroke && this._selectedBrushStroke.getNumPoints()<1000){ this._selectedBrushStroke.addPoint(currMousePos); } this.ShowCurrentBrushStrokeOnStage(); -- cgit v1.2.3 From 1b68bb87c458877cb850a96d8a093d6064bc41dc Mon Sep 17 00:00:00 2001 From: Pushkar Joshi Date: Fri, 2 Mar 2012 12:23:44 -0800 Subject: Catmull-Rom spline sampling for the brush stroke, and options for stroke size, stroke hardness and both stroke colors (left and right --- temporarily using the stroke and fill colors respectively) --- js/tools/BrushTool.js | 17 +++++++++++++++-- 1 file changed, 15 insertions(+), 2 deletions(-) (limited to 'js/tools') diff --git a/js/tools/BrushTool.js b/js/tools/BrushTool.js index dc9e022e..8b0f60bb 100644 --- a/js/tools/BrushTool.js +++ b/js/tools/BrushTool.js @@ -5,6 +5,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot */ var ShapeTool = require("js/tools/ShapeTool").ShapeTool; +var ShapesController = require("js/controllers/elements/shapes-controller").ShapesController; var DrawingToolBase = require("js/tools/drawing-tool-base").DrawingToolBase; var defaultEventManager = require("montage/core/event/event-manager").defaultEventManager; var Montage = require("montage/core/core").Montage; @@ -67,12 +68,24 @@ exports.BrushTool = Montage.create(ShapeTool, { if (this.application.ninja.colorController.colorToolbar.stroke.webGlColor){ this._selectedBrushStroke.setStrokeColor(this.application.ninja.colorController.colorToolbar.stroke.webGlColor); } + if (this.application.ninja.colorController.colorToolbar.fill.webGlColor){ + this._selectedBrushStroke.setSecondStrokeColor(this.application.ninja.colorController.colorToolbar.fill.webGlColor); + } //add this point to the brush stroke in case the user does a mouse up before doing a mouse move var currMousePos = this._getUnsnappedPosition(event.pageX, event.pageY); this._selectedBrushStroke.addPoint(currMousePos); - //TODO get these values from the options - this._selectedBrushStroke.setStrokeWidth(10); + var strokeSize = 1; + if (this.options.strokeSize) { + strokeSize = ShapesController.GetValueInPixels(this.options.strokeSize.value, this.options.strokeSize.units); + } + this._selectedBrushStroke.setStrokeWidth(strokeSize); + + var strokeHardness = 100; + if (this.options.strokeHardness){ + strokeHardness = ShapesController.GetValueInPixels(this.options.strokeHardness.value, this.options.strokeHardness.units); + } + this._selectedBrushStroke.setStrokeHardness(strokeHardness); } NJevent("enableStageMove");//stageManagerModule.stageManager.enableMouseMove(); } //value: function (event) { -- cgit v1.2.3 From 14258d1cb3400680ba821d94251defe55714b728 Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Fri, 2 Mar 2012 14:27:44 -0800 Subject: We should show snap marker on mouse move even if user hasn't moused down yet. Signed-off-by: Nivesh Rajbhandari --- js/tools/SelectionTool.js | 10 +++++----- js/tools/modifier-tool-base.js | 10 +++++----- 2 files changed, 10 insertions(+), 10 deletions(-) (limited to 'js/tools') diff --git a/js/tools/SelectionTool.js b/js/tools/SelectionTool.js index 6d8ff175..a2d8510e 100755 --- a/js/tools/SelectionTool.js +++ b/js/tools/SelectionTool.js @@ -123,14 +123,14 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, { this.doDraw(event); } else { this._showFeedbackOnMouseMove(event); - // if(this._canSnap) - // { - // this.doSnap(event); - // } + if(this._canSnap) + { + this.doSnap(event); + } } this.DrawHandles(this._delta); - if(this._canSnap && this._isDrawing) + if(this._canSnap) { this.application.ninja.stage.stageDeps.snapManager.drawLastHit(); } diff --git a/js/tools/modifier-tool-base.js b/js/tools/modifier-tool-base.js index 7892d015..7e950b03 100755 --- a/js/tools/modifier-tool-base.js +++ b/js/tools/modifier-tool-base.js @@ -828,14 +828,14 @@ exports.ModifierToolBase = Montage.create(DrawingTool, { this.doDraw(event); } else { this._showFeedbackOnMouseMove(event); -// if(this._canSnap) -// { -// this.doSnap(event); -// } + if(this._canSnap) + { + this.doSnap(event); + } } this.DrawHandles(this._delta); - if(this._canSnap && this._isDrawing) + if(this._canSnap) { snapManager.drawLastHit(); } -- cgit v1.2.3 From ba62bfff53319ebf140663dc0bf8fbaf1692ff9a Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Mon, 5 Mar 2012 16:42:13 -0800 Subject: Do not use transform code if transform mode is off. Signed-off-by: Nivesh Rajbhandari --- js/tools/SelectionTool.js | 4 ++++ 1 file changed, 4 insertions(+) (limited to 'js/tools') diff --git a/js/tools/SelectionTool.js b/js/tools/SelectionTool.js index a2d8510e..7eee761d 100755 --- a/js/tools/SelectionTool.js +++ b/js/tools/SelectionTool.js @@ -704,6 +704,10 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, { */ _showFeedbackOnMouseMove : { value: function (event) { + if(!this._showTransformHandles) + { + return; + } if(this._target && this._handles) { var len = this._handles.length; -- cgit v1.2.3 From 2346d8ab9db06573d8672c64988c46b6c672e015 Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Tue, 6 Mar 2012 11:28:16 -0800 Subject: Create drag plane parallel to working plane and offset by where the user clicked in z. Signed-off-by: Nivesh Rajbhandari --- js/tools/SelectionTool.js | 9 ++++----- js/tools/Translate3DToolBase.js | 1 - js/tools/TranslateObject3DTool.js | 2 +- js/tools/modifier-tool-base.js | 2 +- 4 files changed, 6 insertions(+), 8 deletions(-) (limited to 'js/tools') diff --git a/js/tools/SelectionTool.js b/js/tools/SelectionTool.js index 7eee761d..13a04944 100755 --- a/js/tools/SelectionTool.js +++ b/js/tools/SelectionTool.js @@ -16,6 +16,7 @@ var Montage = require("montage/core/core").Montage, var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, { drawingFeedback: { value: { mode: "Draw2D", type: "" } }, + _inLocalMode: { value: false}, // This tool should always use global mode for translations _canOperateOnStage: { value: true}, _isSelecting: {value: false, writable:true}, _shiftMove: { value: 10}, @@ -34,14 +35,12 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, { value: function () { if(this._targets && this._targets.length) { - // TODO - drawUtils's elementPlanes check in drawSelectionBounds doesn't seem to work, - // so temporary workaround to simply check if all elements have identity matrix - // TODO - Eventually, this should instead check if all the selected items are on the view plane var len = this._targets.length; + var plane = this.application.ninja.stage.stageDeps.snapManager.getDragPlane(); for(var i = 0; i < len; i++) { - var mat = this._targets[i].mat; - if(!MathUtils.isIdentityMatrix(mat)) + var elt = this._targets[i].elt; + if(!this.application.ninja.stage.stageDeps.snapManager.elementIsOnPlane(elt, plane)) { return false; } diff --git a/js/tools/Translate3DToolBase.js b/js/tools/Translate3DToolBase.js index 3d9191da..24a68ad1 100755 --- a/js/tools/Translate3DToolBase.js +++ b/js/tools/Translate3DToolBase.js @@ -10,7 +10,6 @@ Subclass TranslateObject3DTool will translate the object that was clicked. var Montage = require("montage/core/core").Montage, ModifierToolBase = require("js/tools/modifier-tool-base").ModifierToolBase, toolHandleModule = require("js/stage/tool-handle"), - snapManager = require("js/helper-classes/3D/snap-manager").SnapManager, viewUtils = require("js/helper-classes/3D/view-utils").ViewUtils, vecUtils = require("js/helper-classes/3D/vec-utils").VecUtils, drawUtils = require("js/helper-classes/3D/draw-utils").DrawUtils, diff --git a/js/tools/TranslateObject3DTool.js b/js/tools/TranslateObject3DTool.js index 5157e39c..92b9b2f7 100755 --- a/js/tools/TranslateObject3DTool.js +++ b/js/tools/TranslateObject3DTool.js @@ -103,7 +103,7 @@ exports.TranslateObject3DTool = Object.create(Translate3DToolBase, { } else { - this._dragPlane = snapManager.setupDragPlanes( hitRec ); + this._dragPlane = snapManager.setupDragPlanes( hitRec, true ); } } diff --git a/js/tools/modifier-tool-base.js b/js/tools/modifier-tool-base.js index 7e950b03..80f7d758 100755 --- a/js/tools/modifier-tool-base.js +++ b/js/tools/modifier-tool-base.js @@ -171,7 +171,7 @@ exports.ModifierToolBase = Montage.create(DrawingTool, { // } // else // { - this._dragPlane = snapManager.setupDragPlanes( hitRec ); + this._dragPlane = snapManager.setupDragPlanes( hitRec, true ); // } } -- cgit v1.2.3 From 703fb3d06e88257ac73c1d1a0ec6ca33a64f4371 Mon Sep 17 00:00:00 2001 From: Pushkar Joshi Date: Wed, 7 Mar 2012 14:33:21 -0800 Subject: implement stroke hardness such that it is percentage of the stroke width that's fully the color of the brush AND add a smoothing flag for the brush options --- js/tools/BrushTool.js | 6 ++++++ 1 file changed, 6 insertions(+) (limited to 'js/tools') diff --git a/js/tools/BrushTool.js b/js/tools/BrushTool.js index dd201f33..1e1df0a4 100644 --- a/js/tools/BrushTool.js +++ b/js/tools/BrushTool.js @@ -88,6 +88,12 @@ exports.BrushTool = Montage.create(ShapeTool, { strokeHardness = ShapesController.GetValueInPixels(this.options.strokeHardness.value, this.options.strokeHardness.units); } this._selectedBrushStroke.setStrokeHardness(strokeHardness); + + var doSmoothing = false; + if (this.options.doSmoothing){ + doSmoothing = this.options.doSmoothing.value; + } + this._selectedBrushStroke.setDoSmoothing(doSmoothing); } NJevent("enableStageMove");//stageManagerModule.stageManager.enableMouseMove(); } //value: function (event) { -- cgit v1.2.3 From 84af1c10ca02dd3ac2b36cb141d180c55bcdebdd Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Wed, 7 Mar 2012 16:23:51 -0800 Subject: Eyedropper now supports strokes in rectangle shapes. Signed-off-by: Nivesh Rajbhandari --- js/tools/EyedropperTool.js | 59 ++++++++++++++++++++++++++++++++++++++++++---- 1 file changed, 55 insertions(+), 4 deletions(-) (limited to 'js/tools') diff --git a/js/tools/EyedropperTool.js b/js/tools/EyedropperTool.js index 11c15158..d6a162cd 100755 --- a/js/tools/EyedropperTool.js +++ b/js/tools/EyedropperTool.js @@ -6,9 +6,8 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot var Montage = require("montage/core/core").Montage, ElementsMediator = require("js/mediators/element-mediator").ElementMediator, - drawUtils = require("js/helper-classes/3D/draw-utils").DrawUtils, - vecUtils = require("js/helper-classes/3D/vec-utils").VecUtils, - toolBase = require("js/tools/ToolBase").toolBase; + toolBase = require("js/tools/ToolBase").toolBase, + ShapesController = require("js/controllers/elements/shapes-controller").ShapesController; exports.EyedropperTool = Montage.create(toolBase, { @@ -133,7 +132,15 @@ exports.EyedropperTool = Montage.create(toolBase, { { this._deleteImageDataCanvas(); - c = this._getColorFromElement(obj, event); + if(ShapesController.isElementAShape(obj)) + { + c = this._getColorFromShape(obj, event); + } + else + { + c = this._getColorFromElement(obj, event); + } + if(typeof(c) === "string") { color = this.application.ninja.colorController.getColorObjFromCss(c); @@ -289,6 +296,50 @@ exports.EyedropperTool = Montage.create(toolBase, { } }, + // TODO - We don't want to calculate this repeatedly + _getColorFromShape: { + value: function(elt, event) + { + var strokeWidth = ShapesController.getShapeProperty(elt, "strokeSize"), + bounds3D, + innerBounds, + pt, + tmpPt, + x, + y; + if(strokeWidth) + { + strokeWidth = parseFloat(strokeWidth); + bounds3D = this.application.ninja.stage.viewUtils.getElementViewBounds3D( elt ); + innerBounds = []; + pt = webkitConvertPointFromPageToNode(this.application.ninja.stage.canvas, + new WebKitPoint(event.pageX, event.pageY)); + + innerBounds.push([bounds3D[0][0] + strokeWidth, bounds3D[0][1] + strokeWidth, 0]); + + innerBounds.push([bounds3D[1][0] + strokeWidth, bounds3D[1][1] - strokeWidth, 0]); + + innerBounds.push([bounds3D[2][0] - strokeWidth, bounds3D[2][1] - strokeWidth, 0]); + + innerBounds.push([bounds3D[3][0] - strokeWidth, bounds3D[3][1] + strokeWidth, 0]); + + tmpPt = this.application.ninja.stage.viewUtils.globalToLocal([pt.x, pt.y], elt); + x = tmpPt[0]; + y = tmpPt[1]; + + if( (x < innerBounds[0][0]) || + (x > innerBounds[2][0]) || + (y < innerBounds[0][1]) || + (y > innerBounds[1][1]) ) + { + return ShapesController.getColor(elt, false); + } + } + + return ShapesController.getColor(elt, true); + } + }, + _getColorAtPoint: { value: function(elt, event) { -- cgit v1.2.3 From fcab2a14f8de302948d38f55db41e2c1c92baa34 Mon Sep 17 00:00:00 2001 From: Pushkar Joshi Date: Thu, 8 Mar 2012 16:03:17 -0800 Subject: brush stroke options for calligraphic brush style --- js/tools/BrushTool.js | 18 +++++++++++++++++- 1 file changed, 17 insertions(+), 1 deletion(-) (limited to 'js/tools') diff --git a/js/tools/BrushTool.js b/js/tools/BrushTool.js index 1e1df0a4..9e300554 100644 --- a/js/tools/BrushTool.js +++ b/js/tools/BrushTool.js @@ -91,9 +91,25 @@ exports.BrushTool = Montage.create(ShapeTool, { var doSmoothing = false; if (this.options.doSmoothing){ - doSmoothing = this.options.doSmoothing.value; + doSmoothing = this.options.doSmoothing; } this._selectedBrushStroke.setDoSmoothing(doSmoothing); + + var useCalligraphic = false; + if (this.options.useCalligraphic){ + useCalligraphic = this.options.useCalligraphic; + } + if (useCalligraphic) { + this._selectedBrushStroke.setStrokeUseCalligraphic(true); + var strokeAngle = 0; + if (this.options.strokeAngle){ + strokeAngle= ShapesController.GetValueInPixels(this.options.strokeAngle.value, this.options.strokeAngle.units); + } + this._selectedBrushStroke.setStrokeAngle(strokeAngle); + } else { + this._selectedBrushStroke.setStrokeUseCalligraphic(false); + } + } NJevent("enableStageMove");//stageManagerModule.stageManager.enableMouseMove(); } //value: function (event) { -- cgit v1.2.3 From 86784888a98a05523dbedcbe32fd4dea336878e7 Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Fri, 9 Mar 2012 08:21:13 -0800 Subject: Eyedropper support for getting color value from webgl shapes. Signed-off-by: Nivesh Rajbhandari --- js/tools/EyedropperTool.js | 121 ++++++++++++++++++++++++++++----------------- 1 file changed, 76 insertions(+), 45 deletions(-) (limited to 'js/tools') diff --git a/js/tools/EyedropperTool.js b/js/tools/EyedropperTool.js index d6a162cd..6e71c693 100755 --- a/js/tools/EyedropperTool.js +++ b/js/tools/EyedropperTool.js @@ -7,7 +7,9 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot var Montage = require("montage/core/core").Montage, ElementsMediator = require("js/mediators/element-mediator").ElementMediator, toolBase = require("js/tools/ToolBase").toolBase, - ShapesController = require("js/controllers/elements/shapes-controller").ShapesController; + ShapesController = require("js/controllers/elements/shapes-controller").ShapesController, + World = require("js/lib/drawing/world").World, + njModule = require("js/lib/NJUtils"); exports.EyedropperTool = Montage.create(toolBase, { @@ -16,6 +18,8 @@ exports.EyedropperTool = Montage.create(toolBase, { _color: { value: null}, _elementUnderMouse: { value: null }, _imageDataCanvas: { value: null }, + _webGlDataCanvas: { value: null }, + _webGlWorld: { value: null }, _imageDataContext: { value: null }, _canSnap: { value: false }, @@ -29,6 +33,11 @@ exports.EyedropperTool = Montage.create(toolBase, { else { NJevent("disableStageMove"); + this._deleteImageDataCanvas(); + this._isMouseDown = false; + this._elementUnderMouse = null; + this._previousColor = null; + this._color = null; } } }, @@ -122,7 +131,7 @@ exports.EyedropperTool = Montage.create(toolBase, { new WebKitPoint(event.pageX, event.pageY)), ctx = obj.getContext("2d"); - c = this._getColorFromCanvas(ctx, pt); + c = this._getColorFromCanvas(ctx, [pt.x, pt.y]); if(c) { color = this.application.ninja.colorController.getColorObjFromCss(c); @@ -130,8 +139,6 @@ exports.EyedropperTool = Montage.create(toolBase, { } else { - this._deleteImageDataCanvas(); - if(ShapesController.isElementAShape(obj)) { c = this._getColorFromShape(obj, event); @@ -239,6 +246,8 @@ exports.EyedropperTool = Montage.create(toolBase, { _getColorFromElement: { value: function(elt, event) { + this._deleteImageDataCanvas(); + var border = ElementsMediator.getProperty(elt, "border"), borderWidth, bounds3D, @@ -300,49 +309,39 @@ exports.EyedropperTool = Montage.create(toolBase, { _getColorFromShape: { value: function(elt, event) { - var strokeWidth = ShapesController.getShapeProperty(elt, "strokeSize"), - bounds3D, - innerBounds, - pt, + var c, + ctx, tmpPt, - x, - y; - if(strokeWidth) - { - strokeWidth = parseFloat(strokeWidth); - bounds3D = this.application.ninja.stage.viewUtils.getElementViewBounds3D( elt ); - innerBounds = []; pt = webkitConvertPointFromPageToNode(this.application.ninja.stage.canvas, - new WebKitPoint(event.pageX, event.pageY)); - - innerBounds.push([bounds3D[0][0] + strokeWidth, bounds3D[0][1] + strokeWidth, 0]); - - innerBounds.push([bounds3D[1][0] + strokeWidth, bounds3D[1][1] - strokeWidth, 0]); - - innerBounds.push([bounds3D[2][0] - strokeWidth, bounds3D[2][1] - strokeWidth, 0]); - - innerBounds.push([bounds3D[3][0] - strokeWidth, bounds3D[3][1] + strokeWidth, 0]); + new WebKitPoint(event.pageX, event.pageY)); - tmpPt = this.application.ninja.stage.viewUtils.globalToLocal([pt.x, pt.y], elt); - x = tmpPt[0]; - y = tmpPt[1]; + tmpPt = this.application.ninja.stage.viewUtils.globalToLocal([pt.x, pt.y], elt); - if( (x < innerBounds[0][0]) || - (x > innerBounds[2][0]) || - (y < innerBounds[0][1]) || - (y > innerBounds[1][1]) ) + if(elt.elementModel.shapeModel.useWebGl) + { + c = this._getColorAtPoint(elt, event, true); + } + else + { + this._deleteImageDataCanvas(); + ctx = elt.getContext("2d"); + if(ctx) { - return ShapesController.getColor(elt, false); + c = this._getColorFromCanvas(ctx, tmpPt); } } - - return ShapesController.getColor(elt, true); + return c; } }, _getColorAtPoint: { - value: function(elt, event) + value: function(elt, event, isWebGl) { + var pt = webkitConvertPointFromPageToNode(this.application.ninja.stage.canvas, + new WebKitPoint(event.pageX, event.pageY)); + + var tmpPt = this.application.ninja.stage.viewUtils.globalToLocal([pt.x, pt.y], elt); + if(!this._imageDataCanvas) { this._imageDataCanvas = document.createElement("canvas"); @@ -362,25 +361,52 @@ exports.EyedropperTool = Montage.create(toolBase, { this._imageDataCanvas.height = h; this._imageDataContext = this._imageDataCanvas.getContext("2d"); - this._imageDataContext.drawImage(elt, 0, 0); + if(isWebGl) + { + var worldData = elt.elementModel.shapeModel.GLWorld.export(); + if(worldData) + { + this._webGlDataCanvas = njModule.NJUtils.makeNJElement("canvas", "Canvas", "shape", {"data-RDGE-id": njModule.NJUtils.generateRandom()}, true); + this._applyElementStyles(elt, this._webGlDataCanvas, ["display", "position", "width", "height", + "-webkit-transform", "-webkit-transform-style"]); + this._webGlDataCanvas.style.left = eltCoords[0] + "px"; + this._webGlDataCanvas.style.top = eltCoords[1] + "px"; + this._webGlDataCanvas.width = w; + this._webGlDataCanvas.height = h; + this._webGlWorld = new World(this._webGlDataCanvas, true, true); + this._webGlWorld.import(worldData); + this._webGlWorld.render(); + setTimeout(function() { + this._webGlWorld.draw(); + this._imageDataContext.drawImage(this._webGlDataCanvas, 0, 0); + return this._getColorFromCanvas(this._imageDataContext, tmpPt, true); + }.bind(this), 250); + } + } + else + { + this._imageDataContext.drawImage(elt, 0, 0); + } } - var pt = webkitConvertPointFromPageToNode(this.application.ninja.stage.canvas, - new WebKitPoint(event.pageX, event.pageY)); - - var tmpPt = this.application.ninja.stage.viewUtils.globalToLocal([pt.x, pt.y], elt); - - return this._getColorFromCanvas(this._imageDataContext, tmpPt); + return this._getColorFromCanvas(this._imageDataContext, tmpPt, isWebGl); } }, _getColorFromCanvas: { - value: function(ctx, pt) + value: function(ctx, pt, isWebGl) { - var imageData = ctx.getImageData(pt[0], pt[1], 1, 1).data; + var imageData = ctx.getImageData(~~pt[0], ~~pt[1], 1, 1).data; if(imageData) { - return ("rgba(" + imageData[0] + "," + imageData[1] + "," + imageData[2] + "," + imageData[3] + ")"); + if(isWebGl) + { + return ("rgba(" + imageData[0] + "," + imageData[1] + "," + imageData[2] + "," + imageData[3]/255 + ")"); + } + else + { + return ("rgba(" + imageData[0] + "," + imageData[1] + "," + imageData[2] + "," + imageData[3] + ")"); + } } else { @@ -394,6 +420,11 @@ exports.EyedropperTool = Montage.create(toolBase, { { if(this._imageDataCanvas) { + if(this._webGlDataCanvas) + { + this._webGlWorld = null; + this._webGlDataCanvas = null; + } this._imageDataCanvas = null; this._imageDataContext = null; } -- cgit v1.2.3 From e2562c3f24eb5dbfb9e3bd2868cdf1a2806644bf Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Fri, 9 Mar 2012 13:14:14 -0800 Subject: Fixing selection tool when moving multiple selection in 3d mode. Signed-off-by: Nivesh Rajbhandari --- js/tools/SelectionTool.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) (limited to 'js/tools') diff --git a/js/tools/SelectionTool.js b/js/tools/SelectionTool.js index 13a04944..5f48f74d 100755 --- a/js/tools/SelectionTool.js +++ b/js/tools/SelectionTool.js @@ -451,7 +451,10 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, { if(this._use3DMode) { curMat = item.mat; - glmat4.multiply(curMat, qMat, curMat); + + curMat[12] += transMat[12]; + curMat[13] += transMat[13]; + curMat[14] += transMat[14]; viewUtils.setMatrixForElement( elt, curMat, true); this._targets[i].mat = curMat; } -- cgit v1.2.3 From 2c6339a9191033c937c2bac3e181c2bc380f4c48 Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Mon, 12 Mar 2012 12:00:07 -0700 Subject: Fixed element mediator, PI, and eye-dropper to handle different borders sides and gradients. Signed-off-by: Nivesh Rajbhandari --- js/tools/EyedropperTool.js | 17 +++++++++++------ 1 file changed, 11 insertions(+), 6 deletions(-) (limited to 'js/tools') diff --git a/js/tools/EyedropperTool.js b/js/tools/EyedropperTool.js index 6e71c693..927b86cf 100755 --- a/js/tools/EyedropperTool.js +++ b/js/tools/EyedropperTool.js @@ -152,10 +152,14 @@ exports.EyedropperTool = Montage.create(toolBase, { { color = this.application.ninja.colorController.getColorObjFromCss(c); } - else + else if(c.mode !== "gradient") { color = this.application.ninja.colorController.getColorObjFromCss(c.color.css); } + else + { + color = c; + } } this._updateColor(color, false); @@ -175,7 +179,8 @@ exports.EyedropperTool = Montage.create(toolBase, { if(updateColorToolBar) { eventType = "change"; - if (color && color.value) + // TODO - Color chips in toolbar doesn't support gradients yet + if (color && color.value && (color.mode !== "gradient")) { var input = this.application.ninja.colorController.colorModel.input; @@ -295,10 +300,10 @@ exports.EyedropperTool = Montage.create(toolBase, { x = tmpPt[0]; y = tmpPt[1]; - if(x < innerBounds[0][0]) return ElementsMediator.getProperty(elt, "border-left-color"); - if(x > innerBounds[2][0]) return ElementsMediator.getProperty(elt, "border-right-color"); - if(y < innerBounds[0][1]) return ElementsMediator.getProperty(elt, "border-top-color"); - if(y > innerBounds[1][1]) return ElementsMediator.getProperty(elt, "border-bottom-color"); + if(x < innerBounds[0][0]) return ElementsMediator.getColor(elt, false, "left"); + if(x > innerBounds[2][0]) return ElementsMediator.getColor(elt, false, "right"); + if(y < innerBounds[0][1]) return ElementsMediator.getColor(elt, false, "top"); + if(y > innerBounds[1][1]) return ElementsMediator.getColor(elt, false, "bottom"); } return ElementsMediator.getColor(elt, true); -- cgit v1.2.3 From 00b1e6a9bed04172ad84bdd810f1bd999e8fa0eb Mon Sep 17 00:00:00 2001 From: Pushkar Joshi Date: Mon, 12 Mar 2012 15:02:07 -0700 Subject: bug fixes for spline interpolation AND Laplacian smoothing for denoising AND code cleanup (removing blocks of commented code) --- js/tools/BrushTool.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'js/tools') diff --git a/js/tools/BrushTool.js b/js/tools/BrushTool.js index 9e300554..4ce9976a 100644 --- a/js/tools/BrushTool.js +++ b/js/tools/BrushTool.js @@ -105,7 +105,7 @@ exports.BrushTool = Montage.create(ShapeTool, { if (this.options.strokeAngle){ strokeAngle= ShapesController.GetValueInPixels(this.options.strokeAngle.value, this.options.strokeAngle.units); } - this._selectedBrushStroke.setStrokeAngle(strokeAngle); + this._selectedBrushStroke.setStrokeAngle(Math.PI * -strokeAngle/180); } else { this._selectedBrushStroke.setStrokeUseCalligraphic(false); } -- cgit v1.2.3 From 730c42e005b1ebd96448e3bc2dd700ffd8909cb5 Mon Sep 17 00:00:00 2001 From: Pushkar Joshi Date: Tue, 13 Mar 2012 08:22:06 -0700 Subject: turn off the fill color for pen tool paths by default --- js/tools/PenTool.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) (limited to 'js/tools') diff --git a/js/tools/PenTool.js b/js/tools/PenTool.js index 6897c003..60ef4f92 100755 --- a/js/tools/PenTool.js +++ b/js/tools/PenTool.js @@ -467,9 +467,9 @@ exports.PenTool = Montage.create(ShapeTool, { if (this.application.ninja.colorController.colorToolbar.stroke.webGlColor){ this._selectedSubpath.setStrokeColor(this.application.ninja.colorController.colorToolbar.stroke.webGlColor); } - if (this.application.ninja.colorController.colorToolbar.fill.webGlColor){ - this._selectedSubpath.setFillColor(this.application.ninja.colorController.colorToolbar.fill.webGlColor); - } + //if (this.application.ninja.colorController.colorToolbar.fill.webGlColor){ + // this._selectedSubpath.setFillColor(this.application.ninja.colorController.colorToolbar.fill.webGlColor); + //} } //if this is a new path being rendered this._selectedSubpath.makeDirty(); -- cgit v1.2.3