(function($){
	var $productSort = $(".js-product_sort");
	var $sortPanel = $productSort.find('.product-sort_panel');
	var $btnSortList = $sortPanel.find('.btn-sort li');
	var $sortField = $('.sortfield');
	var $sortItem = $sortField.find('.mod-productLineUp2_item');
	var $btnRest = $('.js-btn_sort-reset');
	function init() {
		
		if($productSort.length > 0){
			setup();
		}
	}


	function setup(){
		var sortData = [];
		$btnSortList.each(function(){
			var getLabel = $(this).text();
			var getValue = $(this).find('a').attr('href').replace('#', '');
			sortData.push(getValue + ':' + getLabel);
		});
		$sortPanel.append(_setPulldown(sortData));
		setEvent();
	}

	function setEvent() {
		$btnSortList.on('click', _sortAction);
		$btnRest.on('click', _sortReset);
		$('.js-sp-pulldown_sort select').on('change', _spSortAction);
	}

	function _sortAction() {
		var $aTag = $(this).find('a');
		var getSortData = $aTag.attr('href').replace('#', '');
		$btnSortList.find('a').removeClass('is-active');
		$aTag.addClass('is-active');
		_syncUi(getSortData);
		//var getIdArray = [];
		_sortLogicAction(getSortData);
	}

	function _spSortAction() {
		//var getIdArray = [];
		var getValue = $(this).val();
		_syncUi(getValue);		
		if(getValue === 'reset'){
			_sortReset();
		}else{
			_sortLogicAction(getValue);
		} 
	}

	function _sortLogicAction(value){
		var getIdArray = [];
		$sortItem.fadeOut().each(function(i){
			var getSortTag = $(this).attr('data-sorttag');

			if(getSortTag.indexOf(',') !== -1){
				var sortTagArray = getSortTag.split(',');
				for(var m=0,c=sortTagArray.length; i<c; i++){
					if(sortTagArray[m] === value){
						getIdArray.push($(this).attr('id'));
					}
				}	
			}else{
				if(getSortTag === value){
					getIdArray.push($(this).attr('id'));
				}
			}
		});
		setTimeout(function(){
			for(var x=0,s=getIdArray.length; x<s; x++){
				$('#' + getIdArray[x]).fadeIn();
			}
		}, 300);
	}

	function _sortReset() {
		$sortItem.stop().fadeIn();
		$btnSortList.find('a').removeClass('is-active');
	}

	function _syncUi(value) {
		//PC ui
		$btnSortList.find('a').each(function(){
			var getValue = $(this).attr('href').replace('#', '');
			if(value === getValue){
				$btnSortList.find('a').removeClass('is-active');
				$(this).addClass('is-active');
			}
		});

		//SP ui
		$('.js-sp-pulldown_sort select').val(value);

	}

	function _setPulldown(sortArray){
		var tmpl = '<div class="ui-sp-pulldown_sort js-sp-pulldown_sort">';
		tmpl += '<select>';
		tmpl += '<option value="reset">選択してください</option>';
		for(var i=0,v=sortArray.length; i<v; i++){
			var data = sortArray[i].split(':');
			tmpl += '<option value="' + data[0] + '">' + data[1] + '</option>';
		}
		tmpl += '</select>';
		tmpl += '</div>';
		return tmpl;
	}

	init();

})(BROTHER.lib.$);