mirror of
https://github.com/scratchfoundation/paper.js.git
synced 2025-07-12 04:34:41 -04:00
Change all examples to load the latest compiled library from out/paper.js.
This commit is contained in:
parent
c341ec220a
commit
5e4192198b
34 changed files with 44 additions and 71 deletions
examples
Animated
AnimatedStar.htmlExtruded.htmlFlock.htmlLines.htmlRadialRainbows.htmlRaster.htmlRoundedRectangles.htmlSmoothing.html
Scripts
Arcs.htmlBouncingBalls.htmlChain.htmlCircle.htmlCompoundPath.htmlCurveTimeParametrization.htmlLetter.htmlPathStructure.htmlPhyllotaxisRaster.htmlRotationRaster.htmlRoundRectangle.htmlStrokeBounds.html
Tools
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
var layer = project.activeLayer;
|
||||
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
var segments = [
|
||||
[new Point(63.39306640625, 265.7138671875), null, new Point(10.86669921875, 6.96630859375)],
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
// Adapted from Flocking Processing example by Daniel Schiffman:
|
||||
// http://processing.org/learning/topics/flocking.html
|
||||
|
@ -13,6 +12,7 @@
|
|||
project.currentStyle = {
|
||||
strokeColor: 'white',
|
||||
strokeWidth: 2,
|
||||
dashArray: [4, 4],
|
||||
strokeCap: 'round'
|
||||
};
|
||||
|
||||
|
@ -296,6 +296,6 @@
|
|||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<canvas id="canvas" resize keepalive="true"></canvas>
|
||||
<canvas id="canvas" resize keepalive="true" stats></canvas>
|
||||
</body>
|
||||
</html>
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
var amount = 180;
|
||||
for (var i = 0; i < amount; i++) {
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
var point = view.center;
|
||||
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
// http://en.wikipedia.org/wiki/Lenna
|
||||
var raster = new Raster('lenna');
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
var mousePoint = view.center;
|
||||
var amount = 25;
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
var width, height, center;
|
||||
var points = 10;
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
var point = view.center;
|
||||
for (var i = 0; i < 30; i++) {
|
||||
|
|
|
@ -4,10 +4,13 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
var balls = [];
|
||||
|
||||
var bg = new Path.Rectangle([0, 0], view.size);
|
||||
bg.fillColor = '#f00';
|
||||
|
||||
var group = new Group();
|
||||
|
||||
var Ball = Base.extend({
|
||||
|
@ -21,12 +24,14 @@
|
|||
this.dampen = 0.4;
|
||||
this.gravity = 3;
|
||||
this.bounce = -0.6;
|
||||
this.radius = 50 * Math.random() + 30;
|
||||
this.radius = 60; //50 * Math.random() + 30;
|
||||
this.item = new Path.Circle(point, this.radius);
|
||||
var color = new HSBColor(Math.random() * 360, 1, 1);
|
||||
var gradient = new Gradient([color, new RGBColor(0, 0, 0)], 'radial');
|
||||
this.item.fillColor = new GradientColor(gradient, point,
|
||||
point + this.radius, this.radius * 0.8);
|
||||
this.item.blendMode = 'luminosity';
|
||||
// this.item.opacity = 0.75;
|
||||
group.appendTop(this.item);
|
||||
},
|
||||
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
// Adapted from the following Processing example:
|
||||
// http://processing.org/learning/topics/follow3.html
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
var center = view.center;
|
||||
for (var i = 0; i < 70; i++) {
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
project.currentStyle.fillColor = 'black';
|
||||
var path1 = new Path.Rectangle([200, 200], [100, 100]);
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
var path = new Path();
|
||||
path.moveTo(200, 200);
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
var letterPath = new Path(
|
||||
new Segment(new Point(63.39306640625, 265.7138671875), null, new Point(10.86669921875, 6.96630859375)),
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
var y = view.size.height / 2;
|
||||
var width = view.size.width;
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
// Example inspired by: 'Phyllotactic Spirals' by Ken Frederick
|
||||
// http://scriptographer.org/scripts/general-scripts/phyllotactic-spirals/
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
var raster = new Raster('lenna');
|
||||
var size = new Size(50, 50);
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
var path;
|
||||
var rect = new Rectangle([150, 150], [300, 300]);
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
var paths = [];
|
||||
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
var path;
|
||||
var types = ['point', 'handleIn', 'handleOut'];
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
// All newly created items will receive
|
||||
// these style properties:
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
// Any newly created item will inherit the following styles:
|
||||
project.currentStyle = {
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
var path, point;
|
||||
|
||||
|
@ -29,7 +28,7 @@
|
|||
}
|
||||
|
||||
function onMouseUp(event) {
|
||||
path.pointsToCurves(1);
|
||||
path.pointsToCurves(10);
|
||||
path.selected = true;
|
||||
}
|
||||
</script>
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
var path;
|
||||
var minSize = 5;
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
////////////////////////////////////////////////////////////////////////////////
|
||||
// This script belongs to the following tutorial:
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
/////////////////////////////////////////////////////////////////////
|
||||
// Values
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
// Ported from original Metaball script by SATO Hiroyuki
|
||||
// http://park12.wakwak.com/~shp/lc/et/en_aics_script.html
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
tool.fixedDistance = 30;
|
||||
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
/////////////////////////////////////////////////////////////////////
|
||||
// Values
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
function onMouseDown(event) {
|
||||
var hue = Math.random() * 360;
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
project.currentStyle.fillColor = 'black';
|
||||
////////////////////////////////////////////////////////////////////////////////
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
//////////////////////////////////////////////////////////////////////
|
||||
// Values
|
||||
|
|
|
@ -4,8 +4,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Example</title>
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript">var root = '../../'</script>
|
||||
<script type="text/javascript" src="../../src/load.js"></script>
|
||||
<script type="text/javascript" src="../../out/paper.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
/////////////////////////////////////////////////////////////////////
|
||||
// Values
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue