From 923e760bf4a16baa82e81da6d38e671620664e8f Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Wed, 25 Jul 2012 14:34:59 -0700 Subject: Support line shape drawing inside existing canvases. Signed-off-by: Nivesh Rajbhandari --- js/lib/geom/line.js | 13 ++++++++++-- js/tools/LineTool.js | 56 ++++++++++++++++++++++++++++------------------------ 2 files changed, 41 insertions(+), 28 deletions(-) diff --git a/js/lib/geom/line.js b/js/lib/geom/line.js index eec4f6d9..df65ee86 100755 --- a/js/lib/geom/line.js +++ b/js/lib/geom/line.js @@ -537,6 +537,15 @@ exports.Line = Object.create(GeomObj, { ctx.strokeStyle = c; } + var viewUtils = require("js/helper-classes/3D/view-utils").ViewUtils; + viewUtils.pushViewportObj( world.getCanvas() ); + var cop = viewUtils.getCenterOfProjection(); + viewUtils.popViewportObj(); + var xCtr = cop[0] + this._xOffset, yCtr = cop[1] - this._yOffset; + var xLeft = xCtr - 0.5*this.getWidth(), yTop = yCtr - 0.5*this.getHeight(); + var xDist = cop[0] - xLeft, yDist = cop[1] - yTop; + var xOff = 0.5*world.getViewportWidth() - xDist, yOff = 0.5*world.getViewportHeight() - yDist; + // get the points var p0, p1; if(this._slope === "vertical") { @@ -554,8 +563,8 @@ exports.Line = Object.create(GeomObj, { } // draw the line - ctx.moveTo( p0[0], p0[1] ); - ctx.lineTo( p1[0], p1[1] ); + ctx.moveTo( p0[0]+xOff, p0[1]+yOff ); + ctx.lineTo( p1[0]+xOff, p1[1]+yOff ); ctx.stroke(); } } diff --git a/js/tools/LineTool.js b/js/tools/LineTool.js index f0d96c3c..4ec327b5 100755 --- a/js/tools/LineTool.js +++ b/js/tools/LineTool.js @@ -97,34 +97,38 @@ exports.LineTool = Montage.create(ShapeTool, { if(this.drawData) { w = Math.floor(this.drawData.width); h = Math.floor(this.drawData.height); + // set the dimensions + if(slope === "horizontal") { + h = Math.max(this._strokeSize, 1); + w = Math.max(w, 1); + } else if(slope === "vertical") { + w = Math.max(this._strokeSize, 1); + h = Math.max(h, 1); + } else { + // else make the line's stroke fit inside the canvas by growing the canvas + var theta = Math.atan(slope); + xAdj = Math.abs((this._strokeSize/2)*Math.sin(theta)); + yAdj = Math.abs((this._strokeSize/2)*Math.cos(theta)); + + w += ~~(xAdj*2); + h += ~~(yAdj*2); + } + if(!this._useExistingCanvas()) { - // set the dimensions - if(slope === "horizontal") { - h = Math.max(this._strokeSize, 1); - w = Math.max(w, 1); - } else if(slope === "vertical") { - w = Math.max(this._strokeSize, 1); - h = Math.max(h, 1); - } else { - // else make the line's stroke fit inside the canvas by growing the canvas - var theta = Math.atan(slope); - xAdj = Math.abs((this._strokeSize/2)*Math.sin(theta)); - yAdj = Math.abs((this._strokeSize/2)*Math.cos(theta)); - - w += ~~(xAdj*2); - h += ~~(yAdj*2); - } - - canvas = document.application.njUtils.make("canvas", {"data-RDGE-id": NJUtils.generateRandom()}, this.application.ninja.currentDocument); - - var styles = document.application.njUtils.stylesFromDraw(canvas, w, h, this.drawData); - this.application.ninja.elementMediator.addElements(canvas, styles); - } else { - canvas = this._targetedElement; - canvas.elementModel.controller = ShapesController; - if(!canvas.elementModel.shapeModel) { - canvas.elementModel.shapeModel = Montage.create(ShapeModel); + + canvas = document.application.njUtils.make("canvas", {"data-RDGE-id": NJUtils.generateRandom()}, this.application.ninja.currentDocument); + + var styles = document.application.njUtils.stylesFromDraw(canvas, w, h, this.drawData); + this.application.ninja.elementMediator.addElements(canvas, styles); + } else { + canvas = this._targetedElement; + if (!canvas.getAttribute( "data-RDGE-id" )) + canvas.setAttribute( "data-RDGE-id", NJUtils.generateRandom() ); + canvas.elementModel.controller = ShapesController; + if(!canvas.elementModel.shapeModel) { + canvas.elementModel.shapeModel = Montage.create(ShapeModel); } + this.RenderShape(w, h, this.drawData.planeMat, this.drawData.midPt, canvas, slope, xAdj, yAdj); } } } -- cgit v1.2.3 From 79d5971630b91eea6cf1db03fa9816815b37cb54 Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Wed, 1 Aug 2012 22:38:49 -0700 Subject: fixing the panels being disabled when going from code to design view in multiple documents Signed-off-by: Valerio Virgillito --- js/panels/Panel.reel/Panel.js | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/js/panels/Panel.reel/Panel.js b/js/panels/Panel.reel/Panel.js index 988088e3..586636e1 100755 --- a/js/panels/Panel.reel/Panel.js +++ b/js/panels/Panel.reel/Panel.js @@ -159,11 +159,24 @@ exports.Panel = Montage.create(Component, { this.disabled = true; } else { this.disabled = this._currentDocument.currentView !== "design"; + this._currentDocument.addPropertyChangeListener("model.currentViewIdentifier", this, false); } } }, + handleChange: { + value: function(notification) { + if(notification.currentPropertyPath === "model.currentViewIdentifier") { + if(this.currentDocument.model.currentView.identifier === "design-code") { + this.disabled = true; + } else { + this.disabled = false; + } + } + } + }, + handleBtnCollapseAction: { value: function() { this.collapsed = !this.collapsed; -- cgit v1.2.3 From 7e73b7def962f00f32b0d6acf04b0bc7005ea456 Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Wed, 1 Aug 2012 22:43:28 -0700 Subject: updating the manifest to v0.7.2 Signed-off-by: Valerio Virgillito --- manifest.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/manifest.json b/manifest.json index 14d8b239..46b444c3 100644 --- a/manifest.json +++ b/manifest.json @@ -1,7 +1,7 @@ { "name": "Ninja Authoring Tool Preview", "description": "Ninja HTML5 Authoring Tool Preview", - "version": "0.8.0.0", + "version": "0.7.2.0", "app": { "launch": { "local_path": "index.html" -- cgit v1.2.3 From 7e615eaa90c7bd7a4da15ce04eb089aa3367e389 Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Wed, 1 Aug 2012 23:36:13 -0700 Subject: fixing a few issues when switching between code view documents Signed-off-by: Valerio Virgillito --- js/controllers/selection-controller.js | 4 ++-- js/controllers/styles-controller.js | 2 +- js/stage/layout.js | 2 +- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/js/controllers/selection-controller.js b/js/controllers/selection-controller.js index 7a26ed3b..4b031d70 100755 --- a/js/controllers/selection-controller.js +++ b/js/controllers/selection-controller.js @@ -58,13 +58,13 @@ exports.SelectionController = Montage.create(Component, { return; } - if(this._currentDocument && this._currentDocument.currentView === "design") { + if(this._currentDocument && (this._currentDocument.currentView === "design" || this._currentDocument.model.currentView.identifier !== "code")) { this._currentDocument.model._selection = this.application.ninja.selectedElements; } this._currentDocument = value; - if(this._currentDocument && this._currentDocument.currentView === "design") { + if(this._currentDocument && (this._currentDocument.currentView === "design" || this._currentDocument.model.currentView.identifier !== "code")) { this.selectedElements = this._currentDocument.model.selection; } /* diff --git a/js/controllers/styles-controller.js b/js/controllers/styles-controller.js index e95c6614..68d031fb 100755 --- a/js/controllers/styles-controller.js +++ b/js/controllers/styles-controller.js @@ -87,7 +87,7 @@ var stylesController = exports.StylesController = Montage.create(Component, { set : function(document) { ///// If the document is null set default stylesheets to null - if(!document || document.currentView === "code") { + if(!document || (document.currentView === "code" && document.model.currentView.identifier !== "design-code")) { this._currentDocument = null; this._stageStylesheet = null; this.defaultStylesheet = null; diff --git a/js/stage/layout.js b/js/stage/layout.js index 5cc8dbea..5e6e8152 100755 --- a/js/stage/layout.js +++ b/js/stage/layout.js @@ -69,7 +69,7 @@ exports.Layout = Montage.create(Component, { set : function(value) { if (value !== this._currentDocument) { this._currentDocument = value; - if(this._currentDocument && this._currentDocument.currentView === "design") { + if(this._currentDocument && (this._currentDocument.currentView === "design" || this._currentDocument.model.currentView.identifier !== "code")) { this.elementsToDraw = Array.prototype.slice.call(this._currentDocument.model.documentRoot.childNodes, 0); } } -- cgit v1.2.3 From 9c3e71de8b49dd31c171921184c9baaa7955d586 Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Russo Date: Thu, 2 Aug 2012 22:06:36 -0700 Subject: Fix: CSS issue with resizer background --- js/components/layout/document-bar.reel/document-bar.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/components/layout/document-bar.reel/document-bar.css b/js/components/layout/document-bar.reel/document-bar.css index 5eba72e8..2c547a22 100755 --- a/js/components/layout/document-bar.reel/document-bar.css +++ b/js/components/layout/document-bar.reel/document-bar.css @@ -33,7 +33,7 @@ POSSIBILITY OF SUCH DAMAGE. background: -webkit-radial-gradient(center, ellipse cover, rgba(100, 100, 100, .9) 40%, rgba(100, 100, 100, .4) 50%, rgba(100, 100, 100, 0) 51%), -webkit-radial-gradient(center, ellipse cover, rgba(100, 100, 100, .9) 40%, rgba(100, 100, 100, .4) 50%, rgba(100, 100, 100, 0) 51%), -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgb(60, 60, 60)), color-stop(70%, rgb(30, 30, 30)), color-stop(100%, rgb(25, 25, 25))), -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgb(10, 10, 10)), color-stop(50%, rgb(20, 20, 20)), color-stop(100%, rgb(10, 10, 10))) !important; background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, no-repeat !important; background-position: 49.5% center, 50.5% center, center center, left top !important; - background-size: 5px 5px, 5px 5px, 3% 100%, 100% 100%; + background-size: 5px 5px, 5px 5px, 3% 100%, 100% 100% !important; } .documentBar { -- cgit v1.2.3 From c00ba985a16ca0a229089243c6e04280cbff758c Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Date: Mon, 6 Aug 2012 10:29:47 -0700 Subject: Fix: Added support for code/design view switching for banner templates Fixed a bug with toggling views on banner templates, I was not handling meta data correctly nor parsing the document between the switching. This is a temp fix, should be better implement when dynamic sizing is added to the templates. --- js/components/layout/document-bar.reel/document-bar.js | 4 ++-- js/document/document-html.js | 8 ++++++++ 2 files changed, 10 insertions(+), 2 deletions(-) diff --git a/js/components/layout/document-bar.reel/document-bar.js b/js/components/layout/document-bar.reel/document-bar.js index 098e9e68..88c4a24b 100755 --- a/js/components/layout/document-bar.reel/document-bar.js +++ b/js/components/layout/document-bar.reel/document-bar.js @@ -246,7 +246,7 @@ exports.DocumentBar = Montage.create(Component, { file: this._currentDocument.model.file, webgl: this._currentDocument.model.webGlHelper.glData, styles: this._currentDocument.model.getStyleSheets(), - template: this._currentDocument.fileTemplate, + template: this._currentDocument.model.fileTemplate, document: this._currentDocument.model.views.design.iframe.contentWindow.document, head: this._currentDocument.model.views.design.iframe.contentWindow.document.head, body: this._currentDocument.model.views.design.iframe.contentWindow.document.body, @@ -256,7 +256,7 @@ exports.DocumentBar = Montage.create(Component, { doc = this._currentDocument.model.views.code.textArea.value; } //Reloading the document from changes made - this._currentDocument.reloadView(view, this.fileTemplate, doc); + this._currentDocument.reloadView(view, doc.template, doc); } } }, diff --git a/js/document/document-html.js b/js/document/document-html.js index f3163339..d610c69d 100755 --- a/js/document/document-html.js +++ b/js/document/document-html.js @@ -157,6 +157,14 @@ exports.HtmlDocument = Montage.create(Component, { this.model.views.design.show(); this.model.views.design.iframe.style.opacity = 0; this.model.views.design.content = this.application.ninja.ioMediator.tmplt.parseHtmlToNinjaTemplate(doc); + // + if (!template) { + if (this.model.views.design.content.body.indexOf('Ninja-Banner Dimensions@@@') !== -1) { + dimensions = (this.model.views.design.content.body.split('Ninja-Banner Dimensions@@@'))[1].split('-->')[0].split('x'); + dimensions = {width: parseInt(dimensions[0]), height: parseInt(dimensions[1])}; + template = {type: 'banner', size: dimensions}; + } + } //TODO: Improve reference (probably through binding values) this.model.views.design._webGlHelper = this.model.webGlHelper; //Rendering design view, using observers to know when template is ready -- cgit v1.2.3 From d9f3774aca7a2b1da5adb77f205a05f7f3e097b5 Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Date: Wed, 8 Aug 2012 12:36:50 -0700 Subject: Fix: Using array buffer views for deprecated APIs This addresses issues with Chrome Canary warnings related to library file copying. Please test fully before merging. --- js/io/system/chromeapi.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/js/io/system/chromeapi.js b/js/io/system/chromeapi.js index e33406ee..63bf2093 100644 --- a/js/io/system/chromeapi.js +++ b/js/io/system/chromeapi.js @@ -137,7 +137,7 @@ exports.ChromeApi = Montage.create(Object.prototype, { break; } // - blob = new Blob([content], {type: type}); + blob = new Blob([new Uint8Array(content)], {type: type}); // writer.write(blob); // @@ -169,7 +169,7 @@ exports.ChromeApi = Montage.create(Object.prototype, { var reader = new FileReader(); reader.onloadend = function(e) { if (callback) { - callback({content: this.result, data: file, file: f, url: f.toURL()}); + callback({content: new Uint8Array(this.result), data: file, file: f, url: f.toURL()}); } }; reader.readAsArrayBuffer(file); -- cgit v1.2.3 From 74cda8443e4f3c6f3e29b5bf99c3615339a982a3 Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Wed, 8 Aug 2012 15:02:19 -0700 Subject: IKNinja_1892 - [3D] Multiple objects fly off screen when translating in Z-axis. Signed-off-by: Nivesh Rajbhandari --- js/tools/Translate3DToolBase.js | 4 ++-- js/tools/TranslateObject3DTool.js | 19 ++++++++----------- 2 files changed, 10 insertions(+), 13 deletions(-) diff --git a/js/tools/Translate3DToolBase.js b/js/tools/Translate3DToolBase.js index b5008666..fd275a8a 100755 --- a/js/tools/Translate3DToolBase.js +++ b/js/tools/Translate3DToolBase.js @@ -166,7 +166,7 @@ exports.Translate3DToolBase = Montage.create(ModifierToolBase, var len = selectedElements.length, self = this, - target = selectedElements[0], + target = this.clickedObject, curMat = viewUtils.getMatrixFromElement( target ), matInv = glmat4.inverse(this._startMat, []), nMat = glmat4.multiply(transMat, this._startMat, [] ); @@ -180,7 +180,7 @@ exports.Translate3DToolBase = Montage.create(ModifierToolBase, var shouldUpdateStartMat = true; - if(this._clickedOnStage || ((this._handleMode === 2) && (len > 1))) + if(this._clickedOnStage || ((this._handleMode !== null) && (len > 1))) { shouldUpdateStartMat = false; } diff --git a/js/tools/TranslateObject3DTool.js b/js/tools/TranslateObject3DTool.js index a3ece1f9..5dfd2029 100755 --- a/js/tools/TranslateObject3DTool.js +++ b/js/tools/TranslateObject3DTool.js @@ -77,15 +77,12 @@ exports.TranslateObject3DTool = Montage.create(Translate3DToolBase, { else { this._delta = null; - //if(this._handleMode === 2) { - this._dragPlane = viewUtils.getNormalToUnprojectedElementPlane(this._target, this._handleMode, this._inLocalMode); - //console.log( "dragPlane: " + this._dragPlane ); - snapManager.setupDragPlaneFromPlane(this._dragPlane); - do3DSnap = false; - - snapManager.enableElementSnap ( false ); - snapManager.enableGridSnap ( false ); - //} + this._dragPlane = viewUtils.getNormalToUnprojectedElementPlane(this._target, this._handleMode, (this._inLocalMode && (this.application.ninja.selectedElements.length === 1))); + snapManager.setupDragPlaneFromPlane(this._dragPlane); + do3DSnap = false; + + snapManager.enableElementSnap ( false ); + snapManager.enableGridSnap ( false ); } if(this.application.ninja.selectedElements.length) { @@ -95,7 +92,7 @@ exports.TranslateObject3DTool = Montage.create(Translate3DToolBase, { // a snap on the mouse down var hitRec = snapManager.snap(point.x, point.y, do3DSnap); - if(this._handleMode === 2) + if(this._handleMode !== null) { // translate z doesn't snap to element so hitRec's element will always be different // from what the browser says we clicked on. So, skip this check. @@ -135,7 +132,7 @@ exports.TranslateObject3DTool = Montage.create(Translate3DToolBase, { snapManager.enableSnapAlign( snapManager.snapAlignEnabledAppLevel() ); } - if(this._handleMode === 2) + if(this._handleMode !== null) this.clickedObject = this._target; // parameterize the snap point on the target -- cgit v1.2.3 From e2200a5545d6125b4c7f760cbfd39b90dea5ccb4 Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Date: Thu, 9 Aug 2012 09:58:32 -0700 Subject: Fix: Adding browser check to implement fix for deprecated array/blob APIs This check should be removed once version 22 of Chrome is made stable. Please test before merging. --- js/io/system/chromeapi.js | 19 ++++++++++++++----- 1 file changed, 14 insertions(+), 5 deletions(-) diff --git a/js/io/system/chromeapi.js b/js/io/system/chromeapi.js index 63bf2093..b13dd9de 100644 --- a/js/io/system/chromeapi.js +++ b/js/io/system/chromeapi.js @@ -96,7 +96,7 @@ exports.ChromeApi = Montage.create(Object.prototype, { // f.createWriter(function(writer) { // - var mime, blob, type = filePath.split('.'); + var mime, blob, type = filePath.split('.'), version = parseInt(window.navigator.appVersion.match(/Chrome\/(\d+)\./)[1], 10); type = type[type.length-1]; switch (type) { case 'bmp': @@ -136,8 +136,12 @@ exports.ChromeApi = Montage.create(Object.prototype, { mime = 'text/'+type; break; } - // - blob = new Blob([new Uint8Array(content)], {type: type}); + //TODO: Remove version checking once Chrome version 22 is stable + if (version > 21) { + blob = new Blob([new Uint8Array(content)], {type: type}); + } else { + blob = new Blob([content], {type: type}); + } // writer.write(blob); // @@ -166,10 +170,15 @@ exports.ChromeApi = Montage.create(Object.prototype, { // this.fileSystem.root.getFile(filePath, {}, function(f) { f.file(function(file) { - var reader = new FileReader(); + var reader = new FileReader(), version = parseInt(window.navigator.appVersion.match(/Chrome\/(\d+)\./)[1], 10); reader.onloadend = function(e) { if (callback) { - callback({content: new Uint8Array(this.result), data: file, file: f, url: f.toURL()}); + //TODO: Remove version checking once Chrome version 22 is stable + if (version > 21) { + callback({content: new Uint8Array(this.result), data: file, file: f, url: f.toURL()}); + } else { + callback({content: this.result, data: file, file: f, url: f.toURL()}); + } } }; reader.readAsArrayBuffer(file); -- cgit v1.2.3 From c88752d621069b12f978c1fd88ffdd52537a4657 Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Wed, 15 Aug 2012 12:21:20 -0700 Subject: Allow rectangle and oval shapes to be created with 0 px stroke size. Line shapes' stroke size will still be restricted to a minimum of 1 px. Signed-off-by: Nivesh Rajbhandari --- .../shape-properties.reel/shape-properties.html | 2 +- .../shape-properties.reel/shape-properties.js | 2 + js/data/pi/pi-data.js | 2 +- js/lib/geom/circle.js | 94 +++++++++++----------- js/lib/geom/rectangle.js | 2 +- 5 files changed, 53 insertions(+), 49 deletions(-) diff --git a/js/components/tools-properties/shape-properties.reel/shape-properties.html b/js/components/tools-properties/shape-properties.reel/shape-properties.html index 7503f257..959feec6 100755 --- a/js/components/tools-properties/shape-properties.reel/shape-properties.html +++ b/js/components/tools-properties/shape-properties.reel/shape-properties.html @@ -66,7 +66,7 @@ POSSIBILITY OF SUCH DAMAGE. "prototype": "js/components/hottextunit.reel[HotTextUnit]", "properties": { "element": {"#": "strokeControl"}, - "minValue": 1, + "minValue": 0, "maxValue": 100, "value": 1, "decimalPlace": 10, diff --git a/js/components/tools-properties/shape-properties.reel/shape-properties.js b/js/components/tools-properties/shape-properties.reel/shape-properties.js index 40ad0dd0..c5b22188 100755 --- a/js/components/tools-properties/shape-properties.reel/shape-properties.js +++ b/js/components/tools-properties/shape-properties.reel/shape-properties.js @@ -209,12 +209,14 @@ var ShapeProperties = exports.ShapeProperties = Montage.create(ToolProperties, { this._fillColorCtrlIcon.style["display"] = "none"; this._fillColorCtrlIcon.visible = false; this.endDivider.style["display"] = "none"; + this._strokeSize.minValue = 1; } else { this._fillColorCtrlContainer.style["display"] = ""; this._fillColorCtrlContainer.visible = true; this._fillColorCtrlIcon.style["display"] = ""; this._fillColorCtrlIcon.visible = true; this.endDivider.style["display"] = ""; + this._strokeSize.minValue = 0; } if (this._useWebGL.checked) { diff --git a/js/data/pi/pi-data.js b/js/data/pi/pi-data.js index f36f11e6..489938d5 100755 --- a/js/data/pi/pi-data.js +++ b/js/data/pi/pi-data.js @@ -499,7 +499,7 @@ exports.PiData = Montage.create( Montage, { prop : "strokeSize", label : "Stroke", inputFunction: parseFloat, - min : 0, + min : 1, max : 100, value : 1, unit : "px", diff --git a/js/lib/geom/circle.js b/js/lib/geom/circle.js index 4995c2cb..28a99956 100755 --- a/js/lib/geom/circle.js +++ b/js/lib/geom/circle.js @@ -669,53 +669,33 @@ exports.Circle = Object.create(GeomObj, { mat[5] = yScale; // set up the stroke style - ctx.beginPath(); - ctx.lineWidth = lineWidth; - if (this._strokeColor) { - if(this._strokeColor.gradientMode) { - if(this._strokeColor.gradientMode === "radial") { - gradient = ctx.createRadialGradient(xCtr, yCtr, 0, - xCtr, yCtr, 0.5*Math.max(this._height, this._width)); - } else { - gradient = ctx.createLinearGradient(0, this._height/2, this._width, this._height/2); - } - colors = this._strokeColor.color; - - len = colors.length; - - for(j=0; j 0) { + ctx.beginPath(); + ctx.lineWidth = lineWidth; + if (this._strokeColor) { + if(this._strokeColor.gradientMode) { + if(this._strokeColor.gradientMode === "radial") { + gradient = ctx.createRadialGradient(xCtr, yCtr, 0, + xCtr, yCtr, 0.5*Math.max(this._height, this._width)); + } else { + gradient = ctx.createLinearGradient(0, this._height/2, this._width, this._height/2); + } + colors = this._strokeColor.color; - } else { - c = "rgba(" + 255*this._strokeColor[0] + "," + 255*this._strokeColor[1] + "," + 255*this._strokeColor[2] + "," + this._strokeColor[3] + ")"; - ctx.strokeStyle = c; - } - // draw the stroke - p = MathUtils.transformPoint( bezPts[0], mat ); - ctx.moveTo( p[0], p[1] ); - index = 1; - while (index < n) { - var p0 = MathUtils.transformPoint( bezPts[index], mat ); - var p1 = MathUtils.transformPoint( bezPts[index+1], mat ); + len = colors.length; - var x0 = p0[0], y0 = p0[1], - x1 = p1[0], y1 = p1[1]; - ctx.quadraticCurveTo( x0, y0, x1, y1 ); - index += 2; - } + for(j=0; j 0) { - // calculate the stroke matrix - xScale = 0.5*innerRad*this._width - 0.5*lineWidth; - yScale = 0.5*innerRad*this._height - 0.5*lineWidth; - mat[0] = xScale; - mat[5] = yScale; + ctx.strokeStyle = gradient; + } else { + c = "rgba(" + 255*this._strokeColor[0] + "," + 255*this._strokeColor[1] + "," + 255*this._strokeColor[2] + "," + this._strokeColor[3] + ")"; + ctx.strokeStyle = c; + } // draw the stroke p = MathUtils.transformPoint( bezPts[0], mat ); ctx.moveTo( p[0], p[1] ); @@ -729,10 +709,32 @@ exports.Circle = Object.create(GeomObj, { ctx.quadraticCurveTo( x0, y0, x1, y1 ); index += 2; } - } - // render the stroke - ctx.stroke(); + if (MathUtils.fpSign(innerRad) > 0) { + // calculate the stroke matrix + xScale = 0.5*innerRad*this._width - 0.5*lineWidth; + yScale = 0.5*innerRad*this._height - 0.5*lineWidth; + mat[0] = xScale; + mat[5] = yScale; + + // draw the stroke + p = MathUtils.transformPoint( bezPts[0], mat ); + ctx.moveTo( p[0], p[1] ); + index = 1; + while (index < n) { + var p0 = MathUtils.transformPoint( bezPts[index], mat ); + var p1 = MathUtils.transformPoint( bezPts[index+1], mat ); + + var x0 = p0[0], y0 = p0[1], + x1 = p1[0], y1 = p1[1]; + ctx.quadraticCurveTo( x0, y0, x1, y1 ); + index += 2; + } + } + + // render the stroke + ctx.stroke(); + } } } } diff --git a/js/lib/geom/rectangle.js b/js/lib/geom/rectangle.js index f3db92af..b34a97ab 100755 --- a/js/lib/geom/rectangle.js +++ b/js/lib/geom/rectangle.js @@ -603,7 +603,7 @@ exports.Rectangle = Object.create(GeomObj, { // render the stroke ctx.beginPath(); - if (this._strokeColor) { + if (this._strokeColor && (lw > 0)) { inset = Math.ceil( 0.5*lw ) - 0.5; if(this._strokeColor.gradientMode) { -- cgit v1.2.3