refactor code that choses the tile server based on podmin's choice

and remove the possibility to disable the map feature. By default the application uses the itles of Heidelberg University that don't need any credentials. If podmins enable the mapbox option in the diaspora.yml and enter their credentials the mapbox tiles are used for the map rendering.
2015-09-09 17:03:46 +02:00 · 2015-09-09 17:03:46 +02:00 · 263dc6f119
commit 263dc6f119
parent 0f3eff8f88
7 changed files with 67 additions and 63 deletions
--- a/app/assets/javascripts/app/views/location_stream.js
+++ b/app/assets/javascripts/app/views/location_stream.js
@ -7,43 +7,46 @@ app.views.LocationStream = app.views.Content.extend({
  templateName: "status-message-location",

  toggleMap: function () {
-    if (gon.appConfig.map.enabled){
-      var mapContainer = this.$el.find(".mapContainer");
+    var mapContainer = this.$el.find(".mapContainer");

-      if (mapContainer.hasClass("empty")) {
-        var location = this.model.get("location");
-        mapContainer.css("height", "150px");
+    if (mapContainer.hasClass("empty")) {
+      var location = this.model.get("location");
+      mapContainer.css("height", "150px");

-        if (location.lat) {
+      if (location.lat) {
+        // If map function is enabled the maptiles from the Heidelberg University are used by default.

-          // If the mapbox option is enabled in the diaspora.yml, the mapbox tiles with the podmin's credentials are used.
-          // If mapbox is not enabled the Maptiles from the Heidelberg University are used, which don't need credentials.
-          var mapsource = gon.appConfig.map.mapbox.enabled ? gon.appConfig.map.mapbox : "";
-          var tileLayerSource = mapsource ? "https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token={accessToken}"
-                                          : "http://korona.geog.uni-heidelberg.de/tiles/roads/x={x}&y={y}&z={z}";
-          var tileAttribution = mapsource ? "<a href='http://creativecommons.org/licenses/by-sa/2.0/''>CC-BY-SA</a>, " +
-                                            "Imagery © <a href='https://www.mapbox.com'>Mapbox</a>"
-                                          : "rendering <a href='http://giscience.uni-hd.de/'>" +
-                                            "GIScience Research Group @ Heidelberg University</a>";
-          var attribution = "Map data &copy; <a href='http://openstreetmap.org'>OpenStreetMap</a> contributors, " +
-                            tileAttribution;
+        var map = L.map(mapContainer[0]).setView([location.lat, location.lng], 14);

-          var map = L.map(mapContainer[0]).setView([location.lat, location.lng], 14);
-          L.tileLayer(tileLayerSource, {
-            id: mapsource.id,
-            accessToken: mapsource.access_token,
-            attribution:  attribution,
+        var tiles = L.tileLayer("http://korona.geog.uni-heidelberg.de/tiles/roads/x={x}&y={y}&z={z}", {
+          attribution: "Map data &copy; <a href='http://openstreetmap.org'>OpenStreetMap</a> contributors, " +
+                        "rendering <a href='http://giscience.uni-hd.de/'>" +
+                        "GIScience Research Group @ Heidelberg University</a>",
+          maxZoom: 18,
+          });
+
+        // If the mapbox option is enabled in the diaspora.yml, the mapbox tiles with the podmin's credentials are used.
+        if (gon.appConfig.map.mapbox.enabled) {
+
+          tiles = L.tileLayer("https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token={accessToken}", {
+            id: gon.appConfig.map.mapbox.id,
+            accessToken: gon.appConfig.map.mapbox.access_token,
+            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>, " +
+                         "Imagery © <a href='https://www.mapbox.com'>Mapbox</a>",
            maxZoom: 18,
-          }).addTo(map);
+          });
+        }

-          var markerOnMap = L.marker(location).addTo(map);
-          mapContainer.removeClass("empty");
-          return map;
-        }
-      } else {
-          mapContainer.toggle();
-        }
+        tiles.addTo(map);
+
+        var markerOnMap = L.marker(location).addTo(map);
+        mapContainer.removeClass("empty");
+        return map;
      }
-    }
+    } else {
+        mapContainer.toggle();
+      }
+  }
 });
 // @license-end
--- a/app/assets/javascripts/app/views/single-post-viewer/single_post_content_view.js
+++ b/app/assets/javascripts/app/views/single-post-viewer/single_post_content_view.js
@ -27,7 +27,7 @@ app.views.SinglePostContent = app.views.Base.extend({
  },

  map : function(){
-    if (this.$el.find(".mapContainer")&&gon.appConfig.map.enabled){
+    if (this.$el.find(".mapContainer")){

      // find and set height of mapContainer to max size of the container
      // which is necessary to have all necessary tiles prerendered
@ -37,25 +37,31 @@ app.views.SinglePostContent = app.views.Base.extend({
      // get location data and render map
      var location = this.model.get("location");

-      // If the mapbox option is enabled in the diaspora.yml, the mapbox tiles with the podmin's credentials are used.
-      // If mapbox is not enabled the Maptiles from the Heidelberg University are used, which don't need credentials.
-      var mapsource = gon.appConfig.map.mapbox.enabled ? gon.appConfig.map.mapbox : "";
-      var tileLayerSource = mapsource ? "https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token={accessToken}"
-                                      : "http://korona.geog.uni-heidelberg.de/tiles/roads/x={x}&y={y}&z={z}";
-      var tileAttribution = mapsource ? "<a href='http://creativecommons.org/licenses/by-sa/2.0/''>CC-BY-SA</a>, " +
-                                        "Imagery © <a href='https://www.mapbox.com'>Mapbox</a>"
-                                      : "rendering <a href='http://giscience.uni-hd.de/'>" +
-                                        "GIScience Research Group @ Heidelberg University</a>";
-      var attribution = "Map data &copy; <a href='http://openstreetmap.org'>OpenStreetMap</a> contributors, " +
-                        tileAttribution;
+      // If map function is enabled the maptiles from the Heidelberg University are used by default.

      var map = L.map(mapContainer[0]).setView([location.lat, location.lng], 14);
-      L.tileLayer(tileLayerSource, {
-        id: mapsource.id,
-        accessToken: mapsource.access_token,
-        attribution:  attribution,
+
+      var tiles = L.tileLayer("http://korona.geog.uni-heidelberg.de/tiles/roads/x={x}&y={y}&z={z}", {
+        attribution: "Map data &copy; <a href='http://openstreetmap.org'>OpenStreetMap</a> contributors, " +
+                      "rendering <a href='http://giscience.uni-hd.de/'>" +
+                      "GIScience Research Group @ Heidelberg University</a>",
        maxZoom: 18,
-      }).addTo(map);
+        });
+
+      // If the mapbox option is enabled in the diaspora.yml, the mapbox tiles with the podmin's credentials are used.
+      if (gon.appConfig.map.mapbox.enabled) {
+
+        tiles = L.tileLayer("https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token={accessToken}", {
+          id: gon.appConfig.map.mapbox.id,
+          accessToken: gon.appConfig.map.mapbox.access_token,
+          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>, " +
+                       "Imagery © <a href='https://www.mapbox.com'>Mapbox</a>",
+          maxZoom: 18,
+        });
+      }
+
+      tiles.addTo(map);

      // set mapContainer size to a smaller preview size
      mapContainer.css("height", "75px");
@ -68,11 +74,9 @@ app.views.SinglePostContent = app.views.Base.extend({
  },

  toggleMap: function () {
-    if (gon.appConfig.map.enabled){
      $(".mapContainer").height($(".small-map")[0] ? 200 : 50);
      $(".leaflet-control-zoom").css("display", $(".small-map")[0] ? "block" : "none");
      $(".mapContainer").toggleClass("small-map");
-    }
  },

  presenter : function() {
--- a/app/controllers/application_controller.rb
+++ b/app/controllers/application_controller.rb
@ -146,7 +146,7 @@ class ApplicationController < ActionController::Base
    gon.push(appConfig: {
               chat:     {enabled: AppConfig.chat.enabled?},
               settings: {podname: AppConfig.settings.pod_name},
-               map:      {enabled: AppConfig.map.enabled?, mapbox: AppConfig.map.mapbox}
+               map:      {mapbox: AppConfig.map.mapbox}
             })
  end

--- a/config/defaults.yml
+++ b/config/defaults.yml
@ -76,7 +76,6 @@ defaults:
        file: 'log/vines.log'
        level: 'info'
  map:
-    enabled: true
    mapbox:
      enabled: false
      id:
--- a/config/diaspora.yml.example
+++ b/config/diaspora.yml.example
@ -325,17 +325,15 @@ configuration: ## Section
        #level: 'info'

  ## Displays the location of a post in a map. Per default we are using the map
-  ## tiles of OpenMapSurfer (http://korona.geog.uni-heidelberg.de/).
-  ## If you want to use them you only have to enable the map. You also have the
-  ## possibility to use the map tiles of https://www.mapbox.com which is probably
-  ## more reliable. There you have to create a account to get an ID and an access token which is limited. If
-  ## you want to get an unlimited account you can write an email
-  ## to team@diasporafoundation.org. Please enable mapbox and fill out your id
-  ## and access_token.
+  ## tiles of the Heidelberg University (http://giscience.uni-hd.de).
+  ## You also have the possibility to use the map tiles of https://www.mapbox.com
+  ## which is probably more reliable. There you have to create an account to get
+  ## an ID and an access token which is limited. If you want to get an unlimited
+  ## account you can write an email to team@diasporafoundation.org.
+  ## Please enable mapbox and fill out your id and access_token.
  map: ##Section

-  # enabled: true
-  # mapbox:
+    mapbox:
    # enabled: false
    # id: 'your.id'
    # access_token: 'youraccesstoken'
--- a/spec/javascripts/app/views/location_stream_spec.js
+++ b/spec/javascripts/app/views/location_stream_spec.js
@ -2,7 +2,7 @@ describe("app.views.LocationStream", function() {
  beforeEach(function(){
    this.post = factory.post();
    this.view = new app.views.LocationStream({model : this.post});
-    gon.appConfig = { map: {enabled: true, mapbox: {enabled: true, id: "yourID", access_token: "yourAccessToken" }} };
+    gon.appConfig = {map: { mapbox: {enabled: true, id: "yourID", access_token: "yourAccessToken" }}};
  });

  describe("toggleMap", function() {
--- a/spec/javascripts/app/views/single_post_content_view_spec.js
+++ b/spec/javascripts/app/views/single_post_content_view_spec.js
@ -2,7 +2,7 @@ describe("app.views.SinglePostContent", function() {
  beforeEach(function(){
    this.post = factory.post();
    this.view = new app.views.SinglePostContent({model : this.post});
-    gon.appConfig = { map: {enabled: true, mapbox: {enabled: true, id: "yourID", accessToken: "yourAccessToken" }} };
+    gon.appConfig = { map: {mapbox: {enabled: true, id: "yourID", accessToken: "yourAccessToken" }}};
  });

  describe("toggleMap", function() {