var Common = new Class ({
	options: {},
	initialize : function(options) {
		if($('formLogin')){ this.initLogin(); }
		if($('formRegister')){ this.initRegister(); }
		if($('formOrder')){ this.initOrder(); }
		if($('formComment')){ this.initFeedbackForm(); }
		if($('formOrderInfo')){ this.initOrderInfo(); }
		if($('feedback')){ this.feedback(1); }
		if($('listproducts')){ this.listproducts(1, true); }
		if($('formOrderLogin')){ this.initOrderLogin(); }
	},
	
	initOrderLogin: function(){
		var that = this;
		var frmOrderLogin = [{
			field: "username",
			valid: "required",
			alert: "Vui lòng nhập tên đăng nhập."
		},{
			field: "password",
			valid: "required",
			alert: "Vui lòng nhập mật khẩu."			
		}];
		var formOrderLoginObj = new htmlform({
			id: "formOrderLogin",
			data: frmOrderLogin,
			layer: {
				type: "layer",
				layerWidth: 205
			}
		});
	},	
	
	initLogin: function(){
		var that = this;
		var frmLogin = [{
			field: "username",
			valid: "required",
			alert: "Vui lòng nhập tên đăng nhập."
		},{
			field: "password",
			valid: "required",
			alert: "Vui lòng nhập mật khẩu."			
		}];
		var formLoginObj = new htmlform({
			id: "formLogin",
			data: frmLogin,
			layer: {
				type: "layer",
				layerWidth: 205
			}
		});
	},
	initOrderInfo: function(){
		var that = this;
		var frmOrderInfo = [{
			field: "orderCode",
			valid: "required",
			alert: "Vui lòng nhập mã đơn hàng."
		},{
			field: "code",
			valid: "required",
			alert: "Vui lòng nhập mã kiểm tra."			
		}];
		var formOrderInfoObj = new htmlform({
			id: "formOrderInfo",
			data: frmOrderInfo,
			layer: {
				type: "layer",
				layerWidth: 205
			}
		});
	},
	
	initRegister: function(){
		var that = this;
		var frmRegister = [{
			field: "fname",
			valid: "required",
			alert: "Vui lòng nhập họ."
		},{
			field: "lname",
			valid: "required",
			alert: "Vui lòng nhập tên."			
		},{
			field: "username",
			valid: "required",
			alert: "Vui lòng nhập username."
		},{
			field: "password",
			valid: "required",
			alert: "Vui lòng nhập mật khẩu."
		},{
			field: "cpassword",
			valid: "required",
			alert: "Vui lòng xác nhận mật khẩu."
		},{
			field: "email",
			valid: "email",
			alert: "Vui lòng nhập email."
		},{
			field: "address",
			valid: "required",
			alert: "Vui lòng nhập địa chỉ."
		},{
			field: "tel",
			valid: "phone",
			alert: "Vui lòng nhập số điện thoại.",
			restrict: "[0-9 \.()]"
		},{
//			field: "cell",
//			valid: "phone",
//			alert: "Vui lòng nhập số điện thoại di động.",
//			restrict: "[0-9 \.()]"
//		},{
			field: "province",
			valid: "selected",
			alert: "Vui lòng chọn tỉnh."
		},{
//			field: "dob",
//			valid: "date(mdy)",
//			init: '01/01/1980',
//			restrict: '[0-9/]',
//			alert: "Vui lòng nhập ngày tháng năm sinh."
//		},{
			field: "code",
			valid: "required",
			alert: "Vui lòng nhập mã kiểm tra."
		}];
		
		if($('username')){
			$('username').addEvent('blur', function(e){
				that.checkUserName();
			});
		}
		that.formRegisterObj = new htmlform({
			id: "formRegister",
			data: frmRegister,
			layer: {
				type: "layer",
				layerWidth: 205
			}
		});
		if($('dob')){
			new Calendar({ dob: 'd/m/Y' }, { direction: -1, classes: ['alternate'], navigation: 2});
		}
	},
	
	checkUserName: function(){		
		var that = this;
		var username = $('username').value;
		new Ajax('/check.php?op=checkUsername&username=' + username + '&rnd=' + Math.random()*100, {
			method: 'get',
			data: $('formRegister').toQueryString(),
			
			onRequest: function(){
				$('ajaxLoading').setStyle('display', 'block');
				$('ajaxResult').setHTML('');
			},
			onComplete: function(response){
				$('ajaxLoading').setStyle('display', 'none');
				if(response == 'Success...'){						
					$('ajaxResult').className = 'success';
					$('ajaxResult').setHTML('OK');
				}
				else{
					$('ajaxResult').className = 'failure';
					$('ajaxResult').setHTML(response);
					that.formRegisterObj.showAlertLayer($('username'));					
				}						
			}
		}).request();				
	},
	
	initOrder: function(){
		var that = this;
		var frmOrder = [{
			field: "name",
			valid: "required",
			alert: "Vui lòng nhập họ tên."
        },{
			field: "email",
			valid: "email",
			alert: "Vui lòng nhập email."
		},{
			field: "address",
			valid: "required",
			alert: "Vui lòng nhập địa chỉ."
		},{
			field: "tel",
			valid: "required",
			alert: "Vui lòng nhập số điện thoại.",
			restrict: "[0-9 \.()]"
		},{
			field: "province",
			valid: "selected",
			alert: "Vui lòng chọn tỉnh."
		},{
			field: "rname",
			valid: "required",
			alert: "Vui lòng nhập họ tên người nhận."
		},{
			field: "raddress",
			valid: "required",
			alert: "Vui lòng nhập địa chỉ người nhận."
		},{
			field: "rtel",
			valid: "required",
			alert: "Vui lòng nhập số điện thoại người nhận.",
			restrict: "[0-9 \.()]"
		},{
			field: "rprovince",
			valid: "selected",
			alert: "Vui lòng chọn tỉnh/thành phố của người nhận."
		},{
			field: "code",
			valid: "required",
			alert: "Vui lòng nhập mã kiểm tra."
		}];

		var formOrderObj = new htmlform({
			id: "formOrder",
			data: frmOrder,
			layer: {
				type: "layer",
				layerWidth: 205
			}
		});
		if($('rdate')){
			new Calendar({ rdate: 'd/m/Y' }, { direction: 1, classes: ['alternate'], navigation: 2});
		}
	},
	
	initFeedbackForm: function(){
		var that = this;	
		var frmComment = [{
			field: "username",
			valid: "required",
			alert: "Vui lòng nhập họ tên."
		},{
			field: "email",
			valid: "email",
			alert: "Vui lòng nhập email."
		},{
			field: "tel",
			valid: "phone",
			alert: "Vui lòng nhập số điện thoại.",
			restrict: "[0-9]"
		},{
			field: "comment",
			valid: "required",
			alert: "Vui lòng nhập góp ý."
		},{
			field: "code",
			valid: "required",
			alert: "Vui lòng nhập mã kiểm tra."
		}];
	
		var formObj = new htmlform({
			id: "formComment",
			data: frmComment,
			layer: {
				type: "layer",
				layerWidth: 215
			},
			behaviors: {
				onSubmit: function(){
					new Ajax('/ajax.php?rnd=' + Math.random()*100, {
						method: 'post',
						data: $('formComment').toQueryString(),
						onRequest: function(){
							$('ajaxLoading').setStyle('display', 'block');
						},
						onSuccess: function(response){
							if(response == 'Success...'){
								$('formComment').reset();
							}
							$('codeSecurity').src = $('codeSecurity').src + '?rnd=' + Math.random() * 1000;
							$('ajaxLoading').setStyle('display', 'none');
							if(response == 'Success...'){
							$('ajaxResult').className = 'success';
							}
							else{
							$('ajaxResult').className = 'failure';
							}
							$('ajaxResult').setHTML(response);
							that.feedback(1);
						}
					}).request();
				}
			}
		});
	},
	
	feedback: function(page){
		var that = this;
		var feedback = $('feedback');
		if(!feedback) return;
		var productId = $('productid').value; 
		
		new Ajax('/ajax.php?op=listproductcomment&pid=' + productId + '&page=' + page + '&rnd=' + Math.random()*100, {
			method: 'get',
			update: feedback,
			onRequest: function(){
				feedback.setHTML('<div id="loader" style="height:50px; padding-top:50px; text-align: center;"><img alt="loading" src="/templates/viviann/images/ajax-loader.gif"/></div>');
			},
			onComplete: function(){
				var paging = feedback.getElement('p.paging');
				var aLinks = paging.getElements('a');
				aLinks.each(function(aLink){
					aLink.addEvent('click', function(e){
						new Event(e).stop();
						that.feedback(this.getText());
					});
				});
			}
		}).request();
	},
		
	listproducts: function(page, first){
		var that = this;
		var listproducts = $('listproducts');
		if(!listproducts) return;
		var categoryId = $('categoryid').getProperty('name');
		var productionId = $('productionid').getProperty('name');
		new Ajax('/ajax.php?op=listcategoryproduct&content=' + categoryId + '&production=' + productionId + '&page=' + page + '&rnd=' + Math.random()*100, {
			method: 'get',
			update: listproducts,
			onRequest: function(){
				listproducts.setHTML('<div id="loader" style="width:100%;padding:40px 0 0 0;height:50px; text-align: center;"><img alt="loading" src="/templates/viviann/images/ajax-loader.gif" style="border:none;"/></div>');
			},
			onComplete: function(){
				var paging = listproducts.getElement('ul.paging');
				if(paging.innerHTML == 'ERROR'){
					$$('div.paging2').each(function(item){
						item.addClass('hidden');
					});
					return;
				}
				$$('div.paging2').each(function(item){
					item.setHTML('<ul>' + paging.innerHTML + '</ul>');
					var totalPages = parseInt(item.getElement('input').value);
					var aLinks = item.getElements('a');
					aLinks.each(function(aLink){
						aLink.addEvent('click', function(e){
							new Event(e).stop();
							var linkVal = this.getText();
							if(linkVal == 'Next'){
								if(page >= totalPages){
									return;
								}
								else{
									linkVal = ++page;
								}								
							}
							else if(linkVal == 'Previous'){
								if(page <= 1){
									return;
								}
								else{
									linkVal = --page;
								}
							}							
							that.listproducts(linkVal, false);
						});
					});
				});
				var aImages = listproducts.getElements('img');
				aImages.each(function(aImage){
					aImage.addEvent('click', function(e){
						new Event(e).stop();
						aImages.each(function(item){
							item.removeClass('borderActive');
						});
						aImage.addClass('borderActive');
						that.listproductsdetail(this.getProperty('id'));
					});
				});	
				if(aImages[0] && first){
					that.listproductsdetail(aImages[0].getProperty('id'));
					aImages[0].addClass('borderActive');
				}
			}
		}).request();
	},

	listproductsdetail: function(id){
		var that = this;
		var listproductsdetail = $('listproductsdetail');
		if(!listproductsdetail) return;
		
		new Ajax('/ajax.php?op=loadproductdetail&content=' + id + '&rnd=' + Math.random()*100, {
			method: 'get',
			update: listproductsdetail,
			onRequest: function(){
				listproductsdetail.setHTML('<div id="loader" style="width:100%;padding-top:50px; height:50px; text-align: center; "><img alt="loading" src="/templates/viviann/images/ajax-loader.gif" style="border:none;"/></div>');
			},
			onComplete: function(){
				var listProductInfo = $('listProductInfo');
				if(listProductInfo){
					var listProductSizes = listProductInfo.getElement('ul.listSize');
					var listProductColor = listProductInfo.getElement('div.colorContainer');
					var listProductColors = listProductInfo.getElements('ul.listColor');
					var currentColorText = listProductInfo.getElement('p.currentColorText');
					var currentColor = listProductInfo.getElement('p.currentColor');
					var listProductSizesLi = listProductSizes.getChildren();
					var lastItem = null;
					var lastColor = null;
					listProductSizesLi.each(function(item, index){
						item.addEvent('click', function(e){
							e = new Event(e);
							e.stop();
							if(lastColor){
								lastColor.addClass('hidden');
							}
							if(lastItem){
								lastItem.removeClass('current');
							}
							listProductColor.removeClass('hidden');
							lastItem = item;
							lastItem.addClass('current');
							currentColorText.addClass('hidden');
							currentColor.addClass('hidden');
							lastColor = listProductColors[index];
							lastColor.removeClass('hidden');
							lastColor.getElements('li').each(function(li){
								li.addEvent('click', function(e){
									e = new Event(e);
									e.stop();
									var _color = li.getElement('a').getProperty('title');
									currentColor.className = 'currentColor ' + _color.toLowerCase();
									currentColorText.setHTML(_color);
									currentColorText.removeClass('hidden');
								});
							});
						});
					}.bind(this));
				}
			}
		}).request();
	}	
});
	
window.addEvent('load', function() {
	new Common();
});