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

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

/*@
Ox.MapImage <f:Ox.Element> MapImage Object
    () ->              <f> MapImage Object
    (options) ->       <f> MapImage Object
    (options, self) -> <f> MapImage Object
    options <o> Options object
        height <n|360> image height (px)
        places <a|o|[]> array of either names (''), points ([0, 0]),
                    or objects ({name, point, highlight})
        type <s|satellite> map type ('hybrid', 'roadmap', 'satellite', 'terrain')
        width <n|640> image width (px)
    self <o> shared private variable
@*/

Ox.MapImage = function(options, self) {

    var self = self || {},
        that = Ox.Element('<img>', self)
            .defaults({
                height: 360,
                markerColorHighlight: 'yellow',
                markerColorNormal: 'blue',
                places: [],
                type: 'satellite',
                width: 640
            })
            .options(options || {})

    Ox.extend(self, {
        markers: {
            highlight: [],
            normal: []
        },
        src: 'http://maps.google.com/maps/api/staticmap?sensor=false' +
                '&size=' + self.options.width + 'x' + self.options.height +
                '&maptype=' + self.options.type
    });

    if (self.options.places.length) {
        self.options.places.forEach(function(place) {
            if (Ox.isString(place)) {
                self.markers.normal.push(place);
            } else if (Ox.isArray(place)) {
                self.markers.normal.push(place.join(','));
            } else {
                self.markers[place.highlight ? 'highlight' : 'normal']
                    .push('point' in place ? place.point.join(',') : place.name)
            }
        });
        Ox.forEach(self.markers, function(markers, k) {
            if (markers.length) {
                self.src += '&markers=icon:' + 'http://dev.pan.do:8000' +
                    Ox.UI.PATH + 'png/marker' +
                    Ox.toTitleCase(self.options['markerColor' + Ox.toTitleCase(k)]) +
                    '.png|' + markers.join('|')
            }
        });
    } else {
        self.src += '&center=0,0&zoom=2'
    }

    that.attr({
        src: self.src
    });

    self.setOption = function(key, value) {
        
    };

    return that;

};