// send request to server for loading book detail using j query library
function GetBookForBookMap() {
$.ajax({
url: RootPath + "/ajax.aspx?bookids=" + bookids,
cache: false,
success: function(data) {
if (data != "NoBookFound")
DisplayBookMarker(data);
}
});
}
// ----------- BOOK MAP FUNTCIONS--------------- //
var map;
var bookids = '8C8CB340-E4E6-4BB4-A57E-3FE4411E43B1,';
var PreviousDisplayedInfoWindow = null;
var PreviousDisplayedGMarker = null;
// load books google map after the page had been loaded in browser
window.onload = new Function('LoadBookMap()');
// destroy books google map after the page had been unloaded completely from the browser
window.onunload = new Function('GUnload()');
// below function load the google map and its controls in the browser
function LoadBookMap() {
if (GBrowserIsCompatible()) {
map = new GMap2(document.getElementById(MapID));
map.disableDoubleClickZoom();
map.disableScrollWheelZoom();
if (MapView == "ShortView") {
map.disableDragging();
}
if (MapView == "BigView") {
map.addControl(new GSmallMapControl());
map.addControl(new GMapTypeControl());
}
}
else {
alert("Your browser is not campatible for using Google Map!");
}
GetBookForBookMap();
}
function DisplayBookMarker(bookinfo) {
var bookinformation = bookinfo.split("~");
var bookidsCount = bookids.split(",");
// if (bookidsCount.length> 25)
// bookids = bookinformation[0] + ",";
// else
bookids += bookinformation[0] + ",";
point = createMapPoint(parseFloat(bookinformation[7]), parseFloat(bookinformation[8]));
map.setCenter(point, 3);
createMarker(point, createPopupHtml(bookinfo));
window.setTimeout(GetBookForBookMap, 3000);
}
// ----------- BOOK MAP UTILITY FUNCTIONS ------------//
function createMapPoint(pLatitude, pLongitude) {
return new GLatLng(pLatitude, pLongitude);
}
function createPopupHtml(bookinfo) {
var html;
var bookinformation = bookinfo.split("~");
/*html = "";
html += "" + bookinformation[6] + " minutes ago
";*/
html = "";
return html;
}
function createMarker(pPoint, pHtml) {
if(PreviousDisplayedInfoWindow != null)
{
PreviousDisplayedInfoWindow.remove();
}
if(PreviousDisplayedGMarker != null)
{
map.removeOverlay(PreviousDisplayedGMarker);
}
var tinyIcon = new GIcon();
tinyIcon.image = RootPath + '/images/icons/CustomMarker.png';
tinyIcon.shadow = RootPath + '/images/icons/CustomMarkerShadow.png';
tinyIcon.iconSize = new GSize(12, 20);
tinyIcon.shadowSize = new GSize(22, 20);
tinyIcon.iconAnchor = new GPoint(6, 20);
tinyIcon.infoWindowAnchor = new GPoint(4, 1);
mOptions = { icon: tinyIcon };
var gMarker = new GMarker(pPoint, mOptions);
fromLatLng = map.fromLatLngToDivPixel(pPoint);
fromLatLng.x += 80;
fromLatLng.y -= 70;
newPoint = map.fromDivPixelToLatLng(fromLatLng);
map.panTo(newPoint);
map.addOverlay(gMarker);
PreviousDisplayedGMarker = gMarker;
if (gMarker.infoWindowInstance == null) {
gMarker.infoWindowInstance = new infoWindow(gMarker, pHtml);
map.addOverlay(gMarker.infoWindowInstance);
PreviousDisplayedInfoWindow = gMarker.infoWindowInstance;
}
return gMarker;
}
// ----------- BOOK MAP CUSTOM INFO WINDOW FUNCTIONS--------------- //
function infoWindow(marker, html, width) {
this.html = html;
this.width = (width) ? width + 'px' : 'auto';
this.marker = marker;
}
infoWindow.prototype = new GOverlay();
infoWindow.prototype.initialize = function(map) {
this.map = map;
var container = document.createElement('div');
map.getPane(G_MAP_FLOAT_PANE).appendChild(container);
this.container = container;
var shadow = document.createElement('div');
map.getPane(G_MAP_FLOAT_SHADOW_PANE).appendChild(shadow);
this.shadow = shadow;
}
infoWindow.prototype.remove = function() {
this.container.parentNode.removeChild(this.container);
this.shadow.parentNode.removeChild(this.shadow);
}
infoWindow.prototype.redraw = function(force) {
if (!force) return;
var content = document.createElement('span');
content.innerHTML = this.html;
content.style.margin = '6px 0px 0px 0px';
content.style.padding = '0';
//content.style.border = '1.5px solid black';
content.style.width = '210px';
content.style.height = '114px';
content.style.display = 'block';
content.style.position = 'absolute';
//content.style.background = '#fff';
content.className = 'PopupContainer';
this.map.getContainer().appendChild(content);
content.parentNode.removeChild(content);
var contentWidth = 210;
var contentHeight = 114;
var wrapper = document.createElement('div');
wrapper.appendChild(content);
var img = document.createElement('img');
img.src = RootPath + '/images/icons/CustomPointer.png';
img.alt = '';
img.style.height = '1.5em';
img.style.width = '1.42em';
img.style.position = 'absolute';
img.style.left = '0.42em';
img.style.top = '10.45em';
wrapper.appendChild(img);
var pixelLocation = this.map.fromLatLngToDivPixel(this.marker.getPoint());
this.container.style.position = 'absolute';
this.container.style.left = (pixelLocation.x - 3) + 'px';
this.container.style.top = (pixelLocation.y - contentHeight - 25 - this.marker.getIcon().iconSize.height) + 'px';
this.container.style.display = 'block';
this.container.appendChild(wrapper);
var mapNE = this.map.fromLatLngToDivPixel(this.map.getBounds().getNorthEast());
var panX = 0;
var panY = 0;
if (this.container.offsetTop < mapNE.y) {
panY = mapNE.y - this.container.offsetTop;
}
if (this.container.offsetLeft + contentWidth + 10 > mapNE.x) {
panX = (this.container.offsetLeft + contentWidth + 10) - mapNE.x;
}
}