From 52fac825174d16e3ff6875fc497d3f3cfaf4812c Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Wed, 21 Mar 2012 12:02:36 -0700 Subject: Get matrix and perspective distance from styles controller. Signed-off-by: Nivesh Rajbhandari --- js/models/properties-3d.js | 50 ++++++++++++++++++++++------------------------ 1 file changed, 24 insertions(+), 26 deletions(-) (limited to 'js/models') diff --git a/js/models/properties-3d.js b/js/models/properties-3d.js index 0f82dc48..087e794f 100755 --- a/js/models/properties-3d.js +++ b/js/models/properties-3d.js @@ -5,7 +5,8 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot */ var Montage = require("montage/core/core").Montage, - Component = require("montage/ui/component").Component; + Component = require("montage/ui/component").Component, + NJUtils = require("js/lib/NJUtils").NJUtils; exports.Properties3D = Montage.create(Component, { @@ -39,16 +40,7 @@ exports.Properties3D = Montage.create(Component, { elementPlane : { value : null, enumerable: true}, init : { - value : function(elt) { - - this.m_azimuth = 0.0; - this.m_altitude = 0.0; - - this.m_endAzimuth = 0.0; - this.m_endAltitude = 0.0; - - this.m_transformCtr = null; - this.perspectiveDist = 1400; + value : function(elt, isStage) { // this.m_upVector = [0,1,0]; // this.m_viewDir = [0,0,1]; @@ -57,23 +49,29 @@ exports.Properties3D = Montage.create(Component, { // this.m_targetPos = [0,0,0]; // this.m_objStartPos = [0,0,0]; -// var mat = this.application.ninja.stage.stageDeps.viewUtils.getMatrixFromElement(elt).slice(0); -// var elt3DInfo = MathUtils.decomposeMatrix2(mat); -// if(elt3DInfo) -// { -// this.xAngle = ~~(elt3DInfo.rotation[0] * MathUtils.RAD_TO_DEG); -// this.yAngle = ~~(elt3DInfo.rotation[1] * MathUtils.RAD_TO_DEG); -// this.zAngle = ~~(elt3DInfo.rotation[2] * MathUtils.RAD_TO_DEG); -// -// this.x3D = ~~(elt3DInfo.translation[0]); -// this.y3D = ~~(elt3DInfo.translation[1]); -// this.z3D = ~~(elt3DInfo.translation[2]); -// -// this.matrix3d = mat; -// } + this.matrix3d = this.application.ninja.stylesController.getMatrixFromElement(elt, isStage); + this.perspectiveDist = this.application.ninja.stylesController.getPerspectiveDistFromElement(elt, isStage); - return this; + if(this.matrix3d) { + var elt3DInfo = MathUtils.decomposeMatrix2(this.matrix3d); + if(elt3DInfo) { + this.xAngle = ~~(elt3DInfo.rotation[0] * MathUtils.RAD_TO_DEG); + this.yAngle = ~~(elt3DInfo.rotation[1] * MathUtils.RAD_TO_DEG); + this.zAngle = ~~(elt3DInfo.rotation[2] * MathUtils.RAD_TO_DEG); + this.x3D = ~~(elt3DInfo.translation[0]); + this.y3D = ~~(elt3DInfo.translation[1]); + this.z3D = ~~(elt3DInfo.translation[2]); + } + } else { + this.matrix3d = Matrix.I(4); + } + + if(this.perspectiveDist === null) { + this.perspectiveDist = 1400; + } + + return this; } }, -- cgit v1.2.3 From 62438ba52de51bb8ae20de07ec2f4dad55b9a929 Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Tue, 27 Mar 2012 10:32:26 -0700 Subject: Build elements' properties3d values on file open. Signed-off-by: Nivesh Rajbhandari --- js/models/properties-3d.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'js/models') diff --git a/js/models/properties-3d.js b/js/models/properties-3d.js index 087e794f..0a7cf8bb 100755 --- a/js/models/properties-3d.js +++ b/js/models/properties-3d.js @@ -67,7 +67,7 @@ exports.Properties3D = Montage.create(Component, { this.matrix3d = Matrix.I(4); } - if(this.perspectiveDist === null) { + if(this.perspectiveDist == null) { this.perspectiveDist = 1400; } -- cgit v1.2.3 From 5b4f6b1618cf571a6bce5a631f976a008e04a64e Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Thu, 29 Mar 2012 15:52:08 -0700 Subject: Updated shapes to always check for its stroke and fill colors and materials instead of relying on the shapeModel cache because it can get out of sync. Signed-off-by: Nivesh Rajbhandari --- js/models/color-model.js | 56 +++++++++++++++++++++++++++++++++++++++--------- js/models/shape-model.js | 7 ------ 2 files changed, 46 insertions(+), 17 deletions(-) (limited to 'js/models') diff --git a/js/models/color-model.js b/js/models/color-model.js index 4189fbef..764feeb5 100755 --- a/js/models/color-model.js +++ b/js/models/color-model.js @@ -589,18 +589,54 @@ exports.ColorModel = Montage.create(Component, { } }, //////////////////////////////////////////////////////////////////// - //Returns CSS string given a WebGL color array in [r, g, b, a] format where the values are [0,1] - webGlToCss: { + //Returns a color object given a WebGL color array/object with gradient stops + webGlToColor: { enumerable: true, - value: function (color) { - if(color && (color.length === 4)) - { - return 'rgba(' + color[0]*255 + ', ' + color[1]*255 + ', ' + color[2]*255 + ', ' + color[3] +')'; - } - else - { - return null; + value: function (c) { + if(c) { + if(c.gradientMode) { + // Gradient + var i = 0, + len, + css, + stops = c.color, + gradient; + + // Create the CSS string + if (c.gradientMode === 'radial') { + css = '-webkit-radial-gradient(center, ellipse cover'; + } else { + css = '-webkit-gradient(linear, left top, right top'; + } + + //Sorting array (must be sorted for radial gradients, at least in Chrome + stops.sort(function(a,b){return a.position - b.position}); + //Looping through stops in gradient to create CSS + + len = stops.length; + for (i=0; i < len; i++) { + //Adding to CSS String + if (c.gradientMode === 'radial' && stops[i].value) { + css += ', '+stops[i].value.css+' '+stops[i].position+'% '; + } else if (stops[i].value){ + css += ', color-stop('+stops[i].position+'%,'+stops[i].value.css+')'; + } + } + //Closing the CSS strings + css += ')'; + + gradient = {stops: c.color, mode: c.gradientMode, gradientMode: c.gradientMode, css: css}; + return {mode: 'gradient', value: gradient, color: gradient}; + } else if(c.length === 4) { + // CSS + return this.application.ninja.colorController.getColorObjFromCss('rgba(' + c[0]*255 + ', ' + + c[1]*255 + ', ' + + c[2]*255 + ', ' + + c[3] +')'); + } } + + return null; } } //////////////////////////////////////////////////////////////////// diff --git a/js/models/shape-model.js b/js/models/shape-model.js index ea8c2cfc..ff69ae3c 100755 --- a/js/models/shape-model.js +++ b/js/models/shape-model.js @@ -17,15 +17,8 @@ exports.ShapeModel = Montage.create(Component, { GLGeomObj: { value: null }, strokeSize: { value: null }, - stroke: { value: null }, - strokeMaterial: { value: null }, strokeStyle: { value: null }, strokeStyleIndex: { value: null }, - border: { value: null }, // Store css value for ColorController - - fill: { value: null }, - fillMaterial: { value: null }, - background: { value: null }, // Store css value for ColorController // Line-specific slope: { value: null }, -- cgit v1.2.3 From 952e0b2c28af081041fa8987c3e865b931d052fa Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Mon, 9 Apr 2012 16:04:24 -0700 Subject: Single perspective fix. Note that rotating multiple objects when the stage is rotated still doesn't work and flatten still doesn't work. Signed-off-by: Nivesh Rajbhandari --- js/models/properties-3d.js | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) (limited to 'js/models') diff --git a/js/models/properties-3d.js b/js/models/properties-3d.js index 0a7cf8bb..c1270c3b 100755 --- a/js/models/properties-3d.js +++ b/js/models/properties-3d.js @@ -67,10 +67,6 @@ exports.Properties3D = Montage.create(Component, { this.matrix3d = Matrix.I(4); } - if(this.perspectiveDist == null) { - this.perspectiveDist = 1400; - } - return this; } }, @@ -94,7 +90,7 @@ exports.Properties3D = Montage.create(Component, { ResetTranslationValues : { value : function() { // this.m_objStartPos = [0,0,0]; - this.perspectiveDist = 1400; +// this.perspectiveDist = 1400; } } }); \ No newline at end of file -- cgit v1.2.3