Switch from dist/paper.js to dist/paper-full.js and explain the different versions in the README.

Closes #422.
This commit is contained in:
Jürg Lehni 2014-04-06 13:44:19 +02:00
parent 95bcdac57c
commit fe064e9cc3
117 changed files with 570 additions and 13184 deletions

View file

@ -24,7 +24,15 @@ With Bower installed, simply type this command in your project folder:
bower install paper bower install paper
Upon execution, you will find a `paper` folder inside the project's `component` folder. For more information on Bower and to learn about its features for dependence tracking, see <http://bower.io/>. Upon execution, you will find a `paper` folder inside the project's `bower_components` folder. For more information on Bower and to learn about its features for dependence tracking, see <http://bower.io/>.
## Which Version to Use?
The various distributions come with three different pre-build versions of Paper.js, in minified and normal variants:
- `paper-full.js` The full version for the browser, including PaperScript support and Acorn.js
- `paper-core.js` The core version for the browser, without PaperScript support nor Acorn.js. Use this to shave off some bytes when working with JavaScript directly.
- `paper-node.js` The version for Node.js. It is recommended to install this through NPM, see below.
## Installing Paper.js for Node.js through NPM ## Installing Paper.js for Node.js through NPM
@ -142,7 +150,7 @@ And to go back to a built library
cd build cd build
./build.sh ./build.sh
Note that your PaperScripts examples do not need to change, they can simply load `dist/paper.js`, which will always do the right rhing. Note also that `src/load.js` handles both browsers and Node.js, through the handy PrePro library <http://github.com/lehni/prepro.js>. Note that your PaperScripts examples do not need to change, they can keep loading `dist/paper-full.js`, which will always do the right thing. Note also that `src/load.js` handles both browsers and Node.js, through the handy PrePro JS preprocessing library <http://github.com/lehni/prepro.js>.
### Testing ### Testing

View file

@ -16,7 +16,7 @@
"vector", "graphic", "graphics", "2d", "geometry", "bezier", "curve", "vector", "graphic", "graphics", "2d", "geometry", "bezier", "curve",
"curves", "path", "paths", "canvas", "svg", "paper", "paper.js" "curves", "path", "paths", "canvas", "svg", "paper", "paper.js"
], ],
"main": "dist/paper.js", "main": "dist/paper-full.js",
"ignore": [ "ignore": [
"build", "build",
"components", "components",

View file

@ -33,10 +33,3 @@ fi
./preprocess.sh $MODE ../src/paper.js "-i '../src/constants.js'" ../dist/paper-full.js ./preprocess.sh $MODE ../src/paper.js "-i '../src/constants.js'" ../dist/paper-full.js
./preprocess.sh $MODE ../src/paper.js "-o '{ \"paperScript\": false, \"palette\": false }' -i '../src/constants.js'" ../dist/paper-core.js ./preprocess.sh $MODE ../src/paper.js "-o '{ \"paperScript\": false, \"palette\": false }' -i '../src/constants.js'" ../dist/paper-core.js
./preprocess.sh $MODE ../src/paper.js "-o '{ \"environment\": \"node\", \"legacy\": false }' -i '../src/constants.js'" ../dist/paper-node.js ./preprocess.sh $MODE ../src/paper.js "-o '{ \"environment\": \"node\", \"legacy\": false }' -i '../src/constants.js'" ../dist/paper-node.js
# Remove the existing file and copy paper-full.js to paper.js now
if [ -f ../dist/paper.js ]
then
rm ../dist/paper.js
fi
cp ../dist/paper-full.js ../dist/paper.js

View file

@ -10,13 +10,13 @@
# #
# All rights reserved. # All rights reserved.
# This script simply copies src/load.js to dist/paper.js and dist/paper-node.js, # This script simply creates symbolic links to src/load.js from
# which loads the library from separate sources through PrePro both in the # dist/paper-full.js and dist/paper-node.js, which loads the library from
# browser and in Node.js. # separate sources through PrePro both in the browser and in Node.js.
if [ -f ../dist/paper.js ] if [ -f ../dist/paper-full.js ]
then then
rm ../dist/paper.js rm ../dist/paper-full.js
fi fi
if [ -f ../dist/paper-node.js ] if [ -f ../dist/paper-node.js ]
@ -24,5 +24,5 @@ then
rm ../dist/paper-node.js rm ../dist/paper-node.js
fi fi
cp ../src/load.js ../dist/paper.js ln -s ../src/load.js ../dist/paper-full.js
cp ../src/load.js ../dist/paper-node.js ln -s ../src/load.js ../dist/paper-node.js

View file

@ -29,9 +29,6 @@ cp $BASE/dist/paper-core.js dist
cp $BASE/dist/paper-core.min.js dist cp $BASE/dist/paper-core.min.js dist
# Copy examples over # Copy examples over
cp -r $BASE/examples . cp -r $BASE/examples .
# Replace "dist/paper.js" with "dist/paper-full.js" in examples
# (command taken from http://stackoverflow.com/questions/1583219/awk-sed-how-to-do-a-recursive-find-replace-of-a-string)
find ./examples -type f -name "*.html" -print0 | xargs -0 sed -i '' 's/dist\/paper\.js/dist\/paper-full\.js/g'
# Copy docs over # Copy docs over
cp -r $BASE/dist/docs . cp -r $BASE/dist/docs .
# Zip the whole thing # Zip the whole thing

View file

@ -8,5 +8,5 @@
"vector", "graphic", "graphics", "2d", "geometry", "bezier", "curve", "vector", "graphic", "graphics", "2d", "geometry", "bezier", "curve",
"curves", "path", "paths", "canvas", "svg", "paper", "paper.js" "curves", "path", "paths", "canvas", "svg", "paper", "paper.js"
], ],
"scripts": ["./dist/paper.js"] "scripts": ["./dist/paper-full.js"]
} }

12874
dist/paper.js vendored

File diff suppressed because one or more lines are too long

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Animated Star</title> <title>Animated Star</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var layer = project.activeLayer; var layer = project.activeLayer;

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Candy Crash</title> <title>Candy Crash</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
// kynd.info 2014 // kynd.info 2014

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Extruded</title> <title>Extruded</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var lineGroup = new Group(); var lineGroup = new Group();
var lineCount = 100; var lineCount = 100;

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Lines</title> <title>Lines</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var amount = 45; var amount = 45;
for (var i = 0; i < amount; i++) { for (var i = 0; i < amount; i++) {

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Smoothing</title> <title>Smoothing</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var width, height, center; var width, height, center;
var points = 10; var points = 10;

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Space</title> <title>Space</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
// The amount of symbol we want to place; // The amount of symbol we want to place;
var count = 150; var count = 150;

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Space</title> <title>Space</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
// The amount of symbol we want to place; // The amount of symbol we want to place;
var count = 150; var count = 150;

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"> <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<title>Paperoids</title> <title>Paperoids</title>
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
// //

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Palette</title> <title>Palette</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var values = { var values = {
number: 1, number: 1,

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Circle Testing</title> <title>Circle Testing</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas1"> <script type="text/paperscript" canvas="canvas1">
var topLeft = new Point(200, 200); var topLeft = new Point(200, 200);
var size = new Size(150, 100); var size = new Size(150, 100);

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Compound Path</title> <title>Compound Path</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas1"> <script type="text/paperscript" canvas="canvas1">
project.currentStyle.fillColor = 'black'; project.currentStyle.fillColor = 'black';
var path1 = new Path.Rectangle([200, 200], [100, 100]); var path1 = new Path.Rectangle([200, 200], [100, 100]);

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Empty Path Testing</title> <title>Empty Path Testing</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas1"> <script type="text/paperscript" canvas="canvas1">
var path = new Path(); var path = new Path();
path.strokeColor = 'black'; path.strokeColor = 'black';

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Gradients</title> <title>Gradients</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas1"> <script type="text/paperscript" canvas="canvas1">
var path = new Path.Circle(view.center, view.bounds.height * 0.4); var path = new Path.Circle(view.center, view.bounds.height * 0.4);
path.fillColor = { path.fillColor = {

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Group Transform</title> <title>Group Transform</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas1"> <script type="text/paperscript" canvas="canvas1">
var circle1 = new Path.Circle(new Point(100, 100), 50); var circle1 = new Path.Circle(new Point(100, 100), 50);
circle1.fillColor = 'red'; circle1.fillColor = 'red';

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Line Testing</title> <title>Line Testing</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas1"> <script type="text/paperscript" canvas="canvas1">
var x1 = 5, var x1 = 5,
x2 = 45, x2 = 45,

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Random Path Testing</title> <title>Random Path Testing</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas1"> <script type="text/paperscript" canvas="canvas1">
var center = new Point(100, 100); var center = new Point(100, 100);
var sides = 3; var sides = 3;

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Raster</title> <title>Raster</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas1"> <script type="text/paperscript" canvas="canvas1">
var raster = new Raster('lenna'); // new Raster('http://www.lps.usp.br/~hae/apostila/imagens/lenna.jpg'); var raster = new Raster('lenna'); // new Raster('http://www.lps.usp.br/~hae/apostila/imagens/lenna.jpg');
raster.onLoad = function() { raster.onLoad = function() {

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Rectangle Testing</title> <title>Rectangle Testing</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas1"> <script type="text/paperscript" canvas="canvas1">
var point1 = new Point(10, 10); var point1 = new Point(10, 10);
var size1 = new Size(50, 50); var size1 = new Size(50, 50);

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Rotated Primitives</title> <title>Rotated Primitives</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas1"> <script type="text/paperscript" canvas="canvas1">
// This "arbitrary" shape triggered rectangles in the original code, // This "arbitrary" shape triggered rectangles in the original code,
// since point2 is as far from point0 as point3 is from point1. // since point2 is as far from point0 as point3 is from point1.

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Symbols</title> <title>Symbols</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas1"> <script type="text/paperscript" canvas="canvas1">
var path = new Path.Ellipse({ var path = new Path.Ellipse({
from: [10, 10], from: [10, 10],

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Symbols</title> <title>Symbols</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas1"> <script type="text/paperscript" canvas="canvas1">
var ellipse = new Shape.Ellipse({ var ellipse = new Shape.Ellipse({
from: [10, 10], from: [10, 10],

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Symbols</title> <title>Symbols</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas1"> <script type="text/paperscript" canvas="canvas1">
var ellipse = new Path.Ellipse({ var ellipse = new Path.Ellipse({
from: [0, 0], from: [0, 0],

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Text Testing</title> <title>Text Testing</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas1"> <script type="text/paperscript" canvas="canvas1">
var text = new PointText(new Point(50, 100)); var text = new PointText(new Point(50, 100));
text.fillColor = 'black'; text.fillColor = 'black';

File diff suppressed because one or more lines are too long

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Transform Testing</title> <title>Transform Testing</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas1"> <script type="text/paperscript" canvas="canvas1">
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';

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Rectangle Testing</title> <title>Rectangle Testing</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas1"> <script type="text/paperscript" canvas="canvas1">
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 = {

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Bouncing Balls</title> <title>Bouncing Balls</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var Ball = function(point, vector) { var Ball = function(point, vector) {
if (!vector || vector.isZero()) { if (!vector || vector.isZero()) {

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Chain</title> <title>Chain</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
// Adapted from the following Processing example: // Adapted from the following Processing example:
// http://processing.org/learning/topics/follow3.html // http://processing.org/learning/topics/follow3.html

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Division Raster</title> <title>Division Raster</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
// Based on 'JPEG Raster' by Jonathan Puckey: // Based on 'JPEG Raster' by Jonathan Puckey:
// http://www.flickr.com/photos/puckey/3179779686/in/photostream/ // http://www.flickr.com/photos/puckey/3179779686/in/photostream/

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Future Splash</title> <title>Future Splash</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
// Code ported to Paper.js from http://the389.com/9/1/ // Code ported to Paper.js from http://the389.com/9/1/
// with permission. // with permission.

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Hit Testing</title> <title>Hit Testing</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var values = { var values = {
paths: 50, paths: 50,

View file

@ -3,7 +3,7 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Interactive Tiger</title> <title>Interactive Tiger</title>
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
// Import the tiger svg: // Import the tiger svg:
project.importSVG(document.getElementById('svg')); project.importSVG(document.getElementById('svg'));

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Meta Balls</title> <title>Meta Balls</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
// Ported from original Metaball script by SATO Hiroyuki // Ported from original Metaball script by SATO Hiroyuki
// http://park12.wakwak.com/~shp/lc/et/en_aics_script.html // http://park12.wakwak.com/~shp/lc/et/en_aics_script.html

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Nyan Rainbow</title> <title>Nyan Rainbow</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/javascript" src="http://paperjs.org/assets/mediaelement/mediaelement.js"></script> <script type="text/javascript" src="http://paperjs.org/assets/mediaelement/mediaelement.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
// A tribute to Nyan Cat http://www.youtube.com/watch?v=QH2-TGUlwu4 // A tribute to Nyan Cat http://www.youtube.com/watch?v=QH2-TGUlwu4

View file

@ -3,7 +3,7 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Path Intersections</title> <title>Path Intersections</title>
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var words = project.importSVG(document.getElementById('svg')); var words = project.importSVG(document.getElementById('svg'));
words.fillColor = null; words.fillColor = null;

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Q*bertify</title> <title>Q*bertify</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
// Please note: dragging and dropping images only works for // Please note: dragging and dropping images only works for
// certain browsers when serving this script online: // certain browsers when serving this script online:

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Radial Rainbows</title> <title>Radial Rainbows</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var point = view.center; var point = view.center;

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Rounded Rectangles</title> <title>Rounded Rectangles</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var mousePoint = view.center; var mousePoint = view.center;
var amount = 25; var amount = 25;

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Erik Liked To Dance</title> <title>Erik Liked To Dance</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var leftPath = new Path({ var leftPath = new Path({
strokeColor: 'red', strokeColor: 'red',

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Simplify</title> <title>Simplify</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var path; var path;

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Spiral Raster</title> <title>Spiral Raster</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
// Please note: dragging and dropping images only works for // Please note: dragging and dropping images only works for
// certain browsers when serving this script online: // certain browsers when serving this script online:

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Tadpoles</title> <title>Tadpoles</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
// Adapted from Flocking Processing example by Daniel Schiffman: // Adapted from Flocking Processing example by Daniel Schiffman:
// http://processing.org/learning/topics/flocking.html // http://processing.org/learning/topics/flocking.html

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Voronoi</title> <title>Voronoi</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/javascript" src="http://jonathanpuckey.com/static/rhill-voronoi-core.js"></script> <script type="text/javascript" src="http://jonathanpuckey.com/static/rhill-voronoi-core.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var voronoi = new Voronoi(); var voronoi = new Voronoi();

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Phyllotaxis Raster</title> <title>Phyllotaxis Raster</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
// Example inspired by: 'Phyllotactic Spirals' by Ken Frederick // Example inspired by: 'Phyllotactic Spirals' by Ken Frederick
// http://scriptographer.org/scripts/general-scripts/phyllotactic-spirals/ // http://scriptographer.org/scripts/general-scripts/phyllotactic-spirals/

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Raster</title> <title>Raster</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
// http://en.wikipedia.org/wiki/Lenna // http://en.wikipedia.org/wiki/Lenna
// Load from Server: // Load from Server:

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Rotation Raster</title> <title>Rotation Raster</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var raster = new Raster('lenna'); var raster = new Raster('lenna');
var size = new Size(50, 50); var size = new Size(50, 50);

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Circle Testing</title> <title>Circle Testing</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var topLeft = new Point(200, 200); var topLeft = new Point(200, 200);
var size = new Size(150, 100); var size = new Size(150, 100);

File diff suppressed because one or more lines are too long

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Compound Path</title> <title>Compound Path</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
project.currentStyle.fillColor = 'black'; project.currentStyle.fillColor = 'black';
var path1 = new Path.Rectangle([200, 200], [100, 100]); var path1 = new Path.Rectangle([200, 200], [100, 100]);

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Empty Path Testing</title> <title>Empty Path Testing</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var path = new Path(); var path = new Path();
path.strokeColor = 'black'; path.strokeColor = 'black';

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Gradients</title> <title>Gradients</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var stops = [new Color(1, 1, 0, 0), 'red', 'black']; var stops = [new Color(1, 1, 0, 0), 'red', 'black'];

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Group Transform</title> <title>Group Transform</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var circle1 = new Path.Circle(new Point(100, 100), 50); var circle1 = new Path.Circle(new Point(100, 100), 50);
circle1.fillColor = 'red'; circle1.fillColor = 'red';

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Line Testing</title> <title>Line Testing</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var x1 = 5, var x1 = 5,
x2 = 45, x2 = 45,

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Random Path Testing</title> <title>Random Path Testing</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var center = new Point(100, 100); var center = new Point(100, 100);
var sides = 3; var sides = 3;

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Raster</title> <title>Raster</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var raster = new Raster('lenna'); var raster = new Raster('lenna');
raster.position = view.center; raster.position = view.center;

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Rectangle Testing</title> <title>Rectangle Testing</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var point1 = new Point(10, 10); var point1 = new Point(10, 10);
var size1 = new Size(50, 50); var size1 = new Size(50, 50);

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Rotated Primitives</title> <title>Rotated Primitives</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
// This "arbitrary" shape triggered rectangles in the original code, // This "arbitrary" shape triggered rectangles in the original code,
// since point2 is as far from point0 as point3 is from point1. // since point2 is as far from point0 as point3 is from point1.

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Shapes</title> <title>Shapes</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var rect = new Shape.Rectangle({ var rect = new Shape.Rectangle({
point: [200, 100], point: [200, 100],

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Symbols</title> <title>Symbols</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var ellipse = new Path.Ellipse({ var ellipse = new Path.Ellipse({
from: [0, 0], from: [0, 0],

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Text Testing</title> <title>Text Testing</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var text = new PointText(new Point(50, 100)); var text = new PointText(new Point(50, 100));
text.fillColor = 'black'; text.fillColor = 'black';

File diff suppressed because one or more lines are too long

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Transform Testing</title> <title>Transform Testing</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
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';

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Rectangle Testing</title> <title>Rectangle Testing</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
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 = {

View file

@ -3,7 +3,7 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Arcs Testing</title> <title>Arcs Testing</title>
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
project.importSVG(document.getElementById('svg')); project.importSVG(document.getElementById('svg'));
</script> </script>

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Butterfly</title> <title>Butterfly</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var start = Date.now(); var start = Date.now();
project.importSVG(document.getElementById('svg')); project.importSVG(document.getElementById('svg'));

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Circle and Ellipse Testing</title> <title>Circle and Ellipse Testing</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
project.importSVG(document.getElementById('svg')); project.importSVG(document.getElementById('svg'));
</script> </script>

View file

@ -3,7 +3,7 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Clipping</title> <title>Clipping</title>
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
project.importSVG(document.getElementById('Layer_1')); project.importSVG(document.getElementById('Layer_1'));
</script> </script>

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Import From File</title> <title>Import From File</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var file = document.getElementById('file'); var file = document.getElementById('file');
file.addEventListener('change', function (event) { file.addEventListener('change', function (event) {

View file

@ -0,0 +1,138 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Gradients</title>
<script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas">
project.importSVG(document.getElementById('svg'));
</script>
</head>
<body>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
version="1.1"
width="210mm"
height="297mm"
id="svg">
<defs
id="defs1903">
<linearGradient
id="linearGradient3794">
<stop
id="stop3796"
style="stop-color:#ff5555;stop-opacity:1"
offset="0" />
<stop
id="stop3808"
style="stop-color:#522ba8;stop-opacity:1"
offset="0.18868095" />
<stop
id="stop3802"
style="stop-color:#ff00ff;stop-opacity:1"
offset="0.38376093" />
<stop
id="stop3804"
style="stop-color:#ff6600;stop-opacity:1"
offset="0.57983696" />
<stop
id="stop3806"
style="stop-color:#28170b;stop-opacity:1"
offset="0.80833077" />
<stop
id="stop3798"
style="stop-color:#ff5555;stop-opacity:0"
offset="1" />
</linearGradient>
<linearGradient
id="linearGradient3770">
<stop
id="stop3772"
style="stop-color:#d1ab00;stop-opacity:1"
offset="0" />
<stop
id="stop3788"
style="stop-color:#502d16;stop-opacity:1"
offset="0.0625" />
<stop
id="stop3786"
style="stop-color:#ff5555;stop-opacity:1"
offset="0.125" />
<stop
id="stop3784"
style="stop-color:#00ff00;stop-opacity:1"
offset="0.54704088" />
<stop
id="stop3782"
style="stop-color:#ffff00;stop-opacity:1"
offset="0.79772007" />
<stop
id="stop3774"
style="stop-color:#2b1100;stop-opacity:1"
offset="1" />
</linearGradient>
<linearGradient
id="linearGradient3760">
<stop
id="stop3762"
style="stop-color:#ff6600;stop-opacity:1"
offset="0" />
<stop
id="stop3764"
style="stop-color:#2b1100;stop-opacity:1"
offset="1" />
</linearGradient>
<linearGradient
x1="443.22928"
y1="215.30028"
x2="867.58954"
y2="229.58598"
id="linearGradient3768"
xlink:href="#linearGradient3760"
gradientUnits="userSpaceOnUse" />
<linearGradient
x1="443.22928"
y1="215.30028"
x2="867.58954"
y2="229.58598"
id="linearGradient3776"
xlink:href="#linearGradient3770"
gradientUnits="userSpaceOnUse" />
<linearGradient
x1="454.28571"
y1="-7.6378121"
x2="591.42859"
y2="480.93362"
id="linearGradient3800"
xlink:href="#linearGradient3794"
gradientUnits="userSpaceOnUse" />
</defs>
<metadata
id="metadata1906">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
id="layer1">
<path
d="m 325.71425,440.93359 -24.52516,-67.66103 -63.02035,-34.75536 5.11537,-71.78671 -43.43569,-57.38329 33.87141,-63.49982 -16.34058,-70.089121 56.77078,-44.233226 13.57994,-70.675915 69.85396,-17.318309 41.15239,-59.042199 70.85875,12.5911 61.6092,-37.19955 59.61144,40.3234 71.41322,-8.92476 38.05675,61.08341 68.86926,20.893202 9.92171,71.281547 54.41716,47.098539 -19.92888,69.154452 30.55585,65.16011 -46.33359,55.06994 1.41115,71.9549 -64.7268,31.46332 -27.97755,66.30805 -71.92816,2.4164 -52.52867,49.19593 -66.69248,-27.04832 -67.99711,23.57737 -49.92508,-51.83614 z"
transform="translate(-125.71429,194.28571)"
id="path3792"
style="fill:url(#linearGradient3800);fill-opacity:1" />
</g>
</svg>
<canvas id="canvas" width="300" height="600"></canvas>
</body>
</html>

View file

@ -3,7 +3,7 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Gradients</title> <title>Gradients</title>
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
project.importSVG(document.getElementById('svg')); project.importSVG(document.getElementById('svg'));
</script> </script>

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Inkscape</title> <title>Inkscape</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var start = Date.now(); var start = Date.now();
project.importSVG(document.getElementById('svg2')); project.importSVG(document.getElementById('svg2'));

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Line Testing</title> <title>Line Testing</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
project.importSVG(document.getElementById('svg')); project.importSVG(document.getElementById('svg'));
</script> </script>

View file

@ -3,7 +3,7 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Gradients</title> <title>Gradients</title>
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
project.importSVG(document.getElementById('Layer_1')); project.importSVG(document.getElementById('Layer_1'));
</script> </script>

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Multiple Paths Test</title> <title>Multiple Paths Test</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
project.importSVG(document.getElementById('svg')); project.importSVG(document.getElementById('svg'));
</script> </script>

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Multiple Paths Test 2</title> <title>Multiple Paths Test 2</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
project.importSVG(document.getElementById('svg')); project.importSVG(document.getElementById('svg'));
</script> </script>

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Nested Groups Test</title> <title>Nested Groups Test</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
project.importSVG(document.getElementById('svg')); project.importSVG(document.getElementById('svg'));
</script> </script>

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Rect Testing</title> <title>Rect Testing</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
project.importSVG(document.getElementById('svg')); project.importSVG(document.getElementById('svg'));
</script> </script>

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Rect Testing</title> <title>Rect Testing</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var group = project.importSVG(document.getElementById('svg')); var group = project.importSVG(document.getElementById('svg'));
console.log(JSON.stringify(group.children[0].data)); console.log(JSON.stringify(group.children[0].data));

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Multiple Paths Test 2</title> <title>Multiple Paths Test 2</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
project.importSVG(document.getElementById('svg')); project.importSVG(document.getElementById('svg'));
</script> </script>

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Stroke Bounds</title> <title>Stroke Bounds</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
project.importSVG(document.getElementById('svg')); project.importSVG(document.getElementById('svg'));
</script> </script>

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Text Testing</title> <title>Text Testing</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
project.importSVG(document.getElementById('svg')); project.importSVG(document.getElementById('svg'));
</script> </script>

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Tiger</title> <title>Tiger</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var start = Date.now(); var start = Date.now();
project.importSVG(document.getElementById('svg')); project.importSVG(document.getElementById('svg'));

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Transform Testing</title> <title>Transform Testing</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
project.importSVG(document.getElementById('svg')); project.importSVG(document.getElementById('svg'));
</script> </script>

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Viewbox 1</title> <title>Viewbox 1</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
project.importSVG(document.getElementById('svg')); project.importSVG(document.getElementById('svg'));
</script> </script>

View file

@ -0,0 +1,124 @@
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
version="1.1"
width="210mm"
height="297mm"
id="svg1901">
<defs
id="defs1903">
<linearGradient
id="linearGradient3794">
<stop
id="stop3796"
style="stop-color:#ff5555;stop-opacity:1"
offset="0" />
<stop
id="stop3808"
style="stop-color:#522ba8;stop-opacity:1"
offset="0.18868095" />
<stop
id="stop3802"
style="stop-color:#ff00ff;stop-opacity:1"
offset="0.38376093" />
<stop
id="stop3804"
style="stop-color:#ff6600;stop-opacity:1"
offset="0.57983696" />
<stop
id="stop3806"
style="stop-color:#28170b;stop-opacity:1"
offset="0.80833077" />
<stop
id="stop3798"
style="stop-color:#ff5555;stop-opacity:0"
offset="1" />
</linearGradient>
<linearGradient
id="linearGradient3770">
<stop
id="stop3772"
style="stop-color:#d1ab00;stop-opacity:1"
offset="0" />
<stop
id="stop3788"
style="stop-color:#502d16;stop-opacity:1"
offset="0.0625" />
<stop
id="stop3786"
style="stop-color:#ff5555;stop-opacity:1"
offset="0.125" />
<stop
id="stop3784"
style="stop-color:#00ff00;stop-opacity:1"
offset="0.54704088" />
<stop
id="stop3782"
style="stop-color:#ffff00;stop-opacity:1"
offset="0.79772007" />
<stop
id="stop3774"
style="stop-color:#2b1100;stop-opacity:1"
offset="1" />
</linearGradient>
<linearGradient
id="linearGradient3760">
<stop
id="stop3762"
style="stop-color:#ff6600;stop-opacity:1"
offset="0" />
<stop
id="stop3764"
style="stop-color:#2b1100;stop-opacity:1"
offset="1" />
</linearGradient>
<linearGradient
x1="443.22928"
y1="215.30028"
x2="867.58954"
y2="229.58598"
id="linearGradient3768"
xlink:href="#linearGradient3760"
gradientUnits="userSpaceOnUse" />
<linearGradient
x1="443.22928"
y1="215.30028"
x2="867.58954"
y2="229.58598"
id="linearGradient3776"
xlink:href="#linearGradient3770"
gradientUnits="userSpaceOnUse" />
<linearGradient
x1="454.28571"
y1="-7.6378121"
x2="591.42859"
y2="480.93362"
id="linearGradient3800"
xlink:href="#linearGradient3794"
gradientUnits="userSpaceOnUse" />
</defs>
<metadata
id="metadata1906">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
id="layer1">
<path
d="m 325.71425,440.93359 -24.52516,-67.66103 -63.02035,-34.75536 5.11537,-71.78671 -43.43569,-57.38329 33.87141,-63.49982 -16.34058,-70.089121 56.77078,-44.233226 13.57994,-70.675915 69.85396,-17.318309 41.15239,-59.042199 70.85875,12.5911 61.6092,-37.19955 59.61144,40.3234 71.41322,-8.92476 38.05675,61.08341 68.86926,20.893202 9.92171,71.281547 54.41716,47.098539 -19.92888,69.154452 30.55585,65.16011 -46.33359,55.06994 1.41115,71.9549 -64.7268,31.46332 -27.97755,66.30805 -71.92816,2.4164 -52.52867,49.19593 -66.69248,-27.04832 -67.99711,23.57737 -49.92508,-51.83614 z"
transform="translate(-125.71429,194.28571)"
id="path3792"
style="fill:url(#linearGradient3800);fill-opacity:1" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 3.8 KiB

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Arcs</title> <title>Arcs</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var values = { var values = {
points: 20, points: 20,

View file

@ -3,7 +3,7 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>BlendModes</title> <title>BlendModes</title>
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var stops = []; var stops = [];
for (var i = 0; i < 6; i++) for (var i = 0; i < 6; i++)

View file

@ -3,7 +3,7 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>Boolean Study</title> <title>Boolean Study</title>
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/javascript"> <script type="text/javascript">
paper.install(window); paper.install(window);

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Compound Path</title> <title>Compound Path</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
project.currentStyle.fillColor = 'black'; project.currentStyle.fillColor = 'black';
var path1 = new Path.Rectangle([200, 200], [100, 100]); var path1 = new Path.Rectangle([200, 200], [100, 100]);

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Curve Time Parameterization</title> <title>Curve Time Parameterization</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var path = new Path(); var path = new Path();
path.moveTo(200, 200); path.moveTo(200, 200);

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>HslColor</title> <title>HslColor</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var steps = { var steps = {
hue: 100, hue: 100,

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Path Structure</title> <title>Path Structure</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var y = view.size.height / 2; var y = view.size.height / 2;
var width = view.size.width; var width = view.size.width;

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Resize</title> <title>Resize</title>
<link rel="stylesheet" href="../css/style.css"> <link rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../../dist/paper.js"></script> <script type="text/javascript" src="../../dist/paper-full.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var redPath = new Path.Circle({ var redPath = new Path.Circle({
center: view.center, center: view.center,

Some files were not shown because too many files have changed in this diff Show more