// 単にPCの音声合成製品を発声させるだけならこちら true, ブラウザを実行している機器で再生するなら false
var playswitch  = false;
var headers     = new Headers();
var fetchopt    = { mode: 'cors', credentials: 'include' };
var id          = "SeikaServerUser";
var pass        = "SeikaServerPassword";
var url         = "http://192.168.1.100:7180";
var sampleRate  = 8000;
var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
var paramJson;

function initcode()
{
    headers.set('Authorization', 'Basic ' +  btoa(unescape(encodeURIComponent( id + ":" + pass ))) );
    headers.set('Content-Type',  'application/json');
    fetchopt.headers = headers;
    document.getElementById('cid').addEventListener('change',MakeEffectPanel);
    document.getElementById('btn').addEventListener('click',Talk);
}

function MakeTalkParam()
{
    var body = {};

    body.talktext = document.getElementById('talktext').value;
    body.effects   = {};
    for(let propName in paramJson.effect)
    {
        body.effects[propName] = parseFloat(document.getElementById(propName).value);
    }
    if ("emotion" in paramJson)
    {
        body.emotions = {};
        for(let propName in paramJson.emotion)
        {
            body.emotions[propName] = parseFloat(document.getElementById(propName).value);
        }
    }

    return body;
}

async function Talk()
{
    var cid = document.getElementById('cid');
    var btn = document.getElementById('btn');

    fetchopt.method  = 'POST';
    fetchopt.body    = JSON.stringify(MakeTalkParam());
    btn.disabled = true;

    if (playswitch)
    {
        const res  = await fetch(url + "/PLAY2/" + cid.options[cid.selectedIndex].value , fetchopt);
        const json = await res.json();
    }
    else
    {
      const res  = await fetch(url + "/SAVE2/" + cid.options[cid.selectedIndex].value + "/" + sampleRate , fetchopt);
      const wavbuff = await res.arrayBuffer();
      var audioBuffer = await audioCtx.decodeAudioData(wavbuff);
      var source = audioCtx.createBufferSource();
      source.buffer = audioBuffer;
      source.loop      = false;
      source.loopStart = false;
      source.loopEnd   = audioBuffer.duration;
      source.connect(audioCtx.destination);
      source.start(0);
    }

    btn.disabled = false;
}

async function MakeAvatorList()
{
    fetchopt.method  = 'GET';
    fetchopt.body    = null;
    const res  = await fetch(url+"/AVATOR2", fetchopt);
    const json = await res.json();

    var sel = document.getElementById('cid');
    sel.disabled = true;
    for(let idx=0; idx<json.length; idx++)
    {
         sel.options.add( new Option( json[idx].cid + ' : ' + json[idx].name, json[idx].cid ) );
    }
    sel.disabled = false;
    MakeEffectPanel();
}

async function MakeEffectPanel()
{
    var sel = document.getElementById('cid');
    var cid = sel.options[sel.selectedIndex].value;
    fetchopt.method  = 'GET';
    fetchopt.body    = null;
    const res  = await fetch(url+"/AVATOR2/"+cid, fetchopt);
    paramJson = await res.json();

    var p300 = document.getElementById('p300');
    var s    = p300.childNodes.length;
    for(let idx=0; idx < s; idx++)
    {
        p300.removeChild(p300.firstChild);
    }

    for(let propName in paramJson.effect)
    {
        var item = paramJson.effect[propName];
        var p1 = document.createTextNode(propName + ': ');
        var p2 = document.createElement('input');
        var p3 = document.createTextNode(' range ' + item.min + ' ～ ' + item.max + ', step ' + item.step);
        var p4 = document.createElement('br');
        p300.appendChild(p1);
        p300.appendChild(p2);
        p2.value = item.value;
        p2.id = propName;
        p300.appendChild(p3);
        p300.appendChild(p4);
    }

    for(let propName in paramJson.emotion)
    {
        var item = paramJson.emotion[propName];
        var p1 = document.createTextNode(propName + ': ');
        var p2 = document.createElement('input');
        var p3 = document.createTextNode(' range ' + item.min + ' ～ ' + item.max + ', step ' + item.step);
        var p4 = document.createElement('br');
        p300.appendChild(p1);
        p300.appendChild(p2);
        p2.value = item.value;
        p2.id = propName;
        p300.appendChild(p3);
        p300.appendChild(p4);
    }
}