modularize oxui

source/js/Ox.MapRectangle.js

@@ -0,0 +1,88 @@
+Ox.MapRectangle = function(options, self) {
+
+    var options = Ox.extend({
+            map: null,
+            place: null
+        }, options),
+        that = this;
+
+    Ox.forEach(options, function(val, key) {
+        that[key] = val;
+    });
+
+    that.rectangle = new google.maps.Rectangle({
+        clickable: true,
+        bounds: that.place.bounds,
+    });
+    that.markers = Ox.map(that.place.points, function(point, position) {
+        return new Ox.MapRectangleMarker({
+            map: that.map,
+            place: that.place,
+            position: position
+        });
+    });
+
+    setOptions();
+
+    function click() {
+        if (that.map.options('editable') && that.place.editable && !that.place.editing) {
+            that.place.edit();
+        } else if (that.map.getKey() == 'meta') {
+            that.place.submit();
+        } else if (that.map.getKey() == 'shift') {
+            that.map.zoomToPlace();
+        } else {
+            that.map.panToPlace();
+        }
+    }
+
+    function setOptions() {
+        var color = that.place.editing ? '#8080FF' : '#FFFFFF';
+        that.rectangle.setOptions({
+            fillColor: color,
+            fillOpacity: that.place.editing ? 0.1 : 0,
+            strokeColor: color,
+            strokeOpacity: 1,
+            strokeWeight: 2
+        })
+    }
+
+    that.add = function() {
+        that.rectangle.setMap(that.map.map);
+        google.maps.event.addListener(that.rectangle, 'click', click);
+        return that;
+    };
+
+    that.deselect = function() {
+        setOptions();
+        Ox.print('MARKERS', that.markers)
+        Ox.forEach(that.markers, function(marker) {
+            marker.remove();
+        });
+    };
+
+    that.remove = function() {
+        that.rectangle.setMap(null);
+        google.maps.event.clearListeners(that.rectangle);
+        return that
+    }
+
+    that.select = function() {
+        setOptions();
+        Ox.forEach(that.markers, function(marker) {
+            marker.add();
+        });
+    };
+
+    that.update = function() {
+        that.rectangle.setOptions({
+            bounds: that.place.bounds
+        });
+        Ox.forEach(that.markers, function(marker) {
+            marker.update();
+        });
+    }
+
+    return that;
+    
+};