scratchfoundation/paper.js
1
0
Fork 0
mirror of https://github.com/scratchfoundation/paper.js.git synced 2024-12-29 09:22:22 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions

Move examples into subfolders.

Browse source
This commit is contained in:
Jonathan Puckey 2011-02-08 13:16:26 +01:00
parent 7e285abe7a
commit cac4bea955
14 changed files with 206 additions and 206 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
examples/animatedStar.html → examples/Animated/animatedStar.html
View file

@ -4,16 +4,16 @@
<head> <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Example</title> <title>Example</title>
<script type="text/javascript" src="../src/Bootstrap.js"></script> <script type="text/javascript" src="../../src/Bootstrap.js"></script>
<script type="text/javascript" src="../src/Item.js"></script> <script type="text/javascript" src="../../src/Item.js"></script>
<script type="text/javascript" src="../src/PathItem.js"></script> <script type="text/javascript" src="../../src/PathItem.js"></script>
<script type="text/javascript" src="../src/Point.js"></script> <script type="text/javascript" src="../../src/Point.js"></script>
<script type="text/javascript" src="../src/Rectangle.js"></script> <script type="text/javascript" src="../../src/Rectangle.js"></script>
<script type="text/javascript" src="../src/Size.js"></script> <script type="text/javascript" src="../../src/Size.js"></script>
<script type="text/javascript" src="../src/Segment.js"></script> <script type="text/javascript" src="../../src/Segment.js"></script>
<script type="text/javascript" src="../src/PathItem.js"></script> <script type="text/javascript" src="../../src/PathItem.js"></script>
<script type="text/javascript" src="../src/Path.js"></script> <script type="text/javascript" src="../../src/Path.js"></script>
<script type="text/javascript" src="../src/Doc.js"></script> <script type="text/javascript" src="../../src/Doc.js"></script>
<script> <script>
var canvas, doc; var canvas, doc;
var count = 0; var count = 0;
@ -43,7 +43,7 @@
doc.children.push(path); doc.children.push(path);
} }
doc.children.reverse(); doc.children.reverse();
doc.draw(); doc.redraw();
} }
</script> </script>
</head> </head>

22
examples/arcTo.html → examples/Scripts/arcTo.html
View file

@ -4,16 +4,16 @@
<head> <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Example</title> <title>Example</title>
<script type="text/javascript" src="../src/Bootstrap.js"></script> <script type="text/javascript" src="../../src/Bootstrap.js"></script>
<script type="text/javascript" src="../src/Item.js"></script> <script type="text/javascript" src="../../src/Item.js"></script>
<script type="text/javascript" src="../src/PathItem.js"></script> <script type="text/javascript" src="../../src/PathItem.js"></script>
<script type="text/javascript" src="../src/Point.js"></script> <script type="text/javascript" src="../../src/Point.js"></script>
<script type="text/javascript" src="../src/Rectangle.js"></script> <script type="text/javascript" src="../../src/Rectangle.js"></script>
<script type="text/javascript" src="../src/Size.js"></script> <script type="text/javascript" src="../../src/Size.js"></script>
<script type="text/javascript" src="../src/Segment.js"></script> <script type="text/javascript" src="../../src/Segment.js"></script>
<script type="text/javascript" src="../src/PathItem.js"></script> <script type="text/javascript" src="../../src/PathItem.js"></script>
<script type="text/javascript" src="../src/Path.js"></script> <script type="text/javascript" src="../../src/Path.js"></script>
<script type="text/javascript" src="../src/Doc.js"></script> <script type="text/javascript" src="../../src/Doc.js"></script>
<script> <script>
window.onload = function() { window.onload = function() {
var canvas = document.getElementById('canvas'); var canvas = document.getElementById('canvas');
@ -38,7 +38,7 @@
} }
doc.children.reverse(); doc.children.reverse();
doc.draw(); doc.redraw();
} }
</script> </script>
</head> </head>

35
examples/Scripts/circle.html Normal file
View file

@ -0,0 +1,35 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Example</title>
<script type="text/javascript" src="../../src/Bootstrap.js"></script>
<script type="text/javascript" src="../../src/Item.js"></script>
<script type="text/javascript" src="../../src/PathItem.js"></script>
<script type="text/javascript" src="../../src/Point.js"></script>
<script type="text/javascript" src="../../src/Rectangle.js"></script>
<script type="text/javascript" src="../../src/Size.js"></script>
<script type="text/javascript" src="../../src/Segment.js"></script>
<script type="text/javascript" src="../../src/PathItem.js"></script>
<script type="text/javascript" src="../../src/Path.js"></script>
<script type="text/javascript" src="../../src/Doc.js"></script>
<script>
var count = 0;
var doc;
window.onload = function() {
var canvas = document.getElementById('canvas');
doc = new Doc(canvas);
var center = doc.size.divide(2);
for(var i = 0; i < 70; i++) {
var path = new Path.Circle(center, i * 5);
path.strokeColor = 'black';
doc.children.push(path);
}
doc.redraw();
}
</script>
</head>
<body>
<canvas id='canvas' width=1024 height=768></canvas>
</body>

22
examples/letter.html → examples/Scripts/letter.html
View file

@ -4,16 +4,16 @@
<head> <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Example</title> <title>Example</title>
<script type="text/javascript" src="../src/Bootstrap.js"></script> <script type="text/javascript" src="../../src/Bootstrap.js"></script>
<script type="text/javascript" src="../src/Item.js"></script> <script type="text/javascript" src="../../src/Item.js"></script>
<script type="text/javascript" src="../src/PathItem.js"></script> <script type="text/javascript" src="../../src/PathItem.js"></script>
<script type="text/javascript" src="../src/Point.js"></script> <script type="text/javascript" src="../../src/Point.js"></script>
<script type="text/javascript" src="../src/Rectangle.js"></script> <script type="text/javascript" src="../../src/Rectangle.js"></script>
<script type="text/javascript" src="../src/Size.js"></script> <script type="text/javascript" src="../../src/Size.js"></script>
<script type="text/javascript" src="../src/Segment.js"></script> <script type="text/javascript" src="../../src/Segment.js"></script>
<script type="text/javascript" src="../src/PathItem.js"></script> <script type="text/javascript" src="../../src/PathItem.js"></script>
<script type="text/javascript" src="../src/Path.js"></script> <script type="text/javascript" src="../../src/Path.js"></script>
<script type="text/javascript" src="../src/Doc.js"></script> <script type="text/javascript" src="../../src/Doc.js"></script>
<script> <script>
window.onload = function() { window.onload = function() {
var canvas = document.getElementById('canvas'); var canvas = document.getElementById('canvas');
@ -37,7 +37,7 @@
); );
letterPath.fillColor = 'black'; letterPath.fillColor = 'black';
doc.children.push(letterPath); doc.children.push(letterPath);
doc.draw(); doc.redraw();
} }
</script> </script>
</head> </head>

22
examples/lines.html → examples/Scripts/lines.html
View file

@ -4,16 +4,16 @@
<head> <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Example</title> <title>Example</title>
<script type="text/javascript" src="../src/Bootstrap.js"></script> <script type="text/javascript" src="../../src/Bootstrap.js"></script>
<script type="text/javascript" src="../src/Item.js"></script> <script type="text/javascript" src="../../src/Item.js"></script>
<script type="text/javascript" src="../src/PathItem.js"></script> <script type="text/javascript" src="../../src/PathItem.js"></script>
<script type="text/javascript" src="../src/Point.js"></script> <script type="text/javascript" src="../../src/Point.js"></script>
<script type="text/javascript" src="../src/Rectangle.js"></script> <script type="text/javascript" src="../../src/Rectangle.js"></script>
<script type="text/javascript" src="../src/Size.js"></script> <script type="text/javascript" src="../../src/Size.js"></script>
<script type="text/javascript" src="../src/Segment.js"></script> <script type="text/javascript" src="../../src/Segment.js"></script>
<script type="text/javascript" src="../src/PathItem.js"></script> <script type="text/javascript" src="../../src/PathItem.js"></script>
<script type="text/javascript" src="../src/Path.js"></script> <script type="text/javascript" src="../../src/Path.js"></script>
<script type="text/javascript" src="../src/Doc.js"></script> <script type="text/javascript" src="../../src/Doc.js"></script>
<script> <script>
var count = 0; var count = 0;
var doc; var doc;
@ -33,7 +33,7 @@
path.strokeColor = i % 4 ? 'black' : 'red'; path.strokeColor = i % 4 ? 'black' : 'red';
doc.children.push(path); doc.children.push(path);
} }
doc.draw(); doc.redraw();
} }
</script> </script>
</head> </head>

33
examples/Scripts/rectangle.html Normal file
View file

@ -0,0 +1,33 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Example</title>
<script type="text/javascript" src="../../src/Bootstrap.js"></script>
<script type="text/javascript" src="../../src/Item.js"></script>
<script type="text/javascript" src="../../src/PathItem.js"></script>
<script type="text/javascript" src="../../src/Point.js"></script>
<script type="text/javascript" src="../../src/Rectangle.js"></script>
<script type="text/javascript" src="../../src/Size.js"></script>
<script type="text/javascript" src="../../src/Segment.js"></script>
<script type="text/javascript" src="../../src/PathItem.js"></script>
<script type="text/javascript" src="../../src/Path.js"></script>
<script type="text/javascript" src="../../src/Doc.js"></script>
<script>
var count = 0;
var doc;
window.onload = function() {
var canvas = document.getElementById('canvas');
doc = new Doc(canvas);
var path = new Path.Rectangle([50, 50], [100, 100]);
path.strokeColor = 'black';
console.log(path);
doc.children.push(path);
doc.redraw();
}
</script>
</head>
<body>
<canvas id='canvas' width=1024 height=768></canvas>
</body>

22
examples/roundRectangle.html → examples/Scripts/roundRectangle.html
View file

@ -4,16 +4,16 @@
<head> <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Example</title> <title>Example</title>
<script type="text/javascript" src="../src/Bootstrap.js"></script> <script type="text/javascript" src="../../src/Bootstrap.js"></script>
<script type="text/javascript" src="../src/Item.js"></script> <script type="text/javascript" src="../../src/Item.js"></script>
<script type="text/javascript" src="../src/PathItem.js"></script> <script type="text/javascript" src="../../src/PathItem.js"></script>
<script type="text/javascript" src="../src/Point.js"></script> <script type="text/javascript" src="../../src/Point.js"></script>
<script type="text/javascript" src="../src/Rectangle.js"></script> <script type="text/javascript" src="../../src/Rectangle.js"></script>
<script type="text/javascript" src="../src/Size.js"></script> <script type="text/javascript" src="../../src/Size.js"></script>
<script type="text/javascript" src="../src/Segment.js"></script> <script type="text/javascript" src="../../src/Segment.js"></script>
<script type="text/javascript" src="../src/PathItem.js"></script> <script type="text/javascript" src="../../src/PathItem.js"></script>
<script type="text/javascript" src="../src/Path.js"></script> <script type="text/javascript" src="../../src/Path.js"></script>
<script type="text/javascript" src="../src/Doc.js"></script> <script type="text/javascript" src="../../src/Doc.js"></script>
<script> <script>
var count = 0; var count = 0;
var doc; var doc;
@ -30,7 +30,7 @@
var path = new Path.RoundRectangle(rect, size); var path = new Path.RoundRectangle(rect, size);
path.fillColor = 'black'; path.fillColor = 'black';
doc.children.push(path); doc.children.push(path);
doc.draw(); doc.redraw();
} }
</script> </script>
</head> </head>

22
examples/star.html → examples/Scripts/star.html
View file

@ -4,16 +4,16 @@
<head> <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Example</title> <title>Example</title>
<script type="text/javascript" src="../src/Bootstrap.js"></script> <script type="text/javascript" src="../../src/Bootstrap.js"></script>
<script type="text/javascript" src="../src/Item.js"></script> <script type="text/javascript" src="../../src/Item.js"></script>
<script type="text/javascript" src="../src/PathItem.js"></script> <script type="text/javascript" src="../../src/PathItem.js"></script>
<script type="text/javascript" src="../src/Point.js"></script> <script type="text/javascript" src="../../src/Point.js"></script>
<script type="text/javascript" src="../src/Rectangle.js"></script> <script type="text/javascript" src="../../src/Rectangle.js"></script>
<script type="text/javascript" src="../src/Size.js"></script> <script type="text/javascript" src="../../src/Size.js"></script>
<script type="text/javascript" src="../src/Segment.js"></script> <script type="text/javascript" src="../../src/Segment.js"></script>
<script type="text/javascript" src="../src/PathItem.js"></script> <script type="text/javascript" src="../../src/PathItem.js"></script>
<script type="text/javascript" src="../src/Path.js"></script> <script type="text/javascript" src="../../src/Path.js"></script>
<script type="text/javascript" src="../src/Doc.js"></script> <script type="text/javascript" src="../../src/Doc.js"></script>
<script> <script>
window.onload = function() { window.onload = function() {
var canvas = document.getElementById('canvas'); var canvas = document.getElementById('canvas');
@ -36,7 +36,7 @@
doc.children.push(path); doc.children.push(path);
} }
doc.children.reverse(); doc.children.reverse();
doc.draw(); doc.redraw();
} }
</script> </script>
</head> </head>

34
examples/Scripts/strokeJoin.html Normal file
View file

@ -0,0 +1,34 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Example</title>
<script type="text/javascript" src="../../src/Bootstrap.js"></script>
<script type="text/javascript" src="../../src/Item.js"></script>
<script type="text/javascript" src="../../src/PathItem.js"></script>
<script type="text/javascript" src="../../src/Point.js"></script>
<script type="text/javascript" src="../../src/Rectangle.js"></script>
<script type="text/javascript" src="../../src/Size.js"></script>
<script type="text/javascript" src="../../src/Segment.js"></script>
<script type="text/javascript" src="../../src/PathItem.js"></script>
<script type="text/javascript" src="../../src/Path.js"></script>
<script type="text/javascript" src="../../src/Doc.js"></script>
<script>
var count = 0;
var doc;
window.onload = function() {
var canvas = document.getElementById('canvas');
doc = new Doc(canvas);
var path = new Path([100, 150], [150, 200], [200, 150]);
path.strokeColor = 'black';
path.strokeWidth = 30;
path.strokeJoin = 'bevel';
doc.children.push(path);
doc.redraw();
}
</script>
</head>
<body>
<canvas id='canvas' width=1024 height=768></canvas>
</body>

38
examples/Scripts/temp.html Normal file
View file

@ -0,0 +1,38 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Example</title>
<script type="text/javascript" src="../../src/Bootstrap.js"></script>
<script type="text/javascript" src="../../src/Item.js"></script>
<script type="text/javascript" src="../../src/PathItem.js"></script>
<script type="text/javascript" src="../../src/Point.js"></script>
<script type="text/javascript" src="../../src/Rectangle.js"></script>
<script type="text/javascript" src="../../src/Size.js"></script>
<script type="text/javascript" src="../../src/Segment.js"></script>
<script type="text/javascript" src="../../src/PathItem.js"></script>
<script type="text/javascript" src="../../src/Path.js"></script>
<script type="text/javascript" src="../../src/Doc.js"></script>
<script>
var count = 0;
var doc;
window.onload = function() {
var canvas = document.getElementById('canvas');
doc = new Doc(canvas);
var rect = new Rectangle([50, 50], [200, 100])
var path = new Path.RoundRectangle(rect, 200);
path.strokeColor = 'black';
console.log(path);
doc.children.push(path);
// var path = new Path.Rectangle(rect);
// path.strokeColor = 'black';
// doc.children.push(path);
doc.redraw();
}
</script>
</head>
<body>
<canvas id='canvas' width=1024 height=768></canvas>
</body>

35
examples/circle.html
View file

@ -1,35 +0,0 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Example</title>
<script type="text/javascript" src="../src/Bootstrap.js"></script>
<script type="text/javascript" src="../src/Item.js"></script>
<script type="text/javascript" src="../src/PathItem.js"></script>
<script type="text/javascript" src="../src/Point.js"></script>
<script type="text/javascript" src="../src/Rectangle.js"></script>
<script type="text/javascript" src="../src/Size.js"></script>
<script type="text/javascript" src="../src/Segment.js"></script>
<script type="text/javascript" src="../src/PathItem.js"></script>
<script type="text/javascript" src="../src/Path.js"></script>
<script type="text/javascript" src="../src/Doc.js"></script>
<script>
var count = 0;
var doc;
window.onload = function() {
var canvas = document.getElementById('canvas');
doc = new Doc(canvas);
var center = doc.size.divide(2);
for(var i = 0; i < 70; i++) {
var path = new Path.Circle(center, i * 5);
path.strokeColor = 'black';
doc.children.push(path);
}
doc.draw();
}
</script>
</head>
<body>
<canvas id='canvas' width=1024 height=768></canvas>
</body>

33
examples/rectangle.html
View file

@ -1,33 +0,0 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Example</title>
<script type="text/javascript" src="../src/Bootstrap.js"></script>
<script type="text/javascript" src="../src/Item.js"></script>
<script type="text/javascript" src="../src/PathItem.js"></script>
<script type="text/javascript" src="../src/Point.js"></script>
<script type="text/javascript" src="../src/Rectangle.js"></script>
<script type="text/javascript" src="../src/Size.js"></script>
<script type="text/javascript" src="../src/Segment.js"></script>
<script type="text/javascript" src="../src/PathItem.js"></script>
<script type="text/javascript" src="../src/Path.js"></script>
<script type="text/javascript" src="../src/Doc.js"></script>
<script>
var count = 0;
var doc;
window.onload = function() {
var canvas = document.getElementById('canvas');
doc = new Doc(canvas);
var path = new Path.Rectangle([50, 50], [100, 100]);
path.strokeColor = 'black';
console.log(path);
doc.children.push(path);
doc.draw();
}
</script>
</head>
<body>
<canvas id='canvas' width=1024 height=768></canvas>
</body>

34
examples/strokeJoin.html
View file

@ -1,34 +0,0 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Example</title>
<script type="text/javascript" src="../src/Bootstrap.js"></script>
<script type="text/javascript" src="../src/Item.js"></script>
<script type="text/javascript" src="../src/PathItem.js"></script>
<script type="text/javascript" src="../src/Point.js"></script>
<script type="text/javascript" src="../src/Rectangle.js"></script>
<script type="text/javascript" src="../src/Size.js"></script>
<script type="text/javascript" src="../src/Segment.js"></script>
<script type="text/javascript" src="../src/PathItem.js"></script>
<script type="text/javascript" src="../src/Path.js"></script>
<script type="text/javascript" src="../src/Doc.js"></script>
<script>
var count = 0;
var doc;
window.onload = function() {
var canvas = document.getElementById('canvas');
doc = new Doc(canvas);
var path = new Path([100, 150], [150, 200], [200, 150]);
path.strokeColor = 'black';
path.strokeWidth = 30;
path.strokeJoin = 'bevel';
doc.children.push(path);
doc.draw();
}
</script>
</head>
<body>
<canvas id='canvas' width=1024 height=768></canvas>
</body>

38
examples/temp.html
View file

@ -1,38 +0,0 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Example</title>
<script type="text/javascript" src="../src/Bootstrap.js"></script>
<script type="text/javascript" src="../src/Item.js"></script>
<script type="text/javascript" src="../src/PathItem.js"></script>
<script type="text/javascript" src="../src/Point.js"></script>
<script type="text/javascript" src="../src/Rectangle.js"></script>
<script type="text/javascript" src="../src/Size.js"></script>
<script type="text/javascript" src="../src/Segment.js"></script>
<script type="text/javascript" src="../src/PathItem.js"></script>
<script type="text/javascript" src="../src/Path.js"></script>
<script type="text/javascript" src="../src/Doc.js"></script>
<script>
var count = 0;
var doc;
window.onload = function() {
var canvas = document.getElementById('canvas');
doc = new Doc(canvas);
var rect = new Rectangle([50, 50], [200, 100])
var path = new Path.RoundRectangle(rect, 200);
path.strokeColor = 'black';
console.log(path);
doc.children.push(path);
// var path = new Path.Rectangle(rect);
// path.strokeColor = 'black';
// doc.children.push(path);
doc.draw();
}
</script>
</head>
<body>
<canvas id='canvas' width=1024 height=768></canvas>
</body>