graphael-rails 0.1.4 → 0.1.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
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);