var centreLat=0.0; var centreLon=0.0; var initialZoom=2; var imageWraps=false; //SET THIS TO false TO PREVENT THE IMAGE WRAPPING AROUND var map; //the GMap3 itself var gmicMapType; var allowedBounds = new google.maps.LatLng(centreLat, centreLon);; var boundLimits; var currentZoom = initialZoom; function GMICMapType() { this.Cache = Array(); this.opacity = 1.0; } GMICMapType.prototype.tileSize = new google.maps.Size(256, 256); GMICMapType.prototype.maxZoom = 19; GMICMapType.prototype.getTile = function(coord, zoom, ownerDocument) { var c = Math.pow(2, zoom); var c = Math.pow(2, zoom); var tilex=coord.x,tiley=coord.y; if (imageWraps) { if (tilex<0) tilex=c+tilex%c; if (tilex>=c) tilex=tilex%c; if (tiley<0) tiley=c+tiley%c; if (tiley>=c) tiley=tiley%c; } else { if ((tilex<0)||(tilex>=c)||(tiley<0)||(tiley>=c)) { var blank = ownerDocument.createElement('DIV'); blank.style.width = this.tileSize.width + 'px'; blank.style.height = this.tileSize.height + 'px'; return blank; } } var img = ownerDocument.createElement('IMG'); var d = tilex; var e = tiley; var f = "t"; for (var g = 0; g < zoom; g++) { c /= 2; if (e < c) { if (d < c) { f += "q" } else { f += "r"; d -= c } } else { if (d < c) { f += "t"; e -= c } else { f += "s"; d -= c; e -= c } } } img.id = "t_" + f; img.style.width = this.tileSize.width + 'px'; img.style.height = this.tileSize.height + 'px'; img.src = "maps/worldmap/"+world+"-expanded/"+f+".jpg"; this.Cache.push(img); return img; } GMICMapType.prototype.realeaseTile = function(tile) { var idx = this.Cache.indexOf(tile); if(idx!=-1) this.Cache.splice(idx, 1); tile=null; } /*GMICMapType.prototype.name = "Image Cutter"; GMICMapType.prototype.alt = "Image Cutter Tiles"; GMICMapType.prototype.setOpacity = function(newOpacity) { this.opacity = newOpacity; for (var i = 0; i < this.Cache.length; i++) { this.Cache[i].style.opacity = newOpacity; //mozilla this.Cache[i].style.filter = "alpha(opacity=" + newOpacity * 100 + ")"; //ie } }*/ function getWindowHeight() { if (window.self&&self.innerHeight) { return self.innerHeight; } if (document.documentElement&&document.documentElement.clientHeight) { return document.documentElement.clientHeight; } return 0; } function resizeMapDiv() { //Resize the height of the div containing the map. //Do not call any map methods here as the resize is called before the map is created. var d=document.getElementById("map"); var offsetTop=0; for (var elem=d; elem!=null; elem=elem.offsetParent) { offsetTop+=elem.offsetTop; } /*var height=getWindowHeight()-offsetTop-64; if (height>=0) { d.style.height=height+"px"; }*/ d.style.minHeight = "584px"; } /* Disable and enable dragging based on zoom level. */ function draggingManager(map, curr_zoom, old_zoom) { if (curr_zoom <= 2) { if (old_zoom > 2) { map.setCenter(new google.maps.LatLng(centreLat, centreLon)); } map.draggable = false; } else { map.draggable = true; } currentZoom = curr_zoom; return; } /* These are for drag and drop markers. function updateMarkerStatus(str) { document.getElementById('markerStatus').innerHTML = str; } function updateMarkerPosition(latlng) { document.getElementById('info').innerHTML = [ latlng.lat(), latlng.lng() ].join(', '); } /* End D&D Marker */ function init_map() { resizeMapDiv(); var latlng = new google.maps.LatLng(centreLat, centreLon); var myOptions = { zoom: initialZoom, backgroundColor: '#0d36a2', minZoom: 2, maxZoom: 5, draggable: true, center: latlng, panControl: true, zoomControl: true, mapTypeControl: true, scaleControl: false, streetViewControl: false, overviewMapControl: true, mapTypeControlOptions: { mapTypeIds: ["CoNmap"] }, mapTypeId: "CoNmap" } map = new google.maps.Map(document.getElementById("map"), myOptions); gmicMapType = new GMICMapType(); map.mapTypes.set("CoNmap",gmicMapType); ///////////////////////////////////////////////////////////////////////////////////// //Add any markers here e.g. // var marker = new google.maps.Marker({ // map:map, // position: new google.maps.LatLng(x,y), // title: "My Marker" // }); ///////////////////////////////////////////////////////////////////////////////////// var iconBase = "maps/sword/"; markers = []; marker_listeners = []; locations = []; locationsDiv = []; marker_counter = 0; function createLocationMarker(latlng, id_text, div_id, shop_marker) { if (shop_marker == "sword") { marker_icon = iconBase + 'image.png'; marker_shadow = iconBase + 'shadow.png'; } else { marker_icon = iconBase + 'ball.png'; marker_shadow = iconBase + 'ball_shadow.png'; } var marker = new MarkerWithLabel({ map: map, position: latlng, labelContent: id_text, labelVisible: false, labelClass: 'locationName', labelAnchor: new google.maps.Point(20, 0), icon: marker_icon, shadow: marker_shadow, visible: false }); marker.set('div_id', div_id); //if (shop_marker == "sword") { marker_listeners[marker_counter] = google.maps.event.addListener(marker, "click", function() { var div_id = marker.get('div_id'); show(div_id); }); marker_counter += 1; //} google.maps.event.addListener(marker, "mouseover", function() { marker.set('labelVisible',true); }); google.maps.event.addListener(marker, "mouseout", function() { marker.set('labelVisible',false); }); return marker; } markers[0] = createLocationMarker(new google.maps.LatLng(54.2652,-69.3457), "Istory", "first_istory", 'sword'); locations[0] = "Istory"; locationsDiv[0] = "first_istory"; markers[1] = createLocationMarker(new google.maps.LatLng(36.7741,-30.6299), "Karnak", "first_karnak", 'sword'); locations[1] = "Karnak"; locationsDiv[1] = "first_karnak"; markers[2] = createLocationMarker(new google.maps.LatLng(6.3153,-36.3428), "Library of the
Ancients", "first_library_of_the_ancients", 'ball'); locations[2] = "Library of the
Ancients"; locationsDiv[2] = "first_library_of_the_ancients"; markers[3] = createLocationMarker(new google.maps.LatLng(3.99578,-62.6221), "Desert of Shifting
Sands", "first_desert_of_shifting_sands", 'ball'); locations[3] = "Desert of Shifting
Sands"; locationsDiv[3] = "first_desert_of_shifting_sands"; markers[4] = createLocationMarker(new google.maps.LatLng(-45.5833,-52.0312), "Jachol", "first_jachol", 'sword'); locations[4] = "Jachol"; locationsDiv[4] = "first_jachol"; markers[5] = createLocationMarker(new google.maps.LatLng(-2.98693,42.0557), "Tycoon Castle", "first_tycoon_castle", 'ball'); locations[5] = "Tycoon Castle"; locationsDiv[5] = "first_tycoon_castle"; markers[6] = createLocationMarker(new google.maps.LatLng(9.40571,62.2266), "Walse Castle", "first_walse_castle", 'ball'); locations[6] = "Walse Castle"; locationsDiv[6] = "first_walse_castle"; markers[7] = createLocationMarker(new google.maps.LatLng(9.40571,64.9512), "Walse", "first_walse", 'sword'); locations[7] = "Walse"; locationsDiv[7] = "first_walse"; markers[8] = createLocationMarker(new google.maps.LatLng(-48.2539,66.4014), "Crescent", "first_crescent", 'sword'); locations[8] = "Crescent"; locationsDiv[8] = "first_crescent"; markers[9] = createLocationMarker(new google.maps.LatLng(35.4607,68.9941), "Carwen", "first_carwen", 'sword'); locations[9] = "Carwen"; locationsDiv[9] = "first_carwen"; markers[10] = createLocationMarker(new google.maps.LatLng(52.1605,34.8486), "Lix", "first_lix", 'sword'); locations[10] = "Lix"; locationsDiv[10] = "first_lix"; markers[11] = createLocationMarker(new google.maps.LatLng(27.6446,1.93359), "Tule", "first_tule", 'sword'); locations[11] = "Tule"; locationsDiv[11] = "first_tule"; markers[12] = createLocationMarker(new google.maps.LatLng(51.5907,62.5342), "Ship Graveyard", "first_ship_graveyard", 'ball'); locations[12] = "Ship Graveyard"; locationsDiv[12] = "first_ship_graveyard"; markers[13] = createLocationMarker(new google.maps.LatLng(55.4539,73.8721), "North Mountain", "first_north_mountain", 'ball'); locations[13] = "North Mountain"; locationsDiv[13] = "first_north_mountain"; markers[14] = createLocationMarker(new google.maps.LatLng(49.0955,40.9131), "Wind Shrine", "first_wind_shrine", 'ball'); locations[14] = "Wind Shrine"; locationsDiv[14] = "first_wind_shrine"; markers[15] = createLocationMarker(new google.maps.LatLng(27.6835,36.2549), "Torna Canal", "first_torna_canal", 'ball'); locations[15] = "Torna Canal"; locationsDiv[15] = "first_torna_canal"; markers[16] = createLocationMarker(new google.maps.LatLng(15.75,28.8721), "Pirate Hideout", "first_pirate_hideout", 'ball'); locations[16] = "Pirate Hideout"; locationsDiv[16] = "first_pirate_hideout"; markers[17] = createLocationMarker(new google.maps.LatLng(-33.5048,-47.373), "Ronka Ruins", "first_ronka_ruins", 'ball'); locations[17] = "Ronka Ruins"; locationsDiv[17] = "first_ronka_ruins"; markers[18] = createLocationMarker(new google.maps.LatLng(28.227,51.3721), "Walse Tower", "first_walse_tower", 'ball'); locations[18] = "Walse Tower"; locationsDiv[18] = "first_walse_tower"; markers[19] = createLocationMarker(new google.maps.LatLng(35.3174,-33.2227), "Karnak Castle", "first_karnak_castle", 'ball'); locations[19] = "Karnak Castle"; locationsDiv[19] = "first_karnak_castle"; markers[20] = createLocationMarker(new google.maps.LatLng(30.5244,-32.3438), "Fire-Powered Ship", "first_fire-powered_ship", 'ball'); locations[20] = "Fire-Powered Ship"; locationsDiv[20] = "first_fire-powered_ship"; markers[21] = createLocationMarker(new google.maps.LatLng(-25.006,-47.4609), "Gohn", "first_gohn", 'ball'); locations[21] = "Gohn"; locationsDiv[21] = "first_gohn"; /* Make all the markers visible */ for (var i = 0; i < markers.length ; i++ ) { markers[i].visible = true; } ///////////////////////////////////////////////////////////////////////////////////// /* This is the drag and drop marker from http://gmaps-samples-v3.googlecode.com/svn/trunk/draggable-markers/draggable-markers.html var ddmarker = new google.maps.Marker({ position: latlng, title: 'Drag and Drop', map: map, draggable: true }); // Update current position info. updateMarkerPosition(latlng); //geocodePosition(latlng); // Add dragging event listeners. google.maps.event.addListener(ddmarker, 'dragstart', function() { updateMarkerAddress('Dragging...'); }); google.maps.event.addListener(ddmarker, 'drag', function() { updateMarkerStatus('Dragging...'); updateMarkerPosition(ddmarker.getPosition()); }); google.maps.event.addListener(ddmarker, 'dragend', function() { updateMarkerStatus('Drag ended'); //geocodePosition(ddmarker.getPosition()); }); /* End drag and drop marker */ /* Do a zoom-change listener. */ var zoom_listener = google.maps.event.addListener(map, 'zoom_changed', function() { new_zoom = map.getZoom(); allowedBounds = set_allowed_bounds(new_zoom); boundLimits = set_bound_limits(allowedBounds); draggingManager(map, new_zoom, currentZoom); }); /* Do a center-changed listener to try to limit panning. PAN! */ /* bounds of the desired area. This is what was tricky before */ /* I think this will need to be based on zoom level. */ function set_allowed_bounds(zoom) { /* where are zooms one and two? we don't need this for them. */ if (zoom == 3) { allowedBounds = new google.maps.LatLngBounds( /* good at level 3 */ new google.maps.LatLng(-40,-32), new google.maps.LatLng(42,32) ); } else if (zoom == 4) { allowedBounds = new google.maps.LatLngBounds( /* good at level 4 */ new google.maps.LatLng(-58,-72), new google.maps.LatLng(58,72) ); } else if (zoom == 5) { allowedBounds = new google.maps.LatLngBounds( /* good at level 5 */ new google.maps.LatLng(-65,-90), new google.maps.LatLng(70,90) ); } return allowedBounds; } function set_bound_limits(allowedBounds) { var boundLimits = { maxLat : allowedBounds.getNorthEast().lat(), maxLng : allowedBounds.getNorthEast().lng(), minLat : allowedBounds.getSouthWest().lat(), minLng : allowedBounds.getSouthWest().lng() }; return boundLimits; } var lastValidCenter = map.getCenter(); var newLat, newLng; google.maps.event.addListener(map, 'center_changed', function() { center = map.getCenter(); if (allowedBounds.contains(center)) { // still within valid bounds, so save the last valid position lastValidCenter = map.getCenter(); return; } newLat = lastValidCenter.lat(); newLng = lastValidCenter.lng(); if(center.lng() > boundLimits.minLng && center.lng() < boundLimits.maxLng){ newLng = center.lng(); } if(center.lat() > boundLimits.minLat && center.lat() < boundLimits.maxLat){ newLat = center.lat(); } map.panTo(new google.maps.LatLng(newLat, newLng)); }); draggingManager(map, initialZoom, currentZoom); $("#mapwrapper").css({'width': $("#map").width()+'px'}); } var last = null; function show(id) { var itm = "#"+id; //console.log(id); var itm = $(itm); if (!itm) { // do nothing } else { $(".metalocation").hide(); $(itm).show(); if (last && last != itm) { $(last).hide(); } last = itm; } } google.maps.event.addDomListener(window, 'load', init_map); //google.maps.event.addDomListener(window, 'resize', resizeMapDiv); /* global scoped var to use in the show maps function below */ mapdivs = "hidden"; function mapToggler() { dumpListeners(); createListeners(mapdivs); adjustFloat(mapdivs); displayMapDivs(mapdivs); if (mapdivs == "hidden") { mapdivs = "visible"; } else { mapdivs = "hidden"; } } function dumpListeners(){ console.log(marker_listeners); for (var i = 0; i < marker_listeners.length; i++) { element = marker_listeners[i]; google.maps.event.removeListener(element); } } function createListeners(status) { if (status=="hidden") { //we are making the divs all visible, so we set the listeners to be links to hashes. $(markers).each(function(i,marker){ marker_listeners[i] = google.maps.event.addListener(marker, "click", function() { var primaryURL = document.URL.split("#"); window.location = primaryURL[0] + "#" + locationsDiv[i]; }); //GEvent.addListener(marker, "click", function(){ var primaryURL = document.URL.split("#"); window.location = primaryURL[0] + "#" + locationsDiv[i] }); }); } else { //we are reverting back to the standard GMap click actions. $(markers).each(function(i,marker){ marker_listeners[i] = google.maps.event.addListener(marker, "click", function() { var div_id = marker.get('div_id'); show(div_id); }); }); } } function adjustFloat(status) { if (status=="hidden") { //we are making the divs all visible, so we need to break the float. $(".metalocation").css("clear","both"); } else { $(".metalocation").css("clear","none"); } } function displayMapDivs(status) { if (status=="hidden") { //we are making the divs all visible, so we need to... make the divs all visible. idiot. $(".metalocation").hide(); $(".metalocation").show(); } else { $(".metalocation").hide(); } }