Added partial FacilMap support #70

2022-03-07 06:37:58 +03:00 · 2022-03-07 06:37:58 +03:00 · 926ed4bb5c
parent cb0d538cf5
commit 926ed4bb5c
6 changed files with 148 additions and 38 deletions
--- a/src/assets/javascripts/helpers/maps.js
+++ b/src/assets/javascripts/helpers/maps.js
@ -3,9 +3,16 @@ import commonHelper from './common.js'

 const targets = /^https?:\/\/(((www|maps)\.)?(google\.).*(\/maps)|maps\.(google\.).*)/;
 let redirects = {
+  'osm': {
    "normal": [
      "https://openstreetmap.org"
    ]
+  },
+  'facil': {
+    "normal": [
+      "https://facilmap.org"
+    ]
+  }
 };
 const mapCentreRegex = /@(-?\d[0-9.]*),(-?\d[0-9.]*),(\d{1,2})[.z]/;
 const dataLatLngRegex = /(!3d|!4d)(-?[0-9]{1,10}.[0-9]{1,10})/g;
@ -16,7 +23,7 @@ const travelModes = {
  bicycling: "fossgis_osrm_bike",
  transit: "fossgis_osrm_car", // not implemented on OSM, default to car.
 };
-const layers = {
+const osmLayers = {
  none: "S",
  transit: "T",
  traffic: "S", // not implemented on OSM, default to standard.
@ -50,88 +57,167 @@ const getDisable = () => disable;
 function setDisable(val) {
  disable = val;
  browser.storage.local.set({ disableMaps: disable })
+  console.log("disableMaps: ", disable)
 }

-function isMaps(url, initiator) {
-  if (disable) return false;
-  if (initiator && initiator.host === "earth.google.com") return false;
-  return url.href.match(targets);
-}
+let frontend;
+const getFrontend = () => frontend;
+function setFrontend(val) {
+  frontend = val;
+  browser.storage.local.set({ mapsFrontend: frontend })
+  console.log("mapsFrontend: ", frontend)
+};
+
+function redirect(url, initiator) {
+
+  if (disable) return;
+  if (initiator && initiator.host === "earth.google.com") return;
+
+  if (!url.href.match(targets)) return;

-function redirect(url) {
  let redirect;
-  let link = commonHelper.getRandomInstance(redirects.normal);
-  let mapCentre = "";
+  let randomInstance
+  if (frontend == 'osm') randomInstance = commonHelper.getRandomInstance(redirects.osm.normal);
+  if (frontend == 'facil') randomInstance = commonHelper.getRandomInstance(redirects.facil.normal);
+  let mapCentre;
  let params = "";
  // Set map centre if present
  if (url.pathname.match(mapCentreRegex)) {
    const [, lat, lon, zoom] = url.pathname.match(mapCentreRegex);
-    mapCentre = `#map=${zoom}/${lat}/${lon}`;
+    if (frontend == 'osm') mapCentre = `#map=${zoom}/${lat}/${lon}`;
+    if (frontend == 'facil') mapCentre = `#${zoom}/${lat}/${lon}`
+
+    console.log("lat", lat) // vertical
+    console.log("lon", lon) // horizontal
+    console.log("zoom", zoom)
+
  } else if (url.search.includes("center=")) {
    const [lat, lon] = url.searchParams.get("center").split(",");
-    mapCentre = `#map=${url.searchParams.get("zoom") || "17"}/${lat}/${lon}`;
-    // Set default zoom if mapCentre not present
-  } else
-    params = "&zoom=17";
+    const zoom = url.searchParams.get("zoom") || "17";
+    if (frontend == 'osm') mapCentre = `#map=${zoom}/${lat}/${lon}`;
+    if (frontend == 'facil') mapCentre = `#${zoom}/${lat}/${lon}`
+
+    console.log("lat", lat)
+    console.log("lon", lon)
+    console.log("zoom", zoom)
+  }

  // Set map layer
-  params = `${params}&layers=${layers[url.searchParams.get("layer")] || layers["none"]}`;
+  let layer = osmLayers[url.searchParams.get("layer")] || osmLayers["none"];
+  params = `${params}&layers=${layer}`;
+
+  console.log("layer", layer);
+
  // Handle Google Maps Embed API
-  if (url.pathname.split("/").includes("embed")) {
+  if (url.pathname.includes("/embed")) {
    let query = "";
    if (url.searchParams.has("q")) query = url.searchParams.get("q");
    else if (url.searchParams.has("query")) query = url.searchParams.has("query");
-    else if (url.searchParams.has("pb")) {
+    else if (url.searchParams.has("pb"))
      try {
        query = url.searchParams.get("pb").split(/!2s(.*?)!/)[1];
      } catch (error) {
        console.error(error); // Unable to find map marker in URL.
      }
-    }
+
+    console.log("query", query)
+
    let marker, bbox;
    addressToLatLng(query, (coords, boundingbox) => {
      marker = coords;
      bbox = boundingbox;
+
+      console.log("marker", marker)
+      console.log("bbox", bbox)
    });
-    redirect = `${link}/export/embed.html?bbox=${bbox}&layer=mapnik&marker=${marker}`;
+    if (frontend == 'osm') redirect = `${randomInstance}/export/embed.html?bbox=${bbox}&layer=mapnik&marker=${marker}`;
+    if (frontend == 'facil') redirect = redirect = `${randomInstance}/${mapCentre}/Mpnk`
+
    // Handle Google Maps Directions
-  } else if (url.pathname.split("/").includes("dir")) {
+  } else if (url.pathname.includes("/dir")) {
    const travelMode = travelModes[url.searchParams.get("travelmode")] || travelModes["driving"];
+
    let origin;
-    addressToLatLng(url.searchParams.get("origin"), (coords) => origin = coords);
+    console.log(url.searchParams.get("origin"))
+    addressToLatLng(url.searchParams.get("origin"), coords => origin = coords);
+
    let destination;
-    addressToLatLng(url.searchParams.get("destination"), (coords) => destination = coords);
-    redirect = `${link}/directions?engine=${travelMode}&route=${origin}%3B${destination}${mapCentre}${params}`;
+    addressToLatLng(url.searchParams.get("destination"), coords => destination = coords);
+
+    if (frontend == 'osm') redirect = `${randomInstance}/directions?engine=${travelMode}&route=${origin}%3B${destination}`;
+    // ${mapCentre}${params}
+
+    if (frontend == 'facil') {
+      mapCentre = mapCentre ?? '#1/0/0';
+      redirect = redirect = `${randomInstance}/${mapCentre}/Mpnk`
+    }
+
+    console.log("travelMode", travelMode)
+    console.log("origin", origin)
+    console.log("destination", destination)
+
    // Get marker from data attribute
  } else if (url.pathname.includes("data=") && url.pathname.match(dataLatLngRegex)) {
    const [mlat, mlon] = url.pathname.match(dataLatLngRegex);
-    redirect = `${link}/?mlat=${mlat.replace("!3d", "")}&mlon=${mlon.replace("!4d", "")}${mapCentre}${params}`;
+
+    if (frontend == 'osm') redirect = `${randomInstance}/?mlat=${mlat.replace("!3d", "")}&mlon=${mlon.replace("!4d", "")}${mapCentre}${params}`;
+
+    if (frontend == 'facil') redirect = redirect = `${randomInstance}/${mapCentre}/Mpnk`
+
+    console.log("mlat", mlat)
+    console.log("mlon", mlon)
+
    // Get marker from ll param
  } else if (url.searchParams.has("ll")) {
    const [mlat, mlon] = url.searchParams.get("ll").split(",");
-    redirect = `${link}/?mlat=${mlat}&mlon=${mlon}${mapCentre}${params}`;
+    redirect = `${randomInstance}/?mlat=${mlat}&mlon=${mlon}${mapCentre}${params}`;
+
+    console.log("mlat", mlat)
+    console.log("mlon", mlon)
+
    // Get marker from viewpoint param.
  } else if (url.searchParams.has("viewpoint")) {
    const [mlat, mlon] = url.searchParams.get("viewpoint").split(",");
-    redirect = `${link}/?mlat=${mlat}&mlon=${mlon}${mapCentre}${params}`;
+    redirect = `${randomInstance}/?mlat=${mlat}&mlon=${mlon}${mapCentre}${params}`;
+
+    console.log("mlat", mlat)
+    console.log("mlon", mlon)
+
    // Use query as search if present.
  } else {
+    console.log("normal life")
+
    let query;
    if (url.searchParams.has("q")) query = url.searchParams.get("q");
    else if (url.searchParams.has("query")) query = url.searchParams.get("query");
    else if (url.pathname.match(placeRegex)) query = url.pathname.match(placeRegex)[1];

-    redirect = `${link}/${query ? "search?query=" + query : ""}${mapCentre || "#"}${params}`;
+    if (frontend == 'osm') {
+      query = query ? "/search?query=" + query : "";
+      mapCentre = mapCentre ?? '#';
+      redirect = `${randomInstance}${query}${mapCentre}${params}`;
+    }
+    if (frontend == 'facil') {
+      query = query ? `/${query}` : "";
+      mapCentre = mapCentre ?? '#1/0/0';
+      redirect = `${randomInstance}/${mapCentre}/Mpnk${query}`
+    }
+
+    console.log("query", query)
  }
  return redirect;
 }

 async function init() {
-  return new Promise((resolve) => {
+  return new Promise(resolve => {
    browser.storage.local.get(
+      [
        "disableMaps",
-      (result) => {
-        disable = result.disableMaps ?? false
+        "mapsFrontend"
+      ],
+      r => {
+        disable = r.disableMaps ?? false
+        frontend = r.mapsFrontend ?? 'osm'
        resolve();
      }
    );
@ -141,7 +227,10 @@ async function init() {
 export default {
  getDisable,
  setDisable,
+
+  getFrontend,
+  setFrontend,
+
  redirect,
-  isMaps,
  init,
 };
--- a/src/pages/background/background.js
+++ b/src/pages/background/background.js
@ -40,6 +40,7 @@ let BYPASSTABs = [];

 browser.webRequest.onBeforeRequest.addListener(
  details => {
+    // console.log("url", details.url);
    const url = new URL(details.url);
    let initiator;
    if (details.originUrl)
@ -57,7 +58,7 @@ browser.webRequest.onBeforeRequest.addListener(

    if (!newUrl) newUrl = instagramHelper.redirect(url, details.type, initiator);

-    if (mapsHelper.isMaps(url, initiator)) newUrl = mapsHelper.redirect(url);
+    if (!newUrl) newUrl = mapsHelper.redirect(url, initiator);

    if (!newUrl) newUrl = redditHelper.redirect(url, details.type, initiator);

--- a/src/pages/options/maps/maps.html
+++ b/src/pages/options/maps/maps.html
@ -89,10 +89,20 @@
  </section>

  <section class="option-block">
+
    <div class="some-block option-block">
      <h4>Enable</h4>
      <input id="disable-osm" type="checkbox" checked />
    </div>
+
+    <div class="some-block option-block">
+      <h4>Frontend</h4>
+      <select id="maps-frontend">
+        <option value="osm">OpenStreetMap</option>
+        <option value="facil">Facil Map</option>
+      </select>
+    </div>
+
  </section>
  <script type="module" src="../init.js"></script>
  <script type="module" src="./maps.js"></script>
--- a/src/pages/options/maps/maps.js
+++ b/src/pages/options/maps/maps.js
@ -5,6 +5,16 @@ disableMapsElement.addEventListener("change",
    (event) => mapsHelper.setDisable(!event.target.checked)
 );

+let mapsFrontendElement = document.getElementById("maps-frontend");
+mapsFrontendElement.addEventListener("change",
+    event => {
+        let frontend = event.target.options[mapsFrontendElement.selectedIndex].value;
+        mapsHelper.setFrontend(frontend);
+    }
+);
+
 mapsHelper.init().then(() => {
    disableMapsElement.checked = !mapsHelper.getDisable();
+    let frontend = mapsHelper.getFrontend();
+    mapsFrontendElement.value = frontend;
 })
--- a/src/pages/options/reddit/reddit.html
+++ b/src/pages/options/reddit/reddit.html
@ -112,7 +112,7 @@
    </div>

    <div class="some-block option-block">
-      <h4>Bypass Read on Reddit</h4>
+      <h4>Bypass "Open in Reddit"</h4>
      <input id="bypass-watch-on-reddit" type="checkbox" checked />
    </div>

--- a/src/pages/options/twitter/twitter.html
+++ b/src/pages/options/twitter/twitter.html
@ -103,7 +103,7 @@
        </div>

        <div class="some-block option-block">
-            <h4>Bypass Watch on Twitter</h4>
+            <h4>Bypass "Open in Twitter"</h4>
            <input id="bypass-watch-on-twitter" type="checkbox" checked />
        </div>