From ace2e3e13bdb00fb60a655e7fb2249733d5d3c86 Mon Sep 17 00:00:00 2001
From: Jonathan Puckey <me@jonathanpuckey.com>
Date: Sat, 9 Mar 2013 16:02:11 +0100
Subject: [PATCH] Improve several examples.

---
 examples/Scripts/Resize.html         | 22 +++++++++++++++-------
 examples/Scripts/RoundRectangle.html | 11 +++++++----
 examples/Tools/Circles.html          | 18 ++++++++----------
 examples/Tools/DrippingBrush.html    |  5 +++--
 4 files changed, 33 insertions(+), 23 deletions(-)

diff --git a/examples/Scripts/Resize.html b/examples/Scripts/Resize.html
index 705adc96..2ba898d7 100644
--- a/examples/Scripts/Resize.html
+++ b/examples/Scripts/Resize.html
@@ -6,15 +6,23 @@
 	<link rel="stylesheet" href="../css/style.css">
 	<script type="text/javascript" src="../../dist/paper.js"></script>
 	<script type="text/paperscript" canvas="canvas">
-		var redPath = new Path.Circle(view.center, 10);
-		redPath.fillColor = 'red';
+		var redPath = new Path.Circle({
+			center: view.center,
+			radius: 5,
+			fillColor: 'red'
+		});
 
-		var whitePath = new Path.Circle(view.center, 10);
-		whitePath.fillColor = 'white';
+		var whitePath = new Path.Circle({
+			center: view.center,
+			radius: 5,
+			fillColor: 'white'
+		});
 
-		var text = new PointText();
-		text.content = 'Resize your window';
-		text.justification = 'center';
+		var text = new PointText({
+			content: 'Resize your window',
+			justification: 'center',
+			point: view.center
+		});
 		
 		function onResize(event) {
 			// Resize the red circle to fill the bounds of the view:
diff --git a/examples/Scripts/RoundRectangle.html b/examples/Scripts/RoundRectangle.html
index 64ccedda..d4a40748 100644
--- a/examples/Scripts/RoundRectangle.html
+++ b/examples/Scripts/RoundRectangle.html
@@ -7,14 +7,17 @@
 	<script type="text/javascript" src="../../dist/paper.js"></script>
 	<script type="text/paperscript" canvas="canvas">
 		var path;
-		var rect = new Rectangle([150, 150], [300, 300]);
-		project.currentStyle.fillColor = 'black';
 
 		function onFrame(event) {
 			if (path)
 				path.remove();
-			var size = Math.abs(Math.sin(event.count / 40)) * 150 + 10;
-			path = new Path.RoundRectangle(rect, size);
+			path = new Path.RoundRectangle({
+				radius: Math.abs(Math.sin(event.count / 40)) * 150 + 10,
+				rectangle: {
+					size: [300, 300]
+				},
+				fillColor: 'black'
+			});
 			path.position = view.center;
 		}
 	</script>
diff --git a/examples/Tools/Circles.html b/examples/Tools/Circles.html
index 8a6f9241..55916418 100644
--- a/examples/Tools/Circles.html
+++ b/examples/Tools/Circles.html
@@ -6,20 +6,18 @@
 	<link rel="stylesheet" href="../css/style.css">
 	<script type="text/javascript" src="../../dist/paper.js"></script>
 	<script type="text/paperscript" canvas="canvas">
-			// All newly created items will receive
-			// these style properties:
-			project.currentStyle = {
-				fillColor: 'white',
-				strokeColor: 'black'
-			};
-
-			var path;
 			function onMouseDrag(event) {
 				// The radius is the distance between the position
 				// where the user clicked and the current position
 				// of the mouse.
-				var radius = (event.downPoint - event.point).length;
-				path = new Path.Circle(event.downPoint, radius);
+				var path = new Path.Circle({
+					center: event.downPoint,
+					radius: (event.downPoint - event.point).length,
+					fillColor: 'white',
+					strokeColor: 'black'
+				});
+
+				// Remove this path on the next drag event:
 				path.removeOnDrag();
 			};
 	</script>
diff --git a/examples/Tools/DrippingBrush.html b/examples/Tools/DrippingBrush.html
index 305d646e..69abe615 100644
--- a/examples/Tools/DrippingBrush.html
+++ b/examples/Tools/DrippingBrush.html
@@ -14,8 +14,9 @@
 			if (event.delta.length > minSize) {
 				// If there is no path, make one:
 				if (!path) {
-					path = new Path();
-					path.fillColor = 'black';
+					path = new Path({
+						fillColor: 'black'
+					});
 					path.add(event.lastPoint);
 				}