| 1318 |
alexandre_ |
1 |
/*
|
|
|
2 |
Copyright (c) 2004-2006, The Dojo Foundation
|
|
|
3 |
All Rights Reserved.
|
|
|
4 |
|
|
|
5 |
Licensed under the Academic Free License version 2.1 or above OR the
|
|
|
6 |
modified BSD license. For more information on Dojo licensing, see:
|
|
|
7 |
|
|
|
8 |
http://dojotoolkit.org/community/licensing.shtml
|
|
|
9 |
*/
|
|
|
10 |
|
|
|
11 |
dojo.provide("dojo.gfx.vml");
|
|
|
12 |
dojo.require("dojo.dom");
|
|
|
13 |
dojo.require("dojo.math");
|
|
|
14 |
dojo.require("dojo.lang.declare");
|
|
|
15 |
dojo.require("dojo.lang.extras");
|
|
|
16 |
dojo.require("dojo.string.*");
|
|
|
17 |
dojo.require("dojo.html.metrics");
|
|
|
18 |
dojo.require("dojo.gfx.color");
|
|
|
19 |
dojo.require("dojo.gfx.common");
|
|
|
20 |
dojo.require("dojo.gfx.shape");
|
|
|
21 |
dojo.require("dojo.gfx.path");
|
|
|
22 |
dojo.require("dojo.experimental");
|
|
|
23 |
dojo.experimental("dojo.gfx.vml");
|
|
|
24 |
dojo.gfx.vml.xmlns = "urn:schemas-microsoft-com:vml";
|
|
|
25 |
dojo.gfx.vml._parseFloat = function (str) {
|
|
|
26 |
return str.match(/^\d+f$/i) ? parseInt(str) / 65536 : parseFloat(str);
|
|
|
27 |
};
|
|
|
28 |
dojo.gfx.vml.cm_in_pt = 72 / 2.54;
|
|
|
29 |
dojo.gfx.vml.mm_in_pt = 7.2 / 2.54;
|
|
|
30 |
dojo.gfx.vml.px_in_pt = function () {
|
|
|
31 |
return dojo.html.getCachedFontMeasurements()["12pt"] / 12;
|
|
|
32 |
};
|
|
|
33 |
dojo.gfx.vml.pt2px = function (len) {
|
|
|
34 |
return len * this.px_in_pt();
|
|
|
35 |
};
|
|
|
36 |
dojo.gfx.vml.px2pt = function (len) {
|
|
|
37 |
return len / this.px_in_pt();
|
|
|
38 |
};
|
|
|
39 |
dojo.gfx.vml.normalizedLength = function (len) {
|
|
|
40 |
if (len.length == 0) {
|
|
|
41 |
return 0;
|
|
|
42 |
}
|
|
|
43 |
if (len.length > 2) {
|
|
|
44 |
var px_in_pt = this.px_in_pt();
|
|
|
45 |
var val = parseFloat(len);
|
|
|
46 |
switch (len.slice(-2)) {
|
|
|
47 |
case "px":
|
|
|
48 |
return val;
|
|
|
49 |
case "pt":
|
|
|
50 |
return val * px_in_pt;
|
|
|
51 |
case "in":
|
|
|
52 |
return val * 72 * px_in_pt;
|
|
|
53 |
case "pc":
|
|
|
54 |
return val * 12 * px_in_pt;
|
|
|
55 |
case "mm":
|
|
|
56 |
return val / this.mm_in_pt * px_in_pt;
|
|
|
57 |
case "cm":
|
|
|
58 |
return val / this.cm_in_pt * px_in_pt;
|
|
|
59 |
}
|
|
|
60 |
}
|
|
|
61 |
return parseFloat(len);
|
|
|
62 |
};
|
|
|
63 |
dojo.lang.extend(dojo.gfx.Shape, {setFill:function (fill) {
|
|
|
64 |
if (!fill) {
|
|
|
65 |
this.fillStyle = null;
|
|
|
66 |
this.rawNode.filled = false;
|
|
|
67 |
return this;
|
|
|
68 |
}
|
|
|
69 |
if (typeof (fill) == "object" && "type" in fill) {
|
|
|
70 |
switch (fill.type) {
|
|
|
71 |
case "linear":
|
|
|
72 |
var f = dojo.gfx.makeParameters(dojo.gfx.defaultLinearGradient, fill);
|
|
|
73 |
this.fillStyle = f;
|
|
|
74 |
var s = "";
|
|
|
75 |
for (var i = 0; i < f.colors.length; ++i) {
|
|
|
76 |
f.colors[i].color = dojo.gfx.normalizeColor(f.colors[i].color);
|
|
|
77 |
s += f.colors[i].offset.toFixed(8) + " " + f.colors[i].color.toHex() + ";";
|
|
|
78 |
}
|
|
|
79 |
var fo = this.rawNode.fill;
|
|
|
80 |
fo.colors.value = s;
|
|
|
81 |
fo.method = "sigma";
|
|
|
82 |
fo.type = "gradient";
|
|
|
83 |
fo.angle = (dojo.math.radToDeg(Math.atan2(f.x2 - f.x1, f.y2 - f.y1)) + 180) % 360;
|
|
|
84 |
fo.on = true;
|
|
|
85 |
break;
|
|
|
86 |
case "radial":
|
|
|
87 |
var f = dojo.gfx.makeParameters(dojo.gfx.defaultRadialGradient, fill);
|
|
|
88 |
this.fillStyle = f;
|
|
|
89 |
var w = parseFloat(this.rawNode.style.width);
|
|
|
90 |
var h = parseFloat(this.rawNode.style.height);
|
|
|
91 |
var c = isNaN(w) ? 1 : 2 * f.r / w;
|
|
|
92 |
var i = f.colors.length - 1;
|
|
|
93 |
f.colors[i].color = dojo.gfx.normalizeColor(f.colors[i].color);
|
|
|
94 |
var s = "0 " + f.colors[i].color.toHex();
|
|
|
95 |
for (; i >= 0; --i) {
|
|
|
96 |
f.colors[i].color = dojo.gfx.normalizeColor(f.colors[i].color);
|
|
|
97 |
s += (1 - c * f.colors[i].offset).toFixed(8) + " " + f.colors[i].color.toHex() + ";";
|
|
|
98 |
}
|
|
|
99 |
var fo = this.rawNode.fill;
|
|
|
100 |
fo.colors.value = s;
|
|
|
101 |
fo.method = "sigma";
|
|
|
102 |
fo.type = "gradientradial";
|
|
|
103 |
if (isNaN(w) || isNaN(h)) {
|
|
|
104 |
fo.focusposition = "0.5 0.5";
|
|
|
105 |
} else {
|
|
|
106 |
fo.focusposition = (f.cx / w).toFixed(8) + " " + (f.cy / h).toFixed(8);
|
|
|
107 |
}
|
|
|
108 |
fo.focussize = "0 0";
|
|
|
109 |
fo.on = true;
|
|
|
110 |
break;
|
|
|
111 |
case "pattern":
|
|
|
112 |
var f = dojo.gfx.makeParameters(dojo.gfx.defaultPattern, fill);
|
|
|
113 |
this.fillStyle = f;
|
|
|
114 |
var fo = this.rawNode.fill;
|
|
|
115 |
fo.type = "tile";
|
|
|
116 |
fo.src = f.src;
|
|
|
117 |
if (f.width && f.height) {
|
|
|
118 |
fo.size.x = dojo.gfx.vml.px2pt(f.width);
|
|
|
119 |
fo.size.y = dojo.gfx.vml.px2pt(f.height);
|
|
|
120 |
}
|
|
|
121 |
fo.alignShape = false;
|
|
|
122 |
fo.position.x = 0;
|
|
|
123 |
fo.position.y = 0;
|
|
|
124 |
fo.origin.x = f.width ? f.x / f.width : 0;
|
|
|
125 |
fo.origin.y = f.height ? f.y / f.height : 0;
|
|
|
126 |
fo.on = true;
|
|
|
127 |
break;
|
|
|
128 |
}
|
|
|
129 |
this.rawNode.fill.opacity = 1;
|
|
|
130 |
return this;
|
|
|
131 |
}
|
|
|
132 |
this.fillStyle = dojo.gfx.normalizeColor(fill);
|
|
|
133 |
this.rawNode.fillcolor = this.fillStyle.toHex();
|
|
|
134 |
this.rawNode.fill.opacity = this.fillStyle.a;
|
|
|
135 |
this.rawNode.filled = true;
|
|
|
136 |
return this;
|
|
|
137 |
}, setStroke:function (stroke) {
|
|
|
138 |
if (!stroke) {
|
|
|
139 |
this.strokeStyle = null;
|
|
|
140 |
this.rawNode.stroked = false;
|
|
|
141 |
return this;
|
|
|
142 |
}
|
|
|
143 |
this.strokeStyle = dojo.gfx.makeParameters(dojo.gfx.defaultStroke, stroke);
|
|
|
144 |
this.strokeStyle.color = dojo.gfx.normalizeColor(this.strokeStyle.color);
|
|
|
145 |
var s = this.strokeStyle;
|
|
|
146 |
this.rawNode.stroked = true;
|
|
|
147 |
this.rawNode.strokecolor = s.color.toCss();
|
|
|
148 |
this.rawNode.strokeweight = s.width + "px";
|
|
|
149 |
if (this.rawNode.stroke) {
|
|
|
150 |
this.rawNode.stroke.opacity = s.color.a;
|
|
|
151 |
this.rawNode.stroke.endcap = this._translate(this._capMap, s.cap);
|
|
|
152 |
if (typeof (s.join) == "number") {
|
|
|
153 |
this.rawNode.stroke.joinstyle = "miter";
|
|
|
154 |
this.rawNode.stroke.miterlimit = s.join;
|
|
|
155 |
} else {
|
|
|
156 |
this.rawNode.stroke.joinstyle = s.join;
|
|
|
157 |
}
|
|
|
158 |
}
|
|
|
159 |
return this;
|
|
|
160 |
}, _capMap:{butt:"flat"}, _capMapReversed:{flat:"butt"}, _translate:function (dict, value) {
|
|
|
161 |
return (value in dict) ? dict[value] : value;
|
|
|
162 |
}, _applyTransform:function () {
|
|
|
163 |
var matrix = this._getRealMatrix();
|
|
|
164 |
if (!matrix) {
|
|
|
165 |
return this;
|
|
|
166 |
}
|
|
|
167 |
var skew = this.rawNode.skew;
|
|
|
168 |
if (typeof (skew) == "undefined") {
|
|
|
169 |
for (var i = 0; i < this.rawNode.childNodes.length; ++i) {
|
|
|
170 |
if (this.rawNode.childNodes[i].tagName == "skew") {
|
|
|
171 |
skew = this.rawNode.childNodes[i];
|
|
|
172 |
break;
|
|
|
173 |
}
|
|
|
174 |
}
|
|
|
175 |
}
|
|
|
176 |
if (skew) {
|
|
|
177 |
skew.on = false;
|
|
|
178 |
var mt = matrix.xx.toFixed(8) + " " + matrix.xy.toFixed(8) + " " + matrix.yx.toFixed(8) + " " + matrix.yy.toFixed(8) + " 0 0";
|
|
|
179 |
var offset = Math.floor(matrix.dx).toFixed() + "px " + Math.floor(matrix.dy).toFixed() + "px";
|
|
|
180 |
var l = parseFloat(this.rawNode.style.left);
|
|
|
181 |
var t = parseFloat(this.rawNode.style.top);
|
|
|
182 |
var w = parseFloat(this.rawNode.style.width);
|
|
|
183 |
var h = parseFloat(this.rawNode.style.height);
|
|
|
184 |
if (isNaN(l)) {
|
|
|
185 |
l = 0;
|
|
|
186 |
}
|
|
|
187 |
if (isNaN(t)) {
|
|
|
188 |
t = 0;
|
|
|
189 |
}
|
|
|
190 |
if (isNaN(w)) {
|
|
|
191 |
w = 1;
|
|
|
192 |
}
|
|
|
193 |
if (isNaN(h)) {
|
|
|
194 |
h = 1;
|
|
|
195 |
}
|
|
|
196 |
var origin = (-l / w - 0.5).toFixed(8) + " " + (-t / h - 0.5).toFixed(8);
|
|
|
197 |
skew.matrix = mt;
|
|
|
198 |
skew.origin = origin;
|
|
|
199 |
skew.offset = offset;
|
|
|
200 |
skew.on = true;
|
|
|
201 |
}
|
|
|
202 |
return this;
|
|
|
203 |
}, setRawNode:function (rawNode) {
|
|
|
204 |
rawNode.stroked = false;
|
|
|
205 |
rawNode.filled = false;
|
|
|
206 |
this.rawNode = rawNode;
|
|
|
207 |
}, attachFill:function (rawNode) {
|
|
|
208 |
var fillStyle = null;
|
|
|
209 |
var fo = rawNode.fill;
|
|
|
210 |
if (rawNode) {
|
|
|
211 |
if (fo.on && fo.type == "gradient") {
|
|
|
212 |
var fillStyle = dojo.lang.shallowCopy(dojo.gfx.defaultLinearGradient, true);
|
|
|
213 |
var rad = dojo.math.degToRad(fo.angle);
|
|
|
214 |
fillStyle.x2 = Math.cos(rad);
|
|
|
215 |
fillStyle.y2 = Math.sin(rad);
|
|
|
216 |
fillStyle.colors = [];
|
|
|
217 |
var stops = fo.colors.value.split(";");
|
|
|
218 |
for (var i = 0; i < stops.length; ++i) {
|
|
|
219 |
var t = stops[i].match(/\S+/g);
|
|
|
220 |
if (!t || t.length != 2) {
|
|
|
221 |
continue;
|
|
|
222 |
}
|
|
|
223 |
fillStyle.colors.push({offset:dojo.gfx.vml._parseFloat(t[0]), color:new dojo.gfx.color.Color(t[1])});
|
|
|
224 |
}
|
|
|
225 |
} else {
|
|
|
226 |
if (fo.on && fo.type == "gradientradial") {
|
|
|
227 |
var fillStyle = dojo.lang.shallowCopy(dojo.gfx.defaultRadialGradient, true);
|
|
|
228 |
var w = parseFloat(rawNode.style.width);
|
|
|
229 |
var h = parseFloat(rawNode.style.height);
|
|
|
230 |
fillStyle.cx = isNaN(w) ? 0 : fo.focusposition.x * w;
|
|
|
231 |
fillStyle.cy = isNaN(h) ? 0 : fo.focusposition.y * h;
|
|
|
232 |
fillStyle.r = isNaN(w) ? 1 : w / 2;
|
|
|
233 |
fillStyle.colors = [];
|
|
|
234 |
var stops = fo.colors.value.split(";");
|
|
|
235 |
for (var i = stops.length - 1; i >= 0; --i) {
|
|
|
236 |
var t = stops[i].match(/\S+/g);
|
|
|
237 |
if (!t || t.length != 2) {
|
|
|
238 |
continue;
|
|
|
239 |
}
|
|
|
240 |
fillStyle.colors.push({offset:dojo.gfx.vml._parseFloat(t[0]), color:new dojo.gfx.color.Color(t[1])});
|
|
|
241 |
}
|
|
|
242 |
} else {
|
|
|
243 |
if (fo.on && fo.type == "tile") {
|
|
|
244 |
var fillStyle = dojo.lang.shallowCopy(dojo.gfx.defaultPattern, true);
|
|
|
245 |
fillStyle.width = dojo.gfx.vml.pt2px(fo.size.x);
|
|
|
246 |
fillStyle.height = dojo.gfx.vml.pt2px(fo.size.y);
|
|
|
247 |
fillStyle.x = fo.origin.x * fillStyle.width;
|
|
|
248 |
fillStyle.y = fo.origin.y * fillStyle.height;
|
|
|
249 |
fillStyle.src = fo.src;
|
|
|
250 |
} else {
|
|
|
251 |
if (fo.on && rawNode.fillcolor) {
|
|
|
252 |
fillStyle = new dojo.gfx.color.Color(rawNode.fillcolor + "");
|
|
|
253 |
fillStyle.a = fo.opacity;
|
|
|
254 |
}
|
|
|
255 |
}
|
|
|
256 |
}
|
|
|
257 |
}
|
|
|
258 |
}
|
|
|
259 |
return fillStyle;
|
|
|
260 |
}, attachStroke:function (rawNode) {
|
|
|
261 |
var strokeStyle = dojo.lang.shallowCopy(dojo.gfx.defaultStroke, true);
|
|
|
262 |
if (rawNode && rawNode.stroked) {
|
|
|
263 |
strokeStyle.color = new dojo.gfx.color.Color(rawNode.strokecolor.value);
|
|
|
264 |
dojo.debug("We are expecting an .75pt here, instead of strokeweight = " + rawNode.strokeweight);
|
|
|
265 |
strokeStyle.width = dojo.gfx.vml.normalizedLength(rawNode.strokeweight + "");
|
|
|
266 |
strokeStyle.color.a = rawNode.stroke.opacity;
|
|
|
267 |
strokeStyle.cap = this._translate(this._capMapReversed, rawNode.stroke.endcap);
|
|
|
268 |
strokeStyle.join = rawNode.stroke.joinstyle == "miter" ? rawNode.stroke.miterlimit : rawNode.stroke.joinstyle;
|
|
|
269 |
} else {
|
|
|
270 |
return null;
|
|
|
271 |
}
|
|
|
272 |
return strokeStyle;
|
|
|
273 |
}, attachTransform:function (rawNode) {
|
|
|
274 |
var matrix = {};
|
|
|
275 |
if (rawNode) {
|
|
|
276 |
var s = rawNode.skew;
|
|
|
277 |
matrix.xx = s.matrix.xtox;
|
|
|
278 |
matrix.xy = s.matrix.ytox;
|
|
|
279 |
matrix.yx = s.matrix.xtoy;
|
|
|
280 |
matrix.yy = s.matrix.ytoy;
|
|
|
281 |
matrix.dx = dojo.gfx.vml.pt2px(s.offset.x);
|
|
|
282 |
matrix.dy = dojo.gfx.vml.pt2px(s.offset.y);
|
|
|
283 |
}
|
|
|
284 |
return dojo.gfx.matrix.normalize(matrix);
|
|
|
285 |
}, attach:function (rawNode) {
|
|
|
286 |
if (rawNode) {
|
|
|
287 |
this.rawNode = rawNode;
|
|
|
288 |
this.shape = this.attachShape(rawNode);
|
|
|
289 |
this.fillStyle = this.attachFill(rawNode);
|
|
|
290 |
this.strokeStyle = this.attachStroke(rawNode);
|
|
|
291 |
this.matrix = this.attachTransform(rawNode);
|
|
|
292 |
}
|
|
|
293 |
}});
|
|
|
294 |
dojo.declare("dojo.gfx.Group", dojo.gfx.shape.VirtualGroup, {add:function (shape) {
|
|
|
295 |
if (this != shape.getParent()) {
|
|
|
296 |
this.rawNode.appendChild(shape.rawNode);
|
|
|
297 |
dojo.gfx.Group.superclass.add.apply(this, arguments);
|
|
|
298 |
}
|
|
|
299 |
return this;
|
|
|
300 |
}, remove:function (shape, silently) {
|
|
|
301 |
if (this == shape.getParent()) {
|
|
|
302 |
if (this.rawNode == shape.rawNode.parentNode) {
|
|
|
303 |
this.rawNode.removeChild(shape.rawNode);
|
|
|
304 |
}
|
|
|
305 |
dojo.gfx.Group.superclass.remove.apply(this, arguments);
|
|
|
306 |
}
|
|
|
307 |
return this;
|
|
|
308 |
}, attach:function (rawNode) {
|
|
|
309 |
if (rawNode) {
|
|
|
310 |
this.rawNode = rawNode;
|
|
|
311 |
this.shape = null;
|
|
|
312 |
this.fillStyle = null;
|
|
|
313 |
this.strokeStyle = null;
|
|
|
314 |
this.matrix = null;
|
|
|
315 |
}
|
|
|
316 |
}});
|
|
|
317 |
dojo.gfx.Group.nodeType = "group";
|
|
|
318 |
var zIndex = {moveToFront:function () {
|
|
|
319 |
this.rawNode.parentNode.appendChild(this.rawNode);
|
|
|
320 |
return this;
|
|
|
321 |
}, moveToBack:function () {
|
|
|
322 |
this.rawNode.parentNode.insertBefore(this.rawNode, this.rawNode.parentNode.firstChild);
|
|
|
323 |
return this;
|
|
|
324 |
}};
|
|
|
325 |
dojo.lang.extend(dojo.gfx.Shape, zIndex);
|
|
|
326 |
dojo.lang.extend(dojo.gfx.Group, zIndex);
|
|
|
327 |
delete zIndex;
|
|
|
328 |
dojo.declare("dojo.gfx.Rect", dojo.gfx.shape.Rect, {attachShape:function (rawNode) {
|
|
|
329 |
var arcsize = rawNode.outerHTML.match(/arcsize = \"(\d*\.?\d+[%f]?)\"/)[1];
|
|
|
330 |
arcsize = (arcsize.indexOf("%") >= 0) ? parseFloat(arcsize) / 100 : dojo.gfx.vml._parseFloat(arcsize);
|
|
|
331 |
var style = rawNode.style;
|
|
|
332 |
var width = parseFloat(style.width);
|
|
|
333 |
var height = parseFloat(style.height);
|
|
|
334 |
var o = dojo.gfx.makeParameters(dojo.gfx.defaultRect, {x:parseInt(style.left), y:parseInt(style.top), width:width, height:height, r:Math.min(width, height) * arcsize});
|
|
|
335 |
return o;
|
|
|
336 |
}, setShape:function (newShape) {
|
|
|
337 |
var shape = this.shape = dojo.gfx.makeParameters(this.shape, newShape);
|
|
|
338 |
this.bbox = null;
|
|
|
339 |
var style = this.rawNode.style;
|
|
|
340 |
style.left = shape.x.toFixed();
|
|
|
341 |
style.top = shape.y.toFixed();
|
|
|
342 |
style.width = (typeof (shape.width) == "string" && shape.width.indexOf("%") >= 0) ? shape.width : shape.width.toFixed();
|
|
|
343 |
style.height = (typeof (shape.width) == "string" && shape.height.indexOf("%") >= 0) ? shape.height : shape.height.toFixed();
|
|
|
344 |
var r = Math.min(1, (shape.r / Math.min(parseFloat(shape.width), parseFloat(shape.height)))).toFixed(8);
|
|
|
345 |
var parent = this.rawNode.parentNode;
|
|
|
346 |
var before = null;
|
|
|
347 |
if (parent) {
|
|
|
348 |
if (parent.lastChild != this.rawNode) {
|
|
|
349 |
for (var i = 0; i < parent.childNodes.length; ++i) {
|
|
|
350 |
if (parent.childNodes[i] == this.rawNode) {
|
|
|
351 |
before = parent.childNodes[i + 1];
|
|
|
352 |
break;
|
|
|
353 |
}
|
|
|
354 |
}
|
|
|
355 |
}
|
|
|
356 |
parent.removeChild(this.rawNode);
|
|
|
357 |
}
|
|
|
358 |
this.rawNode.arcsize = r;
|
|
|
359 |
if (parent) {
|
|
|
360 |
if (before) {
|
|
|
361 |
parent.insertBefore(this.rawNode, before);
|
|
|
362 |
} else {
|
|
|
363 |
parent.appendChild(this.rawNode);
|
|
|
364 |
}
|
|
|
365 |
}
|
|
|
366 |
return this.setTransform(this.matrix);
|
|
|
367 |
}});
|
|
|
368 |
dojo.gfx.Rect.nodeType = "roundrect";
|
|
|
369 |
dojo.declare("dojo.gfx.Ellipse", dojo.gfx.shape.Ellipse, {attachShape:function (rawNode) {
|
|
|
370 |
var style = this.rawNode.style;
|
|
|
371 |
var rx = parseInt(style.width) / 2;
|
|
|
372 |
var ry = parseInt(style.height) / 2;
|
|
|
373 |
var o = dojo.gfx.makeParameters(dojo.gfx.defaultEllipse, {cx:parseInt(style.left) + rx, cy:parseInt(style.top) + ry, rx:rx, ry:ry});
|
|
|
374 |
return o;
|
|
|
375 |
}, setShape:function (newShape) {
|
|
|
376 |
var shape = this.shape = dojo.gfx.makeParameters(this.shape, newShape);
|
|
|
377 |
this.bbox = null;
|
|
|
378 |
var style = this.rawNode.style;
|
|
|
379 |
style.left = (shape.cx - shape.rx).toFixed();
|
|
|
380 |
style.top = (shape.cy - shape.ry).toFixed();
|
|
|
381 |
style.width = (shape.rx * 2).toFixed();
|
|
|
382 |
style.height = (shape.ry * 2).toFixed();
|
|
|
383 |
return this.setTransform(this.matrix);
|
|
|
384 |
}});
|
|
|
385 |
dojo.gfx.Ellipse.nodeType = "oval";
|
|
|
386 |
dojo.declare("dojo.gfx.Circle", dojo.gfx.shape.Circle, {attachShape:function (rawNode) {
|
|
|
387 |
var style = this.rawNode.style;
|
|
|
388 |
var r = parseInt(style.width) / 2;
|
|
|
389 |
var o = dojo.gfx.makeParameters(dojo.gfx.defaultCircle, {cx:parseInt(style.left) + r, cy:parseInt(style.top) + r, r:r});
|
|
|
390 |
return o;
|
|
|
391 |
}, setShape:function (newShape) {
|
|
|
392 |
var shape = this.shape = dojo.gfx.makeParameters(this.shape, newShape);
|
|
|
393 |
this.bbox = null;
|
|
|
394 |
var style = this.rawNode.style;
|
|
|
395 |
style.left = (shape.cx - shape.r).toFixed();
|
|
|
396 |
style.top = (shape.cy - shape.r).toFixed();
|
|
|
397 |
style.width = (shape.r * 2).toFixed();
|
|
|
398 |
style.height = (shape.r * 2).toFixed();
|
|
|
399 |
return this;
|
|
|
400 |
}});
|
|
|
401 |
dojo.gfx.Circle.nodeType = "oval";
|
|
|
402 |
dojo.declare("dojo.gfx.Line", dojo.gfx.shape.Line, function (rawNode) {
|
|
|
403 |
if (rawNode) {
|
|
|
404 |
rawNode.setAttribute("dojoGfxType", "line");
|
|
|
405 |
}
|
|
|
406 |
}, {attachShape:function (rawNode) {
|
|
|
407 |
var p = rawNode.path.v.match(dojo.gfx.pathRegExp);
|
|
|
408 |
var shape = {};
|
|
|
409 |
do {
|
|
|
410 |
if (p.length < 7 || p[0] != "m" || p[3] != "l" || p[6] != "e") {
|
|
|
411 |
break;
|
|
|
412 |
}
|
|
|
413 |
shape.x1 = parseInt(p[1]);
|
|
|
414 |
shape.y1 = parseInt(p[2]);
|
|
|
415 |
shape.x2 = parseInt(p[4]);
|
|
|
416 |
shape.y2 = parseInt(p[5]);
|
|
|
417 |
} while (false);
|
|
|
418 |
return dojo.gfx.makeParameters(dojo.gfx.defaultLine, shape);
|
|
|
419 |
}, setShape:function (newShape) {
|
|
|
420 |
var shape = this.shape = dojo.gfx.makeParameters(this.shape, newShape);
|
|
|
421 |
this.bbox = null;
|
|
|
422 |
this.rawNode.path.v = "m" + shape.x1.toFixed() + " " + shape.y1.toFixed() + "l" + shape.x2.toFixed() + " " + shape.y2.toFixed() + "e";
|
|
|
423 |
return this.setTransform(this.matrix);
|
|
|
424 |
}});
|
|
|
425 |
dojo.gfx.Line.nodeType = "shape";
|
|
|
426 |
dojo.declare("dojo.gfx.Polyline", dojo.gfx.shape.Polyline, function (rawNode) {
|
|
|
427 |
if (rawNode) {
|
|
|
428 |
rawNode.setAttribute("dojoGfxType", "polyline");
|
|
|
429 |
}
|
|
|
430 |
}, {attachShape:function (rawNode) {
|
|
|
431 |
var shape = dojo.lang.shallowCopy(dojo.gfx.defaultPolyline, true);
|
|
|
432 |
var p = rawNode.path.v.match(dojo.gfx.pathRegExp);
|
|
|
433 |
do {
|
|
|
434 |
if (p.length < 3 || p[0] != "m") {
|
|
|
435 |
break;
|
|
|
436 |
}
|
|
|
437 |
var x = parseInt(p[0]);
|
|
|
438 |
var y = parseInt(p[1]);
|
|
|
439 |
if (isNaN(x) || isNaN(y)) {
|
|
|
440 |
break;
|
|
|
441 |
}
|
|
|
442 |
shape.points.push({x:x, y:y});
|
|
|
443 |
if (p.length < 6 || p[3] != "l") {
|
|
|
444 |
break;
|
|
|
445 |
}
|
|
|
446 |
for (var i = 4; i < p.length; i += 2) {
|
|
|
447 |
x = parseInt(p[i]);
|
|
|
448 |
y = parseInt(p[i + 1]);
|
|
|
449 |
if (isNaN(x) || isNaN(y)) {
|
|
|
450 |
break;
|
|
|
451 |
}
|
|
|
452 |
shape.points.push({x:x, y:y});
|
|
|
453 |
}
|
|
|
454 |
} while (false);
|
|
|
455 |
return shape;
|
|
|
456 |
}, setShape:function (points, closed) {
|
|
|
457 |
if (points && points instanceof Array) {
|
|
|
458 |
this.shape = dojo.gfx.makeParameters(this.shape, {points:points});
|
|
|
459 |
if (closed && this.shape.points.length) {
|
|
|
460 |
this.shape.points.push(this.shape.points[0]);
|
|
|
461 |
}
|
|
|
462 |
} else {
|
|
|
463 |
this.shape = dojo.gfx.makeParameters(this.shape, points);
|
|
|
464 |
}
|
|
|
465 |
this.bbox = null;
|
|
|
466 |
var attr = [];
|
|
|
467 |
var p = this.shape.points;
|
|
|
468 |
if (p.length > 0) {
|
|
|
469 |
attr.push("m");
|
|
|
470 |
attr.push(p[0].x.toFixed());
|
|
|
471 |
attr.push(p[0].y.toFixed());
|
|
|
472 |
if (p.length > 1) {
|
|
|
473 |
attr.push("l");
|
|
|
474 |
for (var i = 1; i < p.length; ++i) {
|
|
|
475 |
attr.push(p[i].x.toFixed());
|
|
|
476 |
attr.push(p[i].y.toFixed());
|
|
|
477 |
}
|
|
|
478 |
}
|
|
|
479 |
}
|
|
|
480 |
attr.push("e");
|
|
|
481 |
this.rawNode.path.v = attr.join(" ");
|
|
|
482 |
return this.setTransform(this.matrix);
|
|
|
483 |
}});
|
|
|
484 |
dojo.gfx.Polyline.nodeType = "shape";
|
|
|
485 |
dojo.declare("dojo.gfx.Image", dojo.gfx.shape.Image, {getEventSource:function () {
|
|
|
486 |
return this.rawNode ? this.rawNode.firstChild : null;
|
|
|
487 |
}, attachShape:function (rawNode) {
|
|
|
488 |
var shape = dojo.lang.shallowCopy(dojo.gfx.defaultImage, true);
|
|
|
489 |
shape.src = rawNode.firstChild.src;
|
|
|
490 |
return shape;
|
|
|
491 |
}, setShape:function (newShape) {
|
|
|
492 |
var shape = this.shape = dojo.gfx.makeParameters(this.shape, newShape);
|
|
|
493 |
this.bbox = null;
|
|
|
494 |
var firstChild = this.rawNode.firstChild;
|
|
|
495 |
firstChild.src = shape.src;
|
|
|
496 |
if (shape.width || shape.height) {
|
|
|
497 |
firstChild.style.width = shape.width;
|
|
|
498 |
firstChild.style.height = shape.height;
|
|
|
499 |
}
|
|
|
500 |
return this.setTransform(this.matrix);
|
|
|
501 |
}, setStroke:function () {
|
|
|
502 |
return this;
|
|
|
503 |
}, setFill:function () {
|
|
|
504 |
return this;
|
|
|
505 |
}, attachStroke:function (rawNode) {
|
|
|
506 |
return null;
|
|
|
507 |
}, attachFill:function (rawNode) {
|
|
|
508 |
return null;
|
|
|
509 |
}, attachTransform:function (rawNode) {
|
|
|
510 |
var matrix = {};
|
|
|
511 |
if (rawNode) {
|
|
|
512 |
var m = rawNode.filters["DXImageTransform.Microsoft.Matrix"];
|
|
|
513 |
matrix.xx = m.M11;
|
|
|
514 |
matrix.xy = m.M12;
|
|
|
515 |
matrix.yx = m.M21;
|
|
|
516 |
matrix.yy = m.M22;
|
|
|
517 |
matrix.dx = m.Dx;
|
|
|
518 |
matrix.dy = m.Dy;
|
|
|
519 |
}
|
|
|
520 |
return dojo.gfx.matrix.normalize(matrix);
|
|
|
521 |
}, _applyTransform:function () {
|
|
|
522 |
var matrix = this._getRealMatrix();
|
|
|
523 |
if (!matrix) {
|
|
|
524 |
return this;
|
|
|
525 |
}
|
|
|
526 |
with (this.rawNode.filters["DXImageTransform.Microsoft.Matrix"]) {
|
|
|
527 |
M11 = matrix.xx;
|
|
|
528 |
M12 = matrix.xy;
|
|
|
529 |
M21 = matrix.yx;
|
|
|
530 |
M22 = matrix.yy;
|
|
|
531 |
Dx = matrix.dx;
|
|
|
532 |
Dy = matrix.dy;
|
|
|
533 |
}
|
|
|
534 |
return this;
|
|
|
535 |
}});
|
|
|
536 |
dojo.gfx.Image.nodeType = "image";
|
|
|
537 |
dojo.gfx.path._calcArc = function (alpha) {
|
|
|
538 |
var cosa = Math.cos(alpha);
|
|
|
539 |
var sina = Math.sin(alpha);
|
|
|
540 |
var p2 = {x:cosa + (4 / 3) * (1 - cosa), y:sina - (4 / 3) * cosa * (1 - cosa) / sina};
|
|
|
541 |
return {s:{x:cosa, y:sina}, c1:p2, c2:{x:p2.x, y:-p2.y}, e:{x:cosa, y:-sina}};
|
|
|
542 |
};
|
|
|
543 |
dojo.declare("dojo.gfx.Path", dojo.gfx.path.Path, function (rawNode) {
|
|
|
544 |
if (rawNode) {
|
|
|
545 |
rawNode.setAttribute("dojoGfxType", "path");
|
|
|
546 |
}
|
|
|
547 |
this.vmlPath = "";
|
|
|
548 |
this.lastControl = {};
|
|
|
549 |
}, {_updateWithSegment:function (segment) {
|
|
|
550 |
var last = dojo.lang.shallowCopy(this.last);
|
|
|
551 |
dojo.gfx.Path.superclass._updateWithSegment.apply(this, arguments);
|
|
|
552 |
var path = this[this.renderers[segment.action]](segment, last);
|
|
|
553 |
if (typeof (this.vmlPath) == "string") {
|
|
|
554 |
this.vmlPath += path.join("");
|
|
|
555 |
} else {
|
|
|
556 |
this.vmlPath = this.vmlPath.concat(path);
|
|
|
557 |
}
|
|
|
558 |
if (typeof (this.vmlPath) == "string") {
|
|
|
559 |
this.rawNode.path.v = this.vmlPath + " e";
|
|
|
560 |
}
|
|
|
561 |
}, attachShape:function (rawNode) {
|
|
|
562 |
var shape = dojo.lang.shallowCopy(dojo.gfx.defaultPath, true);
|
|
|
563 |
var p = rawNode.path.v.match(dojo.gfx.pathRegExp);
|
|
|
564 |
var t = [], skip = false;
|
|
|
565 |
for (var i = 0; i < p.length; ++p) {
|
|
|
566 |
var s = p[i];
|
|
|
567 |
if (s in this._pathVmlToSvgMap) {
|
|
|
568 |
skip = false;
|
|
|
569 |
t.push(this._pathVmlToSvgMap[s]);
|
|
|
570 |
} else {
|
|
|
571 |
if (!skip) {
|
|
|
572 |
var n = parseInt(s);
|
|
|
573 |
if (isNaN(n)) {
|
|
|
574 |
skip = true;
|
|
|
575 |
} else {
|
|
|
576 |
t.push(n);
|
|
|
577 |
}
|
|
|
578 |
}
|
|
|
579 |
}
|
|
|
580 |
}
|
|
|
581 |
if (t.length) {
|
|
|
582 |
shape.path = t.join(" ");
|
|
|
583 |
}
|
|
|
584 |
return shape;
|
|
|
585 |
}, setShape:function (newShape) {
|
|
|
586 |
this.vmlPath = [];
|
|
|
587 |
this.lastControl = {};
|
|
|
588 |
dojo.gfx.Path.superclass.setShape.apply(this, arguments);
|
|
|
589 |
this.vmlPath = this.vmlPath.join("");
|
|
|
590 |
this.rawNode.path.v = this.vmlPath + " e";
|
|
|
591 |
return this;
|
|
|
592 |
}, _pathVmlToSvgMap:{m:"M", l:"L", t:"m", r:"l", c:"C", v:"c", qb:"Q", x:"z", e:""}, renderers:{M:"_moveToA", m:"_moveToR", L:"_lineToA", l:"_lineToR", H:"_hLineToA", h:"_hLineToR", V:"_vLineToA", v:"_vLineToR", C:"_curveToA", c:"_curveToR", S:"_smoothCurveToA", s:"_smoothCurveToR", Q:"_qCurveToA", q:"_qCurveToR", T:"_qSmoothCurveToA", t:"_qSmoothCurveToR", A:"_arcTo", a:"_arcTo", Z:"_closePath", z:"_closePath"}, _addArgs:function (path, args, from, upto) {
|
|
|
593 |
if (typeof (upto) == "undefined") {
|
|
|
594 |
upto = args.length;
|
|
|
595 |
}
|
|
|
596 |
if (typeof (from) == "undefined") {
|
|
|
597 |
from = 0;
|
|
|
598 |
}
|
|
|
599 |
for (var i = from; i < upto; ++i) {
|
|
|
600 |
path.push(" ");
|
|
|
601 |
path.push(args[i].toFixed());
|
|
|
602 |
}
|
|
|
603 |
}, _addArgsAdjusted:function (path, last, args, from, upto) {
|
|
|
604 |
if (typeof (upto) == "undefined") {
|
|
|
605 |
upto = args.length;
|
|
|
606 |
}
|
|
|
607 |
if (typeof (from) == "undefined") {
|
|
|
608 |
from = 0;
|
|
|
609 |
}
|
|
|
610 |
for (var i = from; i < upto; i += 2) {
|
|
|
611 |
path.push(" ");
|
|
|
612 |
path.push((last.x + args[i]).toFixed());
|
|
|
613 |
path.push(" ");
|
|
|
614 |
path.push((last.y + args[i + 1]).toFixed());
|
|
|
615 |
}
|
|
|
616 |
}, _moveToA:function (segment) {
|
|
|
617 |
var p = [" m"];
|
|
|
618 |
var n = segment.args;
|
|
|
619 |
var l = n.length;
|
|
|
620 |
if (l == 2) {
|
|
|
621 |
this._addArgs(p, n);
|
|
|
622 |
} else {
|
|
|
623 |
this._addArgs(p, n, 0, 2);
|
|
|
624 |
p.push(" l");
|
|
|
625 |
this._addArgs(p, n, 2);
|
|
|
626 |
}
|
|
|
627 |
this.lastControl = {};
|
|
|
628 |
return p;
|
|
|
629 |
}, _moveToR:function (segment, last) {
|
|
|
630 |
var p = ["x" in last ? " t" : " m"];
|
|
|
631 |
var n = segment.args;
|
|
|
632 |
var l = n.length;
|
|
|
633 |
if (l == 2) {
|
|
|
634 |
this._addArgs(p, n);
|
|
|
635 |
} else {
|
|
|
636 |
this._addArgs(p, n, 0, 2);
|
|
|
637 |
p.push(" r");
|
|
|
638 |
this._addArgs(p, n, 2);
|
|
|
639 |
}
|
|
|
640 |
this.lastControl = {};
|
|
|
641 |
return p;
|
|
|
642 |
}, _lineToA:function (segment) {
|
|
|
643 |
var p = [" l"];
|
|
|
644 |
this._addArgs(p, segment.args);
|
|
|
645 |
this.lastControl = {};
|
|
|
646 |
return p;
|
|
|
647 |
}, _lineToR:function (segment) {
|
|
|
648 |
var p = [" r"];
|
|
|
649 |
this._addArgs(p, segment.args);
|
|
|
650 |
this.lastControl = {};
|
|
|
651 |
return p;
|
|
|
652 |
}, _hLineToA:function (segment, last) {
|
|
|
653 |
var p = [" l"];
|
|
|
654 |
var n = segment.args;
|
|
|
655 |
var l = n.length;
|
|
|
656 |
var y = " " + last.y.toFixed();
|
|
|
657 |
for (var i = 0; i < l; ++i) {
|
|
|
658 |
p.push(" ");
|
|
|
659 |
p.push(n[i].toFixed());
|
|
|
660 |
p.push(y);
|
|
|
661 |
}
|
|
|
662 |
this.lastControl = {};
|
|
|
663 |
return p;
|
|
|
664 |
}, _hLineToR:function (segment) {
|
|
|
665 |
var p = [" r"];
|
|
|
666 |
var n = segment.args;
|
|
|
667 |
var l = n.length;
|
|
|
668 |
for (var i = 0; i < l; ++i) {
|
|
|
669 |
p.push(" ");
|
|
|
670 |
p.push(n[i].toFixed());
|
|
|
671 |
p.push(" 0");
|
|
|
672 |
}
|
|
|
673 |
this.lastControl = {};
|
|
|
674 |
return p;
|
|
|
675 |
}, _vLineToA:function (segment, last) {
|
|
|
676 |
var p = [" l"];
|
|
|
677 |
var n = segment.args;
|
|
|
678 |
var l = n.length;
|
|
|
679 |
var x = " " + last.x.toFixed();
|
|
|
680 |
for (var i = 0; i < l; ++i) {
|
|
|
681 |
p.push(x);
|
|
|
682 |
p.push(" ");
|
|
|
683 |
p.push(n[i].toFixed());
|
|
|
684 |
}
|
|
|
685 |
this.lastControl = {};
|
|
|
686 |
return p;
|
|
|
687 |
}, _vLineToR:function (segment) {
|
|
|
688 |
var p = [" r"];
|
|
|
689 |
var n = segment.args;
|
|
|
690 |
var l = n.length;
|
|
|
691 |
for (var i = 0; i < l; ++i) {
|
|
|
692 |
p.push(" 0 ");
|
|
|
693 |
p.push(n[i].toFixed());
|
|
|
694 |
}
|
|
|
695 |
this.lastControl = {};
|
|
|
696 |
return p;
|
|
|
697 |
}, _curveToA:function (segment) {
|
|
|
698 |
var p = [];
|
|
|
699 |
var n = segment.args;
|
|
|
700 |
var l = n.length;
|
|
|
701 |
for (var i = 0; i < l; i += 6) {
|
|
|
702 |
p.push(" c");
|
|
|
703 |
this._addArgs(p, n, i, i + 6);
|
|
|
704 |
}
|
|
|
705 |
this.lastControl = {x:n[l - 4], y:n[l - 3], type:"C"};
|
|
|
706 |
return p;
|
|
|
707 |
}, _curveToR:function (segment, last) {
|
|
|
708 |
var p = [];
|
|
|
709 |
var n = segment.args;
|
|
|
710 |
var l = n.length;
|
|
|
711 |
for (var i = 0; i < l; i += 6) {
|
|
|
712 |
p.push(" v");
|
|
|
713 |
this._addArgs(p, n, i, i + 6);
|
|
|
714 |
this.lastControl = {x:last.x + n[i + 2], y:last.y + n[i + 3]};
|
|
|
715 |
last.x += n[i + 4];
|
|
|
716 |
last.y += n[i + 5];
|
|
|
717 |
}
|
|
|
718 |
this.lastControl.type = "C";
|
|
|
719 |
return p;
|
|
|
720 |
}, _smoothCurveToA:function (segment, last) {
|
|
|
721 |
var p = [];
|
|
|
722 |
var n = segment.args;
|
|
|
723 |
var l = n.length;
|
|
|
724 |
for (var i = 0; i < l; i += 4) {
|
|
|
725 |
p.push(" c");
|
|
|
726 |
if (this.lastControl.type == "C") {
|
|
|
727 |
this._addArgs(p, [2 * last.x - this.lastControl.x, 2 * last.y - this.lastControl.y]);
|
|
|
728 |
} else {
|
|
|
729 |
this._addArgs(p, [last.x, last.y]);
|
|
|
730 |
}
|
|
|
731 |
this._addArgs(p, n, i, i + 4);
|
|
|
732 |
}
|
|
|
733 |
this.lastControl = {x:n[l - 4], y:n[l - 3], type:"C"};
|
|
|
734 |
return p;
|
|
|
735 |
}, _smoothCurveToR:function (segment, last) {
|
|
|
736 |
var p = [];
|
|
|
737 |
var n = segment.args;
|
|
|
738 |
var l = n.length;
|
|
|
739 |
for (var i = 0; i < l; i += 4) {
|
|
|
740 |
p.push(" v");
|
|
|
741 |
if (this.lastControl.type == "C") {
|
|
|
742 |
this._addArgs(p, [last.x - this.lastControl.x, last.y - this.lastControl.y]);
|
|
|
743 |
} else {
|
|
|
744 |
this._addArgs(p, [0, 0]);
|
|
|
745 |
}
|
|
|
746 |
this._addArgs(p, n, i, i + 4);
|
|
|
747 |
this.lastControl = {x:last.x + n[i], y:last.y + n[i + 1]};
|
|
|
748 |
last.x += n[i + 2];
|
|
|
749 |
last.y += n[i + 3];
|
|
|
750 |
}
|
|
|
751 |
this.lastControl.type = "C";
|
|
|
752 |
return p;
|
|
|
753 |
}, _qCurveToA:function (segment) {
|
|
|
754 |
var p = [];
|
|
|
755 |
var n = segment.args;
|
|
|
756 |
var l = n.length;
|
|
|
757 |
for (var i = 0; i < l; i += 4) {
|
|
|
758 |
p.push(" qb");
|
|
|
759 |
this._addArgs(p, n, i, i + 4);
|
|
|
760 |
}
|
|
|
761 |
this.lastControl = {x:n[l - 4], y:n[l - 3], type:"Q"};
|
|
|
762 |
return p;
|
|
|
763 |
}, _qCurveToR:function (segment, last) {
|
|
|
764 |
var p = [];
|
|
|
765 |
var n = segment.args;
|
|
|
766 |
var l = n.length;
|
|
|
767 |
for (var i = 0; i < l; i += 4) {
|
|
|
768 |
p.push(" qb");
|
|
|
769 |
this._addArgsAdjusted(p, last, n, i, i + 4);
|
|
|
770 |
this.lastControl = {x:last.x + n[i], y:last.y + n[i + 1]};
|
|
|
771 |
last.x += n[i + 2];
|
|
|
772 |
last.y += n[i + 3];
|
|
|
773 |
}
|
|
|
774 |
this.lastControl.type = "Q";
|
|
|
775 |
return p;
|
|
|
776 |
}, _qSmoothCurveToA:function (segment, last) {
|
|
|
777 |
var p = [];
|
|
|
778 |
var n = segment.args;
|
|
|
779 |
var l = n.length;
|
|
|
780 |
for (var i = 0; i < l; i += 2) {
|
|
|
781 |
p.push(" qb");
|
|
|
782 |
if (this.lastControl.type == "Q") {
|
|
|
783 |
this._addArgs(p, [this.lastControl.x = 2 * last.x - this.lastControl.x, this.lastControl.y = 2 * last.y - this.lastControl.y]);
|
|
|
784 |
} else {
|
|
|
785 |
this._addArgs(p, [this.lastControl.x = last.x, this.lastControl.y = last.y]);
|
|
|
786 |
}
|
|
|
787 |
this._addArgs(p, n, i, i + 2);
|
|
|
788 |
}
|
|
|
789 |
this.lastControl.type = "Q";
|
|
|
790 |
return p;
|
|
|
791 |
}, _qSmoothCurveToR:function (segment, last) {
|
|
|
792 |
var p = [];
|
|
|
793 |
var n = segment.args;
|
|
|
794 |
var l = n.length;
|
|
|
795 |
for (var i = 0; i < l; i += 2) {
|
|
|
796 |
p.push(" qb");
|
|
|
797 |
if (this.lastControl.type == "Q") {
|
|
|
798 |
this._addArgs(p, [this.lastControl.x = 2 * last.x - this.lastControl.x, this.lastControl.y = 2 * last.y - this.lastControl.y]);
|
|
|
799 |
} else {
|
|
|
800 |
this._addArgs(p, [this.lastControl.x = last.x, this.lastControl.y = last.y]);
|
|
|
801 |
}
|
|
|
802 |
this._addArgsAdjusted(p, last, n, i, i + 2);
|
|
|
803 |
}
|
|
|
804 |
this.lastControl.type = "Q";
|
|
|
805 |
return p;
|
|
|
806 |
}, _PI4:Math.PI / 4, _curvePI4:dojo.gfx.path._calcArc(Math.PI / 8), _calcArcTo:function (path, last, rx, ry, xRotg, large, cw, x, y) {
|
|
|
807 |
var m = dojo.gfx.matrix;
|
|
|
808 |
var xRot = -dojo.math.degToRad(xRotg);
|
|
|
809 |
var rx2 = rx * rx;
|
|
|
810 |
var ry2 = ry * ry;
|
|
|
811 |
var pa = m.multiplyPoint(m.rotate(-xRot), {x:(last.x - x) / 2, y:(last.y - y) / 2});
|
|
|
812 |
var pax2 = pa.x * pa.x;
|
|
|
813 |
var pay2 = pa.y * pa.y;
|
|
|
814 |
var c1 = Math.sqrt((rx2 * ry2 - rx2 * pay2 - ry2 * pax2) / (rx2 * pay2 + ry2 * pax2));
|
|
|
815 |
var ca = {x:c1 * rx * pa.y / ry, y:-c1 * ry * pa.x / rx};
|
|
|
816 |
if (large == cw) {
|
|
|
817 |
ca = {x:-ca.x, y:-ca.y};
|
|
|
818 |
}
|
|
|
819 |
var c = m.multiplyPoint([m.translate((last.x + x) / 2, (last.y + y) / 2), m.rotate(xRot)], ca);
|
|
|
820 |
var startAngle = Math.atan2(c.y - last.y, last.x - c.x) - xRot;
|
|
|
821 |
var endAngle = Math.atan2(c.y - y, x - c.x) - xRot;
|
|
|
822 |
var theta = cw ? startAngle - endAngle : endAngle - startAngle;
|
|
|
823 |
if (theta < 0) {
|
|
|
824 |
theta += this._2PI;
|
|
|
825 |
} else {
|
|
|
826 |
if (theta > this._2PI) {
|
|
|
827 |
theta = this._2PI;
|
|
|
828 |
}
|
|
|
829 |
}
|
|
|
830 |
var elliptic_transform = m.normalize([m.translate(c.x, c.y), m.rotate(xRot), m.scale(rx, ry)]);
|
|
|
831 |
var alpha = this._PI4 / 2;
|
|
|
832 |
var curve = this._curvePI4;
|
|
|
833 |
var step = cw ? -alpha : alpha;
|
|
|
834 |
for (var angle = theta; angle > 0; angle -= this._PI4) {
|
|
|
835 |
if (angle < this._PI4) {
|
|
|
836 |
alpha = angle / 2;
|
|
|
837 |
curve = dojo.gfx.path._calcArc(alpha);
|
|
|
838 |
step = cw ? -alpha : alpha;
|
|
|
839 |
}
|
|
|
840 |
var c1, c2, e;
|
|
|
841 |
var M = m.normalize([elliptic_transform, m.rotate(startAngle + step)]);
|
|
|
842 |
if (cw) {
|
|
|
843 |
c1 = m.multiplyPoint(M, curve.c2);
|
|
|
844 |
c2 = m.multiplyPoint(M, curve.c1);
|
|
|
845 |
e = m.multiplyPoint(M, curve.s);
|
|
|
846 |
} else {
|
|
|
847 |
c1 = m.multiplyPoint(M, curve.c1);
|
|
|
848 |
c2 = m.multiplyPoint(M, curve.c2);
|
|
|
849 |
e = m.multiplyPoint(M, curve.e);
|
|
|
850 |
}
|
|
|
851 |
path.push(" c");
|
|
|
852 |
this._addArgs(path, [c1.x, c1.y, c2.x, c2.y, e.x, e.y]);
|
|
|
853 |
startAngle += 2 * step;
|
|
|
854 |
}
|
|
|
855 |
}, _arcTo:function (segment, last) {
|
|
|
856 |
var p = [];
|
|
|
857 |
var n = segment.args;
|
|
|
858 |
var l = n.length;
|
|
|
859 |
var relative = segment.action == "a";
|
|
|
860 |
for (var i = 0; i < l; i += 7) {
|
|
|
861 |
var x1 = n[i + 5];
|
|
|
862 |
var y1 = n[i + 6];
|
|
|
863 |
if (relative) {
|
|
|
864 |
x1 += last.x;
|
|
|
865 |
y1 += last.y;
|
|
|
866 |
}
|
|
|
867 |
this._calcArcTo(p, last, n[i], n[i + 1], n[i + 2], n[i + 3] ? 1 : 0, n[i + 4] ? 1 : 0, x1, y1);
|
|
|
868 |
last = {x:x1, y:y1};
|
|
|
869 |
}
|
|
|
870 |
this.lastControl = {};
|
|
|
871 |
return p;
|
|
|
872 |
}, _closePath:function () {
|
|
|
873 |
this.lastControl = {};
|
|
|
874 |
return ["x"];
|
|
|
875 |
}});
|
|
|
876 |
dojo.gfx.Path.nodeType = "shape";
|
|
|
877 |
dojo.gfx._creators = {createPath:function (path) {
|
|
|
878 |
return this.createObject(dojo.gfx.Path, path, true);
|
|
|
879 |
}, createRect:function (rect) {
|
|
|
880 |
return this.createObject(dojo.gfx.Rect, rect);
|
|
|
881 |
}, createCircle:function (circle) {
|
|
|
882 |
return this.createObject(dojo.gfx.Circle, circle);
|
|
|
883 |
}, createEllipse:function (ellipse) {
|
|
|
884 |
return this.createObject(dojo.gfx.Ellipse, ellipse);
|
|
|
885 |
}, createLine:function (line) {
|
|
|
886 |
return this.createObject(dojo.gfx.Line, line, true);
|
|
|
887 |
}, createPolyline:function (points) {
|
|
|
888 |
return this.createObject(dojo.gfx.Polyline, points, true);
|
|
|
889 |
}, createImage:function (image) {
|
|
|
890 |
if (!this.rawNode) {
|
|
|
891 |
return null;
|
|
|
892 |
}
|
|
|
893 |
var shape = new dojo.gfx.Image();
|
|
|
894 |
var node = document.createElement("div");
|
|
|
895 |
node.style.position = "relative";
|
|
|
896 |
node.style.width = this.rawNode.style.width;
|
|
|
897 |
node.style.height = this.rawNode.style.height;
|
|
|
898 |
node.style.filter = "progid:DXImageTransform.Microsoft.Matrix(M11=1, M12=0, M21=0, M22=1, Dx=0, Dy=0)";
|
|
|
899 |
var img = document.createElement("img");
|
|
|
900 |
node.appendChild(img);
|
|
|
901 |
shape.setRawNode(node);
|
|
|
902 |
this.rawNode.appendChild(node);
|
|
|
903 |
shape.setShape(image);
|
|
|
904 |
this.add(shape);
|
|
|
905 |
return shape;
|
|
|
906 |
}, createGroup:function () {
|
|
|
907 |
return this.createObject(dojo.gfx.Group, null, true);
|
|
|
908 |
}, createObject:function (shapeType, rawShape, overrideSize) {
|
|
|
909 |
if (!this.rawNode) {
|
|
|
910 |
return null;
|
|
|
911 |
}
|
|
|
912 |
var shape = new shapeType();
|
|
|
913 |
var node = document.createElement("v:" + shapeType.nodeType);
|
|
|
914 |
shape.setRawNode(node);
|
|
|
915 |
this.rawNode.appendChild(node);
|
|
|
916 |
if (overrideSize) {
|
|
|
917 |
this._overrideSize(node);
|
|
|
918 |
}
|
|
|
919 |
shape.setShape(rawShape);
|
|
|
920 |
this.add(shape);
|
|
|
921 |
return shape;
|
|
|
922 |
}, _overrideSize:function (node) {
|
|
|
923 |
node.style.width = this.rawNode.style.width;
|
|
|
924 |
node.style.height = this.rawNode.style.height;
|
|
|
925 |
node.coordsize = parseFloat(node.style.width) + " " + parseFloat(node.style.height);
|
|
|
926 |
}};
|
|
|
927 |
dojo.lang.extend(dojo.gfx.Group, dojo.gfx._creators);
|
|
|
928 |
dojo.lang.extend(dojo.gfx.Surface, dojo.gfx._creators);
|
|
|
929 |
delete dojo.gfx._creators;
|
|
|
930 |
dojo.gfx.attachNode = function (node) {
|
|
|
931 |
if (!node) {
|
|
|
932 |
return null;
|
|
|
933 |
}
|
|
|
934 |
var s = null;
|
|
|
935 |
switch (node.tagName.toLowerCase()) {
|
|
|
936 |
case dojo.gfx.Rect.nodeType:
|
|
|
937 |
s = new dojo.gfx.Rect();
|
|
|
938 |
break;
|
|
|
939 |
case dojo.gfx.Ellipse.nodeType:
|
|
|
940 |
s = (node.style.width == node.style.height) ? new dojo.gfx.Circle() : new dojo.gfx.Ellipse();
|
|
|
941 |
break;
|
|
|
942 |
case dojo.gfx.Path.nodeType:
|
|
|
943 |
switch (node.getAttribute("dojoGfxType")) {
|
|
|
944 |
case "line":
|
|
|
945 |
s = new dojo.gfx.Line();
|
|
|
946 |
break;
|
|
|
947 |
case "polyline":
|
|
|
948 |
s = new dojo.gfx.Polyline();
|
|
|
949 |
break;
|
|
|
950 |
case "path":
|
|
|
951 |
s = new dojo.gfx.Path();
|
|
|
952 |
break;
|
|
|
953 |
}
|
|
|
954 |
break;
|
|
|
955 |
case dojo.gfx.Image.nodeType:
|
|
|
956 |
s = new dojo.gfx.Image();
|
|
|
957 |
break;
|
|
|
958 |
default:
|
|
|
959 |
dojo.debug("FATAL ERROR! tagName = " + node.tagName);
|
|
|
960 |
}
|
|
|
961 |
s.attach(node);
|
|
|
962 |
return s;
|
|
|
963 |
};
|
|
|
964 |
dojo.lang.extend(dojo.gfx.Surface, {setDimensions:function (width, height) {
|
|
|
965 |
if (!this.rawNode) {
|
|
|
966 |
return this;
|
|
|
967 |
}
|
|
|
968 |
this.rawNode.style.width = width;
|
|
|
969 |
this.rawNode.style.height = height;
|
|
|
970 |
this.rawNode.coordsize = width + " " + height;
|
|
|
971 |
return this;
|
|
|
972 |
}, getDimensions:function () {
|
|
|
973 |
return this.rawNode ? {width:this.rawNode.style.width, height:this.rawNode.style.height} : null;
|
|
|
974 |
}, add:function (shape) {
|
|
|
975 |
var oldParent = shape.getParent();
|
|
|
976 |
if (this != oldParent) {
|
|
|
977 |
this.rawNode.appendChild(shape.rawNode);
|
|
|
978 |
if (oldParent) {
|
|
|
979 |
oldParent.remove(shape, true);
|
|
|
980 |
}
|
|
|
981 |
shape._setParent(this, null);
|
|
|
982 |
}
|
|
|
983 |
return this;
|
|
|
984 |
}, remove:function (shape, silently) {
|
|
|
985 |
if (this == shape.getParent()) {
|
|
|
986 |
if (this.rawNode == shape.rawNode.parentNode) {
|
|
|
987 |
this.rawNode.removeChild(shape.rawNode);
|
|
|
988 |
}
|
|
|
989 |
shape._setParent(null, null);
|
|
|
990 |
}
|
|
|
991 |
return this;
|
|
|
992 |
}});
|
|
|
993 |
dojo.gfx.createSurface = function (parentNode, width, height) {
|
|
|
994 |
var s = new dojo.gfx.Surface();
|
|
|
995 |
s.rawNode = document.createElement("v:group");
|
|
|
996 |
s.rawNode.style.width = width ? width : "100%";
|
|
|
997 |
s.rawNode.style.height = height ? height : "100%";
|
|
|
998 |
s.rawNode.coordsize = (width && height) ? (parseFloat(width) + " " + parseFloat(height)) : "100% 100%";
|
|
|
999 |
s.rawNode.coordorigin = "0 0";
|
|
|
1000 |
dojo.byId(parentNode).appendChild(s.rawNode);
|
|
|
1001 |
return s;
|
|
|
1002 |
};
|
|
|
1003 |
dojo.gfx.attachSurface = function (node) {
|
|
|
1004 |
var s = new dojo.gfx.Surface();
|
|
|
1005 |
s.rawNode = node;
|
|
|
1006 |
return s;
|
|
|
1007 |
};
|
|
|
1008 |
|