TIM Wiki / NEW TIM 6 Documentation

Es ist möglich die Fortschrittsanzeige von Aufgaben zu überschreiben und anzupassen.
Hierzu muss einfach nur eine Funktion mit dem Namen „gadget.functions.getCustomProgress“ in die Datei custom.js geschrieben werden.
Die Funktion empfängt 3 Parameter.

1. container = Das DIV in welchem die bisherige Progressbar angezeigt wurde
2. percent = Die bereits verstrichene Zeit in Prozent
3. content = Der bisherige Text welcher im DIV angezeigt wurde

Wie die Progressbar überschrieben wird bleibt jedem selbst überlassen.
Folgendes Beispiel zeigt eine sich leerende Batterie an.

gadget.functions.getCustomProgress = function(container, percent, content){
 
	function getColor(value){
		var hue = ( (1 - value/100) * 120 ).toString(10);
		return ['hsl(', hue, ', 100%, 50%)'].join('');
	}
 
	var levelBar = jQuery('<div></div>')
		.css('height', '100%')
		.css('width', (100 - percent) + '%')
		.css('float', 'right')
		.css('background-color', getColor(percent));
 
	var battery = jQuery('<div></div>')
		.css('width', '20px')
		.css('height', '8px')
		.css('border', '1px solid #000000')
		.css('margin', '2px 0px 5px 0px')
		.css('background-color', '#FFFFFF')
		.css('float', 'left')
		.append(levelBar);
 
	var batteryKnob = jQuery('<div></div>')
		.css('content', '')
		.css('margin', '5px 0px 5px 5px')
		.css('float', 'left')
		.css('width', '2px')
		.css('height', '4px')
		.css('background-color', '#000000');
 
	var textContent = jQuery('<div></div>')
		.css('text-align', 'right')
		.text(content);
 
	jQuery(container)
		.css('background-image', 'none')
		.append(batteryKnob)
		.append(battery)
		.append(textContent);
 
}