/* ************************************************************************************ *
 * ANIMIERTE WERTUNGSBALKEN                                                             *
 *                                                                                      *
 * Das Script kann frei verwendet werden, dieser Kommentar, der URL sowie die Nennung   *
 * des Nicks müssen jedoch erhalten bleiben.                                            *
 *                                                                                      *
 *                                                                Quelle: www.quaese.de *
 *                                                                     (c) Quaese, 2007 *
 * ************************************************************************************ */


/* ************************************************************************************ *
 * objPoll - Objekt, wobei jede Eigenschaft wie folgt aufgebaut ist:                    *
 *           -> Name der Eigenschaft entspricht der ID des Wertungsbalkens im           *
 *              HTML-Dokument, z.B. id_01                                               *
 *           -> Eigenschaftswert:                                                       *
 *              Array[Startwert oder "auto", Endwert, CSS-BG-Wert, Beschreibungstext]   *
 *              - Startwert: Integerwert, der den Startwert in Prozent repräsentiert    *
 *                           oder 'auto' um den aktuellen Wert zu übernehmen            *
 *              - Endwert: Integerwert, der den Endwert in Prozent repräsentiert        *
 *              - CSS-BG-Wert: Hintergrund des Pollbars; können entfallen, wenn Element *
 *                             mit ID erneut verwendet wird                             *
 *              - Beschreibungstext: Text, der an die Wertungsbox geschrieben wird      *
 *                                                                                      *
 * Bsp: {id_01: [0, 80, 'url(balken.gif) repeat-x'], id_02: ['auto', 30, '#0f0']}       *
 * ************************************************************************************ */


/* **************************************************************************** *
 * Konstruktor des Poll-Objekts
 * **************************************************************************** */
function qpPoll(strPollHolderId, intPollLength){
  this.intPollLength = intPollLength;			// Länge eines Wertungsbalkens (300)

  this.objOuter = document.getElementById(strPollHolderId);  // HTML-Objekt, das die PollBars aufnimmt
	this.hTimer = null;                                        // Timerhandle
//  this.idSuffix = new Date().getTime();                      // Suffix um eindeutige IDs zu gewährleisten
	this.idSuffix = Math.round(new Date().getTime()*Math.random());
}

/* **************************************************************************** *
 * Methode zum langsamen Aufbauen von Wertungsbalken
 *
 * Parameter: objPoll - Objekt, Beschreibung siehe oben
 * **************************************************************************** */
qpPoll.prototype.thePoll = function(objPoll){
  var blnCheck = false;
  var intWidth;

  // Alle Eigenschaften des übergebenen Wertungsobjekts durchlaufen
	for(varEntry in objPoll){
    // Solange der Balken noch wachsen muss (dh. akt. Prozentwert kleiner gleich max. Prozentwert)
    if(objPoll[varEntry][0] < objPoll[varEntry][1]){
      // Akt. Prozentwert inkrementieren
      objPoll[varEntry][0]++;

      // Anzeigen, dass Funktion mit setTimeout erneut aufgerufen werden muss
      blnCheck = true;

    // Falls der Balken noch abnehmen muss (dh. akt. Prozentwert ist grösser als min. Prozentwert)
    }else if(objPoll[varEntry][0] > objPoll[varEntry][1]){
      // Akt. Prozentwert dekrementieren
      objPoll[varEntry][0]--;

      // Anzeigen, dass Funktion mit setTimeout erneut aufgerufen werden muss
      blnCheck = true;
    }else if(document.getElementById(varEntry + "_percent_" + this.idSuffix).style.visibility == "hidden"){
    	document.getElementById(varEntry + "_percent_" + this.idSuffix).innerHTML = objPoll[varEntry][1] + "%";
    	document.getElementById(varEntry + "_percent_" + this.idSuffix).style.visibility = "visible";
    }

    // Neue Breite berechnen
    intWidth = parseInt(this.intPollLength * objPoll[varEntry][0] / 100);
    // Neue Breite inneren Wertungsbalken zuweisen
    document.getElementById(varEntry + "_balken_" + this.idSuffix).style.width = intWidth+"px";
  }

  // Closure-Variable (wg. setTimeout)
  var objThis = this;
  // Falls die Balken noch nicht alle ihre Endposition erreicht haben -> Fkt. erneut aufrufen
  if(blnCheck)
	  this.hTimer = window.setTimeout(function(){objThis.thePoll(objPoll);}, 40);
}


/* **************************************************************************** *
 * Methode zum Starten einer Pollanimation
 *
 * Parameter: objPoll - Objekt, Beschreibung siehe oben
 * **************************************************************************** */
qpPoll.prototype.startPoll = function(objPoll){
	// Falls breits ein Timer läuft -> beenden
	if(this.hTimer) window.clearTimeout(this.hTimer);

  // Falls noch kein Kindknoten im Poll-DIV existiert -> Pollbalken anlegen
  if(this.objOuter.childNodes.length == 0)
  	this.initPoll(objPoll);

  // Alle Eigenschaften des übergebenen Wertungsobjekts durchlaufen
	for(varEntry in objPoll){
  	// Falls ein Text übergeben wurde
    if(typeof objPoll[varEntry][3] == "string" && objPoll[varEntry][3]!=""){
    	document.getElementById(varEntry + "_polltext_" + this.idSuffix).innerHTML = objPoll[varEntry][3];
    }

  	// Falls ein anderer Hintergrund übergeben wird
    if(typeof objPoll[varEntry][2] == "string" && objPoll[varEntry][2]!=""){
      document.getElementById(varEntry + "_balken_" + this.idSuffix).style.background = objPoll[varEntry][2];       // Hintergrundfarbe
    }

  	// Falls in der Startwert-Eigenschaft "auto" übergeben wurde
  	if(objPoll[varEntry][0] == "auto"){
    	// Startwert-Eigenschaft auf den aktuellen Längenwert des Pollbalkens setzen (Umrechnung wg. Skalierung notwendig)
    	objPoll[varEntry][0] = parseInt(parseInt(document.getElementById(varEntry + "_balken_" + this.idSuffix).style.width) * 100 / this.intPollLength);
    }

    document.getElementById(varEntry + "_percent_" + this.idSuffix).style.visibility = "hidden";
  }

  // Funktion zum langsamen Aufbauen der Wertungsbalken aufrufen
  this.thePoll(objPoll);
}


/* **************************************************************************** *
 * Methode zum Initialisieren der Wertungsbalken
 *
 * Parameter: objPoll - Objekt, Beschreibung siehe oben
 * **************************************************************************** */
qpPoll.prototype.initPoll = function(objPoll){

  // Alle Eigenschaften des übergebenen Wertungsobjekts durchlaufen
	for(varEntry in objPoll){
  	// Umschliessendes Element einer einzelnen Wertung
  	var objDiv = document.createElement("div");
    objDiv.id = varEntry + "_" + this.idSuffix;
    objDiv.className = "outerPollClass";
    objDiv.style.clear = "both";
//    document.getElementById("outID").innerHTML += "<br><br>"+objDiv.id+"<br>";

    // Textelement für beschreibenden Text
    var objText = document.createElement("div");
    objText.id = varEntry + "_polltext_" + this.idSuffix;
    objText.className = "textPoll";
    objText.innerHTML = objPoll[varEntry][3];
//    document.getElementById("outID").innerHTML += "<br><br>"+objText.id+"<br>";

    // Wertungsbalken
    var objElem = document.createElement("div");
    objElem.id = varEntry + "_balken_border_" + this.idSuffix;  // ID = Name der Eigenschaft
    objElem.className = "pollDiv";
//    document.getElementById("outID").innerHTML += "<br><br>"+objElem.id+"<br>";
    objElem.style.position = "relative";
    objElem.style.width = this.intPollLength + "px";

    // Eigentlicher Wertungsbalken (innerer Wertungsbalken)
    var objInner = document.createElement("div");
    objInner.id = varEntry + "_balken_" + this.idSuffix;    // ID = Name der Eigenschaft
    objInner.className = "innerPoll";                       // Klassenname zuweisen
    // Hintergrundfarbe
    if(typeof objPoll[varEntry][2] == "string" && objPoll[varEntry][2]!=""){
    	objInner.style.background = objPoll[varEntry][2];     // Hintergrund
    }else{
    	objInner.style.background = "#369";                   // Standard-Hintergrundfarbe
    }
    objInner.style.width = ((objPoll[varEntry][0]=="auto")  // Startbreite
                           ? 0
                           : parseInt(this.intPollLength * objPoll[varEntry][0] / 100))+"px";
//    document.getElementById("outID").innerHTML += "<br><br>"+objInner.id+"<br>";

    var objPercent = document.createElement("div");
    objPercent.id = varEntry + "_percent_" + this.idSuffix; // ID = Name der Eigenschaft
    objPercent.className = "percentPoll";
    objPercent.style.position = "absolute";
    objPercent.style.zIndex = "99";
    objPercent.style.top = "3px";
    objPercent.style.left = "6px";

    objElem.appendChild(objInner);                          // Inneren Wertungsbalken einhängen
    objElem.appendChild(objPercent);                        // Prozentanzeige einhängen
    objDiv.appendChild(objText);                            // Textknoten einhängen
    objDiv.appendChild(objElem);                            // Wertungsbalken einhängen
    this.objOuter.appendChild(objDiv);                      // Komplettes Wertungselement einhängen
  }
}