|
4 | 4 | <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> |
5 | 5 | <title>Example</title> |
6 | 6 | <script type="text/javascript" src="../../lib/bootstrap.js"></script> |
| 7 | + <script type="text/javascript" src="../../lib/parse-js.js"></script> |
7 | 8 | <script type="text/javascript" src="../../src/Paper.js"></script> |
8 | 9 | <script type="text/javascript" src="../../src/tool/ToolEvent.js"></script> |
9 | 10 | <script type="text/javascript" src="../../src/tool/ToolHandler.js"></script> |
|
32 | 33 | <script type="text/javascript" src="../../src/color/GradientColor.js"></script> |
33 | 34 | <script type="text/javascript" src="../../src/color/Gradient.js"></script> |
34 | 35 | <script type="text/javascript" src="../../src/color/GradientStop.js"></script> |
35 | | - <script> |
36 | | - window.onload = function() { |
37 | | - var canvas = document.getElementById('canvas'); |
38 | | - var doc = new Document(canvas); |
39 | | - |
40 | | - var values = { |
41 | | - lines: 5, |
42 | | - size: 40, |
43 | | - smooth: true |
44 | | - }; |
| 36 | + <script type="text/javascript" src="../../src/util/PaperScript.js"></script> |
| 37 | + <script type="text/paperscript" canvas="canvas"> |
| 38 | + tool.fixedDistance = 30; |
45 | 39 |
|
46 | | - var paths; |
47 | | - var tool = new Tool({ |
48 | | - onMouseDown: function(event) { |
49 | | - paths = []; |
50 | | - for (var i = 0; i < values.lines; i++) { |
51 | | - var path = new Path(); |
52 | | - path.strokeColor = '#000000'; |
53 | | - paths.push(path); |
54 | | - } |
55 | | - }, |
| 40 | + var values = { |
| 41 | + lines: 5, |
| 42 | + size: 40, |
| 43 | + smooth: true |
| 44 | + }; |
56 | 45 |
|
57 | | - onMouseDrag: function(event) { |
58 | | - var offset = event.delta; |
59 | | - offset.angle = offset.angle + 90; |
60 | | - var lineSize = values.size / values.lines; |
61 | | - for (var i = 0; i < values.lines; i++) { |
62 | | - var path = paths[values.lines - 1 - i]; |
63 | | - offset.length = lineSize * i + lineSize / 2; |
64 | | - path.add(event.middlePoint.add(offset)); |
65 | | - path.smooth(); |
66 | | - } |
67 | | - } |
68 | | - }); |
69 | | - tool.fixedDistance = 30; |
| 46 | + var paths; |
| 47 | + |
| 48 | + function onMouseDown(event) { |
| 49 | + paths = []; |
| 50 | + for (var i = 0; i < values.lines; i++) { |
| 51 | + var path = new Path(); |
| 52 | + path.strokeColor = '#000000'; |
| 53 | + paths.push(path); |
| 54 | + } |
| 55 | + } |
| 56 | + |
| 57 | + function onMouseDrag(event) { |
| 58 | + var offset = event.delta; |
| 59 | + offset.angle = offset.angle + 90; |
| 60 | + var lineSize = values.size / values.lines; |
| 61 | + for (var i = 0; i < values.lines; i++) { |
| 62 | + var path = paths[values.lines - 1 - i]; |
| 63 | + offset.length = lineSize * i + lineSize / 2; |
| 64 | + path.add(event.middlePoint + offset); |
| 65 | + path.smooth(); |
| 66 | + } |
70 | 67 | } |
71 | 68 | </script> |
72 | 69 | </head> |
|
0 commit comments