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

Clean up examples HTML.

Browse source
This commit is contained in:
Jürg Lehni 2013-02-12 15:08:48 -08:00
parent 8b4dda2fc9
commit 42274bff4c
27 changed files with 66 additions and 66 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
examples/JSON/Gradients.html
View file

@ -20,7 +20,7 @@
Base.fromJson(window._json);
</script>
</head>
<body>
<body>
<canvas id="canvas1" width="500" height="500"></canvas>
<canvas id="canvas2" width="500" height="500"></canvas>
</body>

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

@ -24,8 +24,8 @@
document.getElementById('svg').appendChild(project.exportSvg());
</script>
</head>
<body>
<canvas id="canvas" width="500px" height="500px"></canvas>
<svg id="svg" style="width: 500px; height: 500px"></svg>
<body>
<canvas id="canvas" width="500" height="500"></canvas>
<svg id="svg" width="500" height="500"></svg>
</body>
</html>

6
examples/SVG Export/Compound Path.html
View file

@ -14,8 +14,8 @@
document.getElementById('svg').appendChild(project.exportSvg());
</script>
</head>
<body>
<canvas id="canvas" width="500px" height="500px"></canvas>
<svg id="svg" style="width: 500px; height: 500px"></svg>
<body>
<canvas id="canvas" width="500" height="500"></canvas>
<svg id="svg" width="500" height="500"></svg>
</body>
</html>

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

@ -20,8 +20,8 @@
document.getElementById('svg').appendChild(project.exportSvg());
</script>
</head>
<body>
<canvas id="canvas" width="500px" height="500px"></canvas>
<svg id="svg" style="width: 500px; height: 500px"></svg>
<body>
<canvas id="canvas" width="500" height="500"></canvas>
<svg id="svg" width="500" height="500"></svg>
</body>
</html>

4
examples/SVG Export/Gradients.html
View file

@ -16,8 +16,8 @@
document.getElementById('svg').appendChild(project.exportSvg());
</script>
</head>
<body>
<body>
<canvas id="canvas" width="500" height="500"></canvas>
<svg id="svg" style="width: 500px; height: 500px"></svg>
<svg id="svg" width="500" height="500"></svg>
</body>
</html>

6
examples/SVG Export/Group Transform.html
View file

@ -17,8 +17,8 @@
document.getElementById('svg').appendChild(project.exportSvg());
</script>
</head>
<body>
<canvas id="canvas" width="500px" height="500px"></canvas>
<svg id="svg" style="width: 500px; height: 500px"></svg>
<body>
<canvas id="canvas" width="500" height="500"></canvas>
<svg id="svg" width="500" height="500"></svg>
</body>
</html>

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

@ -33,8 +33,8 @@
document.getElementById('svg').appendChild(project.exportSvg());
</script>
</head>
<body>
<canvas id="canvas" width="500px" height="500px"></canvas>
<svg id="svg" style="width: 500px; height: 500px"></svg>
<body>
<canvas id="canvas" width="500" height="500"></canvas>
<svg id="svg" width="500" height="500"></svg>
</body>
</html>

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

@ -31,8 +31,8 @@
document.getElementById('svg').appendChild(project.exportSvg());
</script>
</head>
<body>
<canvas id="canvas" width="500px" height="500px"></canvas>
<svg id="svg" style="width: 500px; height: 500px"></svg>
<body>
<canvas id="canvas" width="500" height="500"></canvas>
<svg id="svg" width="500" height="500"></svg>
</body>
</html>

4
examples/SVG Export/Raster.html
View file

File diff suppressed because one or more lines are too long

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

@ -45,8 +45,8 @@
document.getElementById('svg').appendChild(project.exportSvg());
</script>
</head>
<body>
<canvas id="canvas" width="500px" height="500px"></canvas>
<svg id="svg" style="width: 500px; height: 500px"></svg>
<body>
<canvas id="canvas" width="500" height="500"></canvas>
<svg id="svg" width="500" height="500"></svg>
</body>
</html>

4
examples/SVG Export/Rotated Primitives.html
View file

@ -33,8 +33,8 @@
document.getElementById('svg').appendChild(project.exportSvg());
</script>
</head>
<body>
<body>
<canvas id="canvas" width="500" height="500"></canvas>
<svg id="svg" style="width: 500px; height: 500px"></svg>
<svg id="svg" width="500" height="500"></svg>
</body>
</html>

4
examples/SVG Export/Symbols.html
View file

@ -19,8 +19,8 @@
document.getElementById('svg').appendChild(project.exportSvg());
</script>
</head>
<body>
<body>
<canvas id="canvas" width="500" height="500"></canvas>
<svg id="svg" style="width: 500px; height: 500px"></svg>
<svg id="svg" width="500" height="500"></svg>
</body>
</html>

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

@ -37,8 +37,8 @@
document.getElementById('svg').appendChild(project.exportSvg());
</script>
</head>
<body>
<body>
<canvas id="canvas" width="500" height="500"></canvas>
<svg id="svg" style="width: 500px; height: 500px"></svg>
<svg id="svg" width="500" height="500"></svg>
</body>
</html>

4
examples/SVG Export/Tiger.html
View file

@ -15,8 +15,8 @@
console.log('Export SVG', Date.now() - start);
</script>
</head>
<body>
<body>
<canvas id="canvas" width="500" height="500"></canvas>
<svg id="svg" style="width: 500px; height: 500px"></svg>
<svg id="svg" width="500" height="500"></svg>
</body>
</html>

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

@ -21,8 +21,8 @@
document.getElementById('svg').appendChild(project.exportSvg());
</script>
</head>
<body>
<canvas id="canvas" width="500px" height="500px"></canvas>
<svg id="svg" style="width: 500px; height: 500px"></svg>
<body>
<canvas id="canvas" width="500" height="500"></canvas>
<svg id="svg" width="500" height="500"></svg>
</body>
</html>

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

@ -19,8 +19,8 @@
document.getElementById('svg').appendChild(project.exportSvg());
</script>
</head>
<body>
<canvas id="canvas" width="500px" height="500px"></canvas>
<svg id="svg" style="width: 500px; height: 500px"></svg>
<body>
<canvas id="canvas" width="500" height="500"></canvas>
<svg id="svg" width="500" height="500"></svg>
</body>
</html>

6
examples/SVG Import/Circle and Ellipse Testing.html
View file

@ -9,8 +9,8 @@
project.importSvg(document.getElementById('svg'));
</script>
</head>
<body>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" style="width:500px; height:1000px;" id="svg">
<body>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="500" height="1000" id="svg">
<circle cx="40" cy="300" r="20" style="fill:orange;stroke:yellow;stroke-width:2px;stroke-dasharray:3px" id="circle1" />
<circle cx="60" cy="350" r="30" style="fill:red;stroke:black;stroke-width:5" id="circle2" />
<circle cx="160" cy="400" r="60" style="fill:blue;" id="circle3" />
@ -21,6 +21,6 @@
<ellipse cx="220" cy="175" rx="190" ry="20" style="fill:white" id="ellipse5"/>
<ellipse cx="300" cy="255" rx="100" ry="50" style="fill:yellow;stroke:purple;stroke-width:2" id="ellipse6"/>
</svg>
<canvas id="canvas" width="500px" height="1000px"></canvas>
<canvas id="canvas" width="500" height="1000px"></canvas>
</body>
</html>

4
examples/SVG Import/Gradients.html
View file

@ -10,7 +10,7 @@
</head>
<body>
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="500px" height="1000px" enable-background="new 0 0 595.28 841.89" xml:space="preserve">
width="500" height="1000px" enable-background="new 0 0 595.28 841.89" xml:space="preserve">
<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="69" y1="239.5" x2="530" y2="239.5">
<stop offset="0" style="stop-color:#231F20"/>
<stop offset="0.0896" style="stop-color:#231F20;stop-opacity:0.9104"/>
@ -102,6 +102,6 @@
</radialGradient>
<circle fill="url(#SVGID_7_)" cx="368.75" cy="619.551" r="92.2"/>
</svg>
<canvas id="canvas" width="500px" height="1000px"></canvas>
<canvas id="canvas" width="500" height="1000px"></canvas>
</body>
</html>

6
examples/SVG Import/Line Testing.html
View file

@ -9,8 +9,8 @@
project.importSvg(document.getElementById('svg'));
</script>
</head>
<body>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" style="width:500px; height:1000px;" id="svg">
<body>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="500" height="1000" id="svg">
<line x1="4" y1="20" x2="200" y2="200" style="stroke:red;stroke-width:10px;stroke-dasharray: 10px, 4px;stroke-linecap: "butt" id="line1" />
<line x1="100" y1="40" x2="250" y2="250" style="stroke:green;stroke-width:5px;stroke-dasharray: 5px,3px,2px;stroke-linecap: "round" id="line2" />
<line x1="50" y1="100" x2="200" y2="200" style="stroke:blue;stroke-width:9px;stroke-dasharray: 1px;stroke-linecap: "square" id="line3" />
@ -19,6 +19,6 @@
<line x1="20" y1="344" x2="50" y2="400" style="stroke:yellow;stroke-width:30px;stroke-dasharray: 5px;stroke-linecap: "square" id="line6" />
<line x1="4" y1="400" x2="450" y2="450" style="stroke:purple;stroke-width:1px;stroke-dasharray: 11px, 4px;stroke-linecap: "butt" id="line7" />
</svg>
<canvas id="canvas" width="500px" height="1000px"></canvas>
<canvas id="canvas" width="500" height="1000px"></canvas>
</body>
</html>

4
examples/SVG Import/Multiple Paths Test 1.html
View file

@ -10,7 +10,7 @@
</script>
</head>
<body>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" style="width:500px; height:1000px;" id="svg">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="500" height="1000" id="svg">
<g>
<circle cx="100" cy="400" r="100" style="fill:darkred;" id="circle" />
<g>
@ -37,6 +37,6 @@
<path d="M 50 75 c 25 -50 25 -50 100 0 s 100 100 100 0 s 25 -50 100 0" stroke="blue" stroke-width="4px" fill="none"/>
<text x="20" y="15" stroke="green" fill="green" style="font:15px arial;" id="text" text-anchor="start">I love SVG</text>
</svg>
<canvas id="canvas" width="500px" height="1000px"></canvas>
<canvas id="canvas" width="500" height="1000px"></canvas>
</body>
</html>

6
examples/SVG Import/Multiple Paths Test 2.html
View file

@ -9,8 +9,8 @@
project.importSvg(document.getElementById('svg'));
</script>
</head>
<body>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" style="width:500px; height:1000px;" id="svg">
<body>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="500" height="1000" id="svg">
<path id="lineAB" d="M 100 350 l 150 -300" stroke="red" stroke-width="3px" fill="none" />
<path id="lineBC" d="M 250 50 l 150 300" stroke="red" stroke-width="3px" fill="none" />
<path id="lineBC" d="M 175 200 l 150 0" stroke="red" stroke-width="3px" fill="none" />
@ -28,6 +28,6 @@
<text font-size="30" font-family="times" x="400" y="350" dx="30">C</text>
</g>
</svg>
<canvas id="canvas" width="500px" height="1000px"></canvas>
<canvas id="canvas" width="500" height="1000px"></canvas>
</body>
</html>

6
examples/SVG Import/Nested Groups Test.html
View file

@ -9,8 +9,8 @@
project.importSvg(document.getElementById('svg'));
</script>
</head>
<body>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" style="width:500px; height:1000px;" id="svg">
<body>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="500" height="1000" id="svg">
<g>
<circle cx="25" cy="25" r="20" style="fill:orange;" id="circle" />
<g>
@ -73,6 +73,6 @@
</g>
</svg>
<canvas id="canvas" width="500px" height="1000px"></canvas>
<canvas id="canvas" width="500" height="1000px"></canvas>
</body>
</html>

6
examples/SVG Import/Rect Testing.html
View file

@ -9,8 +9,8 @@
project.importSvg(document.getElementById('svg'));
</script>
</head>
<body>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" style="width:500px; height:1000px;" id="svg">
<body>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="500" height="1000" id="svg">
<rect rx="20" ry="10" width="50px" height="50px" style="fill:green; stroke:black; stroke-width:5px" id="round1" />
<rect x="100" y="10" rx="20" ry="10" width="75px" height="75px" style="fill:red; stroke: brown; stroke-width:1px; fill-opacity:.5; stroke-opacity:.9" id="round2" />
<rect x="10" y="300" rx="20" ry="10" width="75px" height="150px" style="fill:blue; opacity:.5" id="round3" />
@ -19,6 +19,6 @@
<rect x="300" y="300" width="100" height="100px" fill="pink" style="stroke-dasharray: 10, 4; stroke-width:50px;" id="rect2" />
<rect x="300" y="180" width="178" height="100px" fill="hotpink" style="stroke-dasharray: 10, 4; stroke-width:10px;" id="rect3" />
</svg>
<canvas id="canvas" width="500px" height="1000px"></canvas>
<canvas id="canvas" width="500" height="1000px"></canvas>
</body>
</html>

2
examples/SVG Import/Symbols.html
View file

@ -9,7 +9,7 @@
project.importSvg(document.getElementById('svg'));
</script>
</head>
<body>
<body>
<svg version="1.1" id="svg" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="595px" height="841px" viewBox="0 0 595.28 841.89" enable-background="new 0 0 595.28 841.89" xml:space="preserve">
<symbol id="circle" viewBox="-24 -24 48 48">

4
examples/SVG Import/Testing.html
View file

@ -9,8 +9,8 @@
project.importSvg(document.getElementById('svg'));
</script>
</head>
<body>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" style="width:500; height:1000px;" id="svg">
<body>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="500" height="1000" id="svg">
<g>
<line x1="4" y1="20" x2="200" y2="200" style="stroke:red;stroke-width:10;stroke-dasharray: 10, 4;stroke-linecap: butt" id="line" />
<rect x="200" y="20" rx="20" ry="10" width="150" height="150" style="fill:green" id="round" />

2
examples/SVG Import/Text Testing.html
View file

@ -10,7 +10,7 @@
</script>
</head>
<body>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" style="width:500px; height:1000px;" id="svg">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="500" height="1000" id="svg">
<text x="20" y="15" stroke="green" fill="green" style="font:15px arial;" id="text">Plain SVG Text</text>
<text x="20" y="50" fill="red" transform="rotate(30 20,40)" style="font:12px helvetica;">Rotated SVG Text</text>
</svg>

6
examples/SVG Import/Transform Testing.html
View file

@ -9,14 +9,14 @@
project.importSvg(document.getElementById('svg'));
</script>
</head>
<body>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" style="width:500px; height:1000px;" id="svg">
<body>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="500" height="1000" id="svg">
<g transform="scale(5) translate(15, 15) rotate(20) skewX(20) skewY(5)" >
<rect x="10" y="10" width="5" height="5" fill="firebrick" />
<circle r="10" fill="seagreen" stroke="blue"/>
<rect x="5" y="5" width="12" height="2" fill="gray" stroke="silver"/>
</g>
</svg>
<canvas id="canvas" width="500px" height="1000px"></canvas>
<canvas id="canvas" width="500" height="1000px"></canvas>
</body>
</html>