/*AJAX LOADER*/
var AjaxLoad = function(){};
AjaxLoad.prototype = {
	init:function(){
		that = this;
		$.ajax({
			url:this.url,
			dataType:'json',
			success:function(json){
				that.successHandler(json);
			},complete:function(){
				that.completeHandler();
			}
		});
	}
}

/*IMAGE LOADER*/
var ImagesLoader = function(){};
ImagesLoader.prototype = {
	list:[],
	count:0,
	callBack:null,
	init:function(callBack){
		var that = this;
		var _max = this.list.length;
		for(var i in that.list){	
			var _url = that.list[i];
			(function(i){
				var image = new Image();
				$(image).load(function(){
					that.count++;
					if (that.count === _max) {
						that.loadFinish()
					}	
				}).attr('src',_url);
				$(image).error(function(){
					that.count++;
					if (that.count === _max) {
						that.loadFinish()
					}
				})
			})(i);
		}
	},
	loadFinish:function(){
		var that = this;
		if(that.callBack !== null){
			that.callBack;
		}
	}
}

var initItem = function(){
	$('div','#colItem').each(function(){
		$(this).click(function(){
			window.location=$(this).attr("url");
		}).hover(function(){
			$('dd',$(this)).fadeIn(300);
			$('.pName',$(this)).css({'background-position':'0 0','color':'#fff'})
		},function(){
			$('dd',$(this)).fadeOut(200);
			$('.pName',$(this)).css({'background-position':'0 -41px','color':'#000'})
		})
	});
};

var slideShow = function(trg){
	var _slideCont = trg.slide;
	var _images = $(_slideCont).children();
	var _btn = trg.btn;
	var _icon = trg.icon;
	var _d = _images.outerWidth();
	var _d2 = $(_btn).outerWidth()+10;
	var _flag = 0;
	$(_btn).each(function(i){
		$(this).click(function(){
			if(i != _flag){
				$(_slideCont).animate({'left':_d*-i+'px'},400);
				$(_icon).animate({'left':_d2*i+'px'},400);
				$(this).addClass('active');
				$(_btn).eq(_flag).removeClass('active');
				_flag = i;
			}
		})
	})
};


var initTab = function(){
	var _current = 0;
	var _conts = $('div','#content');
	var _height = _conts.eq(_current).outerHeight();
	$('#content').css({'height':_height+'px'})
	$('#tab').children().each(function(i){
		$(this).click(function(){
			if(i !== _current){
				//
				$(this).removeClass('inactive').addClass('active');
				$(this).parent().children().eq(_current).removeClass('active').addClass('inactive');							
				//
				_conts.eq(_current).removeClass('active').addClass('inactive');
				_conts.eq(i).removeClass('inactive').addClass('active');
				//
				_height = _conts.eq(i).outerHeight();
				$('#content').css({'height':_height+'px'})
				//
				_current = i;		
			}
		}).hover(function(){
			if(i !== _current){
				//$(this).css({'background-position':'0 -63px'})	
			}
		},function(){
			if(i !== _current){
				//$(this).css({'background-position':'0 0'})	
			}
		})
	});
};



var initProduct = function(){
	var Parts = {
		itemCont:'#colItem'
	}	
	var Items = [];
	var Thumbs = [];
	var ItemAll = [];
	
	loadAjax = function(){
		var ajaxLoad = new AjaxLoad();
		ajaxLoad.url = 'product.json';
		ajaxLoad.successHandler = function(json){
			for (var i in json) {
				var obj = {};
				obj.title = json[i].title;
				obj.url = json[i].url;
				obj.thumb = 'product/camera/' + json[i].thumb;
				Thumbs.push(obj.thumb);
				obj.detail = json[i].detail;
				obj.category = json[i].category;
				Items[i] = obj;
				ItemAll.push(i);
			}
		};
		ajaxLoad.completeHandler = function(){
			var _imageLoader = new ImagesLoader();
			_imageLoader.list = Thumbs;
			_imageLoader.callBack = startAction();
			_imageLoader.init();
		};
		ajaxLoad.init();
	};
	
	startAction = function(){
		$('#loader').delay(300).fadeOut(400,function(){
			makeItem(ItemAll);
		});
		
	}
	
	checkItem = function(c,s){
		if(c == s){
			return true;
			
		}else{
			return false;
		}
	}
	checkRange = function(min,max,num){
		if(num > min && num <= max){
			return true;
		}else{
			false;
		}
	}
	
	makeItem = function(list){
		var _cont = $(Parts.itemCont);
		_cont.html('');
		_cont.css({'opacity':'0'});
		if(list.length <= 0){
				_cont.append('<p class="noItem">該当する製品がありません</p>')
		}else{
			var _colMax = 4;
			for(var i = 0; i < list.length; i++){
				var _n = list[i];
				var title = Items[_n].title; 
				var thumbUrl = Items[_n].thumb;
				var url = 'product/camera/'+Items[_n].url;
				var image = Items[_n].thumb;
				var detail = Items[_n].detail;
				var caption = Items[_n].detail[3].substr(0, 110);
				var thumb = '<div url="'+url+'" class="items item'+i+'"><dl><dt><img src="'+thumbUrl+'" alt=""></dt><dd>'+caption+'</dd></dl><div class="pName"><div class="middle"><h3>'+title+'</h3></div></div><ul><li class="interface">'+detail[0]+'</li><li class="fps">'+detail[1]+'</li><li class="pixel">'+detail[2]+'</li></ul></div>'
				_cont.append(thumb);
				if ((eval(i) + 1) % _colMax === 0) {
					 $('.item'+i).addClass('last');
				}
			}
			initItem();
		}
		$('#mask').css({'height':$(Parts.itemCont).outerHeight()+'px'}).fadeOut(400);
		_cont.css({'opacity':'1'});
	}
	
	
	
	sortItem = function(a){
		var matchNum = [];
		for(var i = 0; i < Items.length; i++){
			var _flag = [];
			for(var v = 0; v < a.length; v++){
				var _selected = OptionName[v][a[v]];
				if(_selected == 'all' || _selected == 0){
					_flag.push(true);
				}else{
					var _category = Items[i].category[v];
					if(typeof _category[0] == 'string'){	
						for (var e = 0; e < _category.length; e++) {
							if(checkItem(_category[e],_selected)){
								_flag.push(true)
							}else{
								//break;
							}											
						}
					}else{
						if(typeof(_selected) == 'number'){
							var _num = Items[i].category[v];
							var _max = _selected;
							var _min = OptionName[v][a[v]-1];
							var _limit = OptionName[v][OptionName[v].length-1];
							//console.log(_num+'/'+_min+'/'+_max+'/'+_limit);
							
							for(var j = 0; j < _num.length; j++){
								if(_max == _limit && _num[j] >= _limit){
									_flag.push(true);
									break;
								}else if(checkRange(_min,_max,_num[j])){
									_flag.push(true);
									break;
								}
							}
							/*
							if(_max == _limit && _num >= _limit){
								_flag.push(true);
							}else if(checkRange(_min,_max,_num)){
								_flag.push(true);
							}
							*/
						}
					}					
				}
				if(v == a.length-1){
					if(_flag.length == a.length){
						matchNum.push(i);
					}
				}
			}
		}
		return matchNum;
	};
	
	var OptionName = [[],[],[]];
	initOption = function(){
		$('#interf option').each(function(){
			OptionName[0].push($(this).val()); 
		})
		$('#fps option').each(function(){
			OptionName[1].push(Number($(this).val())); 
		})
		$('#pixel option').each(function(){
			OptionName[2].push(Number($(this).val())); 
		})
	};
	initOption();
	
	$('#sort').submit(function(){
		function checkOption(op,f){
			if(op < 1){
				return 'all';	
			}else{
				if(f){
					return Number(op);
				}else{
					return op;
				}
			}
		}
		/*
		var _a1 = checkOption($('#interf option:selected').index(),false);
		var _a2 = checkOption($('#fps option:selected').index(),true);
		var _a3 = checkOption($('#pixel option:selected').index(),true);
		*/
		var _a1 = $('#interf option:selected').index();
		var _a2 = $('#fps option:selected').index();
		var _a3 = $('#pixel option:selected').index();
		
		var _ar = [_a1,_a2,_a3]
		
		$('#mask').css({'height':$(Parts.itemCont).outerHeight()+'px'}).fadeIn(400,function(){
			makeItem(sortItem(_ar))
		});
		//sortItem(_ar);
	});
	
	
	loadAjax();
};