/**
 * @class ItemListUI UI component to display items
 * @constructor
 * @param {Array} items array of com.ebay.shoppingservice.SimpleItemType 
 * @param {Boolean} if show bid column 
 */
function ItemListUI(items, showBid)
{
	/**
     * items
     * @type Array
     */	
	this.items = items;
	
	/**
     * if show bid column
     * @type Boolean
     */	
	this.showBid = showBid;

	/**
     * new line char
     * @type String
     */	
	this.newLine = "\n";

	/**
     * colums width
     * @type Array
     */	
	this.width = null; 

	/**
     * colums titles
     * @type Array
     */	
	this.titles = null;
	
	this.titles = ["","Item Title", "Price", "Location", "Time Left"];
	this.width = [10, 50, 10, 15, 10];
	this.mplx  = "http://altfarm.mediaplex.com/ad/ck/10302-82987-2357-0?";


	/**
	 * constructing HTML 
	 * @return {String} constructed HTML
	 */
	this.display = function() {
	
	    if (this.items.length <= 0) return;
		var str = "";
		
		str = str + "<table width='99%' cellpadding='0' cellspacing='0' border='0' class='columnHeadsSB2'>" + this.newLine;
	    str = str + "<tr id='columnHeadsSB2'><td id='columnHeadsSB2'>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td style='style='font-weight:normal;color:#000000;font-size:12px;' width='17%'>Price</td><td width='17%' ALIGN='right'>Time Left</td></tr>" + this.newLine;
		str = str + "</table>" + this.newLine;
		//str = str + "<table width='99%' cellpadding='0' cellspacing='0' border='0'>" + this.newLine;
		//str = str + "</table><br/>" + this.newLine;
		str = str + "<table width='99%' cellpadding='0' cellspacing='0' border='0' class='resultsTableSB'>" + this.newLine;
		
		if (this.items) {
			if ( com.ebay.widgets.typeOf(this.items) == 'array') {
				for (i = 0; i< this.items.length; ++i ) {										
					//str = str + "<tr height='65' onmouseover='changeColor(this)' onmouseout='returnColor(this)'> " + this.newLine;
					str = str + "<tr class='rrow' id='resultrowebay'> " + this.newLine;
					//str = str + "<tr class='rrow' id='resultrowebay'  onmouseover='changeColor(this)' onmouseout='returnColor(this)'> " + this.newLine;
					var item = this.items[i];
					var dtt = new Date();
					
					str = str + "<td colspan='2' width='55%'><strong><a href='" + this.mplx + "mpt=" + dtt.getTime() + "&mpro=" + this.items[i].viewItemURLForNaturalSearch + "'  Target='_new'>"
						+ this.items[i].title + "</a></strong><img src='http://altfarm.mediaplex.com/ad/tr/10302-82987-2357-0?mpt="
						+ dtt.getTime() + "' border='0'><br/>" + this.newLine; // title					

					str = str + "<a href='" + this.mplx + "mpt=" + dtt.getTime() + "&mpro=" + this.items[i].viewItemURLForNaturalSearch + "' Target='_new'>"
					if (this.items[i].galleryURL) {
						//str = str + "<td><img style='margin: 0 6px 0 6px' height='50' width='50' src='" + this.items[i].galleryURL + "' " + "</td>" + this.newLine;					
						str = str + "<img class='thumbnail' style='float: left; martin-top: 5px; margin-right: 8px;' height='50' width='50' src='" + this.items[i].galleryURL;
					} else {
						//str = str + "<td><img style='margin: 0 6px 0 6px' height='50' width='50' src='" + image + "' " + "</td>" + this.newLine;					
						str = str + "<img class='thumbnail' style='float: left; martin-top: 5px; margin-right: 8px;' height='50' width='50' src='" + image;					
					}
					
					str = str + "' " + "/>" + this.newLine;
					str = str + "</a>" + this.newLine;			
					
					if (this.items[i].location) {
						str = str + " Location: " + this.items[i].location + "</td>" + this.newLine;
					}					
					
					//str = str + "<td colspan='2'><a href='" + this.mplx + this.items[i].viewItemURLForNaturalSearch + "'>"
						//+ this.items[i].title + "</a>" + "</td>" + this.newLine; // title
				
					//if (this.items[i].halfItemCondition) {
						//str = str + "<td>" + this.items[i].halfItemCondition.value + "</td>" + this.newLine; // condition
					//} else {
						//str = str + "<td>" + "</td>" + this.newLine;;
					//}
					
					str = str + "<td width='10%'><img src='http://pics.ebaystatic.com/aw/pics/bin_15x54.gif'/></td>" + this.newLine;
				
					str = str + "<td width='17%' style='font-weight:bold;'>" + "$" + this.items[i].convertedCurrentPrice.value.toFixed(2) + "</td>" + this.newLine;

					//if (this.items[i].location) {
					//str = str + "<td style='font-weight:bold;'>" + this.items[i].location + "</td>" + this.newLine;
					//}
					//if (this.items[i].startTime) {
					//str = str + "<td style='font-weight:bold;'>" + this.items[i].startTime + "</td>" + this.newLine;
					//}
					//str = str + "<td width='17%' style='font-weight:bold; color:red;' >" + this.items[i].timeLeft + "</td>" + this.newLine;					
					str = str + "<td width='17%' ALIGN='right' >" + this.items[i].timeLeft + "</td>" + this.newLine;					
					str = str + "</tr>" + this.newLine;
					//str = str + "<tr><td colspan='" + this.titles.length + "' style='border-bottom: 2px solid #FFFFFF;'></td></tr>" + this.newLine;					
				}			
			}
		}
		str = str + "</table> " + this.newLine;
		return str;
	};
}

function changeColor(e) {
	e.style.background = "#e0e040";
};

function returnColor(e) {
	e.style.background = "#efefff";
}