Rename Event -> DomEvent and Element -> DomElement, to be more specific and not clash with other classes, e.g. a future base class for ToolEvent and KeyEvent.

examples/Animated/AnimatedStar.html

@@ -44,7 +44,7 @@
 		}
 		
 		// Reposition the paths whenever the window is resized:
-		Event.add(window, {
+		DomEvent.add(window, {
 			resize: function(event) {
 				document.activeLayer.position = document.bounds.center;
 			}

examples/Animated/Flock.html

@@ -11,7 +11,7 @@
 		// http://processing.org/learning/topics/flocking.html
 		
 		// Reposition the heart path whenever the window is resized:
-		Event.add(window, {
+		DomEvent.add(window, {
 			resize: function(event) {
 				size = document.size;
 				heartPath.position = document.bounds.center;

examples/Animated/RadialRainbows.html

@@ -64,7 +64,7 @@
 			gradientColor.hilite = mouseDown ? point : point + vector;
 		}
 		
-		Event.add(window, {
+		DomEvent.add(window, {
 			resize: function(event) {
 				point = new Point(document.size) / 2;
 				path.bounds = document.bounds;

examples/Animated/Smoothing.html

@@ -59,7 +59,7 @@
 		}
 		
 		// Reposition the path whenever the window is resized:
-		Event.add(window, {
+		DomEvent.add(window, {
 			resize: function(event) {
 				initializePath();
 				onFrame();

src/browser/DomElement.js

@@ -14,7 +14,7 @@
  * All rights reserved.
  */
 
-var Element = new function() {
+var DomElement = new function() {
 	function cumulate(el, name, parent) {
 		var left = name + 'Left',
 			top = name + 'Top',
@@ -41,8 +41,8 @@ var Element = new function() {
 		},
 
 		getBounds: function(el, scroll) {
-			return new Rectangle(Element.getOffset(el, scroll),
-					Element.getSize(el));
+			return new Rectangle(DomElement.getOffset(el, scroll),
+					DomElement.getSize(el));
 		},
 
 		getWindowSize: function() {
@@ -58,8 +58,8 @@ var Element = new function() {
 		isVisible: function(el) {
 			// See if the scrolled bounds intersect with the windows rectangle
 			// which always starts at 0, 0
-			return new Rectangle([0, 0], Element.getWindowSize())
-					.intersects(Element.getBounds(el, true));
+			return new Rectangle([0, 0], DomElement.getWindowSize())
+					.intersects(DomElement.getBounds(el, true));
 		}
 	};
 };

src/browser/DomEvent.js

@@ -14,7 +14,7 @@
  * All rights reserved.
  */
 
-var Event = {
+var DomEvent = {
 	add: function(el, events) {
 		for (var type in events) {
 			var func = events[type];
@@ -60,12 +60,12 @@ var Event = {
 
 	getOffset: function(event) {
 		// Remove target offsets from page coordinates
-		return Event.getPoint(event).subtract(
-				Element.getOffset(Event.getElement(event), true));
+		return DomEvent.getPoint(event).subtract(
+				DomElement.getOffset(DomEvent.getElement(event), true));
 	}
 };
 
-Event.requestAnimationFrame = new function() {
+DomEvent.requestAnimationFrame = new function() {
 	var part = 'equestAnimationFrame',
 		request = window['r' + part] || window['webkitR' + part]
 			|| window['mozR' + part] || window['oR' + part]
@@ -100,7 +100,7 @@ Event.requestAnimationFrame = new function() {
 				var entry = callbacks[i],
 					func = entry[0],
 					element = entry[1];
-				if (!element || Element.isVisible(element)) {
+				if (!element || DomElement.isVisible(element)) {
 					// Handle callback and remove it from callbacks list.
 					callbacks.splice(i, 1);
 					func(+new Date);
@@ -110,7 +110,7 @@ Event.requestAnimationFrame = new function() {
 	}
 
 	if (!paper.debug) {
-		Event.add(window, {
+		DomEvent.add(window, {
 			focus: function() {
 				focused = true;
 				// Switch to falst checkCallback calls while window is focused.

src/document/Document.js

@@ -30,15 +30,15 @@ var Document = this.Document = Base.extend({
 				//	margin: 0;
 				//	overflow: hidden;
 				// }
-				this._size = Element.getWindowSize()
-						.subtract(Element.getOffset(this.canvas));
+				this._size = DomElement.getWindowSize()
+						.subtract(DomElement.getOffset(this.canvas));
 				this.canvas.width = this._size.width;
 				this.canvas.height = this._size.height;
 				var that = this;
-				Event.add(window, {
+				DomEvent.add(window, {
 					resize: function(event) {
-						that.setSize(Element.getWindowSize()
-								.subtract(Element.getOffset(that.canvas)));
+						that.setSize(DomElement.getWindowSize()
+								.subtract(DomElement.getOffset(that.canvas)));
 						that.redraw();
 					}
 				});
@@ -72,7 +72,7 @@ var Document = this.Document = Base.extend({
 			// Align top-left to the canvas
 			var element = this.stats.domElement,
 				style = element.style,
-				offset = Element.getOffset(this.canvas);
+				offset = DomElement.getOffset(this.canvas);
 			style.position = 'absolute';
 			style.left = offset.x + 'px';
 			style.top = offset.y + 'px';

src/load.js

@@ -66,8 +66,8 @@ var sources = [
 	'src/tool/ToolHandler.js',
 	'src/tool/Tool.js',
 
-	'src/browser/Element.js',
-	'src/browser/Event.js',
+	'src/browser/DomElement.js',
+	'src/browser/DomEvent.js',
 
 	'src/util/CanvasProvider.js',
 	'src/util/Numerical.js',

src/paper.js

@@ -163,8 +163,8 @@ Base.inject({
 //#include "tool/Tool.js"
 
 //#ifdef BROWSER
-//#include "browser/Element.js"
-//#include "browser/Event.js"
+//#include "browser/DomElement.js"
+//#include "browser/DomEvent.js"
 //#endif // BROWSER
 
 //#include "util/CanvasProvider.js"

src/tool/Tool.js

@@ -16,9 +16,8 @@
 
 var Tool = this.Tool = ToolHandler.extend(new function() {
 	function viewToArtwork(event, document) {
-		var point = Event.getOffset(event);
 		// TODO: always the active view?
-		return document.activeView.viewToArtwork(point);
+		return document.activeView.viewToArtwork(DomEvent.getOffset(event));
 	};
 
 	return {
@@ -91,9 +90,9 @@ var Tool = this.Tool = ToolHandler.extend(new function() {
 
 			// Remove old events first.
 			if (this._document)
-				Event.remove(this._document.canvas, this.events);
+				DomEvent.remove(this._document.canvas, this.events);
 			this._document = doc;
-			Event.add(doc.canvas, this.events);
+			DomEvent.add(doc.canvas, this.events);
 		},
 
 		getDocument: function() {

src/tool/ToolEvent.js

@@ -35,9 +35,9 @@ var ToolEvent = this.ToolEvent = Base.extend({
 	beans: true,
 
 	initialize: function(tool, type, event) {
-		this.event = event;
 		this.tool = tool;
 		this.type = type;
+		this.event = event;
 	},
 	
 	toString: function() {

src/util/PaperScript.js

@@ -152,12 +152,12 @@ var PaperScript = this.PaperScript = new function() {
 				if (onFrame) {
 					function frame() {
 						// Request next frame already
-						Event.requestAnimationFrame(frame, doc && doc.canvas);
+						DomEvent.requestAnimationFrame(frame, doc && doc.canvas);
 						onFrame();
 						// Automatically redraw document each frame.
 						doc && doc.redraw();
 					}
-					Event.requestAnimationFrame(frame, doc && doc.canvas);
+					DomEvent.requestAnimationFrame(frame, doc && doc.canvas);
 				}
 			} catch (e) {
 			}
@@ -209,7 +209,7 @@ var PaperScript = this.PaperScript = new function() {
 		}
 	}
 
-	Event.add(window, { load: load });
+	DomEvent.add(window, { load: load });
 
 	return {
 		compile: compile,