var menuIds = ['menuBag', 'menuGoods', 'menuShoes', 'menuMens', 'menuCrocodile', 'menuAll'];
//var menuIds = ['menuBag', 'menuGoods', 'menuShoes', 'menuMens', 'menuAll'];
var currentCategory;
var currentPage;
//var baseUri = 'http://www.motomachi-kitamura.com';
var baseUri = '';
var getterShopUri = baseUri + '/bnumber/shop.php';
var imageDir = baseUri + '/img/upload';
var items;
var itemCountParPage = 12;

var initBackNumber = function() {
	currentPage = 1;
	currentCategory = 0;
	
	for (var i=0, len=menuIds.length; i<len; i++) {
		Event.observe($(menuIds[i]), 'click', function(event) { isClickedCategoryMenu(event); }, false);
		Element.setStyle($(menuIds[i]), {cursor : 'pointer'});
	}
	
	getBackNumberItem();
}

var getShopTop = function() {
	AjaxRequest.create({
		onSuccessFunc : loadTopShopItems,
		action        : 'top',
		uri           : getterShopUri
	}).get();
}

var loadTopShopItems= function(resource) {
	items = resource;
	var item = '';
	
	$('shopList').innerHTML = '';
	
	for (var i=0, len=items.length; i<len; i++) {
		item += '<dt class="pic"><a href="' + items[i].url  + '" target="_blank"><img src="' + imageDir + '/' + items[i].id + '.jpg" alt="掲載商品" width="60" height="60" border="0" /></a></dt>';
		item += '<dd class="date">' + items[i].date;
		if (items[i].icon == 1) item += '<img class="new" src="img/common_img/new_icon.gif" alt="NEW" width="30" height="12" /></dd>';
		else item += '</dd>';
		item += '<dd><a href="' + items[i].url  + '" target="_blank">' + items[i].text + '</a>';
		item += '<br class="clear" />';
		item += '</dd>';
		
		new Insertion.Bottom('shopList', item);
		item = '';
	}
}

var isClickedCategoryMenu = function(event) {
	var targetCategory = Event.element(event);
	
	if (targetCategory.id == 'menuBag') currentCategory = '1';
	if (targetCategory.id == 'menuGoods') currentCategory = '2';
	if (targetCategory.id == 'menuShoes') currentCategory = '3';
	if (targetCategory.id == 'menuMens') currentCategory = '4';
	if (targetCategory.id == 'menuCrocodile') currentCategory = '5';
	if (targetCategory.id == 'menuAll') currentCategory = '0';
	
	currentPage = 1;
	
	getBackNumberItem();
}

var isClickedPageNavi = function(event, key) {
	var target = Event.element(event);
	currentPage = parseInt(target.id.replace(new RegExp(key), ''));
	
	//loadBackNumberItems();
	getBackNumberItem();
}

var getBackNumberItem = function() {
	if (currentCategory == 0) action = 'all';
	else action = 'category';
	
	var offset = ((currentPage - 1) * itemCountParPage);
	//console.log(currentPage);
	//console.log(offset);
	
	AjaxRequest.create({
		onSuccessFunc : finishedResponseFetch,
		action        : action,
		limit         : itemCountParPage,
		offset        : (offset < 0) ? 0 : offset,
		category      : currentCategory,
		uri           : getterShopUri
	}).get();
}

var finishedResponseFetch = function(resource) {
	items = resource;
	loadBackNumberItems();
}

var loadBackNumberItems = function() {
	var currentProductcode = '';
	var listStart = 0;
	var listEnd = 0;
	var item = '';
	
	//listStart = (currentPage - 1) * itemCountParPage;
	//listStart = 0;
	//if ((listStart + itemCountParPage) > items.length) listEnd = items.length;
	//else listEnd = listStart + itemCountParPage;
	if ((itemCountParPage) > items.length) listEnd = items.length;
	else listEnd = itemCountParPage;
	
	//console.log('S: ' + listStart);
	//console.log('E: ' + listEnd);
	
	$('itemList').innerHTML = '';
	
	for (var i=listStart, len=listEnd; i<len; i++) {
		item += '<div class="itembox">';
		if (items[i].icon == 1) item += '<p class="date newitem">' + items[i].date + '</p>';
		else item += '<p class="date">' + items[i].date + '</p>';
		item += '<p><a href="' + items[i].url + '" target="_blank"><img src="' + imageDir + '/' + items[i].id + '.jpg" alt=" " width="60" height="60" border="0" /></a></p>';
		item += '<p class="' + getCategoryIcon(items[i].category)  + '"><a href="' + items[i].url + '" target="_blank">' + items[i].name + '</a></p>';
		item += '</div>';
		
		new Insertion.Bottom('itemList', item);
		item = '';
	}
	
	countEntry();
}

var getCategoryIcon = function(category) {
	var icons = ['iconbag', 'icongoods', 'iconshoes', 'iconmens', 'iconcrocodile'];
	return(icons[category - 1]);
}

var countEntry = function() {
	if (currentCategory == 0) action = 'all';
	else action = 'category';
	
	AjaxRequest.create({
		onSuccessFunc : showPageNavi,
		action        : 'count',
		category      : currentCategory,
		uri           : getterShopUri
	}).get();
}

var showPageNavi = function(resource) {
	var pageMax = 1;
	//var itemCount = items.length;
	//var itemCount = 100;
	var itemCount = resource[0].itemCount;
	var page = 0;
	var topNavi = '';
	var bottomNavi = '';
	var pageStart = 0;
	var pageEnd = 0;
	
	$('topPageNavi').innerHTML = '';
	$('bottomPageNavi').innerHTML = '';
	
	if (itemCount > itemCountParPage) {
		pageMax = Math.floor(itemCount / itemCountParPage);
		if ((itemCount % itemCountParPage) > 0) pageMax++;
	}
	
	// left arrow navi
	if (currentPage > 1) {
		page = currentPage - 1;
		new Insertion.Bottom('topPageNavi', '<img id="topLeftNaviArrow_' + page  + '" src="../../img/bn_goods_img/arrow_back_on.gif" alt="←" width="9" height="9" border="0" />');
		new Insertion.Bottom('bottomPageNavi', '<img id="bottomLeftNaviArrow_' + page  + '" src="../../img/bn_goods_img/arrow_back_on.gif" alt="←" width="9" height="9" border="0" />');
		Element.setStyle($('topLeftNaviArrow_' + page), {cursor : 'pointer'});
		Event.observe($('topLeftNaviArrow_' + page), 'click', function(event) { isClickedPageNavi(event, 'topLeftNaviArrow_'); }, false);
		Element.setStyle($('bottomLeftNaviArrow_' + page), {cursor : 'pointer'});
		Event.observe($('bottomLeftNaviArrow_' + page), 'click', function(event) { isClickedPageNavi(event, 'bottomLeftNaviArrow_'); }, false);
	}
	else {
		new Insertion.Bottom('topPageNavi', '<img src="../../img/bn_goods_img/arrow_back_off.gif" alt="←" width="9" height="9" border="0" />');
		new Insertion.Bottom('bottomPageNavi', '<img src="../../img/bn_goods_img/arrow_back_off.gif" alt="←" width="9" height="9" border="0" />');
	}
	
	// direct page number navi
	if ((currentPage % 4) == 0) {
		pageStart = currentPage - 3;
		pageEnd = currentPage + 1;
	}
	else {
		pageStart = currentPage - ((currentPage % 4) - 1);
		pageEnd = (currentPage + (4 - (currentPage % 4))) + 1;
	}
	
	if (pageEnd >= pageMax) pageEnd = pageMax; 
	
	//console.log('S: ' + pageStart);
	//console.log('E: ' + pageEnd);
	
	for (var p=pageStart, max=pageEnd; p<=max; p++) {
		if (p == currentPage) {
			new Insertion.Bottom('topPageNavi', '│ ' + p + ' ');
			new Insertion.Bottom('bottomPageNavi', '│ ' + p + ' ');
		}
		else {
			new Insertion.Bottom('topPageNavi', '│ <span id="topNavi_' + p + '" style="color:#5980AB; cursor:pointer;">' + p  + '</span>');
			new Insertion.Bottom('bottomPageNavi', '│ <span id="bottomNavi_' + p + '" style="color:#5980AB; cursor:pointer;">' + p  + '</span>');
			Event.observe($('topNavi_' + p), 'click', function(event) { isClickedPageNavi(event, 'topNavi_'); }, false);
			Event.observe($('bottomNavi_' + p), 'click', function(event) { isClickedPageNavi(event, 'bottomNavi_'); }, false);
		}
	}
	
	if ((pageMax - pageEnd) > 1) {
		new Insertion.Bottom('topPageNavi', '│・・・ │ <span id="topNavi_' + pageMax + '" style="color:#5980AB; cursor:pointer;">' + pageMax  + '</span>');
		new Insertion.Bottom('bottomPageNavi', '│・・・ │ <span id="bottomNavi_' + pageMax + '" style="color:#5980AB; cursor:pointer;">' + pageMax  + '</span>');
		Event.observe($('topNavi_' + pageMax), 'click', function(event) { isClickedPageNavi(event, 'topNavi_'); }, false);
		Event.observe($('bottomNavi_' + pageMax), 'click', function(event) { isClickedPageNavi(event, 'bottomNavi_'); }, false);
	}
	
	new Insertion.Bottom('topPageNavi', ' ｜ ');
	new Insertion.Bottom('bottomPageNavi', ' ｜ ');
	
	// right arrow navi
	if (pageMax > 1 && currentPage < pageMax) {
		page = currentPage + 1;
		new Insertion.Bottom('topPageNavi', '<img id="topRightNaviArrow_' + page  + '" src="../../img/bn_goods_img/arrow_next_on.gif" alt="→" width="9" height="9" border="0" />');
		new Insertion.Bottom('bottomPageNavi', '<img id="bottomRightNaviArrow_' + page  + '" src="../../img/bn_goods_img/arrow_next_on.gif" alt="→" width="9" height="9" border="0" />');
		Element.setStyle($('topRightNaviArrow_' + page), {cursor : 'pointer'});
		Event.observe($('topRightNaviArrow_' + page), 'click', function(event) { isClickedPageNavi(event, 'topRightNaviArrow_'); }, false);
		Element.setStyle($('bottomRightNaviArrow_' + page), {cursor : 'pointer'});
		Event.observe($('bottomRightNaviArrow_' + page), 'click', function(event) { isClickedPageNavi(event, 'bottomRightNaviArrow_'); }, false);
	}
	else {
		new Insertion.Bottom('topPageNavi', '<img src="../../img/bn_goods_img/arrow_next_off.gif" alt="→" width="9" height="9" border="0" />');
		new Insertion.Bottom('bottomPageNavi', '<img src="../../img/bn_goods_img/arrow_next_off.gif" alt="→" width="9" height="9" border="0" />');
	}
}

var getQuery = function(){
	if(location.search.length > 1) {
		var get = new Object();
		var ret = location.search.substr(1).split("&");
		
		for(var i=0; i<ret.length; i++) {
			var r = ret[i].split("=");
			get[r[0]] = r[1];
		}
		
		return get;
	} else {
		return false;
	}
}