talk at SWECO position

adding maps to webapps

jQuery.noConflict();

var geoCodeURL = "http://nominatim.openstreetmap.org/search.php";
var map = new OpenLayers.Map({ div:'map'  });
var osm = new OpenLayers.Layer.OSM();
map.addLayers([osm]);
map.addControl(new OpenLayers.Control.LayerSwitcher());

var markers = new OpenLayers.Layer.Markers("Markers");
map.addLayer(markers);
map.setCenter(new OpenLayers.LonLat(0,0), 1);

function transform ( lonLat ) {
    return lonLat.transform( new OpenLayers.Projection("EPSG:4326"), map.getProjectionObject());
}

function addPopup (lonLat, item, marker) {
    var anchor = null;
    if (marker) {
        anchor = marker.icon;
    }
    var popup = new OpenLayers.Popup.FramedCloud(
        null, lonLat,  null, "<p class='popup'>" + item.label + "</p>",
        anchor, true);
    map.addPopup(popup, true);
}

jQuery("#address").autocomplete({
    zIndex: 9998,
    source: function ( request, response ) {
        jQuery.ajax({
           url: geoCodeURL,
           data: {
               format: "json",
               q: request.term
           },
           success: function ( data ) {
               data = jQuery.parseJSON(data);
               var selectData= jQuery.map( data, function( obj, i ) {
                   return {
                        label: obj.display_name,
                        value: obj.display_name,
                        lat: obj.lat,
                        lon: obj.lon
                   };
               });
               response(selectData);
          }
        });
    },
    minLength: 2,
    delay: 200,
    select: function( event, ui ) {
        var lonLat = transform(new OpenLayers.LonLat( ui.item.lon, ui.item.lat));
        map.setCenter(lonLat, 15);
        var feature = new OpenLayers.Feature(markers, lonLat);
        var marker = feature.createMarker();
        markers.addMarker(marker);
        marker.events.register("mousedown", marker, function (event ) {
            addPopup( lonLat, ui.item, marker);
        });
    },
    open: function () {
       jQuery( this ).removeClass("ui-corner-all" ).addClass("ui-corner-top");
    },
    close: function () {
       jQuery( this ).removeClass("ui-corner-top").addClass("ui-corner-all");
    }
});