paper.js/examples/Tools/Circles.html

<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<title>Circles</title>
	<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);
				path.removeOnDrag();
			};
	</script>
</head>
<body>
	<canvas id="canvas" resize></canvas>
</body>
</html>
Update doc-type to HTML5. 2011-02-21 08:31:26 -05:00			`<!DOCTYPE html>`
Add a few mouse tool examples. 2011-02-08 07:16:43 -05:00			`<html>`
			`<head>`
			`<meta http-equiv="Content-Type" content="text/html; charset=utf-8">`
Examples: Added more descriptive titles to each example html page 2011-06-30 09:57:17 -04:00			`<title>Circles</title>`
Make all examples resize to the size of the browser window. 2011-05-05 11:25:17 -04:00			`<link rel="stylesheet" href="../css/style.css">`
Switch from "out" folder for built library to "dist". 2011-06-12 14:03:18 -04:00			`<script type="text/javascript" src="../../dist/paper.js"></script>`
Update examples to PaperScript. 2011-03-04 06:38:38 -05:00			`<script type="text/paperscript" canvas="canvas">`
Update Circles example. 2011-04-23 10:30:29 -04:00			`// All newly created items will receive`
			`// these style properties:`
Rename Document -> Project, DocumentView -> ProjectView, paper.document -> paper.project and paper.documents -> paper.projects, to avoid name clashing with window.document. 2011-05-16 08:33:15 -04:00			`project.currentStyle = {`
Update Circles example. 2011-04-23 10:30:29 -04:00			`fillColor: 'white',`
			`strokeColor: 'black'`
			`};`

Introduce Paper object that keeps track of documents and which documenti is active. Newly created items are automatically appended to the children list of the active document's activeLayer. 2011-02-12 10:20:10 -05:00			`var path;`
Update examples to PaperScript. 2011-03-04 06:38:38 -05:00			`function onMouseDrag(event) {`
Update Circles example. 2011-04-23 10:30:29 -04:00			`// 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);`
Simplify Circles example. 2011-05-06 10:51:26 -04:00			`path.removeOnDrag();`
Update examples to PaperScript. 2011-03-04 06:38:38 -05:00			`};`
Add a few mouse tool examples. 2011-02-08 07:16:43 -05:00			`</script>`
			`</head>`
			`<body>`
Don't use keepAlive option in examples. 2011-06-29 07:44:06 -04:00			`<canvas id="canvas" resize></canvas>`
Examples: close html tag. 2011-05-30 18:27:39 -04:00			`</body>`
			`</html>`