101 lines
5.8 KiB
JavaScript
101 lines
5.8 KiB
JavaScript
define(['jquery', 'underscore', 'backbone', 'text!modules/maps/mapsViewTemplate.html', 'text!modules/maps/infoWindowTemplate.html', 'modules/base/baseView', 'classes/profile'],
|
||
function ($, _, Backbone, mapsViewTemplate, infoWindowTemplate, BaseView, Profile) {
|
||
|
||
var MapsView = BaseView.extend({
|
||
|
||
map: null,
|
||
markers: [],
|
||
//initialize template
|
||
template: _.template(mapsViewTemplate),
|
||
infoWindowtemplate: _.template(infoWindowTemplate),
|
||
|
||
initialize: function () {
|
||
this.id = "MapsView";
|
||
MapsView.__super__.initialize.call(this);
|
||
},
|
||
onShowed: function(){
|
||
var self = this;
|
||
var drawMap = function(LatLng){
|
||
var myOptions = {
|
||
zoom: 10,
|
||
center: LatLng,
|
||
mapTypeId: google.maps.MapTypeId.ROADMAP
|
||
};
|
||
self.map = new google.maps.Map($("#map-canvas")[0], myOptions);
|
||
|
||
var iconPM = {
|
||
url: "http://app.gruppolapastamadre.it/icon.png",
|
||
scaledSize: new google.maps.Size(24, 24)
|
||
};
|
||
|
||
self.map.addListener('bounds_changed', function() {
|
||
var bound = self.map.getBounds();
|
||
var latLngFrom = bound.getNorthEast();
|
||
var latLngTo = bound.getSouthWest();
|
||
$.ajax({
|
||
url: myManifest.Settings.DefaultURL + "/api/spacciatori/bound/" + latLngFrom.lat() + "/"+ latLngFrom.lng() + "/" + latLngTo.lat() + "/"+ latLngTo.lng(),
|
||
//dataType: "json",
|
||
//async: false,
|
||
type: 'GET',
|
||
success: function (resp) {
|
||
resp.forEach(function(ele, index){
|
||
if(!self.markers["|" + ele.Latitudine+ "|" + ele.Longitudine+ "|"])
|
||
{
|
||
var marker = new google.maps.Marker({
|
||
position: new google.maps.LatLng(ele.Latitudine, ele.Longitudine),
|
||
icon: iconPM,
|
||
//label: ele.Name,
|
||
title: ele.Name,
|
||
map: self.map
|
||
});
|
||
self.markers["|" + ele.Latitudine+ "|" + ele.Longitudine+ "|"] = marker;
|
||
|
||
var infowindow = new google.maps.InfoWindow({
|
||
content: self.infoWindowtemplate({item: ele})
|
||
});
|
||
|
||
marker.addListener('click', function() {
|
||
infowindow.open(self.map, marker);
|
||
});
|
||
}
|
||
});
|
||
}
|
||
});
|
||
});
|
||
};
|
||
var defaultLatLng = new google.maps.LatLng(34.0983425, -118.3267434); // Default to Hollywood, CA when no geolocation support
|
||
if ( navigator.geolocation ) {
|
||
function success(pos) {
|
||
// Location found, show map with these coordinates
|
||
drawMap(new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude));
|
||
}
|
||
function fail(error) {
|
||
drawMap(defaultLatLng); // Failed to find location, show default map
|
||
}
|
||
// Find the users current position. Cache the location for 5 minutes, timeout after 6 seconds
|
||
navigator.geolocation.getCurrentPosition(success, fail, {maximumAge: 500000, enableHighAccuracy:true, timeout: 6000});
|
||
} else {
|
||
drawMap(defaultLatLng); // No geolocation support, show default map
|
||
}
|
||
},
|
||
//render the content into div of view
|
||
render: function () {
|
||
if (this.created === true)
|
||
{
|
||
//this.header.title = "pippo";
|
||
MapsView.__super__.render.call(this);
|
||
//this.el is the root element of Backbone.View. By default, it is a div.
|
||
//$el is cached jQuery object for the view's element.
|
||
//append the compiled template into view div container
|
||
this.$el.append(this.header.$el);
|
||
this.$el.append(this.template({app: myManifest, profile: Profile}));
|
||
this.$el.append(this.footer.$el);
|
||
this.$el.find("#infoBtn").addClass("ui-btn-active");
|
||
}
|
||
//$("#homeBtn").addClass("ui-btn-active");
|
||
//return to enable chained calls
|
||
return this;
|
||
}
|
||
});
|
||
return MapsView;
|
||
}); |