scratchfoundation/paper.js
1
0
Fork 0
mirror of https://github.com/scratchfoundation/paper.js.git synced 2025-01-03 19:45:44 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions

RoundedRectangles: use onFrameLoop and other small changes.

Browse source
This commit is contained in:
Jonathan Puckey 2011-04-18 17:48:48 +02:00
parent 114c058fc6
commit d67953c1da
1 changed files with 9 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
examples/Animated/RoundedRectangles.html
View file

@ -7,10 +7,9 @@
<script type="text/javascript" src="../../src/load.js"></script> <script type="text/javascript" src="../../src/load.js"></script>
<script type="text/paperscript" canvas="canvas"> <script type="text/paperscript" canvas="canvas">
var mousePoint = document.bounds.center; var mousePoint = document.bounds.center;
var amount = 25; var amount = 25;
var colors = ['red', 'white', 'blue', 'white']; var colors = ['red', 'white', 'blue', 'white'];
for (var i = 0; i < amount; i++) { for (var i = 0; i < amount; i++) {
var rect = new Rectangle([0, 0], [25, 25]); var rect = new Rectangle([0, 0], [25, 25]);
rect.center = mousePoint; rect.center = mousePoint;
@ -20,27 +19,27 @@
path.scale(scale); path.scale(scale);
new PlacedSymbol(path); new PlacedSymbol(path);
} }
// setInterval(draw, 30);
function onMouseDown(event) {
mousePoint = event.point;
}
function onMouseDrag(event) { function onMouseDrag(event) {
mousePoint = event.point; mousePoint = event.point;
} }
var children = document.activeLayer.children; var children = document.activeLayer.children;
var count = 0; var count = 0;
function draw() { function onFrameLoop() {
count++; count++;
for (var i = 0, l = children.length; i < l; i++) { for (var i = 0, l = children.length; i < l; i++) {
var item = children[i]; var item = children[i];
var delta = (mousePoint - item.position) / (i + 1); var delta = (mousePoint - item.position) / (i + 5);
item.rotate(Math.sin((count + i) / 10) * 7); item.rotate(Math.sin((count + i) / 10) * 7);
if (delta.length > 0.1) if (delta.length > 0.1)
item.translate(delta); item.translate(delta);
} }
document.redraw();
Event.requestAnimationFrame(draw, document.canvas);
} }
Event.requestAnimationFrame(draw, document.canvas);
</script> </script>
</head> </head>
<body> <body>