graphael-rails 0.1.4 → 0.1.5

Sign up to get free protection for your applications and to get access to all the features.
Files changed (46) hide show
  1. checksums.yaml +7 -0
  2. data/Gemfile.lock +41 -6
  3. data/VERSION +1 -1
  4. data/graphael-rails.gemspec +7 -47
  5. metadata +16 -59
  6. data/vendor/assets/javascripts/g.raphael/README.markdown +0 -21
  7. data/vendor/assets/javascripts/g.raphael/docs/blueprint-min.png +0 -0
  8. data/vendor/assets/javascripts/g.raphael/docs/dr-print.css +0 -218
  9. data/vendor/assets/javascripts/g.raphael/docs/dr.css +0 -404
  10. data/vendor/assets/javascripts/g.raphael/docs/reference.html +0 -350
  11. data/vendor/assets/javascripts/g.raphael/docs/reference.js +0 -35
  12. data/vendor/assets/javascripts/g.raphael/g.bar.js +0 -621
  13. data/vendor/assets/javascripts/g.raphael/g.dot.js +0 -156
  14. data/vendor/assets/javascripts/g.raphael/g.line.js +0 -329
  15. data/vendor/assets/javascripts/g.raphael/g.pie.js +0 -255
  16. data/vendor/assets/javascripts/g.raphael/g.raphael.js +0 -887
  17. data/vendor/assets/javascripts/g.raphael/g.raphael.json +0 -9
  18. data/vendor/assets/javascripts/g.raphael/min/g.bar-min.js +0 -7
  19. data/vendor/assets/javascripts/g.raphael/min/g.dot-min.js +0 -7
  20. data/vendor/assets/javascripts/g.raphael/min/g.line-min.js +0 -7
  21. data/vendor/assets/javascripts/g.raphael/min/g.pie-min.js +0 -1
  22. data/vendor/assets/javascripts/g.raphael/min/g.raphael-min.js +0 -7
  23. data/vendor/assets/javascripts/g.raphael/raphael-min.js +0 -9
  24. data/vendor/assets/javascripts/g.raphael/test/barchart.html +0 -37
  25. data/vendor/assets/javascripts/g.raphael/test/barchart2.html +0 -51
  26. data/vendor/assets/javascripts/g.raphael/test/brightness.html +0 -47
  27. data/vendor/assets/javascripts/g.raphael/test/css/demo-print.css +0 -17
  28. data/vendor/assets/javascripts/g.raphael/test/css/demo.css +0 -21
  29. data/vendor/assets/javascripts/g.raphael/test/dotchart.html +0 -35
  30. data/vendor/assets/javascripts/g.raphael/test/images/bg.png +0 -0
  31. data/vendor/assets/javascripts/g.raphael/test/images/bgbg.png +0 -0
  32. data/vendor/assets/javascripts/g.raphael/test/linechart.html +0 -66
  33. data/vendor/assets/javascripts/g.raphael/test/piechart.html +0 -26
  34. data/vendor/assets/javascripts/g.raphael/test/piechart2.html +0 -46
  35. data/vendor/assets/javascripts/g.raphael/test/tooltips.html +0 -85
  36. data/vendor/assets/javascripts/raphael/README.markdown +0 -3
  37. data/vendor/assets/javascripts/raphael/history.md +0 -82
  38. data/vendor/assets/javascripts/raphael/license.txt +0 -21
  39. data/vendor/assets/javascripts/raphael/make +0 -45
  40. data/vendor/assets/javascripts/raphael/raphael-min.js +0 -10
  41. data/vendor/assets/javascripts/raphael/raphael.core.js +0 -5189
  42. data/vendor/assets/javascripts/raphael/raphael.js +0 -5815
  43. data/vendor/assets/javascripts/raphael/raphael.svg.js +0 -1360
  44. data/vendor/assets/javascripts/raphael/raphael.vml.js +0 -973
  45. data/vendor/assets/javascripts/raphael/reference.html +0 -2489
  46. data/vendor/assets/javascripts/raphael/reference.js +0 -248
@@ -1,1360 +0,0 @@
1
- // ┌─────────────────────────────────────────────────────────────────────┐ \\
2
- // │ Raphaël - JavaScript Vector Library │ \\
3
- // ├─────────────────────────────────────────────────────────────────────┤ \\
4
- // │ SVG Module │ \\
5
- // ├─────────────────────────────────────────────────────────────────────┤ \\
6
- // │ Copyright (c) 2008-2011 Dmitry Baranovskiy (http://raphaeljs.com) │ \\
7
- // │ Copyright (c) 2008-2011 Sencha Labs (http://sencha.com) │ \\
8
- // │ Licensed under the MIT (http://raphaeljs.com/license.html) license. │ \\
9
- // └─────────────────────────────────────────────────────────────────────┘ \\
10
- window.Raphael.svg && function (R) {
11
- var has = "hasOwnProperty",
12
- Str = String,
13
- toFloat = parseFloat,
14
- toInt = parseInt,
15
- math = Math,
16
- mmax = math.max,
17
- abs = math.abs,
18
- pow = math.pow,
19
- separator = /[, ]+/,
20
- eve = R.eve,
21
- E = "",
22
- S = " ";
23
- var xlink = "http://www.w3.org/1999/xlink",
24
- markers = {
25
- block: "M5,0 0,2.5 5,5z",
26
- classic: "M5,0 0,2.5 5,5 3.5,3 3.5,2z",
27
- diamond: "M2.5,0 5,2.5 2.5,5 0,2.5z",
28
- open: "M6,1 1,3.5 6,6",
29
- oval: "M2.5,0A2.5,2.5,0,0,1,2.5,5 2.5,2.5,0,0,1,2.5,0z"
30
- },
31
- markerCounter = {};
32
- R.toString = function () {
33
- return "Your browser supports SVG.\nYou are running Rapha\xebl " + this.version;
34
- };
35
- var $ = function (el, attr) {
36
- if (attr) {
37
- if (typeof el == "string") {
38
- el = $(el);
39
- }
40
- for (var key in attr) if (attr[has](key)) {
41
- if (key.substring(0, 6) == "xlink:") {
42
- el.setAttributeNS(xlink, key.substring(6), Str(attr[key]));
43
- } else {
44
- el.setAttribute(key, Str(attr[key]));
45
- }
46
- }
47
- } else {
48
- el = R._g.doc.createElementNS("http://www.w3.org/2000/svg", el);
49
- el.style && (el.style.webkitTapHighlightColor = "rgba(0,0,0,0)");
50
- }
51
- return el;
52
- },
53
- addGradientFill = function (element, gradient) {
54
- var type = "linear",
55
- id = element.id + gradient,
56
- fx = .5, fy = .5,
57
- o = element.node,
58
- SVG = element.paper,
59
- s = o.style,
60
- el = R._g.doc.getElementById(id);
61
- if (!el) {
62
- gradient = Str(gradient).replace(R._radial_gradient, function (all, _fx, _fy) {
63
- type = "radial";
64
- if (_fx && _fy) {
65
- fx = toFloat(_fx);
66
- fy = toFloat(_fy);
67
- var dir = ((fy > .5) * 2 - 1);
68
- pow(fx - .5, 2) + pow(fy - .5, 2) > .25 &&
69
- (fy = math.sqrt(.25 - pow(fx - .5, 2)) * dir + .5) &&
70
- fy != .5 &&
71
- (fy = fy.toFixed(5) - 1e-5 * dir);
72
- }
73
- return E;
74
- });
75
- gradient = gradient.split(/\s*\-\s*/);
76
- if (type == "linear") {
77
- var angle = gradient.shift();
78
- angle = -toFloat(angle);
79
- if (isNaN(angle)) {
80
- return null;
81
- }
82
- var vector = [0, 0, math.cos(R.rad(angle)), math.sin(R.rad(angle))],
83
- max = 1 / (mmax(abs(vector[2]), abs(vector[3])) || 1);
84
- vector[2] *= max;
85
- vector[3] *= max;
86
- if (vector[2] < 0) {
87
- vector[0] = -vector[2];
88
- vector[2] = 0;
89
- }
90
- if (vector[3] < 0) {
91
- vector[1] = -vector[3];
92
- vector[3] = 0;
93
- }
94
- }
95
- var dots = R._parseDots(gradient);
96
- if (!dots) {
97
- return null;
98
- }
99
- id = id.replace(/[\(\)\s,\xb0#]/g, "_");
100
-
101
- if (element.gradient && id != element.gradient.id) {
102
- SVG.defs.removeChild(element.gradient);
103
- delete element.gradient;
104
- }
105
-
106
- if (!element.gradient) {
107
- el = $(type + "Gradient", {id: id});
108
- element.gradient = el;
109
- $(el, type == "radial" ? {
110
- fx: fx,
111
- fy: fy
112
- } : {
113
- x1: vector[0],
114
- y1: vector[1],
115
- x2: vector[2],
116
- y2: vector[3],
117
- gradientTransform: element.matrix.invert()
118
- });
119
- SVG.defs.appendChild(el);
120
- for (var i = 0, ii = dots.length; i < ii; i++) {
121
- el.appendChild($("stop", {
122
- offset: dots[i].offset ? dots[i].offset : i ? "100%" : "0%",
123
- "stop-color": dots[i].color || "#fff"
124
- }));
125
- }
126
- }
127
- }
128
- $(o, {
129
- fill: "url(#" + id + ")",
130
- opacity: 1,
131
- "fill-opacity": 1
132
- });
133
- s.fill = E;
134
- s.opacity = 1;
135
- s.fillOpacity = 1;
136
- return 1;
137
- },
138
- updatePosition = function (o) {
139
- var bbox = o.getBBox(1);
140
- $(o.pattern, {patternTransform: o.matrix.invert() + " translate(" + bbox.x + "," + bbox.y + ")"});
141
- },
142
- addArrow = function (o, value, isEnd) {
143
- if (o.type == "path") {
144
- var values = Str(value).toLowerCase().split("-"),
145
- p = o.paper,
146
- se = isEnd ? "end" : "start",
147
- node = o.node,
148
- attrs = o.attrs,
149
- stroke = attrs["stroke-width"],
150
- i = values.length,
151
- type = "classic",
152
- from,
153
- to,
154
- dx,
155
- refX,
156
- attr,
157
- w = 3,
158
- h = 3,
159
- t = 5;
160
- while (i--) {
161
- switch (values[i]) {
162
- case "block":
163
- case "classic":
164
- case "oval":
165
- case "diamond":
166
- case "open":
167
- case "none":
168
- type = values[i];
169
- break;
170
- case "wide": h = 5; break;
171
- case "narrow": h = 2; break;
172
- case "long": w = 5; break;
173
- case "short": w = 2; break;
174
- }
175
- }
176
- if (type == "open") {
177
- w += 2;
178
- h += 2;
179
- t += 2;
180
- dx = 1;
181
- refX = isEnd ? 4 : 1;
182
- attr = {
183
- fill: "none",
184
- stroke: attrs.stroke
185
- };
186
- } else {
187
- refX = dx = w / 2;
188
- attr = {
189
- fill: attrs.stroke,
190
- stroke: "none"
191
- };
192
- }
193
- if (o._.arrows) {
194
- if (isEnd) {
195
- o._.arrows.endPath && markerCounter[o._.arrows.endPath]--;
196
- o._.arrows.endMarker && markerCounter[o._.arrows.endMarker]--;
197
- } else {
198
- o._.arrows.startPath && markerCounter[o._.arrows.startPath]--;
199
- o._.arrows.startMarker && markerCounter[o._.arrows.startMarker]--;
200
- }
201
- } else {
202
- o._.arrows = {};
203
- }
204
- if (type != "none") {
205
- var pathId = "raphael-marker-" + type,
206
- markerId = "raphael-marker-" + se + type + w + h;
207
- if (!R._g.doc.getElementById(pathId)) {
208
- p.defs.appendChild($($("path"), {
209
- "stroke-linecap": "round",
210
- d: markers[type],
211
- id: pathId
212
- }));
213
- markerCounter[pathId] = 1;
214
- } else {
215
- markerCounter[pathId]++;
216
- }
217
- var marker = R._g.doc.getElementById(markerId),
218
- use;
219
- if (!marker) {
220
- marker = $($("marker"), {
221
- id: markerId,
222
- markerHeight: h,
223
- markerWidth: w,
224
- orient: "auto",
225
- refX: refX,
226
- refY: h / 2
227
- });
228
- use = $($("use"), {
229
- "xlink:href": "#" + pathId,
230
- transform: (isEnd ? "rotate(180 " + w / 2 + " " + h / 2 + ") " : E) + "scale(" + w / t + "," + h / t + ")",
231
- "stroke-width": (1 / ((w / t + h / t) / 2)).toFixed(4)
232
- });
233
- marker.appendChild(use);
234
- p.defs.appendChild(marker);
235
- markerCounter[markerId] = 1;
236
- } else {
237
- markerCounter[markerId]++;
238
- use = marker.getElementsByTagName("use")[0];
239
- }
240
- $(use, attr);
241
- var delta = dx * (type != "diamond" && type != "oval");
242
- if (isEnd) {
243
- from = o._.arrows.startdx * stroke || 0;
244
- to = R.getTotalLength(attrs.path) - delta * stroke;
245
- } else {
246
- from = delta * stroke;
247
- to = R.getTotalLength(attrs.path) - (o._.arrows.enddx * stroke || 0);
248
- }
249
- attr = {};
250
- attr["marker-" + se] = "url(#" + markerId + ")";
251
- if (to || from) {
252
- attr.d = Raphael.getSubpath(attrs.path, from, to);
253
- }
254
- $(node, attr);
255
- o._.arrows[se + "Path"] = pathId;
256
- o._.arrows[se + "Marker"] = markerId;
257
- o._.arrows[se + "dx"] = delta;
258
- o._.arrows[se + "Type"] = type;
259
- o._.arrows[se + "String"] = value;
260
- } else {
261
- if (isEnd) {
262
- from = o._.arrows.startdx * stroke || 0;
263
- to = R.getTotalLength(attrs.path) - from;
264
- } else {
265
- from = 0;
266
- to = R.getTotalLength(attrs.path) - (o._.arrows.enddx * stroke || 0);
267
- }
268
- o._.arrows[se + "Path"] && $(node, {d: Raphael.getSubpath(attrs.path, from, to)});
269
- delete o._.arrows[se + "Path"];
270
- delete o._.arrows[se + "Marker"];
271
- delete o._.arrows[se + "dx"];
272
- delete o._.arrows[se + "Type"];
273
- delete o._.arrows[se + "String"];
274
- }
275
- for (attr in markerCounter) if (markerCounter[has](attr) && !markerCounter[attr]) {
276
- var item = R._g.doc.getElementById(attr);
277
- item && item.parentNode.removeChild(item);
278
- }
279
- }
280
- },
281
- dasharray = {
282
- "": [0],
283
- "none": [0],
284
- "-": [3, 1],
285
- ".": [1, 1],
286
- "-.": [3, 1, 1, 1],
287
- "-..": [3, 1, 1, 1, 1, 1],
288
- ". ": [1, 3],
289
- "- ": [4, 3],
290
- "--": [8, 3],
291
- "- .": [4, 3, 1, 3],
292
- "--.": [8, 3, 1, 3],
293
- "--..": [8, 3, 1, 3, 1, 3]
294
- },
295
- addDashes = function (o, value, params) {
296
- value = dasharray[Str(value).toLowerCase()];
297
- if (value) {
298
- var width = o.attrs["stroke-width"] || "1",
299
- butt = {round: width, square: width, butt: 0}[o.attrs["stroke-linecap"] || params["stroke-linecap"]] || 0,
300
- dashes = [],
301
- i = value.length;
302
- while (i--) {
303
- dashes[i] = value[i] * width + ((i % 2) ? 1 : -1) * butt;
304
- }
305
- $(o.node, {"stroke-dasharray": dashes.join(",")});
306
- }
307
- },
308
- setFillAndStroke = function (o, params) {
309
- var node = o.node,
310
- attrs = o.attrs,
311
- vis = node.style.visibility;
312
- node.style.visibility = "hidden";
313
- for (var att in params) {
314
- if (params[has](att)) {
315
- if (!R._availableAttrs[has](att)) {
316
- continue;
317
- }
318
- var value = params[att];
319
- attrs[att] = value;
320
- switch (att) {
321
- case "blur":
322
- o.blur(value);
323
- break;
324
- case "href":
325
- case "title":
326
- case "target":
327
- var pn = node.parentNode;
328
- if (pn.tagName.toLowerCase() != "a") {
329
- var hl = $("a");
330
- pn.insertBefore(hl, node);
331
- hl.appendChild(node);
332
- pn = hl;
333
- }
334
- if (att == "target") {
335
- pn.setAttributeNS(xlink, "show", value == "blank" ? "new" : value);
336
- } else {
337
- pn.setAttributeNS(xlink, att, value);
338
- }
339
- break;
340
- case "cursor":
341
- node.style.cursor = value;
342
- break;
343
- case "transform":
344
- o.transform(value);
345
- break;
346
- case "arrow-start":
347
- addArrow(o, value);
348
- break;
349
- case "arrow-end":
350
- addArrow(o, value, 1);
351
- break;
352
- case "clip-rect":
353
- var rect = Str(value).split(separator);
354
- if (rect.length == 4) {
355
- o.clip && o.clip.parentNode.parentNode.removeChild(o.clip.parentNode);
356
- var el = $("clipPath"),
357
- rc = $("rect");
358
- el.id = R.createUUID();
359
- $(rc, {
360
- x: rect[0],
361
- y: rect[1],
362
- width: rect[2],
363
- height: rect[3]
364
- });
365
- el.appendChild(rc);
366
- o.paper.defs.appendChild(el);
367
- $(node, {"clip-path": "url(#" + el.id + ")"});
368
- o.clip = rc;
369
- }
370
- if (!value) {
371
- var path = node.getAttribute("clip-path");
372
- if (path) {
373
- var clip = R._g.doc.getElementById(path.replace(/(^url\(#|\)$)/g, E));
374
- clip && clip.parentNode.removeChild(clip);
375
- $(node, {"clip-path": E});
376
- delete o.clip;
377
- }
378
- }
379
- break;
380
- case "path":
381
- if (o.type == "path") {
382
- $(node, {d: value ? attrs.path = R._pathToAbsolute(value) : "M0,0"});
383
- o._.dirty = 1;
384
- if (o._.arrows) {
385
- "startString" in o._.arrows && addArrow(o, o._.arrows.startString);
386
- "endString" in o._.arrows && addArrow(o, o._.arrows.endString, 1);
387
- }
388
- }
389
- break;
390
- case "width":
391
- node.setAttribute(att, value);
392
- o._.dirty = 1;
393
- if (attrs.fx) {
394
- att = "x";
395
- value = attrs.x;
396
- } else {
397
- break;
398
- }
399
- case "x":
400
- if (attrs.fx) {
401
- value = -attrs.x - (attrs.width || 0);
402
- }
403
- case "rx":
404
- if (att == "rx" && o.type == "rect") {
405
- break;
406
- }
407
- case "cx":
408
- node.setAttribute(att, value);
409
- o.pattern && updatePosition(o);
410
- o._.dirty = 1;
411
- break;
412
- case "height":
413
- node.setAttribute(att, value);
414
- o._.dirty = 1;
415
- if (attrs.fy) {
416
- att = "y";
417
- value = attrs.y;
418
- } else {
419
- break;
420
- }
421
- case "y":
422
- if (attrs.fy) {
423
- value = -attrs.y - (attrs.height || 0);
424
- }
425
- case "ry":
426
- if (att == "ry" && o.type == "rect") {
427
- break;
428
- }
429
- case "cy":
430
- node.setAttribute(att, value);
431
- o.pattern && updatePosition(o);
432
- o._.dirty = 1;
433
- break;
434
- case "r":
435
- if (o.type == "rect") {
436
- $(node, {rx: value, ry: value});
437
- } else {
438
- node.setAttribute(att, value);
439
- }
440
- o._.dirty = 1;
441
- break;
442
- case "src":
443
- if (o.type == "image") {
444
- node.setAttributeNS(xlink, "href", value);
445
- }
446
- break;
447
- case "stroke-width":
448
- if (o._.sx != 1 || o._.sy != 1) {
449
- value /= mmax(abs(o._.sx), abs(o._.sy)) || 1;
450
- }
451
- if (o.paper._vbSize) {
452
- value *= o.paper._vbSize;
453
- }
454
- node.setAttribute(att, value);
455
- if (attrs["stroke-dasharray"]) {
456
- addDashes(o, attrs["stroke-dasharray"], params);
457
- }
458
- if (o._.arrows) {
459
- "startString" in o._.arrows && addArrow(o, o._.arrows.startString);
460
- "endString" in o._.arrows && addArrow(o, o._.arrows.endString, 1);
461
- }
462
- break;
463
- case "stroke-dasharray":
464
- addDashes(o, value, params);
465
- break;
466
- case "fill":
467
- var isURL = Str(value).match(R._ISURL);
468
- if (isURL) {
469
- el = $("pattern");
470
- var ig = $("image");
471
- el.id = R.createUUID();
472
- $(el, {x: 0, y: 0, patternUnits: "userSpaceOnUse", height: 1, width: 1});
473
- $(ig, {x: 0, y: 0, "xlink:href": isURL[1]});
474
- el.appendChild(ig);
475
-
476
- (function (el) {
477
- R._preload(isURL[1], function () {
478
- var w = this.offsetWidth,
479
- h = this.offsetHeight;
480
- $(el, {width: w, height: h});
481
- $(ig, {width: w, height: h});
482
- o.paper.safari();
483
- });
484
- })(el);
485
- o.paper.defs.appendChild(el);
486
- $(node, {fill: "url(#" + el.id + ")"});
487
- o.pattern = el;
488
- o.pattern && updatePosition(o);
489
- break;
490
- }
491
- var clr = R.getRGB(value);
492
- if (!clr.error) {
493
- delete params.gradient;
494
- delete attrs.gradient;
495
- !R.is(attrs.opacity, "undefined") &&
496
- R.is(params.opacity, "undefined") &&
497
- $(node, {opacity: attrs.opacity});
498
- !R.is(attrs["fill-opacity"], "undefined") &&
499
- R.is(params["fill-opacity"], "undefined") &&
500
- $(node, {"fill-opacity": attrs["fill-opacity"]});
501
- } else if ((o.type == "circle" || o.type == "ellipse" || Str(value).charAt() != "r") && addGradientFill(o, value)) {
502
- if ("opacity" in attrs || "fill-opacity" in attrs) {
503
- var gradient = R._g.doc.getElementById(node.getAttribute("fill").replace(/^url\(#|\)$/g, E));
504
- if (gradient) {
505
- var stops = gradient.getElementsByTagName("stop");
506
- $(stops[stops.length - 1], {"stop-opacity": ("opacity" in attrs ? attrs.opacity : 1) * ("fill-opacity" in attrs ? attrs["fill-opacity"] : 1)});
507
- }
508
- }
509
- attrs.gradient = value;
510
- attrs.fill = "none";
511
- break;
512
- }
513
- clr[has]("opacity") && $(node, {"fill-opacity": clr.opacity > 1 ? clr.opacity / 100 : clr.opacity});
514
- case "stroke":
515
- clr = R.getRGB(value);
516
- node.setAttribute(att, clr.hex);
517
- att == "stroke" && clr[has]("opacity") && $(node, {"stroke-opacity": clr.opacity > 1 ? clr.opacity / 100 : clr.opacity});
518
- if (att == "stroke" && o._.arrows) {
519
- "startString" in o._.arrows && addArrow(o, o._.arrows.startString);
520
- "endString" in o._.arrows && addArrow(o, o._.arrows.endString, 1);
521
- }
522
- break;
523
- case "gradient":
524
- (o.type == "circle" || o.type == "ellipse" || Str(value).charAt() != "r") && addGradientFill(o, value);
525
- break;
526
- case "opacity":
527
- if (attrs.gradient && !attrs[has]("stroke-opacity")) {
528
- $(node, {"stroke-opacity": value > 1 ? value / 100 : value});
529
- }
530
- // fall
531
- case "fill-opacity":
532
- if (attrs.gradient) {
533
- gradient = R._g.doc.getElementById(node.getAttribute("fill").replace(/^url\(#|\)$/g, E));
534
- if (gradient) {
535
- stops = gradient.getElementsByTagName("stop");
536
- $(stops[stops.length - 1], {"stop-opacity": value});
537
- }
538
- break;
539
- }
540
- default:
541
- att == "font-size" && (value = toInt(value, 10) + "px");
542
- var cssrule = att.replace(/(\-.)/g, function (w) {
543
- return w.substring(1).toUpperCase();
544
- });
545
- node.style[cssrule] = value;
546
- o._.dirty = 1;
547
- node.setAttribute(att, value);
548
- break;
549
- }
550
- }
551
- }
552
-
553
- tuneText(o, params);
554
- node.style.visibility = vis;
555
- },
556
- leading = 1.2,
557
- tuneText = function (el, params) {
558
- if (el.type != "text" || !(params[has]("text") || params[has]("font") || params[has]("font-size") || params[has]("x") || params[has]("y"))) {
559
- return;
560
- }
561
- var a = el.attrs,
562
- node = el.node,
563
- fontSize = node.firstChild ? toInt(R._g.doc.defaultView.getComputedStyle(node.firstChild, E).getPropertyValue("font-size"), 10) : 10;
564
-
565
- if (params[has]("text")) {
566
- a.text = params.text;
567
- while (node.firstChild) {
568
- node.removeChild(node.firstChild);
569
- }
570
- var texts = Str(params.text).split("\n"),
571
- tspans = [],
572
- tspan;
573
- for (var i = 0, ii = texts.length; i < ii; i++) {
574
- tspan = $("tspan");
575
- i && $(tspan, {dy: fontSize * leading, x: a.x});
576
- tspan.appendChild(R._g.doc.createTextNode(texts[i]));
577
- node.appendChild(tspan);
578
- tspans[i] = tspan;
579
- }
580
- } else {
581
- tspans = node.getElementsByTagName("tspan");
582
- for (i = 0, ii = tspans.length; i < ii; i++) if (i) {
583
- $(tspans[i], {dy: fontSize * leading, x: a.x});
584
- } else {
585
- $(tspans[0], {dy: 0});
586
- }
587
- }
588
- $(node, {x: a.x, y: a.y});
589
- el._.dirty = 1;
590
- var bb = el._getBBox(),
591
- dif = a.y - (bb.y + bb.height / 2);
592
- dif && R.is(dif, "finite") && $(tspans[0], {dy: dif});
593
- },
594
- Element = function (node, svg) {
595
- var X = 0,
596
- Y = 0;
597
- /*\
598
- * Element.node
599
- [ property (object) ]
600
- **
601
- * Gives you a reference to the DOM object, so you can assign event handlers or just mess around.
602
- **
603
- * Note: Don’t mess with it.
604
- > Usage
605
- | // draw a circle at coordinate 10,10 with radius of 10
606
- | var c = paper.circle(10, 10, 10);
607
- | c.node.onclick = function () {
608
- | c.attr("fill", "red");
609
- | };
610
- \*/
611
- this[0] = this.node = node;
612
- /*\
613
- * Element.raphael
614
- [ property (object) ]
615
- **
616
- * Internal reference to @Raphael object. In case it is not available.
617
- > Usage
618
- | Raphael.el.red = function () {
619
- | var hsb = this.paper.raphael.rgb2hsb(this.attr("fill"));
620
- | hsb.h = 1;
621
- | this.attr({fill: this.paper.raphael.hsb2rgb(hsb).hex});
622
- | }
623
- \*/
624
- node.raphael = true;
625
- /*\
626
- * Element.id
627
- [ property (number) ]
628
- **
629
- * Unique id of the element. Especially usesful when you want to listen to events of the element,
630
- * because all events are fired in format `<module>.<action>.<id>`. Also useful for @Paper.getById method.
631
- \*/
632
- this.id = R._oid++;
633
- node.raphaelid = this.id;
634
- this.matrix = R.matrix();
635
- this.realPath = null;
636
- /*\
637
- * Element.paper
638
- [ property (object) ]
639
- **
640
- * Internal reference to “paper” where object drawn. Mainly for use in plugins and element extensions.
641
- > Usage
642
- | Raphael.el.cross = function () {
643
- | this.attr({fill: "red"});
644
- | this.paper.path("M10,10L50,50M50,10L10,50")
645
- | .attr({stroke: "red"});
646
- | }
647
- \*/
648
- this.paper = svg;
649
- this.attrs = this.attrs || {};
650
- this._ = {
651
- transform: [],
652
- sx: 1,
653
- sy: 1,
654
- deg: 0,
655
- dx: 0,
656
- dy: 0,
657
- dirty: 1
658
- };
659
- !svg.bottom && (svg.bottom = this);
660
- /*\
661
- * Element.prev
662
- [ property (object) ]
663
- **
664
- * Reference to the previous element in the hierarchy.
665
- \*/
666
- this.prev = svg.top;
667
- svg.top && (svg.top.next = this);
668
- svg.top = this;
669
- /*\
670
- * Element.next
671
- [ property (object) ]
672
- **
673
- * Reference to the next element in the hierarchy.
674
- \*/
675
- this.next = null;
676
- },
677
- elproto = R.el;
678
-
679
- Element.prototype = elproto;
680
- elproto.constructor = Element;
681
-
682
- R._engine.path = function (pathString, SVG) {
683
- var el = $("path");
684
- SVG.canvas && SVG.canvas.appendChild(el);
685
- var p = new Element(el, SVG);
686
- p.type = "path";
687
- setFillAndStroke(p, {
688
- fill: "none",
689
- stroke: "#000",
690
- path: pathString
691
- });
692
- return p;
693
- };
694
- /*\
695
- * Element.rotate
696
- [ method ]
697
- **
698
- * Deprecated! Use @Element.transform instead.
699
- * Adds rotation by given angle around given point to the list of
700
- * transformations of the element.
701
- > Parameters
702
- - deg (number) angle in degrees
703
- - cx (number) #optional x coordinate of the centre of rotation
704
- - cy (number) #optional y coordinate of the centre of rotation
705
- * If cx & cy aren’t specified centre of the shape is used as a point of rotation.
706
- = (object) @Element
707
- \*/
708
- elproto.rotate = function (deg, cx, cy) {
709
- if (this.removed) {
710
- return this;
711
- }
712
- deg = Str(deg).split(separator);
713
- if (deg.length - 1) {
714
- cx = toFloat(deg[1]);
715
- cy = toFloat(deg[2]);
716
- }
717
- deg = toFloat(deg[0]);
718
- (cy == null) && (cx = cy);
719
- if (cx == null || cy == null) {
720
- var bbox = this.getBBox(1);
721
- cx = bbox.x + bbox.width / 2;
722
- cy = bbox.y + bbox.height / 2;
723
- }
724
- this.transform(this._.transform.concat([["r", deg, cx, cy]]));
725
- return this;
726
- };
727
- /*\
728
- * Element.scale
729
- [ method ]
730
- **
731
- * Deprecated! Use @Element.transform instead.
732
- * Adds scale by given amount relative to given point to the list of
733
- * transformations of the element.
734
- > Parameters
735
- - sx (number) horisontal scale amount
736
- - sy (number) vertical scale amount
737
- - cx (number) #optional x coordinate of the centre of scale
738
- - cy (number) #optional y coordinate of the centre of scale
739
- * If cx & cy aren’t specified centre of the shape is used instead.
740
- = (object) @Element
741
- \*/
742
- elproto.scale = function (sx, sy, cx, cy) {
743
- if (this.removed) {
744
- return this;
745
- }
746
- sx = Str(sx).split(separator);
747
- if (sx.length - 1) {
748
- sy = toFloat(sx[1]);
749
- cx = toFloat(sx[2]);
750
- cy = toFloat(sx[3]);
751
- }
752
- sx = toFloat(sx[0]);
753
- (sy == null) && (sy = sx);
754
- (cy == null) && (cx = cy);
755
- if (cx == null || cy == null) {
756
- var bbox = this.getBBox(1);
757
- }
758
- cx = cx == null ? bbox.x + bbox.width / 2 : cx;
759
- cy = cy == null ? bbox.y + bbox.height / 2 : cy;
760
- this.transform(this._.transform.concat([["s", sx, sy, cx, cy]]));
761
- return this;
762
- };
763
- /*\
764
- * Element.translate
765
- [ method ]
766
- **
767
- * Deprecated! Use @Element.transform instead.
768
- * Adds translation by given amount to the list of transformations of the element.
769
- > Parameters
770
- - dx (number) horisontal shift
771
- - dy (number) vertical shift
772
- = (object) @Element
773
- \*/
774
- elproto.translate = function (dx, dy) {
775
- if (this.removed) {
776
- return this;
777
- }
778
- dx = Str(dx).split(separator);
779
- if (dx.length - 1) {
780
- dy = toFloat(dx[1]);
781
- }
782
- dx = toFloat(dx[0]) || 0;
783
- dy = +dy || 0;
784
- this.transform(this._.transform.concat([["t", dx, dy]]));
785
- return this;
786
- };
787
- /*\
788
- * Element.transform
789
- [ method ]
790
- **
791
- * Adds transformation to the element which is separate to other attributes,
792
- * i.e. translation doesn’t change `x` or `y` of the rectange. The format
793
- * of transformation string is similar to the path string syntax:
794
- | "t100,100r30,100,100s2,2,100,100r45s1.5"
795
- * Each letter is a command. There are four commands: `t` is for translate, `r` is for rotate, `s` is for
796
- * scale and `m` is for matrix.
797
- *
798
- * There are also alternative “absolute” translation, rotation and scale: `T`, `R` and `S`. They will not take previous transformation into account. For example, `...T100,0` will always move element 100 px horisontally, while `...t100,0` could move it vertically if there is `r90` before. Just compare results of `r90t100,0` and `r90T100,0`.
799
- *
800
- * So, the example line above could be read like “translate by 100, 100; rotate 30° around 100, 100; scale twice around 100, 100;
801
- * rotate 45° around centre; scale 1.5 times relative to centre”. As you can see rotate and scale commands have origin
802
- * coordinates as optional parameters, the default is the centre point of the element.
803
- * Matrix accepts six parameters.
804
- > Usage
805
- | var el = paper.rect(10, 20, 300, 200);
806
- | // translate 100, 100, rotate 45°, translate -100, 0
807
- | el.transform("t100,100r45t-100,0");
808
- | // if you want you can append or prepend transformations
809
- | el.transform("...t50,50");
810
- | el.transform("s2...");
811
- | // or even wrap
812
- | el.transform("t50,50...t-50-50");
813
- | // to reset transformation call method with empty string
814
- | el.transform("");
815
- | // to get current value call it without parameters
816
- | console.log(el.transform());
817
- > Parameters
818
- - tstr (string) #optional transformation string
819
- * If tstr isn’t specified
820
- = (string) current transformation string
821
- * else
822
- = (object) @Element
823
- \*/
824
- elproto.transform = function (tstr) {
825
- var _ = this._;
826
- if (tstr == null) {
827
- return _.transform;
828
- }
829
- R._extractTransform(this, tstr);
830
-
831
- this.clip && $(this.clip, {transform: this.matrix.invert()});
832
- this.pattern && updatePosition(this);
833
- this.node && $(this.node, {transform: this.matrix});
834
-
835
- if (_.sx != 1 || _.sy != 1) {
836
- var sw = this.attrs[has]("stroke-width") ? this.attrs["stroke-width"] : 1;
837
- this.attr({"stroke-width": sw});
838
- }
839
-
840
- return this;
841
- };
842
- /*\
843
- * Element.hide
844
- [ method ]
845
- **
846
- * Makes element invisible. See @Element.show.
847
- = (object) @Element
848
- \*/
849
- elproto.hide = function () {
850
- !this.removed && this.paper.safari(this.node.style.display = "none");
851
- return this;
852
- };
853
- /*\
854
- * Element.show
855
- [ method ]
856
- **
857
- * Makes element visible. See @Element.hide.
858
- = (object) @Element
859
- \*/
860
- elproto.show = function () {
861
- !this.removed && this.paper.safari(this.node.style.display = "");
862
- return this;
863
- };
864
- /*\
865
- * Element.remove
866
- [ method ]
867
- **
868
- * Removes element form the paper.
869
- \*/
870
- elproto.remove = function () {
871
- if (this.removed || !this.node.parentNode) {
872
- return;
873
- }
874
- var paper = this.paper;
875
- paper.__set__ && paper.__set__.exclude(this);
876
- eve.unbind("raphael.*.*." + this.id);
877
- if (this.gradient) {
878
- paper.defs.removeChild(this.gradient);
879
- }
880
- R._tear(this, paper);
881
- if (this.node.parentNode.tagName.toLowerCase() == "a") {
882
- this.node.parentNode.parentNode.removeChild(this.node.parentNode);
883
- } else {
884
- this.node.parentNode.removeChild(this.node);
885
- }
886
- for (var i in this) {
887
- this[i] = typeof this[i] == "function" ? R._removedFactory(i) : null;
888
- }
889
- this.removed = true;
890
- };
891
- elproto._getBBox = function () {
892
- if (this.node.style.display == "none") {
893
- this.show();
894
- var hide = true;
895
- }
896
- var bbox = {};
897
- try {
898
- bbox = this.node.getBBox();
899
- } catch(e) {
900
- // Firefox 3.0.x plays badly here
901
- } finally {
902
- bbox = bbox || {};
903
- }
904
- hide && this.hide();
905
- return bbox;
906
- };
907
- /*\
908
- * Element.attr
909
- [ method ]
910
- **
911
- * Sets the attributes of the element.
912
- > Parameters
913
- - attrName (string) attribute’s name
914
- - value (string) value
915
- * or
916
- - params (object) object of name/value pairs
917
- * or
918
- - attrName (string) attribute’s name
919
- * or
920
- - attrNames (array) in this case method returns array of current values for given attribute names
921
- = (object) @Element if attrsName & value or params are passed in.
922
- = (...) value of the attribute if only attrsName is passed in.
923
- = (array) array of values of the attribute if attrsNames is passed in.
924
- = (object) object of attributes if nothing is passed in.
925
- > Possible parameters
926
- # <p>Please refer to the <a href="http://www.w3.org/TR/SVG/" title="The W3C Recommendation for the SVG language describes these properties in detail.">SVG specification</a> for an explanation of these parameters.</p>
927
- o arrow-end (string) arrowhead on the end of the path. The format for string is `<type>[-<width>[-<length>]]`. Possible types: `classic`, `block`, `open`, `oval`, `diamond`, `none`, width: `wide`, `narrow`, `midium`, length: `long`, `short`, `midium`.
928
- o clip-rect (string) comma or space separated values: x, y, width and height
929
- o cursor (string) CSS type of the cursor
930
- o cx (number) the x-axis coordinate of the center of the circle, or ellipse
931
- o cy (number) the y-axis coordinate of the center of the circle, or ellipse
932
- o fill (string) colour, gradient or image
933
- o fill-opacity (number)
934
- o font (string)
935
- o font-family (string)
936
- o font-size (number) font size in pixels
937
- o font-weight (string)
938
- o height (number)
939
- o href (string) URL, if specified element behaves as hyperlink
940
- o opacity (number)
941
- o path (string) SVG path string format
942
- o r (number) radius of the circle, ellipse or rounded corner on the rect
943
- o rx (number) horisontal radius of the ellipse
944
- o ry (number) vertical radius of the ellipse
945
- o src (string) image URL, only works for @Element.image element
946
- o stroke (string) stroke colour
947
- o stroke-dasharray (string) [“”, “`-`”, “`.`”, “`-.`”, “`-..`”, “`. `”, “`- `”, “`--`”, “`- .`”, “`--.`”, “`--..`”]
948
- o stroke-linecap (string) [“`butt`”, “`square`”, “`round`”]
949
- o stroke-linejoin (string) [“`bevel`”, “`round`”, “`miter`”]
950
- o stroke-miterlimit (number)
951
- o stroke-opacity (number)
952
- o stroke-width (number) stroke width in pixels, default is '1'
953
- o target (string) used with href
954
- o text (string) contents of the text element. Use `\n` for multiline text
955
- o text-anchor (string) [“`start`”, “`middle`”, “`end`”], default is “`middle`”
956
- o title (string) will create tooltip with a given text
957
- o transform (string) see @Element.transform
958
- o width (number)
959
- o x (number)
960
- o y (number)
961
- > Gradients
962
- * Linear gradient format: “`‹angle›-‹colour›[-‹colour›[:‹offset›]]*-‹colour›`”, example: “`90-#fff-#000`” – 90°
963
- * gradient from white to black or “`0-#fff-#f00:20-#000`” – 0° gradient from white via red (at 20%) to black.
964
- *
965
- * radial gradient: “`r[(‹fx›, ‹fy›)]‹colour›[-‹colour›[:‹offset›]]*-‹colour›`”, example: “`r#fff-#000`” –
966
- * gradient from white to black or “`r(0.25, 0.75)#fff-#000`” – gradient from white to black with focus point
967
- * at 0.25, 0.75. Focus point coordinates are in 0..1 range. Radial gradients can only be applied to circles and ellipses.
968
- > Path String
969
- # <p>Please refer to <a href="http://www.w3.org/TR/SVG/paths.html#PathData" title="Details of a path’s data attribute’s format are described in the SVG specification.">SVG documentation regarding path string</a>. Raphaël fully supports it.</p>
970
- > Colour Parsing
971
- # <ul>
972
- # <li>Colour name (“<code>red</code>”, “<code>green</code>”, “<code>cornflowerblue</code>”, etc)</li>
973
- # <li>#••• — shortened HTML colour: (“<code>#000</code>”, “<code>#fc0</code>”, etc)</li>
974
- # <li>#•••••• — full length HTML colour: (“<code>#000000</code>”, “<code>#bd2300</code>”)</li>
975
- # <li>rgb(•••, •••, •••) — red, green and blue channels’ values: (“<code>rgb(200,&nbsp;100,&nbsp;0)</code>”)</li>
976
- # <li>rgb(•••%, •••%, •••%) — same as above, but in %: (“<code>rgb(100%,&nbsp;175%,&nbsp;0%)</code>”)</li>
977
- # <li>rgba(•••, •••, •••, •••) — red, green and blue channels’ values: (“<code>rgba(200,&nbsp;100,&nbsp;0, .5)</code>”)</li>
978
- # <li>rgba(•••%, •••%, •••%, •••%) — same as above, but in %: (“<code>rgba(100%,&nbsp;175%,&nbsp;0%, 50%)</code>”)</li>
979
- # <li>hsb(•••, •••, •••) — hue, saturation and brightness values: (“<code>hsb(0.5,&nbsp;0.25,&nbsp;1)</code>”)</li>
980
- # <li>hsb(•••%, •••%, •••%) — same as above, but in %</li>
981
- # <li>hsba(•••, •••, •••, •••) — same as above, but with opacity</li>
982
- # <li>hsl(•••, •••, •••) — almost the same as hsb, see <a href="http://en.wikipedia.org/wiki/HSL_and_HSV" title="HSL and HSV - Wikipedia, the free encyclopedia">Wikipedia page</a></li>
983
- # <li>hsl(•••%, •••%, •••%) — same as above, but in %</li>
984
- # <li>hsla(•••, •••, •••, •••) — same as above, but with opacity</li>
985
- # <li>Optionally for hsb and hsl you could specify hue as a degree: “<code>hsl(240deg,&nbsp;1,&nbsp;.5)</code>” or, if you want to go fancy, “<code>hsl(240°,&nbsp;1,&nbsp;.5)</code>”</li>
986
- # </ul>
987
- \*/
988
- elproto.attr = function (name, value) {
989
- if (this.removed) {
990
- return this;
991
- }
992
- if (name == null) {
993
- var res = {};
994
- for (var a in this.attrs) if (this.attrs[has](a)) {
995
- res[a] = this.attrs[a];
996
- }
997
- res.gradient && res.fill == "none" && (res.fill = res.gradient) && delete res.gradient;
998
- res.transform = this._.transform;
999
- return res;
1000
- }
1001
- if (value == null && R.is(name, "string")) {
1002
- if (name == "fill" && this.attrs.fill == "none" && this.attrs.gradient) {
1003
- return this.attrs.gradient;
1004
- }
1005
- if (name == "transform") {
1006
- return this._.transform;
1007
- }
1008
- var names = name.split(separator),
1009
- out = {};
1010
- for (var i = 0, ii = names.length; i < ii; i++) {
1011
- name = names[i];
1012
- if (name in this.attrs) {
1013
- out[name] = this.attrs[name];
1014
- } else if (R.is(this.paper.customAttributes[name], "function")) {
1015
- out[name] = this.paper.customAttributes[name].def;
1016
- } else {
1017
- out[name] = R._availableAttrs[name];
1018
- }
1019
- }
1020
- return ii - 1 ? out : out[names[0]];
1021
- }
1022
- if (value == null && R.is(name, "array")) {
1023
- out = {};
1024
- for (i = 0, ii = name.length; i < ii; i++) {
1025
- out[name[i]] = this.attr(name[i]);
1026
- }
1027
- return out;
1028
- }
1029
- if (value != null) {
1030
- var params = {};
1031
- params[name] = value;
1032
- } else if (name != null && R.is(name, "object")) {
1033
- params = name;
1034
- }
1035
- for (var key in params) {
1036
- eve("raphael.attr." + key + "." + this.id, this, params[key]);
1037
- }
1038
- for (key in this.paper.customAttributes) if (this.paper.customAttributes[has](key) && params[has](key) && R.is(this.paper.customAttributes[key], "function")) {
1039
- var par = this.paper.customAttributes[key].apply(this, [].concat(params[key]));
1040
- this.attrs[key] = params[key];
1041
- for (var subkey in par) if (par[has](subkey)) {
1042
- params[subkey] = par[subkey];
1043
- }
1044
- }
1045
- setFillAndStroke(this, params);
1046
- return this;
1047
- };
1048
- /*\
1049
- * Element.toFront
1050
- [ method ]
1051
- **
1052
- * Moves the element so it is the closest to the viewer’s eyes, on top of other elements.
1053
- = (object) @Element
1054
- \*/
1055
- elproto.toFront = function () {
1056
- if (this.removed) {
1057
- return this;
1058
- }
1059
- if (this.node.parentNode.tagName.toLowerCase() == "a") {
1060
- this.node.parentNode.parentNode.appendChild(this.node.parentNode);
1061
- } else {
1062
- this.node.parentNode.appendChild(this.node);
1063
- }
1064
- var svg = this.paper;
1065
- svg.top != this && R._tofront(this, svg);
1066
- return this;
1067
- };
1068
- /*\
1069
- * Element.toBack
1070
- [ method ]
1071
- **
1072
- * Moves the element so it is the furthest from the viewer’s eyes, behind other elements.
1073
- = (object) @Element
1074
- \*/
1075
- elproto.toBack = function () {
1076
- if (this.removed) {
1077
- return this;
1078
- }
1079
- var parent = this.node.parentNode;
1080
- if (parent.tagName.toLowerCase() == "a") {
1081
- parent.parentNode.insertBefore(this.node.parentNode, this.node.parentNode.parentNode.firstChild);
1082
- } else if (parent.firstChild != this.node) {
1083
- parent.insertBefore(this.node, this.node.parentNode.firstChild);
1084
- }
1085
- R._toback(this, this.paper);
1086
- var svg = this.paper;
1087
- return this;
1088
- };
1089
- /*\
1090
- * Element.insertAfter
1091
- [ method ]
1092
- **
1093
- * Inserts current object after the given one.
1094
- = (object) @Element
1095
- \*/
1096
- elproto.insertAfter = function (element) {
1097
- if (this.removed) {
1098
- return this;
1099
- }
1100
- var node = element.node || element[element.length - 1].node;
1101
- if (node.nextSibling) {
1102
- node.parentNode.insertBefore(this.node, node.nextSibling);
1103
- } else {
1104
- node.parentNode.appendChild(this.node);
1105
- }
1106
- R._insertafter(this, element, this.paper);
1107
- return this;
1108
- };
1109
- /*\
1110
- * Element.insertBefore
1111
- [ method ]
1112
- **
1113
- * Inserts current object before the given one.
1114
- = (object) @Element
1115
- \*/
1116
- elproto.insertBefore = function (element) {
1117
- if (this.removed) {
1118
- return this;
1119
- }
1120
- var node = element.node || element[0].node;
1121
- node.parentNode.insertBefore(this.node, node);
1122
- R._insertbefore(this, element, this.paper);
1123
- return this;
1124
- };
1125
- elproto.blur = function (size) {
1126
- // Experimental. No Safari support. Use it on your own risk.
1127
- var t = this;
1128
- if (+size !== 0) {
1129
- var fltr = $("filter"),
1130
- blur = $("feGaussianBlur");
1131
- t.attrs.blur = size;
1132
- fltr.id = R.createUUID();
1133
- $(blur, {stdDeviation: +size || 1.5});
1134
- fltr.appendChild(blur);
1135
- t.paper.defs.appendChild(fltr);
1136
- t._blur = fltr;
1137
- $(t.node, {filter: "url(#" + fltr.id + ")"});
1138
- } else {
1139
- if (t._blur) {
1140
- t._blur.parentNode.removeChild(t._blur);
1141
- delete t._blur;
1142
- delete t.attrs.blur;
1143
- }
1144
- t.node.removeAttribute("filter");
1145
- }
1146
- };
1147
- R._engine.circle = function (svg, x, y, r) {
1148
- var el = $("circle");
1149
- svg.canvas && svg.canvas.appendChild(el);
1150
- var res = new Element(el, svg);
1151
- res.attrs = {cx: x, cy: y, r: r, fill: "none", stroke: "#000"};
1152
- res.type = "circle";
1153
- $(el, res.attrs);
1154
- return res;
1155
- };
1156
- R._engine.rect = function (svg, x, y, w, h, r) {
1157
- var el = $("rect");
1158
- svg.canvas && svg.canvas.appendChild(el);
1159
- var res = new Element(el, svg);
1160
- res.attrs = {x: x, y: y, width: w, height: h, r: r || 0, rx: r || 0, ry: r || 0, fill: "none", stroke: "#000"};
1161
- res.type = "rect";
1162
- $(el, res.attrs);
1163
- return res;
1164
- };
1165
- R._engine.ellipse = function (svg, x, y, rx, ry) {
1166
- var el = $("ellipse");
1167
- svg.canvas && svg.canvas.appendChild(el);
1168
- var res = new Element(el, svg);
1169
- res.attrs = {cx: x, cy: y, rx: rx, ry: ry, fill: "none", stroke: "#000"};
1170
- res.type = "ellipse";
1171
- $(el, res.attrs);
1172
- return res;
1173
- };
1174
- R._engine.image = function (svg, src, x, y, w, h) {
1175
- var el = $("image");
1176
- $(el, {x: x, y: y, width: w, height: h, preserveAspectRatio: "none"});
1177
- el.setAttributeNS(xlink, "href", src);
1178
- svg.canvas && svg.canvas.appendChild(el);
1179
- var res = new Element(el, svg);
1180
- res.attrs = {x: x, y: y, width: w, height: h, src: src};
1181
- res.type = "image";
1182
- return res;
1183
- };
1184
- R._engine.text = function (svg, x, y, text) {
1185
- var el = $("text");
1186
- svg.canvas && svg.canvas.appendChild(el);
1187
- var res = new Element(el, svg);
1188
- res.attrs = {
1189
- x: x,
1190
- y: y,
1191
- "text-anchor": "middle",
1192
- text: text,
1193
- font: R._availableAttrs.font,
1194
- stroke: "none",
1195
- fill: "#000"
1196
- };
1197
- res.type = "text";
1198
- setFillAndStroke(res, res.attrs);
1199
- return res;
1200
- };
1201
- R._engine.setSize = function (width, height) {
1202
- this.width = width || this.width;
1203
- this.height = height || this.height;
1204
- this.canvas.setAttribute("width", this.width);
1205
- this.canvas.setAttribute("height", this.height);
1206
- if (this._viewBox) {
1207
- this.setViewBox.apply(this, this._viewBox);
1208
- }
1209
- return this;
1210
- };
1211
- R._engine.create = function () {
1212
- var con = R._getContainer.apply(0, arguments),
1213
- container = con && con.container,
1214
- x = con.x,
1215
- y = con.y,
1216
- width = con.width,
1217
- height = con.height;
1218
- if (!container) {
1219
- throw new Error("SVG container not found.");
1220
- }
1221
- var cnvs = $("svg"),
1222
- css = "overflow:hidden;",
1223
- isFloating;
1224
- x = x || 0;
1225
- y = y || 0;
1226
- width = width || 512;
1227
- height = height || 342;
1228
- $(cnvs, {
1229
- height: height,
1230
- version: 1.1,
1231
- width: width,
1232
- xmlns: "http://www.w3.org/2000/svg"
1233
- });
1234
- if (container == 1) {
1235
- cnvs.style.cssText = css + "position:absolute;left:" + x + "px;top:" + y + "px";
1236
- R._g.doc.body.appendChild(cnvs);
1237
- isFloating = 1;
1238
- } else {
1239
- cnvs.style.cssText = css + "position:relative";
1240
- if (container.firstChild) {
1241
- container.insertBefore(cnvs, container.firstChild);
1242
- } else {
1243
- container.appendChild(cnvs);
1244
- }
1245
- }
1246
- container = new R._Paper;
1247
- container.width = width;
1248
- container.height = height;
1249
- container.canvas = cnvs;
1250
- container.clear();
1251
- container._left = container._top = 0;
1252
- isFloating && (container.renderfix = function () {});
1253
- container.renderfix();
1254
- return container;
1255
- };
1256
- R._engine.setViewBox = function (x, y, w, h, fit) {
1257
- eve("raphael.setViewBox", this, this._viewBox, [x, y, w, h, fit]);
1258
- var size = mmax(w / this.width, h / this.height),
1259
- top = this.top,
1260
- aspectRatio = fit ? "meet" : "xMinYMin",
1261
- vb,
1262
- sw;
1263
- if (x == null) {
1264
- if (this._vbSize) {
1265
- size = 1;
1266
- }
1267
- delete this._vbSize;
1268
- vb = "0 0 " + this.width + S + this.height;
1269
- } else {
1270
- this._vbSize = size;
1271
- vb = x + S + y + S + w + S + h;
1272
- }
1273
- $(this.canvas, {
1274
- viewBox: vb,
1275
- preserveAspectRatio: aspectRatio
1276
- });
1277
- while (size && top) {
1278
- sw = "stroke-width" in top.attrs ? top.attrs["stroke-width"] : 1;
1279
- top.attr({"stroke-width": sw});
1280
- top._.dirty = 1;
1281
- top._.dirtyT = 1;
1282
- top = top.prev;
1283
- }
1284
- this._viewBox = [x, y, w, h, !!fit];
1285
- return this;
1286
- };
1287
- /*\
1288
- * Paper.renderfix
1289
- [ method ]
1290
- **
1291
- * Fixes the issue of Firefox and IE9 regarding subpixel rendering. If paper is dependant
1292
- * on other elements after reflow it could shift half pixel which cause for lines to lost their crispness.
1293
- * This method fixes the issue.
1294
- **
1295
- Special thanks to Mariusz Nowak (http://www.medikoo.com/) for this method.
1296
- \*/
1297
- R.prototype.renderfix = function () {
1298
- var cnvs = this.canvas,
1299
- s = cnvs.style,
1300
- pos;
1301
- try {
1302
- pos = cnvs.getScreenCTM() || cnvs.createSVGMatrix();
1303
- } catch (e) {
1304
- pos = cnvs.createSVGMatrix();
1305
- }
1306
- var left = -pos.e % 1,
1307
- top = -pos.f % 1;
1308
- if (left || top) {
1309
- if (left) {
1310
- this._left = (this._left + left) % 1;
1311
- s.left = this._left + "px";
1312
- }
1313
- if (top) {
1314
- this._top = (this._top + top) % 1;
1315
- s.top = this._top + "px";
1316
- }
1317
- }
1318
- };
1319
- /*\
1320
- * Paper.clear
1321
- [ method ]
1322
- **
1323
- * Clears the paper, i.e. removes all the elements.
1324
- \*/
1325
- R.prototype.clear = function () {
1326
- R.eve("raphael.clear", this);
1327
- var c = this.canvas;
1328
- while (c.firstChild) {
1329
- c.removeChild(c.firstChild);
1330
- }
1331
- this.bottom = this.top = null;
1332
- (this.desc = $("desc")).appendChild(R._g.doc.createTextNode("Created with Rapha\xebl " + R.version));
1333
- c.appendChild(this.desc);
1334
- c.appendChild(this.defs = $("defs"));
1335
- };
1336
- /*\
1337
- * Paper.remove
1338
- [ method ]
1339
- **
1340
- * Removes the paper from the DOM.
1341
- \*/
1342
- R.prototype.remove = function () {
1343
- eve("raphael.remove", this);
1344
- this.canvas.parentNode && this.canvas.parentNode.removeChild(this.canvas);
1345
- for (var i in this) {
1346
- this[i] = typeof this[i] == "function" ? R._removedFactory(i) : null;
1347
- }
1348
- };
1349
- var setproto = R.st;
1350
- for (var method in elproto) if (elproto[has](method) && !setproto[has](method)) {
1351
- setproto[method] = (function (methodname) {
1352
- return function () {
1353
- var arg = arguments;
1354
- return this.forEach(function (el) {
1355
- el[methodname].apply(el, arg);
1356
- });
1357
- };
1358
- })(method);
1359
- }
1360
- }(window.Raphael);