Made Events class more generic; the Events constructor now takes a list of supported application event types. Added tests for the Events class.

git-svn-id: http://svn.openlayers.org/trunk/openlayers@61 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf

lib/OpenLayers/Events.js

@@ -1,41 +1,46 @@
 OpenLayers.Events = Class.create();
 
 OpenLayers.Events.prototype = {
-    // hash of Array(Function)
+    // Array: supported events
-    listeners: null,
-
-    // OpenLayers.Map
-    map: null,
-
-    // DOMElement
-    div: null,
-
-    // supported events
     BROWSER_EVENTS: [
         "mouseover", "mouseout",
         "mousedown", "mouseup", "mousemove", 
         "click", "dblclick"
     ],
-    MAP_EVENTS: [ 
+
-        "mouseover", "mouseout", 
+    // hash of Array(Function): events listener functions
-        "mousedown", "mouseup", "mousemove",
+    listeners: null,
-        "click", "dblclick"
+
-    ],
+    // Object: the code object issuing application events
+    object: null,
+
+    // DOMElement: the DOM element receiving browser events
+    div: null,
+
+    // Array: list of support application events
+    eventTypes: null,
 
     /**
     * @param {OpenLayers.Map} map
     * @param {DOMElement} div
     */
-    initialize: function (map, div) {
+    initialize: function (object, div, eventTypes) {
-        this.listeners = {};
+        this.listeners  = {};
-        this.map      = map;
+        this.object     = object;
-        this.div      = div;
+        this.div        = div;
-        for (var i = 0; i < this.MAP_EVENTS.length; i++) {
+        this.eventTypes = eventTypes;
-            this.listeners[ this.MAP_EVENTS[i] ] = [];
+        for (var i = 0; i < this.eventTypes.length; i++) {
+            // create a listener list for every custom application event
+            this.listeners[ this.eventTypes[i] ] = [];
         }
         for (var i = 0; i < this.BROWSER_EVENTS.length; i++) {
-            var eventName = this.BROWSER_EVENTS[i];
+            var eventType = this.BROWSER_EVENTS[i];
-            Event.observe(div, eventName, 
+
+            // every browser event has a corresponding application event 
+            // (whether it's listened for or not).
+            this.listeners[ eventType ] = [];
+
+            Event.observe(div, eventType, 
                 this.handleBrowserEvent.bindAsEventListener(this));
         }
     },
@@ -55,7 +60,7 @@ OpenLayers.Events.prototype = {
     */
     handleBrowserEvent: function (evt) {
         evt.xy = this.getMousePosition(evt); 
-        this.triggerMapEvent(evt.type, evt)
+        this.triggerEvent(evt.type, evt)
     },
 
     /**
@@ -74,8 +79,11 @@ OpenLayers.Events.prototype = {
     * @param {str} type
     * @param {event} evt
     */
-    triggerMapEvent: function (type, evt) {
+    triggerEvent: function (type, evt) {
-        evt.map = this.map;
+        if (evt == null) {
+            evt = {};
+        }
+        evt.object = this.object;
 
         var listeners = this.listeners[type];
         for (var i = 0; i < listeners.length; i++) {

lib/OpenLayers/Map.js

@@ -9,6 +9,13 @@ OpenLayers.Map.prototype = {
     // Hash: base z-indexes for different classes of thing 
     Z_INDEX_BASE: { Layer: 100, Popup: 200, Control: 250 },
 
+    // Array: supported application event types
+    EVENT_TYPES: [ 
+        "addlayer", "removelayer", "movestart", "move", "moveend",
+        "zoomend", "layerchanged", "popupopen", "popupclose",
+        "addmarker", "removemarker", "clearmarkers", "mouseover",
+        "mouseout", "mousemove", "dragstart", "drag", "dragend" ],
+
     // int: zoom levels, used to draw zoom dragging control and limit zooming
     maxZoomLevel: 16,
 
@@ -56,7 +63,7 @@ OpenLayers.Map.prototype = {
     initialize: function (div, options) {
         Object.extend(this, options);
 
-        this.div = $(div);
+        this.div = div = $(div);
 
         this.viewPortDiv = OpenLayers.Util.createDiv(
                                 div.id + "_OpenLayers_ViewPort" );
@@ -75,12 +82,13 @@ OpenLayers.Map.prototype = {
                                 div.id + "_OpenLayers_Container" );
         this.viewPortDiv.appendChild(this.layerContainerDiv);
 
+        this.events = new OpenLayers.Events(this, div, this.EVENT_TYPES);
+
         this.layers = [];
         
         this.controls = [];
         this.addControl( new OpenLayers.Control.PanZoom() );
 
-        this.events = new OpenLayers.Events(this, div);
         this.events.register( "dblclick", this, this.defaultDblClick );
         this.events.register( "mousedown", this, this.defaultMouseDown );
         this.events.register( "mouseup", this, this.defaultMouseUp );

tests/list-tests.html

@@ -2,6 +2,7 @@
     <li>test_LatLon.html</li>
     <li>test_Pixel.html</li>
     <li>test_Bounds.html</li>
+    <li>test_Events.html</li>
     <li>test_Layer.html</li>
     <li>test_Control.html</li>
     <li>test_Map.html</li>

tests/test_Events.html

@@ -0,0 +1,42 @@
+<html>
+<head>
+  <script src="../lib/OpenLayers.js"></script>
+  <script type="text/javascript"><!--
+    var map; 
+    function test_01_Events_constructor (t) {
+	t.plan( 18 );
+        var obj = {result: 0}, eventTypes = ["doThingA", "doThingB", "doThingC"];
+	events = new OpenLayers.Events(obj, $('map'), eventTypes);
+	t.ok( events instanceof OpenLayers.Events, "new OpenLayers.Control returns object" );
+        t.ok( events.div instanceof HTMLDivElement, "events.div isa HTMLDivElement" );
+        t.ok( events.object === obj, "events.object is the object we passed" );
+
+        var builtin = OpenLayers.Events.prototype.BROWSER_EVENTS;
+        for (var i = 0; i < builtin.length; i++) {
+            t.ok( events.listeners[builtin[i]] instanceof Array, 
+                    builtin[i] + " builtin listener isa Array" );
+        }
+        for (var i = 0; i < eventTypes.length; i++) {
+            t.ok( events.listeners[eventTypes[i]] instanceof Array, 
+                    eventTypes[i] + " custom listener isa Array" );
+        }
+
+        t.eq( events.listeners["this doesn't exist"], null, "undefined event handler is none" );
+
+        var func = function () { this.result++ }
+        events.register( "doThingA", obj, func );
+        t.eq( events.listeners["doThingA"].length, 1, "register correctly sets event.listener" );
+
+        t.eq( obj.result, 0, "result is 0 before we call triggerEvent" );
+        events.triggerEvent("doThingA", {});
+        t.eq( obj.result, 1, "result is 1 after we call triggerEvent" );
+        events.triggerEvent("doThingA");
+        t.eq( obj.result, 2, "result is 2 after we call triggerEvent with no event" );
+    }
+  // -->
+  </script>
+</head>
+<body>
+    <div id="map" style="width: 1024px; height: 512px;"/>
+</body>
+</html>