ListingMapView.js

ListingMapView.js

function createListingMapView(latitude, longitude) {
    return tt.ui.createWindow("Listing Map", function () { listingsmap.init(latitude, longitude); });
}

var listingsmap = {

    init: function (latitude, longitude) {

        listingsmap.coordinates = { Latitude: latitude, Longitude: longitude };
        listingsmap.display();
        listingsmap.createEvents();
        listingsmap.createMenu();
        listingsmap.search();

    },

    display: function () {

        //logo strip.
        tt.ui.View.add(new LogoStrip().create(listingsmap.close));

        //create map.
        listingsmap.map = new Map();
        listingsmap.mapView = listingsmap.map.init([], listingsmap.coordinates.Latitude,
        	listingsmap.coordinates.Longitude, 33, 0, 0.01, true);
        //handle clicking on an annotation.
        listingsmap.mapView.addEventListener("click", listingsmap.clickAnnotation);

        //advanced search.
        listingsmap.advancedsearchpopup = new AdvancedSearchPopup();
        listingsmap.advancedsearchpopup.init(listingsmap.search);

    },

    createEvents: function () {

        tt.ui.Win.addEventListener('android:back', listingsmap.close);

        //Wire up our "bounds_changed" handlers to update the map as the user plays with it.
        listingsmap.bounds, listingsmap.boundsTimer, listingsmap.boundsChanged = false;
        listingsmap.markers = {}, listingsmap.iteration = 0;
        listingsmap.mapView.addEventListener("regionChanged", function (e) {
            //Ti.API.info(e);
            listingsmap.boundsChanged = true;
            var newBounds = {
                nela: e.latitude + (e.latitudeDelta / 2.0),
                swla: e.latitude - (e.latitudeDelta / 2.0),
                nelo: e.longitude + (e.longitudeDelta / 2.0),
                swlo: e.longitude - (e.longitudeDelta / 2.0)
            };
            if ((listingsmap.bounds
            	&& listingsmap.bounds.nela == newBounds.nela
            	&& listingsmap.bounds.swla == newBounds.swla
            	&& listingsmap.bounds.nelo == newBounds.nelo
            	&& listingsmap.bounds.swlo == newBounds.swlo)
            	|| listingsmap.selectingMarker)
                return;
            listingsmap.bounds = newBounds;
            if (listingsmap.boundsTimer)
                clearTimeout(listingsmap.boundsTimer);
            listingsmap.boundsTimer = setTimeout(listingsmap.checkBounds, 500);
        });

    },

    checkBounds: function () {

        if (listingsmap.boundsChanged) {
            listingsmap.boundsChanged = false;

            utils.ajax("/listingservice.svc/readlistingswithinbox?nela=" + listingsmap.bounds.nela
            	+ "&swla=" + listingsmap.bounds.swla
            	+ "&nelo=" + listingsmap.bounds.nelo
            	+ "&swlo=" + listingsmap.bounds.swlo
            	+ "&filterJson=" + listingsmap.advancedsearchpopup.getJSON(),
                function (data) {
                    listingsmap.iteration += 1;
                    // add the markers to the map
                    var count = 0;
                    for (var i = data.length - 1; i >= 0; i--) {
                        var listing = data[i];
                        var marker;
                        if (!listingsmap.markers[listing.IdString]) {
                            //create new marker.
                            marker = listingsmap.markers[listing.IdString] = listingsmap.addAnnotation(listing);
                        }
                        else {//add existing marker.
                            marker = listingsmap.markers[listing.IdString];
                            listingsmap.map.addAnnotation(marker);
                        }
                        marker.iteration = listingsmap.iteration;
                        marker.isInMap = true;
                        count++;
                    }
                    //Ti.API.info("Added " + data.length + " listings to map");
                    // and hide any markers that we aren't using anymore
                    count = 0;
                    var markers = listingsmap.markers;
                    for (var key in markers) {
                        marker = listingsmap.markers[key];
                        if (marker && marker.isInMap && marker.iteration != listingsmap.iteration
                        	&& !geoutils.pointInBounds(marker.latitude, marker.longitude, listingsmap.bounds)) {
                            marker.isInMap = false;
                            listingsmap.map.removeAnnotation(marker);
                            listingsmap.markers[key] = null;
                            count++;
                        }
                    }
                    //if(count > 0)
                    //	Ti.API.info("Removed " + count + " listings from map");
                }
            );
        }

    },

    clickAnnotation: function (evt) {

        //alert(evt);
        if (evt.annotation && evt.clicksource && evt.clicksource != "pin") {
            var listing = evt.annotation.listing;
            //selected listing for second time, redirect to stop list.
            if (utils.isAndroid) {
            	//close map window (android can only have one mapview open at a time!)
				listingsmap.close(function() { createListingDetailsView(listing).open(); });
            }
            else
	            createListingDetailsView(listing).open();
        }

    },

    addAnnotation: function (listing) {

        var subtitle = "$" + utils.formatNumber(listing.Price);
        var annotation = listingsmap.map.createAnnotation(listing.Address, subtitle, listing.Coordinates.Latitude, listing.Coordinates.Longitude, false, true);
        annotation.listing = listing;
        return annotation;

    },

    search: function () {

        //remove all annotations.
        for (var key in listingsmap.markers) {
            marker = listingsmap.markers[key];
            marker.isInMap = false;
            listingsmap.map.removeAnnotation(marker);
        }

        //refresh map.
        var location = listingsmap.mapView.region;
        location.latitude += .0001;
        location.longitude += .0001;
        listingsmap.mapView.setLocation(location);

    },

    createMenu: function () {

        //create menu buttons.
        var buttons = [
        	{
        	    title: "Adv. Search",
        	    clickevent: listingsmap.advancedsearchpopup.show
        	}
        ];
        //create menu.
        new Menu().init({
            buttons: buttons
        });

    },

    close: function (callback) {

        tt.ui.closeWindow(callback);

    }

};