/**
 * diamond view
 */
var View = {
	
	// init shape
	initShapes : function() {
		var shapes = Diamond._shapeArray;
		var obj = $('#shapeList');
		obj.html('');
		for(var i in shapes) {
			var j = parseInt(i)+1;
			obj.append('<li onmouseover="View.showShapeTip(this);" onmouseout="View.hideShapeTip(this);"><a onclick="Diamond.changeShape(\'' + shapes[i] + '\',this);" title="' + shapes[i] + '"><img src="' + Diamond._domain + '/images/icon/' + j + '.gif" alt="" /></a><span><img src="' + Diamond._domain + '/images/icon/' + j + '_big.gif" alt="" /></span></li>');
		}
	},
	// init cut
	initCuts : function() {
		var cuts = Diamond._cutArray;
		var obj = $('#cutList');
		obj.html('');
		for(var i in cuts) {
			obj.append('<li><a onclick="Diamond.changeCut(\'' + cuts[i] + '\',this);" title="' + cuts[i] + '">' + cuts[i] + '</a></li>');
		}
	},
	// init color
	initColors : function() {
		var colors = Diamond._colorArray;
		var obj = $('#colorList');
		obj.html('');
		for(var i in colors) {
			obj.append('<li><a onclick="Diamond.changeColor(\'' + colors[i] + '\',this);" title="' + colors[i] + '">' + colors[i] + '</a></li>');
		}
	},
	// init claritys
	initClarities : function() {
		var clarities = Diamond._clarityArray;
		var obj = $('#clarityList');
		obj.html('');
		for(var i in clarities) {
			obj.append('<li><a onclick="Diamond.changeClarity(\'' + clarities[i] + '\',this);" title="' + clarities[i] + '">' + clarities[i] + '</a></li>');
		}
	},
	// init polish
	initPolishes : function() {
		var polishes = Diamond._polishArray;
		var obj = $('#polishList');
		obj.html('');
		for(var i in polishes) {
			obj.append('<li><a onclick="Diamond.changePolish(\'' + polishes[i] + '\',this);" title="' + polishes[i] + '">' + polishes[i] + '</a></li>');
		}
	},
	// init symmetry
	initSymmetries : function() {
		var symmetries = Diamond._symmetryArray;
		var obj = $('#symmetryList');
		obj.html('');
		for(var i in symmetries) {
			obj.append('<li><a onclick="Diamond.changeSymmetry(\'' + symmetries[i] + '\',this);" title="' + symmetries[i] + '">' + symmetries[i] + '</a></li>');
		}
	},
	// init shop list
	initShops : function() {
		var shops = Diamond._shops;
		var obj = $('#shopList');
		$.getJSON(
			Diamond._domain + '/api/getshop.php?shops=' + shops + '&callback=?',
			function(data) {
				obj.html('');
				for(var i in data['items']) {
					var item = data['items'][i];
					html = '<li><a onclick="Diamond.changeShopName(\'' + item['shopname'] + '\',this);" title="' + item['shopnameCN'] + '"';
					if (item['shopname']==Diamond._shopname) {
						html += ' class="curItem"';
					}
					html += '>' + item['shopnameCN'] + '</a></li>';
					obj.append(html);
				}
			}
		);
	},
	// init weight
	initWeight : function() {
		var w1 = Diamond._weight1;
		var w2 = Diamond._weight2;
		$( "#weightSlider" ).slider({
			range: "max",
			min: w1,
			max: w2,
			values: [w1,w2],
			slide: function( event, ui ) {
				$( "#showData" ).html( ui.values[0] + '克拉 - ' + ui.values[1] + '克拉');
			},
			stop: function( event, ui ) {
				Diamond.changeWeight(ui.values[0],ui.values[1]);
			}
		});
		$('#showData').html(w1 + '克拉 - ' + w2 + '克拉');
	},
	// init price
	initPrice : function() {
		var p1 = Diamond._price1;
		var p2 = Diamond._price2;
		$( "#priceSlider" ).slider({
			range: "max",
			min: p1,
			max: p2,
			values: [p1,p2],
			range: true,
			slide: function( event, ui ) {
				$( "#showDatap" ).html("RMB:" + ui.values[0] + " - " + ui.values[1]);
			},
			stop: function( event, ui ) {
				Diamond.changePrice(ui.values[0],ui.values[1]);
			}
		});
		$('#showDatap').html('RMB:' + p1 + ' - ' + p2);
	},
	// search product
	searchDiamon : function() {
		var _this = this;
		var obj = $('#searchResult');
		var shopname = Diamond._shopname=='' ? Diamond._shops : Diamond._shopname;
		$.getJSON(
			Diamond._domain + '/api/getproduct.php?shopname=' + encodeURIComponent(shopname) + '&shape=' + encodeURIComponent(Diamond._shape) + '&cut=' + encodeURIComponent(Diamond._cut) + '&color=' + encodeURIComponent(Diamond._color) + '&clarity=' + encodeURIComponent(Diamond._clarity) + '&polish=' + encodeURIComponent(Diamond._polish) + '&symmetry=' + encodeURIComponent(Diamond._symmetry)  + '&weight1=' + Diamond._weight1 + '&weight2=' + Diamond._weight2 + '&price1=' + Diamond._price1 + '&price2=' + Diamond._price2 + '&code=' + Diamond._code + '&page=' + Diamond._page + '&pagesize=' + Diamond._pagesize + '&callback=?',
			function(data) {
				obj.html('');
				if (data['items'].length > 0) {
					for(var i in data['items']) {
						var item = data['items'][i];
						obj.append('<tr><td width="10%">' + item['certificate'] + '</td><td width="11%">' + item['code'] + '</td>\
						<td width="7%">' + item['weight'] + '</td><td width="5%">' + item['color'] + '</td>\
						<td width="6%">' + item['clarity'] + '</td><td width="5%">' + item['cut'] + '</td>\
						<td width="6%">' + item['polish'] + '</td><td width="6%">' + item['symmetry'] + '</td>\
						<td width="12%">' + item['shape'] + '</td><td width="10%">￥' + item['price'] + '</td>\
						<td width="14%">' + item['shopnameCN'] + '</td>\
						<td width="8%"><a href="' + Diamond._buyLink + '" target="_blank"><img src="' + Diamond._domain + '/images/cat.gif" alt="购物车" /></a></td></tr>');
					}
				}
				else {
					obj.append('<tr><td>暂无</td></tr>');
				}
				_this.setPageContent(data['total'],data['page'],data['pagesize']);
			}
		);
	},
	/**
	 * show shape tip
	 */
	showShapeTip : function(obj) {
		$('#shapeList li span').hide();
		$(obj).children('span').show();
	},
	/**
	 * hide shape tip
	 */
	hideShapeTip : function(obj) {
		$('#shapeList li span').hide();
	},
	/**
	 * set page content
	 * @int total
	 * @int page
	 * @int pageSize
	 */
	setPageContent : function(total,page,pageSize) {
		var html = '';
		var totalPage = Math.ceil(total/pageSize);
		var startPage = 1;
		var defaultPageViewNum = 10;
		var halfPage = defaultPageViewNum/2;
		if (page<1 || page>totalPage) {
			html = '';
		}
		else {
			if (page>1) {
				html += '<a onclick="Diamond.changePage(1);">首页</a> <a onclick="Diamond.changePage(' + (page-1) + ');">上一页</a> | ';
			}
			if (page > halfPage) {
				startPage = page - halfPage +1;
			}
			for (var i=startPage,j=0;i<=totalPage && j<=defaultPageViewNum;i++,j++) {
				if (i==page)
					html += '<span class="current">' + i + '</span>' ;
				else
					html += '<a onclick="Diamond.changePage(' + i + ');">' + i + '</a> ';
			}
			if (page<totalPage) {
				html += ' | <a onclick="Diamond.changePage(' + (parseInt(page)+1) + ');">下一页</a> <a onclick="Diamond.changePage(' + totalPage + ');">尾页</a>';
			}
		}
		$('#pagebar').html(html);
	}
}