rewrite of fetch into redundant version

Author: Michael Maier

Q5-fallback.json

@@ -0,0 +1 @@
+{"entities":{"Q5":{"pageid":62,"ns":120,"title":"Item:Q5","lastrevid":3393,"modified":"2016-09-26T08:48:05Z","type":"item","id":"Q5","labels":{"en":{"language":"en","value":"Taxonomy category"},"de":{"language":"de","value":"Taxonomie-Kategorie"},"fa":{"language":"fa","value":"\u0637\u0628\u0642\u0647 \u0628\u0646\u062f\u06cc"},"ro":{"language":"ro","value":"Categorie taxonometric\u0103"},"ga":{"language":"ga","value":"Tacsan\u00f3im\u00edocht Catag\u00f3ir"},"hr":{"language":"hr","value":"Kategorija taksonomije"},"pl":{"language":"pl","value":"Kategoria taksonomii"},"el":{"language":"el","value":"\u039a\u03b1\u03c4\u03b7\u03b3\u03bf\u03c1\u03af\u03b1 \u03a4\u03b1\u03be\u03b9\u03bd\u03bf\u03bc\u03af\u03b1\u03c2"},"es":{"language":"es","value":"Categor\u00eda taxon\u00f3mica"},"lv":{"language":"lv","value":"Taksonomijas kategorija"},"cs":{"language":"cs","value":"Kategorie taxonomie"},"bg":{"language":"bg","value":"\u0422\u0430\u043a\u0441\u043e\u043d\u043e\u043c\u0438\u0447\u043d\u0430 \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u044f"},"et":{"language":"et","value":"Taksonoomia kategooria"},"pt":{"language":"pt","value":"Categoria de sistematiza\u00e7\u00e3o"},"fi":{"language":"fi","value":"Luokittelukategoria"}},"descriptions":{"de":{"language":"de","value":"Taxonomie-Kategorie"}},"aliases":[],"claims":{"P9":[{"mainsnak":{"snaktype":"value","property":"P9","datavalue":{"value":{"entity-type":"item","numeric-id":3},"type":"wikibase-entityid"},"datatype":"wikibase-item"},"type":"statement","id":"Q5$98e7621c-44a8-dd92-3072-7622f3fdc72d","rank":"normal"}]},"sitelinks":[]}}}

index.html

@@ -167,6 +167,7 @@ <h3><%- T("type_of_initiative") %></h3>
   <script defer="defer" src="bower_components/leaflet/dist/leaflet.js"></script>
   <script defer="defer" src="scripts/leaflet-hash.js"></script>
   <script defer="defer" src="bower_components/PruneCluster/dist/PruneCluster.min.js"></script>
+  <script defer="defer" src="scripts/red_fetch.js"></script>
   <script defer="defer" src="scripts/map.js"></script>
 </body>
 </html>

scripts/map.js

@@ -7,6 +7,8 @@
 var data_url = "https://data.transformap.co/raw/5d6b9d3d32097fd6832200874402cfc3";
 var fallback_data_url = "susydata-fallback.json";
 
+var redundant_data_urls = [ "https://data.transformap.co/raw/5d6b9d3d32097fd6832200874402cfc3", "susydata-fallback.json" ];
+
 /* fix for leaflet scroll on devices that fire scroll too fast, e.g. Macs
    see https://github.com/Leaflet/Leaflet/issues/4410#issuecomment-234133427
 
@@ -176,153 +178,7 @@ function addPOIsToMap(geoJSONfeatureCollection) {
   return true;
 }
 
-/* new version of getting map data with promises 
-  should fetch data_url, and in case it doesn't respond in a timeout, fetch fallback_data_url
-
-  taken from https://blog.hospodarets.com/fetch_in_action
-*/
-
-var processStatus = function (response) {
-    // status "0" to handle local files fetching (e.g. Cordova/Phonegap etc.)
-    if (response.status === 200 || response.status === 0) {
-        return Promise.resolve(response)
-    } else {
-        return Promise.reject(new Error(response.statusText))
-    }
-};
-
-var parseJson = function (response) {
-    return response.json();
-};
-
-/* @returns {wrapped Promise} with .resolve/.reject/.catch methods */
-// It goes against Promise concept to not have external access to .resolve/.reject methods, but provides more flexibility
-var getWrappedPromise = function () {
-    var wrappedPromise = {},
-            promise = new Promise(function (resolve, reject) {
-                wrappedPromise.resolve = resolve;
-                wrappedPromise.reject = reject;
-            });
-    wrappedPromise.then = promise.then.bind(promise);
-    wrappedPromise.catch = promise.catch.bind(promise);
-    wrappedPromise.promise = promise;// e.g. if you want to provide somewhere only promise, without .resolve/.reject/.catch methods
-    return wrappedPromise;
-};
-
-/* @returns {wrapped Promise} with .resolve/.reject/.catch methods */
-var getWrappedFetch = function () {
-    var wrappedPromise = getWrappedPromise();
-    var args = Array.prototype.slice.call(arguments);// arguments to Array
-
-    fetch.apply(null, args)// calling original fetch() method
-        .then(function (response) {
-            wrappedPromise.resolve(response);
-        }, function (error) {
-            wrappedPromise.reject(error);
-        })
-        .catch(function (error) {
-            wrappedPromise.catch(error);
-        });
-    return wrappedPromise;
-};
-
-/**
- * Fetch JSON by url
- * @param { {
- *  url: {String},
- *  [cacheBusting]: {Boolean}
- * } } params
- * @returns {Promise}
- */
-
-var MAX_WAITING_TIME = 5000;// in ms
-
-var getJSON = function (params) {
-    var wrappedFetch = getWrappedFetch(
-        params.cacheBusting ? params.url + '?' + new Date().getTime() : params.url,
-        {
-            method: 'get',// optional, "GET" is default value
-            headers: {
-                'Accept': 'application/json'
-            }
-        });
-
-    var timeoutId = setTimeout(function () {
-        wrappedFetch.reject(new Error('Load timeout for resource: ' + params.url));// reject on timeout
-    }, MAX_WAITING_TIME);
-
-    return wrappedFetch.promise// getting clear promise from wrapped
-        .then(function (response) {
-            clearTimeout(timeoutId);
-            return response;
-        })
-        .then(processStatus)
-        .then(parseJson);
-};
-
-/*--- TEST  --*/
-var onComplete = function () {
-    console.log('I\'m invoked in any case after success/error');
-};
-
-/*
-getJSON({
-    url: data_url,
-    cacheBusting: true
-}).then(function (data) {// on success
-    console.log('JSON parsed successfully!');
-    console.log(data);
-    addPOIsToMap(data);
-//    onComplete(data);
-}, function (error) {// on reject
-    console.error('An error occured!');
-    console.error(error.message ? error.message : error);
-//    onComplete(error);
-});*/
-
-function myGetJSON(url,success_function,error_function) {
-  var getJSONparams = { url: url, cacheBusting: true };
-
-  getJSON(getJSONparams).then( 
-    function (data) { success_function(data) },
-    function (error) { error_function(error) }
-  );
-}
-
-myGetJSON( data_url, 
-  function(data) { 
-    var adding_pois_successful = addPOIsToMap(data);
-    if(adding_pois_successful) {
-      console.log("1st try to fetch POI data from API ("+data_url+") was successful");
-      return;
-    }
-    console.log("API didn't return useful data from "+data_url+", try static file");
-    myGetJSON( fallback_data_url,
-      function(data) {
-        if(!addPOIsToMap(data))
-          console.error("2nd try to fetch POI data from " + fallback_data_url + " failed too");
-      },
-      function (error) { 
-        console.error("2nd try to fetch POI data from " + fallback_data_url + " failed too"); 
-        console.error(error.message ? error.message : error);
-      });
-    },
-  function(error) {
-    console.log("1st try to fetch POI data from API ("+data_url+") failed, try fallback");
-    myGetJSON( fallback_data_url,
-      function(data) {
-        var adding_pois_successful = addPOIsToMap(data);
-        if(adding_pois_successful)
-          console.log("2nd try to fetch POI data from " + fallback_data_url + " successful.");
-        else
-          console.error("2nd try to fetch POI data from " + fallback_data_url + " failed too");
-      },
-      function (error) { 
-        console.error("2nd try to fetch POI data from " + fallback_data_url + " failed too");
-        console.error(error.message ? error.message : error);
-      });
-  });
-    
+redundantFetch( redundant_data_urls ,addPOIsToMap, function(error) { console.error("none of the POI data urls available"); } );
 
 /* get taxonomy stuff */
 var taxonomy_url = "http://viewer.transformap.co/taxonomy.json";
@@ -364,8 +220,7 @@ function getLangTaxURL(lang) {
       'SERVICE wikibase:label {bd:serviceParam wikibase:language "'+lang+'" }' +
     '}';
 
-//   return 'https://query.base.transformap.co/bigdata/namespace/transformap/sparql?query=' +encodeURIComponent(tax_query) + "&format=json"; // server not CORS ready yet
-  return "https://raw.githubusercontent.com/TransforMap/transformap-viewer-translations/master/taxonomy-backup/susy/taxonomy."+lang+".json";
+   return 'https://query.base.transformap.co/bigdata/namespace/transformap/sparql?query=' +encodeURIComponent(tax_query) + "&format=json"; // server not CORS ready yet
 }
 
 function setFilterLang(lang) {
@@ -377,11 +232,9 @@ function setFilterLang(lang) {
   if(multilang_taxonomies[lang]) {
     setTaxonomy(multilang_taxonomies[lang]);
   } else {
-    $.ajax({
-      url: getLangTaxURL(lang),
-      dataType: "json",
-      success: applyOrAddTaxonomyLang,
-    });
+    redundantFetch( [ getLangTaxURL(lang), "https://raw.githubusercontent.com/TransforMap/transformap-viewer-translations/master/taxonomy-backup/susy/taxonomy."+lang+".json" ],
+      applyOrAddTaxonomyLang,
+      function(error) { console.error("none of the taxonomy data urls available") } );
   }
 }
 
@@ -1169,7 +1022,8 @@ setFallbackLangs();
 
 
 /* get languages for UI from our Wikibase, and pick languages that are translated there */
-$.getJSON("https://base.transformap.co/wiki/Special:EntityData/Q5.json", function (returned_data){
+
+function initializeLanguageSwitcher(returned_data){
   for(lang in returned_data.entities.Q5.labels) { //Q5 is arbitrary. Choose one that gets translated for sure.
     supported_languages.push(lang);
   }
@@ -1210,7 +1064,11 @@ $.getJSON("https://base.transformap.co/wiki/Special:EntityData/Q5.json", functio
       $("#languageSelector ul").append("<li targetlang=" + langcode + is_default + " onClick='switchToLang(\""+langcode+"\");'>"+item+"</li>");
     });
   });
-});
+}
+redundantFetch( [ "https://base.transformap.co/wiki/Special:EntityData/Q5.json", "https://raw.githubusercontent.com/TransforMap/transformap-viewer/Q5-fallback.json", "Q5-fallback.json" ],
+  initializeLanguageSwitcher,
+  function(error) { console.error("none of the lang init data urls available") } );
+  
 
 function switchToLang(lang) {
   $("#languageSelector li.default").removeClass("default");

scripts/red_fetch.js

@@ -0,0 +1,142 @@
+/* 
+ * This library provides a 'fetch', where you can use fallback URIs, to build on redundant servers.
+ *
+ * Mon  3 Oct 15:07:12 CEST 2016
+ * Michael Maier (species@github), WTFPL
+ *
+ * Give it an array of resources, that can be fetched from different urls. 
+ * Will try to fetch them in the provided order.
+ * Execute success_function on the first successful fetch, and error_function only if all resources fail to fetch.
+ */
+
+/* This program is free software. It comes without any warranty, to
+     * the extent permitted by applicable law. You can redistribute it
+     * and/or modify it under the terms of the Do What The Fuck You Want
+     * To Public License, Version 2, as published by Sam Hocevar. See
+     * http://www.wtfpl.net/ for more details. */
+
+/* new version of getting map data with promises 
+
+  taken from https://blog.hospodarets.com/fetch_in_action
+*/
+
+var processStatus = function (response) {
+    // status "0" to handle local files fetching (e.g. Cordova/Phonegap etc.)
+    if (response.status === 200 || response.status === 0) {
+        return Promise.resolve(response)
+    } else {
+        return Promise.reject(new Error(response.statusText))
+    }
+};
+
+var parseJson = function (response) {
+    return response.json();
+};
+
+/* @returns {wrapped Promise} with .resolve/.reject/.catch methods */
+// It goes against Promise concept to not have external access to .resolve/.reject methods, but provides more flexibility
+var getWrappedPromise = function () {
+    var wrappedPromise = {},
+            promise = new Promise(function (resolve, reject) {
+                wrappedPromise.resolve = resolve;
+                wrappedPromise.reject = reject;
+            });
+    wrappedPromise.then = promise.then.bind(promise);
+    wrappedPromise.catch = promise.catch.bind(promise);
+    wrappedPromise.promise = promise;// e.g. if you want to provide somewhere only promise, without .resolve/.reject/.catch methods
+    return wrappedPromise;
+};
+
+/* @returns {wrapped Promise} with .resolve/.reject/.catch methods */
+var getWrappedFetch = function () {
+    var wrappedPromise = getWrappedPromise();
+    var args = Array.prototype.slice.call(arguments);// arguments to Array
+
+    fetch.apply(null, args)// calling original fetch() method
+        .then(function (response) {
+            wrappedPromise.resolve(response);
+        }, function (error) {
+            wrappedPromise.reject(error);
+        })
+        .catch(function (error) {
+            wrappedPromise.catch(error);
+        });
+    return wrappedPromise;
+};
+
+/**
+ * Fetch JSON by url
+ * @param { {
+ *  url: {String},
+ *  [cacheBusting]: {Boolean}
+ * } } params
+ * @returns {Promise}
+ */var MAX_WAITING_TIME = 5000;// in ms
+
+var getJSON = function (params) {
+    var wrappedFetch = getWrappedFetch(
+        params.cacheBusting ? params.url + '?' + new Date().getTime() : params.url,
+        {
+            method: 'get',// optional, "GET" is default value
+            headers: {
+                'Accept': 'application/json'
+            }
+        });
+
+    var timeoutId = setTimeout(function () {
+        wrappedFetch.reject(new Error('Load timeout for resource: ' + params.url));// reject on timeout
+    }, MAX_WAITING_TIME);
+
+    return wrappedFetch.promise// getting clear promise from wrapped
+        .then(function (response) {
+            clearTimeout(timeoutId);
+            return response;
+        })
+        .then(processStatus)
+        .then(parseJson);
+};
+
+function myGetJSON(url,success_function,error_function) {
+  var getJSONparams = { url: url, cacheBusting: true };
+
+  getJSON(getJSONparams).then( 
+    function (data) { success_function(data) },
+    function (error) { error_function(error) }
+  );
+}
+
+function redundantFetch (data_url_array, success_function, error_function) {
+  if( ! (!!data_url_array && Array === data_url_array.constructor ) ) {
+    console.error("redundantFetch: argument is no array");
+    console.error(data_url_array);
+    return false;
+  }
+  var current_url = data_url_array[0];
+  if(typeof(current_url) !== 'string') {
+    console.error("redundantFetch: url is no string");
+    return false;
+  }
+
+  console.log("redundantFetch called, urls:");
+  console.log(data_url_array);
+
+  data_url_array.shift();
+
+  var local_error_function;
+  var local_success_function;
+  if(data_url_array.length == 0) { //last iteration
+    local_success_function = success_function;
+    local_error_function = error_function;
+  } else {
+    local_success_function = success_function;
+    local_error_function = function (error) {
+      redundantFetch(data_url_array, success_function, error_function);
+    }
+  }
+  
+  var getJSONparams = { url: current_url, cacheBusting: true };
+  getJSON(getJSONparams).then( 
+    function (data) { local_success_function(data); console.log("rfetch: success on "); console.log(data); },
+    function (error) { local_error_function(error); console.log("rfetch: fail on "); console.log(error);  }
+  );
+}