var zoomo_artnums = new Array();

function hide_zoomo (artnum) {
  var zoomoSuffix = "";
  if ( artnum )
	  zoomoSuffix = "_" + artnum;
  document.getElementById("zoomo_layer"+zoomoSuffix).style.display = "none";
}

function show_zoomo (artnum) {
  for (i = 0; i < zoomo_artnums.length; i++)
    hide_zoomo(zoomo_artnums[i]);
  var top = 0;
  var left = 0;
  var zoomoSuffix = "";
  if ( artnum )
	  zoomoSuffix = "_" + artnum;
  var eltern = document.getElementById("zoomo_button"+zoomoSuffix).offsetParent;
  if (eltern) {
    top = top + eltern.offsetTop;
    left = left + eltern.offsetLeft;
    eltern = eltern.offsetParent;
  }
  document.getElementById("zoomo_layer"+zoomoSuffix).style.display = "block";
  document.getElementById("zoomo_layer"+zoomoSuffix).style.top = (top - 100)+"px";
  document.getElementById("zoomo_layer"+zoomoSuffix).style.left = (left - 50) + "px";
}

function AzTagesangebot ( index, startTime, endTime, stock ) {
	this.index = index;
	this.startTime = startTime;
	this.endTime = endTime;
	this.serverTime = 0;
	this.stock = stock;
	this.previousStock = stock - 1;
	this.picturesUrl = "";

	this.htmlDaysText = 0;
	this.htmlDaysPercent = 0;
	this.htmlHoursText = 0;
	this.htmlHoursPercent = 0;
	this.htmlMinutesText = 0;
	this.htmlMinutesPercent = 0;
	this.htmlSecondsText = 0;
	this.htmlSecondsPercent = 0;
	this.htmlStockText = 0;
	this.htmlStockPercent = 0;
	this.htmlOutOfStockLayer = 0;

	this.init = function () {
		this.htmlDaysText = document.getElementById( "display_tage" + this.index );
		this.htmlDaysPercent = document.getElementById( "balken_tag" + this.index );
		this.htmlHoursText = document.getElementById( "display_std" + this.index );
		this.htmlHoursPercent = document.getElementById( "balken_std" + this.index );
		this.htmlMinutesText = document.getElementById( "display_min" + this.index );
		this.htmlMinutesPercent = document.getElementById( "balken_min" + this.index );
		this.htmlSecondsText = document.getElementById( "display_sek" + this.index );
		this.htmlSecondsPercent = document.getElementById( "balken_sek" + this.index );
		this.htmlStockText = document.getElementById( "display_prozent" + this.index );
		this.htmlStockPercent = document.getElementById( "balken_prz" + this.index );
		this.htmlOutOfStockLayer = document.getElementById( "vergriffen_layer" + this.index );
	};

	this.setServerTime = function ( serverTime ) {
		this.serverTime = serverTime;
	};

	this.setPicturesUrl = function ( url ) {
		this.picturesUrl = url;
	};
	
	this.update = function () {
		var currentTime = Math.round( (new Date()).getTime() / 1000 );
		var timeLeft = this.endTime - currentTime;
		if ( timeLeft > 0 ) {
			var daysLeft = Math.floor( timeLeft / 86400 );
			timeLeft -= daysLeft * 86400;
			var hoursLeft = Math.floor( timeLeft / 3600 );
			timeLeft -= hoursLeft * 3600;
			var minutesLeft = Math.floor( timeLeft / 60 );
			timeLeft -= minutesLeft * 60;
			var secondsLeft = timeLeft;
			if ( secondsLeft < 0 )
				secondsLeft = 0;
			var percentWidth = 79;
			var stockPercentWidth = 139;
			
			if ( this.htmlDaysText )
				this.htmlDaysText.innerHTML = daysLeft + " Tage";
			if ( this.htmlDaysPercent ) {
				var daysTotal = Math.floor( (this.endTime - this.startTime) / 85400 );
				this.htmlDaysPercent.setAttribute( "width", Math.ceil( percentWidth * daysLeft / daysTotal ), 0 );
			}
			
			if ( this.htmlHoursText )
				this.htmlHoursText.innerHTML = hoursLeft + " Std.";
			if ( this.htmlHoursPercent )
				this.htmlHoursPercent.setAttribute( "width", Math.ceil( percentWidth * hoursLeft / 60 ), 0 );
			
			if ( this.htmlMinutesText )
				this.htmlMinutesText.innerHTML = minutesLeft + " Min.";
			if ( this.htmlMinutesPercent )
				this.htmlMinutesPercent.setAttribute( "width", Math.ceil( percentWidth * minutesLeft / 60 ), 0 );
			
			if ( this.htmlSecondsText )
				this.htmlSecondsText.innerHTML = secondsLeft + " Sek.";
			if ( this.htmlSecondsPercent )
				this.htmlSecondsPercent.setAttribute( "width", Math.ceil( percentWidth * secondsLeft / 60 ), 0 );
			
			if ( this.htmlStockText )
				this.htmlStockText.innerHTML = this.stock + " %";
			if ( this.htmlStockPercent && this.previousStock != this.stock ) {
				//TODO does this have to be dynamic? fake orders?
				if ( this.stock > 30 ) {
					this.htmlStockPercent.setAttribute( "src", this.picturesUrl + "balken.gif" );
				}
				else if ( this.stock > 10 ) {
					this.htmlStockPercent.setAttribute( "src", this.picturesUrl + "balken_gelb.gif" );
				}
				else if ( this.stock > 0 ) {
					this.htmlStockPercent.setAttribute( "src", this.picturesUrl + "balken_rot.gif" );
				}
				else {
					this.htmlStockPercent.setAttribute( "src", this.picturesUrl + "balken_rot.gif" );
					this.htmlOutOfStockLayer.style.display = "block";
					this.htmlOutOfStockLayer.style.zIndex = "6";
				}
				this.htmlStockPercent.setAttribute( "width", Math.ceil( stockPercentWidth * this.stock / 100 ), 0 );
				this.previousStock = this.stock;
			}
		}
		else {
			if ( this.htmlDaysText )
				this.htmlDaysText.innerHTML = "0 Tage";
			if ( this.htmlHoursText )
				this.htmlHoursText.innerHTML = "0 Std.";
			if ( this.htmlMinutesText )
				this.htmlMinutesText.innerHTML = "0 Min.";
			if ( this.htmlSecondsText )
				this.htmlSecondsText.innerHTML = "0 Sek.";
			if ( this.htmlStockText )
				this.htmlStockText.innerHTML = "0 %";
		}
	};
}