$(document).ready(function() {

    $('ul#Banners').innerfade({
        speed: 1000,
        timeout: 4000,
        type: 'sequence',
        containerheight: '241px'
    });

});

var locations = {};

function initialize() {
    if (GBrowserIsCompatible()) {
        var map = new GMap2(document.getElementById("map_canvas"));
        map.setCenter(new GLatLng(14.254215561943921, 79.59512332454324), 8);
        map.setUIToDefault();

        var opts = { text: "click me!" };

        var marker = new PopupMarker(new GLatLng(14.440664862991145, 79.97761917533353), opts);
        map.addOverlay(marker);
    }

    GDownloadUrl("markerdata.xml", function(data) {
        var xml = GXml.parse(data);
        var markers = xml.documentElement.getElementsByTagName("marker");
        for (var i = 0; i < markers.length; i++) {
            var name = markers[i].getAttribute("name");
            var address = markers[i].nodeValue;
            var type = markers[i].getAttribute("type");
            var latlng = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
                                  parseFloat(markers[i].getAttribute("lng")));
            var image = markers[i].getAttribute("image");
            var desc = markers[i].getAttribute("desc");
            var href = markers[i].getAttribute("href");
            var store = { latlng: latlng, name: name, address: address, type: type, image: image, desc: desc, href: href };
            var latlngHash = (latlng.lat().toFixed(6) + "" + latlng.lng().toFixed(6));
            latlngHash = latlngHash.replace(".", "").replace(".", "").replace("-", "");
            if (locations[latlngHash] == null) {
                locations[latlngHash] = []
            }
            locations[latlngHash].push(store);
        }
        for (var latlngHash in locations) {
            var stores = locations[latlngHash];
            if (stores.length > 1) {
                map.addOverlay(createClusteredMarker(stores));
            } else {
                map.addOverlay(createMarker(stores));
            }
        }
    });
}

function createMarker(stores) {
    var store = stores[0];
    //var newIcon = MapIconMaker.createMarkerIcon({ width: 32, height: 32, primaryColor: "#13bee8"});
    var marker = new GMarker(store.latlng, { text: "Hello! I'm a PopupMarker." });
    var html = "<b>" + store.name + "</b>";
    if (store.image != "") {
        html += "<p><img src='./images/" + store.image + "'><p>";
    }
    if (store.desc != "") {
        html += "<br><div style='width:250px;'>" + store.desc + "</div>";
    }
    html += "<br><a href='./listhomes.html'>all homes</a>";
    GEvent.addListener(marker, 'click', function() {
        marker.openInfoWindowHtml(html);
    });
    return marker;
}

function createClusteredMarker(stores) {
    var newIcon = MapIconMaker.createMarkerIcon({ width: 44, height: 44, primaryColor: "#13bee8" });
    var marker = new GMarker(stores[0].latlng, { icon: newIcon });
    var html = "";
    for (var i = 0; i < stores.length; i++) {
        html += "<b>" + stores[i].name + "</b>";
        if (store.image != "") {
            html += "<p><img src='./images/" + store.image + "'><p>";
        }
        if (store.desc != "") {
            html += "<div style='width:250px;'>" + store.desc + "</div>";
        }
        if (store.href != "") {
            html += "<a href='" + store.href + "'>read more</a>";
        }
    }
    GEvent.addListener(marker, 'click', function() {
        marker.openInfoWindowHtml(html);
    });
    return marker;
}