Change all documentation to new convention of defining @class outside injection scope, fix some comments and a few errors with examples.

src/basic/Line.js

@@ -14,9 +14,12 @@
  * All rights reserved.
  */
 
-var Line = this.Line = Base.extend({
+/**
-	/** @lends Line# */
+ * @name Line
-	
+ * 
+ * @class The Line object represents..
+ */
+var Line = this.Line = Base.extend(/** @lends Line# */{
 	// DOCS: document Line class and constructor
 	/**
 	 * Creates a Line object.
@@ -24,9 +27,6 @@ var Line = this.Line = Base.extend({
 	 * @param {Point} point1
 	 * @param {Point} point2
 	 * @param {Boolean} [infinite=true]
-	 * 
-	 * @class The Line object represents..
-	 * @constructs Line
 	 */
 	initialize: function(point1, point2, infinite) {
 		// Convention: With 3 parameters, both points are absolute, and infinite

src/basic/Matrix.js

@@ -19,38 +19,38 @@
 //
 // Licensed under the Apache License, Version 2.0 (the "License");
 
-var Matrix = this.Matrix = Base.extend({
+/**
-	/** @lends Matrix# */
+ * @name Matrix
-
+ * 
+ * @class An affine transform performs a linear mapping from 2D coordinates
+ * to other 2D coordinates that preserves the "straightness" and
+ * "parallelness" of lines.
+ * 
+ * Such a coordinate transformation can be represented by a 3 row by 3
+ * column matrix with an implied last row of [ 0 0 1 ]. This matrix
+ * transforms source coordinates (x,y) into destination coordinates (x',y')
+ * by considering them to be a column vector and multiplying the coordinate
+ * vector by the matrix according to the following process:
+ * <pre>
+ *      [ x']   [  m00  m01  m02  ] [ x ]   [ m00x + m01y + m02 ]
+ *      [ y'] = [  m10  m11  m12  ] [ y ] = [ m10x + m11y + m12 ]
+ *      [ 1 ]   [   0    0    1   ] [ 1 ]   [         1         ]
+ * </pre>
+ * 
+ * This class is optimized for speed and minimizes calculations based on its
+ * knowledge of the underlying matrix (as opposed to say simply performing
+ * matrix multiplication).
+ */
+var Matrix = this.Matrix = Base.extend(/** @lends Matrix# */{
 	/**
 	 * Creates a 2D affine transform.
 	 * 
-	 * @constructs Matrix
 	 * @param {Number} m00 The m00 coordinate of the transform.
 	 * @param {Number} m10 The m10 coordinate of the transform.
 	 * @param {Number} m01 The m01 coordinate of the transform.
 	 * @param {Number} m11 The m11 coordinate of the transform.
 	 * @param {Number} m02 The m02 coordinate of the transform.
 	 * @param {Number} m12 The m12 coordinate of the transform.
-	 * 
-	 * @class An affine transform performs a linear mapping from 2D coordinates
-	 * to other 2D coordinates that preserves the "straightness" and
-	 * "parallelness" of lines.
-	 * 
-	 * Such a coordinate transformation can be represented by a 3 row by 3
-	 * column matrix with an implied last row of [ 0 0 1 ]. This matrix
-	 * transforms source coordinates (x,y) into destination coordinates (x',y')
-	 * by considering them to be a column vector and multiplying the coordinate
-	 * vector by the matrix according to the following process:
-	 * <pre>
-	 *      [ x']   [  m00  m01  m02  ] [ x ]   [ m00x + m01y + m02 ]
-	 *      [ y'] = [  m10  m11  m12  ] [ y ] = [ m10x + m11y + m12 ]
-	 *      [ 1 ]   [   0    0    1   ] [ 1 ]   [         1         ]
-	 * </pre>
-	 * 
-	 * This class is optimized for speed and minimizes calculations based on its
-	 * knowledge of the underlying matrix (as opposed to say simply performing
-	 * matrix multiplication).
 	 */
 	initialize: function(m00, m10, m01, m11, m02, m12) {
 		var ok = true;

src/basic/Point.js

@@ -14,15 +14,24 @@
  * All rights reserved.
  */
 
-var Point = this.Point = Base.extend({
+/**
-	/** @lends Point# */
+ * @name Point
-
+ * 
+ * @class The Point object represents a point in the two dimensional space
+ * of the Paper.js project. It is also used to represent two dimensional
+ * vector objects.
+ * 
+ * @classexample
+ * // Create a point at x: 10, y: 5
+ * var point = new Point(10, 5);
+ * console.log(point.x); // 10
+ * console.log(point.y); // 5
+ */
+var Point = this.Point = Base.extend(/** @lends Point# */{
 	/**
 	 * Creates a Point object with the given x and y coordinates.
 	 * 
-	 * @name Point
+	 * @name Point#initialize
-	 * @constructor
-	 * 
 	 * @param {Number} x the x coordinate
 	 * @param {Number} y the y coordinate
 	 * 
@@ -31,16 +40,6 @@ var Point = this.Point = Base.extend({
 	 * var point = new Point(10, 5);
 	 * console.log(point.x); // 10
 	 * console.log(point.y); // 5
-	 * 
-	 * @class The Point object represents a point in the two dimensional space
-	 * of the Paper.js project. It is also used to represent two dimensional
-	 * vector objects.
-	 * 
-	 * @classexample
-	 * // Create a point at x: 10, y: 5
-	 * var point = new Point(10, 5);
-	 * console.log(point.x); // 10
-	 * console.log(point.y); // 5
 	 */
 	/**
 	 * Creates a Point object using the numbers in the given array as
@@ -909,9 +908,11 @@ var Point = this.Point = Base.extend({
 });
 
 /**
- * An internal version of Point that notifies its owner of each change through
+ * @name LinkedPoint
- * setting itself again on the setter that corresponds to the getter that
+ * 
- * produced this LinkedPoint. See uses of LinkedPoint.create()
+ * @class An internal version of Point that notifies its owner of each change
+ * through setting itself again on the setter that corresponds to the getter
+ * that produced this LinkedPoint. See uses of LinkedPoint.create()
  * Note: This prototype is not exported.
  * 
  * @ignore

src/basic/Rectangle.js

@@ -14,21 +14,20 @@
  * All rights reserved.
  */
 
-var Rectangle = this.Rectangle = Base.extend({
+/**
-	/** @lends Rectangle# */
+ * @name Rectangle
-
+ * 
+ * @class A Rectangle specifies an area that is enclosed by it's top-left
+ * point (x, y), its width, and its height. It should not be confused with a
+ * rectangular path, it is not an item.
+ */
+var Rectangle = this.Rectangle = Base.extend(/** @lends Rectangle# */{
 	/**
 	 * Creates a Rectangle object.
 	 * 
-	 * @name Rectangle
+	 * @name Rectangle#initialize
-	 * @constructor
-	 * 
 	 * @param {Point} point the top-left point of the rectangle
 	 * @param {Size} size the size of the rectangle
-	 * 
-	 * @class A Rectangle specifies an area that is enclosed by it's top-left
-	 * point (x, y), its width, and its height. It should not be confused with a
-	 * rectangular path, it is not an item.
 	 */
 	/**
 	 * Creates a rectangle object.
@@ -651,12 +650,15 @@ var Rectangle = this.Rectangle = Base.extend({
 });
 
 /**
- * An internal version of Rectangle that notifies its owner of each change
+ * @name LinkedRectangle
- * through setting itself again on the setter that corresponds to the getter
+ * 
- * that produced this LinkedRectangle. See uses of LinkedRectangle.create()
+ * @class An internal version of Rectangle that notifies its owner of each
+ * change through setting itself again on the setter that corresponds to the
+ * getter that produced this LinkedRectangle.
+ * See uses of LinkedRectangle.create()
  * Note: This prototype is not exported.
  * 
- * @ignore
+ * @private
  */
 var LinkedRectangle = Rectangle.extend({
 	set: function(x, y, width, height, dontNotify) {

src/basic/Size.js

@@ -14,16 +14,24 @@
  * All rights reserved.
  */
 
-var Size = this.Size = Base.extend({
+/**
-	/** @lends Size# */
+ * @name Size
-
+ * 
+ * @class The Size object is used to describe the size of something, through
+ * its {@link #width} and {@link #height} properties.
+ * 
+ * @classexample
+ * // Create a size that is 10pt wide and 5pt high
+ * var size = new Size(10, 5);
+ * console.log(size.width); // 10
+ * console.log(size.height); // 5
+ */
+var Size = this.Size = Base.extend(/** @lends Size# */{
 	// DOCS: improve Size class description
 	/**
 	 * Creates a Size object with the given width and height values.
 	 * 
-	 * @name Size
+	 * @name Size#initialize
-	 * @constructor
-	 * 
 	 * @param {Number} width the width
 	 * @param {Number} height the height
 	 * 
@@ -33,15 +41,6 @@ var Size = this.Size = Base.extend({
 	 * console.log(size.width); // 10
 	 * console.log(size.height); // 5
 	 * 
-	 * @class The Size object is used to describe the size of something, through
-	 * its {@link #width} and {@link #height} properties.
-	 * 
-	 * @classexample
-	 * // Create a size that is 10pt wide and 5pt high
-	 * var size = new Size(10, 5);
-	 * console.log(size.width); // 10
-	 * console.log(size.height); // 5
-	 */
 	/**
 	 * Creates a Size object using the numbers in the given array as
 	 * dimensions.
@@ -494,12 +493,14 @@ var Size = this.Size = Base.extend({
 });
 
 /**
- * An internal version of Size that notifies its owner of each change through
+ * @name LinkedSize
- * setting itself again on the setter that corresponds to the getter that
+ * 
- * produced this LinkedSize. See uses of LinkedSize.create()
+ * @class An internal version of Size that notifies its owner of each change
+ * through setting itself again on the setter that corresponds to the getter
+ * that produced this LinkedSize. See uses of LinkedSize.create()
  * Note: This prototype is not exported.
  * 
- * @ignore
+ * @private
  */
 var LinkedSize = Size.extend({
 	set: function(width, height, dontNotify) {

src/color/Color.js

@@ -14,6 +14,38 @@
  * All rights reserved.
  */
 
+// DOCS: write Color class documentation.
+/**
+ * @name Color
+ * 
+ * @class All properties and functions that expect color values accept
+ * instances of the different color classes such as {@link RGBColor},
+ * {@link HSBColor} and {@link GrayColor}, and also accept named colors
+ * and hex values as strings which are then converted to instances of
+ * {@link RGBColor} internally.
+ * 
+ * @classexample {@paperscript}
+ * // Named color values:
+ * 
+ * // Create a circle shaped path at {x: 80, y: 50}
+ * // with a radius of 30.
+ * var circle = new Path.Circle(new Point(80, 50), 30);
+ * 
+ * // Pass a color name to the fillColor property, which is internally
+ * // converted to an RGBColor.
+ * circle.fillColor = 'green';
+ * 
+ * @classexample {@paperscript}
+ * // Hex color values:
+ * 
+ * // Create a circle shaped path at {x: 80, y: 50}
+ * // with a radius of 30.
+ * var circle = new Path.Circle(new Point(80, 50), 30);
+ * 
+ * // Pass a hex string to the fillColor property, which is internally
+ * // converted to an RGBColor.
+ * circle.fillColor = '#ff0000';
+ */
 var Color = this.Color = Base.extend(new function() {
 	
 	var components = {
@@ -135,42 +167,9 @@ var Color = this.Color = Base.extend(new function() {
 		}
 	};
 
-	var fields = {
+	var fields = /** @lends Color# */{
-	/** @lends Color# */
-
 		_readNull: true,
 
-		// DOCS: write Color constructor and class documentation.
-		/**
-		 * @constructs Color
-		 * @class All properties and functions that expect color values accept
-		 * instances of the different color classes such as {@link RGBColor},
-		 * {@link HSBColor} and {@link GrayColor}, and also accept named colors
-		 * and hex values as strings which are then converted to instances of
-		 * {@link RGBColor} internally.
-		 * 
-		 * @classexample {@paperscript}
-		 * // Named color values:
-		 * 
-		 * // Create a circle shaped path at {x: 80, y: 50}
-		 * // with a radius of 30.
-		 * var circle = new Path.Circle(new Point(80, 50), 30);
-		 * 
-		 * // Pass a color name to the fillColor property, which is internally
-		 * // converted to an RGBColor.
-		 * circle.fillColor = 'green';
-		 * 
-		 * @classexample {@paperscript}
-		 * // Hex color values:
-		 * 
-		 * // Create a circle shaped path at {x: 80, y: 50}
-		 * // with a radius of 30.
-		 * var circle = new Path.Circle(new Point(80, 50), 30);
-		 * 
-		 * // Pass a hex string to the fillColor property, which is internally
-		 * // converted to an RGBColor.
-		 * circle.fillColor = '#ff0000';
-		 */
 		initialize: function(arg) {
 			var isArray = Array.isArray(arg),
 				type = this._colorType;
@@ -244,7 +243,7 @@ var Color = this.Color = Base.extend(new function() {
 				: converters[this._colorType + '-' + type](this);
 		},
 
-		statics: {
+		statics: /** @lends Color */{
 			/**
 			 * Override Color.extend() to produce getters and setters based
 			 * on the component types defined in _components.
@@ -303,8 +302,7 @@ var Color = this.Color = Base.extend(new function() {
 	});
 
 	return fields;
-}, {
+}, /** @lends Color# */{
-	/** @lends Color# */
 
 	/**
 	 * Called by various setters whenever a color value changes
@@ -345,14 +343,12 @@ var Color = this.Color = Base.extend(new function() {
 	/**
 	 * Returns the type of the color as a string.
 	 * 
-	 * Example:
-	 * <code>
-	 * var color = new RGBColor(1, 0, 0);
-	 * console.log(color.type); // 'rgb'
-	 * </code>
-	 * 
 	 * @type String('rgb', 'hsb', 'gray')
 	 * @bean
+	 *
+	 * @example
+	 * var color = new RGBColor(1, 0, 0);
+	 * console.log(color.type); // 'rgb'
 	 */
 	getType: function() {
 		return this._colorType;
@@ -579,21 +575,21 @@ var Color = this.Color = Base.extend(new function() {
 
 });
 
-var GrayColor = this.GrayColor = Color.extend(/** @scope GrayColor */{
+/**
+ * @name GrayColor
+ * @class A GrayColor object is used to represent any gray color value.
+ * @extends Color
+ */
+var GrayColor = this.GrayColor = Color.extend(/** @lends GrayColor# */{
 	/**
 	 * Creates a GrayColor object
 	 * 
-	 * @name GrayColor
+	 * @name GrayColor#initialize
-	 * @constructor
-	 * 
 	 * @param {Number} gray the amount of gray in the color as a value
 	 * between {@code 0} and {@code 1}
 	 * @param {Number} [alpha] the alpha of the color as a value between
 	 * {@code 0} and {@code 1}
 	 * 
-	 * @class A GrayColor object is used to represent any gray color value.
-	 * @extends Color
-	 * 
 	 * @example {@paperscript}
 	 * // Creating a GrayColor:
 	 * 
@@ -608,13 +604,16 @@ var GrayColor = this.GrayColor = Color.extend(/** @scope GrayColor */{
 	_colorType: 'gray'
 });
 
-var RGBColor = this.RGBColor = Color.extend(/** @scope RGBColor */{
+/**
+ * @name RGBColor
+ * @class An RGBColor object is used to represent any RGB color value.
+ * @extends Color
+ */
+var RGBColor = this.RGBColor = Color.extend(/** @lends RGBColor# */{
 	/**
 	 * Creates an RGBColor object
 	 * 
-	 * @name RGBColor
+	 * @name RGBColor#initialize
-	 * @constructor
-	 * 
 	 * @param {Number} red the amount of red in the color as a value
 	 * between {@code 0} and {@code 1}
 	 * @param {Number} green the amount of green in the color as a value
@@ -624,9 +623,6 @@ var RGBColor = this.RGBColor = Color.extend(/** @scope RGBColor */{
 	 * @param {Number} [alpha] the alpha of the color as a value between
 	 * {@code 0} and {@code 1}
 	 * 
-	 * @class An RGBColor object is used to represent any RGB color value.
-	 * @extends Color
-	 * 
 	 * @example {@paperscript}
 	 * // Creating an RGBColor:
 	 * 
@@ -641,13 +637,16 @@ var RGBColor = this.RGBColor = Color.extend(/** @scope RGBColor */{
 	_colorType: 'rgb'
 });
 
-var HSBColor = this.HSBColor = Color.extend(/** @scope HSBColor */{
+/**
+ * @name HSBColor
+ * @class An HSBColor object is used to represent any HSB color value.
+ * @extends Color
+ */
+var HSBColor = this.HSBColor = Color.extend(/** @lends HSBColor# */{
 	/**
 	 * Creates an HSBColor object
 	 * 
-	 * @name HSBColor
+	 * @name HSBColor#initialize
-	 * @constructor
-	 * 
 	 * @param {Number} hue the hue of the color as a value in degrees between
 	 * {@code 0} and {@code 360}.
 	 * @param {Number} saturation the saturation of the color as a value
@@ -657,9 +656,6 @@ var HSBColor = this.HSBColor = Color.extend(/** @scope HSBColor */{
 	 * @param {Number} [alpha] the alpha of the color as a value between
 	 * {@code 0} and {@code 1}
 	 * 
-	 * @class An HSBColor object is used to represent any HSB color value.
-	 * @extends Color
-	 * 
 	 * @example {@paperscript}
 	 * // Creating an HSBColor:
 	 * 

src/color/Gradient.js

@@ -14,9 +14,12 @@
  * All rights reserved.
  */
 
-var Gradient = this.Gradient = Base.extend({
+/**
-	/** @lends Gradient# */
+ * @name Gradient
-
+ * 
+ * @class The Gradient object.
+ */
+var Gradient = this.Gradient = Base.extend(/** @lends Gradient# */{
 	// TODO: Should type here be called 'radial' and have it receive a
 	// boolean value?
 	/**
@@ -24,9 +27,6 @@ var Gradient = this.Gradient = Base.extend({
 	 * 
 	 * @param {GradientStop[]} stops
 	 * @param {String} [type='linear'] 'linear' or 'radial'
-	 * @constructs Gradient
-	 * 
-	 * @class The Gradient object.
 	 */
 	initialize: function(stops, type) {
 		this.setStops(stops || ['white', 'black']);

src/color/GradientColor.js

@@ -14,8 +14,12 @@
  * All rights reserved.
  */
 
-var GradientColor = this.GradientColor = Color.extend({
+/**
-	/** @lends GradientColor# */
+ * @name GradientColor
+ * 
+ * @class The GradientColor object.
+ */
+var GradientColor = this.GradientColor = Color.extend(/** @lends GradientColor# */{
 
 	/**
 	 * Creates a gradient color object.
@@ -24,7 +28,6 @@ var GradientColor = this.GradientColor = Color.extend({
 	 * @param {Point} origin
 	 * @param {Point} destination
 	 * @param {Point} [hilite]
-	 * @constructs GradientColor
 	 * 
 	 * @example {@paperscript height=200}
 	 * // Applying a linear gradient color containing evenly distributed
@@ -78,8 +81,6 @@ var GradientColor = this.GradientColor = Color.extend({
 	 * 
 	 * // Set the fill color of the path to the gradient color:
 	 * path.fillColor = gradientColor;
-	 * 
-	 * @class The GradientColor object.
 	 */
 	initialize: function(gradient, origin, destination, hilite) {
 		this.gradient = gradient || new Gradient();

src/color/GradientStop.js

@@ -15,18 +15,18 @@
  */
 
 // TODO: Support midPoint? (initial tests didn't look nice)
-var GradientStop = this.GradientStop = Base.extend({
+/**
-	/** @lends GradientStop# */
+ * @name GradientStop
-
+ * 
+ * @class The GradientStop object.
+ */
+var GradientStop = this.GradientStop = Base.extend(/** @lends GradientStop# */{
 	/**
 	 * Creates a GradientStop object.
 	 * 
 	 * @param {Color} [color=new RGBColor(0, 0, 0)] the color of the stop
 	 * @param {Number} [rampPoint=0] the position of the stop on the gradient
 	 *                               ramp {@default 0}
-	 * @constructs GradientStop
-	 * 
-	 * @class The GradientStop object.
 	 */
 	initialize: function(arg0, arg1) {
 		if (arg1 === undefined && Array.isArray(arg0)) {

src/core/Base.js

@@ -15,8 +15,13 @@
  */
 
 // Extend Base with utility functions used across the library. Also set
-// this.Base, since bootstrap.js ommits that.
+// this.Base on the injection scope, since bootstrap.js ommits that.
-this.Base = Base.inject({
+/**
+ * @name Base
+ * @class
+ * @private
+ */
+this.Base = Base.inject(/** @lends Base# */{
 	/**
 	 * General purpose clone function that delegates cloning to the constructor
 	 * that receives the object to be cloned as the first argument.
@@ -27,7 +32,7 @@ this.Base = Base.inject({
 		return new this.constructor(this);
 	},
 
-	statics: {
+	statics: /** @lends Base */{
 		/**
 		 * Reads arguments of the type of the class on which it is called on
 		 * from the passed arguments list or array, at the given index, up to
@@ -68,8 +73,6 @@ this.Base = Base.inject({
 		 * Utility function for adding and removing items from a list of which
 		 * each entry keeps a reference to its index in the list in the private
 		 * _index property. Used for PaperScope#projects and Item#children.
-		 * 
-		 * @ignore
 		 */
 		splice: function(list, items, index, remove) {
 			var amount = items && items.length,
@@ -128,8 +131,6 @@ this.Base = Base.inject({
 		/**
 		 * Utility function for rendering numbers to strings at a precision of
 		 * up to 5 fractional digits.
-		 * 
-		 * @ignore
 		 */
 		formatNumber: function(num) {
 			return (Math.round(num * 100000) / 100000).toString();
@@ -138,8 +139,6 @@ this.Base = Base.inject({
 		/**
 		 * Utility function for rendering objects to strings, in object literal
 		 * notation.
-		 * 
-		 * @ignore
 		 */
 		formatObject: function(obj) {
 			return '{ ' + Base.each(obj, function(value, key) {

src/core/PaperScope.js

@@ -15,9 +15,12 @@
  */
 
 /**
- * Define internal PaperScope class that handles all the fields available on the
+ * @name PaperScope
+ * 
+ * @class Internal PaperScope class that handles all the fields available on the
  * global paper object, which simply is a pointer to the currently active scope.
- * @ignore
+ * 
+ * @private
  */
 var PaperScope = this.PaperScope = Base.extend(/** @scope _global_ */{
 	/**
@@ -181,6 +184,13 @@ var PaperScope = this.PaperScope = Base.extend(/** @scope _global_ */{
 	statics: {
 		_scopes: {},
 
+		/**
+		 * Retrieves a PaperScope object with the given id or associated with
+		 * the passed canvas element.
+		 * 
+		 * @param id
+		 * @ignore
+		 */
 		get: function(id) {
 			// If a script tag is passed, get the id from it.
 			if (typeof id === 'object')
@@ -190,6 +200,9 @@ var PaperScope = this.PaperScope = Base.extend(/** @scope _global_ */{
 
 		/**
 		 * A way to iterate over all active scopes without accessing _scopes
+		 * 
+		 * @param iter
+		 * @ignore
 		 */
 		each: function(iter) {
 			Base.each(this._scopes, iter);

src/item/Group.js

@@ -14,9 +14,16 @@
  * All rights reserved.
  */
 
-var Group = this.Group = Item.extend({
+/**
-	/** @lends Group# */
+ * @name Group
-
+ * 
+ * @class A Group is a collection of items. When you transform a Group, its
+ * children are treated as a single unit without changing their relative
+ * positions.
+ * 
+ * @extends Item
+ */
+var Group = this.Group = Item.extend(/** @lends Group# */{
 	// DOCS: document new Group(item, item...);
 	/**
 	 * Creates a new Group item and places it at the top of the active layer.
@@ -58,12 +65,6 @@ var Group = this.Group = Item.extend({
 	 * 	// the centerpoint of the view:
 	 * 	group.rotate(1, view.center);
 	 * }
-	 * 
-	 * @class A Group is a collection of items. When you transform a Group, its
-	 * children are treated as a single unit without changing their relative
-	 * positions.
-	 * @extends Item
-	 * @constructs Group
 	 */
 	initialize: function(items) {
 		this.base();

src/item/Item.js

@@ -14,18 +14,17 @@
  * All rights reserved.
  */
 
-var Item = this.Item = Base.extend({
+/**
-	/** @lends Item# */
+ * @name Item
-
+ * 
-	/**
+ * @class The Item type allows you to access and modify the items in
-	 * @name Item
+ * Paper.js projects. Its functionality is inherited by different project
-	 * @class The Item type allows you to access and modify the items in
+ * item types such as {@link Path}, {@link CompoundPath}, {@link Group},
-	 * Paper.js projects. Its functionality is inherited by different project
+ * {@link Layer} and {@link Raster}. They each add a layer of functionality that
-	 * item types such as {@link Path}, {@link CompoundPath}, {@link Group},
+ * is unique to their type, but share the underlying properties and functions
-	 * {@link Layer} and {@link Raster}. They each add a layer of functionality that
+ * that they inherit from Item.
-	 * is unique to their type, but share the underlying properties and functions
+ */
-	 * that they inherit from Item.
+var Item = this.Item = Base.extend(/** @lends Item# */{
-	 */
 	initialize: function() {
 		// If _project is already set, the item was already moved into the DOM
 		// hierarchy. Used by Layer, where it's added to project.layers instead
@@ -219,9 +218,7 @@ var Item = this.Item = Base.extend({
 				}
 			};
 		}, {});
-}, {
+}, /** @lends Item# */{
-	/** @lends Item# */
-
 	// Note: These properties have their getter / setters produced in the
 	// injection scope above.
 

src/item/Layer.js

@@ -14,9 +14,19 @@
  * All rights reserved.
  */
 
-var Layer = this.Layer = Group.extend({
+/**
-	/** @lends Layer# */
+ * @name Layer
-
+ * 
+ * @class The Layer item represents a layer in a Paper.js project.
+ * 
+ * The layer which is currently active can be accessed through
+ * {@link Project#activeLayer}.
+ * An array of all layers in a project can be accessed through
+ * {@link Project#layers}.
+ * 
+ * @extends Group
+ */
+var Layer = this.Layer = Group.extend(/** @lends Layer# */{
 	// DOCS: improve constructor code example.
 	/**
 	 * Creates a new Layer item and places it at the end of the
@@ -28,16 +38,6 @@ var Layer = this.Layer = Group.extend({
 	 * 
 	 * @example
 	 * var layer = new Layer();
-	 * 
-	 * @class The Layer item represents a layer in a Paper.js project.
-	 * 
-	 * The layer which is currently active can be accessed through
-	 * {@link Project#activeLayer}.
-	 * An array of all layers in a project can be accessed through
-	 * {@link Project#layers}.
-	 * 
-	 * @extends Group
-	 * @constructs Layer
 	 */
 	initialize: function(items) {
 		this._project = paper.project;

src/item/PlacedSymbol.js

@@ -14,9 +14,15 @@
  * All rights reserved.
  */
 
-var PlacedSymbol = this.PlacedSymbol = Item.extend({
+/**
-	/** @lends PlacedSymbol# */
+ * @name PlacedSymbol
-
+ * 
+ * @class A PlacedSymbol represents an instance of a symbol which has been
+ * placed in a Paper.js project.
+ * 
+ * @extends Item
+ */
+var PlacedSymbol = this.PlacedSymbol = Item.extend(/** @lends PlacedSymbol# */{
 	/**
 	 * Creates a new PlacedSymbol Item.
 	 * 
@@ -54,12 +60,6 @@ var PlacedSymbol = this.PlacedSymbol = Item.extend({
 	 *     // Scale the instance between 0.25 and 1:
 	 *     instance.scale(0.25 + Math.random() * 0.75);
 	 * }
-	 * 
-	 * @class A PlacedSymbol represents an instance of a symbol which has been
-	 * placed in a Paper.js project.
-	 * 
-	 * @extends Item
-	 * @constructs PlacedSymbol
 	 */
 	initialize: function(symbol, matrixOrOffset) {
 		this.base();

src/item/Raster.js

@@ -14,21 +14,19 @@
  * All rights reserved.
  */
 
-var Raster = this.Raster = Item.extend({
+/**
-	/** @lends Raster# */
+ * @name Raster
-
+ * @class The Raster item represents an image in a Paper.js project.
+ * @extends Item
+ */
+var Raster = this.Raster = Item.extend(/** @lends Raster# */{
 	// TODO: Implement url / type, width, height.
 	// TODO: Have PlacedSymbol & Raster inherit from a shared class?
 	// DOCS: Document Raster constructor.
 	/**
 	 * Creates a new raster item and places it in the active layer.
 	 * 
-	 * @constructs Raster
 	 * @param {HTMLImageElement|Canvas|string} [object]
-	 * 
-	 * @class The Raster item represents an image in a Paper.js project.
-	 * 
-	 * @extends Item
 	 */
 	initialize: function(object) {
 		this.base();

src/paper.js

@@ -1,5 +1,5 @@
 /***
- *
+* 
  * Paper.js
  * 
  * A JavaScript Vector Graphics Library, based on Scriptographer.org and
@@ -36,6 +36,8 @@
  ***/
 
 /**
+ * The global PaperScope object
+ * @name paper
  * @ignore
  */
 var paper = new function() {

src/path/CompoundPath.js

@@ -14,13 +14,20 @@
  * All rights reserved.
  */
 
-var CompoundPath = this.CompoundPath = PathItem.extend({
+/**
-	/** @lends CompoundPath# */
+ * @name CompoundPath
-
+ * 
+ * @class A compound path contains two or more paths, holes are drawn
+ * where the paths overlap. All the paths in a compound path take on the
+ * style of the backmost path and can be accessed through its
+ * {@link Item#children} list.
+ * 
+ * @extends PathItem
+ */
+var CompoundPath = this.CompoundPath = PathItem.extend(/** @lends CompoundPath# */{
 	/**
 	 * Creates a new compound path item and places it in the active layer.
 	 * 
-	 * @constructs CompoundPath
 	 * @param {Path[]} [paths] the paths to place within the compound path.
 	 * 
 	 * @example {@paperscript}
@@ -32,13 +39,6 @@ var CompoundPath = this.CompoundPath = PathItem.extend({
 	 * 
 	 * // Move the inner circle 5pt to the right:
 	 * compoundPath.children[1].position.x += 5;
-	 * 
-	 * @class A compound path contains two or more paths, holes are drawn
-	 * where the paths overlap. All the paths in a compound path take on the
-	 * style of the backmost path and can be accessed through its
-	 * {@link Item#children} list.
-	 * 
-	 * @extends PathItem
 	 */
 	initialize: function(paths) {
 		this.base();

src/path/Curve.js

@@ -14,19 +14,17 @@
  * All rights reserved.
  */
 
-var Curve = this.Curve = Base.extend({
+/**
-	/** @lends Curve# */
+ * @name Curve
-
+ * 
+ * @class The Curve object represents...
+ */
+var Curve = this.Curve = Base.extend(/** @lends Curve# */{
 	/**
 	 * Creates a new curve object.
 	 * 
-	 * @name Curve
-	 * @constructor
-	 * 
 	 * @param {Segment} segment1
 	 * @param {Segment} segment2
-	 * 
-	 * @class The Curve object represents...
 	 */
 	initialize: function(arg0, arg1, arg2, arg3, arg4, arg5, arg6, arg7) {
 		var count = arguments.length;
@@ -48,7 +46,6 @@ var Curve = this.Curve = Base.extend({
 			// An array as returned by getValues
 			var p1 = Point.create(arg0, arg1),
 				p2 = Point.create(arg6, arg7);
-			p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y
 			this._segment1 = new Segment(p1, null,
 					Point.create(arg2, arg3).subtract(p1));
 			this._segment2 = new Segment(p2,

src/path/CurveLocation.js

@@ -14,9 +14,16 @@
  * All rights reserved.
  */
 
-CurveLocation = Base.extend({
+/**
-	/** @lends CurveLocation# */
+ * @name CurveLocation
-
+ * 
+ * @class CurveLocation objects describe a location on {@link Curve}
+ * objects, as defined by the curve {@link #parameter}, a value between
+ * {@code 0} (beginning of the curve) and {@code 1} (end of the curve). If
+ * the curve is part of a {@link Path} item, its {@link #index} inside the
+ * {@link Path#curves} array is also provided.
+ */
+CurveLocation = Base.extend(/** @lends CurveLocation# */{
 	// DOCS: CurveLocation class description: add this comment back when the
 	// mentioned functioned have been added:
 	// The class is in use in many places, such as {@link Path#getLocationAt(offset)},
@@ -26,18 +33,9 @@ CurveLocation = Base.extend({
 	/**
 	 * Creates a new CurveLocation object.
 	 * 
-	 * @name CurveLocation
-	 * @constructor
-	 * 
 	 * @param {Curve} curve
 	 * @param {Number} parameter
 	 * @param {Point} point
-	 * 
-	 * @class CurveLocation objects describe a location on {@link Curve}
-	 * objects, as defined by the curve {@link #parameter}, a value between
-	 * {@code 0} (beginning of the curve) and {@code 1} (end of the curve). If
-	 * the curve is part of a {@link Path} item, its {@link #index} inside the
-	 * {@link Path#curves} array is also provided.
 	 */
 	initialize: function(curve, parameter, point) {
 		this._curve = curve;

src/path/Path.js

@@ -14,9 +14,14 @@
  * All rights reserved.
  */
 
-var Path = this.Path = PathItem.extend({
+/**
-	/** @lends Path# */
+ * @name Path
-
+ * 
+ * @class The Path item represents a path in a Paper.js project.
+ * 
+ * @extends PathItem
+ */
+var Path = this.Path = PathItem.extend(/** @lends Path# */{
 	/**
 	 * Creates a new Path item and places it at the top of the active layer.
 	 * 
@@ -35,10 +40,6 @@ var Path = this.Path = PathItem.extend({
 	 * var segments = [new Point(30, 30), new Point(100, 100)];
 	 * var path = new Path(segments);
 	 * path.strokeColor = 'black';
-	 * 
-	 * @class The Path item represents a path in a Paper.js project.
-	 * @extends PathItem
-	 * @constructs Path
 	 */
 	initialize: function(segments) {
 		this.base();

src/path/PathItem.js

@@ -14,16 +14,14 @@
  * All rights reserved.
  */
 
-var PathItem = this.PathItem = Item.extend(/** @scope PathItem */{
+/**
-	/**
+ * @name PathItem
-	 * @name PathItem
+ * @class
-	 * @class
+ * @extends Item
-	 * @extends Item
+ */
-	 */
+var PathItem = this.PathItem = Item.extend(/** @lends PathItem# */{
-
 	// Note: The PathItem class is currently empty but holds the documentation
 	// for all the methods that exist both on Path and CompoundPath.
-
 	/**
 	 * Smooth bezier curves without changing the amount of segments or their
 	 * points, by only smoothing and adjusting their handle points, for both

src/path/Segment.js

@@ -14,15 +14,18 @@
  * All rights reserved.
  */
 
-var Segment = this.Segment = Base.extend({
+/**
-	/** @lends Segment# */
+ * @name Segment
-
+ * @class The Segment object represents a part of a path which is
+ * described by the {@link Path#segments} array. Every segment of a
+ * path corresponds to an anchor point (anchor points are the path handles
+ * that are visible when the path is selected).
+ * 
+ */
+var Segment = this.Segment = Base.extend(/** @lends Segment# */{
 	/**
 	 * Creates a new Segment object.
 	 * 
-	 * @name Segment
-	 * @constructor
-	 * 
 	 * @param {Point} [point={x: 0, y: 0}] the anchor point of the segment
 	 * @param {Point} [handleIn={x: 0, y: 0}] the handle point relative to the
 	 *        anchor point of the segment that describes the in tangent of the
@@ -43,11 +46,6 @@ var Segment = this.Segment = Base.extend({
 	 * 
 	 * var path = new Path(firstSegment, secondSegment);
 	 * path.strokeColor = 'black';
-	 * 
-	 * @class The Segment object represents a part of a path which is
-	 * described by the {@link Path#segments} array. Every segment of a
-	 * path corresponds to an anchor point (anchor points are the path handles
-	 * that are visible when the path is selected).
 	 */
 	initialize: function(arg0, arg1, arg2, arg3, arg4, arg5) {
 		var count = arguments.length,

src/path/SegmentPoint.js

@@ -15,10 +15,11 @@
  */
 
 /**
- * An internal version of Point that notifies its segment of each change
+ * @name SegmentPoint
+ * @class An internal version of Point that notifies its segment of each change
  * Note: This prototype is not exported.
  * 
- * @ignore
+ * @private
  */
 var SegmentPoint = Point.extend({
 	set: function(x, y) {

src/project/Project.js

@@ -14,24 +14,22 @@
  * All rights reserved.
  */
 
-var Project = this.Project = Base.extend({
+/** 
-	/** @lends Project# */
+ * @name Project
-
+ * 
+ * @class The Project item refers to..
+ * 
+ * The currently active project can be accessed through the global {@code
+ * project} variable.
+ * 
+ * An array of all open projects is accessible through the global {@code
+ * projects} variable.
+ */
+var Project = this.Project = Base.extend(/** @lends Project# */{
 	// TODO: Add arguments to define pages
 	// DOCS: Document Project constructor and class
 	/**
 	 * Creates a Paper.js project
-	 * 
-	 * @name Project
-	 * @constructor
-	 * 
-	 * @class The Project item refers to..
-	 * 
-	 * The currently active project can be accessed through the global {@code
-	 * project} variable.
-	 * 
-	 * An array of all open projects is accessible through the global {@code
-	 * projects} variable.
 	 */
 	initialize: function() {
 		// Store reference to the currently active global paper scope:

src/project/Symbol.js

@@ -14,18 +14,22 @@
  * All rights reserved.
  */
 
-var Symbol = this.Symbol = Base.extend({
+/**
-	/** @lends Symbol# */
+ * @name Symbol
-
+ * 
+ * @class Symbols allow you to place multiple instances of an item in your
+ * project. This can save memory, since all instances of a symbol simply refer
+ * to the original item and it can speed up moving around complex objects, since
+ * internal properties such as segment lists and gradient positions don't need
+ * to be updated with every transformation.
+ */
+var Symbol = this.Symbol = Base.extend(/** @lends Symbol# */{
 	/**
 	 * Creates a Symbol item.
 	 * 
 	 * @param {Item} item the source item which is copied as the definition of
 	 *               the symbol
 	 * 
-	 * @name Symbol
-	 * @constructor
-	 * 
 	 * @example {@paperscript split=true height=240}
 	 * // Placing 100 instances of a symbol:
 	 * var path = new Path.Star(new Point(0, 0), 6, 5, 13);
@@ -55,13 +59,6 @@ var Symbol = this.Symbol = Base.extend({
 	 *     // Scale the instance between 0.25 and 1:
 	 *     instance.scale(0.25 + Math.random() * 0.75);
 	 * }
-	 * 
-	 * @class Symbols allow you to place multiple instances of an item in your
-	 *        project. This can save memory, since all instances of a symbol
-	 *        simply refer to the original item and it can speed up moving
-	 *        around complex objects, since internal properties such as segment
-	 *        lists and gradient positions don't need to be updated with every
-	 *        transformation.
 	 */
 	initialize: function(item) {
 		this.project = paper.project;

src/style/CharacterStyle.js

@@ -14,9 +14,23 @@
  * All rights reserved.
  */
 
-var CharacterStyle = this.CharacterStyle = PathStyle.extend({
+/**
-	/** @lends CharacterStyle# */
+ * @name CharacterStyle
-
+ *
+ * @class The CharacterStyle object represents the character style of a text
+ * item ({@link TextItem#characterStyle})
+ * 
+ * @extends PathStyle
+ *
+ * @classexample
+ * var text = new PointText(new Point(50, 50));
+ * text.content = 'Hello world.';
+ * text.characterStyle = {
+ * 	fontSize: 50,
+ * 	fillColor: 'black',
+ * };
+ */
+var CharacterStyle = this.CharacterStyle = PathStyle.extend(/** @lends CharacterStyle# */{
 	_defaults: Base.merge(PathStyle.prototype._defaults, {
 		// Override default fillColor of CharacterStyle
 		fillColor: 'black',
@@ -31,22 +45,8 @@ var CharacterStyle = this.CharacterStyle = PathStyle.extend({
 	 * object to {@link TextItem#characterStyle}, it will be converted to a
 	 * CharacterStyle object internally.
 	 * 
-	 * @name CharacterStyle
+	 * @name CharacterStyle#initialize
-	 * @constructor
 	 * @param {object} style
-	 * 
-	 * @class The CharacterStyle object represents the character style of a text
-	 * item ({@link TextItem#characterStyle})
-	 * 
-	 * @classexample {@paperscript height=100}
-	 * var text = new PointText(new Point(50, 60));
-	 * text.content = 'Hello world.';
-	 * text.characterStyle = {
-	 * 	fontSize: 30,
-	 * 	font: 'times'
-	 * };
-	 * 
-	 * @extends PathStyle
 	 */
 
 	/**
@@ -55,12 +55,6 @@ var CharacterStyle = this.CharacterStyle = PathStyle.extend({
 	 * @name CharacterStyle#font
 	 * @default 'sans-serif'
 	 * @type String
-	 * 
-	 * @example {@paperscript height=150}
-	 * var textItem = new PointText(new Point(20, 80));
-	 * textItem.content = 'Hello world.';
-	 * textItem.fontSize = 30;
-	 * textItem.font = 'times';
 	 */
 
 	/**
@@ -69,10 +63,5 @@ var CharacterStyle = this.CharacterStyle = PathStyle.extend({
 	 * @name CharacterStyle#fontSize
 	 * @default 10
 	 * @type Number
-	 * 
-	 * @example {@paperscript height=150}
-	 * var textItem = new PointText(new Point(20, 80));
-	 * textItem.content = 'Hello world.';
-	 * textItem.fontSize = 30;
 	 */
 });

src/style/ParagraphStyle.js

@@ -14,9 +14,23 @@
  * All rights reserved.
  */
 
-var ParagraphStyle = this.ParagraphStyle = Style.extend({
+/**
-	/** @lends ParagraphStyle# */
+ * @name ParagraphStyle
-
+ * 
+ * @class The ParagraphStyle object represents the paragraph style of a text
+ * item ({@link TextItem#paragraphStyle}).
+ * 
+ * Currently, the ParagraphStyle object may seem a bit empty, with just the
+ * {@link #justification} property. Yet, we have lots in store for Paper.js
+ * when it comes to typography. Please stay tuned.
+ * 
+ * @classexample
+ * var text = new PointText(new Point(0,0));
+ * text.fillColor = 'black';
+ * text.content = 'Hello world.';
+ * text.paragraphStyle.justification = 'center';
+ */
+var ParagraphStyle = this.ParagraphStyle = Style.extend(/** @lends ParagraphStyle# */{
 	_defaults: {
 		justification: 'left'
 	},
@@ -28,16 +42,8 @@ var ParagraphStyle = this.ParagraphStyle = Style.extend({
 	 * object to {@link TextItem#paragraphStyle}, it will be converted to a
 	 * ParagraphStyle object internally.
 	 * 
-	 * @name ParagraphStyle
+	 * @name ParagraphStyle#initialize
-	 * @constructor
 	 * @param {object} style
-	 * 
-	 * @class The ParagraphStyle object represents the paragraph style of a text
-	 * item ({@link TextItem#paragraphStyle}).
-	 * 
-	 * Currently, the ParagraphStyle object may seem a bit empty, with just the
-	 * {@link #justification} property. Yet, we have lots in store for Paper.js
-	 * when it comes to typography. Please stay tuned.
 	 */
 
 	/**
@@ -46,25 +52,5 @@ var ParagraphStyle = this.ParagraphStyle = Style.extend({
 	 * @name ParagraphStyle#justification
 	 * @default 'left'
 	 * @type String('left', 'right', 'center')
-	 * 
-	 * @example {@paperscript height=150 split=false}
-	 * // Examples of the different justifications:
-	 * 
-	 * // Create a vertical line that runs from the top center
-	 * // of the view to the bottom center of the view:
-	 * var bounds = view.bounds;
-	 * var path = new Path(bounds.topCenter, bounds.bottomCenter);
-	 * path.strokeColor = 'pink';
-	 * 
-	 * var textItem = new PointText(view.center - [0, 30]);
-	 * textItem.content = 'left justified';
-	 * 
-	 * var textItem2 = new PointText(view.center);
-	 * textItem2.content = 'center justified';
-	 * textItem2.justification = 'center';
-	 * 
-	 * var textItem3 = new PointText(view.center + [0, 30]);
-	 * textItem3.content = 'right justified';
-	 * textItem3.justification = 'right';
 	 */
 });

src/style/PathStyle.js

@@ -14,9 +14,32 @@
  * All rights reserved.
  */
 
-var PathStyle = this.PathStyle = Style.extend({
+// DOCS: why isn't the example code showing up?
-	/** @lends PathStyle# */
+/**
-
+ * @name PathStyle
+ * 
+ * @class PathStyle is used for changing the visual styles of items
+ * contained within a Paper.js project and is returned by
+ * {@link Item#style} and {@link Project#currentStyle}.
+ * 
+ * All properties of PathStyle are also reflected directly in {@link Item},
+ * i.e.: {@link Item#fillColor}.
+ * 
+ * To set multiple style properties in one go, you can pass an object to
+ * {@link Item#style}. This is a convenient way to define a style once and
+ * apply it to a series of items:
+ * 
+ * @classexample {@paperscript}
+ * var circleStyle = {
+ * 	fillColor: new RGBColor(1, 0, 0),
+ * 	strokeColor: 'black',
+ * 	strokeWidth: 5
+ * };
+ * 
+ * var path = new Path.Circle(new Point(80, 50), 30);
+ * path.style = circleStyle;
+ */
+var PathStyle = this.PathStyle = Style.extend(/** @lends PathStyle# */{
 	// windingRule / resolution / fillOverprint / strokeOverprint are currently
 	// not supported.
 	_defaults: {
@@ -44,30 +67,10 @@ var PathStyle = this.PathStyle = Style.extend({
 	 * object to {@link Item#style} or {@link Project#currentStyle}, it will
 	 * be converted to a PathStyle object internally.
 	 * 
-	 * @constructs PathStyle
+	 * @name PathStyle#initialize
 	 * @param {object} style
-	 * 
-	 * @class PathStyle is used for changing the visual styles of items
-	 * contained within a Paper.js project and is returned by
-	 * {@link Item#style} and {@link Project#currentStyle}.
-	 * 
-	 * All properties of PathStyle are also reflected directly in {@link Item},
-	 * i.e.: {@link Item#fillColor}.
-	 * 
-	 * To set multiple style properties in one go, you can pass an object to
-	 * {@link Item#style}. This is a convenient way to define a style once and
-	 * apply it to a series of items:
-	 * 
-	 * @classexample {@paperscript}
-	 * var circleStyle = {
-	 * 	fillColor: new RGBColor(1, 0, 0),
-	 * 	strokeColor: 'black',
-	 * 	strokeWidth: 5
-	 * };
-	 * 
-	 * var path = new Path.Circle(new Point(80, 50), 30);
-	 * path.style = circleStyle;
 	 */
+
 	/**
 	 * {@grouptitle Stroke Style}
 	 * 
@@ -115,7 +118,7 @@ var PathStyle = this.PathStyle = Style.extend({
 	 * have a stroke.
 	 * 
 	 * @property
-	 * @name Item#strokeCap
+	 * @name PathStyle#strokeCap
 	 * @default 'butt'
 	 * @type String('round', 'square', 'butt')
 	 * 

src/style/Style.js

@@ -17,8 +17,6 @@
 /**
  * Internal base-class for all style objects, e.g. PathStyle, CharacterStyle,
  * PargraphStyle.
- * 
- * @ignore
  */
 var Style = Item.extend({
 	initialize: function(style) {

src/text/PointText.js

@@ -14,26 +14,26 @@
  * All rights reserved.
  */
 
-var PointText = this.PointText = TextItem.extend({
+/**
-	/** @lends PointText# */
+ * @name PointText
-
+ * 
+ * @class A PointText item represents a piece of typography in your Paper.js
+ * project which starts from a certain point and extends by the amount of
+ * characters contained in it.
+ * 
+ * @extends TextItem
+ */
+var PointText = this.PointText = TextItem.extend(/** @lends PointText# */{
 	/**
 	 * Creates a point text item
 	 * 
 	 * @param {Point} point the position where the text will start
-	 * @constructs PointText
 	 * 
-	 * @class A PointText item represents a piece of typography in your Paper.js
+	 * @example
-	 * project which starts from a certain point and extends by the amount of
+	 * var text = new PointText(new Point(50, 100));
-	 * characters contained in it.
-	 * 
-	 * @classexample {@paperscript height=100}
-	 * var text = new PointText(258, 60);
 	 * text.justification = 'center';
-	 * text.fontSize = 30;
+	 * text.fillColor = 'black';
-	 * text.content = 'Hello world.';
+	 * text.content = 'The contents of the point text';
-	 * 
-	 * @extends TextItem
 	 */
 	initialize: function(point) {
 		this.base();

src/text/TextItem.js

@@ -14,20 +14,18 @@
  * All rights reserved.
  */
 
-var TextItem = this.TextItem = Item.extend({
+/**
-	/** @lends TextItem# */
+ * @name TextItem
-
+ * 
-	/**
+ * @class The TextItem type allows you to create typography. Its
-	 * @constructs TextItem
+ * functionality is inherited by different text item types such as
-	 * 
+ * {@link PointText}, and {@link AreaText} (coming soon). They each add a
-	 * @class The TextItem type allows you to create typography. Its
+ * layer of functionality that is unique to their type, but share the
-	 * functionality is inherited by different text item types such as
+ * underlying properties and functions that they inherit from TextItem.
-	 * {@link PointText}, and {@link AreaText} (coming soon). They each add a
+ * 
-	 * layer of functionality that is unique to their type, but share the
+ * @extends Item
-	 * underlying properties and functions that they inherit from TextItem.
+ */
-	 * 
+var TextItem = this.TextItem = Item.extend(/** @lends TextItem# */{
-	 * @extends Item
-	 */
 	initialize: function() {
 		this.base();
 		this._content = '';
@@ -48,6 +46,7 @@ var TextItem = this.TextItem = Item.extend({
 	 * 
 	 * // Create a point-text item at {x: 30, y: 30}:
 	 * var text = new PointText(new Point(30, 30));
+	 * text.fillColor = 'black';
 	 * 
 	 * // Set the content of the text item:
 	 * text.content = 'Hello world';
@@ -57,6 +56,7 @@ var TextItem = this.TextItem = Item.extend({
 	 * 
 	 * // Create a point-text item at {x: 30, y: 30}:
 	 * var text = new PointText(new Point(30, 30));
+	 * text.fillColor = 'black';
 	 * 
 	 * text.content = 'Move your mouse over the view, to see its position';
 	 * 
@@ -84,6 +84,8 @@ var TextItem = this.TextItem = Item.extend({
 	},
 
 	/**
+	 * {@grouptitle Style Properties}
+	 * 
 	 * The character style of the text item.
 	 * 
 	 * @type CharacterStyle
@@ -110,60 +112,4 @@ var TextItem = this.TextItem = Item.extend({
 	setParagraphStyle: function(style) {
 		this._paragraphStyle.initialize(style);
 	}
-
-	/**
-	 * {@grouptitle Style Properties}
-	 * The font of the text item.
-	 * 
-	 * @example {@paperscript height=150}
-	 * var textItem = new PointText(new Point(20, 80));
-	 * textItem.content = 'Hello world.';
-	 * textItem.fontSize = 30;
-	 * textItem.font = 'times';
-	 * 
-	 * @name TextItem#font
-	 * @default 'sans-serif'
-	 * @type String
-	 */
-
-	/**
-	 * The font size in points of the text item.
-	 * 
-	 * @name TextItem#fontSize
-	 * @default 10
-	 * @type Number
-	 * 
-	 * @example {@paperscript height=150}
-	 * var textItem = new PointText(new Point(20, 80));
-	 * textItem.content = 'Hello world.';
-	 * textItem.fontSize = 30;
-	 */
-
-	/**
-	 * The justification of the text item.
-	 * 
-	 * @example {@paperscript height=150 split=false}
-	 * // Examples of the different justifications:
-	 * 
-	 * // Create a vertical line that runs from the top center
-	 * // of the view to the bottom center of the view:
-	 * var bounds = view.bounds;
-	 * var path = new Path(bounds.topCenter, bounds.bottomCenter);
-	 * path.strokeColor = 'pink';
-	 * 
-	 * var textItem = new PointText(view.center - [0, 30]);
-	 * textItem.content = 'left justified';
-	 * 
-	 * var textItem2 = new PointText(view.center);
-	 * textItem2.content = 'center justified';
-	 * textItem2.justification = 'center';
-	 * 
-	 * var textItem3 = new PointText(view.center + [0, 30]);
-	 * textItem3.content = 'right justified';
-	 * textItem3.justification = 'right';
-	 * 
-	 * @name TextItem#justification
-	 * @default 'left'
-	 * @type String('left', 'right', 'center')
-	 */
 });

src/tool/Tool.js

@@ -14,45 +14,42 @@
  * All rights reserved.
  */
 
-var Tool = this.Tool = Base.extend({
+/**
-	/** @lends Tool# */
+ * @name Tool
-
+ * 
+ * @class The Tool object refers to a script that the user can interact with
+ * by using the mouse and keyboard and can be accessed through the global
+ * {@code tool} variable. All its properties are also available in the paper
+ * scope.
+ * 
+ * The global {@code tool} variable only exists in scripts that contain mouse
+ * handler functions ({@link #onMouseMove}, {@link #onMouseDown},
+ * {@link #onMouseDrag}, {@link #onMouseUp}) or a keyboard handler
+ * function ({@link #onKeyDown}, {@link #onKeyUp}).
+ * 
+ * @classexample
+ * var path;
+ * 
+ * // Only execute onMouseDrag when the mouse
+ * // has moved at least 10 points:
+ * tool.distanceThreshold = 10;
+ * 
+ * function onMouseDown(event) {
+ * 	// Create a new path every time the mouse is clicked
+ * 	path = new Path();
+ * 	path.add(event.point);
+ * 	path.strokeColor = 'black';
+ * }
+ * 
+ * function onMouseDrag(event) {
+ * 	// Add a point to the path every time the mouse is dragged
+ * 	path.add(event.point);
+ * }
+ */
+var Tool = this.Tool = Base.extend(/** @lends Tool# */{
 	// DOCS: rewrite Tool constructor explanation
 	/**
 	 * Initializes the tool's settings, so a new tool can be assigned to it
-	 * 
-	 * @constructs Tool
-	 * 
-	 * @class The Tool object refers to a script that the user can interact with
-	 * by using the mouse and keyboard and can be accessed through the global
-	 * {@code tool} variable. All its properties are also available in the paper
-	 * scope.
-	 * 
-	 * The global {@code tool} variable only exists in scripts that contain mouse
-	 * handler functions ({@link #onMouseMove}, {@link #onMouseDown},
-	 * {@link #onMouseDrag}, {@link #onMouseUp}) or a keyboard handler
-	 * function ({@link #onKeyDown}, {@link #onKeyUp}).
-	 * 
-	 * Example code:
-	 * <pre>
-	 * var path;
-	 * 
-	 * // Only execute onMouseDrag when the mouse
-	 * // has moved at least 10 points:
-	 * tool.distanceThreshold = 10;
-	 * 
-	 * function onMouseDown(event) {
-	 * 	// Create a new path every time the mouse is clicked
-	 * 	path = new Path();
-	 * 	path.add(event.point);
-	 * 	path.strokeColor = 'black';
-	 * }
-	 * 
-	 * function onMouseDrag(event) {
-	 * 	// Add a point to the path every time the mouse is dragged
-	 * 	path.add(event.point);
-	 * }
-	 * </pre>
 	 */
 	initialize: function(handlers, scope) {
 		this._scope = scope;

src/tool/ToolEvent.js

@@ -14,19 +14,18 @@
  * All rights reserved.
  */
 
-var ToolEvent = this.ToolEvent = Event.extend({
+/**
-	/** @lends ToolEvent# */
+ * @name ToolEvent
-
+ * 
-	/**
+ * @class ToolEvent The ToolEvent object is received by the {@link Tool}'s mouse
-	 * @name ToolEvent
+ * event handlers {@link Tool#onMouseDown}, {@link Tool#onMouseDrag},
-	 * @constructor
+ * {@link Tool#onMouseMove} and {@link Tool#onMouseUp}. The ToolEvent
-	 * 
+ * object is the only parameter passed to these functions and contains
-	 * @class ToolEvent The ToolEvent object is received by the {@link Tool}'s mouse event handlers
+ * information about the mouse event.
-	 * {@link Tool#onMouseDown}, {@link Tool#onMouseDrag},
+ *
-	 * {@link Tool#onMouseMove} and {@link Tool#onMouseUp}. The ToolEvent
+ * @extends Event
-	 * object is the only parameter passed to these functions and contains
+ */
-	 * information about the mouse event.
+var ToolEvent = this.ToolEvent = Event.extend(/** @lends ToolEvent# */{
-	 */
 	initialize: function(tool, type, event) {
 		this.tool = tool;
 		this.type = type;

src/ui/Event.js

@@ -14,7 +14,11 @@
  * All rights reserved.
  */
 
-var Event = this.Event = Base.extend({
+/**
+ * @name Event
+ * @class
+ */
+var Event = this.Event = Base.extend(/** @lends Event# */{
 	initialize: function(event) {
 		this.event = event;
 	},

src/ui/Key.js

@@ -15,8 +15,8 @@
  */
 
 /**
- * @namespace
  * @name Key
+ * @namespace
  */
 var Key = this.Key = new function() {
 	// TODO: Make sure the keys are called the same as in Scriptographer

src/ui/KeyEvent.js

@@ -14,19 +14,18 @@
  * All rights reserved.
  */
 
+/**
+ * @name KeyEvent
+ * 
+ * @class KeyEvent The KeyEvent object is received by the {@link Tool}'s
+ * keyboard handlers {@link Tool#onKeyDown}, {@link Tool#onKeyUp},
+ * The KeyEvent object is the only parameter passed to these functions
+ * and contains information about the keyboard event.
+ *
+ * @extends Event
+ */
 var KeyEvent = this.KeyEvent = Event.extend(new function() {
-	return {
+	return /** @lends KeyEvent# */{
-		/** @lends KeyEvent# */
-
-		/**
-		 * @name KeyEvent
-		 * @constructor
-		 * 
-		 * @class KeyEvent The KeyEvent object is received by the {@link Tool}'s
-		 * keyboard handlers {@link Tool#onKeyDown}, {@link Tool#onKeyUp},
-		 * The KeyEvent object is the only parameter passed to these functions
-		 * and contains information about the keyboard event.
-		 */
 		initialize: function(down, key, character, event) {
 			this.base(event);
 			this.type = down ? 'keydown' : 'keyup';

src/ui/View.js

@@ -14,19 +14,15 @@
  * All rights reserved.
  */
 
-var View = this.View = Base.extend({
+// DOCS: View: there is alot left to document
-	/** @lends View# */
+/**
-
+ * @name View
-	// DOCS: View: there is alot left to document
+ * @class The View object..
-	// TODO: Add bounds parameter that defines position within canvas?
+ */
-	// Find a good name for these bounds, since #bounds is already the artboard
+var View = this.View = Base.extend(/** @lends View# */{
-	// bounds of the visible area.
 	/**
 	 * Creates a view object
 	 * @param {Canvas} canvas
-	 * @constructs View
-	 * 
-	 * @class The View object..
 	 */
 	initialize: function(canvas) {
 		// Associate this view with the active paper scope.