moved all the js files to their respective projects and added the

leftlet providers code inline at the top as part of the build process.
Also converted everything to stop using google maps.

3 files changed, 193 insertions, 14 deletions

diff --git a/app/builder/base.py b/app/builder/base.py
index 9cd5af7..cd51265 100644
--- a/app/builder/base.py
+++ b/app/builder/base.py
@@ -18,15 +18,15 @@ class Build():
         if not os.path.isdir(path):
             os.makedirs(path)
         fpath = '%s%s.%s' % (path, filename, ext)
-        file = open(fpath, 'wb')
-        file.write(text_object)
+        file = open(fpath, 'wt')
+        file.write(str(text_object))
         file.close()
         if ext == 'js':
             import jsmin
             compressed = jsmin.jsmin(str(text_object))
             fpath = '%s%s.min.%s' % (path, filename, ext)
-            file = open(fpath, 'wb')
-            file.write(bytes(compressed, 'UTF-8'))
+            file = open(fpath, 'wt')
+            file.write(str(compressed))
             file.close()
 
     def build_archive_pages(self, qs=None, base_path='', paginate_by=10):
@@ -137,6 +137,7 @@ class BuildPhotos(Build):
     def build(self):
         self.build_photo_archive_pages()
         self.build_detail_pages()
+        self.build_js()
 
     def build_photo_archive_pages(self):
         qs = get_model('photos', 'PhotoGallery').objects.all()
@@ -150,7 +151,14 @@ class BuildPhotos(Build):
             t = render_to_string('details/photo_galleries.html', c).encode('utf-8')
             path = 'photos/galleries/%s/' % (photo.set_slug)
             self.write_file(path, t)
-
+    
+    def build_js(self):
+        fpath = '%sdesign/templates/js/leaflet-providers.js' % settings.PROJ_ROOT
+        leaflet_providers_js = open(fpath, 'r').read()
+        fpath = '%sapp/photos/photos.js' % settings.PROJ_ROOT
+        photos_js = open(fpath, 'r').read()
+        js = leaflet_providers_js + photos_js 
+        self.write_file('media/js/', str(js), 'js', 'photos')
 
 class BuildProjects(Build):
     def build(self):
@@ -213,17 +221,20 @@ class BuildProjects(Build):
         model = get_model('projects', 'NationalParks')
         for park in model.objects.filter(visited__exact=True):
             qs = model.objects.filter(pk=park.id)
-            json = render_to_geojson(
-                qs,
-                included_fields=['id'],
-                geom_attribute='mpoly',
-                mimetype='application/json',
-            )
+            json = render_to_geojson(qs)
             json = str(json)
+            print(json)
             json = "\n".join(json.splitlines()[3:])
-            #print json
             path = 'projects/data/natparks/'
-            self.write_file(path, bytes(json, 'UTF-8'), 'json', park.id)
+            self.write_file(path, json, 'json', park.id)
+
+    def build_np_basejs(self):
+        fpath = '%sdesign/templates/js/leaflet-providers.js' % settings.PROJ_ROOT
+        leaflet_providers_js = open(fpath, 'r').read()
+        fpath = '%sapp/projects/natparks.js' % settings.PROJ_ROOT
+        natparks_js = open(fpath, 'r').read()
+        js = leaflet_providers_js + natparks_js
+        self.write_file('media/js/', str(js), 'js', 'natparks')
 
 
 class BuildSitemap(Build):
@@ -257,7 +268,10 @@ class BuildMap(Build):
             'IMAGES_URL': settings.BAKED_IMAGES_URL
         })
         t = render_to_string('archives/map_data.html', c).encode('utf-8')
-        self.write_file('media/js/', t, 'js', 'mainmap')
+        fpath = '%sdesign/templates/js/leaflet-providers.js' % settings.PROJ_ROOT
+        leaflet_providers_js = open(fpath, 'r').read()
+        js = leaflet_providers_js + t.decode(encoding='UTF-8')
+        self.write_file('media/js/', str(js), 'js', 'mainmap')
         c = Context({
             'country_list': cl,
             'region_list': rl,
diff --git a/app/photos/photos.js b/app/photos/photos.js
new file mode 100644
index 0000000..1331b0e
--- /dev/null
+++ b/app/photos/photos.js
@@ -0,0 +1,71 @@
+//Utility functions for map info window
+function mapit(obj) {
+    lat = parseFloat(obj.attr('data-latitude'));
+    lon = parseFloat(obj.attr('data-longitude'));
+    elid= obj.attr('data-imgid');
+    map = L.map(document.getElementById("mw-"+elid));
+    centerCoord = new L.LatLng(lat, lon);
+    zoom = 8;
+    L.tileLayer.provider('Esri.WorldTopoMap', {maxZoom: 18, attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Tiles © Esri and the GIS User Community'}).addTo(map);
+    map.setView(centerCoord, zoom);
+    L.marker([lat, lon]).addTo(map);
+}
+    //########## utility functions to create/remove map container ############
+function create_map(obj) {
+    //find id of this image caption:
+    var imgid = obj.attr('data-imgid');
+    //create container divs
+    $('<div class="map-container" id="mc-'+imgid+'">').insertBefore($(obj).parent().parent());
+    //$(obj).parent().parent().parent().prepend('<div class="map-container" id="mc-'+imgid+'">');
+    $('#mc-'+imgid).append('<div class="map-wrapper" id="mw-'+imgid+'">');
+    //deal with the variable height of div.legend
+    $('#mc-'+imgid).css({
+        bottom: function(index, value) {
+        return parseFloat($(obj).parent().parent().height())+20;
+     }
+    });
+    
+    mapit(obj);
+}
+function remove_map(imgid) {
+    $('#mc-'+imgid).remove();
+}
+
+//############ Document.ready events ##############
+$(document).ready(function(){ 
+
+    //set up click events for map button
+    $('.map-link').click( function() {
+        imgid = $(this).attr('data-imgid');
+        if ($('#mc-'+imgid).is(":visible")) {
+            remove_map(imgid);  
+        } else {
+            create_map($(this));
+        }
+        return false;
+    
+    });
+    var $ele = $('#slides').children();
+    var $curr = 0;
+	$(document).bind('keydown', function (e) {
+        var code = e.which;
+        switch (code) {
+            case 39:
+                if ($curr <= $ele.size()) {
+                    $.scrollTo($ele[$curr], 800 );
+                    $curr++;
+                }
+                break;
+            case 37:
+                if ($curr > 0) {
+                    $curr--;
+                    var $now = $curr;
+                    $now--;
+                    $.scrollTo($ele[$now], 800 );
+                }
+                break;
+        }
+        return;
+    });
+});
+
diff --git a/app/projects/natparks.js b/app/projects/natparks.js
new file mode 100644
index 0000000..8e4748b
--- /dev/null
+++ b/app/projects/natparks.js
@@ -0,0 +1,94 @@
+//Utility functions for map info window
+function mapit(lat,lon,zoom,id) {
+    map = L.map(document.getElementById("map-wrapper-"+id));
+    centerCoord = new L.LatLng(lat, lon);
+    zoom = zoom;
+    L.tileLayer.provider('Esri.WorldTopoMap', {maxZoom: 18, attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Tiles © Esri and the GIS User Community'}).addTo(map);
+    map.setView(centerCoord, zoom);
+    ////get the geojson for this map
+    $.ajax({
+        url: "/projects/data/natparks/"+id+".json",
+        dataType: "json",
+        success: function(data, text, request) { draw_poly(data, map); } 
+        //complete: function(xhr, status) {console.log(status); return false; },
+    });
+    //draw the polygon
+    function draw_poly(data, map) {
+        var myStyle = {
+            "color": "#201a11",
+            "weight": 2,
+            "opacity": 0.65
+        };
+        L.geoJson(data, {
+            style: myStyle
+        }).addTo(map);
+    }
+}  
+
+// utility functions to create/remove map container
+function create_map(obj) {
+    var lat = parseFloat(obj.attr('data-latitude'));
+	var lon = parseFloat(obj.attr('data-longitude'));
+	var zoom= parseInt(obj.attr('data-zoom'));
+	var id= obj.attr('data-id');
+
+    //create container divs
+    $(obj).parents().eq(3).append('<div class="map-container" id="map-container-'+id+'">');
+    $('#map-container-'+id).append('<div class="map-wrapper" id="map-wrapper-'+id+'">');
+    mapit(lat,lon,zoom,id);
+}
+function remove_map(id) {
+    $(id).remove();
+}
+
+//functions to handle the "more" link
+// utility functions to create/remove camera info container
+function get_exif(obj,id) {
+    //$(obj).parents().eq(2).append('<div id="exif-container">');
+    $(obj).parents().eq(3).append('<div class="more-container" id="'+id+'">');    $(obj).parents().eq(2).children('.meta').clone().appendTo('#'+id).css('visibility', 'visible');
+    
+    
+        
+    //deal with the variable height of div.legend
+    $('#exif-container').css({
+        bottom: function(index, value) {
+            return parseFloat($(obj).parent().parent().css("height"))-14;
+        }
+     });
+}
+function remove_exif(id) {
+    $('#'+id).remove();
+}
+$(document).ready(function(){  
+//set up click events for map button
+    $('.map-link').click( function() {
+        var more_id = 'more-container-'+$(this).parent().next().children('.more-link').attr('id').split('-')[1];
+        var id = '#map-container-'+$(this).attr('data-id');
+        if ($('#'+more_id).is(":visible")){
+                remove_exif(more_id);
+        }
+        if ($(id).is(":visible")) {
+            remove_map(id);  
+        } else {
+            create_map($(this));
+        }
+        return false;
+    
+    }); 
+    
+    //set up click events for more info button
+    $('.more-link').click( function() {
+        var map_id = '#map-container-'+$(this).parent().prev().children('.map-link').attr('data-id');
+        var id = 'more-container-'+this.id.split('-')[1];
+        if ($(map_id).is(":visible")){
+            remove_map(map_id);
+        }
+        if ($('#'+id).is(":visible")) {
+            remove_exif(id);
+        } else {
+            get_exif(this, id);
+        }
+        return false;
+    });
+
+});