// CSVファイル読み込み
function csvToArray(path) {
    var csvData = new Array();
    var data = new XMLHttpRequest();        
    data.open("GET", path, false);
    data.send(null);
    var LF = String.fromCharCode(10);
    var lines = data.responseText.split(LF);
    for (var i = 0; i < lines.length;++i) {
        var cells = lines[i].split(",");
        if( cells.length != 1 ) {
            csvData.push(cells);
        }
    }
    return csvData;
}

var arrayToMap = (function () {
    function mapfn (values) {
        for (var i = 0, l = this.length, obj = Object.create(null); i < l; ++i) {
            if (values.hasOwnProperty(i)) {
                obj[this[i]] = values[i];
            }
        } 
        return obj;
    }
    return function arrayToMap (array, keys) {
        return array.map(mapfn, keys);
    }
}());

var data = csvToArray("audio/music.csv");
var keys = ['name','url','hint','singer','answer']
var fileList = arrayToMap(data, keys);
// 曲リストの連想配列確認用Log
console.log(JSON.stringify(fileList));
//console.log(fileList.length)



var audioObj = new Audio();
var playFlag = false;

var playList = '<table>' + '<tr>' +'<th>' +fileList[0].name+ '</th>'+ '<th>' +fileList[0].hint+ '</th>'+ '</tr>';

for(var i=1; i<fileList.length; ++i){
    playList += '<tr>';
    playList += '<td class="name" onclick=start_music("'+fileList[i].singer+'","'+i+'","'+fileList[i].name+'","audio/'+fileList[i].url+'","'+fileList[i].answer+'")>';
    playList += '問題' + i + '</td>';
    playList += '<td>' +fileList[i].hint + '</td>';
    playList += '</tr>'
};
playList += '</table>';

document.getElementById('playListArea').innerHTML = playList;

// 再生開始
function start_music(singer, num, name ,url, answer){
    //console.log(singer);
    //console.log(num);
    //console.log(name);
    //console.log(url);
    //console.log(answer);
    audioObj.pause(); // これがないと以前の音楽は停止しない
    audioObj = new Audio(url);
    audioObj.play();
    audioObj.addEventListener('timeupdate', function(){
        var sec = '0' + Math.floor(audioObj.currentTime % 60);  // 秒数
        var min = '0' + Math.floor(audioObj.currentTime / 60);  // 分数
        sec = sec.substr(sec.length-2, 2);
        min = min.substr(min.length-2, 2);
        var totalSec = '0' + Math.floor(audioObj.duration % 60);    // 秒数
        var totalMin = '0' + Math.floor(audioObj.duration / 60);    // 分数
        totalSec = totalSec.substr(totalSec.length-2, 2);
        totalMin = totalMin.substr(totalMin.length-2, 2);
        crtTime.innerHTML = min+":"+sec+' ['+ totalMin+':'+totalSec +']';
    }, true);
    playFlag = true;    // 再生フラグ：再生中にする
    
    document.getElementById('answer').outerHTML='<button type="button" id="answer" class="answer" onclick=answerMusic("'+singer+'","'+num+'","'+name+'","'+answer+'")></button>';
    
}


// イベント設定
var crtTime = document.getElementById('ctime');

// 曲の再生
function start(){
    playFlag = true;
    audioObj.play();
}

// 曲の停止
function stop(){
    playFlag = false;
    audioObj.pause();
}

// サビから流す(答え合わせ)
function answerMusic(singer, num, name, time){
    var musicName = document.getElementsByClassName('name');
    //console.log(musicName);
    //console.log(num);
    //console.log(musicName[num]);
    //console.log(singer);

    playFlag = false;
    audioObj.pause();
    audioObj.currentTime=time;
    audioObj.play();
    //console.log(audioObj.currentTime);
    musicName[num-1].innerHTML = name + '<span class = "balloon">歌手:' +singer+ '</span>';
    console.log(musicName[num-1].innerHTML);
};