Vn.Catalog = new Class
({
	Extends: Vn.Module

	,open: function ()
	{
		if (this.basketChecked)
			this.parent ();
	}
	
	,activate: function ()
	{
		Vn.BasketChecker.check (this.conn,
			this.onBasketCheck.bind (this));
	}

	,onBasketCheck: function (isOk)
	{
		if (!isOk)
			return;
	
		this.basketChecked = true;
		this.open ();

		this.popup = new Htk.Popup ();
		this.popup.setChildNode (this.$('lots-popup'));
	}
	
	,typeRenderer: function (builder, form)
	{
		var link = builder.$('link');
		link.href = this.hash.make ({'type': form.get ('tipo_id')}, true);
	}
	
	,realmRenderer: function (builder, form)
	{
		var link = builder.$('link');
		link.href = this.hash.make ({
			'form': this.hash.get ('form'),
			'realm': form.get ('id')
		});
		
		var img = builder.$('image');
		img.src = 'image/family/'+ form.get ('id') +'.svg';
		img.title = form.get ('reino');
		img.alt = img.title;
	}

	,onTypeChange: function ()
	{
		if (Vn.isMobile () && this.$('type').value)
			this.hideMenu ();

		var realms = this.$('realms-model');
		
		if (!realms.ready)
			return;
		
		this.refreshTitle ();

		var color = null;
		
		if (this.$('type').value)
		{
			var row = realms.search ('id', this.$('realm').value);

			if (row != -1)
				color = '#'+ realms.get (row, 'color');
		}

		this.$('header').style.backgroundColor = color;

		var tr = this.$('items-grid').getNode ()
			.getElementsByTagName ('thead')[0]
			.getElementsByTagName ('tr')[0];
			//.querySelector ('thead tr');
		tr.style.backgroundColor = color;
	}
	
	,refreshTitle: function (title)
	{
		var types = this.$('types-model');
		
		if (!types.ready)
			return;
		
		var title = _('Catalog');
		
		if (this.$('type').value)
		{
			var row = types.search ('tipo_id', this.$('type').value);

			if (row != -1)
				title = types.get (row, 'Tipo');
		}
		else if (this.$('search-entry').value)
			title = _('SearchResults');

		Vn.Node.setText (this.$('title'), title);
	}

	,onSearch: function (event)
	{
		var searchTags = this.$('search-entry').value;
		searchTags = searchTags != '' ? searchTags : null;

		var batch = this.$('batch');
		batch.block ();

		this.$('search').value = searchTags;

		if (searchTags)
		{
			this.$('type').value = null;
			this.$('realm').value = null;
		}

		batch.unblock ();
		batch.changed ();
	}

	,onMenuClick: function (event)
	{
		event.stopPropagation ();
	}

	,onShowMenuClick: function (event)
	{
		event.stopPropagation ();
		this.gui.showBackground ();
		this.$('menu').style.display = 'block';
		this.hideMenuCallback = this.hideMenu.bind (this);
		document.addEventListener ('click', this.hideMenuCallback);
	}

	,hideMenu: function ()
	{
		this.gui.hideBackground ();
		this.$('menu').style.display = 'none';
		document.removeEventListener ('click', this.hideMenuCallback);
		this.hideMenuCallback = null;
	}
	
	,onBasketClick: function ()
	{
		this.hash.set ({'form': 'ecomerce/basket'});
	}
	
	,featuresRender: function (renderer, form)
	{
		renderer.value = form.get ('Medida') +' '+ form.get ('Categoria') +' '+ form.get ('Color');
	}

	,amountRender: function (renderer, form)
	{
		var amount = form.get ('amount');
		var grouping = form.get ('grouping');

		if (amount && grouping)
			renderer.value = amount / grouping;
		else
			renderer.value = null;
	}

	,amountChanged: function (renderer, row, newValue)
	{
		var model = this.$('items-model');
		model.set (row, 'amount', newValue * model.get (row, 'grouping'));
	}

	,catRenderer: function (column, form)
	{
		switch (form.get ('Categoria'))
		{
			case 'A2':
				column.td.className = 'second-category';
				break;
			case 'B1':
				column.td.className = 'third-category';
				break;
			default:
				column.td.className = '';
		}
	}
	
	,onAddItemClick: function  (column, value, row, button)
	{
		var itemId = this.$('items-model').get (row, 'item_id')
	
		var batch = this.$('lots-batch');
		batch.addValue ('item', itemId);
		batch.changed ();

		this.itemId = itemId;
		this.onEraseClick ();
		this.popup.show (button);
	}
	
	,onAddLotClick: function (column, value, row, button)
	{
		var model = this.$('item-lots');
		var grouping = model.get (row, 'grouping');
		var warehouse = model.get (row, 'warehouse_id');

		var lotAmount = this.items[warehouse];
		
		if (lotAmount === undefined)
			lotAmount = 0;
			
		lotAmount += grouping;
		
		if (lotAmount <= model.get (row, 'available'))
		{
			this.items[warehouse] = lotAmount;
			this.$('amount').value += grouping;
		}
		else
			Htk.Toast.showError (_('NoMoreAmountAvailable'));
	}
	
	,onEraseClick: function ()
	{
		this.$('amount').value = 0;
		this.items = {};
	}
	
	,onConfirmClick: function ()
	{
		var sql = '';
		var batch = new Sql.Batch ();
		var query = new Sql.String ({query: 'CALL basket_item_add (#warehouse, #item, #amount);'});

		for (var warehouse in this.items)
		{
			batch.addValue ('warehouse', warehouse);
			batch.addValue ('item', this.itemId);
			batch.addValue ('amount', this.items[warehouse]);
			sql += query.render (batch);
		}
	
		if (sql != '')
			this.conn.execQuery (sql);

		this.popup.hide ();
	}
	
	,onStatusChange: function (model)
	{
		if (this.popup)
			this.popup.reset ();
	}
});