//CSVファイルを読み込む関数 getCSV()
function getCSV(){
	// XMLHttpRrequestオブジェクトを生成
    var csvfile = new XMLHttpRequest();
	// csvファイルのパスを指定し、データを開く
    csvfile.open("get", "http://keylopment.com/_cms/wp-content/themes/keylopment/docs/test_label_on.csv", true);
    csvfile.send(null); // HTTPリクエストの発行	
	// csvファイルを読み込んだら処理を実行
	csvfile.onload = function(){
		convertCSV(csvfile.responseText);
	}
}

//CSVファイルのデータを配列に変換する関数 convertCSV()
function convertCSV(csvdata){
	var resultdata = []; // データを入れるための配列
    var tmp = csvdata.split("\n"); // 改行を基準にデータを行ごとで配列化
    // 各行ごとにカンマで区切った文字列の配列データを生成
    for(var i = 0; i < tmp.length; i++){
        var tmpROW = tmp[i].split(',');
        if( tmpROW !== '' ){
            resultdata[i] = tmp[i].split(',');
        }
    }
    // 格納し終えた配列データを元に出力処理
    csvHTML(resultdata);
}

//変換した配列を元にHTML出力する関数 csvHTML()
function csvHTML(datalist){
	var outputHTML = '';
	if( datalist !== undefined ){
		// 最初にテーブルの開始タグを挿入
		outputHTML += '<table>';
		// 行のループ処理
		for( var i = 0; i < datalist.length; i++ ){
			// 最初の行ならばthead、2行目ならばtbodyの開始タグを挿入
			if( i == 0 ){
				outputHTML += '<thead>';
			}else if( i == 1 ){
				outputHTML += '<tbody>';
			}
			// trの開始タグを挿入
			outputHTML += '<tr>';
			// 1行ごとに列のループ処理
			for( var j = 0; j < datalist[i].length; j++ ){
			// 最初の行ならばth、2行目以降ならばtdのタグでデータを挿入
				if( i == 0 ){
					outputHTML += '<th scope="col">'+datalist[i][j]+'</th>';
				}else{
					if( j == 0 ){
						outputHTML += '<th scope="row">'+datalist[i][j]+'</th>';
					}else{
						outputHTML += '<td>'+datalist[i][j]+'</td>';
					}
				}
			}
			// trの閉じタグを挿入
			outputHTML += '</tr>';
			// 最初の行ならばthead、最後の行ならばtbodyの閉じタグを挿入
			if( i == 0 ){
				outputHTML += '</thead>';
			}else if( i == datalist.length - 1 ){
				outputHTML += '</tbody>';
			}
		}
		// 最後にテーブルの閉じタグを挿入
		outputHTML += '</table>';
		if( $('.outputcsv').length ){
			$('.outputcsv').html( outputHTML );
		}
	}
}

// csvファイルの読み込みを実行
getCSV();