Extracted path methods into separate module

master
Dmitry Baranovskiy 2013-07-24 15:51:07 +10:00
parent f57bb75a1b
commit a9a99faada
3 changed files with 1545 additions and 802 deletions

View File

@ -12,6 +12,7 @@
<script src="mina.js"></script>
<script src="elemental.js"></script>
<script src="svg.js"></script>
<script src="savage.path.js"></script>
<script src="savage.set.js"></script>
<script src="savage.equal.js"></script>
<script src="savage.mouse.js"></script>
@ -32,88 +33,88 @@
</script>
<script>
window.onload = function () {
// 1;
// var s = Savage("100%", 600);
//
// 2;
// var c = s.circle(100, 100, 50);
//
// 3;
// c.attr({
// fill: "#bada55",
// stroke: "#000",
// "stroke-width": 5
// });
//
// 4;
// var c2 = s.circle(70, 100, 40);
// var g = s.group(c2, s.circle(130, 100, 40));
// g.attr({
// fill: "#fff"
// });
//
// 5;
// c.attr({
// mask: g
// });
//
// 6;
// c2.animate({r: 25}, 1000);
//
// 7;
// g.select("circle:nth-child(2)").animate({r: 25}, 1000);
//
// 8;
// var p = s.path("M10-5-10,15M15,0,0,15M0-5-20,15").attr({
// fill: "none",
// stroke: "#bada55",
// strokeWidth: 5
// }).pattern(0, 0, 10, 10);
// c.attr({
// fill: p
// });
//
// 9;
// g.attr({
// fill: Savage(document.getElementById("pattern"))
// });
//
// 10;
// g.attr({fill: "r()#fff-#000"});
//
// 11;
// g.attr({fill: "R(100, 100, 50)#fff-#000"});
//
// 12;
// p.select("path").animate({stroke: "#f00"}, 1000);
//
// 13;
// var svg = document.getElementById("svg").text;
// var f = Savage.fragment(svg);
// // f.select("path[fill='#D40000']").attr({fill: "#bada55"});
// g = s.group(f.selectAll("path"));
// s.append(g);
//
// 14;
// g.attr({
// transform: "r45t100,0s.5"
// });
//
// 15;
// console.log(g.attr("transform"));
//
// 16;
// g.drag();
//
// 17;
// s.text(200, 100, "SAVAGE");
//
// 18;
// var t = s.text(200, 120, "SAVAGE".split(""));
// t.selectAll("tspan tspan:nth-child(odd)").attr({
// fill: "#900",
// "font-size": "20px"
// });
1;
var s = Savage("100%", 600);
2;
var c = s.circle(100, 100, 50);
3;
c.attr({
fill: "#bada55",
stroke: "#000",
"stroke-width": 5
});
4;
var c2 = s.circle(70, 100, 40);
var g = s.group(c2, s.circle(130, 100, 40));
g.attr({
fill: "#fff"
});
5;
c.attr({
mask: g
});
6;
c2.animate({r: 25}, 1000);
7;
g.select("circle:nth-child(2)").animate({r: 25}, 1000);
8;
var p = s.path("M10-5-10,15M15,0,0,15M0-5-20,15").attr({
fill: "none",
stroke: "#bada55",
strokeWidth: 5
}).pattern(0, 0, 10, 10);
c.attr({
fill: p
});
9;
g.attr({
fill: Savage(document.getElementById("pattern"))
});
10;
g.attr({fill: "r()#fff-#000"});
11;
g.attr({fill: "R(100, 100, 50)#fff-#000"});
12;
p.select("path").animate({stroke: "#f00"}, 1000);
13;
var svg = document.getElementById("svg").text;
var f = Savage.fragment(svg);
f.select("path[fill='#D40000']").attr({fill: "#bada55"});
g = s.group(f.selectAll("path"));
s.append(g);
14;
g.attr({
transform: "r45t100,0s.5"
});
15;
console.log(g.attr("transform"));
16;
g.drag();
17;
s.text(200, 100, "SAVAGE");
18;
var t = s.text(200, 120, ["S","A","V","A","G","E"]);
t.selectAll("tspan tspan:nth-child(odd)").attr({
fill: "#900",
"font-size": "20px"
});
};
</script>
</head>

1276
savage.path.js Normal file

File diff suppressed because it is too large Load Diff

906
svg.js

File diff suppressed because it is too large Load Diff