Benutzer:Herzi Pinki/GeoDECpopup.js
Zur Navigation springen
Zur Suche springen
Hinweis: Leere nach dem Veröffentlichen den Browser-Cache, um die Änderungen sehen zu können.
- Firefox/Safari: Umschalttaste drücken und gleichzeitig Aktualisieren anklicken oder entweder Strg+F5 oder Strg+R (⌘+R auf dem Mac) drücken
- Google Chrome: Umschalttaste+Strg+R (⌘+Umschalttaste+R auf dem Mac) drücken
- Edge: Strg+F5 drücken oder Strg drücken und gleichzeitig Aktualisieren anklicken
// popup for geohack
( function ( mw, $ ) {
"use strict";
var geohackRE = /https:\/\/geohack\.toolforge\.org\/geohack\.php\?.*params=([\d\.\-]+)_(N|S)_([\d\.\-]+)_(O|E|W).*/;
// does not work for Wikidata
// wikidata https://geohack.toolforge.org/geohack.php?params=48.17586_N_16.2918_E_globe:earth&language=de
// <a href="https://geohack.toolforge.org/geohack.php?params=48.17586_N_16.2918_E_globe:earth&language=de" class="external">48°10'33"N, 16°17'30"E</a>
// the structure of geohack links
// helper for setTimeout
function autoFadeOutPopup (o) {
o.fadeOut("slow");
}
function fadeInPopup (event) {
var div = $(event.target).find('.DECpu');
div.fadeIn("slow");
setTimeout(autoFadeOutPopup,7000,div);
return false;
}
function fadeOutPopup(event) {
var sel = document.getSelection().toString();
if(!sel){ // only of no selection for copy
$(event.target).closest('.DECpu').fadeOut("slow");
}
return false;
}
$(document).ready(function() {
var texts = (function texts() {
var translations = {
en: {
copy: "copy to clipboard",
logoTitle: "Geotools by Herzi Pinki",
credits: " DEC-Coords:",
},
de: {
copy: "In die Zwischenablage kopieren",
logoTitle: "Geowerkzeuge von Herzi Pinki",
credits: " DEC-Koordinaten:",
},
},
chain = mw.language.getFallbackLanguageChain(),
len = chain.length,
ret = {},
i = len - 1;
while (i >= 0) {
if (translations.hasOwnProperty(chain[i])) {
$.extend(ret, translations[chain[i]]);
}
i -= 1;
}
return ret;
}());
var anchors = document.getElementsByTagName("a");
var i; // declare i
for (i = 0; i < anchors.length; i++) {
var coords = anchors[i].href.match(geohackRE);
if (coords) {
var parentNode = anchors[i].parentNode;
// geohack link found
// coords[0] is the whole line
// var geohackRE = /https:\/\/geohack\.toolforge\.org\/geohack\.php\?.*params=([\d\.\-]+)_(N|S)_([\d\.\-]+)_(O|E|W).*/;
// (1 ) (2 ) (3 ) (4 )
var lat = (coords[2] == 'S')? -coords[1] : coords[1];
var lon = (coords[4] == 'W')? -coords[3] : coords[3];
lat = Math.round(lat * 1000000) / 1000000; // round to 6 digits
lon = Math.round(lon * 1000000) / 1000000;
var cval = lat.toString() + ', ' + lon.toString();
var dynDiv = document.createElement("div");
var id = "DEC"+i.toString();
dynDiv.setAttribute("id", id);
var header = document.createElement("div");
header.style.fontSize = "small";
header.style.whiteSpace = "nowrap";
// copy to clipboard
var copybutton = document.createElement("img");
copybutton.style.width = "30px";
copybutton.style.height = "30px";
copybutton.style.float = "right";
copybutton.style.padding = "5px 1px";
copybutton.src = "//upload.wikimedia.org/wikipedia/commons/thumb/a/a2/Edit-copy.svg/30px-Edit-copy.svg.png";
copybutton.title = texts.copy;
copybutton.decoding = "async";
header.appendChild(copybutton);
var logo = document.createElement("img");
logo.style.width = "15px";
logo.style.height = "15px";
logo.src = "//upload.wikimedia.org/wikipedia/commons/thumb/9/9a/Erioll_world.svg/15px-Erioll_world.svg.png";
logo.title = texts.logoTitle;
logo.decoding = "async";
header.appendChild(logo);
header.appendChild(document.createTextNode(texts.credits));
dynDiv.appendChild(header);
var cvalNode = document.createElement("div");
cvalNode.appendChild(document.createTextNode(cval));
cvalNode.className = "DECpuCval";
cvalNode.style.clear = "left";
cvalNode.style.lineHeight = 1.5;
//cvalNode.style.textAlign = "center";
cvalNode.style.padding = "4px 0px";
cvalNode.style.whiteSpace = "nowrap";
dynDiv.appendChild(cvalNode);
dynDiv.className = "DECpu";
dynDiv.style.position = "absolute";
dynDiv.style.width = "180px";
dynDiv.style.border = "1px solid";
dynDiv.style.background = "#ddd";
dynDiv.style.padding = "2px 5px";
dynDiv.style.display="none";
dynDiv.style.left="20px";
dynDiv.style.top="20px";
dynDiv.style.textAlign="left";
dynDiv.style.zIndex = "200";
// need intermediate parent for positioning
var relParent = document.createElement("div");
relParent.style.position = "relative";
//relParent.style.width = "210px";
relParent.style.width="0";
relParent.style.height="0";
relParent.style.display="inline";
relParent.append(dynDiv);
parentNode.prepend(relParent);
var rectDiv = relParent.getBoundingClientRect();
var bodyDiv = $("body")[0].getBoundingClientRect();
if (rectDiv.left + rectDiv.width + 210 > bodyDiv.right) {
dynDiv.style.left = (parseInt(dynDiv.style.left, 10) - (210-(Math.round (bodyDiv.right-rectDiv.right))))+"px";
}
parentNode.addEventListener("mouseenter", fadeInPopup);
dynDiv.addEventListener("click", fadeOutPopup);
// putting the function to outer scope creates an exception
// uncaught (in promise) DOMException: clipboard write was blocked due to lack of user activation.
copybutton.addEventListener("click", function(event) {
var nodes = $(event.target).closest('.DECpu').find('.DECpuCval');
if (nodes) {
navigator.clipboard.writeText(nodes[0].childNodes[0].nodeValue);
}
return false;
});
}
}
});
}( window.mediaWiki, window.jQuery ) );