Represent map state in the hash, in preparation for doing the same fo…

…r time state.
dbaron · Dec 24, 2011 · 9b77adc · 9b77adc
1 parent 6ee9186
commit 9b77adc
Showing 1 changed file with 67 additions and 4 deletions.
diff --git a/index.html b/index.html
@@ -17,16 +17,79 @@
 </script>
 <script src="http://maps.googleapis.com/maps/api/js?v=3.6&amp;sensor=false"></script>
 <script>
-var gMap, gZoneTime, gNowTimer;
+var gDefaults = {
+    zoom: 2,
+    lat: 15,
+    lng: 0,
+    mapTypeId: google.maps.MapTypeId.ROADMAP
+};
+function gethash() {
+    var hash = {};
+    if (window.location.hash != "") {
+        try {
+            hash = JSON.parse(unescape(window.location.hash.substring(1)));
+        } catch(ex) {}
+    }
+    for (var prop in gDefaults) {
+        if (!(prop in hash)) {
+            hash[prop] = gDefaults[prop];
+        }
+    }
+    return hash;
+}
+
+function sethash(json) {
+    window.location.hash = escape(JSON.stringify(json));
+}
+
+var gMap, gZoneTime, gNowTimer, gState;
 function dom_load_handler() {
     gZoneTime = document.getElementById("zonetime");
 
+    gState = gethash();
+    sethash(gState);
+
     var mapOptions = {
-        zoom: 2,
-        mapTypeId: google.maps.MapTypeId.ROADMAP,
-        center: new google.maps.LatLng(15, 0),
+        zoom: gState.zoom,
+        mapTypeId: gState.mapTypeId,
+        center: new google.maps.LatLng(gState.lat, gState.lng),
     };
     gMap = new google.maps.Map(document.getElementById("map"), mapOptions);
+
+    google.maps.event.addListener(gMap, 'center_changed',
+                                  center_changed_listener);
+    google.maps.event.addListener(gMap, 'zoom_changed',
+                                  zoom_changed_listener);
+    google.maps.event.addListener(gMap, 'maptypeid_changed',
+                                  maptypeid_changed_listener);
+
+    hashchange_listener();
+
+    window.addEventListener("hashchange", hashchange_listener, false);
+}
+
+function center_changed_listener() {
+    var ctr = gMap.getCenter();
+    gState.lat = ctr.lat();
+    gState.lng = ctr.lng();
+    sethash(gState);
+}
+
+function zoom_changed_listener() {
+    gState.zoom = gMap.getZoom();
+    sethash(gState);
+}
+
+function maptypeid_changed_listener() {
+    gState.mapTypeId = gMap.getMapTypeId();
+    sethash(gState);
+}
+
+function hashchange_listener() {
+    gState = gethash();
+    gMap.setZoom(gState.zoom);
+    gMap.setCenter(new google.maps.LatLng(gState.lat, gState.lng));
+    gMap.setMapTypeId(gState.mapTypeId);
 }
 
 function now_timer() {