source: main/trunk/model-sites-dev/respooled/collect/popup-video-respooled/js/raphael.group.js@ 29896

Last change on this file since 29896 was 29896, checked in by davidb, 9 years ago

Support for groups within Raphael SVG canvas

  • Property svn:executable set to *
File size: 4.1 KB
Line 
1// Raphael JS SVG Group 0.1
2// Copyright (c) George I. 2011-2015
3(function() {
4 "use strict";
5 Raphael.fn.group = function(f, g) {
6 if(Raphael.svg == true) {
7 this.svg = "http://www.w3.org/2000/svg";
8 this.dv = document.getElementById(f);
9 this.defs = this.dv.getElementsByTagName("defs")[0];
10 var defs = this.defs;
11 var svgHead = this.svg;
12 this.svgcanv = this.dv.getElementsByTagName("svg")[0];
13 this.svgcanv.setAttribute("xmlns:xlink", "http://www.w3.org/1999/xlink");
14 var countGroups = this.svgcanv.getElementsByTagName("g").length;
15 var createUUID=function(b,a){return function(){return"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(b,a).toUpperCase()}}(/[xy]/g,function(b){var a=16*Math.random()|0;return("x"==b?a:a&3|8).toString(16)});
16 if(countGroups == 0) {
17 this.masterGroup = document.createElementNS(this.svg, "g");
18 this.svgcanv.appendChild(this.masterGroup)
19 }else {
20 this.masterGroup = this.svgcanv.getElementsByTagName("g")[0]
21 }
22 this.group = document.createElementNS(this.svg, "g");
23 for(var i = 0;i < g.length;i++) {
24 this.group.appendChild(g[i].node)
25 }
26 this.masterGroup.appendChild(this.group);
27 this.group.set = [];
28 var _mg = this.masterGroup;
29 this.group.getMaster = function() {
30 return _mg
31 };
32 this.group.remove = function() {
33 this.parentNode.removeChild(this)
34 };
35 var thisTransform = {translate:{x:0, y:0}, scale:{x:1, y:1}, rotate:{x:0, y:0, z:0}};
36 var transformString = function() {
37 return"translate(" + thisTransform.translate.x + "," + thisTransform.translate.y + ") scale(" + thisTransform.scale.x + "," + thisTransform.scale.y + ") rotate(" + thisTransform.rotate.x + "," + thisTransform.rotate.y + "," + thisTransform.rotate.z + ")"
38 };
39 this.group.translate = function(c, a) {
40 thisTransform.translate.x = c;
41 thisTransform.translate.y = a;
42 this.setAttribute("transform", transformString())
43 };
44 this.group.rotate = function(c, a, e) {
45 thisTransform.rotate.x = c;
46 thisTransform.rotate.y = a;
47 thisTransform.rotate.z = e;
48 this.setAttribute("transform", transformString())
49 };
50 this.group.scale = function(c, a) {
51 thisTransform.scale.x = c;
52 thisTransform.scale.y = a;
53 this.setAttribute("transform", transformString())
54 };
55 this.group.push = function() {
56 for(i = 0;i < arguments.length;i++) {
57 this.appendChild(arguments[i].node)
58 }
59 };
60 this.group.addElement = function() {
61 for(i = 0;i < arguments.length;i++) {
62 this.appendChild(arguments[i])
63 }
64 };
65 this.group.getAttr = function(c) {
66 return thisTransform[c]
67 };
68 this.group.copy = function(el) {
69 this.copy = el.node.cloneNode(true);
70 this.appendChild(this.copy)
71 };
72 this.group.toFront = function(){
73 this.getMaster().appendChild(this);
74 };
75 this.group.clipPath = function(c){
76 var cp = document.createElementNS(svgHead, "clipPath");
77 var cpID = createUUID();
78 cp.setAttribute("id",cpID);
79 cp.appendChild(c.node);
80 defs.appendChild(cp);
81 this.setAttribute("clip-path","url(#"+cpID+")")
82 };
83
84 this.group.animate = function(){
85 var el = this;
86 var args = arguments;
87 var attrToAnimate = args[0];
88 var duration = args[1];
89 var callback = args[2];
90 var timerx;
91 if(typeof(timerx) !== 'undefined'){
92 clearInterval(timerx);
93 }
94 var newPosx = attrToAnimate['x'];
95 var original = el.getAttr('translate').x;
96 var stepLen;
97 timerx = setInterval(function(){if(original>newPosx){stepLen = (original - newPosx)/10;moveLeft()}else{stepLen = (newPosx - original)/10;moveRight()}},10);
98 var currpos = original;
99 function moveLeft(){
100 if(el.getAttr('translate').x-stepLen>newPosx){
101 el.translate(el.getAttr('translate').x-stepLen,0);
102 }else{
103 el.translate(newPosx,0);
104 clearInterval(timerx);
105 callback()
106 }
107 };
108 function moveRight(){
109 if(el.getAttr('translate').x+stepLen<newPosx){
110 el.translate(el.getAttr('translate').x+stepLen,0);
111 }else{
112 el.translate(newPosx,0);
113 clearInterval(timerx);
114 callback()
115 }
116 }
117 };
118 return this.group
119 }
120 };
121})();
Note: See TracBrowser for help on using the repository browser.