New build scripts

git-svn-id: https://svn.alfresco.com/repos/alfresco-enterprise/alfresco/HEAD/root@5282 c4b6b30b-aa2e-2d43-bbcb-ca4b014f7261
This commit is contained in:
Gavin Cornwell
2007-03-04 19:05:34 +00:00
parent 04f9a2e7bc
commit 838e7d5381
845 changed files with 121780 additions and 183 deletions

View File

@@ -0,0 +1,820 @@
/*
Copyright (c) 2004-2006, The Dojo Foundation
All Rights Reserved.
Licensed under the Academic Free License version 2.1 or above OR the
modified BSD license. For more information on Dojo licensing, see:
http://dojotoolkit.org/community/licensing.shtml
*/
dojo.provide("dojo.gfx.Colorspace");
dojo.require("dojo.lang.common");
dojo.require("dojo.math.matrix");
// to convert to YUV:
// c.whitePoint = 'D65';
// c.RGBWorkingSpace = 'pal_secam_rgb';
// var out = c.convert([r,g,b], 'RGB', 'XYZ');
//
// to convert to YIQ:
// c.whitePoint = 'D65';
// c.RGBWorkingSpace = 'ntsc_rgb';
// var out = c.convert([r,g,b], 'RGB', 'XYZ');
//
dojo.gfx.Colorspace = function(){
// summary
// An object for dealing with colorspace conversions.
this.whitePoint = 'D65';
this.stdObserver = '10';
this.chromaticAdaptationAlg = 'bradford';
this.RGBWorkingSpace = 's_rgb';
this.useApproxCIELabMapping = 1; // see http://www.brucelindbloom.com/LContinuity.html
this.chainMaps = {
'RGB_to_xyY' : ['XYZ'],
'xyY_to_RGB' : ['XYZ'],
'RGB_to_Lab' : ['XYZ'],
'Lab_to_RGB' : ['XYZ'],
'RGB_to_LCHab': ['XYZ', 'Lab'],
'LCHab_to_RGB': ['Lab'],
'xyY_to_Lab' : ['XYZ'],
'Lab_to_xyY' : ['XYZ'],
'XYZ_to_LCHab': ['Lab'],
'LCHab_to_XYZ': ['Lab'],
'xyY_to_LCHab': ['XYZ', 'Lab'],
'LCHab_to_xyY': ['Lab', 'XYZ'],
'RGB_to_Luv' : ['XYZ'],
'Luv_to_RGB' : ['XYZ'],
'xyY_to_Luv' : ['XYZ'],
'Luv_to_xyY' : ['XYZ'],
'Lab_to_Luv' : ['XYZ'],
'Luv_to_Lab' : ['XYZ'],
'LCHab_to_Luv': ['Lab', 'XYZ'],
'Luv_to_LCHab': ['XYZ', 'Lab'],
'RGB_to_LCHuv' : ['XYZ', 'Luv'],
'LCHuv_to_RGB' : ['Luv', 'XYZ'],
'XYZ_to_LCHuv' : ['Luv'],
'LCHuv_to_XYZ' : ['Luv'],
'xyY_to_LCHuv' : ['XYZ', 'Luv'],
'LCHuv_to_xyY' : ['Luv', 'XYZ'],
'Lab_to_LCHuv' : ['XYZ', 'Luv'],
'LCHuv_to_Lab' : ['Luv', 'XYZ'],
'LCHab_to_LCHuv': ['Lab', 'XYZ', 'Luv'],
'LCHuv_to_LCHab': ['Luv', 'XYZ', 'Lab'],
'XYZ_to_CMY' : ['RGB'],
'CMY_to_XYZ' : ['RGB'],
'xyY_to_CMY' : ['RGB'],
'CMY_to_xyY' : ['RGB'],
'Lab_to_CMY' : ['RGB'],
'CMY_to_Lab' : ['RGB'],
'LCHab_to_CMY' : ['RGB'],
'CMY_to_LCHab' : ['RGB'],
'Luv_to_CMY' : ['RGB'],
'CMY_to_Luv' : ['RGB'],
'LCHuv_to_CMY' : ['RGB'],
'CMY_to_LCHuv' : ['RGB'],
'XYZ_to_HSL' : ['RGB'],
'HSL_to_XYZ' : ['RGB'],
'xyY_to_HSL' : ['RGB'],
'HSL_to_xyY' : ['RGB'],
'Lab_to_HSL' : ['RGB'],
'HSL_to_Lab' : ['RGB'],
'LCHab_to_HSL' : ['RGB'],
'HSL_to_LCHab' : ['RGB'],
'Luv_to_HSL' : ['RGB'],
'HSL_to_Luv' : ['RGB'],
'LCHuv_to_HSL' : ['RGB'],
'HSL_to_LCHuv' : ['RGB'],
'CMY_to_HSL' : ['RGB'],
'HSL_to_CMY' : ['RGB'],
'CMYK_to_HSL' : ['RGB'],
'HSL_to_CMYK' : ['RGB'],
'XYZ_to_HSV' : ['RGB'],
'HSV_to_XYZ' : ['RGB'],
'xyY_to_HSV' : ['RGB'],
'HSV_to_xyY' : ['RGB'],
'Lab_to_HSV' : ['RGB'],
'HSV_to_Lab' : ['RGB'],
'LCHab_to_HSV' : ['RGB'],
'HSV_to_LCHab' : ['RGB'],
'Luv_to_HSV' : ['RGB'],
'HSV_to_Luv' : ['RGB'],
'LCHuv_to_HSV' : ['RGB'],
'HSV_to_LCHuv' : ['RGB'],
'CMY_to_HSV' : ['RGB'],
'HSV_to_CMY' : ['RGB'],
'CMYK_to_HSV' : ['RGB'],
'HSV_to_CMYK' : ['RGB'],
'HSL_to_HSV' : ['RGB'],
'HSV_to_HSL' : ['RGB'],
'XYZ_to_CMYK' : ['RGB'],
'CMYK_to_XYZ' : ['RGB'],
'xyY_to_CMYK' : ['RGB'],
'CMYK_to_xyY' : ['RGB'],
'Lab_to_CMYK' : ['RGB'],
'CMYK_to_Lab' : ['RGB'],
'LCHab_to_CMYK' : ['RGB'],
'CMYK_to_LCHab' : ['RGB'],
'Luv_to_CMYK' : ['RGB'],
'CMYK_to_Luv' : ['RGB'],
'LCHuv_to_CMYK' : ['RGB'],
'CMYK_to_LCHuv' : ['RGB']
};
return this;
}
dojo.gfx.Colorspace.prototype.convert = function(col, model_from, model_to){
var k = model_from+'_to_'+model_to;
if (this[k]){
return this[k](col);
}else{
if (this.chainMaps[k]){
var cur = model_from;
var models = this.chainMaps[k].concat();
models.push(model_to);
for(var i=0; i<models.length; i++){
col = this.convert(col, cur, models[i]);
cur = models[i];
}
return col;
}else{
dojo.debug("Can't convert from "+model_from+' to '+model_to);
}
}
}
dojo.gfx.Colorspace.prototype.munge = function(keys, args){
if (dojo.lang.isArray(args[0])){
args = args[0];
}
var out = new Array();
for (var i=0; i<keys.length; i++){
out[keys.charAt(i)] = args[i];
}
return out;
}
dojo.gfx.Colorspace.prototype.getWhitePoint = function(){
var x = 0;
var y = 0;
var t = 0;
// ref: http://en.wikipedia.org/wiki/White_point
// TODO: i need some good/better white point values
switch(this.stdObserver){
case '2' :
switch(this.whitePoint){
case 'E' : x=1/3 ; y=1/3 ; t=5400; break; //Equal energy
case 'D50' : x=0.34567; y=0.35850; t=5000; break;
case 'D55' : x=0.33242; y=0.34743; t=5500; break;
case 'D65' : x=0.31271; y=0.32902; t=6500; break;
case 'D75' : x=0.29902; y=0.31485; t=7500; break;
case 'A' : x=0.44757; y=0.40745; t=2856; break; //Incandescent tungsten
case 'B' : x=0.34842; y=0.35161; t=4874; break;
case 'C' : x=0.31006; y=0.31616; t=6774; break;
case '9300': x=0.28480; y=0.29320; t=9300; break; //Blue phosphor monitors
case 'F2' : x=0.37207; y=0.37512; t=4200; break; //Cool White Fluorescent
case 'F7' : x=0.31285; y=0.32918; t=6500; break; //Narrow Band Daylight Fluorescent
case 'F11' : x=0.38054; y=0.37691; t=4000; break; //Narrow Band White Fluorescent
default: dojo.debug('White point '+this.whitePoint+" isn't defined for Std. Observer "+this.strObserver);
};
break;
case '10' :
switch(this.whitePoint){
case 'E' : x=1/3 ; y=1/3 ; t=5400; break; //Equal energy
case 'D50' : x=0.34773; y=0.35952; t=5000; break;
case 'D55' : x=0.33411; y=0.34877; t=5500; break;
case 'D65' : x=0.31382; y=0.33100; t=6500; break;
case 'D75' : x=0.29968; y=0.31740; t=7500; break;
case 'A' : x=0.45117; y=0.40594; t=2856; break; //Incandescent tungsten
case 'B' : x=0.3498 ; y=0.3527 ; t=4874; break;
case 'C' : x=0.31039; y=0.31905; t=6774; break;
case 'F2' : x=0.37928; y=0.36723; t=4200; break; //Cool White Fluorescent
case 'F7' : x=0.31565; y=0.32951; t=6500; break; //Narrow Band Daylight Fluorescent
case 'F11' : x=0.38543; y=0.37110; t=4000; break; //Narrow Band White Fluorescent
default: dojo.debug('White point '+this.whitePoint+" isn't defined for Std. Observer "+this.strObserver);
};
break;
default:
dojo.debug("Std. Observer "+this.strObserver+" isn't defined");
}
var z = 1 - x - y;
var wp = {'x':x, 'y':y, 'z':z, 't':t};
wp.Y = 1;
var XYZ = this.xyY_to_XYZ([wp.x, wp.y, wp.Y]);
wp.X = XYZ[0];
wp.Y = XYZ[1];
wp.Z = XYZ[2];
return wp;
}
dojo.gfx.Colorspace.prototype.getPrimaries = function(){
// ref: http://www.fho-emden.de/~hoffmann/ciexyz29082000.pdf
// ref: http://www.brucelindbloom.com/index.html?Eqn_RGB_XYZ_Matrix.html
var m = [];
switch(this.RGBWorkingSpace){
case 'adobe_rgb_1998' : m = [2.2, 'D65', 0.6400, 0.3300, 0.297361, 0.2100, 0.7100, 0.627355, 0.1500, 0.0600, 0.075285]; break;
case 'apple_rgb' : m = [1.8, 'D65', 0.6250, 0.3400, 0.244634, 0.2800, 0.5950, 0.672034, 0.1550, 0.0700, 0.083332]; break;
case 'best_rgb' : m = [2.2, 'D50', 0.7347, 0.2653, 0.228457, 0.2150, 0.7750, 0.737352, 0.1300, 0.0350, 0.034191]; break;
case 'beta_rgb' : m = [2.2, 'D50', 0.6888, 0.3112, 0.303273, 0.1986, 0.7551, 0.663786, 0.1265, 0.0352, 0.032941]; break;
case 'bruce_rgb' : m = [2.2, 'D65', 0.6400, 0.3300, 0.240995, 0.2800, 0.6500, 0.683554, 0.1500, 0.0600, 0.075452]; break;
case 'cie_rgb' : m = [2.2, 'E' , 0.7350, 0.2650, 0.176204, 0.2740, 0.7170, 0.812985, 0.1670, 0.0090, 0.010811]; break;
case 'color_match_rgb' : m = [1.8, 'D50', 0.6300, 0.3400, 0.274884, 0.2950, 0.6050, 0.658132, 0.1500, 0.0750, 0.066985]; break;
case 'don_rgb_4' : m = [2.2, 'D50', 0.6960, 0.3000, 0.278350, 0.2150, 0.7650, 0.687970, 0.1300, 0.0350, 0.033680]; break;
case 'eci_rgb' : m = [1.8, 'D50', 0.6700, 0.3300, 0.320250, 0.2100, 0.7100, 0.602071, 0.1400, 0.0800, 0.077679]; break;
case 'ekta_space_ps5' : m = [2.2, 'D50', 0.6950, 0.3050, 0.260629, 0.2600, 0.7000, 0.734946, 0.1100, 0.0050, 0.004425]; break;
case 'ntsc_rgb' : m = [2.2, 'C' , 0.6700, 0.3300, 0.298839, 0.2100, 0.7100, 0.586811, 0.1400, 0.0800, 0.114350]; break;
case 'pal_secam_rgb' : m = [2.2, 'D65', 0.6400, 0.3300, 0.222021, 0.2900, 0.6000, 0.706645, 0.1500, 0.0600, 0.071334]; break;
case 'pro_photo_rgb' : m = [1.8, 'D50', 0.7347, 0.2653, 0.288040, 0.1596, 0.8404, 0.711874, 0.0366, 0.0001, 0.000086]; break;
case 'smpte-c_rgb' : m = [2.2, 'D65', 0.6300, 0.3400, 0.212395, 0.3100, 0.5950, 0.701049, 0.1550, 0.0700, 0.086556]; break;
case 's_rgb' : m = [2.2, 'D65', 0.6400, 0.3300, 0.212656, 0.3000, 0.6000, 0.715158, 0.1500, 0.0600, 0.072186]; break;
case 'wide_gamut_rgb' : m = [2.2, 'D50', 0.7350, 0.2650, 0.258187, 0.1150, 0.8260, 0.724938, 0.1570, 0.0180, 0.016875]; break;
default: dojo.debug("RGB working space "+this.RGBWorkingSpace+" isn't defined");
}
var p = {
name: this.RGBWorkingSpace,
gamma:m[0],
wp:m[1],
xr:m[2],
yr:m[3],
Yr:m[4],
xg:m[5],
yg:m[6],
Yg:m[7],
xb:m[8],
yb:m[9],
Yb:m[10]
};
// if WP doesn't match current WP, convert the primaries over
if (p.wp != this.whitePoint){
var r = this.XYZ_to_xyY( this.chromaticAdaptation( this.xyY_to_XYZ([p.xr, p.yr, p.Yr]), p.wp, this.whitePoint ) );
var g = this.XYZ_to_xyY( this.chromaticAdaptation( this.xyY_to_XYZ([p.xg, p.yg, p.Yg]), p.wp, this.whitePoint ) );
var b = this.XYZ_to_xyY( this.chromaticAdaptation( this.xyY_to_XYZ([p.xb, p.yb, p.Yb]), p.wp, this.whitePoint ) );
p.xr = r[0];
p.yr = r[1];
p.Yr = r[2];
p.xg = g[0];
p.yg = g[1];
p.Yg = g[2];
p.xb = b[0];
p.yb = b[1];
p.Yb = b[2];
p.wp = this.whitePoint;
}
p.zr = 1 - p.xr - p.yr;
p.zg = 1 - p.xg - p.yg;
p.zb = 1 - p.xb - p.yb;
return p;
}
dojo.gfx.Colorspace.prototype.epsilon = function(){
return this.useApproxCIELabMapping ? 0.008856 : 216 / 24289;
}
dojo.gfx.Colorspace.prototype.kappa = function(){
return this.useApproxCIELabMapping ? 903.3 : 24389 / 27;
}
dojo.gfx.Colorspace.prototype.XYZ_to_xyY = function(){
var src = this.munge('XYZ', arguments);
var sum = src.X + src.Y + src.Z;
if (sum == 0){
var wp = this.getWhitePoint();
var x = wp.x;
var y = wp.y;
}else{
var x = src.X / sum;
var y = src.Y / sum;
}
var Y = src.Y;
return [x, y, Y];
}
dojo.gfx.Colorspace.prototype.xyY_to_XYZ = function(){
var src = this.munge('xyY', arguments);
if (src.y == 0){
var X = 0;
var Y = 0;
var Z = 0;
}else{
var X = (src.x * src.Y) / src.y;
var Y = src.Y;
var Z = ((1 - src.x - src.y) * src.Y) / src.y;
}
return [X, Y, Z];
}
dojo.gfx.Colorspace.prototype.RGB_to_XYZ = function(){
var src = this.munge('RGB', arguments);
var m = this.getRGB_XYZ_Matrix();
var pr = this.getPrimaries();
if (this.RGBWorkingSpace == 's_rgb'){
var r = (src.R > 0.04045) ? Math.pow(((src.R + 0.055) / 1.055), 2.4) : src.R / 12.92;
var g = (src.G > 0.04045) ? Math.pow(((src.G + 0.055) / 1.055), 2.4) : src.G / 12.92;
var b = (src.B > 0.04045) ? Math.pow(((src.B + 0.055) / 1.055), 2.4) : src.B / 12.92;
}else{
var r = Math.pow(src.R, pr.gamma);
var g = Math.pow(src.G, pr.gamma);
var b = Math.pow(src.B, pr.gamma);
}
var XYZ = dojo.math.matrix.multiply([[r, g, b]], m);
return [XYZ[0][0], XYZ[0][1], XYZ[0][2]];
}
dojo.gfx.Colorspace.prototype.XYZ_to_RGB = function(){
var src = this.munge('XYZ', arguments);
var mi = this.getXYZ_RGB_Matrix();
var pr = this.getPrimaries();
var rgb = dojo.math.matrix.multiply([[src.X, src.Y, src.Z]], mi);
var r = rgb[0][0];
var g = rgb[0][1];
var b = rgb[0][2];
if (this.RGBWorkingSpace == 's_rgb'){
var R = (r > 0.0031308) ? (1.055 * Math.pow(r, 1.0/2.4)) - 0.055 : 12.92 * r;
var G = (g > 0.0031308) ? (1.055 * Math.pow(g, 1.0/2.4)) - 0.055 : 12.92 * g;
var B = (b > 0.0031308) ? (1.055 * Math.pow(b, 1.0/2.4)) - 0.055 : 12.92 * b;
}else{
var R = Math.pow(r, 1/pr.gamma);
var G = Math.pow(g, 1/pr.gamma);
var B = Math.pow(b, 1/pr.gamma);
}
return [R, G, B];
}
dojo.gfx.Colorspace.prototype.XYZ_to_Lab = function(){
var src = this.munge('XYZ', arguments);
var wp = this.getWhitePoint();
var xr = src.X / wp.X;
var yr = src.Y / wp.Y;
var zr = src.Z / wp.Z;
var fx = (xr > this.epsilon()) ? Math.pow(xr, 1/3) : (this.kappa() * xr + 16) / 116;
var fy = (yr > this.epsilon()) ? Math.pow(yr, 1/3) : (this.kappa() * yr + 16) / 116;
var fz = (zr > this.epsilon()) ? Math.pow(zr, 1/3) : (this.kappa() * zr + 16) / 116;
var L = 116 * fy - 16;
var a = 500 * (fx - fy);
var b = 200 * (fy - fz);
return [L, a, b];
}
dojo.gfx.Colorspace.prototype.Lab_to_XYZ = function(){
var src = this.munge('Lab', arguments);
var wp = this.getWhitePoint();
var yr = (src.L > (this.kappa() * this.epsilon())) ? Math.pow((src.L + 16) / 116, 3) : src.L / this.kappa();
var fy = (yr > this.epsilon()) ? (src.L + 16) / 116 : (this.kappa() * yr + 16) / 116;
var fx = (src.a / 500) + fy;
var fz = fy - (src.b / 200);
var fxcube = Math.pow(fx, 3);
var fzcube = Math.pow(fz, 3);
var xr = (fxcube > this.epsilon()) ? fxcube : (116 * fx - 16) / this.kappa();
var zr = (fzcube > this.epsilon()) ? fzcube : (116 * fz - 16) / this.kappa();
var X = xr * wp.X;
var Y = yr * wp.Y;
var Z = zr * wp.Z;
return [X, Y, Z];
}
dojo.gfx.Colorspace.prototype.Lab_to_LCHab = function(){
var src = this.munge('Lab', arguments);
var L = src.L;
var C = Math.pow(src.a * src.a + src.b * src.b, 0.5);
var H = Math.atan2(src.b, src.a) * (180 / Math.PI);
if (H < 0){ H += 360; }
if (H > 360){ H -= 360; }
return [L, C, H];
}
dojo.gfx.Colorspace.prototype.LCHab_to_Lab = function(){
var src = this.munge('LCH', arguments);
var H_rad = src.H * (Math.PI / 180);
var L = src.L;
var a = src.C / Math.pow(Math.pow(Math.tan(H_rad), 2) + 1, 0.5);
if ((90 < src.H) && (src.H < 270)){ a= -a; }
var b = Math.pow(Math.pow(src.C, 2) - Math.pow(a, 2), 0.5);
if (src.H > 180){ b = -b; }
return [L, a, b];
}
//////////////////////////////////////////////////////////////////////////////////////////////////////
//
// this function converts an XYZ color array (col) from one whitepoint (src_w) to another (dst_w)
//
dojo.gfx.Colorspace.prototype.chromaticAdaptation = function(col, src_w, dst_w){
col = this.munge('XYZ', [col]);
var old_wp = this.whitePoint;
this.whitePoint = src_w;
var wp_src = this.getWhitePoint();
this.whitePoint = dst_w;
var wp_dst = this.getWhitePoint();
this.whitePoint = old_wp;
switch(this.chromaticAdaptationAlg){
case 'xyz_scaling':
var ma = [[1,0,0],[0,1,0],[0,0,1]];
var mai = [[1,0,0],[0,1,0],[0,0,1]];
break;
case 'bradford':
var ma = [[0.8951, -0.7502, 0.0389],[0.2664, 1.7135, -0.0685],[-0.1614, 0.0367, 1.0296]];
var mai = [[0.986993, 0.432305, -0.008529],[-0.147054, 0.518360, 0.040043],[0.159963, 0.049291, 0.968487]];
break;
case 'von_kries':
var ma = [[0.40024, -0.22630, 0.00000],[0.70760, 1.16532, 0.00000],[-0.08081, 0.04570, 0.91822]]
var mai = [[1.859936, 0.361191, 0.000000],[-1.129382, 0.638812, 0.000000],[0.219897, -0.000006, 1.089064]]
break;
default:
dojo.debug("The "+this.chromaticAdaptationAlg+" chromatic adaptation algorithm matricies are not defined");
}
var domain_src = dojo.math.matrix.multiply( [[wp_src.x, wp_src.y, wp_src.z]], ma);
var domain_dst = dojo.math.matrix.multiply( [[wp_dst.x, wp_dst.y, wp_dst.z]], ma);
var centre = [
[domain_dst[0][0]/domain_src[0][0], 0, 0],
[0, domain_dst[0][1]/domain_src[0][1], 0],
[0, 0, domain_dst[0][2]/domain_src[0][2]]
];
var m = dojo.math.matrix.multiply( dojo.math.matrix.multiply( ma, centre ), mai );
var dst = dojo.math.matrix.multiply( [[ col.X, col.Y, col.Z ]], m );
return dst[0];
}
//////////////////////////////////////////////////////////////////////////////////////////////////////
dojo.gfx.Colorspace.prototype.getRGB_XYZ_Matrix = function(){
var wp = this.getWhitePoint();
var pr = this.getPrimaries();
var Xr = pr.xr / pr.yr;
var Yr = 1;
var Zr = (1 - pr.xr - pr.yr) / pr.yr;
var Xg = pr.xg / pr.yg;
var Yg = 1;
var Zg = (1 - pr.xg - pr.yg) / pr.yg;
var Xb = pr.xb / pr.yb;
var Yb = 1;
var Zb = (1 - pr.xb - pr.yb) / pr.yb;
var m1 = [[Xr, Yr, Zr],[Xg, Yg, Zg],[Xb, Yb, Zb]];
var m2 = [[wp.X, wp.Y, wp.Z]];
var sm = dojo.math.matrix.multiply(m2, dojo.math.matrix.inverse(m1));
var Sr = sm[0][0];
var Sg = sm[0][1];
var Sb = sm[0][2];
var m4 = [[Sr*Xr, Sr*Yr, Sr*Zr],
[Sg*Xg, Sg*Yg, Sg*Zg],
[Sb*Xb, Sb*Yb, Sb*Zb]];
return m4;
}
dojo.gfx.Colorspace.prototype.getXYZ_RGB_Matrix = function(){
var m = this.getRGB_XYZ_Matrix();
return dojo.math.matrix.inverse(m);
}
dojo.gfx.Colorspace.prototype.XYZ_to_Luv = function(){
var src = this.munge('XYZ', arguments);
var wp = this.getWhitePoint();
var ud = (4 * src.X) / (src.X + 15 * src.Y + 3 * src.Z);
var vd = (9 * src.Y) / (src.X + 15 * src.Y + 3 * src.Z);
var udr = (4 * wp.X) / (wp.X + 15 * wp.Y + 3 * wp.Z);
var vdr = (9 * wp.Y) / (wp.X + 15 * wp.Y + 3 * wp.Z);
var yr = src.Y / wp.Y;
var L = (yr > this.epsilon()) ? 116 * Math.pow(yr, 1/3) - 16 : this.kappa() * yr;
var u = 13 * L * (ud-udr);
var v = 13 * L * (vd-vdr);
return [L, u, v];
}
dojo.gfx.Colorspace.prototype.Luv_to_XYZ = function(){
var src = this.munge('Luv', arguments);
var wp = this.getWhitePoint();
var uz = (4 * wp.X) / (wp.X + 15 * wp.Y + 3 * wp.Z);
var vz = (9 * wp.Y) / (wp.X + 15 * wp.Y + 3 * wp.Z);
var Y = (src.L > this.kappa() * this.epsilon()) ? Math.pow((src.L + 16) / 116, 3) : src.L / this.kappa();
var a = (1 / 3) * (((52 * src.L) / (src.u + 13 * src.L * uz)) - 1);
var b = -5 * Y;
var c = - (1 / 3);
var d = Y * (((39 * src.L) / (src.v + 13 * src.L * vz)) - 5);
var X = (d - b) / (a - c);
var Z = X * a + b;
return [X, Y, Z];
}
dojo.gfx.Colorspace.prototype.Luv_to_LCHuv = function(){
var src = this.munge('Luv', arguments);
var L = src.L;
var C = Math.pow(src.u * src.u + src.v * src.v, 0.5);
var H = Math.atan2(src.v, src.u) * (180 / Math.PI);
if (H < 0){ H += 360; }
if (H > 360){ H -= 360; }
return [L, C, H];
}
dojo.gfx.Colorspace.prototype.LCHuv_to_Luv = function(){
var src = this.munge('LCH', arguments);
var H_rad = src.H * (Math.PI / 180);
var L = src.L;
var u = src.C / Math.pow(Math.pow(Math.tan(H_rad), 2) + 1, 0.5);
var v = Math.pow(src.C * src.C - u * u, 0.5);
if ((90 < src.H) && (src.H < 270)){ u *= -1; }
if (src.H > 180){ v *= -1; }
return [L, u, v];
}
dojo.gfx.Colorspace.colorTemp_to_whitePoint = function(T){
if (T < 4000){
dojo.debug("Can't find a white point for temperatures under 4000K");
return [0,0];
}
if (T > 25000){
dojo.debug("Can't find a white point for temperatures over 25000K");
return [0,0];
}
var T1 = T;
var T2 = T * T;
var T3 = T2 * T;
var ten9 = Math.pow(10, 9);
var ten6 = Math.pow(10, 6);
var ten3 = Math.pow(10, 3);
if (T <= 7000){
var x = (-4.6070 * ten9 / T3) + (2.9678 * ten6 / T2) + (0.09911 * ten3 / T) + 0.244063;
}else{
var x = (-2.0064 * ten9 / T3) + (1.9018 * ten6 / T2) + (0.24748 * ten3 / T) + 0.237040;
}
var y = -3.000 * x * x + 2.870 * x - 0.275;
return [x, y];
}
dojo.gfx.Colorspace.prototype.RGB_to_CMY = function(){
var src = this.munge('RGB', arguments);
var C = 1 - src.R;
var M = 1 - src.G;
var Y = 1 - src.B;
return [C, M, Y];
}
dojo.gfx.Colorspace.prototype.CMY_to_RGB = function(){
var src = this.munge('CMY', arguments);
var R = 1 - src.C;
var G = 1 - src.M;
var B = 1 - src.Y;
return [R, G, B];
}
dojo.gfx.Colorspace.prototype.RGB_to_CMYK = function(){
var src = this.munge('RGB', arguments);
var K = Math.min(1-src.R, 1-src.G, 1-src.B);
var C = (1 - src.R - K) / (1 - K);
var M = (1 - src.G - K) / (1 - K);
var Y = (1 - src.B - K) / (1 - K);
return [C, M, Y, K];
}
dojo.gfx.Colorspace.prototype.CMYK_to_RGB = function(){
var src = this.munge('CMYK', arguments);
var R = 1 - Math.min(1, src.C * (1-src.K) + src.K);
var G = 1 - Math.min(1, src.M * (1-src.K) + src.K);
var B = 1 - Math.min(1, src.Y * (1-src.K) + src.K);
return [R, G, B];
}
dojo.gfx.Colorspace.prototype.CMY_to_CMYK = function(){
var src = this.munge('CMY', arguments);
var K = Math.min(src.C, src.M, src.Y);
var C = (src.C - K) / (1 - K);
var M = (src.M - K) / (1 - K);
var Y = (src.Y - K) / (1 - K);
return [C, M, Y, K];
}
dojo.gfx.Colorspace.prototype.CMYK_to_CMY = function(){
var src = this.munge('CMYK', arguments);
var C = Math.min(1, src.C * (1-src.K) + src.K);
var M = Math.min(1, src.M * (1-src.K) + src.K);
var Y = Math.min(1, src.Y * (1-src.K) + src.K);
return [C, M, Y];
}
dojo.gfx.Colorspace.prototype.RGB_to_HSV = function(){
var src = this.munge('RGB', arguments);
// Based on C Code in "Computer Graphics -- Principles and Practice,"
// Foley et al, 1996, p. 592.
var min = Math.min(src.R, src.G, src.B);
var V = Math.max(src.R, src.G, src.B);
var delta = V - min;
var H = null;
var S = (V == 0) ? 0 : delta / V;
if (S == 0){
H = 0;
}else{
if (src.R == V){
H = 60 * (src.G - src.B) / delta;
}else{
if (src.G == V){
H = 120 + 60 * (src.B - src.R) / delta;
}else{
if (src.B == V){
// between magenta and cyan
H = 240 + 60 * (src.R - src.G) / delta;
}
}
}
if (H < 0){
H += 360;
}
}
H = (H == 0) ? 360 : H;
return [H, S, V];
}
dojo.gfx.Colorspace.prototype.HSV_to_RGB = function(){
var src = this.munge('HSV', arguments);
if (src.H == 360){ src.H = 0;}
// Based on C Code in "Computer Graphics -- Principles and Practice,"
// Foley et al, 1996, p. 593.
var r = null;
var g = null;
var b = null;
if (src.S == 0){
// color is on black-and-white center line
// achromatic: shades of gray
var R = src.V;
var G = src.V;
var B = src.V;
}else{
// chromatic color
var hTemp = src.H / 60; // h is now IN [0,6]
var i = Math.floor(hTemp); // largest integer <= h
var f = hTemp - i; // fractional part of h
var p = src.V * (1 - src.S);
var q = src.V * (1 - (src.S * f));
var t = src.V * (1 - (src.S * (1 - f)));
switch(i){
case 0: R = src.V; G = t ; B = p ; break;
case 1: R = q ; G = src.V; B = p ; break;
case 2: R = p ; G = src.V; B = t ; break;
case 3: R = p ; G = q ; B = src.V; break;
case 4: R = t ; G = p ; B = src.V; break;
case 5: R = src.V; G = p ; B = q ; break;
}
}
return [R, G, B];
}
dojo.gfx.Colorspace.prototype.RGB_to_HSL = function(){
var src = this.munge('RGB', arguments);
// based on C code from http://astronomy.swin.edu.au/~pbourke/colour/hsl/
var min = Math.min(src.R, src.G, src.B);
var max = Math.max(src.R, src.G, src.B);
var delta = max - min;
var H = 0;
var S = 0;
var L = (min + max) / 2;
if ((L > 0) && (L < 1)){
S = delta / ((L < 0.5) ? (2 * L) : (2 - 2 * L));
}
if (delta > 0) {
if ((max == src.R) && (max != src.G)){
H += (src.G - src.B) / delta;
}
if ((max == src.G) && (max != src.B)){
H += (2 + (src.B - src.R) / delta);
}
if ((max == src.B) && (max != src.R)){
H += (4 + (src.R - src.G) / delta);
}
H *= 60;
}
H = (H == 0) ? 360 : H;
return [H, S, L];
}
dojo.gfx.Colorspace.prototype.HSL_to_RGB = function(){
var src = this.munge('HSL', arguments);
// based on C code from http://astronomy.swin.edu.au/~pbourke/colour/hsl/
while (src.H < 0){ src.H += 360; }
while (src.H >= 360){ src.H -= 360; }
var R = 0;
var G = 0;
var B = 0;
if (src.H < 120){
R = (120 - src.H) / 60;
G = src.H / 60;
B = 0;
}else if (src.H < 240){
R = 0;
G = (240 - src.H) / 60;
B = (src.H - 120) / 60;
}else{
R = (src.H - 240) / 60;
G = 0;
B = (360 - src.H) / 60;
}
R = 2 * src.S * Math.min(R, 1) + (1 - src.S);
G = 2 * src.S * Math.min(G, 1) + (1 - src.S);
B = 2 * src.S * Math.min(B, 1) + (1 - src.S);
if (src.L < 0.5){
R = src.L * R;
G = src.L * G;
B = src.L * B;
}else{
R = (1 - src.L) * R + 2 * src.L - 1;
G = (1 - src.L) * G + 2 * src.L - 1;
B = (1 - src.L) * B + 2 * src.L - 1;
}
return [R, G, B];
}

View File

@@ -0,0 +1,23 @@
/*
Copyright (c) 2004-2006, The Dojo Foundation
All Rights Reserved.
Licensed under the Academic Free License version 2.1 or above OR the
modified BSD license. For more information on Dojo licensing, see:
http://dojotoolkit.org/community/licensing.shtml
*/
dojo.kwCompoundRequire({
common: [
"dojo.gfx.color",
"dojo.gfx.matrix",
"dojo.gfx.common"
]
});
// include a renderer conditionally
dojo.requireIf(dojo.render.svg.capable, "dojo.gfx.svg");
dojo.requireIf(dojo.render.vml.capable, "dojo.gfx.vml");
dojo.provide("dojo.gfx.*");

View File

@@ -0,0 +1,183 @@
/*
Copyright (c) 2004-2006, The Dojo Foundation
All Rights Reserved.
Licensed under the Academic Free License version 2.1 or above OR the
modified BSD license. For more information on Dojo licensing, see:
http://dojotoolkit.org/community/licensing.shtml
*/
dojo.provide("dojo.gfx.color");
dojo.require("dojo.lang.common");
dojo.require("dojo.lang.array");
// TODO: rewrite the "x2y" methods to take advantage of the parsing
// abilities of the Color object. Also, beef up the Color
// object (as possible) to parse most common formats
// takes an r, g, b, a(lpha) value, [r, g, b, a] array, "rgb(...)" string, hex string (#aaa, #aaaaaa, aaaaaaa)
dojo.gfx.color.Color = function(r, g, b, a) {
// dojo.debug("r:", r[0], "g:", r[1], "b:", r[2]);
if(dojo.lang.isArray(r)){
this.r = r[0];
this.g = r[1];
this.b = r[2];
this.a = r[3]||1.0;
}else if(dojo.lang.isString(r)){
var rgb = dojo.gfx.color.extractRGB(r);
this.r = rgb[0];
this.g = rgb[1];
this.b = rgb[2];
this.a = g||1.0;
}else if(r instanceof dojo.gfx.color.Color){
// why does this create a new instance if we were passed one?
this.r = r.r;
this.b = r.b;
this.g = r.g;
this.a = r.a;
}else{
this.r = r;
this.g = g;
this.b = b;
this.a = a;
}
}
dojo.gfx.color.Color.fromArray = function(arr) {
return new dojo.gfx.color.Color(arr[0], arr[1], arr[2], arr[3]);
}
dojo.extend(dojo.gfx.color.Color, {
toRgb: function(includeAlpha) {
if(includeAlpha) {
return this.toRgba();
} else {
return [this.r, this.g, this.b];
}
},
toRgba: function() {
return [this.r, this.g, this.b, this.a];
},
toHex: function() {
return dojo.gfx.color.rgb2hex(this.toRgb());
},
toCss: function() {
return "rgb(" + this.toRgb().join() + ")";
},
toString: function() {
return this.toHex(); // decent default?
},
blend: function(color, weight){
var rgb = null;
if(dojo.lang.isArray(color)){
rgb = color;
}else if(color instanceof dojo.gfx.color.Color){
rgb = color.toRgb();
}else{
rgb = new dojo.gfx.color.Color(color).toRgb();
}
return dojo.gfx.color.blend(this.toRgb(), rgb, weight);
}
});
dojo.gfx.color.named = {
white: [255,255,255],
black: [0,0,0],
red: [255,0,0],
green: [0,255,0],
lime: [0,255,0],
blue: [0,0,255],
navy: [0,0,128],
gray: [128,128,128],
silver: [192,192,192]
};
dojo.gfx.color.blend = function(a, b, weight){
// summary:
// blend colors a and b (both as RGB array or hex strings) with weight
// from -1 to +1, 0 being a 50/50 blend
if(typeof a == "string"){
return dojo.gfx.color.blendHex(a, b, weight);
}
if(!weight){
weight = 0;
}
weight = Math.min(Math.max(-1, weight), 1);
// alex: this interface blows.
// map -1 to 1 to the range 0 to 1
weight = ((weight + 1)/2);
var c = [];
// var stop = (1000*weight);
for(var x = 0; x < 3; x++){
c[x] = parseInt( b[x] + ( (a[x] - b[x]) * weight) );
}
return c;
}
// very convenient blend that takes and returns hex values
// (will get called automatically by blend when blend gets strings)
dojo.gfx.color.blendHex = function(a, b, weight) {
return dojo.gfx.color.rgb2hex(dojo.gfx.color.blend(dojo.gfx.color.hex2rgb(a), dojo.gfx.color.hex2rgb(b), weight));
}
// get RGB array from css-style color declarations
dojo.gfx.color.extractRGB = function(color) {
var hex = "0123456789abcdef";
color = color.toLowerCase();
if( color.indexOf("rgb") == 0 ) {
var matches = color.match(/rgba*\((\d+), *(\d+), *(\d+)/i);
var ret = matches.splice(1, 3);
return ret;
} else {
var colors = dojo.gfx.color.hex2rgb(color);
if(colors) {
return colors;
} else {
// named color (how many do we support?)
return dojo.gfx.color.named[color] || [255, 255, 255];
}
}
}
dojo.gfx.color.hex2rgb = function(hex) {
var hexNum = "0123456789ABCDEF";
var rgb = new Array(3);
if( hex.indexOf("#") == 0 ) { hex = hex.substring(1); }
hex = hex.toUpperCase();
if(hex.replace(new RegExp("["+hexNum+"]", "g"), "") != "") {
return null;
}
if( hex.length == 3 ) {
rgb[0] = hex.charAt(0) + hex.charAt(0)
rgb[1] = hex.charAt(1) + hex.charAt(1)
rgb[2] = hex.charAt(2) + hex.charAt(2);
} else {
rgb[0] = hex.substring(0, 2);
rgb[1] = hex.substring(2, 4);
rgb[2] = hex.substring(4);
}
for(var i = 0; i < rgb.length; i++) {
rgb[i] = hexNum.indexOf(rgb[i].charAt(0)) * 16 + hexNum.indexOf(rgb[i].charAt(1));
}
return rgb;
}
dojo.gfx.color.rgb2hex = function(r, g, b) {
if(dojo.lang.isArray(r)) {
g = r[1] || 0;
b = r[2] || 0;
r = r[0] || 0;
}
var ret = dojo.lang.map([r, g, b], function(x) {
x = new Number(x);
var s = x.toString(16);
while(s.length < 2) { s = "0" + s; }
return s;
});
ret.unshift("#");
return ret.join("");
}

View File

@@ -0,0 +1,139 @@
/*
Copyright (c) 2004-2006, The Dojo Foundation
All Rights Reserved.
Licensed under the Academic Free License version 2.1 or above OR the
modified BSD license. For more information on Dojo licensing, see:
http://dojotoolkit.org/community/licensing.shtml
*/
dojo.provide("dojo.gfx.color.hsl");
dojo.require("dojo.lang.array");
dojo.lang.extend(dojo.gfx.color.Color, {
toHsl: function() {
return dojo.gfx.color.rgb2hsl(this.toRgb());
}
});
dojo.gfx.color.rgb2hsl = function(r, g, b){
if (dojo.lang.isArray(r)) {
b = r[2] || 0;
g = r[1] || 0;
r = r[0] || 0;
}
r /= 255;
g /= 255;
b /= 255;
//
// based on C code from http://astronomy.swin.edu.au/~pbourke/colour/hsl/
//
var h = null;
var s = null;
var l = null;
var min = Math.min(r, g, b);
var max = Math.max(r, g, b);
var delta = max - min;
l = (min + max) / 2;
s = 0;
if ((l > 0) && (l < 1)){
s = delta / ((l < 0.5) ? (2 * l) : (2 - 2 * l));
}
h = 0;
if (delta > 0) {
if ((max == r) && (max != g)){
h += (g - b) / delta;
}
if ((max == g) && (max != b)){
h += (2 + (b - r) / delta);
}
if ((max == b) && (max != r)){
h += (4 + (r - g) / delta);
}
h *= 60;
}
h = (h == 0) ? 360 : Math.ceil((h / 360) * 255);
s = Math.ceil(s * 255);
l = Math.ceil(l * 255);
return [h, s, l];
}
dojo.gfx.color.hsl2rgb = function(h, s, l){
if (dojo.lang.isArray(h)) {
l = h[2] || 0;
s = h[1] || 0;
h = h[0] || 0;
}
h = (h / 255) * 360;
if (h == 360){ h = 0;}
s = s / 255;
l = l / 255;
//
// based on C code from http://astronomy.swin.edu.au/~pbourke/colour/hsl/
//
while (h < 0){ h += 360; }
while (h > 360){ h -= 360; }
var r, g, b;
if (h < 120){
r = (120 - h) / 60;
g = h / 60;
b = 0;
}else if (h < 240){
r = 0;
g = (240 - h) / 60;
b = (h - 120) / 60;
}else{
r = (h - 240) / 60;
g = 0;
b = (360 - h) / 60;
}
r = Math.min(r, 1);
g = Math.min(g, 1);
b = Math.min(b, 1);
r = 2 * s * r + (1 - s);
g = 2 * s * g + (1 - s);
b = 2 * s * b + (1 - s);
if (l < 0.5){
r = l * r;
g = l * g;
b = l * b;
}else{
r = (1 - l) * r + 2 * l - 1;
g = (1 - l) * g + 2 * l - 1;
b = (1 - l) * b + 2 * l - 1;
}
r = Math.ceil(r * 255);
g = Math.ceil(g * 255);
b = Math.ceil(b * 255);
return [r, g, b];
}
dojo.gfx.color.hsl2hex = function(h, s, l){
var rgb = dojo.gfx.color.hsl2rgb(h, s, l);
return dojo.gfx.color.rgb2hex(rgb[0], rgb[1], rgb[2]);
}
dojo.gfx.color.hex2hsl = function(hex){
var rgb = dojo.gfx.color.hex2rgb(hex);
return dojo.gfx.color.rgb2hsl(rgb[0], rgb[1], rgb[2]);
}

View File

@@ -0,0 +1,246 @@
/*
Copyright (c) 2004-2006, The Dojo Foundation
All Rights Reserved.
Licensed under the Academic Free License version 2.1 or above OR the
modified BSD license. For more information on Dojo licensing, see:
http://dojotoolkit.org/community/licensing.shtml
*/
dojo.provide("dojo.gfx.color.hsv");
dojo.require("dojo.lang.array");
dojo.require("dojo.math");
dojo.lang.extend(dojo.gfx.color.Color, {
toHsv: function() {
return dojo.gfx.color.rgb2hsv(this.toRgb());
}
});
// Default input range for RBG values is 0-255
dojo.gfx.color.rgb2hsv = function(/* int || Array */r, /* int */g, /* int */b, /* Object? */options){
// summary
// converts an RGB value set to HSV, ranges depending on optional options object.
// patch for options by Matthew Eernisse
if (dojo.lang.isArray(r)) {
if(g) {
options = g;
}
b = r[2] || 0;
g = r[1] || 0;
r = r[0] || 0;
}
var opt = {
inputRange: (options && options.inputRange) ? options.inputRange : 255,
outputRange: (options && options.outputRange) ? options.outputRange : [255, 255, 255]
};
// r,g,b, each 0 to 255, to HSV.
// h = 0.0 to 360.0 (corresponding to 0..360.0 degrees around hexcone)
// s = 0.0 (shade of gray) to 1.0 (pure color)
// v = 0.0 (black) to 1.0 {white)
//
// Based on C Code in "Computer Graphics -- Principles and Practice,"
// Foley et al, 1996, p. 592.
//
// our calculatuions are based on 'regular' values (0-360, 0-1, 0-1)
// but we return bytes values (0-255, 0-255, 0-255)
var h = null;
var s = null;
var v = null;
switch(opt.inputRange) {
// 0.0-1.0
case 1:
r = (r * 255);
g = (g * 255);
b = (b * 255);
break;
// 0-100
case 100:
r = (r / 100) * 255;
g = (g / 100) * 255;
b = (b / 100) * 255;
break;
// 0-255
default:
// Do nothing
break;
}
var min = Math.min(r, g, b);
v = Math.max(r, g, b);
var delta = v - min;
// calculate saturation (0 if r, g and b are all 0)
s = (v == 0) ? 0 : delta/v;
if (s == 0){
// achromatic: when saturation is, hue is undefined
h = 0;
}else{
// chromatic
if (r == v){
// between yellow and magenta
h = 60 * (g - b) / delta;
}else{
if (g == v){
// between cyan and yellow
h = 120 + 60 * (b - r) / delta;
}else{
if (b == v){
// between magenta and cyan
h = 240 + 60 * (r - g) / delta;
}
}
}
if (h <= 0){
h += 360;
}
}
// Hue
switch (opt.outputRange[0]) {
case 360:
// Do nothing
break;
case 100:
h = (h / 360) * 100;
break;
case 1:
h = (h / 360);
break;
default: // 255
h = (h / 360) * 255;
break;
}
// Saturation
switch (opt.outputRange[1]) {
case 100:
s = s * 100;
case 1:
// Do nothing
break;
default: // 255
s = s * 255;
break;
}
// Value
switch (opt.outputRange[2]) {
case 100:
v = (v / 255) * 100;
break;
case 1:
v = (v / 255);
break;
default: // 255
// Do nothing
break;
}
h = dojo.math.round(h);
s = dojo.math.round(s);
v = dojo.math.round(v);
return [h, s, v];
}
// Based on C Code in "Computer Graphics -- Principles and Practice,"
// Foley et al, 1996, p. 593.
//
// H = 0 to 255 (corresponding to 0..360 degrees around hexcone) 0 for S = 0
// S = 0 (shade of gray) to 255 (pure color)
// V = 0 (black) to 255 (white)
dojo.gfx.color.hsv2rgb = function(/* int || Array */h, /* int */s, /* int */v, /* Object? */options){
// summary
// converts an HSV value set to RGB, ranges depending on optional options object.
// patch for options by Matthew Eernisse
if (dojo.lang.isArray(h)) {
if(s){
options = s;
}
v = h[2] || 0;
s = h[1] || 0;
h = h[0] || 0;
}
var opt = {
inputRange: (options && options.inputRange) ? options.inputRange : [255, 255, 255],
outputRange: (options && options.outputRange) ? options.outputRange : 255
};
switch(opt.inputRange[0]) {
// 0.0-1.0
case 1: h = h * 360; break;
// 0-100
case 100: h = (h / 100) * 360; break;
// 0-360
case 360: h = h; break;
// 0-255
default: h = (h / 255) * 360;
}
if (h == 360){ h = 0;}
// no need to alter if inputRange[1] = 1
switch(opt.inputRange[1]){
case 100: s /= 100; break;
case 255: s /= 255;
}
// no need to alter if inputRange[1] = 1
switch(opt.inputRange[2]){
case 100: v /= 100; break;
case 255: v /= 255;
}
var r = null;
var g = null;
var b = null;
if (s == 0){
// color is on black-and-white center line
// achromatic: shades of gray
r = v;
g = v;
b = v;
}else{
// chromatic color
var hTemp = h / 60; // h is now IN [0,6]
var i = Math.floor(hTemp); // largest integer <= h
var f = hTemp - i; // fractional part of h
var p = v * (1 - s);
var q = v * (1 - (s * f));
var t = v * (1 - (s * (1 - f)));
switch(i){
case 0: r = v; g = t; b = p; break;
case 1: r = q; g = v; b = p; break;
case 2: r = p; g = v; b = t; break;
case 3: r = p; g = q; b = v; break;
case 4: r = t; g = p; b = v; break;
case 5: r = v; g = p; b = q; break;
}
}
switch(opt.outputRange){
case 1:
r = dojo.math.round(r, 2);
g = dojo.math.round(g, 2);
b = dojo.math.round(b, 2);
break;
case 100:
r = Math.round(r * 100);
g = Math.round(g * 100);
b = Math.round(b * 100);
break;
default:
r = Math.round(r * 255);
g = Math.round(g * 255);
b = Math.round(b * 255);
}
return [r, g, b];
}

View File

@@ -0,0 +1,118 @@
/*
Copyright (c) 2004-2006, The Dojo Foundation
All Rights Reserved.
Licensed under the Academic Free License version 2.1 or above OR the
modified BSD license. For more information on Dojo licensing, see:
http://dojotoolkit.org/community/licensing.shtml
*/
dojo.provide("dojo.gfx.common");
dojo.require("dojo.gfx.color");
dojo.require("dojo.lang.declare");
dojo.require("dojo.lang.extras");
dojo.require("dojo.dom");
dojo.lang.mixin(dojo.gfx, {
// summary: defines constants, prototypes, and utility functions
// default shapes, which is used to fill in missing parameters
defaultPath: {type: "path", path: ""},
defaultPolyline: {type: "polyline", points: []},
defaultRect: {type: "rect", x: 0, y: 0, width: 100, height: 100, r: 0},
defaultEllipse: {type: "ellipse", cx: 0, cy: 0, rx: 200, ry: 100},
defaultCircle: {type: "circle", cx: 0, cy: 0, r: 100},
defaultLine: {type: "line", x1: 0, y1: 0, x2: 100, y2: 100},
defaultImage: {type: "image", width: 0, height: 0, src: ""},
// default geometric attributes (a stroke, and fills)
defaultStroke: {color: "black", width: 1, cap: "butt", join: 4},
defaultLinearGradient: {type: "linear", x1: 0, y1: 0, x2: 100, y2: 100,
colors: [{offset: 0, color: "black"}, {offset: 1, color: "white"}]},
defaultRadialGradient: {type: "radial", cx: 0, cy: 0, r: 100,
colors: [{offset: 0, color: "black"}, {offset: 1, color: "white"}]},
defaultPattern: {type: "pattern", x: 0, y: 0, width: 0, height: 0, src: ""},
normalizeColor: function(/*Color*/ color){
// summary: converts any legal color representation to normalized dojo.gfx.color.Color object
return (color instanceof dojo.gfx.color.Color) ? color : new dojo.gfx.color.Color(color); // dojo.gfx.color.Color
},
normalizeParameters: function(existed, update){
// summary: updates an existing object with properties from an "update" object
// existed: Object: the "target" object to be updated
// update: Object: the "update" object, whose properties will be used to update the existed object
if(update){
var empty = {};
for(var x in existed){
if(x in update && !(x in empty)){
existed[x] = update[x];
}
}
}
return existed; // Object
},
makeParameters: function(defaults, update){
// summary: copies the original object, and all copied properties from the "update" object
// defaults: Object: the object to be cloned before updating
// update: Object: the object, which properties are to be cloned during updating
if(!update) return dojo.lang.shallowCopy(defaults, true);
var result = {};
for(var i in defaults){
if(!(i in result)){
result[i] = dojo.lang.shallowCopy((i in update) ? update[i] : defaults[i], true);
}
}
return result; // Object
},
formatNumber: function(x, addSpace){
// summary: converts a number to a string using a fixed notation
// x: Number: number to be converted
// addSpace: Boolean?: if it is true, add a space before a positive number
var val = x.toString();
if(val.indexOf("e") >= 0){
val = x.toFixed(4);
}else{
var point = val.indexOf(".");
if(point >= 0 && val.length - point > 5){
val = x.toFixed(4);
}
}
if(x < 0){
return val; // String
}
return addSpace ? " " + val : val; // String
},
// a constant used to split a SVG/VML path into primitive components
pathRegExp: /([A-Za-z]+)|(\d+(\.\d+)?)|(\.\d+)|(-\d+(\.\d+)?)|(-\.\d+)/g
});
dojo.declare("dojo.gfx.Surface", null, {
// summary: a surface object to be used for drawings
initializer: function(){
// summary: a constructor
// underlying node
this.rawNode = null;
},
getEventSource: function(){
// summary: returns a node, which can be used to attach event listeners
return this.rawNode; // Node
}
});
dojo.declare("dojo.gfx.Point", null, {
// summary: a hypothetical 2D point to be used for drawings - {x, y}
// description: This object is defined for documentation purposes.
// You should use a naked object instead: {x: 1, y: 2}.
});
dojo.declare("dojo.gfx.Rectangle", null, {
// summary: a hypothetical rectangle - {x, y, width, height}
// description: This object is defined for documentation purposes.
// You should use a naked object instead: {x: 1, y: 2, width: 100, height: 200}.
});

View File

@@ -0,0 +1,406 @@
/*
Copyright (c) 2004-2006, The Dojo Foundation
All Rights Reserved.
Licensed under the Academic Free License version 2.1 or above OR the
modified BSD license. For more information on Dojo licensing, see:
http://dojotoolkit.org/community/licensing.shtml
*/
dojo.provide("dojo.gfx.matrix");
dojo.require("dojo.lang.common");
dojo.require("dojo.math.*");
dojo.gfx.matrix.Matrix2D = function(arg){
// summary: a 2D matrix object
// description: Normalizes a 2D matrix-like object. If arrays is passed,
// all objects of the array are normalized and multiplied sequentially.
// arg: Object
// a 2D matrix-like object, or an array of such objects
if(arg){
if(arg instanceof Array){
if(arg.length > 0){
var m = dojo.gfx.matrix.normalize(arg[0]);
// combine matrices
for(var i = 1; i < arg.length; ++i){
var l = m;
var r = dojo.gfx.matrix.normalize(arg[i]);
m = new dojo.gfx.matrix.Matrix2D();
m.xx = l.xx * r.xx + l.xy * r.yx;
m.xy = l.xx * r.xy + l.xy * r.yy;
m.yx = l.yx * r.xx + l.yy * r.yx;
m.yy = l.yx * r.xy + l.yy * r.yy;
m.dx = l.xx * r.dx + l.xy * r.dy + l.dx;
m.dy = l.yx * r.dx + l.yy * r.dy + l.dy;
}
dojo.mixin(this, m);
}
}else{
dojo.mixin(this, arg);
}
}
};
// the default (identity) matrix, which is used to fill in missing values
dojo.extend(dojo.gfx.matrix.Matrix2D, {xx: 1, xy: 0, yx: 0, yy: 1, dx: 0, dy: 0});
dojo.mixin(dojo.gfx.matrix, {
// summary: class constants, and methods of dojo.gfx.matrix
// matrix constants
// identity: dojo.gfx.matrix.Matrix2D
// an identity matrix constant: identity * (x, y) == (x, y)
identity: new dojo.gfx.matrix.Matrix2D(),
// flipX: dojo.gfx.matrix.Matrix2D
// a matrix, which reflects points at x = 0 line: flipX * (x, y) == (-x, y)
flipX: new dojo.gfx.matrix.Matrix2D({xx: -1}),
// flipY: dojo.gfx.matrix.Matrix2D
// a matrix, which reflects points at y = 0 line: flipY * (x, y) == (x, -y)
flipY: new dojo.gfx.matrix.Matrix2D({yy: -1}),
// flipXY: dojo.gfx.matrix.Matrix2D
// a matrix, which reflects points at the origin of coordinates: flipXY * (x, y) == (-x, -y)
flipXY: new dojo.gfx.matrix.Matrix2D({xx: -1, yy: -1}),
// matrix creators
translate: function(a, b){
// summary: forms a translation matrix
// description: The resulting matrix is used to translate (move) points by specified offsets.
// a: Number: an x coordinate value
// b: Number: a y coordinate value
if(arguments.length > 1){
return new dojo.gfx.matrix.Matrix2D({dx: a, dy: b}); // dojo.gfx.matrix.Matrix2D
}
// branch
// a: dojo.gfx.Point: a point-like object, which specifies offsets for both dimensions
// b: null
return new dojo.gfx.matrix.Matrix2D({dx: a.x, dy: a.y}); // dojo.gfx.matrix.Matrix2D
},
scale: function(a, b){
// summary: forms a scaling matrix
// description: The resulting matrix is used to scale (magnify) points by specified offsets.
// a: Number: a scaling factor used for the x coordinate
// b: Number: a scaling factor used for the y coordinate
if(arguments.length > 1){
return new dojo.gfx.matrix.Matrix2D({xx: a, yy: b}); // dojo.gfx.matrix.Matrix2D
}
if(typeof a == "number"){
// branch
// a: Number: a uniform scaling factor used for the both coordinates
// b: null
return new dojo.gfx.matrix.Matrix2D({xx: a, yy: a}); // dojo.gfx.matrix.Matrix2D
}
// branch
// a: dojo.gfx.Point: a point-like object, which specifies scale factors for both dimensions
// b: null
return new dojo.gfx.matrix.Matrix2D({xx: a.x, yy: a.y}); // dojo.gfx.matrix.Matrix2D
},
rotate: function(angle){
// summary: forms a rotating matrix
// description: The resulting matrix is used to rotate points
// around the origin of coordinates (0, 0) by specified angle.
// angle: Number: an angle of rotation in radians (>0 for CCW)
var c = Math.cos(angle);
var s = Math.sin(angle);
return new dojo.gfx.matrix.Matrix2D({xx: c, xy: s, yx: -s, yy: c}); // dojo.gfx.matrix.Matrix2D
},
rotateg: function(degree){
// summary: forms a rotating matrix
// description: The resulting matrix is used to rotate points
// around the origin of coordinates (0, 0) by specified degree.
// See dojo.gfx.matrix.rotate() for comparison.
// degree: Number: an angle of rotation in degrees (>0 for CCW)
return dojo.gfx.matrix.rotate(dojo.math.degToRad(degree)); // dojo.gfx.matrix.Matrix2D
},
skewX: function(angle) {
// summary: forms an x skewing matrix
// description: The resulting matrix is used to skew points in the x dimension
// around the origin of coordinates (0, 0) by specified angle.
// angle: Number: an skewing angle in radians
return new dojo.gfx.matrix.Matrix2D({xy: Math.tan(angle)}); // dojo.gfx.matrix.Matrix2D
},
skewXg: function(degree){
// summary: forms an x skewing matrix
// description: The resulting matrix is used to skew points in the x dimension
// around the origin of coordinates (0, 0) by specified degree.
// See dojo.gfx.matrix.skewX() for comparison.
// degree: Number: an skewing angle in degrees
return dojo.gfx.matrix.skewX(dojo.math.degToRad(degree)); // dojo.gfx.matrix.Matrix2D
},
skewY: function(angle){
// summary: forms a y skewing matrix
// description: The resulting matrix is used to skew points in the y dimension
// around the origin of coordinates (0, 0) by specified angle.
// angle: Number: an skewing angle in radians
return new dojo.gfx.matrix.Matrix2D({yx: -Math.tan(angle)}); // dojo.gfx.matrix.Matrix2D
},
skewYg: function(degree){
// summary: forms a y skewing matrix
// description: The resulting matrix is used to skew points in the y dimension
// around the origin of coordinates (0, 0) by specified degree.
// See dojo.gfx.matrix.skewY() for comparison.
// degree: Number: an skewing angle in degrees
return dojo.gfx.matrix.skewY(dojo.math.degToRad(degree)); // dojo.gfx.matrix.Matrix2D
},
// ensure matrix 2D conformance
normalize: function(matrix){
// summary: converts an object to a matrix, if necessary
// description: Converts any 2D matrix-like object or an array of
// such objects to a valid dojo.gfx.matrix.Matrix2D object.
// matrix: Object: an object, which is converted to a matrix, if necessary
return (matrix instanceof dojo.gfx.matrix.Matrix2D) ? matrix : new dojo.gfx.matrix.Matrix2D(matrix); // dojo.gfx.matrix.Matrix2D
},
// common operations
clone: function(matrix){
// summary: creates a copy of a 2D matrix
// matrix: dojo.gfx.matrix.Matrix2D: a 2D matrix-like object to be cloned
var obj = new dojo.gfx.matrix.Matrix2D();
for(var i in matrix){
if(typeof(matrix[i]) == "number" && typeof(obj[i]) == "number" && obj[i] != matrix[i]) obj[i] = matrix[i];
}
return obj; // dojo.gfx.matrix.Matrix2D
},
invert: function(matrix){
// summary: inverts a 2D matrix
// matrix: dojo.gfx.matrix.Matrix2D: a 2D matrix-like object to be inverted
var m = dojo.gfx.matrix.normalize(matrix);
var D = m.xx * m.yy - m.xy * m.yx;
var M = new dojo.gfx.matrix.Matrix2D({
xx: m.yy/D, xy: -m.xy/D,
yx: -m.yx/D, yy: m.xx/D,
dx: (m.yx * m.dy - m.yy * m.dx) / D,
dy: (m.xy * m.dx - m.xx * m.dy) / D
});
return M; // dojo.gfx.matrix.Matrix2D
},
_multiplyPoint: function(m, x, y){
// summary: applies a matrix to a point
// matrix: dojo.gfx.matrix.Matrix2D: a 2D matrix object to be applied
// x: Number: an x coordinate of a point
// y: Number: a y coordinate of a point
return {x: m.xx * x + m.xy * y + m.dx, y: m.yx * x + m.yy * y + m.dy}; // dojo.gfx.Point
},
multiplyPoint: function(matrix, /* Number||Point */ a, /* Number, optional */ b){
// summary: applies a matrix to a point
// matrix: dojo.gfx.matrix.Matrix2D: a 2D matrix object to be applied
// a: Number: an x coordinate of a point
// b: Number: a y coordinate of a point
var m = dojo.gfx.matrix.normalize(matrix);
if(typeof a == "number" && typeof b == "number"){
return dojo.gfx.matrix._multiplyPoint(m, a, b); // dojo.gfx.Point
}
// branch
// matrix: dojo.gfx.matrix.Matrix2D: a 2D matrix object to be applied
// a: dojo.gfx.Point: a point
// b: null
return dojo.gfx.matrix._multiplyPoint(m, a.x, a.y); // dojo.gfx.Point
},
multiply: function(matrix){
// summary: combines matrices by multiplying them sequentially in the given order
// matrix: dojo.gfx.matrix.Matrix2D...: a 2D matrix-like object,
// all subsequent arguments are matrix-like objects too
var m = dojo.gfx.matrix.normalize(matrix);
// combine matrices
for(var i = 1; i < arguments.length; ++i){
var l = m;
var r = dojo.gfx.matrix.normalize(arguments[i]);
m = new dojo.gfx.matrix.Matrix2D();
m.xx = l.xx * r.xx + l.xy * r.yx;
m.xy = l.xx * r.xy + l.xy * r.yy;
m.yx = l.yx * r.xx + l.yy * r.yx;
m.yy = l.yx * r.xy + l.yy * r.yy;
m.dx = l.xx * r.dx + l.xy * r.dy + l.dx;
m.dy = l.yx * r.dx + l.yy * r.dy + l.dy;
}
return m; // dojo.gfx.matrix.Matrix2D
},
// high level operations
_sandwich: function(m, x, y){
// summary: applies a matrix at a centrtal point
// m: dojo.gfx.matrix.Matrix2D: a 2D matrix-like object, which is applied at a central point
// x: Number: an x component of the central point
// y: Number: a y component of the central point
return dojo.gfx.matrix.multiply(dojo.gfx.matrix.translate(x, y), m, dojo.gfx.matrix.translate(-x, -y)); // dojo.gfx.matrix.Matrix2D
},
scaleAt: function(a, b, c, d){
// summary: scales a picture using a specified point as a center of scaling
// description: Compare with dojo.gfx.matrix.scale().
// a: Number: a scaling factor used for the x coordinate
// b: Number: a scaling factor used for the y coordinate
// c: Number: an x component of a central point
// d: Number: a y component of a central point
// accepts several signatures:
// 1) uniform scale factor, Point
// 2) uniform scale factor, x, y
// 3) x scale, y scale, Point
// 4) x scale, y scale, x, y
switch(arguments.length){
case 4:
// a and b are scale factor components, c and d are components of a point
return dojo.gfx.matrix._sandwich(dojo.gfx.matrix.scale(a, b), c, d); // dojo.gfx.matrix.Matrix2D
case 3:
if(typeof c == "number"){
// branch
// a: Number: a uniform scaling factor used for both coordinates
// b: Number: an x component of a central point
// c: Number: a y component of a central point
// d: null
return dojo.gfx.matrix._sandwich(dojo.gfx.matrix.scale(a), b, c); // dojo.gfx.matrix.Matrix2D
}
// branch
// a: Number: a scaling factor used for the x coordinate
// b: Number: a scaling factor used for the y coordinate
// c: dojo.gfx.Point: a central point
// d: null
return dojo.gfx.matrix._sandwich(dojo.gfx.matrix.scale(a, b), c.x, c.y); // dojo.gfx.matrix.Matrix2D
}
// branch
// a: Number: a uniform scaling factor used for both coordinates
// b: dojo.gfx.Point: a central point
// c: null
// d: null
return dojo.gfx.matrix._sandwich(dojo.gfx.matrix.scale(a), b.x, b.y); // dojo.gfx.matrix.Matrix2D
},
rotateAt: function(angle, a, b){
// summary: rotates a picture using a specified point as a center of rotation
// description: Compare with dojo.gfx.matrix.rotate().
// angle: Number: an angle of rotation in radians (>0 for CCW)
// a: Number: an x component of a central point
// b: Number: a y component of a central point
// accepts several signatures:
// 1) rotation angle in radians, Point
// 2) rotation angle in radians, x, y
if(arguments.length > 2){
return dojo.gfx.matrix._sandwich(dojo.gfx.matrix.rotate(angle), a, b); // dojo.gfx.matrix.Matrix2D
}
// branch
// angle: Number: an angle of rotation in radians (>0 for CCW)
// a: dojo.gfx.Point: a central point
// b: null
return dojo.gfx.matrix._sandwich(dojo.gfx.matrix.rotate(angle), a.x, a.y); // dojo.gfx.matrix.Matrix2D
},
rotategAt: function(degree, a, b){
// summary: rotates a picture using a specified point as a center of rotation
// description: Compare with dojo.gfx.matrix.rotateg().
// degree: Number: an angle of rotation in degrees (>0 for CCW)
// a: Number: an x component of a central point
// b: Number: a y component of a central point
// accepts several signatures:
// 1) rotation angle in degrees, Point
// 2) rotation angle in degrees, x, y
if(arguments.length > 2){
return dojo.gfx.matrix._sandwich(dojo.gfx.matrix.rotateg(degree), a, b); // dojo.gfx.matrix.Matrix2D
}
// branch
// degree: Number: an angle of rotation in degrees (>0 for CCW)
// a: dojo.gfx.Point: a central point
// b: null
return dojo.gfx.matrix._sandwich(dojo.gfx.matrix.rotateg(degree), a.x, a.y); // dojo.gfx.matrix.Matrix2D
},
skewXAt: function(angle, a, b){
// summary: skews a picture along the x axis using a specified point as a center of skewing
// description: Compare with dojo.gfx.matrix.skewX().
// angle: Number: an skewing angle in radians
// a: Number: an x component of a central point
// b: Number: a y component of a central point
// accepts several signatures:
// 1) skew angle in radians, Point
// 2) skew angle in radians, x, y
if(arguments.length > 2){
return dojo.gfx.matrix._sandwich(dojo.gfx.matrix.skewX(angle), a, b); // dojo.gfx.matrix.Matrix2D
}
// branch
// angle: Number: an skewing angle in radians
// a: dojo.gfx.Point: a central point
// b: null
return dojo.gfx.matrix._sandwich(dojo.gfx.matrix.skewX(angle), a.x, a.y); // dojo.gfx.matrix.Matrix2D
},
skewXgAt: function(degree, a, b){
// summary: skews a picture along the x axis using a specified point as a center of skewing
// description: Compare with dojo.gfx.matrix.skewXg().
// degree: Number: an skewing angle in degrees
// a: Number: an x component of a central point
// b: Number: a y component of a central point
// accepts several signatures:
// 1) skew angle in degrees, Point
// 2) skew angle in degrees, x, y
if(arguments.length > 2){
return dojo.gfx.matrix._sandwich(dojo.gfx.matrix.skewXg(degree), a, b); // dojo.gfx.matrix.Matrix2D
}
// branch
// degree: Number: an skewing angle in degrees
// a: dojo.gfx.Point: a central point
// b: null
return dojo.gfx.matrix._sandwich(dojo.gfx.matrix.skewXg(degree), a.x, a.y); // dojo.gfx.matrix.Matrix2D
},
skewYAt: function(angle, a, b){
// summary: skews a picture along the y axis using a specified point as a center of skewing
// description: Compare with dojo.gfx.matrix.skewY().
// angle: Number: an skewing angle in radians
// a: Number: an x component of a central point
// b: Number: a y component of a central point
// accepts several signatures:
// 1) skew angle in radians, Point
// 2) skew angle in radians, x, y
if(arguments.length > 2){
return dojo.gfx.matrix._sandwich(dojo.gfx.matrix.skewY(angle), a, b); // dojo.gfx.matrix.Matrix2D
}
// branch
// angle: Number: an skewing angle in radians
// a: dojo.gfx.Point: a central point
// b: null
return dojo.gfx.matrix._sandwich(dojo.gfx.matrix.skewY(angle), a.x, a.y); // dojo.gfx.matrix.Matrix2D
},
skewYgAt: function(/* Number */ degree, /* Number||Point */ a, /* Number, optional */ b){
// summary: skews a picture along the y axis using a specified point as a center of skewing
// description: Compare with dojo.gfx.matrix.skewYg().
// degree: Number: an skewing angle in degrees
// a: Number: an x component of a central point
// b: Number: a y component of a central point
// accepts several signatures:
// 1) skew angle in degrees, Point
// 2) skew angle in degrees, x, y
if(arguments.length > 2){
return dojo.gfx.matrix._sandwich(dojo.gfx.matrix.skewYg(degree), a, b); // dojo.gfx.matrix.Matrix2D
}
// branch
// degree: Number: an skewing angle in degrees
// a: dojo.gfx.Point: a central point
// b: null
return dojo.gfx.matrix._sandwich(dojo.gfx.matrix.skewYg(degree), a.x, a.y); // dojo.gfx.matrix.Matrix2D
}
// TODO: rect-to-rect mapping, scale-to-fit (isotropic and anisotropic versions)
});

View File

@@ -0,0 +1,333 @@
/*
Copyright (c) 2004-2006, The Dojo Foundation
All Rights Reserved.
Licensed under the Academic Free License version 2.1 or above OR the
modified BSD license. For more information on Dojo licensing, see:
http://dojotoolkit.org/community/licensing.shtml
*/
dojo.provide("dojo.gfx.path");
dojo.require("dojo.math");
dojo.require("dojo.gfx.shape");
dojo.declare("dojo.gfx.path.Path", dojo.gfx.Shape, {
// summary: a generalized path shape
initializer: function(rawNode){
// summary: a constructor of a path shape object
// rawNode: Node: a DOM node to be used by this path object
this.shape = dojo.lang.shallowCopy(dojo.gfx.defaultPath, true);
this.segments = [];
this.absolute = true;
this.last = {};
this.attach(rawNode);
},
// mode manipulations
setAbsoluteMode: function(mode){
// summary: sets an absolute or relative mode for path points
// mode: Boolean: true/false or "absolute"/"relative" to specify the mode
this.absolute = typeof(mode) == "string" ? (mode == "absolute") : mode;
return this; // self
},
getAbsoluteMode: function(){
// summary: returns a current value of the absolute mode
return this.absolute; // Boolean
},
getBoundingBox: function(){
// summary: returns the bounding box {x, y, width, height} or null
return "l" in this.bbox ? {x: this.bbox.l, y: this.bbox.t, width: this.bbox.r - this.bbox.l, height: this.bbox.b - this.bbox.t} : null; // dojo.gfx.Rectangle
},
getLastPosition: function(){
// summary: returns the last point in the path, or null
return "x" in this.last ? this.last : null; // Object
},
// segment interpretation
_updateBBox: function(x, y){
// summary: updates the bounding box of path with new point
// x: Number: an x coordinate
// y: Number: a y coordinate
// we use {l, b, r, t} representation of a bbox
if("l" in this.bbox){
if(this.bbox.l > x) this.bbox.l = x;
if(this.bbox.r < x) this.bbox.r = x;
if(this.bbox.t > y) this.bbox.t = y;
if(this.bbox.b < y) this.bbox.b = y;
}else{
this.bbox = {l: x, b: y, r: x, t: y};
}
},
_updateWithSegment: function(segment){
// summary: updates the bounding box of path with new segment
// segment: Object: a segment
var n = segment.args;
var l = n.length;
// update internal variables: bbox, absolute, last
switch(segment.action){
case "M":
case "L":
case "C":
case "S":
case "Q":
case "T":
for(var i = 0; i < l; i += 2){
this._updateBBox(this.bbox, n[i], n[i + 1]);
}
this.last.x = n[l - 2];
this.last.y = n[l - 1];
this.absolute = true;
break;
case "H":
for(var i = 0; i < l; ++i){
this._updateBBox(this.bbox, n[i], this.last.y);
}
this.last.x = n[l - 1];
this.absolute = true;
break;
case "V":
for(var i = 0; i < l; ++i){
this._updateBBox(this.bbox, this.last.x, n[i]);
}
this.last.y = n[l - 1];
this.absolute = true;
break;
case "m":
var start = 0;
if(!("x" in this.last)){
this._updateBBox(this.bbox, this.last.x = n[0], this.last.y = n[1]);
start = 2;
}
for(var i = start; i < l; i += 2){
this._updateBBox(this.bbox, this.last.x += n[i], this.last.y += n[i + 1]);
}
this.absolute = false;
break;
case "l":
case "t":
for(var i = 0; i < l; i += 2){
this._updateBBox(this.bbox, this.last.x += n[i], this.last.y += n[i + 1]);
}
this.absolute = false;
break;
case "h":
for(var i = 0; i < l; ++i){
this._updateBBox(this.bbox, this.last.x += n[i], this.last.y);
}
this.absolute = false;
break;
case "v":
for(var i = 0; i < l; ++i){
this._updateBBox(this.bbox, this.last.x, this.last.y += n[i]);
}
this.absolute = false;
break;
case "c":
for(var i = 0; i < l; i += 6){
this._updateBBox(this.bbox, this.last.x + n[i], this.last.y + n[i + 1]);
this._updateBBox(this.bbox, this.last.x + n[i + 2], this.last.y + n[i + 3]);
this._updateBBox(this.bbox, this.last.x += n[i + 4], this.last.y += n[i + 5]);
}
this.absolute = false;
break;
case "s":
case "q":
for(var i = 0; i < l; i += 4){
this._updateBBox(this.bbox, this.last.x + n[i], this.last.y + n[i + 1]);
this._updateBBox(this.bbox, this.last.x += n[i + 2], this.last.y += n[i + 3]);
}
this.absolute = false;
break;
case "A":
for(var i = 0; i < l; i += 7){
this._updateBBox(this.bbox, n[i + 5], n[i + 6]);
}
this.last.x = n[l - 2];
this.last.y = n[l - 1];
this.absolute = true;
break;
case "a":
for(var i = 0; i < l; i += 7){
this._updateBBox(this.bbox, this.last.x += n[i + 5], this.last.y += n[i + 6]);
}
this.absolute = false;
break;
}
// add an SVG path segment
var path = [segment.action];
for(var i = 0; i < l; ++i){
path.push(dojo.gfx.formatNumber(n[i], true));
}
if(typeof(this.shape.path) == "string"){
this.shape.path += path.join("");
}else{
this.shape.path = this.shape.path.concat(path);
}
},
// a dictionary, which maps segment type codes to a number of their argemnts
_validSegments: {m: 2, l: 2, h: 1, v: 1, c: 6, s: 4, q: 4, t: 2, a: 7, z: 0},
_pushSegment: function(action, args){
// summary: adds a segment
// action: String: valid SVG code for a segment's type
// args: Array: a list of parameters for this segment
var group = this._validSegments[action.toLowerCase()];
if(typeof(group) == "number"){
if(group){
if(args.length >= group){
var segment = {action: action, args: args.slice(0, args.length - args.length % group)};
this.segments.push(segment);
this._updateWithSegment(segment);
}
}else{
var segment = {action: action, args: []};
this.segments.push(segment);
this._updateWithSegment(segment);
}
}
},
_collectArgs: function(array, args){
// summary: converts an array of arguments to plain numeric values
// array: Array: an output argument (array of numbers)
// args: Array: an input argument (can be values of Boolean, Number, dojo.gfx.Point, or an embedded array of them)
for(var i = 0; i < args.length; ++i){
var t = args[i];
if(typeof(t) == "boolean"){
array.push(t ? 1 : 0);
}else if(typeof(t) == "number"){
array.push(t);
}else if(t instanceof Array){
this._collectArgs(array, t);
}else if("x" in t && "y" in t){
array.push(t.x);
array.push(t.y);
}
}
},
// segments
moveTo: function(){
// summary: formes a move segment
var args = [];
this._collectArgs(args, arguments);
this._pushSegment(this.absolute ? "M" : "m", args);
return this; // self
},
lineTo: function(){
// summary: formes a line segment
var args = [];
this._collectArgs(args, arguments);
this._pushSegment(this.absolute ? "L" : "l", args);
return this; // self
},
hLineTo: function(){
// summary: formes a horizontal line segment
var args = [];
this._collectArgs(args, arguments);
this._pushSegment(this.absolute ? "H" : "h", args);
return this; // self
},
vLineTo: function(){
// summary: formes a vertical line segment
var args = [];
this._collectArgs(args, arguments);
this._pushSegment(this.absolute ? "V" : "v", args);
return this; // self
},
curveTo: function(){
// summary: formes a curve segment
var args = [];
this._collectArgs(args, arguments);
this._pushSegment(this.absolute ? "C" : "c", args);
return this; // self
},
smoothCurveTo: function(){
// summary: formes a smooth curve segment
var args = [];
this._collectArgs(args, arguments);
this._pushSegment(this.absolute ? "S" : "s", args);
return this; // self
},
qCurveTo: function(){
// summary: formes a quadratic curve segment
var args = [];
this._collectArgs(args, arguments);
this._pushSegment(this.absolute ? "Q" : "q", args);
return this; // self
},
qSmoothCurveTo: function(){
// summary: formes a quadratic smooth curve segment
var args = [];
this._collectArgs(args, arguments);
this._pushSegment(this.absolute ? "T" : "t", args);
return this; // self
},
arcTo: function(){
// summary: formes an elliptic arc segment
var args = [];
this._collectArgs(args, arguments);
for(var i = 2; i < args.length; i += 7){
args[i] = -args[i];
}
this._pushSegment(this.absolute ? "A" : "a", args);
return this; // self
},
closePath: function(){
// summary: closes a path
this._pushSegment("Z", []);
return this; // self
},
// setShape
_setPath: function(path){
// summary: forms a path using an SVG path string
// path: String: an SVG path string
var p = path.match(dojo.gfx.pathRegExp);
this.segments = [];
this.absolute = true;
this.bbox = {};
this.last = {};
if(!p) return;
// create segments
var action = ""; // current action
var args = []; // current arguments
for(var i = 0; i < p.length; ++i){
var t = p[i];
var x = parseFloat(t);
if(isNaN(x)){
if(action){
this._pushSegment(action, args);
}
args = [];
action = t;
}else{
args.push(x);
}
}
this._pushSegment(action, args);
},
setShape: function(newShape){
// summary: forms a path using a shape
// newShape: Object: an SVG path string or a path object (see dojo.gfx.defaultPath)
this.shape = dojo.gfx.makeParameters(this.shape, typeof(newShape) == "string" ? {path: newShape} : newShape);
var path = this.shape.path;
// switch to non-updating version of path building
this.shape.path = [];
this._setPath(path);
// switch back to the string path
this.shape.path = this.shape.path.join("");
return this; // self
},
// useful constant for descendants
_2PI: Math.PI * 2
});

View File

@@ -0,0 +1,427 @@
/*
Copyright (c) 2004-2006, The Dojo Foundation
All Rights Reserved.
Licensed under the Academic Free License version 2.1 or above OR the
modified BSD license. For more information on Dojo licensing, see:
http://dojotoolkit.org/community/licensing.shtml
*/
dojo.provide("dojo.gfx.shape");
dojo.require("dojo.lang.declare");
dojo.require("dojo.gfx.common");
dojo.declare("dojo.gfx.Shape", null, {
// summary: a Shape object, which knows how to apply
// graphical attributes and transformations
initializer: function(){
// rawNode: Node: underlying node
this.rawNode = null;
// shape: Object: an abstract shape object
// (see dojo.gfx.defaultPath,
// dojo.gfx.defaultPolyline,
// dojo.gfx.defaultRect,
// dojo.gfx.defaultEllipse,
// dojo.gfx.defaultCircle,
// dojo.gfx.defaultLine,
// or dojo.gfx.defaultImage)
this.shape = null;
// matrix: dojo.gfx.matrix.Matrix: a transformation matrix
this.matrix = null;
// fillStyle: Object: a fill object
// (see dojo.gfx.defaultLinearGradient,
// dojo.gfx.defaultRadialGradient,
// dojo.gfx.defaultPattern,
// or dojo.gfx.color.Color)
this.fillStyle = null;
// strokeStyle: Object: a stroke object
// (see dojo.gfx.defaultStroke)
this.strokeStyle = null;
// bbox: dojo.gfx.Rectangle: a bounding box of this shape
// (see dojo.gfx.defaultRect)
this.bbox = null;
// virtual group structure
// parent: Object: a parent or null
// (see dojo.gfx.Surface,
// dojo.gfx.shape.VirtualGroup,
// or dojo.gfx.Group)
this.parent = null;
// parentMatrix: dojo.gfx.matrix.Matrix
// a transformation matrix inherited from the parent
this.parentMatrix = null;
},
// trivial getters
getNode: function(){
// summary: returns the current DOM Node or null
return this.rawNode; // Node
},
getShape: function(){
// summary: returns the current shape object or null
// (see dojo.gfx.defaultPath,
// dojo.gfx.defaultPolyline,
// dojo.gfx.defaultRect,
// dojo.gfx.defaultEllipse,
// dojo.gfx.defaultCircle,
// dojo.gfx.defaultLine,
// or dojo.gfx.defaultImage)
return this.shape; // Object
},
getTransform: function(){
// summary: returns the current transformation matrix or null
return this.matrix; // dojo.gfx.matrix.Matrix
},
getFill: function(){
// summary: returns the current fill object or null
// (see dojo.gfx.defaultLinearGradient,
// dojo.gfx.defaultRadialGradient,
// dojo.gfx.defaultPattern,
// or dojo.gfx.color.Color)
return this.fillStyle; // Object
},
getStroke: function(){
// summary: returns the current stroke object or null
// (see dojo.gfx.defaultStroke)
return this.strokeStyle; // Object
},
getParent: function(){
// summary: returns the parent or null
// (see dojo.gfx.Surface,
// dojo.gfx.shape.VirtualGroup,
// or dojo.gfx.Group)
return this.parent; // Object
},
getBoundingBox: function(){
// summary: returns the bounding box or null
// (see dojo.gfx.defaultRect)
return this.bbox; // dojo.gfx.Rectangle
},
getEventSource: function(){
// summary: returns a Node, which is used as
// a source of events for this shape
return this.rawNode; // Node
},
// empty settings
setShape: function(shape){
// summary: sets a shape object
// (the default implementation simply ignores it)
// shape: Object: a shape object
// (see dojo.gfx.defaultPath,
// dojo.gfx.defaultPolyline,
// dojo.gfx.defaultRect,
// dojo.gfx.defaultEllipse,
// dojo.gfx.defaultCircle,
// dojo.gfx.defaultLine,
// or dojo.gfx.defaultImage)
return this; // self
},
setFill: function(fill){
// summary: sets a fill object
// (the default implementation simply ignores it)
// fill: Object: a fill object
// (see dojo.gfx.defaultLinearGradient,
// dojo.gfx.defaultRadialGradient,
// dojo.gfx.defaultPattern,
// or dojo.gfx.color.Color)
return this; // self
},
setStroke: function(stroke){
// summary: sets a stroke object
// (the default implementation simply ignores it)
// stroke: Object: a stroke object
// (see dojo.gfx.defaultStroke)
return this; // self
},
// z-index
moveToFront: function(){
// summary: moves a shape to front of its parent's list of shapes
// (the default implementation does nothing)
return this; // self
},
moveToBack: function(){
// summary: moves a shape to back of its parent's list of shapes
// (the default implementation does nothing)
return this;
},
setTransform: function(matrix){
// summary: sets a transformation matrix
// matrix: dojo.gfx.matrix.Matrix: a matrix or a matrix-like object
// (see an argument of dojo.gfx.matrix.Matrix
// constructor for a list of acceptable arguments)
this.matrix = dojo.gfx.matrix.clone(matrix ? dojo.gfx.matrix.normalize(matrix) : dojo.gfx.identity, true);
return this._applyTransform(); // self
},
// apply left & right transformation
applyRightTransform: function(matrix){
// summary: multiplies the existing matrix with an argument on right side
// (this.matrix * matrix)
// matrix: dojo.gfx.matrix.Matrix: a matrix or a matrix-like object
// (see an argument of dojo.gfx.matrix.Matrix
// constructor for a list of acceptable arguments)
return matrix ? this.setTransform([this.matrix, matrix]) : this; // self
},
applyLeftTransform: function(matrix){
// summary: multiplies the existing matrix with an argument on left side
// (matrix * this.matrix)
// matrix: dojo.gfx.matrix.Matrix: a matrix or a matrix-like object
// (see an argument of dojo.gfx.matrix.Matrix
// constructor for a list of acceptable arguments)
return matrix ? this.setTransform([matrix, this.matrix]) : this; // self
},
applyTransform: function(matrix){
// summary: a shortcut for dojo.gfx.Shape.applyRight
// matrix: dojo.gfx.matrix.Matrix: a matrix or a matrix-like object
// (see an argument of dojo.gfx.matrix.Matrix
// constructor for a list of acceptable arguments)
return matrix ? this.setTransform([this.matrix, matrix]) : this; // self
},
// virtual group methods
remove: function(silently){
// summary: removes the shape from its parent's list of shapes
// silently: Boolean?: if true, do not redraw a picture yet
if(this.parent){
this.parent.remove(this, silently);
}
return this; // self
},
_setParent: function(parent, matrix){
// summary: sets a parent
// parent: Object: a parent or null
// (see dojo.gfx.Surface,
// dojo.gfx.shape.VirtualGroup,
// or dojo.gfx.Group)
// matrix: dojo.gfx.matrix.Matrix:
// a 2D matrix or a matrix-like object
this.parent = parent;
return this._updateParentMatrix(matrix); // self
},
_updateParentMatrix: function(matrix){
// summary: updates the parent matrix with new matrix
// matrix: dojo.gfx.matrix.Matrix:
// a 2D matrix or a matrix-like object
this.parentMatrix = matrix ? dojo.gfx.matrix.clone(matrix) : null;
return this._applyTransform(); // self
},
_getRealMatrix: function(){
// summary: returns the cumulative ("real") transformation matrix
// by combining the shape's matrix with its parent's matrix
return this.parentMatrix ? new dojo.gfx.matrix.Matrix2D([this.parentMatrix, this.matrix]) : this.matrix; // dojo.gfx.matrix.Matrix
}
});
dojo.declare("dojo.gfx.shape.VirtualGroup", dojo.gfx.Shape, {
// summary: a virtual group of shapes, which can be used
// as a foundation for renderer-specific groups, or as a way
// to logically group shapes (e.g, to propagate matricies)
initializer: function() {
// children: Array: a list of children
this.children = [];
},
// group management
add: function(shape){
// summary: adds a shape to the list
// shape: dojo.gfx.Shape: a shape
var oldParent = shape.getParent();
if(oldParent){
oldParent.remove(shape, true);
}
this.children.push(shape);
return shape._setParent(this, this._getRealMatrix()); // self
},
remove: function(shape, silently){
// summary: removes a shape from the list
// silently: Boolean?: if true, do not redraw a picture yet
for(var i = 0; i < this.children.length; ++i){
if(this.children[i] == shape){
if(silently){
// skip for now
}else{
shape._setParent(null, null);
}
this.children.splice(i, 1);
break;
}
}
return this; // self
},
// apply transformation
_applyTransform: function(){
// summary: applies a transformation matrix to a group
var matrix = this._getRealMatrix();
for(var i = 0; i < this.children.length; ++i){
this.children[i]._updateParentMatrix(matrix);
}
return this; // self
}
});
dojo.declare("dojo.gfx.shape.Rect", dojo.gfx.Shape, {
// summary: a generic rectangle
initializer: function(rawNode) {
// summary: creates a rectangle
// rawNode: Node: a DOM Node
this.shape = dojo.lang.shallowCopy(dojo.gfx.defaultRect, true);
this.attach(rawNode);
},
getBoundingBox: function(){
// summary: returns the bounding box (its shape in this case)
return this.shape; // dojo.gfx.Rectangle
}
});
dojo.declare("dojo.gfx.shape.Ellipse", dojo.gfx.Shape, {
// summary: a generic ellipse
initializer: function(rawNode) {
// summary: creates an ellipse
// rawNode: Node: a DOM Node
this.shape = dojo.lang.shallowCopy(dojo.gfx.defaultEllipse, true);
this.attach(rawNode);
},
getBoundingBox: function(){
// summary: returns the bounding box
if(!this.bbox){
var shape = this.shape;
this.bbox = {x: shape.cx - shape.rx, y: shape.cy - shape.ry,
width: 2 * shape.rx, height: 2 * shape.ry};
}
return this.bbox; // dojo.gfx.Rectangle
}
});
dojo.declare("dojo.gfx.shape.Circle", dojo.gfx.Shape, {
// summary: a generic circle
// (this is a helper object, which is defined for convinience)
initializer: function(rawNode) {
// summary: creates a circle
// rawNode: Node: a DOM Node
this.shape = dojo.lang.shallowCopy(dojo.gfx.defaultCircle, true);
this.attach(rawNode);
},
getBoundingBox: function(){
// summary: returns the bounding box
if(!this.bbox){
var shape = this.shape;
this.bbox = {x: shape.cx - shape.r, y: shape.cy - shape.r,
width: 2 * shape.r, height: 2 * shape.r};
}
return this.bbox; // dojo.gfx.Rectangle
}
});
dojo.declare("dojo.gfx.shape.Line", dojo.gfx.Shape, {
// summary: a generic line
// (this is a helper object, which is defined for convinience)
initializer: function(rawNode) {
// summary: creates a line
// rawNode: Node: a DOM Node
this.shape = dojo.lang.shallowCopy(dojo.gfx.defaultLine, true);
this.attach(rawNode);
},
getBoundingBox: function(){
// summary: returns the bounding box
if(!this.bbox){
var shape = this.shape;
this.bbox = {
x: Math.min(shape.x1, shape.x2),
y: Math.min(shape.y1, shape.y2),
width: Math.abs(shape.x2 - shape.x1),
height: Math.abs(shape.y2 - shape.y1)
};
}
return this.bbox; // dojo.gfx.Rectangle
}
});
dojo.declare("dojo.gfx.shape.Polyline", dojo.gfx.Shape, {
// summary: a generic polyline/polygon
// (this is a helper object, which is defined for convinience)
initializer: function(rawNode) {
// summary: creates a line
// rawNode: Node: a DOM Node
this.shape = dojo.lang.shallowCopy(dojo.gfx.defaultPolyline, true);
this.attach(rawNode);
},
getBoundingBox: function(){
// summary: returns the bounding box
if(!this.bbox && this.shape.points.length){
var p = this.shape.points;
var l = p.length;
var t = p[0];
var bbox = {l: t.x, t: t.y, r: t.x, b: t.y};
for(var i = 1; i < l; ++i){
t = p[i];
if(bbox.l > t.x) bbox.l = t.x;
if(bbox.r < t.x) bbox.r = t.x;
if(bbox.t > t.y) bbox.t = t.y;
if(bbox.b < t.y) bbox.b = t.y;
}
this.bbox = {
x: bbox.l,
y: bbox.t,
width: bbox.r - bbox.l,
height: bbox.b - bbox.t
};
}
return this.bbox; // dojo.gfx.Rectangle
}
});
dojo.declare("dojo.gfx.shape.Image", dojo.gfx.Shape, {
// summary: a generic image
// (this is a helper object, which is defined for convinience)
initializer: function(rawNode) {
// summary: creates an image
// rawNode: Node: a DOM Node
this.shape = dojo.lang.shallowCopy(dojo.gfx.defaultImage, true);
this.attach(rawNode);
},
getBoundingBox: function(){
// summary: returns the bounding box
if(!this.bbox){
var shape = this.shape;
this.bbox = {
x: 0,
y: 0,
width: shape.width,
height: shape.height
};
}
return this.bbox; // dojo.gfx.Rectangle
}
});

View File

@@ -0,0 +1,661 @@
/*
Copyright (c) 2004-2006, The Dojo Foundation
All Rights Reserved.
Licensed under the Academic Free License version 2.1 or above OR the
modified BSD license. For more information on Dojo licensing, see:
http://dojotoolkit.org/community/licensing.shtml
*/
dojo.provide("dojo.gfx.svg");
dojo.require("dojo.lang.declare");
dojo.require("dojo.svg");
dojo.require("dojo.gfx.color");
dojo.require("dojo.gfx.common");
dojo.require("dojo.gfx.shape");
dojo.require("dojo.gfx.path");
dojo.require("dojo.experimental");
dojo.experimental("dojo.gfx.svg");
dojo.gfx.svg.getRef = function(fill){
// summary: returns a DOM Node specified by the fill argument or null
// fill: String: an SVG fill
if(!fill || fill == "none") return null;
if(fill.match(/^url\(#.+\)$/)){
return dojo.byId(fill.slice(5, -1)); // Node
}
// Opera's bug: incorrect representation of a reference
if(dojo.render.html.opera && fill.match(/^#dj_unique_.+$/)){
// we assume here that a reference was generated by dojo.gfx
return dojo.byId(fill.slice(1)); // Node
}
return null; // Node
};
dojo.lang.extend(dojo.gfx.Shape, {
// summary: SVG-specific implementation of dojo.gfx.Shape methods
setFill: function(fill){
// summary: sets a fill object (SVG)
// fill: Object: a fill object
// (see dojo.gfx.defaultLinearGradient,
// dojo.gfx.defaultRadialGradient,
// dojo.gfx.defaultPattern,
// or dojo.gfx.color.Color)
if(!fill){
// don't fill
this.fillStyle = null;
this.rawNode.setAttribute("fill", "none");
this.rawNode.setAttribute("fill-opacity", 0);
return this;
}
if(typeof(fill) == "object" && "type" in fill){
// gradient
switch(fill.type){
case "linear":
var f = dojo.gfx.makeParameters(dojo.gfx.defaultLinearGradient, fill);
var gradient = this._setFillObject(f, "linearGradient");
dojo.lang.forEach(["x1", "y1", "x2", "y2"], function(x){
gradient.setAttribute(x, f[x].toFixed(8));
});
break;
case "radial":
var f = dojo.gfx.makeParameters(dojo.gfx.defaultRadialGradient, fill);
var gradient = this._setFillObject(f, "radialGradient");
dojo.lang.forEach(["cx", "cy", "r"], function(x){
gradient.setAttribute(x, f[x].toFixed(8));
});
break;
case "pattern":
var f = dojo.gfx.makeParameters(dojo.gfx.defaultPattern, fill);
var pattern = this._setFillObject(f, "pattern");
dojo.lang.forEach(["x", "y", "width", "height"], function(x){
pattern.setAttribute(x, f[x].toFixed(8));
});
break;
}
return this;
}
// color object
var f = dojo.gfx.normalizeColor(fill);
this.fillStyle = f;
this.rawNode.setAttribute("fill", f.toCss());
this.rawNode.setAttribute("fill-opacity", f.a);
return this; // self
},
setStroke: function(stroke){
// summary: sets a stroke object (SVG)
// stroke: Object: a stroke object
// (see dojo.gfx.defaultStroke)
if(!stroke){
// don't stroke
this.strokeStyle = null;
this.rawNode.setAttribute("stroke", "none");
this.rawNode.setAttribute("stroke-opacity", 0);
return this;
}
// normalize the stroke
this.strokeStyle = dojo.gfx.makeParameters(dojo.gfx.defaultStroke, stroke);
this.strokeStyle.color = dojo.gfx.normalizeColor(this.strokeStyle.color);
// generate attributes
var s = this.strokeStyle;
var rn = this.rawNode;
if(s){
rn.setAttribute("stroke", s.color.toCss());
rn.setAttribute("stroke-opacity", s.color.a);
rn.setAttribute("stroke-width", s.width);
rn.setAttribute("stroke-linecap", s.cap);
if(typeof(s.join) == "number"){
rn.setAttribute("stroke-linejoin", "miter");
rn.setAttribute("stroke-miterlimit", s.join);
}else{
rn.setAttribute("stroke-linejoin", s.join);
}
}
return this; // self
},
_setFillObject: function(f, nodeType){
var def_elems = this.rawNode.parentNode.getElementsByTagName("defs");
if(def_elems.length == 0){ return this; }
this.fillStyle = f;
var defs = def_elems[0];
var fill = this.rawNode.getAttribute("fill");
var ref = dojo.gfx.svg.getRef(fill);
if(ref){
fill = ref;
if(fill.tagName.toLowerCase() != nodeType.toLowerCase()){
var id = fill.id;
fill.parentNode.removeChild(fill);
fill = document.createElementNS(dojo.svg.xmlns.svg, nodeType);
fill.setAttribute("id", id);
defs.appendChild(fill);
}else{
while(fill.childNodes.length){
fill.removeChild(fill.lastChild);
}
}
}else{
fill = document.createElementNS(dojo.svg.xmlns.svg, nodeType);
fill.setAttribute("id", dojo.dom.getUniqueId());
defs.appendChild(fill);
}
if(nodeType == "pattern"){
fill.setAttribute("patternUnits", "userSpaceOnUse");
var img = document.createElementNS(dojo.svg.xmlns.svg, "image");
img.setAttribute("x", 0);
img.setAttribute("y", 0);
img.setAttribute("width", f.width .toFixed(8));
img.setAttribute("height", f.height.toFixed(8));
img.setAttributeNS(dojo.svg.xmlns.xlink, "href", f.src);
fill.appendChild(img);
}else{
fill.setAttribute("gradientUnits", "userSpaceOnUse");
for(var i = 0; i < f.colors.length; ++i){
f.colors[i].color = dojo.gfx.normalizeColor(f.colors[i].color);
var t = document.createElementNS(dojo.svg.xmlns.svg, "stop");
t.setAttribute("offset", f.colors[i].offset.toFixed(8));
t.setAttribute("stop-color", f.colors[i].color.toCss());
fill.appendChild(t);
}
}
this.rawNode.setAttribute("fill", "url(#" + fill.getAttribute("id") +")");
this.rawNode.removeAttribute("fill-opacity");
return fill;
},
_applyTransform: function() {
var matrix = this._getRealMatrix();
if(matrix){
var tm = this.matrix;
this.rawNode.setAttribute("transform", "matrix(" +
tm.xx.toFixed(8) + "," + tm.yx.toFixed(8) + "," +
tm.xy.toFixed(8) + "," + tm.yy.toFixed(8) + "," +
tm.dx.toFixed(8) + "," + tm.dy.toFixed(8) + ")");
}else{
this.rawNode.removeAttribute("transform");
}
return this;
},
setRawNode: function(rawNode){
// summary:
// assigns and clears the underlying node that will represent this
// shape. Once set, transforms, gradients, etc, can be applied.
// (no fill & stroke by default)
with(rawNode){
setAttribute("fill", "none");
setAttribute("fill-opacity", 0);
setAttribute("stroke", "none");
setAttribute("stroke-opacity", 0);
setAttribute("stroke-width", 1);
setAttribute("stroke-linecap", "butt");
setAttribute("stroke-linejoin", "miter");
setAttribute("stroke-miterlimit", 4);
}
this.rawNode = rawNode;
},
moveToFront: function(){
// summary: moves a shape to front of its parent's list of shapes (SVG)
this.rawNode.parentNode.appendChild(this.rawNode);
return this; // self
},
moveToBack: function(){
// summary: moves a shape to back of its parent's list of shapes (SVG)
this.rawNode.parentNode.insertBefore(this.rawNode, this.rawNode.parentNode.firstChild);
return this; // self
},
setShape: function(newShape){
// summary: sets a shape object (SVG)
// newShape: Object: a shape object
// (see dojo.gfx.defaultPath,
// dojo.gfx.defaultPolyline,
// dojo.gfx.defaultRect,
// dojo.gfx.defaultEllipse,
// dojo.gfx.defaultCircle,
// dojo.gfx.defaultLine,
// or dojo.gfx.defaultImage)
this.shape = dojo.gfx.makeParameters(this.shape, newShape);
for(var i in this.shape){
if(i != "type"){ this.rawNode.setAttribute(i, this.shape[i]); }
}
return this; // self
},
attachFill: function(rawNode){
// summary: deduces a fill style from a Node.
// rawNode: Node: an SVG node
var fillStyle = null;
if(rawNode){
var fill = rawNode.getAttribute("fill");
if(fill == "none"){ return; }
var ref = dojo.gfx.svg.getRef(fill);
if(ref){
var gradient = ref;
switch(gradient.tagName.toLowerCase()){
case "lineargradient":
fillStyle = this._getGradient(dojo.gfx.defaultLinearGradient, gradient);
dojo.lang.forEach(["x1", "y1", "x2", "y2"], function(x){
fillStyle[x] = gradient.getAttribute(x);
});
break;
case "radialgradient":
fillStyle = this._getGradient(dojo.gfx.defaultRadialGradient, gradient);
dojo.lang.forEach(["cx", "cy", "r"], function(x){
fillStyle[x] = gradient.getAttribute(x);
});
fillStyle.cx = gradient.getAttribute("cx");
fillStyle.cy = gradient.getAttribute("cy");
fillStyle.r = gradient.getAttribute("r");
break;
case "pattern":
fillStyle = dojo.lang.shallowCopy(dojo.gfx.defaultPattern, true);
dojo.lang.forEach(["x", "y", "width", "height"], function(x){
fillStyle[x] = gradient.getAttribute(x);
});
fillStyle.src = gradient.firstChild.getAttributeNS(dojo.svg.xmlns.xlink, "href");
break;
}
}else{
fillStyle = new dojo.gfx.color.Color(fill);
var opacity = rawNode.getAttribute("fill-opacity");
if(opacity != null) fillStyle.a = opacity;
}
}
return fillStyle; // Object
},
_getGradient: function(defaultGradient, gradient){
var fillStyle = dojo.lang.shallowCopy(defaultGradient, true);
fillStyle.colors = [];
for(var i = 0; i < gradient.childNodes.length; ++i){
fillStyle.colors.push({
offset: gradient.childNodes[i].getAttribute("offset"),
color: new dojo.gfx.color.Color(gradient.childNodes[i].getAttribute("stop-color"))
});
}
return fillStyle;
},
attachStroke: function(rawNode){
// summary: deduces a stroke style from a Node.
// rawNode: Node: an SVG node
if(!rawNode){ return; }
var stroke = rawNode.getAttribute("stroke");
if(stroke == null || stroke == "none") return null;
var strokeStyle = dojo.lang.shallowCopy(dojo.gfx.defaultStroke, true);
var color = new dojo.gfx.color.Color(stroke);
if(color){
strokeStyle.color = color;
strokeStyle.color.a = rawNode.getAttribute("stroke-opacity");
strokeStyle.width = rawNode.getAttribute("stroke-width");
strokeStyle.cap = rawNode.getAttribute("stroke-linecap");
strokeStyle.join = rawNode.getAttribute("stroke-linejoin");
if(strokeStyle.join == "miter"){
strokeStyle.join = rawNode.getAttribute("stroke-miterlimit");
}
}
return strokeStyle; // Object
},
attachTransform: function(rawNode){
// summary: deduces a transformation matrix from a Node.
// rawNode: Node: an SVG node
var matrix = null;
if(rawNode){
matrix = rawNode.getAttribute("transform");
if(matrix.match(/^matrix\(.+\)$/)){
var t = matrix.slice(7, -1).split(",");
matrix = dojo.gfx.matrix.normalize({
xx: parseFloat(t[0]), xy: parseFloat(t[2]),
yx: parseFloat(t[1]), yy: parseFloat(t[3]),
dx: parseFloat(t[4]), dy: parseFloat(t[5])
});
}
}
return matrix; // dojo.gfx.matrix.Matrix
},
attachShape: function(rawNode){
// summary: builds a shape from a Node.
// rawNode: Node: an SVG node
var shape = null;
if(rawNode){
shape = dojo.lang.shallowCopy(this.shape, true);
for(var i in shape) {
shape[i] = rawNode.getAttribute(i);
}
}
return shape; // dojo.gfx.Shape
},
attach: function(rawNode){
// summary: reconstructs all shape parameters from a Node.
// rawNode: Node: an SVG node
if(rawNode) {
this.rawNode = rawNode;
this.fillStyle = this.attachFill(rawNode);
this.strokeStyle = this.attachStroke(rawNode);
this.matrix = this.attachTransform(rawNode);
this.shape = this.attachShape(rawNode);
}
}
});
dojo.declare("dojo.gfx.Group", dojo.gfx.Shape, {
// summary: a group shape (SVG), which can be used
// to logically group shapes (e.g, to propagate matricies)
setRawNode: function(rawNode){
// summary: sets a raw SVG node to be used by this shape
// rawNode: Node: an SVG node
this.rawNode = rawNode;
}
});
dojo.gfx.Group.nodeType = "g";
dojo.declare("dojo.gfx.Rect", dojo.gfx.shape.Rect, {
// summary: a rectangle shape (SVG)
attachShape: function(rawNode){
// summary: builds a rectangle shape from a Node.
// rawNode: Node: an SVG node
var shape = null;
if(rawNode){
shape = dojo.gfx.Rect.superclass.attachShape.apply(this, arguments);
shape.r = Math.min(rawNode.getAttribute("rx"), rawNode.getAttribute("ry"));
}
return shape; // dojo.gfx.shape.Rect
},
setShape: function(newShape){
// summary: sets a rectangle shape object (SVG)
// newShape: Object: a rectangle shape object
this.shape = dojo.gfx.makeParameters(this.shape, newShape);
this.bbox = null;
for(var i in this.shape){
if(i != "type" && i != "r"){ this.rawNode.setAttribute(i, this.shape[i]); }
}
this.rawNode.setAttribute("rx", this.shape.r);
this.rawNode.setAttribute("ry", this.shape.r);
return this; // self
}
});
dojo.gfx.Rect.nodeType = "rect";
dojo.gfx.Ellipse = dojo.gfx.shape.Ellipse;
dojo.gfx.Ellipse.nodeType = "ellipse";
dojo.gfx.Circle = dojo.gfx.shape.Circle;
dojo.gfx.Circle.nodeType = "circle";
dojo.gfx.Line = dojo.gfx.shape.Line;
dojo.gfx.Line.nodeType = "line";
dojo.declare("dojo.gfx.Polyline", dojo.gfx.shape.Polyline, {
// summary: a polyline/polygon shape (SVG)
setShape: function(points){
// summary: sets a polyline/polygon shape object (SVG)
// points: Object: a polyline/polygon shape object
if(points && points instanceof Array){
// branch
// points: Array: an array of points
this.shape = dojo.gfx.makeParameters(this.shape, { points: points });
if(closed && this.shape.points.length){
this.shape.points.push(this.shape.points[0]);
}
}else{
this.shape = dojo.gfx.makeParameters(this.shape, points);
}
this.box = null;
var attr = [];
var p = this.shape.points;
for(var i = 0; i < p.length; ++i){
attr.push(p[i].x.toFixed(8));
attr.push(p[i].y.toFixed(8));
}
this.rawNode.setAttribute("points", attr.join(" "));
return this; // self
}
});
dojo.gfx.Polyline.nodeType = "polyline";
dojo.declare("dojo.gfx.Image", dojo.gfx.shape.Image, {
// summary: an image (SVG)
setShape: function(newShape){
// summary: sets an image shape object (SVG)
// newShape: Object: an image shape object
this.shape = dojo.gfx.makeParameters(this.shape, newShape);
this.bbox = null;
var rawNode = this.rawNode;
for(var i in this.shape){
if(i != "type" && i != "src"){ rawNode.setAttribute(i, this.shape[i]); }
}
rawNode.setAttributeNS(dojo.svg.xmlns.xlink, "href", this.shape.src);
return this; // self
},
setStroke: function(){
// summary: ignore setting a stroke style
return this; // self
},
setFill: function(){
// summary: ignore setting a fill style
return this; // self
},
attachStroke: function(rawNode){
// summary: ignore attaching a stroke style
return null;
},
attachFill: function(rawNode){
// summary: ignore attaching a fill style
return null;
}
});
dojo.gfx.Image.nodeType = "image";
dojo.declare("dojo.gfx.Path", dojo.gfx.path.Path, {
// summary: a path shape (SVG)
_updateWithSegment: function(segment){
// summary: updates the bounding box of path with new segment
// segment: Object: a segment
dojo.gfx.Path.superclass._updateWithSegment.apply(this, arguments);
if(typeof(this.shape.path) == "string"){
this.rawNode.setAttribute("d", this.shape.path);
}
},
setShape: function(newShape){
// summary: forms a path using a shape (SVG)
// newShape: Object: an SVG path string or a path object (see dojo.gfx.defaultPath)
dojo.gfx.Path.superclass.setShape.apply(this, arguments);
this.rawNode.setAttribute("d", this.shape.path);
return this; // self
}
});
dojo.gfx.Path.nodeType = "path";
dojo.gfx._creators = {
// summary: SVG shape creators
createPath: function(path){
// summary: creates an SVG path shape
// path: Object: a path object (see dojo.gfx.defaultPath)
return this.createObject(dojo.gfx.Path, path); // dojo.gfx.Path
},
createRect: function(rect){
// summary: creates an SVG rectangle shape
// rect: Object: a path object (see dojo.gfx.defaultRect)
return this.createObject(dojo.gfx.Rect, rect); // dojo.gfx.Rect
},
createCircle: function(circle){
// summary: creates an SVG circle shape
// circle: Object: a circle object (see dojo.gfx.defaultCircle)
return this.createObject(dojo.gfx.Circle, circle); // dojo.gfx.Circle
},
createEllipse: function(ellipse){
// summary: creates an SVG ellipse shape
// ellipse: Object: an ellipse object (see dojo.gfx.defaultEllipse)
return this.createObject(dojo.gfx.Ellipse, ellipse); // dojo.gfx.Ellipse
},
createLine: function(line){
// summary: creates an SVG line shape
// line: Object: a line object (see dojo.gfx.defaultLine)
return this.createObject(dojo.gfx.Line, line); // dojo.gfx.Line
},
createPolyline: function(points){
// summary: creates an SVG polyline/polygon shape
// points: Object: a points object (see dojo.gfx.defaultPolyline)
// or an Array of points
return this.createObject(dojo.gfx.Polyline, points); // dojo.gfx.Polyline
},
createImage: function(image){
// summary: creates an SVG image shape
// image: Object: an image object (see dojo.gfx.defaultImage)
return this.createObject(dojo.gfx.Image, image); // dojo.gfx.Image
},
createGroup: function(){
// summary: creates an SVG group shape
return this.createObject(dojo.gfx.Group); // dojo.gfx.Group
},
createObject: function(shapeType, rawShape){
// summary: creates an instance of the passed shapeType class
// shapeType: Function: a class constructor to create an instance of
// rawShape: Object: properties to be passed in to the classes "setShape" method
if(!this.rawNode){ return null; }
var shape = new shapeType();
var node = document.createElementNS(dojo.svg.xmlns.svg, shapeType.nodeType);
shape.setRawNode(node);
this.rawNode.appendChild(node);
shape.setShape(rawShape);
this.add(shape);
return shape; // dojo.gfx.Shape
},
// group control
add: function(shape){
// summary: adds a shape to a group/surface
// shape: dojo.gfx.Shape: an SVG shape object
var oldParent = shape.getParent();
if(oldParent){
oldParent.remove(shape, true);
}
shape._setParent(this, null);
this.rawNode.appendChild(shape.rawNode);
return this; // self
},
remove: function(shape, silently){
// summary: remove a shape from a group/surface
// shape: dojo.gfx.Shape: an SVG shape object
// silently: Boolean?: if true, regenerate a picture
if(this.rawNode == shape.rawNode.parentNode){
this.rawNode.removeChild(shape.rawNode);
}
shape._setParent(null, null);
return this; // self
}
};
dojo.gfx.attachNode = function(node){
// summary: creates a shape from a Node
// node: Node: an SVG node
if(!node) return null;
var s = null;
switch(node.tagName.toLowerCase()){
case dojo.gfx.Rect.nodeType:
s = new dojo.gfx.Rect();
break;
case dojo.gfx.Ellipse.nodeType:
s = new dojo.gfx.Ellipse();
break;
case dojo.gfx.Polyline.nodeType:
s = new dojo.gfx.Polyline();
break;
case dojo.gfx.Path.nodeType:
s = new dojo.gfx.Path();
break;
case dojo.gfx.Circle.nodeType:
s = new dojo.gfx.Circle();
break;
case dojo.gfx.Line.nodeType:
s = new dojo.gfx.Line();
break;
case dojo.gfx.Image.nodeType:
s = new dojo.gfx.Image();
break;
default:
dojo.debug("FATAL ERROR! tagName = " + node.tagName);
}
s.attach(node);
return s; // dojo.gfx.Shape
};
dojo.lang.extend(dojo.gfx.Surface, {
// summary: a surface object to be used for drawings (SVG)
setDimensions: function(width, height){
// summary: sets the width and height of the rawNode
// width: String: width of surface, e.g., "100px"
// height: String: height of surface, e.g., "100px"
if(!this.rawNode){ return this; }
this.rawNode.setAttribute("width", width);
this.rawNode.setAttribute("height", height);
return this; // self
},
getDimensions: function(){
// summary: returns an object with properties "width" and "height"
return this.rawNode ? {width: this.rawNode.getAttribute("width"), height: this.rawNode.getAttribute("height")} : null; // Object
}
});
dojo.gfx.createSurface = function(parentNode, width, height){
// summary: creates a surface (SVG)
// parentNode: Node: a parent node
// width: String: width of surface, e.g., "100px"
// height: String: height of surface, e.g., "100px"
var s = new dojo.gfx.Surface();
s.rawNode = document.createElementNS(dojo.svg.xmlns.svg, "svg");
s.rawNode.setAttribute("width", width);
s.rawNode.setAttribute("height", height);
var defs = new dojo.gfx.svg.Defines();
var node = document.createElementNS(dojo.svg.xmlns.svg, dojo.gfx.svg.Defines.nodeType);
defs.setRawNode(node);
s.rawNode.appendChild(node);
dojo.byId(parentNode).appendChild(s.rawNode);
return s; // dojo.gfx.Surface
};
dojo.gfx.attachSurface = function(node){
// summary: creates a surface from a Node
// node: Node: an SVG node
var s = new dojo.gfx.Surface();
s.rawNode = node;
return s; // dojo.gfx.Surface
};
dojo.lang.extend(dojo.gfx.Group, dojo.gfx._creators);
dojo.lang.extend(dojo.gfx.Surface, dojo.gfx._creators);
delete dojo.gfx._creators;
// Gradient and pattern
dojo.gfx.svg.Defines = function(){
this.rawNode = null;
};
dojo.lang.extend(dojo.gfx.svg.Defines, {
setRawNode: function(rawNode){
this.rawNode = rawNode;
}
});
dojo.gfx.svg.Defines.nodeType = "defs";

File diff suppressed because it is too large Load Diff