added better icons

lincolnloop · Dec 28, 2011 · e8327bf · e8327bf
1 parent eb272a2
commit e8327bf
Show file tree

Hide file tree

Showing 4 changed files with 36 additions and 39 deletions.
diff --git a/README.rst b/README.rst
@@ -37,6 +37,17 @@ Configuration
 =============
 
  * add `geottagging` to settings.INSTALLED_APPS 
+ * If you want the maps to be displayed, include the necessary javascript::
+   <!-- Map stuff -->
+   <script src="{{ STATIC_URL }}js/vendor/underscore.js" type="text/javascript" charset="utf-8"></script>
+   <script src="{{ STATIC_URL }}js/vendor/backbone.js" type="text/javascript" charset="utf-8"></script>
+   <script src="{{ STATIC_URL }}js/vendor/jquery.tmpl.js" type="text/javascript" charset="utf-8"></script>
+   <script src="http://openlayers.org/api/2.10/OpenLayers.js" type="text/javascript"></script>
+   <script src="http://maps.google.com/maps?file=api&v=2&key=AIzaSyDfzk8s9rszmBTAJVsZ8aLDdaRVwPyVqc4" type="text/javascript"></script>
+   <script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
+   <script src="{{ STATIC_URL }}js/common/global.js" type="text/javascript"></script>
+   <script src="{{ STATIC_URL }}js/app/Spot.js" type="text/javascript" charset="utf-8"></script>
+   <script src="{{ STATIC_URL }}js/app/MapView.js" type="text/javascript" charset="utf-8"></script>
 
 =======
  Usage
@@ -236,15 +247,16 @@ Here's a basic template to include some maps::
 
     {% extends "base.html" %}
     {% load geotagging_maps %}
-    
-    {% block extra_head %}
-    {% geotagging_maps_api %}
-    <script type="text/javascript" src="http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/src/markerclusterer_compiled.js"></script>
-    {% endblock %}
-    
+        
     {% block content %}
-    <p>{% geotagging_map "55.6845043579,12.5735950447" %}</p>
-    <p>{% geotagging_map "59.32809,18.07740" 300 300 5 %}</p>
-    <p>{% geotagging_map attraction_list 300 300 %}</p>
+    <p>
+    <div id="map">
+       <div id="placeholder-map" style="height:400px"></div>
+    </div>
+    {% endblock %}
+
+    {% block js %} {# at the end of the page #}
+        {{ block.super }}
+        {% maps_js "map" items_to_be_mapped %}
     {% endblock %}
 
diff --git a/geotagging/static/js/app/Spot.js b/geotagging/static/js/app/Spot.js
@@ -24,8 +24,14 @@ $$.SpotView = Backbone.View.extend({
 
     initialize: function(options) {
         _.bindAll(this, 'render');
-
         this.model.view = this;
+        if ( this.model.attributes.style.externalGraphic ) {
+            var size = new OpenLayers.Size(21,25), 
+                offset = new OpenLayers.Pixel(-(size.w/2), -size.h);
+            this.icon = new OpenLayers.Icon(this.model.attributes.style.externalGraphic, 
+                                            size, offset);
+        }
+
     },
 
     getIcon: function(){
@@ -63,7 +69,7 @@ $$.Layer = Backbone.Model.extend({
          */
         var size = new OpenLayers.Size(21,25),
             offset = new OpenLayers.Pixel(-(size.w/2), -size.h);
-
+        
         this.icon = new OpenLayers.Icon(this.icon, size, offset);
     },
 

diff --git a/geotagging/templates/geotagging/maps_js.html b/geotagging/templates/geotagging/maps_js.html
@@ -1,18 +1,6 @@
-    <!-- Map stuff -->
-    <script src="{{ STATIC_URL }}js/vendor/underscore.js" type="text/javascript" charset="utf-8"></script>
-    <script src="{{ STATIC_URL }}js/vendor/backbone.js" type="text/javascript" charset="utf-8"></script>
-    <script src="{{ STATIC_URL }}js/vendor/jquery.tmpl.js" type="text/javascript" charset="utf-8"></script>
-    <script src="http://openlayers.org/api/2.10/OpenLayers.js" type="text/javascript"></script>
-    <script src="http://maps.google.com/maps?file=api&v=2&key=AIzaSyDfzk8s9rszmBTAJVsZ8aLDdaRVwPyVqc4" type="text/javascript"></script>
-    <script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
-    <script src="{{ STATIC_URL }}js/common/global.js" type="text/javascript"></script>
-    <script src="{{ STATIC_URL }}js/app/Spot.js" type="text/javascript" charset="utf-8"></script>
-    <script src="{{ STATIC_URL }}js/app/MapView.js" type="text/javascript" charset="utf-8"></script>
-
-
     <script type="text/javascript">
         var map = new $$.Map({
-            id: "map{{ map_count }}",
+            id: "{{ map_id }}",
         })
         $$.maps.add(map);
 
@@ -23,10 +11,10 @@
             collection: new $$.SpotCollection([
                {% for spot in layer.items %}
                {
-                    id: "{{ spot.pk }}",
+                    id: "{% if spot.object %}{{ spot.object.pk }}{% else %}{{ forloop.counter }}{% endif %}",
                     lng: {{ spot.point.x }},
                     lat: {{ spot.point.y }},
-                    style: {{ spot.style }},
+                    style: {{ spot.style|safe }},
                     title: "{{ spot.display }}",
                 }, 
                {% endfor %}

diff --git a/geotagging/templatetags/geotagging_maps.py b/geotagging/templatetags/geotagging_maps.py
@@ -21,13 +21,15 @@ class MapJS(ttag.Tag):
     class Meta:
         name = 'maps_js'
 
+    id = ttag.Arg()
     objects = ttag.Arg()
     zoom = ttag.Arg(required=False, keyword=True)
     static = ttag.Arg(required=False, keyword=True)
     cluster = ttag.Arg(required=False, keyword=True)
 
     def render(self, context):
         data = self.resolve(context)
+        id = data.get('id', None)
         objects = data.get('objects', None)
         zoom = data.get('zoom', None)
         static = data.get('static', None) == "true"
@@ -81,18 +83,16 @@ def render(self, context):
         layers = []
 
         for name, markers in sets.items():
-            show_map = bool(markers)
             for marker in markers:
                 marker['point'].srid = 4326
                 # obj = marker['object']
                 # marker['style']['gt_identifier'] = ('.'.join(("map-"+str(count),
                 #                                               obj.__class__.__name__,
                 #                                               str(obj.id))))
-
             layers.append({'name':name, 'items':markers})
 
         #map configuration
-        controls = not static and ['Navigation', 'PanZoom',] or [] 
+        #controls = not static and ['Navigation', 'PanZoom',] or [] 
         template_name = 'geotagging/maps_js.html'
 
         #if cluster:
@@ -101,20 +101,11 @@ def render(self, context):
 
         t = template.loader.get_template(template_name)
         return t.render(template.RequestContext(context['request'],
-                                                {'layers':layers, 'map_count':count,
-                                                 'show_map':show_map}))
+                                                {'layers':layers, 'map_id':id}))
 
 register.tag(MapJS)
 
 
-class MapPlaceholder(ttag.Tag):
-    class Meta:
-        name = 'maps_js'
-
-    width = ttag.Arg(required=False, keyword=True)
-    height = ttag.Arg(required=False, keyword=True)
-
-
 """
 To-Do:
  * Add proximity display