var UA = navigator.userAgent.toUpperCase();
var AN = navigator.appName.toUpperCase();
// OS
var isMac  = (UA.indexOf("MAC") != -1) ? true : false;
var isWin  = (UA.indexOf("WIN") != -1) ? true : false;
var isUnix = (UA.indexOf("X11") != -1) ? true : false;
// Browser
var isSafari = (UA.indexOf("SAFARI") != -1) ? true : false;
var isOpera  = (AN.indexOf("OPERA") != -1) ? true : false;
var isFF  = (UA.indexOf("FIREFOX") != -1) ? true : false;
var isNN  = (UA.indexOf("NETSCAPE") != -1) ? true : false;
var isIE  = (UA.indexOf("MSIE") != -1) ? true : false;

//-----------------------------------------------------------
var P_ID         = 0;
var P_NAME       = 1;
var P_DETAIL_NUM = 2;
var P_NEW        = 3;
var P_CATEGORY   = 4;

var categoryList = ["cleaner","headphone","carry","rack","car","limited"];
var browse = new BrowseManager();
var csv = new CSV();

var csvs;
var categoryCount;

var items;
var dispmax = 8;
var pagesize;
var pagenum = 0;
var csvpath = "../../_script/get_csv.php?r="+((Math.random()*100)>>0)+"&type=";
var imgdir = "../../_data/_img/";
var category;
var categoryTitle;
var initItem;

var btnNext = '<a href="javascript:pageNavi(\'next\');"><img src="_img/next.gif" alt="" class="next" /></a>';
var btnBack = '<a href="javascript:pageNavi(\'back\');"><img src="_img/back.gif" alt="" class="back" /></a>';

function initialize(cat) {
	category = cat;
	categoryTitle = category.toUpperCase();
	
	initItem = browse.getParams();
	
	if (cat == "new") {
		newProductInit();
	} else {
		defaultProductInit(cat);
	}
}

function defaultProductInit(cat) {
	csv.useParse("," , "\r\n");
	csv.onLoad = onLoadInitDefault;
	csv.load(csvpath+category);
}

function newProductInit() {
	items = new Array();
	csvs = new Array();
	categoryCount = 0;
	
	for (var i=0; i<categoryList.length; i++) {
		csvs[i] = new CSV();
		csvs[i].useParse("," , "\r\n");
		csvs[i].onLoad = onLoadInitNew;
	}
	csvs[0].load(csvpath+categoryList[0]);
}

function onLoadInitNew(res) {
	res = res||[];
	var catDir = categoryList[categoryCount];
	
	for (var i=0; i<res.length; i++) {
		if (res[i][P_NEW]=="new") {
			res[i][P_CATEGORY] = catDir;
			items.push(res[i]);
		}
	}
  ++categoryCount;
	
	if (categoryCount < categoryList.length) {
    csvs[categoryCount].load(csvpath+categoryList[categoryCount]);
	} else {
		csvs = undefined;
		showInitContent();
	}
}

function onLoadInitDefault(res) {
	items = res;
	showInitContent();
}

function showInitContent() {
	
	pagesize = Math.ceil(items.length/dispmax)-1;
	
	if(initItem) {
		var pageObj = calcPage();
		pagenum = pageObj.page;
		initItem = pageObj.index;
	}
	
	showProducts();
	showPageNavi();
	
	if(initItem != null) {
		showWin(initItem);
	}
	
	if (isNN) createAncher();
}

function calcPage() {
	var size = items.length;
	var page = -1;
	for (var i=0; i<size; i++) {
		if (i%dispmax==0) page++;
		if (items[i][P_ID] == initItem) {
			return {page:page,index:i%dispmax};
		}
	}
	return {page:0,index:null};
}

function showProducts() {
	var tmp = new Array();
	var offset = dispmax*pagenum;
	var max = Math.min(offset+dispmax, items.length);
	
	for (var i=offset ; i<max ; i++) {
		tmp.push(items[i]);
	}
	insertProduct(tmp);
}

function swapImage(obj, type, isNew) {
	var gif = (type==1)?((isNew==1)?"new":category)+"_on":((isNew==1)?"new_":"")+"off";
	obj.src = "../_img/"+gif+".gif";
}

function createProduct(i, item) {
	var id = "p0"+(i+1);
	var isNew = (item[P_NEW]!="")?1:0;
	var imgpath = imgdir+((item[P_CATEGORY]?item[P_CATEGORY]:category))+"/";
	var str = '';
	
	if (item.length>0) {
		var atagevent = 'href="#'+item[P_ID]+'" onClick="showWin(\''+i+'\');" onmouseover="swapImage('+id+',1,'+isNew+')" onmouseout="swapImage('+id+',2,'+isNew+')"';
		str  = '<div class="photo" style="background-image:url('+imgpath+item[P_ID]+'/img.jpg)">';
		str += '<a '+atagevent+'>';
		str += '<img src="../_img/'+((isNew==1)?"new_":"")+'off.gif" name="'+id+'" alt="'+categoryTitle+' / '+item[P_ID]+' / '+item[P_NAME]+'" /></a></div>';
		str += '<a '+atagevent+' class="bold '+category+'">'+item[P_ID]+'<br />'+item[P_NAME]+'</a>';
	} else {
		str = '<div class="photo"><img src="../_img/off.gif" /></div>';
	}
	$(id).innerHTML = str;
}

function pageNavi(type) {
	switch (type) {
		case 'next': ++pagenum; break;
		case 'back': --pagenum; break;
	}
	showProducts();
	showPageNavi();
}

function showPageNavi() {
	var navi = (pagenum+1)+"/"+(pagesize+1);//'<img src="_img/page1.gif" alt="" class="" />';
	if (pagenum<pagesize) navi+=btnNext;
	if (pagenum>0)navi=btnBack+navi;
	$("page-navi").innerHTML = navi;
}

function insertProduct(arr) {
	for (var i=0; i<dispmax; i++) {
		createProduct(i, arr[i]?arr[i]:[]);
	}
}

function createAncher() {
	var dumm = "";
	for (var i=0; i<items.length ; i++) {
		dumm += "<a name='"+items[i][P_ID]+"'></a>"
	}
	$("dumm").innerHTML = dumm;
}

//-----------------------------------------------------------
var dialogs = {};
var idx = 0;
var xidx = 0;
var cascade = 0;
var cOffset = 23;
var cWins = new Array();
var winNum = 0;
var intervalID;

function showWin(i) {
  clearInterval(intervalID);
	var item = items[dispmax*pagenum+(i>>0)];
	var title = (item[P_CATEGORY]?item[P_CATEGORY].toUpperCase():categoryTitle)+' / '+item[P_ID]+' / '+item[P_NAME].replace("<br />", "");
	var id = 'dialog'+xidx;
	
	var posTop  = (cWins.length*3);
	var posLeft = (cWins.length*3);
	
	foo = new Window('dialog'+xidx, {className: "dialog", title: title, top:posTop, left:posLeft, width:633, height:418, zIndex:100+xidx, opacity:1, resizable: false, xurl:''});
	dialogs[id] = {win:foo, idx:0, max:item[P_DETAIL_NUM], dir:(item[P_CATEGORY]?item[P_CATEGORY]:category)+"/"+item[P_ID]+"/"};
	
    foo.show();
    foo.toFront();
    
    cascade++;
    idx++;
    xidx++;
	cWins.push(foo);
	winNum++;
  showDetailImage(id);
}



function showDetailImage(id) {
	var obj = dialogs[id];
	obj.idx++;
	if (obj.idx > obj.max) obj.idx=1;
	//obj.win.getContent().innerHTML='<img src="../../_data/_img/'+obj.dir+"img"+obj.idx+'.jpg" class="m_t_10" width="612" height="400" />';
	var detailImagePath = '../../_data/_img/'+obj.dir+"img"+obj.idx+'.jpg';
  var dummyPath = "../_img/dummy.gif";
  
  var imageID = "detail_image"+idx;
  obj.win.getContent().innerHTML='<img src="'+dummyPath+'" class="m_t_10" width="612" height="400" id="'+imageID+'" />';
	$(id+"_page").innerHTML=obj.idx+"/"+obj.max;
  
  var isImageError = false;
  $(imageID).onerror = function() {
    isImageError = true;
  };
  
  function func() {
    $(imageID).src = detailImagePath;
    clearInterval(intervalID);
    if (!$(imageID).complete) {
      intervalID = setInterval(func, 100);
    }
    if (isImageError) {
      clearInterval(intervalID);
      $(imageID).src = dummyPath;
    }
  };
  
  if (!isSafari) func();
  else $(imageID).src = detailImagePath;
}

function closeAll() {
    var x = 0;
    var lag=250;
	for(var i=(cWins.length-1);  i>=0;  i--) {
	  setTimeout('cWins['+i+'].hide()',(x*lag));
	  x++;
	}
	setTimeout('cWins.length=0; idx=0; cascade=0;',x*lag);
}