MediaWiki:Gadget-Bahnhof anlegen.js

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

/**
 * Gadget-Bahnsteiganzeiger.js
 * ============================================================================
 * Bettet ÖBB-Live-Abfahrts-/Ankunftstafeln ("Liveticker") in Wiki-Seiten ein
 * und lädt sie selbstständig neu. Intern heißt das Ding "Bahnsteiganzeiger",
 * für Fahrgäste steht auf der Seite "Monitore".
 *
 * WARUM EIN GADGET?
 * MediaWiki entfernt rohe <iframe> aus dem Seitentext. Dieses Gadget baut das
 * iframe daher selbst aus einem einfachen Container – und kann es zusätzlich
 * alle 60 s neu laden (was ein rohes iframe nie könnte).
 *
 * EINBINDUNG AUF EINER SEITE
 *   <div class="bahnsteiganzeiger" data-evaid="1231805" data-typ="dep"></div>
 *   <div class="bahnsteiganzeiger" data-evaid="1231805" data-typ="arr"></div>
 *
 * data-Attribute:
 *   data-evaid      Pflicht. Stationsnummer (evaId) des Bahnhofs.
 *   data-typ        "dep" = Abfahrten (Standard), "arr" = Ankünfte.
 *   data-anzahl     Zeilenzahl (Standard 40).
 *   data-hoehe      Pixel-Höhe der Tafel (Standard 600; bei mehr Zeilen als
 *                   hineinpassen scrollt die Tafel innen).
 *   data-intervall  Neulade-Intervall in Sekunden (Standard 60; 0 = aus).
 * ============================================================================
 */
( function () {
	'use strict';

	var BASIS = 'https://fahrplan.oebb.at/bin/stboard.exe/dn';
	var LIVETICKER = 'vs_scotty.vs_liveticker';
	var PRODUCTS = '1111111111111'; // alle Verkehrsmittel inkl. Bus
	var STD_ANZAHL = 40;
	var STD_HOEHE = 600;
	var STD_INTERVALL = 60; // Sekunden

	function baueUrl( eva, typ, anzahl ) {
		return BASIS +
			'?L=' + LIVETICKER +
			'&evaId=' + encodeURIComponent( eva ) +
			'&boardType=' + typ +
			'&productsFilter=' + PRODUCTS +
			'&dirInput=' +
			'&tickerID=' + typ +
			'&start=yes' +
			'&eqstops=true' +
			'&showJourneys=' + anzahl +
			'&additionalTime=0';
	}

	function titelText( typ ) {
		return typ === 'arr' ? 'Ankünfte' : 'Abfahrten';
	}

	function baueAnzeiger( container ) {
		var eva = ( container.getAttribute( 'data-evaid' ) || '' )
			.trim().replace( /^0+/, '' );
		var typ = ( container.getAttribute( 'data-typ' ) || 'dep' ).toLowerCase();
		if ( typ !== 'arr' ) {
			typ = 'dep';
		}

		if ( !eva ) {
			container.textContent = 'Bahnsteiganzeiger: keine evaId angegeben.';
			container.className += ' bahnsteiganzeiger-fehler';
			return;
		}

		var anzahl = parseInt( container.getAttribute( 'data-anzahl' ), 10 ) || STD_ANZAHL;
		var hoehe = parseInt( container.getAttribute( 'data-hoehe' ), 10 ) || STD_HOEHE;
		var intervall = container.getAttribute( 'data-intervall' );
		intervall = ( intervall === null ) ? STD_INTERVALL : parseInt( intervall, 10 );

		container.textContent = '';

		var titel = document.createElement( 'div' );
		titel.className = 'bahnsteiganzeiger-titel';
		titel.textContent = titelText( typ );
		container.appendChild( titel );

		var rahmen = document.createElement( 'div' );
		rahmen.className = 'bahnsteiganzeiger-rahmen';
		rahmen.style.height = hoehe + 'px';

		var iframe = document.createElement( 'iframe' );
		iframe.className = 'bahnsteiganzeiger-iframe';
		iframe.setAttribute( 'frameborder', '0' );
		iframe.setAttribute( 'scrolling', 'auto' );
		iframe.setAttribute( 'loading', 'lazy' );
		iframe.title = titelText( typ );

		var url = baueUrl( eva, typ, anzahl );
		function laden() {
			// Cache-Buster erzwingt frische Daten bei jedem Neuladen.
			iframe.src = url + '&_ts=' + Date.now();
		}
		laden();

		rahmen.appendChild( iframe );
		container.appendChild( rahmen );

		if ( intervall > 0 ) {
			var hinweis = document.createElement( 'div' );
			hinweis.className = 'bahnsteiganzeiger-hinweis';
			hinweis.textContent = 'Aktualisiert automatisch (alle ' + intervall + ' s).';
			container.appendChild( hinweis );
			setInterval( laden, intervall * 1000 );
		}
	}

	function init() {
		var liste = document.querySelectorAll( '.bahnsteiganzeiger' );
		Array.prototype.forEach.call( liste, function ( c ) {
			try {
				baueAnzeiger( c );
			} catch ( e ) {
				c.textContent = 'Bahnsteiganzeiger konnte nicht geladen werden.';
				if ( window.mw && mw.log ) {
					mw.log.error( e );
				}
			}
		} );
	}

	$( function () {
		if ( document.querySelector( '.bahnsteiganzeiger' ) ) {
			init();
		}
	} );

}() );