Enable map for service pages

_layouts/service.html

@@ -47,6 +47,34 @@
             </div>
           </div>
           <!-- END Grid View Content -->
+
+          <!-- START Map View Content -->
+          <div class="tabs-panel" id="map">
+            <div class="row small-up-2 medium-up-4 large-up-6 small-collapse">
+              <div id="map-services"></div>
+              <script type="text/javascript">
+                var mapEntries = [
+                  {% for coop in site.coops %}
+                    {% if coop.services contains page.slug %}
+                      {
+                        lat: {{ coop.latitude }},
+                        lng: {{ coop.longitude }},
+                        markerText: '<b><a href=\"{{ coop.url | relative_url }}\">{{ coop.name }}</a></b><br><br>{{ coop.address | split: "," | join: "<br>" }}'
+                      },
+                    {% endif %}
+                  {% endfor %}
+                ];
+
+                $(document).ready(function() {
+                    window.app.createMapMultiMarker('map-services', 54.7, -4.2, 6, mapEntries);
+                });
+
+                // TODO fix bug with tiles not displaying properly until window resized
+
+              </script>
+            </div>
+          </div>
+          <!-- END Map View Content -->
         </div>
       </div>
     </div>