513 lines
		
	
	
		
			17 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
			
		
		
	
	
			513 lines
		
	
	
		
			17 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
mxn.register('openlayers', {	
 | 
						|
 | 
						|
    Mapstraction: {
 | 
						|
 | 
						|
        init: function(element, api){
 | 
						|
            var me = this;
 | 
						|
            this.maps[api] = new OpenLayers.Map(
 | 
						|
                element.id,
 | 
						|
                {
 | 
						|
                    maxExtent: new OpenLayers.Bounds(-20037508.34,-20037508.34,20037508.34,20037508.34),
 | 
						|
                    maxResolution:156543,
 | 
						|
                    numZoomLevels:18,
 | 
						|
                    units:'meters',
 | 
						|
                    projection: "EPSG:41001"
 | 
						|
                }
 | 
						|
            );
 | 
						|
 | 
						|
            this.layers['osmmapnik'] = new OpenLayers.Layer.TMS(
 | 
						|
                'OSM Mapnik',
 | 
						|
                [
 | 
						|
                "http://a.tile.openstreetmap.org/",
 | 
						|
                "http://b.tile.openstreetmap.org/",
 | 
						|
                "http://c.tile.openstreetmap.org/"
 | 
						|
                ],
 | 
						|
                {
 | 
						|
                    type:'png',
 | 
						|
                    getURL: function (bounds) {
 | 
						|
                        var res = this.map.getResolution();
 | 
						|
                        var x = Math.round ((bounds.left - this.maxExtent.left) / (res * this.tileSize.w));
 | 
						|
                        var y = Math.round ((this.maxExtent.top - bounds.top) / (res * this.tileSize.h));
 | 
						|
                        var z = this.map.getZoom();
 | 
						|
                        var limit = Math.pow(2, z);
 | 
						|
                        if (y < 0 || y >= limit) {
 | 
						|
                            return null;
 | 
						|
                        } else {
 | 
						|
                            x = ((x % limit) + limit) % limit;
 | 
						|
                            var path = z + "/" + x + "/" + y + "." + this.type;
 | 
						|
                            var url = this.url;
 | 
						|
                            if (url instanceof Array) {
 | 
						|
                                url = this.selectUrl(path, url);
 | 
						|
                            }
 | 
						|
                            return url + path;
 | 
						|
                        }
 | 
						|
                    },
 | 
						|
                    displayOutsideMaxExtent: true
 | 
						|
                }
 | 
						|
            );
 | 
						|
 | 
						|
            this.layers['osm'] = new OpenLayers.Layer.TMS(
 | 
						|
                'OSM',
 | 
						|
                [
 | 
						|
                "http://a.tah.openstreetmap.org/Tiles/tile.php/",
 | 
						|
                "http://b.tah.openstreetmap.org/Tiles/tile.php/",
 | 
						|
                "http://c.tah.openstreetmap.org/Tiles/tile.php/"
 | 
						|
                ],
 | 
						|
                {
 | 
						|
                    type:'png',
 | 
						|
                    getURL: function (bounds) {
 | 
						|
                        var res = this.map.getResolution();
 | 
						|
                        var x = Math.round ((bounds.left - this.maxExtent.left) / (res * this.tileSize.w));
 | 
						|
                        var y = Math.round ((this.maxExtent.top - bounds.top) / (res * this.tileSize.h));
 | 
						|
                        var z = this.map.getZoom();
 | 
						|
                        var limit = Math.pow(2, z);
 | 
						|
                        if (y < 0 || y >= limit) {
 | 
						|
                            return null;
 | 
						|
                        } else {
 | 
						|
                            x = ((x % limit) + limit) % limit;
 | 
						|
                            var path = z + "/" + x + "/" + y + "." + this.type;
 | 
						|
                            var url = this.url;
 | 
						|
                            if (url instanceof Array) {
 | 
						|
                                url = this.selectUrl(path, url);
 | 
						|
                            }
 | 
						|
                            return url + path;
 | 
						|
                        }
 | 
						|
                    },
 | 
						|
                    displayOutsideMaxExtent: true
 | 
						|
                }
 | 
						|
            );
 | 
						|
 | 
						|
            this.maps[api].addLayer(this.layers['osmmapnik']);
 | 
						|
            this.maps[api].addLayer(this.layers['osm']);
 | 
						|
        },
 | 
						|
 | 
						|
        applyOptions: function(){
 | 
						|
            // var map = this.maps[this.api];
 | 
						|
            // var myOptions = [];
 | 
						|
            // if (this.options.enableDragging) {
 | 
						|
            //     myOptions.draggable = true;
 | 
						|
            // } 
 | 
						|
            // if (this.options.enableScrollWheelZoom){
 | 
						|
            //     myOptions.scrollwheel = true;
 | 
						|
            // } 
 | 
						|
            // map.setOptions(myOptions);
 | 
						|
        },
 | 
						|
 | 
						|
        resizeTo: function(width, height){	
 | 
						|
            this.currentElement.style.width = width;
 | 
						|
            this.currentElement.style.height = height;
 | 
						|
            this.maps[this.api].updateSize();
 | 
						|
        },
 | 
						|
 | 
						|
        addControls: function( args ) {
 | 
						|
            var map = this.maps[this.api];	
 | 
						|
            // FIXME: OpenLayers has a bug removing all the controls says crschmidt
 | 
						|
            for (var i = map.controls.length; i>1; i--) {
 | 
						|
                map.controls[i-1].deactivate();
 | 
						|
                map.removeControl(map.controls[i-1]);
 | 
						|
            }
 | 
						|
            if ( args.zoom == 'large' )      {
 | 
						|
                map.addControl(new OpenLayers.Control.PanZoomBar());
 | 
						|
            }
 | 
						|
            else if ( args.zoom == 'small' ) {
 | 
						|
                map.addControl(new OpenLayers.Control.ZoomPanel());
 | 
						|
                if ( args.pan) {
 | 
						|
                    map.addControl(new OpenLayers.Control.PanPanel()); 
 | 
						|
                }
 | 
						|
            }
 | 
						|
            else {
 | 
						|
                if ( args.pan){
 | 
						|
                    map.addControl(new OpenLayers.Control.PanPanel()); 
 | 
						|
                }
 | 
						|
            }
 | 
						|
            if ( args.overview ) {
 | 
						|
                map.addControl(new OpenLayers.Control.OverviewMap());
 | 
						|
            }
 | 
						|
            if ( args.map_type ) {
 | 
						|
                map.addControl(new OpenLayers.Control.LayerSwitcher());
 | 
						|
            }
 | 
						|
        },
 | 
						|
 | 
						|
        addSmallControls: function() {
 | 
						|
            var map = this.maps[this.api];
 | 
						|
            this.addControlsArgs.pan = false;
 | 
						|
            this.addControlsArgs.scale = false;                        
 | 
						|
            this.addControlsArgs.zoom = 'small';
 | 
						|
            map.addControl(new OpenLayers.Control.ZoomBox());
 | 
						|
            map.addControl(new OpenLayers.Control.LayerSwitcher({
 | 
						|
                'ascending':false
 | 
						|
            }));            
 | 
						|
        },
 | 
						|
 | 
						|
        addLargeControls: function() {
 | 
						|
            var map = this.maps[this.api];
 | 
						|
            map.addControl(new OpenLayers.Control.PanZoomBar());
 | 
						|
            this.addControlsArgs.pan = true;
 | 
						|
            this.addControlsArgs.zoom = 'large';
 | 
						|
        },
 | 
						|
 | 
						|
        addMapTypeControls: function() {
 | 
						|
            var map = this.maps[this.api];
 | 
						|
            map.addControl( new OpenLayers.Control.LayerSwitcher({
 | 
						|
                'ascending':false
 | 
						|
            }) );
 | 
						|
            this.addControlsArgs.map_type = true;
 | 
						|
        },
 | 
						|
 | 
						|
        setCenterAndZoom: function(point, zoom) { 
 | 
						|
            var map = this.maps[this.api];
 | 
						|
            var pt = point.toProprietary(this.api);
 | 
						|
            map.setCenter(point.toProprietary(this.api), zoom);
 | 
						|
        },
 | 
						|
 | 
						|
        addMarker: function(marker, old) {
 | 
						|
            var map = this.maps[this.api];
 | 
						|
            var pin = marker.toProprietary(this.api);
 | 
						|
            if (!this.layers['markers']) {
 | 
						|
                this.layers['markers'] = new OpenLayers.Layer.Markers('markers');
 | 
						|
                map.addLayer(this.layers['markers']);
 | 
						|
            }
 | 
						|
            this.layers['markers'].addMarker(pin);
 | 
						|
 | 
						|
            return pin;
 | 
						|
        },
 | 
						|
 | 
						|
        removeMarker: function(marker) {
 | 
						|
            var map = this.maps[this.api];
 | 
						|
            var pin = marker.toProprietary(this.api);
 | 
						|
            this.layers['markers'].removeMarker(pin);
 | 
						|
            pin.destroy();
 | 
						|
 | 
						|
        },
 | 
						|
 | 
						|
        removeAllMarkers: function() {
 | 
						|
            var map = this.maps[this.api];
 | 
						|
 | 
						|
            // TODO: Add provider code
 | 
						|
        },
 | 
						|
 | 
						|
        declutterMarkers: function(opts) {
 | 
						|
            var map = this.maps[this.api];
 | 
						|
 | 
						|
            // TODO: Add provider code
 | 
						|
        },
 | 
						|
 | 
						|
        addPolyline: function(polyline, old) {
 | 
						|
            var map = this.maps[this.api];
 | 
						|
            var pl = polyline.toProprietary(this.api);
 | 
						|
 | 
						|
            if (!this.layers['polylines']) {
 | 
						|
                this.layers['polylines'] = new OpenLayers.Layer.Vector('polylines');
 | 
						|
                map.addLayer(this.layers['polylines']);
 | 
						|
            }
 | 
						|
            polyline.setChild(pl);
 | 
						|
            this.layers['polylines'].addFeatures([pl]);
 | 
						|
            return pl;
 | 
						|
        },
 | 
						|
 | 
						|
        removePolyline: function(polyline) {
 | 
						|
            var map = this.maps[this.api];
 | 
						|
            var pl = polyline.toProprietary(this.api);
 | 
						|
            this.layers['polylines'].removeFeatures([pl]);
 | 
						|
        },
 | 
						|
        removeAllPolylines: function() {
 | 
						|
            var olpolylines = [];
 | 
						|
            for(var i = 0, length = this.polylines.length; i < length; i++){
 | 
						|
                olpolylines.push(this.polylines[i].toProprietary(this.api));
 | 
						|
            }
 | 
						|
            if (this.layers['polylines']) this.layers['polylines'].removeFeatures(olpolylines);            
 | 
						|
        },
 | 
						|
 | 
						|
        getCenter: function() {
 | 
						|
            var map = this.maps[this.api];
 | 
						|
            pt = map.getCenter();
 | 
						|
            return new mxn.LatLonPoint(pt.lat, pt.lon);
 | 
						|
        },
 | 
						|
 | 
						|
        setCenter: function(point, options) {
 | 
						|
            var map = this.maps[this.api];
 | 
						|
            var pt = point.toProprietary(this.api);
 | 
						|
            map.setCenter(pt);
 | 
						|
            
 | 
						|
        },
 | 
						|
 | 
						|
        setZoom: function(zoom) {
 | 
						|
            var map = this.maps[this.api];
 | 
						|
            map.zoomTo(zoom);
 | 
						|
        },
 | 
						|
 | 
						|
        getZoom: function() {
 | 
						|
            var map = this.maps[this.api];
 | 
						|
            return map.zoom;
 | 
						|
        },
 | 
						|
 | 
						|
        getZoomLevelForBoundingBox: function( bbox ) {
 | 
						|
            var map = this.maps[this.api];
 | 
						|
            // throw 'Not implemented';
 | 
						|
            return zoom;
 | 
						|
        },
 | 
						|
 | 
						|
        setMapType: function(type) {
 | 
						|
            var map = this.maps[this.api];
 | 
						|
            throw 'Not implemented (setMapType)';
 | 
						|
 | 
						|
            // switch(type) {
 | 
						|
            //     case mxn.Mapstraction.ROAD:
 | 
						|
            //     map.setMapTypeId(google.maps.MapTypeId.ROADMAP);
 | 
						|
            //     break;
 | 
						|
            //     case mxn.Mapstraction.SATELLITE:
 | 
						|
            //     map.setMapTypeId(google.maps.MapTypeId.SATELLITE);
 | 
						|
            //     break;
 | 
						|
            //     case mxn.Mapstraction.HYBRID:
 | 
						|
            //     map.setMapTypeId(google.maps.MapTypeId.HYBRID);
 | 
						|
            //     break;
 | 
						|
            //     default:
 | 
						|
            //     map.setMapTypeId(google.maps.MapTypeId.ROADMAP);
 | 
						|
            // }	 
 | 
						|
        },
 | 
						|
 | 
						|
        getMapType: function() {
 | 
						|
            var map = this.maps[this.api];
 | 
						|
            // TODO: implement actual layer support
 | 
						|
            return mxn.Mapstraction.ROAD;
 | 
						|
 | 
						|
            // var type = map.getMapTypeId();
 | 
						|
            // switch(type) {
 | 
						|
            //     case google.maps.MapTypeId.ROADMAP:
 | 
						|
            //     return mxn.Mapstraction.ROAD;
 | 
						|
            //     case google.maps.MapTypeId.SATELLITE:
 | 
						|
            //     return mxn.Mapstraction.SATELLITE;
 | 
						|
            //     case google.maps.MapTypeId.HYBRID:
 | 
						|
            //     return mxn.Mapstraction.HYBRID;
 | 
						|
            //     //case google.maps.MapTypeId.TERRAIN:
 | 
						|
            //     //        return something;
 | 
						|
            //     default:
 | 
						|
            //     return null;
 | 
						|
            // }
 | 
						|
        },
 | 
						|
 | 
						|
        getBounds: function () {
 | 
						|
            var map = this.maps[this.api];
 | 
						|
            var olbox = map.calculateBounds();
 | 
						|
            return new mxn.BoundingBox(olbox.bottom, olbox.left, olbox.top, olbox.right);            
 | 
						|
        },
 | 
						|
 | 
						|
        setBounds: function(bounds){
 | 
						|
            var map = this.maps[this.api];
 | 
						|
            var sw = bounds.getSouthWest();
 | 
						|
            var ne = bounds.getNorthEast();
 | 
						|
 | 
						|
            if(sw.lon > ne.lon) {
 | 
						|
                sw.lon -= 360;
 | 
						|
            }
 | 
						|
 | 
						|
            var obounds = new OpenLayers.Bounds();
 | 
						|
            
 | 
						|
            obounds.extend(new mxn.LatLonPoint(sw.lat,sw.lon).toProprietary(this.api));
 | 
						|
            obounds.extend(new mxn.LatLonPoint(ne.lat,ne.lon).toProprietary(this.api));
 | 
						|
            map.zoomToExtent(obounds);
 | 
						|
        },
 | 
						|
 | 
						|
        addImageOverlay: function(id, src, opacity, west, south, east, north, oContext) {
 | 
						|
            var map = this.maps[this.api];
 | 
						|
 | 
						|
            // TODO: Add provider code
 | 
						|
        },
 | 
						|
 | 
						|
        setImagePosition: function(id, oContext) {
 | 
						|
            var map = this.maps[this.api];
 | 
						|
            var topLeftPoint; var bottomRightPoint;
 | 
						|
 | 
						|
            // TODO: Add provider code
 | 
						|
 | 
						|
            //oContext.pixels.top = ...;
 | 
						|
            //oContext.pixels.left = ...;
 | 
						|
            //oContext.pixels.bottom = ...;
 | 
						|
            //oContext.pixels.right = ...;
 | 
						|
        },
 | 
						|
 | 
						|
        addOverlay: function(url, autoCenterAndZoom) {
 | 
						|
            var map = this.maps[this.api];
 | 
						|
 | 
						|
            // TODO: Add provider code
 | 
						|
 | 
						|
        },
 | 
						|
 | 
						|
        addTileLayer: function(tile_url, opacity, copyright_text, min_zoom, max_zoom) {
 | 
						|
            var map = this.maps[this.api];
 | 
						|
 | 
						|
            // TODO: Add provider code
 | 
						|
        },
 | 
						|
 | 
						|
        toggleTileLayer: function(tile_url) {
 | 
						|
            var map = this.maps[this.api];
 | 
						|
 | 
						|
            // TODO: Add provider code
 | 
						|
        },
 | 
						|
 | 
						|
        getPixelRatio: function() {
 | 
						|
            var map = this.maps[this.api];
 | 
						|
 | 
						|
            // TODO: Add provider code	
 | 
						|
        },
 | 
						|
 | 
						|
        mousePosition: function(element) {
 | 
						|
            var map = this.maps[this.api];
 | 
						|
 | 
						|
            // TODO: Add provider code	
 | 
						|
        }
 | 
						|
    },
 | 
						|
 | 
						|
    LatLonPoint: {
 | 
						|
 | 
						|
        toProprietary: function() {
 | 
						|
            var ollon = this.lon * 20037508.34 / 180;
 | 
						|
            var ollat = Math.log(Math.tan((90 + this.lat) * Math.PI / 360)) / (Math.PI / 180);
 | 
						|
            ollat = ollat * 20037508.34 / 180;
 | 
						|
            return new OpenLayers.LonLat(ollon, ollat);            
 | 
						|
        },
 | 
						|
 | 
						|
        fromProprietary: function(olPoint) {
 | 
						|
            var lon = (olPoint.lon / 20037508.34) * 180;
 | 
						|
            var lat = (olPoint.lat / 20037508.34) * 180;
 | 
						|
            lat = 180/Math.PI * (2 * Math.atan(Math.exp(lat * Math.PI / 180)) - Math.PI / 2);
 | 
						|
            this.lon = lon;
 | 
						|
            this.lat = lat;
 | 
						|
        }
 | 
						|
 | 
						|
    },
 | 
						|
 | 
						|
    Marker: {
 | 
						|
 | 
						|
        toProprietary: function() {
 | 
						|
            var size, anchor, icon;
 | 
						|
            if(this.iconSize) {
 | 
						|
                size = new OpenLayers.Size(this.iconSize[0], this.iconSize[1]);
 | 
						|
            }
 | 
						|
            else {
 | 
						|
                size = new OpenLayers.Size(21,25);
 | 
						|
            }
 | 
						|
 | 
						|
            if(this.iconAnchor) {
 | 
						|
                anchor = new OpenLayers.Pixel(this.iconAnchor[0], this.iconAnchor[1]);
 | 
						|
            }
 | 
						|
            else {
 | 
						|
                // FIXME: hard-coding the anchor point
 | 
						|
                anchor = new OpenLayers.Pixel(-(size.w/2), -size.h);
 | 
						|
            }
 | 
						|
 | 
						|
            if(this.iconUrl) {
 | 
						|
                icon = new OpenLayers.Icon(this.iconUrl, size, anchor);
 | 
						|
            }
 | 
						|
            else {
 | 
						|
                icon = new OpenLayers.Icon('http://openlayers.org/dev/img/marker-gold.png', size, anchor);
 | 
						|
            }
 | 
						|
            var marker = new OpenLayers.Marker(this.location.toProprietary("openlayers"), icon);
 | 
						|
 | 
						|
            if(this.infoBubble) {
 | 
						|
                var popup = new OpenLayers.Popup(null,
 | 
						|
                    this.location.toProprietary("openlayers"),
 | 
						|
                    new OpenLayers.Size(100,100),
 | 
						|
                    this.infoBubble,
 | 
						|
                    true);
 | 
						|
                    popup.autoSize = true;
 | 
						|
                    var theMap = this.map;
 | 
						|
                    if(this.hover) {
 | 
						|
                        marker.events.register("mouseover", marker, function(event) {
 | 
						|
                            theMap.addPopup(popup);
 | 
						|
                            popup.show();
 | 
						|
                        });
 | 
						|
                        marker.events.register("mouseout", marker, function(event) {
 | 
						|
                            popup.hide();
 | 
						|
                            theMap.removePopup(popup);
 | 
						|
                        });
 | 
						|
                    }
 | 
						|
                    else {
 | 
						|
                        var shown = false;
 | 
						|
                        marker.events.register("mousedown", marker, function(event) {
 | 
						|
                            if (shown) {
 | 
						|
                                popup.hide();
 | 
						|
                                theMap.removePopup(popup);
 | 
						|
                                shown = false;
 | 
						|
                            } else {
 | 
						|
                                theMap.addPopup(popup);
 | 
						|
                                popup.show();
 | 
						|
                                shown = true;
 | 
						|
                            }
 | 
						|
                        });
 | 
						|
                    }
 | 
						|
                }
 | 
						|
 | 
						|
                if(this.hoverIconUrl) {
 | 
						|
                    // TODO
 | 
						|
                }
 | 
						|
 | 
						|
                if(this.infoDiv){
 | 
						|
                    // TODO
 | 
						|
                }
 | 
						|
                return marker;
 | 
						|
            },
 | 
						|
 | 
						|
        openBubble: function() {		
 | 
						|
            // TODO: Add provider code
 | 
						|
        },
 | 
						|
 | 
						|
        hide: function() {
 | 
						|
            this.proprietary_marker.setOptions({visible:false});
 | 
						|
        },
 | 
						|
 | 
						|
        show: function() {
 | 
						|
            this.proprietary_marker.setOptions({visible:true});
 | 
						|
        },
 | 
						|
 | 
						|
        update: function() {
 | 
						|
            // TODO: Add provider code
 | 
						|
        }
 | 
						|
 | 
						|
    },
 | 
						|
 | 
						|
    Polyline: {
 | 
						|
 | 
						|
        toProprietary: function() {
 | 
						|
            var olpolyline;
 | 
						|
            var olpoints = [];
 | 
						|
            var ring;
 | 
						|
            var style = {
 | 
						|
                strokeColor: this.color || "#000000",
 | 
						|
                strokeOpacity: this.opacity || 1,
 | 
						|
                strokeWidth: this.width || 1,
 | 
						|
                fillColor: this.fillColor || "#000000",
 | 
						|
                fillOpacity: this.getAttribute('fillOpacity') || 0.2
 | 
						|
            };
 | 
						|
 | 
						|
            //TODO Handle closed attribute
 | 
						|
 | 
						|
            for (var i = 0, length = this.points.length ; i< length; i++){
 | 
						|
                olpoint = this.points[i].toProprietary("openlayers");
 | 
						|
                olpoints.push(new OpenLayers.Geometry.Point(olpoint.lon, olpoint.lat));
 | 
						|
            }
 | 
						|
 | 
						|
            if (this.closed) {
 | 
						|
                // a closed polygon
 | 
						|
                ring = new OpenLayers.Geometry.LinearRing(olpoints);
 | 
						|
            } else {
 | 
						|
                // a line
 | 
						|
                ring = new OpenLayers.Geometry.LineString(olpoints);
 | 
						|
            }
 | 
						|
 | 
						|
            olpolyline = new OpenLayers.Feature.Vector(ring, null, style);
 | 
						|
 | 
						|
            return olpolyline;
 | 
						|
        },
 | 
						|
 | 
						|
        show: function() {
 | 
						|
            throw 'Not implemented';
 | 
						|
        },
 | 
						|
 | 
						|
        hide: function() {
 | 
						|
            throw 'Not implemented';
 | 
						|
        }
 | 
						|
 | 
						|
    }
 | 
						|
 | 
						|
}); |