// Design Your Own (DYO) - a small item level Object

function DYO_ITEM(){
	// define properties
	this.checkbox = (arguments[0])? arguments[0]:null;
	this.pgroupID = (arguments[1])? arguments[1]:null;
	this.productID = (arguments[2])? arguments[2]:null;
	this.imageSrc = (arguments[3])? arguments[3]:null;
	this.description = (arguments[4])? arguments[4]:null;
}

// A collection object holding DYO_ITEMs and Methods for interacting with those items
function DYO_COLLECTION(){
	// define properties
	this.dyo_items = new Array();
	this.collectionMax = null;
	this.maxMessage = null;
	this.fieldListName = "";
	this.maxColumns = 4;
	
	// adds a DYO_ITEM to the dyo_items array, updates the display, and the field list
	this.addItem = function(){
		if (!this.collectionMax || (this.collectionMax && this.dyo_items.length+1 <= this.collectionMax)){
			this.dyo_items.push(new DYO_ITEM(arguments[0],arguments[1],arguments[2],arguments[3],arguments[4]));
			this.updateFieldList();
			this.updateCollectionDisplay();
			// display special item level message
			if (arguments[5]) alert(arguments[5]);
		} else {
			arguments[0].checked = false;
			if(this.maxMessage) alert(this.maxMessage);
		}
	}
	
	// removes a DYO_ITEM from the dyo_items array, updates the display, and the field list
	this.removeItem = function(){
		var aTemp = new Array();
		for (var i=0; i<this.dyo_items.length; i++){
			if (arguments[0] != this.dyo_items[i].productID) aTemp.push(this.dyo_items[i]);
			else {
				if (typeof(this.dyo_items[i].checkbox) != "undefined"){
					this.dyo_items[i].checkbox.checked = false;
				}
			}					 
		}
		this.dyo_items = aTemp;
		this.updateFieldList();
		this.updateCollectionDisplay();				
	}
	 
	// updates / rewrites the display for the collection			
	this.updateCollectionDisplay = function(){
		// setup pointer objects and vars
		var oDisplay = buildObj("DYO_Display");
		var sNew = "<table cellpadding=0 cellspacing=0 border=0>";
		var oRemoveMsg = buildObj("removeMsg");
		
		// build the display
		for (var i=0; i<this.maxColumns; i++){
			if (this.dyo_items[i]){
				sNew += "<tr valign=top>";
				//sNew += "<td width=60 style='padding-bottom:10px;' align=center><a onclick=\"clickTabDYO('tab_"+ this.dyo_items[i].pgroupID +"')\"><img border='0' src='"+ this.dyo_items[i].imageSrc +"'></a>";
				sNew += "<td width=60 style='padding-bottom:10px;' align=center><a onclick=\"directRemove('"+ this.dyo_items[i].productID +"')\"><img width=60 height=60 style='border:1px #603526 solid;cursor:hand;' src='"+ this.dyo_items[i].imageSrc +"' alt='click here to remove'></a>";
				sNew += "<div>"+ this.dyo_items[i].description+"</div></td>";
				
				var iCols = i;
				while (this.dyo_items[iCols + this.maxColumns]){
					sNew += "<td width=60 style='padding-bottom:10px;padding-left:15px' align=center><a onclick=\"directRemove('"+ this.dyo_items[iCols + this.maxColumns].productID +"')\"><img width=60 height=60 style='border:1px #603526 solid;cursor:hand;' src='"+ this.dyo_items[iCols + this.maxColumns].imageSrc +"' alt='click here to remove'></a>";
					sNew += "<div>"+ this.dyo_items[iCols + this.maxColumns].description+"</div></td>";
					iCols += this.maxColumns ;
				}
	
				sNew += "</tr>";
			}	
		}
		sNew += "</table>";
		
		// write out the new display
		if (oDisplay) oDisplay.innerHTML = sNew;
		
		// show or hide the remove message based on how many items we've got in the collection
		if (oRemoveMsg) oRemoveMsg.style.display = (this.dyo_items.length)? "inline":"none";
	}			
	
	// returns a comma separated list of productIDs in the collection
	this.getProductIDs = function(){
		var aProductIDs = new Array();
		for (var i=0; i<this.dyo_items.length; i++){
			aProductIDs.push(this.dyo_items[i].productID);
		}
		
		return aProductIDs.join(",");
	}
	
	// updates the form field list with a comma separated list of productIDs
	this.updateFieldList = function(){
	
		if (this.fieldListName.length > 0){
			var oFieldList = buildObj((this.fieldListName.split("."))[1]);
			if (!oFieldList) oFieldList = buildObj(this.fieldListName);
			if (oFieldList) oFieldList.value = this.getProductIDs();
		}
		
		//alert("Field Value: " + oFieldList.value);
	}			
}

// called by the check box, this tells the object to add or remove an items from it's collection
function updateDYO(oCheckBox){
	if (oCheckBox.checked == true) DYO.addItem(arguments[0],arguments[1],arguments[2],arguments[3],arguments[4],arguments[5]);
	else DYO.removeItem(arguments[2]);
}

// directly removes an item from the collection
function directRemove(){
	if (arguments[0]) DYO.removeItem(arguments[0]);
}

// manages tab clicks and pgroup display
var sLastTabID = null;
function clickTabDYO(sTabID){
	var oTab = buildObj(sTabID);
	var oSet = buildObj(sTabID.replace(/tab_/, "set_"));
	var oLastTab = (sLastTabID)? buildObj(sLastTabID):null;
	var oLastSet = (sLastTabID)? buildObj(sLastTabID.replace(/tab_/, "set_")):null; 
	var oTabImg = document.images[sTabID];
	var oLastTabImg = (sLastTabID)? document.images[sLastTabID]:null;	
	
	if (oLastTabImg) oLastTabImg.src = oLastTabImg.src.replace(/_on/, "_off");	
	if (oTabImg) oTabImg.src = oTabImg.src.replace(/_off/, "_on");
	if (oLastSet) oLastSet.style.display = "none";
	if (oSet) oSet.style.display = "inline";
	
	sLastTabID = sTabID;			
}

// returns an object if it exists in the current DOM displayed, or null if it doesn't
function buildObj(sObject){
	// if netscape build the correct path to the element in the DOM
	if (!document.all){
		var aObjTree = sObject.split("."); // split and store the ie version of the DOM tree
		var sTree = "";
		
		// when the tree is long, construct a new tree out of the split apart ie tree
		if (aObjTree.length > 1){
			for (var i=0; i<aObjTree.length; i++){
				if ((i+1)%2 == 0) sTree += ".document."; // inserts ref to the DOM document
				if (i < aObjTree.length -1) sTree += aObjTree[i]; // skips the last element
			}
		
		// just start a basic NS tree
		} else sTree += "document.";
   
		// reconstruct the sObject for a correct NS path to the element
		sObject = (sTree + "getElementById('"+ aObjTree[aObjTree.length -1] +"')");
	}  
 
	// return the element or null if it doesn't exist
	return oCreatedObj = (eval("typeof("+sObject+")") != "undefined")? (eval(sObject)):null;
}