var readImageDir = './ichange/images/';

onload = function() {
	httpObj = createXMLHttpRequest(showData) ;
	httpObj.open("GET", "./ichange/data.csv?t="+getUnixTime(), true) ;
	httpObj.send("") ;
}

function createXMLHttpRequest(cbFunc) {
	var XMLhttpObject = null ;
	try { XMLhttpObject = new XMLHttpRequest() ; }
	catch (e) {
		try { XMLhttpObject = new ActiveXObject("Msxml2.XMLHTTP") ; }
		catch (e) {
			try { XMLhttpObject = new ActiveXObject("Microsoft.XMLHTTP") ; }
			catch (e) { return null ; }
		}
	}
	if (XMLhttpObject) XMLhttpObject.onreadystatechange = cbFunc ;
	return XMLhttpObject ;
}

function showData() {
	if (httpObj.readyState == 4) {
		lineArray = createArray(httpObj.responseText);
		//fadeImage(lineArray);
		fadeImage();
		setInterval(fadeImage,7000);
	}
}


function createArray(txt){
	dataArray = txt.split("\n") ;
	lineArray = new Array();
	for(i in dataArray){
		if(dataArray[i].replace("/[\r\n]/","") != ""){
			lineArray[i] = dataArray[i].split("\t");
		}
	}
	return lineArray;
}

var lineArray;
var cnt = 0;

function fadeImage(){
	ownerObj = document.getElementById('fadeImage');
	imageFile = lineArray[cnt][1];
	comments = lineArray[cnt][2];
	
	var divElement = document.createElement('div');
		divElement.className = 'fadeDiv';
		//divElement.style.top = (cnt*30)+'px';
		//divElement.style.left = (cnt*30)+'px';
	var imgElement = document.createElement('img');
		imgElement.src = readImageDir+imageFile;
	var pElement = document.createElement('p');
		pElement.innerHTML = comments;
	
	divElement.appendChild(imgElement);
	divElement.appendChild(pElement);
	ownerObj.appendChild(divElement);
	
	cnt++;
	
	try{
		if(ownerObj.childNodes.length>2){
			var child = ownerObj.firstChild;
			ownerObj.removeChild(child);
		}
	}catch(e){
	}
	
	if((lineArray.length) == cnt){
		cnt = 0;
	}
	
	fadeElement(divElement,50,2,1);
}

/*
    対象の要素をフェードイン/アウトする
    element: 対象の要素オブジェクト
    interval: 透明度を変化させる間隔(ms)
    addition: 透明度を変化させる割合(%)
    fadeMode: 0=フェードアウト, 1=フェードイン
*/
function fadeElement(element,interval,addition,fadeMode)
{
    var count = 0;
    var callback = function()
    {
        // countが100を超えないようにする
        count = Math.min(count,100);
        var opacity = fadeMode ? count : 100-count;
        // Opera, Safari, Chrome, Firefox>=3.5
        element.style.opacity = opacity/100;
        // Firefox
        element.style.MozOpacity = opacity/100;
        // Internet Explorer
        element.style.filter = 'alpha(opacity='+opacity+')';
        if ( count<100 )
        {
            // countが100未満であれば
            // 加算
            count += addition;
            // setTimeoutに自身（関数オブジェクト）を指定
            setTimeout(callback,interval);
        }
    };
    callback();
}

function getUnixTime(){return parseInt((new Date)/1000);}