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

Closes .
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
README.mdbower.json
build
component.json
dist
examples
Animated
Games
Interface
JSON
Paperjs.org
Rasters
SVG Export
SVG Import
Scripts

View file

@ -24,7 +24,15 @@ With Bower installed, simply type this command in your project folder:
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
@ -142,7 +150,7 @@ And to go back to a built library
cd build
./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

View file

@ -16,7 +16,7 @@
"vector", "graphic", "graphics", "2d", "geometry", "bezier", "curve",
"curves", "path", "paths", "canvas", "svg", "paper", "paper.js"
],
"main": "dist/paper.js",
"main": "dist/paper-full.js",
"ignore": [
"build",
"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 "-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
# 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.
# This script simply copies src/load.js to dist/paper.js and dist/paper-node.js,
# which loads the library from separate sources through PrePro both in the
# browser and in Node.js.
# This script simply creates symbolic links to src/load.js from
# dist/paper-full.js and dist/paper-node.js, which loads the library from
# separate sources through PrePro both in the browser and in Node.js.
if [ -f ../dist/paper.js ]
if [ -f ../dist/paper-full.js ]
then
rm ../dist/paper.js
rm ../dist/paper-full.js
fi
if [ -f ../dist/paper-node.js ]
@ -24,5 +24,5 @@ then
rm ../dist/paper-node.js
fi
cp ../src/load.js ../dist/paper.js
cp ../src/load.js ../dist/paper-node.js
ln -s ../src/load.js ../dist/paper-full.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
# Copy examples over
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
cp -r $BASE/dist/docs .
# Zip the whole thing

View file

@ -8,5 +8,5 @@
"vector", "graphic", "graphics", "2d", "geometry", "bezier", "curve",
"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">
<title>Animated Star</title>
<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">
var layer = project.activeLayer;

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Candy Crash</title>
<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">
// kynd.info 2014

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Extruded</title>
<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">
var lineGroup = new Group();
var lineCount = 100;

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Lines</title>
<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">
var amount = 45;
for (var i = 0; i < amount; i++) {

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Smoothing</title>
<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">
var width, height, center;
var points = 10;

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Space</title>
<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">
// The amount of symbol we want to place;
var count = 150;

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Space</title>
<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">
// The amount of symbol we want to place;
var count = 150;

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<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">
//

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Palette</title>
<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">
var values = {
number: 1,

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Circle Testing</title>
<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">
var topLeft = new Point(200, 200);
var size = new Size(150, 100);

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Compound Path</title>
<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">
project.currentStyle.fillColor = 'black';
var path1 = new Path.Rectangle([200, 200], [100, 100]);

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Empty Path Testing</title>
<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">
var path = new Path();
path.strokeColor = 'black';

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Gradients</title>
<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">
var path = new Path.Circle(view.center, view.bounds.height * 0.4);
path.fillColor = {

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Group Transform</title>
<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">
var circle1 = new Path.Circle(new Point(100, 100), 50);
circle1.fillColor = 'red';

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Line Testing</title>
<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">
var x1 = 5,
x2 = 45,

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Random Path Testing</title>
<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">
var center = new Point(100, 100);
var sides = 3;

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Raster</title>
<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">
var raster = new Raster('lenna'); // new Raster('http://www.lps.usp.br/~hae/apostila/imagens/lenna.jpg');
raster.onLoad = function() {

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Rectangle Testing</title>
<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">
var point1 = new Point(10, 10);
var size1 = new Size(50, 50);

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Rotated Primitives</title>
<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">
// This "arbitrary" shape triggered rectangles in the original code,
// since point2 is as far from point0 as point3 is from point1.

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Symbols</title>
<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">
var path = new Path.Ellipse({
from: [10, 10],

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Symbols</title>
<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">
var ellipse = new Shape.Ellipse({
from: [10, 10],

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Symbols</title>
<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">
var ellipse = new Path.Ellipse({
from: [0, 0],

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Text Testing</title>
<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">
var text = new PointText(new Point(50, 100));
text.fillColor = 'black';

File diff suppressed because one or more lines are too long

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Transform Testing</title>
<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">
var circlePath = new Path.Circle(new Point(280, 100), 25);
circlePath.strokeColor = 'black';

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Rectangle Testing</title>
<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">
var path = new Path.Rectangle(new Point(50, 50), new Size(100, 50));
path.style = {

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Bouncing Balls</title>
<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">
var Ball = function(point, vector) {
if (!vector || vector.isZero()) {

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Chain</title>
<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">
// Adapted from the following Processing example:
// http://processing.org/learning/topics/follow3.html

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Division Raster</title>
<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">
// Based on 'JPEG Raster' by Jonathan Puckey:
// http://www.flickr.com/photos/puckey/3179779686/in/photostream/

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Future Splash</title>
<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">
// Code ported to Paper.js from http://the389.com/9/1/
// with permission.

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Hit Testing</title>
<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">
var values = {
paths: 50,

View file

@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<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">
// Import the tiger svg:
project.importSVG(document.getElementById('svg'));

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Meta Balls</title>
<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">
// Ported from original Metaball script by SATO Hiroyuki
// http://park12.wakwak.com/~shp/lc/et/en_aics_script.html

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Nyan Rainbow</title>
<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/paperscript" canvas="canvas">
// A tribute to Nyan Cat http://www.youtube.com/watch?v=QH2-TGUlwu4

View file

@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<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">
var words = project.importSVG(document.getElementById('svg'));
words.fillColor = null;

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Q*bertify</title>
<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">
// Please note: dragging and dropping images only works for
// certain browsers when serving this script online:

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Radial Rainbows</title>
<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">
var point = view.center;

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Rounded Rectangles</title>
<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">
var mousePoint = view.center;
var amount = 25;

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Erik Liked To Dance</title>
<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">
var leftPath = new Path({
strokeColor: 'red',

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Simplify</title>
<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">
var path;

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Spiral Raster</title>
<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">
// Please note: dragging and dropping images only works for
// certain browsers when serving this script online:

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Tadpoles</title>
<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">
// Adapted from Flocking Processing example by Daniel Schiffman:
// http://processing.org/learning/topics/flocking.html

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Voronoi</title>
<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/paperscript" canvas="canvas">
var voronoi = new Voronoi();

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Phyllotaxis Raster</title>
<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">
// Example inspired by: 'Phyllotactic Spirals' by Ken Frederick
// http://scriptographer.org/scripts/general-scripts/phyllotactic-spirals/

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Raster</title>
<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">
// http://en.wikipedia.org/wiki/Lenna
// Load from Server:

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Rotation Raster</title>
<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">
var raster = new Raster('lenna');
var size = new Size(50, 50);

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Circle Testing</title>
<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">
var topLeft = new Point(200, 200);
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">
<title>Compound Path</title>
<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">
project.currentStyle.fillColor = 'black';
var path1 = new Path.Rectangle([200, 200], [100, 100]);

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Empty Path Testing</title>
<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">
var path = new Path();
path.strokeColor = 'black';

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Gradients</title>
<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">
var stops = [new Color(1, 1, 0, 0), 'red', 'black'];

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Group Transform</title>
<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">
var circle1 = new Path.Circle(new Point(100, 100), 50);
circle1.fillColor = 'red';

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Line Testing</title>
<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">
var x1 = 5,
x2 = 45,

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Random Path Testing</title>
<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">
var center = new Point(100, 100);
var sides = 3;

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Raster</title>
<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">
var raster = new Raster('lenna');
raster.position = view.center;

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Rectangle Testing</title>
<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">
var point1 = new Point(10, 10);
var size1 = new Size(50, 50);

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Rotated Primitives</title>
<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">
// This "arbitrary" shape triggered rectangles in the original code,
// since point2 is as far from point0 as point3 is from point1.

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Shapes</title>
<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">
var rect = new Shape.Rectangle({
point: [200, 100],

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Symbols</title>
<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">
var ellipse = new Path.Ellipse({
from: [0, 0],

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Text Testing</title>
<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">
var text = new PointText(new Point(50, 100));
text.fillColor = 'black';

File diff suppressed because one or more lines are too long

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Transform Testing</title>
<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">
var circlePath = new Path.Circle(new Point(280, 100), 25);
circlePath.strokeColor = 'black';

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Rectangle Testing</title>
<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">
var path = new Path.Rectangle(new Point(50, 50), new Size(100, 50));
path.style = {

View file

@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<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">
project.importSVG(document.getElementById('svg'));
</script>

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Butterfly</title>
<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">
var start = Date.now();
project.importSVG(document.getElementById('svg'));

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Circle and Ellipse Testing</title>
<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">
project.importSVG(document.getElementById('svg'));
</script>

View file

@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<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">
project.importSVG(document.getElementById('Layer_1'));
</script>

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Import From File</title>
<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">
var file = document.getElementById('file');
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>
<meta charset="UTF-8">
<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">
project.importSVG(document.getElementById('svg'));
</script>

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Inkscape</title>
<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">
var start = Date.now();
project.importSVG(document.getElementById('svg2'));

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Line Testing</title>
<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">
project.importSVG(document.getElementById('svg'));
</script>

View file

@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<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">
project.importSVG(document.getElementById('Layer_1'));
</script>

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Multiple Paths Test</title>
<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">
project.importSVG(document.getElementById('svg'));
</script>

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Multiple Paths Test 2</title>
<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">
project.importSVG(document.getElementById('svg'));
</script>

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Nested Groups Test</title>
<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">
project.importSVG(document.getElementById('svg'));
</script>

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Rect Testing</title>
<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">
project.importSVG(document.getElementById('svg'));
</script>

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Rect Testing</title>
<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">
var group = project.importSVG(document.getElementById('svg'));
console.log(JSON.stringify(group.children[0].data));

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Multiple Paths Test 2</title>
<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">
project.importSVG(document.getElementById('svg'));
</script>

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Stroke Bounds</title>
<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">
project.importSVG(document.getElementById('svg'));
</script>

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Text Testing</title>
<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">
project.importSVG(document.getElementById('svg'));
</script>

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Tiger</title>
<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">
var start = Date.now();
project.importSVG(document.getElementById('svg'));

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Transform Testing</title>
<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">
project.importSVG(document.getElementById('svg'));
</script>

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Viewbox 1</title>
<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">
project.importSVG(document.getElementById('svg'));
</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

(image error) Size: 3.8 KiB

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Arcs</title>
<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">
var values = {
points: 20,

View file

@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<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">
var stops = [];
for (var i = 0; i < 6; i++)

View file

@ -3,7 +3,7 @@
<head>
<meta charset="utf-8">
<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">
paper.install(window);

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Compound Path</title>
<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">
project.currentStyle.fillColor = 'black';
var path1 = new Path.Rectangle([200, 200], [100, 100]);

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Curve Time Parameterization</title>
<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">
var path = new Path();
path.moveTo(200, 200);

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>HslColor</title>
<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">
var steps = {
hue: 100,

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Path Structure</title>
<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">
var y = view.size.height / 2;
var width = view.size.width;

View file

@ -4,7 +4,7 @@
<meta charset="UTF-8">
<title>Resize</title>
<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">
var redPath = new Path.Circle({
center: view.center,

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