Ext.define('TradePortal.view.products.List', {
	extend: 'Ext.panel.Panel',
	alias: 'widget.products_list',
	id: 'products_list',
	layout: {
		type: 'table',
		columns: 4
	},
	autoScroll: true,
	width: 720,
	height: window.innerHeight / 2 - 5,
	border: false,
	getUomStore: function (uoms) {
		return Ext.create('Ext.data.Store', {
			fields: [
				{name: 'UOM', type: 'string'}
			],
			data: uoms
		});
	},
	buildProductsList: function (products) {
		var productsList = Ext.getCmp('products_list');
		var productArray = new Array();
		productsList.removeAll();
		for (i in products) {
			var product = products[i];
			if (product.get('UOM') == "") {
				// getProductsByCategory
				var uomLoaded = true;
				var uom = product.get('UOMList')[0] == undefined ? '' : product.get('UOMList')[0]['UOM'];
				var uomStore = this.getUomStore(product.get('UOMList'));
			} else {
				// searchProduct
				var uomLoaded = false;
				var uom = product.get('UOM');
				var uomStore = this.getUomStore({'UOM': uom});
			}
			var product = Ext.create('Ext.panel.Panel', {
				layout: 'vbox',
				width: 170,
				height: 235,
				border: false,
				cls: 'product',
				items: [{
					html: '<img width="110px" height="110px" style="cursor: pointer;" onclick="DrillNewOpen(\'' + product.get('productID') + '\')" src="' + product.get('productImage') + '"></img>',
					margin: '0 0 5 10'
				}, {
					html: product.get('productLongDesc'),
					width: 150,
					height: 30,
					margin: '0 0 2 0',
					border: false,
					cls: 'product-desc'
				}, {
					html: Ext.util.Format.currency(product.get('RRP')),
					width: 70,
					margin: '0 0 2 2',
					border: false,
					cls: 'product-rrp'
				}, {
					layout: 'hbox',
					width: 170,
					border: false,
					items: [{
						xtype: 'numberfield',
						width: 70,
						value: 1,
						minValue: 1,
						margin: '0 0 2 2'
					}, {
						xtype: 'combo',
						store: uomStore,
						valueField: 'UOM',
						displayField: 'UOM',
						value: uom,
						width: 70,
						margin: '0 0 2 2',
						productId: product.get('productID'),
						uomLoaded: uomLoaded/*,
						listeners: {
							focus: function () {
								if (this.uomLoaded) {
									return;
								}
								this.up('panel').up('panel').setLoading(true);
								Ext.Ajax.request({
									method: 'GET',
									params: {
										method: 'getProductDetails',
										deviceID: Ext.getStore('Config').data.last().data.device_id,
										ProductID: this.productId,
										customerID: Ext.getStore('HomeStatistic').last().data.id_cust,
										incGST: Ext.getStore('getPriceViewOptionsTP').last().data.GSTInc
									},
									scope: this,
									success: function (response) {
										this.uomLoaded = true;
										var data = Ext.JSON.decode(response.responseText);
										var uoms = data['getProductDetails'][0]['UOMList'].split("|");
										this.getStore().removeAll();
										for (j in uoms) {
											this.getStore().add({'UOM': uoms[j]});
										}
										this.setValue(uoms[0]);
										this.up('panel').up('panel').setLoading(false);
									},
									failure: function (response, opts) {
										this.up('panel').up('panel').setLoading(false);
									}
								});
							}
						}*/
					}]

				}, {
					xtype: 'button',
					text: '+ ADD TO ORDER',
					width: 145,
					height: 30,
					margin: '0 0 4 0',
					product: product,
					handler: function (button) {
						if (button.product.data.isTally || button.product.data.Tally) {
							Ext.getCmp('viewport').setLoading('Loading...');
							Ext.getStore('TallyProducts').setExtraParam('lineNo', 0);
							Ext.getStore('getProductDetails').load({
								params: {
									deviceID: Ext.getStore('Config').data.last().data.device_id,
									ProductID: button.product.get('productID'),
									customerID: Ext.getStore('HomeStatistic').last().data.id_cust,
									incGST: Ext.getStore('getPriceViewOptionsTP').last().data.GSTInc
								}
							});

							Ext.getStore('ProductLengthTally').load({
								params: {
									companyID: Ext.getStore('Config').data.last().data.company_id,
									branchID: 1,
									productID: button.product.get('productID')
								}
							});
						}
						else {
							Ext.getStore('CartTotal').removeAll();
							Ext.getStore('addCartProduct').load({
								params: {
									sessionID: Ext.getStore('createCart').last().data.sessionID,
									roomTypeID: '',
									customerID: Ext.getStore('HomeStatistic').last().data.id_cust,
									productID: button.product.get('productID'),
									quoteQty: this.up('panel').down('spinnerfield').getValue(),
									unitSell: 0,
									quoteComments: '',
									UOM: this.up('panel').down('combo').getValue()
								}
							});
						}
					}
				}]
			});
			productArray.push(product);
		}
		productsList.add(productArray);
	}
});

function DrillNewOpen(product) {
	Ext.getCmp('viewport').setLoading('Loading...');
	Ext.getStore('showProductDetails').load({
		params: {
			deviceID: Ext.getStore('Config').data.last().data.device_id,
			ProductID: product,
			customerID: Ext.getStore('HomeStatistic').last().data.id_cust,
			incGST: Ext.getStore('getPriceViewOptionsTP').last().data.GSTInc
		}
	});
	Ext.getStore('getFeaturesAndBenefits').load({
		params: {
			deviceID: Ext.getStore('Config').data.last().data.device_id,
			ProductID: product
		}
	});
	Ext.getStore('getProductInformation').load({
		params: {
			deviceID: Ext.getStore('Config').data.last().data.device_id,
			ProductID: product
		}
	});
}
