oxjs/source/Ox.UI/js/Map/Ox.MapRectangleMarker.js

// vim: et:ts=4:sw=4:sts=4:ft=js

/*@
Ox.MapRectangleMarker <f> MapRectangleMarker Object
    () ->              <f> MapRectangleMarker Object
    (options) ->       <f> MapRectangleMarker Object
    (options, self) -> <f> MapRectangleMarker Object
    options <o> Options object
        map <o|null> map
        place <o|null> place
        position <s|''>
    self    <o> shared private variable
@*/

Ox.MapRectangleMarker = function(options, self) {

    options = Ox.extend({
        map: null,
        place: null,
        position: ''
    }, options);

    var that = this;

    Ox.forEach(options, function(val, key) {
        that[key] = val;
    });

    that.markerImage = new google.maps.MarkerImage
    that.marker = new google.maps.Marker({
        cursor: that.position + '-resize',
        draggable: true,
        icon: Ox.MapMarkerImage({
            mode: 'editing',
            type: 'rectangle'
        }),
        position: that.place.points[that.position],
        raiseOnDrag: false
    });

    function dragstart(e) {
        that.drag = {
            lat: e.latLng.lat(),
            lng: e.latLng.lng()
        };
    }

    function drag(e) {
        // fixme: implement shift+drag (center stays the same)
        Ox.print(e.pixel.x, e.pixel.y)
        var lat = Ox.limit(e.latLng.lat(), Ox.MIN_LATITUDE, Ox.MAX_LATITUDE),
            lng = e.latLng.lng();
        that.drag = {
            lat: lat,
            lng: lng
        };
        if (that.position.indexOf('s') > -1) {
            that.place.south = lat;
        }
        if (that.position.indexOf('n') > -1) {
            that.place.north = lat;
        }
        if (that.position.indexOf('w') > -1) {
            that.place.west = lng;
        }
        if (that.position.indexOf('e') > -1) {
            that.place.east = lng;
        }
        Ox.print('west', that.place.west, 'east', that.place.east);
        Ox.print('south', that.place.south, 'north', that.place.north);            
        that.place.update();
        that.place.marker.update();
        that.place.rectangle.update();
    }

    function dragend(e) {
        var south;
        if (that.place.south > that.place.north) {
            south = that.place.south;
            that.place.south = that.place.north;
            that.place.north = south;
            that.place.update();
            that.place.marker.update();
            that.place.rectangle.update();
        }
        that.map.triggerEvent('changeplaceend', that.place);
    }

    /*@
    add <f> add
    @*/
    that.add = function() {
        that.marker.setMap(that.map.map);
        google.maps.event.addListener(that.marker, 'dragstart', dragstart);
        google.maps.event.addListener(that.marker, 'drag', drag);
        google.maps.event.addListener(that.marker, 'dragend', dragend);
    };

    /*@
    remove <f> remove
    @*/
    that.remove = function() {
        that.marker.setMap(null);
        google.maps.event.clearListeners(that.marker);
    };

    /*@
    update <f> update
    @*/
    that.update = function() {
        that.marker.setOptions({
            position: that.place.points[that.position]
        });
    };

    return that;

};