/**
 * @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;
	
	if (showBid) {
		this.titles = ["","Item Title","Condition", "Bids", "Price", "Shipping", "Time left"];
		this.width = [10, 45, 5, 5, 10, 10, 15];	
	} else {
		this.titles = ["","Item Title","Condition", "Price", "Shipping", "Time Left"];
		this.width = [10,50,5,10,10,15];
	}

	/**
	 * constructing HTML 
	 * @return {String} constructed HTML
	 */
	this.display = function() {
		var str = "<table style='padding: 3px 3px 3px 3px; background: #efefff;' width='100%' cellspacing='0' cellpadding='1'  >" + this.newLine;
		if (this.titles) {
			str = str + "<tr style='background: #ccc; font-family: Calibri; font-weight:bold;'> " + this.newLine;
			if ( com.ebay.widgets.typeOf(this.titles) == 'array') {
				for (var i = 0; i< this.titles.length; ++i ) {
					str = str + "<td width='" +this.width[i] + "%' >" + this.titles[i] + "</td>" + this.newLine;		
				}
			} else {
				str = str + "<td>" + this.titles + "</td>" + this.newLine;						
			}
			str = str + "</tr>" + 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;
					var item = this.items[i];

					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;					
					} else {
						str = str + "<td><img style='margin: 0 6px 0 6px' height='50' width='50' src='" + image + "' " + "</td>" + this.newLine;					
					}
					
					str = str + "<td><a href='" + 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;;
					}
				
					if (this.showBid) {
						if (this.items[i].bidCount) {
							str = str + "<td>" + this.items[i].bidCount + "</td>" + this.newLine;
						} else {
							str = str + "<td>" + "-" + "</td>" + this.newLine;				
						}
					}
					str = str + "<td style='font-weight:bold;'>" + "$" + this.items[i].convertedCurrentPrice.value.toFixed(2) + "</td>" + this.newLine;
					if (this.items[i].shippingCostSummary.shippingServiceCost) {
						str = str + "<td style='font-weight:bold;'>" + "$" + this.items[i].shippingCostSummary.shippingServiceCost.value.toFixed(2) + "</td>" + this.newLine;
					} else {
						str = str + "<td style='font-weight:bold;'>" + "Not Specified" + "</td>" + this.newLine;
					}
					str = str + "<td style='font-weight:bold; color:red;' >" + 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 = "#edeac9";
};

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