forked from verdnatura/hedera-web
110 lines
2.6 KiB
JavaScript
110 lines
2.6 KiB
JavaScript
|
|
var gmapsIsLoaded = false;
|
|
|
|
Hedera.Location = new Class({
|
|
Extends: Hedera.Form
|
|
|
|
,locations: null
|
|
|
|
,activate: function() {
|
|
this.gui.loaderPush();
|
|
|
|
var sql = 'SELECT lat, lng, title, address, postcode, city, province, phone, language FROM location';
|
|
this.conn.execQuery(sql, this.onLocationsDone.bind(this));
|
|
|
|
if (!gmapsIsLoaded) {
|
|
gmapsLoadedCallback = this.gmapsLoaded.bind(this);
|
|
Vn.includeJs('https://maps.google.com/maps/api/js'
|
|
+'?sensor=false&callback=gmapsLoadedCallback'
|
|
+'&key=AIzaSyBbunFsAFEkjtw-c7BUHNgkThSlKEKFxiE',
|
|
null, true
|
|
);
|
|
} else
|
|
this.gmapsLoaded();
|
|
}
|
|
|
|
,onLocationsDone: function(resultSet) {
|
|
this.locations = resultSet.fetchResult();
|
|
this.allLoaded();
|
|
}
|
|
|
|
,gmapsLoaded: function() {
|
|
this.gui.loaderPop();
|
|
gmapsIsLoaded = true;
|
|
this.allLoaded();
|
|
}
|
|
|
|
,allLoaded: function() {
|
|
if (!this.locations || !gmapsIsLoaded)
|
|
return;
|
|
|
|
var options = {
|
|
zoom: 4
|
|
,mapTypeId: google.maps.MapTypeId.ROADMAP
|
|
,center: new google.maps.LatLng(46.0, 4.0)
|
|
};
|
|
|
|
var div = this.$('form');
|
|
var gmap = new google.maps.Map(div, options);
|
|
|
|
if (this.locations)
|
|
while (this.locations.next())
|
|
this.createMarker(this.locations, gmap);
|
|
}
|
|
|
|
,createMarker: function(location, gmap) {
|
|
var div = document.createElement('div');
|
|
div.className = 'marker';
|
|
|
|
var h = document.createElement('h3');
|
|
h.appendChild(document.createTextNode(location.get('title')));
|
|
div.appendChild(h);
|
|
|
|
var p = document.createElement('p');
|
|
p.appendChild(document.createTextNode(location.get('address')));
|
|
div.appendChild(p);
|
|
|
|
var p = document.createElement('p');
|
|
p.appendChild(document.createTextNode(location.get('postcode') +' '+ location.get('city')));
|
|
div.appendChild(p);
|
|
|
|
var p = document.createElement('p');
|
|
p.appendChild(document.createTextNode(location.get('province')));
|
|
div.appendChild(p);
|
|
|
|
var p = document.createElement('p');
|
|
p.appendChild(document.createTextNode(location.get('phone')));
|
|
div.appendChild(p);
|
|
|
|
var lat = new google.maps.LatLng(
|
|
location.get('lat'),
|
|
location.get('lng')
|
|
);
|
|
|
|
var marker = new google.maps.Marker({
|
|
position: lat
|
|
,tilte: location.title
|
|
,map: gmap
|
|
});
|
|
|
|
var infoWindow = new google.maps.InfoWindow({
|
|
content: div
|
|
});
|
|
|
|
google.maps.event.addListener(marker, 'click',
|
|
this.openInfoWindow.bind(this, infoWindow, gmap, marker));
|
|
|
|
if (Vn.Locale.language
|
|
&& Vn.Locale.language == location.get('language'))
|
|
this.openInfoWindow(infoWindow, gmap, marker);
|
|
}
|
|
|
|
,openInfoWindow: function(infoWindow, gmap, marker) {
|
|
if (this.openedWindow)
|
|
this.openedWindow.close();
|
|
|
|
infoWindow.open(gmap, marker);
|
|
this.openedWindow = infoWindow;
|
|
}
|
|
});
|