From a68813f827cf7a5b5c3d868a97515031102e1527 Mon Sep 17 00:00:00 2001 From: Jaifroid Date: Sat, 25 Sep 2021 11:48:36 +0100 Subject: [PATCH] Add option to open map pins with OSM Former-commit-id: 0a8ab5e5f35b3fb5cef8db332a430b84b37b5ebe [formerly be36902fff440bd89e0c0542a5d8e83040bf9db1] [formerly 15dd25c789cf6a0fa8dcbd897a0fd22f89824e1a] [formerly 442b23fdb6100156a7b6ce9f4044bf97e55c48d2 [formerly 5d563ef093b96c3db37f38471e1ad238f0dcfcc1 [formerly 82c3271f8dd6bd98f984de4d5e44030a37ed6bc2]]] Former-commit-id: 531e452fbae853ea22858342bbd321b08c059e62 [formerly 0e319130995d4ca98967c8e8a9a26d16a06a8560 [formerly ae5fcdb7c3737d785e82b9c3cbac64a5793bc1f9]] Former-commit-id: 10be05aa3f8b19de64786c100074b865b36e3750 [formerly c067c6bf3dcfb4d8ebec2cda32e8ed84d3557469] Former-commit-id: 2f54f04fc95850dc7f06a05187207f1e60f5cdde --- www/index.html | 5 +++++ www/js/app.js | 35 ++++++++++++++++++++++++++++------- www/js/init.js | 2 ++ 3 files changed, 35 insertions(+), 7 deletions(-) diff --git a/www/index.html b/www/index.html index 1ac6a8fc..9e8a6221 100644 --- a/www/index.html +++ b/www/index.html @@ -873,6 +873,11 @@ Open all headings (for WikiMedia ZIMs: sets the state of collapsible headings on article load) + diff --git a/www/js/app.js b/www/js/app.js index 490ec45c..e34b6d31 100644 --- a/www/js/app.js +++ b/www/js/app.js @@ -1608,6 +1608,11 @@ define(['jquery', 'zimArchiveLoader', 'uiUtil', 'util', 'cache', 'images', 'sett } openAllSections(); }); + document.getElementById('useOSMCheck').addEventListener('click', function () { + params.mapsURI = this.checked ? 'https://www.openstreetmap.org/' : 'bingmaps:'; + settingsStore.setItem('mapsURI', params.mapsURI, Infinity); + params.themeChanged = true; + }); $('input:radio[name=useMathJax]').on('click', function (e) { params.useMathJax = /true/i.test(this.value); settingsStore.setItem('useMathJax', params.useMathJax, Infinity); @@ -3706,20 +3711,36 @@ define(['jquery', 'zimArchiveLoader', 'uiUtil', 'util', 'cache', 'images', 'sett //Adapt German Wikivoyage POI data format var regexpGeoLocationDE = /([^<]+)[\s\S]+?longitude">([^<]+)<[\s\S]+?(]+?listing-name[^>]+>(?:]+>)?([^<]+))/ig; htmlArticle = htmlArticle.replace(regexpGeoLocationDE, function (match, latitude, longitude, href, id) { - return '\r\nMap marker\r\n' + href; + var html; + if (/bingmaps/.test(params.mapsURI)) { + html = '\r\n'; + } + if (/openstreetmap/.test(params.mapsURI)) { + html = '\r\n'; + } + html += 'Map marker\r\n' + href; + return html; }); //Adapt English Wikivoyage POI data format var regexpGeoLocationEN = /(href\s?=\s?")geo:([^,]+),([^"]+)("[^>]+?(?:data-zoom[^"]+"([^"]+))?[^>]+>)[^<]+(<\/a>[\s\S]+?]+listing-name)[\s\S]+?id\s?=\s?")([^"]+)/ig; - htmlArticle = htmlArticle.replace(regexpGeoLocationEN, function (match, p1, latitude, longitude, p4, p5, p6, id) { - return p1 + "bingmaps://?collection=point." + latitude + "_" + longitude + "_" + - encodeURIComponent(id.replace(/_/g, " ")).replace(/\.(\w\w)/g, "%$1") + - (p5 ? "\&lvl=" + p5 : "") + p4.replace(/style\s?="\s?background:[^"]+"\s?/i, "") + 'Map marker' + p6 + id; + htmlArticle = htmlArticle.replace(regexpGeoLocationEN, function (match, hrefAttr, latitude, longitude, p4, p5, p6, id) { + var html; + if (/bingmaps/.test(params.mapsURI)) { + html = hrefAttr + params.mapsURI + '?collection=point.' + latitude + '_' + longitude + '_' + + encodeURIComponent(id.replace(/_/g, ' ')).replace(/\.(\w\w)/g, '%$1') + + (p5 ? '\&lvl=' + p5 : '') + p4.replace(/style=["']\s?background:[^"']+["']/i, ''); + } + if (/openstreetmap/.test(params.mapsURI)) { + html = hrefAttr + params.mapsURI + '?mlat=' + latitude + '&mlon=' + longitude + '#map=18/' + latitude + '/' + longitude + + p4.replace(/style=["']\s?background:[^"']+["']/i, ''); + } + html += 'Map marker' + p6 + id; + return html; }); //Clean up remaining geo: links - htmlArticle = htmlArticle.replace(/href\s*=\s*"\s*geo:([\d.-]+),([\d.-]+)/ig, 'href="bingmaps://?collection=point.$1_$2_' + encodeURIComponent(dirEntry.getTitleOrUrl())); + htmlArticle = htmlArticle.replace(/href=['"]geo:([\d.-]+),([\d.-]+)[^'"]*/ig, 'href="bingmaps://?collection=point.$1_$2_' + encodeURIComponent(dirEntry.getTitleOrUrl())); // Process any app:// links (these are always from the app payload) to match the current protocol htmlArticle = htmlArticle.replace(/(['"])app:\/\//g, function (p0, p1) { diff --git a/www/js/init.js b/www/js/init.js index 9085e8e1..5a9ad746 100644 --- a/www/js/init.js +++ b/www/js/init.js @@ -94,6 +94,7 @@ params['allowInternetAccess'] = getSetting('allowInternetAccess'); params['windowOpener'] = getSetting('windowOpener'); // 'tab|window|false' A setting that determines whether right-click/long-press of a ZIM link opens a new window/tab params['rightClickType'] = getSetting('rightClickType'); // 'single|double|false' A setting that determines whether a single or double right-click is used to open a new window/tab params['navButtonsPos'] = getSetting('navButtonsPos') || 'bottom'; // 'top|bottom' A setting that determines where the back-forward nav buttons appear +params['mapsURI'] = getSetting('mapsURI') || 'bingmaps:'; // Protocol with colon ('bingmaps:') or URL with final slash ('https://www.openstreetmap.org/') //Do not touch these values unless you know what they do! Some are global variables, some are set programmatically params['imageDisplayMode'] = params.imageDisplay ? 'progressive' : 'manual'; @@ -206,6 +207,7 @@ document.getElementById('removePageMaxWidthCheck').indeterminate = params.remove document.getElementById('removePageMaxWidthCheck').readOnly = params.removePageMaxWidth == "auto"; document.getElementById('pageMaxWidthState').innerHTML = (params.removePageMaxWidth == "auto" ? "auto" : params.removePageMaxWidth ? "always" : "never"); document.getElementById('openAllSectionsCheck').checked = params.openAllSections; +document.getElementById('useOSMCheck').checked = /openstreetmap/.test(params.mapsURI); document.getElementById('cssUIDarkThemeCheck').checked = params.cssUITheme == "dark"; // Will be true, or false if light or auto document.getElementById('cssUIDarkThemeCheck').indeterminate = params.cssUITheme == "auto"; document.getElementById('cssUIDarkThemeCheck').readOnly = params.cssUITheme == "auto";