/* $Id: ProductViews.js 107789 2011-01-13 12:51:35Z v.sakhovski $
 * Copyright (C) 2009 IP Labs GmbH <http://www.iplabs.de/>
 * All rights reserved.
 */
 
 /**
 *
 * Contains the ProductViews class.
 *
 * @author Andreas Kornetka <a.kornetka@iplabs.de>
 * @author Alexander Peters <a.peters@iplabs.de>
 * 
 * @version $Revision: 107789 $
 */

/**
 * Constructor for an ProductViews Object.
 *
 * @class <p>As the name class alerady hints, various perspectives of an object can be shown via two buttons (back, forward).</p>
 *
 * @constructor
 * @param {String} strViews
 *            The string of the id to be reffered to. Inevitable parameter!
 * @param {String} srcView1
 *            The reference of the first image (must be numerated - 1 here). Inevitable parameter!
 * @param {String} imgPreviousPhotoId
 *            The string of the id of the Previous btn to be reffered to. Inevitable parameter!
 * @param {String} imgNextPhotoId
 *            The string of the id of the Next btn to be reffered to. Inevitable parameter!
 */
function ProductViews(strViews, srcView1, imgPreviousPhotoId, imgNextPhotoId) {
	this.splitter = '_';
	this.srcViews = srcView1.split(1 + this.splitter);
	this.objBtnPrevious;
	this.objBtnNext;
	
	this.images   = new Array(4);
	var self = this;
	
	this.objViews = document.getElementById(strViews);
	//jade.Log.setLevel(jade.Log.ERROR);
	
	this.imagesArr = new Array();
	this.views    = new Array();
	this.active   = 0;
	this.imageFactory = new jade.ImageFactory();
	this.setBtnPrevious(imgPreviousPhotoId);
	this.setBtnNext(imgNextPhotoId);
	this.getViews();
}


/**
 * Try to access the images, preload them and check if they do exist.
 */
ProductViews.prototype.getViews = function() {
	var i;
	var imgE;
	var self = this;
	for(i = 0; i < this.images.length; i++) {
		imgE = this.imageFactory.createImage(this.srcViews[0] + (i + 1) + this.splitter + this.srcViews[1]);
		this.imagesArr.push(imgE);
	}
	this.imageFactory.preload(function(){self.addView();}); 
}

/**
 * Add existing images to the internal list.
 *
 */
ProductViews.prototype.addView = function() {
	var imgId, i;
	for(i=0; i < this.imagesArr.length; i++)
	{
		if(this.imagesArr[i].loaded && ! this.imagesArr[i].error)
		{
			this.views.push(this.imagesArr[i]);
		}
	}
	if(this.views.length > 0) 
	{
		this.displayView();
		this.showButtons();
	}
}


/**
 * display the desired image.
 */
ProductViews.prototype.displayView = function() {
	if(this.active >= this.views.length) {this.active = 0;}
	
	if(this.active < 0) {this.active = this.views.length - 1;}
	
	if (this.objViews.tagName == 'IMG') {
		this.objViews.src = this.views[this.active].url;
	}
	else {
		this.objViews.style.background = 'transparent url(' + this.views[this.active].url + ') 0 0 no-repeat';
	}
}


/**
 * Set the reference to the "previous image" button.
 *
 * @param {String} strId
 *            The string of the id of the btn to be reffered to. Inevitable parameter! 
 */
ProductViews.prototype.setBtnPrevious = function(strId) {
	this.objBtnPrevious = document.getElementById(strId);
}

/**
 * Set the reference to the "next image" button.
 *
 * @param {String} strId
 *            The string of the id of the btn to be reffered to. Inevitable parameter!  
 */
ProductViews.prototype.setBtnNext = function(strId) {
	this.objBtnNext = document.getElementById(strId);
}

/**
 * View the previous image in the list.
 */
ProductViews.prototype.previousView = function() {
	if(typeof(this.instance) != 'undefined') {this.instance.previousView();}
	else {
		this.active--;
		this.displayView();
	}		
}

/**
 * View the next image in the list.
 */
ProductViews.prototype.nextView = function() {
	if(typeof(this.instance) != 'undefined') {this.instance.nextView();}
	else {
		this.active++;
		this.displayView();
	}
}


/**
 * show the buttons.
 *
 */
ProductViews.prototype.showButtons = function() {
	var objBtnPreviousOffId, objBtnNextOffId, objBtnPreviousOff, objBtnNextOff;
	objBtnPreviousOffId = this.objBtnPrevious.id + "Off";
	objBtnPreviousOff = document.getElementById(objBtnPreviousOffId);
	
	objBtnNextOffId = this.objBtnNext.id + "Off";
	objBtnNextOff = document.getElementById(objBtnNextOffId);
	
	if(this.views.length <= 1)
	{
		// do not display buttons if only one image exists
		this.objBtnPrevious.className = "disabled";
		this.objBtnPrevious.style.display = 'none';
		
		this.objBtnNext.className = "disabled";
		this.objBtnNext.style.display     = 'none';
		
		if(objBtnPreviousOff) objBtnPreviousOff.style.display     = 'block';
		if(objBtnNextOff) objBtnNextOff.style.display     = 'block';
	}
	else 
	{
		this.objBtnPrevious.instance    = this;
		this.objBtnPrevious.style.display = 'block';
		this.objBtnPrevious.onclick       = this.previousView;
		
		this.objBtnNext.instance    = this;
		this.objBtnNext.style.display     = 'block';
		this.objBtnNext.onclick           = this.nextView;
		
		if(objBtnPreviousOff) objBtnPreviousOff.style.display     = 'none';
		if(objBtnNextOff) objBtnNextOff.style.display     = 'none';
	}
}