var lastCS   = false;
var lastEntertain = false;
var lastHighCS = false;
var lastHighEntertain = false; 
var lastResCS = false;
var lastResEntertain = false;


price     = new Array();
price[0]  = new Array('',       'csStart', 'csBasicPhone', 'csBasicSurf', 'csComft', 'csComftPlus');
price[1]  = new Array('eComft',     '25',      '15',           '20',          '10',       '0');
price[2]  = new Array('eComftPlus', '35',      '25',           '30',          '20',       '10');
price[3]  = new Array('ePremium',   '45',      '35',           '40',          '30',       '20');



function setPrice(cs, e) {
  if (cs) {
    if (lastEntertain) {      
      getPrice(cs, lastEntertain);
    }
    lastCS = cs; 
    toggleCS(cs);
  }
  if (e) {
    if (lastCS) {
       getPrice(lastCS, e);
    }
    lastEntertain = e;
    toggleEntertain(e);
  }
  setHigh(cs, e);
  checkFirstResult();  
}

function getPrice(cs, e) {
  document.getElementById('price').innerHTML = '<span style="font-size:18px; line-height:20px">Mehr Leistung</span><br /><span style="font-size:18px; line-height:20px" class="middlePrice">für ' + price[e][cs] + ',- &euro;</span><br /><span style="font-size:16px; line-height:20px">mehr im Monat</span>';
  document.getElementById('priceText').innerHTML = price[e][cs];
}

function setHigh(cs, e) {
  if (cs) {
    if(lastHighCS) {
      document.getElementById('cs'+lastHighCS).className = "";
    }  
    document.getElementById('cs'+cs).className = "active"; 
    lastHighCS = cs;
  }
  if (e) {
    if(lastHighEntertain) {
      document.getElementById('e'+lastHighEntertain).className = "";
    }
    document.getElementById('e'+e).className = "active";
    lastHighEntertain = e;
  }
}

function toggleCS(cs) {
     var elem = "cs"+cs;
     $('csHeadline').update(pakete[ elem ].headline);
     $('csSubheadline').update(pakete[ elem ].subheadline);
     
     //LÖSCHE ALLE INHLATE VON BULLETTEXTE
     $('csBullets').update('');
     
     //BULLET ITEMS
     var bulletItems = pakete[ elem ].bulletItems;
     phoneItem    = (bulletItems.itemPhone) ? bulletItems.itemPhone : null;
     internetItem = (bulletItems.itemInternet) ? bulletItems.itemInternet : null;
     tvItem       = (bulletItems.itemTV) ? bulletItems.itemTV : null;
     
     var bulletItemsArray = new Array;             //bilde array aus json-obj
     if (phoneItem)    bulletItemsArray.push(phoneItem);
     if (internetItem) bulletItemsArray.push(internetItem);
     if (tvItem)       bulletItemsArray.push(tvItem);
              
     //BULLET TEXTE
     var bulletTexte = pakete[ elem ].bulletTexte; 
     phoneTxt    = (bulletTexte.bulletPhone) ? bulletTexte.bulletPhone : null;
     internetTxt = (bulletTexte.bulletInternet) ? bulletTexte.bulletInternet : null;
     tvTxt       = (bulletTexte.bulletTV) ? bulletTexte.bulletTV : null;
     
     var bulletTexteArray = new Array;            //bilde array aus json-obj
     if (phoneTxt)    bulletTexteArray.push(phoneTxt);
     if (internetTxt) bulletTexteArray.push(internetTxt);
     if (tvTxt)       bulletTexteArray.push(tvTxt);
          
     
     for (var i=0; i<bulletItemsArray.length; i++) {     
	      //PAKET ELEMET (phone, internet o tv)
	     var tempElem = document.createElement('div');     
	     tempElem.className = "csBullet";
	     
	     if(i==0) tempElem.style.height="80px"; //bei Phone wird css gesetzt
	       
	       //item (phone, internet o tv)
		     var tempElem2 = document.createElement('div');   
		     tempElem2.className = "csItem";
		     tempElem2.innerHTML = '<img src="/_img/angebote/comparetool/'+ bulletItemsArray[i] +'" />';
		     tempElem.appendChild(tempElem2);
	       
	       //rechter bereich neben items
	       var tempUlWrapper = document.createElement('div');
	       tempUlWrapper.className = "bulletWrapper";
	       var tempBulHeadline = document.createElement('p');
	       tempBulHeadline.className = "bulletHeadline";
	       tempElem.appendChild(tempUlWrapper);
	       tempUlWrapper.appendChild(tempBulHeadline);
	       
	       //bullett points auflistung pro item (phone, internet o tv)
	       var tempUl = document.createElement('ul');       
		     tempUl.className = "csBulletsList";
		     tempUlWrapper.appendChild(tempUl);
		     
		    
			   for (var j=0; j < bulletTexteArray[i].length; j++) {
			     //Erster Bullet fett und OHNE bullet sein
           if(j==0) {
             tempBulHeadline.innerHTML = bulletTexteArray[i][j];
           }
           else {
				     var tempLi = document.createElement('li');
				     tempUl.appendChild(tempLi);
				     tempLi.innerHTML = (bulletTexteArray[i][j]);
				   }
		     }
		     
	     $('csBullets').appendChild(tempElem);
	   }  
     
     
     $('csPrice').update(pakete[ elem ].price);
     //$('csText').update(pakete[ elem ].text);
     //$('csTextAdd').update(pakete[ elem ].textAdd);

  lastResCS = cs;
}




function toggleEntertain(e) {

    var elem = "e"+e;
     $('eHeadline').update(pakete[ elem ].headline);
     $('eSubheadline').update(pakete[ elem ].subheadline);
     
     //LÖSCHE ALLE INHLATE VON BULLETTEXTE
     $('eBullets').update('');
     
     //BULLET ITEMS
     var bulletItems = pakete[ elem ].bulletItems;
     phoneItem    = (bulletItems.itemPhone) ? bulletItems.itemPhone : null;
     internetItem = (bulletItems.itemInternet) ? bulletItems.itemInternet : null;
     tvItem       = (bulletItems.itemTv) ? bulletItems.itemTv : null;
     
     var bulletItemsArray = new Array;             //bilde array aus json-obj
     if (phoneItem)    bulletItemsArray.push(phoneItem);
     if (internetItem) bulletItemsArray.push(internetItem);
     if (tvItem)       bulletItemsArray.push(tvItem);
              
     //BULLET TEXTE
     var bulletTexte = pakete[ elem ].bulletTexte; 
     phoneTxt    = (bulletTexte.bulletPhone) ? bulletTexte.bulletPhone : null;
     internetTxt = (bulletTexte.bulletInternet) ? bulletTexte.bulletInternet : null;
     tvTxt       = (bulletTexte.bulletTv) ? bulletTexte.bulletTv : null;
     
     var bulletTexteArray = new Array;            //bilde array aus json-obj
     if (phoneTxt)    bulletTexteArray.push(phoneTxt);
     if (internetTxt) bulletTexteArray.push(internetTxt);
     if (tvTxt)       bulletTexteArray.push(tvTxt);
     
           
     for (var i=0; i<bulletItemsArray.length; i++) {     
        //PAKET ELEMET (phone, internet o tv)
       var tempElem = document.createElement('div');     
       tempElem.className = "eBullet";
       
       if(i==0) tempElem.style.height="80px"; //bei Phone wird css gesetzt
       if(i==2) tempElem.className ="eBullet tvHeight"; //bei TV wird css gesetzt
       
        //item (phone, internet o tv)
         var tempElem2 = document.createElement('div');   
         tempElem2.className = "eItem";
         tempElem2.innerHTML = '<img src="/_img/angebote/comparetool/'+ bulletItemsArray[i] +'" />';
         tempElem.appendChild(tempElem2);
        
        //rechter bereich neben items
         var tempUlWrapper = document.createElement('div');
         tempUlWrapper.className = "bulletWrapper";
         var tempBulHeadline = document.createElement('p');
         tempBulHeadline.className = "bulletHeadline";
         tempElem.appendChild(tempUlWrapper);
         tempUlWrapper.appendChild(tempBulHeadline);
                        
         
         //bullett points auflistung pro item (phone, internet o tv)
         var tempUl = document.createElement('ul');       
         tempUl.className = "eBulletsList";
         tempUlWrapper.appendChild(tempUl);
        
         for (var j=0; j < bulletTexteArray[i].length; j++) {
          // alert(bulletTexteArray.length);
           if(j==0) {
             tempBulHeadline.innerHTML = bulletTexteArray[i][j];
           }
           else {
	           var tempLi = document.createElement('li');
	           tempUl.appendChild(tempLi);
	           tempLi.innerHTML = (bulletTexteArray[i][j]);
           }
         }
       
       var clearDiv = document.createElement('div');   
       clearDiv.className = "clear";
       tempElem.appendChild(clearDiv);
       
       $('eBullets').appendChild(tempElem);
     }  
     
     switch(e) {
     case 1:  //comfort
       $('price').style.backgroundImage = 'url(/_img/angebote/comparetool/preisbalken.gif)'; 
       $('price').style.height = '421px'; 
       $('rightboxWrapper').style.backgroundImage = 'url(/_img/angebote/comparetool/comfort.gif)'; 
       $('rightboxWrapper').style.height = "424";
       if(document.getElementsByClassName("tvHeight")[0])
        document.getElementsByClassName("tvHeight")[0].style.height = '115px';
     break;
     case 2: //comfort plus
       $('price').style.backgroundImage = 'url(/_img/angebote/comparetool/preisbalken_plus.gif)'; 
       $('price').style.height = '506px'; 
       $('rightboxWrapper').style.backgroundImage = 'url(/_img/angebote/comparetool/comfort-plus.gif)';
       $('rightboxWrapper').style.height = "516px";
      if(document.getElementsByClassName("tvHeight")[0])
       document.getElementsByClassName("tvHeight")[0].style.height = '160px';
     break;
     case 3: //premium
       $('price').style.backgroundImage = 'url(/_img/angebote/comparetool/preisbalken_premium.gif)'; 
       $('price').style.height = '534px'; 
       $('rightboxWrapper').style.backgroundImage = 'url(/_img/angebote/comparetool/premium.gif)';
       $('rightboxWrapper').style.height = "542px";
       if(document.getElementsByClassName("tvHeight")[0])
        document.getElementsByClassName("tvHeight")[0].style.height = '190px'; 
     break;     
     }
     
     $('ePrice').update(pakete[ elem ].price);
     //$('eText').update(pakete[ elem ].text);
     //$('eTextAdd').update(pakete[ elem ].textAdd);
     $('eTextAdd2').update(pakete[ elem ].textAdd2);
     //$('eStoererPic').update('<img src="/_img/angebote/' + pakete[ elem ].stoererPic + '" />');
	   $('eOrderButton').setAttribute('href', pakete[ elem ].orderButtonUrl);


  lastResEntertain = e;
}

function checkFirstResult() {
  if (lastResCS && lastResEntertain) {
    document.getElementById('rightboxWrapper').style.display = "block";
    document.getElementById('leftboxWrapper').style.display = "block";
    document.getElementById('compareDefault').style.display = "none";
    document.getElementById('price').style.display = "block";
    document.getElementById('resText').style.display = "block";
    
  }
}