// JavaScript Document
var ie = (function(){
    var undef,
        v = 3,
        div = document.createElement('div'),
        all = div.getElementsByTagName('i');
 
    while (
        div.innerHTML = '<!--[if gt IE ' + (++v) + ']><i></i><![endif]-->',
        all[0]
    );
 
    return v > 4 ? v : undef;
 
}());

var searchStatus = '';
var runningStatus = false;

$(document).ready(function() {
	$('.search input[name="keyword"]').val('Model / Product Highlight');
	$('.search input[name="keyword"]').bind('keyup', searchProductTimeout);
	$('.search input[name="keyword"]').bind('click', keywordDeflaut);
	$('.search input[name="keyword"]').bind('blur', keywordDeflaut);
	$('#searchBox .searchResult .arrow-up a').bind('click', searchUp);
	$('#searchBox .searchResult .arrow-down a').bind('click', searchDown);
})

function keywordDeflaut() {
	var value = $(this).val();
	if (value == '') {
		$(this).val('Model / Product Highlight')
		$(this).css({color:'#AAA'});
	}
	else if (value == 'Model / Product Highlight') {
		$(this).val('')
		$(this).css({color:'#000'});
	}
}

function searchUp() {
	if (runningStatus || $(this).hasClass('active'))
		return false;
	runningStatus = true;
	var obj = $(this);
	$('#searchBox .searchResult .searchCon .items').animate({top:'+=54'},500,function() {
		$('#searchBox .searchResult .arrow-down a.active').removeClass('active');
		if ($('#searchBox .searchResult .searchCon .items').position().top == 0) {
			obj.addClass('active');
		}
		runningStatus = false;
	});
}

function searchDown() {
	if (runningStatus || $(this).hasClass('active'))
		return false;
	runningStatus = true;
	var obj = $(this);
	var total = $('#searchBox .searchResult .searchCon .items .item').length;
	var maxTop = 0-((total-10)*54);
	$('#searchBox .searchResult .searchCon .items').animate({top:'-=54'},500,function() {
		$('#searchBox .searchResult .arrow-up a.active').removeClass('active');
		if ($('#searchBox .searchResult .searchCon .items').position().top < maxTop) {
			obj.addClass('active');
		}
		runningStatus = false;
	});
}

function searchProductTimeout() {
	try {
		clearTimeout(searchStatus);
	}
	catch(e) {};
	searchStatus = setTimeout(searchProduct, 1000, $(this));
}

function searchProduct(_obj) {
	var keyword = _obj.val();
	if (keyword.length < 1 || keyword == 'Model / Product Highlight') {
		$('#searchBox .searchResult .searchAll:visible').hide('blind',500);
		return false;
	}
	$('#searchBox .searchResult .searchAll:visible').hide('blind',500);
	$('#searchBox .searchResult .searchCon .items').css({top:0});
	$('#searchBox .searchResult .searchCon .items').html('');
	$('#searchBox .searchResult .arrow-up a').addClass('active');
	$('#searchBox .searchResult .arrow-down a.active').removeClass('active');
	$('#searchBox .searchResult .searchCon').css({height:486});
	$.ajax({
          type: "POST",
          url: '/product/search',
          data: {keyword:keyword},
		  dataType: 'json',
          success: function(data) {
		  	  var product = data.product;
			  var total = product.length;
			  if (total < 10) {
				  $('#searchBox .searchResult .searchCon').css({height:total*54});
				  $('#searchBox .searchResult .arrow-down a').addClass('active');
			  }
			  
			  var clone;
			  
			  for (i = 0; i < total; i++) {
				  clone = $('#cloneItem').clone();
				  clone.find('a').html('Model: '+product[i]['model_no']+'<br />'+product[i]['highlight']);
				  clone.find('a').attr('href','/product/detail/product-id/'+product[i]['id']);
				  $('#searchBox .searchResult .searchCon .items').append(clone.html());
			  }
			  
			  if (total < 1) {
				  clone = $('#cloneItem').clone();
				  clone.find('a').html('No Result');
				  $('#searchBox .searchResult .searchCon .items').append(clone.html());
				  $('#searchBox .searchResult .searchCon').css({height:54});
				  $('#searchBox .searchResult .arrow-up a').addClass('active');
				  $('#searchBox .searchResult .arrow-down a').addClass('active');
			  }
			  
			  $('#searchBox .searchResult .searchAll').show('blind',500);
          },
		  error: function(msg) {
		  	  alert('Server error!');
		  }
    });
}
