scratchfoundation/paper.js
1
0
Fork 0
mirror of https://github.com/scratchfoundation/paper.js.git synced 2025-01-03 19:45:44 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions

Clean up SVG example scripts.

Browse source
This commit is contained in:
Jürg Lehni 2012-11-05 23:27:17 -08:00
parent ad76e65119
commit c544083a4c
8 changed files with 181 additions and 263 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
examples/SVG Export/Circle Testing.html
View file

@ -10,9 +10,6 @@
<body> <body>
<canvas id="canvas" width="500px" height="500px"></canvas> <canvas id="canvas" width="500px" height="500px"></canvas>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
initializePath();
function initializePath() {
var topLeft = new Point(200, 200); var topLeft = new Point(200, 200);
var size = new Size(150, 100); var size = new Size(150, 100);
var rectangle = new Rectangle(topLeft, size); var rectangle = new Rectangle(topLeft, size);
@ -33,12 +30,6 @@
var test = document.getElementById('svg') var test = document.getElementById('svg')
test.innerHTML = ""; test.innerHTML = "";
test.appendChild (output); test.appendChild (output);
}
// Reposition the path whenever the window is resized:
function onResize(event) {
initializePath();
}
</script> </script>
<svg id="svg" style="width: 500px; height: 500px"> <svg id="svg" style="width: 500px; height: 500px">
</svg> </svg>

8
examples/SVG Export/Empty Path Testing.html
View file

@ -10,9 +10,6 @@
<body> <body>
<canvas id="canvas" width="500px" height="500px"></canvas> <canvas id="canvas" width="500px" height="500px"></canvas>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
initializePath();
function initializePath() {
var path = new Path(); var path = new Path();
path.strokeColor = 'black'; path.strokeColor = 'black';
path.add(new Point(30, 30)); path.add(new Point(30, 30));
@ -27,11 +24,6 @@
var test = document.getElementById('svg') var test = document.getElementById('svg')
test.innerHTML = ""; test.innerHTML = "";
test.appendChild (output); test.appendChild (output);
}
// Reposition the path whenever the window is resized:
function onResize(event) {
initializePath();
}
</script> </script>
<svg id="svg" style="width: 500px; height: 500px"> <svg id="svg" style="width: 500px; height: 500px">
</svg> </svg>

15
examples/SVG Export/Line Testing.html
View file

@ -10,9 +10,6 @@
<body> <body>
<canvas id="canvas" width="500px" height="500px"></canvas> <canvas id="canvas" width="500px" height="500px"></canvas>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
initializePath();
function initializePath() {
var x1 = 5, var x1 = 5,
x2 = 45, x2 = 45,
y1 = 5, y1 = 5,
@ -41,17 +38,7 @@
console.log(output); console.log(output);
var test = document.getElementById('svg') var test = document.getElementById('svg')
test.innerHTML = ""; test.innerHTML = "";
test.appendChild (output); test.appendChild(output);
}
// Reposition the path whenever the window is resized:
function onResize(event) {
initializePath();
}
</script> </script>
<svg id="svg" style="width: 500px; height: 500px"> <svg id="svg" style="width: 500px; height: 500px">
</svg> </svg>

11
examples/SVG Export/Random Path Testing.html
View file

@ -10,9 +10,6 @@
<body> <body>
<canvas id="canvas" width="500px" height="500px"></canvas> <canvas id="canvas" width="500px" height="500px"></canvas>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
initializePath();
function initializePath() {
var center = new Point(100, 100); var center = new Point(100, 100);
var sides = 3; var sides = 3;
var radius = 50; var radius = 50;
@ -39,13 +36,7 @@
console.log(output); console.log(output);
var test = document.getElementById('svg') var test = document.getElementById('svg')
test.innerHTML = ""; test.innerHTML = "";
test.appendChild (output); test.appendChild(output);
}
// Reposition the path whenever the window is resized:
function onResize(event) {
initializePath();
}
</script> </script>
<svg id="svg" style="width: 500px; height: 500px"> <svg id="svg" style="width: 500px; height: 500px">
</svg> </svg>

13
examples/SVG Export/Rect and Attribute Testing.html
View file

@ -10,9 +10,6 @@
<body> <body>
<canvas id="canvas" width="500px" height="500px"></canvas> <canvas id="canvas" width="500px" height="500px"></canvas>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
initializePath();
function initializePath() {
var point1 = new Point(10, 10); var point1 = new Point(10, 10);
var size1 = new Size(50, 50); var size1 = new Size(50, 50);
var rectangle1 = new Rectangle(point1, size1); var rectangle1 = new Rectangle(point1, size1);
@ -53,15 +50,7 @@
console.log(output); console.log(output);
var test = document.getElementById('svg') var test = document.getElementById('svg')
test.innerHTML = ""; test.innerHTML = "";
test.appendChild (output); test.appendChild(output);
}
// Reposition the path whenever the window is resized:
function onResize(event) {
initializePath();
}
</script> </script>
<svg id="svg" style="width: 500px; height: 500px"> <svg id="svg" style="width: 500px; height: 500px">
</svg> </svg>

18
examples/SVG Export/Text Testing.html
View file

@ -8,11 +8,8 @@
</head> </head>
<body> <body>
<canvas id="canvas" width="500" height="350"></canvas> <canvas id="canvas" width="500" height="500"></canvas>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
function initializePath() {
var text = new PointText(new Point(50, 100)); var text = new PointText(new Point(50, 100));
text.fillColor = 'black'; text.fillColor = 'black';
text.content = 'This is a test'; text.content = 'This is a test';
@ -22,11 +19,8 @@
text.strokeWidth = '4'; text.strokeWidth = '4';
text.content = 'This is also a test'; text.content = 'This is also a test';
radius = 50; var path2 = new Path.Circle(new Point(100, 100), 50);
center = new Point(100,100);
var path2 = new Path.Circle(center,radius);
path2.strokeColor = 'black'; path2.strokeColor = 'black';
point = new Point(120,100);
path2.shear(.5, .5); path2.shear(.5, .5);
colors = ['red', 'blue', 'green', 'orange']; colors = ['red', 'blue', 'green', 'orange'];
for (var i in path2.segments) { for (var i in path2.segments) {
@ -39,14 +33,6 @@
var test = document.getElementById('svg') var test = document.getElementById('svg')
test.innerHTML = ""; test.innerHTML = "";
test.appendChild (output); test.appendChild (output);
}
// Reposition the path whenever the window is resized:
function onResize(event) {
initializePath();
}
</script> </script>
<svg id="svg" style="width: 500px; height: 500px"> <svg id="svg" style="width: 500px; height: 500px">
</svg> </svg>

10
examples/SVG Export/Transform Test 1.html
View file

@ -10,9 +10,6 @@
<body> <body>
<canvas id="canvas" width="500px" height="500px"></canvas> <canvas id="canvas" width="500px" height="500px"></canvas>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
initializePath();
function initializePath() {
var circlePath = new Path.Circle(new Point(280, 100), 25); var circlePath = new Path.Circle(new Point(280, 100), 25);
circlePath.strokeColor = 'black'; circlePath.strokeColor = 'black';
circlePath.fillColor = 'white'; circlePath.fillColor = 'white';
@ -30,13 +27,6 @@
var test = document.getElementById('svg') var test = document.getElementById('svg')
test.innerHTML = ""; test.innerHTML = "";
test.appendChild (output); test.appendChild (output);
}
// Reposition the path whenever the window is resized:
function onResize(event) {
initializePath();
}
</script> </script>
<svg id="svg" style="width: 500px; height: 500px"> <svg id="svg" style="width: 500px; height: 500px">
</svg> </svg>

8
examples/SVG Export/Transform Test 2.html
View file

@ -10,8 +10,6 @@
<body> <body>
<canvas id="canvas" width="500px" height="500px"></canvas> <canvas id="canvas" width="500px" height="500px"></canvas>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
initializePath();
function initializePath() {
var path = new Path.Rectangle(new Point(50, 50), new Size(100, 50)); var path = new Path.Rectangle(new Point(50, 50), new Size(100, 50));
path.style = { path.style = {
fillColor: 'white', fillColor: 'white',
@ -25,12 +23,6 @@
var test = document.getElementById('svg') var test = document.getElementById('svg')
test.innerHTML = ""; test.innerHTML = "";
test.appendChild (output); test.appendChild (output);
}
// Reposition the path whenever the window is resized:
function onResize(event) {
initializePath();
}
</script> </script>
<svg id="svg" style="width: 500px; height: 500px"> <svg id="svg" style="width: 500px; height: 500px">
</svg> </svg>