Support for OSM layers, streetview workaround, & youtu.be

background.js

@@ -1,7 +1,7 @@
 'use strict';
 
 const invidiousDefault = 'https://invidio.us';
-const youtubeRegex = /((www|m)\.)?youtube|ytimg(-nocookie)?\.com/;
+const youtubeRegex = /((www|m)\.)?(youtube|ytimg(-nocookie)?\.com|youtu.be)/;
 const nitterDefault = 'https://nitter.net';
 const twitterRegex = /((www|mobile)\.)?twitter\.com/;
 const bibliogramDefault = 'https://bibliogram.art';
@@ -9,15 +9,21 @@ const instagramRegex = /((www|about|help)\.)?instagram\.com/;
 const instagramPathsRegex = /\/(a|admin|api|favicon.ico|static|imageproxy|p|u|developer|about|legal|explore|director)/;
 const osmDefault = 'https://openstreetmap.org';
 const googleMapsRegex = /https?:\/\/(((www|maps)\.)?(google).*(\/maps)|maps\.(google).*)/;
-const latLngZoomRegex = /@(-?\d[0-9.]*),(-?\d[0-9.]*),(\d{1,2})[.z]/;
+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;
-const latLngRegex = /-?[0-9]{1,10}.[0-9]{1,10}/;
+const placeRegex = /\/place\/(.*)\//;
 const travelModes = {
   'driving': 'fossgis_osrm_car',
   'walking': 'fossgis_osrm_foot',
   'bicycling': 'fossgis_osrm_bike',
   'transit': 'fossgis_osrm_car' // not implemented on OSM, default to car.
 };
+const layers = {
+  'none': 'S',
+  'transit': 'T',
+  'traffic': 'S', // not implemented on OSM, default to standard.
+  'bicycling': 'C'
+}
 
 let nitterInstance;
 let invidiousInstance;
@@ -80,7 +86,7 @@ browser.storage.onChanged.addListener(changes => {
   }
 });
 
-function addressToLatLon(address, callback) {
+function addressToLatLng(address, callback) {
   const xmlhttp = new XMLHttpRequest();
   xmlhttp.onreadystatechange = () => {
     if (xmlhttp.readyState === XMLHttpRequest.DONE) {
@@ -144,48 +150,66 @@ function redirectInstagram(url) {
 function redirectGoogleMaps(url) {
   let redirect;
   let mapCentre = '';
-  if (url.pathname.match(latLngZoomRegex)) {
+  let params = '';
-    const [, lat, lon, zoom] = url.pathname.match(latLngZoomRegex);
+  // Set map centre if present
+  if (url.pathname.match(mapCentreRegex)) {
+    const [, lat, lon, zoom] = url.pathname.match(mapCentreRegex);
     mapCentre = `#map=${zoom}/${lat}/${lon}`;
   } else if (url.search.includes('center=')) {
     const [lat, lon] = url.searchParams.get('center').split(',');
-    mapCentre = `#map=${url.searchParams.get('zoom')}/${lat}/${lon}`;
+    mapCentre = `#map=${url.searchParams.get('zoom') || '17'}/${lat}/${lon}`;
+    // Set default zoom if mapCentre not present
+  } else {
+    params = '&zoom=17';
   }
+  // Set map layer
+  params = `${params}&layers=${layers[url.searchParams.get('layer')] || layers['none']}`;
+  // Handle Google Maps Embed API
   if (url.pathname.includes('/embed')) {
-    const query = url.searchParams.get('q') || url.searchParams.get('query') || url.pathname.split('/')[3];
+    const query = url.searchParams.get('q') || url.searchParams.get('query');
     let marker, bbox;
-    addressToLatLon(query, (coords, boundingbox) => {
+    addressToLatLng(query, (coords, boundingbox) => {
       marker = coords;
       bbox = boundingbox;
     });
     redirect = `${osmInstance}/export/embed.html?bbox=${bbox}&layer=mapnik&marker=${marker}`;
+    // Handle Google Maps Directions
   } else if (url.pathname.includes('/dir')) {
     const travelMode = travelModes[url.searchParams.get('travelmode')] || travelModes['driving'];
     let origin;
-    addressToLatLon(url.searchParams.get('origin'), coords => {
+    addressToLatLng(url.searchParams.get('origin'), coords => {
       origin = coords;
     });
     let destination;
-    addressToLatLon(url.searchParams.get('destination'), coords => {
+    addressToLatLng(url.searchParams.get('destination'), coords => {
       destination = coords;
     });
-    redirect = `${osmInstance}/directions?engine=${travelMode}&route=${origin}%3B${destination}${mapCentre}`;
+    redirect = `${osmInstance}/directions?engine=${travelMode}&route=${origin}%3B${destination}${mapCentre}${params}`;
-  } else if (url.pathname.includes('data=')) {
+    // Get marker from data attribute
+  } else if (url.pathname.includes('data=') && url.pathname.match(dataLatLngRegex)) {
     const [mlat, mlon] = url.pathname.match(dataLatLngRegex);
-    redirect = `${osmInstance}/?mlat=${mlat.replace('!3d', '')}&mlon=${mlon.replace('!4d', '')}${mapCentre}`;
+    redirect = `${osmInstance}/?mlat=${mlat.replace('!3d', '')}&mlon=${mlon.replace('!4d', '')}${mapCentre}${params}`;
-  } else if (url.search.includes('ll=')) {
+    // Get marker from ll param
+  } else if (url.searchParams.has('ll')) {
     const [mlat, mlon] = url.searchParams.get('ll').split(',');
-    redirect = `${osmInstance}/?mlat=${mlat}&mlon=${mlon}${mapCentre}`;
+    redirect = `${osmInstance}/?mlat=${mlat}&mlon=${mlon}${mapCentre}${params}`;
+    // Get marker from viewpoint param.
+  } else if (url.searchParams.has('viewpoint')) {
+    const [mlat, mlon] = url.searchParams.get('viewpoint').split(',');
+    redirect = `${osmInstance}/?mlat=${mlat}&mlon=${mlon}${mapCentre}${params}`;
+    // Use query as search if present.
   } else {
-    const query = url.searchParams.get('q') || url.searchParams.get('query') || url.pathname.split('/')[3];
+    let query;
-    redirect = `${osmInstance}/${query ? 'search?query=' + query : ''}${mapCentre || '#'}`;
+    if (url.searchParams.has('q')) {
-  }
+      query = url.searchParams.get('q');
-  // Set default zoom if mapCentre not present
+    } else if (url.searchParams.has('query')) {
-  if (!mapCentre) {
+      query = url.searchParams.get('query');
-    const redirectUrl = new URL(redirect);
+    } else if (url.pathname.match(placeRegex)) {
-    redirectUrl.searchParams.set('zoom', '17');
+      query = url.pathname.match(placeRegex)[1];
-    redirect = redirectUrl.href;
+    }
+    redirect = `${osmInstance}/${query ? 'search?query=' + query : ''}${mapCentre || '#'}${params}`;
   }
+
   return redirect;
 }
 

manifest.json

@@ -1,7 +1,7 @@
 {
   "name": "Privacy Redirect",
   "description": "Redirects Twitter, YouTube, Instagram & Google Maps requests to privacy friendly alternatives.",
-  "version": "1.1.13",
+  "version": "1.1.14",
   "manifest_version": 2,
   "background": {
     "scripts": [

pages/options/options.html

@@ -38,6 +38,15 @@
     </div>
   </section>
 
+  <section class="options settings_block">
+    <div class="onoffswitch switch" aria-label="Toggle OpenStreetMap redirects">
+      <h1>OpenStreetMap Redirects</h1>
+      <input aria-hidden="true" id="disable-osm" type="checkbox" checked>&nbsp;
+      <label for="disable-osm" class="checkbox-label">
+      </label>
+    </div>
+  </section>
+
   <section class="options settings_block">
     <h1>Nitter Instance</h1>
     <input id="nitter-instance" list="nitter-instance-list" type="url" placeholder="https://nitter.net">
@@ -67,6 +76,11 @@
       <option value="https://bibliogram.snopyta.org">
       <option value="https://bibliogram.dsrev.ru">
     </datalist>
+    <h1>OpenStreetMap Instance</h1>
+    <input id="osm-instance" list="osm-instance-list" type="url" placeholder="https://openstreetmap.org">
+    <datalist id="osm-instance-list">
+      <option value="https://openstreetmap.org">
+    </datalist>
   </section>
 
   <footer>

pages/options/options.js

@@ -3,9 +3,11 @@
 let nitterInstance = document.querySelector('#nitter-instance');
 let invidiousInstance = document.querySelector('#invidious-instance');
 let bibliogramInstance = document.querySelector('#bibliogram-instance');
+let osmInstance = document.querySelector('#osm-instance');
 let disableNitter = document.querySelector('#disable-nitter');
 let disableInvidious = document.querySelector('#disable-invidious');
 let disableBibliogram = document.querySelector('#disable-bibliogram');
+let disableOsm = document.querySelector('#disable-osm');
 
 window.browser = window.browser || window.chrome;
 
@@ -14,17 +16,21 @@ browser.storage.sync.get(
     'nitterInstance',
     'invidiousInstance',
     'bibliogramInstance',
+    'osmInstance',
     'disableNitter',
     'disableInvidious',
     'disableBibliogram',
+    'disableOsm'
   ],
   result => {
     nitterInstance.value = result.nitterInstance || '';
     invidiousInstance.value = result.invidiousInstance || '';
     bibliogramInstance.value = result.bibliogramInstance || '';
+    osmInstance.value = result.osmInstance || '';
     disableNitter.checked = !result.disableNitter;
     disableInvidious.checked = !result.disableInvidious;
     disableBibliogram.checked = !result.disableBibliogram;
+    disableOsm.checked = !result.disableOsm;
   }
 );
 
@@ -33,9 +39,11 @@ document.querySelector('#save').addEventListener('click', () => {
     nitterInstance: nitterInstance.value && nitterInstance.checkValidity() ? new URL(nitterInstance.value).origin : '',
     invidiousInstance: invidiousInstance.value && invidiousInstance.checkValidity() ? new URL(invidiousInstance.value).origin : '',
     bibliogramInstance: bibliogramInstance.value && bibliogramInstance.checkValidity() ? new URL(bibliogramInstance.value).origin : '',
+    osmInstance: osmInstance.value && osmInstance.checkValidity() ? new URL(osmInstance.value).origin : '',
     disableNitter: !disableNitter.checked,
     disableInvidious: !disableInvidious.checked,
-    disableBibliogram: !disableBibliogram.checked
+    disableBibliogram: !disableBibliogram.checked,
+    disableOsm: !disableOsm.checked
   });
   window.close();
 });