MediaWiki:Common.js: Unterschied zwischen den Versionen

Aus LuLuWiki
Keine Bearbeitungszusammenfassung
Keine Bearbeitungszusammenfassung
Zeile 6: Zeile 6:
  * *************************************
  * *************************************
  */
  */
function createProgressBarDomElement(green, yellow, red) {
var sum = green + yellow + red;
var domElement = document.createElement('div');
domElement.className = 'progressbar';
domElement.style.width = '100%';
domElement.style.display = 'block';
domElement.style.position = 'relative';
domElement.style.height = '25px';
greenDomElement = document.createElement('div');
greenDomElement.className = 'green';
greenDomElement.style.width = (green / sum) + '%';
greenDomElement.style.float = 'left';
greenDomElement.style.height = '25px';
domElement.appendChild(greenDomElement);
return domElement;
}


function createProgressBar(domElement) {
function createProgressBar(domElement) {
Zeile 35: Zeile 52:
}
}
}
}
var newDomElement = createProgressBarDomElement(green, yellow, red);
domElement.parentNode.replaceChild(newDomElement, domElement);
console.log('green: ' + green);
console.log('green: ' + green);
console.log('yellow: ' + yellow);
console.log('yellow: ' + yellow);

Version vom 26. April 2019, 09:24 Uhr

/* Das folgende JavaScript wird für alle Benutzer geladen. */

/*
 * *************************************
 * * Funktionen für Fortschrittsbalken *
 * *************************************
 */
 
function createProgressBarDomElement(green, yellow, red) {
	var sum = green + yellow + red;
	var domElement = document.createElement('div');
	domElement.className = 'progressbar';
	domElement.style.width = '100%';
	domElement.style.display = 'block';
	domElement.style.position = 'relative';
	domElement.style.height = '25px';
	greenDomElement = document.createElement('div');
	greenDomElement.className = 'green';
	greenDomElement.style.width = (green / sum) + '%';
	greenDomElement.style.float = 'left';
	greenDomElement.style.height = '25px';
	domElement.appendChild(greenDomElement);
	return domElement;
}

function createProgressBar(domElement) {
	var green = 0;
	var greenDomElement = domElement.getElementsByClassName("green");
	if (greenDomElement && greenDomElement.length > 0) {
		var greenText = greenDomElement[0].innerText;
		green = parseInt(greenText);
		if (isNaN(green)) {
			green = 0;
		}
	}
	var yellow = 0;
	var yellowDomElement = domElement.getElementsByClassName("yellow");
	if (yellowDomElement && yellowDomElement.length > 0) {
		var yellowText = yellowDomElement[0].innerText;
		yellow = parseInt(yellowText);
		if (isNaN(yellow)) {
			yellow = 0;
		}
	}
	var red = 0;
	var redDomElement = domElement.getElementsByClassName("red");
	if (redDomElement && redDomElement.length > 0) {
		var redText = redDomElement[0].innerText;
		red = parseInt(redText);
		if (isNaN(red)) {
			red = 0;
		}
	}
	var newDomElement = createProgressBarDomElement(green, yellow, red);
	domElement.parentNode.replaceChild(newDomElement, domElement);
	console.log('green: ' + green);
	console.log('yellow: ' + yellow);
	console.log('red: ' + red);
}
 
function createProgressBars() {
	var progressBars = document.getElementsByClassName("progressbar");
	for (var i = 0; i < progressBars.length; i++) {
		createProgressBar(progressBars[i]);
	}
}

$( function() {
	createProgressBars();
});