|
|
Zeile 1: |
Zeile 1: |
| /* Das folgende JavaScript wird für alle Benutzer geladen. */ | | <noinclude>{{QR-Code}}</noinclude> |
| | | <onlyinclude><includeonly>{{DialogButton |
| /*
| | |Inhalt=<div class="zum-qrcode">{{#qrlite:{{{Link|{{fullurl:{{FULLPAGENAME}}}}}}}|format=svg|size=80|ecc=4|margin=0}}</div> |
| * Dialog Javascript for
| | |Link=<span class="fa fa-qrcode fa-3x"></span></span> |
| * Vorlage:DialogButton
| | |Titel={{FULLPAGENAME}} |
| *
| | }}</includeonly> |
| *
| | </onlyinclude> |
| */
| | <noinclude> |
| | | <templatedata> |
| (function(){
| | { |
| /* add dialog opener event handler */
| | "params": { |
| const run = function(){
| | "Link": { |
| document.querySelectorAll('[data-dialog-opener-id]').forEach(function(elem) {
| | "label": "Link", |
| if(elem.dataset.dialogOpenerAdded === 'true') { return; }
| | "description": "Der Link, den der QR Code enthalten soll.", |
| | | "type": "url", |
| | | "default": "{{fullurl:{{FULLPAGENAME}}}}" |
| var dialogId = elem.dataset.dialogOpenerId;
| | } |
| var dialog = document.getElementById(dialogId);
| | }, |
| | | "description": "Erzeugt einen kleinen QR Code, welcher auf Klick einen Dialog öffnet mit einem großen QR Code", |
| elem.dataset.dialogOpenerAdded = 'true';
| | "format": "inline" |
| elem.addEventListener('click', function(ev) {
| |
| dialog.showModal();
| |
| ev.stopPropagation();
| |
| return false;
| |
| });
| |
| });
| |
| };
| |
| if (document.readyState === "loading") {
| |
| document.addEventListener("DOMContentLoaded", run);
| |
| } else {
| |
| run();
| |
| } | | } |
| })();
| | </templatedata> |
| (function(){
| | </noinclude> |
| /* close on click outside of dialog content */
| |
| const run = function(){
| |
| document.querySelectorAll('dialog.zum-dialog').forEach(function(elem){
| |
| if(elem.dataset.dialogCloseonBackdropAdded === 'true') { return; }
| |
| elem.dataset.dialogCloseonBackdropAdded = 'true';
| |
| | |
| elem.addEventListener('mousedown', function(ev){
| |
| if(ev.target !== elem){return true;}
| |
| var rect = ev.target.getBoundingClientRect();
| |
| if(ev.x >= rect.left
| |
| && ev.x <= rect.right
| |
| && ev.y >= rect.top
| |
| && ev.y <= rect.bottom) { return true; }
| |
| | |
| ev.target.close();
| |
| ev.stopPropagation();
| |
| return false;
| |
| });
| |
| });
| |
| };
| |
| if (document.readyState === "loading") {
| |
| document.addEventListener("DOMContentLoaded", run);
| |
| } else {
| |
| run();
| |
| }
| |
| })();
| |
| (function(){
| |
| /*cleanup empty p tags, at beginning and end of dialogs created by Vorlage:DialogButton */
| |
| const run = function() {
| |
| document.querySelectorAll('dialog.zum-dialog').forEach(function(elem) {
| |
| if(elem.dataset.dialogCleanedup === 'true') { return; }
| |
| elem.dataset.dialogCleanedup = 'true';
| |
| [elem.firstElementChild, elem.lastElementChild]
| |
| .filter(function(e){return e && e.tagName === 'P' && e.textContent === '';})
| |
| .forEach(function(e) { elem.removeChild(e);})
| |
| });
| |
| document.querySelectorAll('[data-dialog-opener-id]').forEach(function(elem) {
| |
| if(elem.dataset.dialogCleanedup === 'true') { return; }
| |
| elem.dataset.dialogCleanedup = 'true';
| |
| [elem.firstElementChild, elem.lastElementChild]
| |
| .filter(function(e){ return e && e.tagName === 'P' && e.textContent === '';})
| |
| .forEach(function(e){ elem.removeChild(e);})
| |
| });
| |
| };
| |
| if (document.readyState === "loading") {
| |
| document.addEventListener("DOMContentLoaded", run);
| |
| } else {
| |
| run();
| |
| }
| |
| })();
| |
| (function(){
| |
| /* overrule mediawiki default popup-close event handler */
| |
| const run = function() {
| |
| document.querySelectorAll('dialog.zum-dialog')
| |
| .forEach(function(elem) {elem.querySelectorAll('button.popup-close')
| |
| .forEach(function(btn) { btn.addEventListener('click', function(ev) {
| |
| ev.stopImmediatePropagation();
| |
| });});});
| |
| };
| |
| if (document.readyState === "loading") {
| |
| document.addEventListener("DOMContentLoaded", run);
| |
| } else {
| |
| run();
| |
| }
| |
| })();
| |