source: gs3-installations/mars/trunk/sites/mars/collect/amc-essentia/js/av_document.js@ 36963

var AMC_SONG_DURATION = 30;

var currentPosIsZero = true;
var currentPosRunup  = 0;


function AVEnsurePaused()
{
    if (!wavesurfer.backend.isPaused()) {   
    $('#ws-pause-icon').hide();
    $('#ws-play-icon' ).show();
    $('#ws-playpause-label').html("Play");
    }
    
    wavesurfer.pause();
}

function AVPlay()
{
    $('#ws-play-icon' ).hide();
    $('#ws-pause-icon').show();
    $('#ws-playpause-label').html("Pause");

    if (currentPosRunup>0) {
    var skip_amount = -1 * currentPosRunup;
    wavesurfer.skip(skip_amount);
    currentPosRunup = 0;    
    }
    
    wavesurfer.play();
    
}

function AVPlayPause()
{
    if (wavesurfer.backend.isPaused()) {
    AVPlay();
    }
    else {
    AVEnsurePaused();
    }
    
    //return wavesurfer.backend.isPaused() ? wavesurfer.play() : wavesurfer.pause();
}

function AVSeekTo(progressPos)
{
    wavesurfer.seekTo(progressPos);

    if (progressPos == 0) {
    recommendFromStart();
    }
}



/*                
    function playFromOffset(id,frameOffset) 
    {
      var msecOffset = 250 * frameOffset; 
      idElem = document.getElementById(id);
      pagePlayer.handleClick({target:idElem}); // fake a click 
      soundManager.stopAll();
      // soundManager.setPosition(id,5000); 
      soundManager.play(id,{position: msecOffset});
    }
    */
    
function preSubmit(form) 
{
    // Note, the Arousal and Valence feature window values used is:
    //   6 secs + 50% overlap
    // So the Weka computed AV values are spaced out:
    //   6s, 9s, 12s, ...
    
    // clamp to ensure >= 6.0 secs 
    var current_time = Math.max(6.0,wavesurfer.getCurrentTime());
    var current_time_1dp = current_time.toFixed(1);
    AVEnsurePaused();
    
    weka_segment = Math.round(current_time/3) * 3;
    form.elements["s1.offset"].value = weka_segment;
    
    var arousal_val = parseFloat($('#arousal-val').text());
    var valence_val = parseFloat($('#valence-val').text());

    $('#makeRecommendationFrom-AV').html(`(@${current_time_1dp} secs: arousal=${arousal_val}, valence=${valence_val})`);

    return submitAVRecommendation(form, arousal_val,valence_val, current_time);
}

function AVPlotRecommendations()
{
    var $av_recommendations = $('.AVRecommendation');

    var min_arousal_val = +1.0;
    var max_arousal_val = -1.0;

    var min_valence_val = +1.0;
    var max_valence_val = -1.0;

    $av_recommendations.each(function(index_unused) {
    var arousal_val = $(this).data("arousalval");
    var valence_val = $(this).data("valenceval");

    if (arousal_val < min_arousal_val) {
        min_arousal_val = arousal_val;
    }
    if (arousal_val > max_arousal_val) {
        max_arousal_val = arousal_val;
    }

    
    if (valence_val < min_valence_val) {
        min_valence_val = valence_val;
    }
    if (valence_val > max_valence_val) {
        max_valence_val = valence_val;
    }

    });

    console.log(`AVRecommendations Arousal limits: ${min_arousal_val} <-> ${max_arousal_val}`);
    console.log(`AVRecommendations Valence limits: ${min_valence_val} <-> ${max_valence_val}`);
    
}

function submitAVRecommendation(form, arousal_val,valence_val, current_time)
{
    form.elements["s1.arousal"].value = arousal_val;
    form.elements["s1.valence"].value = valence_val;
        
    var args = {
    "a":  "q",
    "rt": "rd",
    "s": "AudioQuery",
    "sa": "",
    "c":  gs.cgiParams["c"],
    "q":  gs.cgiParams["d"],
    "s1.query":       gs.cgiParams["d"],
    "s1.maxDocs":     form.elements["s1.maxDocs"].value,
    "s1.hitsPerPage": form.elements["s1.hitsPerPage"].value,
    "s1.offset":      form.elements["s1.offset"].value,
    "s1.length":      form.elements["s1.length"].value,
    "s1.arousal": arousal_val,
    "s1.valence": valence_val,
    "startPage": 1,
    "excerptid": "resultsArea"
    };

    
    var url = "https://mars.so-we-must-think.space/greenstone3/library";

    $('#recommendationArea').css("cursor","wait");
    $('#resultsAreaDiv').slideDown();
    $('#resultsAreaDiv').html("Retrieving recommendation ...");
    
    $.ajax({
    method: "GET",
    url: url,
    data: args
    })
    .always(function() {
        $('#recommendationArea').css("cursor","revert");
    })
    .fail(function(jqXHR,textStatus) {
        console.error( "Request failed: " + textStatus);
    })
    .done(function(html_result) {
        $('#resultsAreaDiv').html("<div>Recommendations:</div>"+html_result);
        $('#av-chart-div').show();

        AVPlotRecommendations();
        
        if (current_time) {
        const updated_url = new URL(window.location);
        updated_url.searchParams.set('p.frameOffset', current_time);
        //window.history.pushState({}, '', url + "?p.frameOffset=" + current_time);
        //window.history.pushState({}, '', updated_url);
        window.history.replaceState({}, '', updated_url);
        }
    });
    
    // stop submit
    return false;

    // force GET method request to go ahead
    //return true;
}



function recommendFromStart()
{    
    currentPosIsZero = true;
    $('#makeRecommendationFrom').html("Based on the start of this musical/sound art work: ");
}


function recommendFromPos()
{
    currentPosIsZero = false;
    $('#makeRecommendationFrom').html("Based on the current timeline position of this musical/sound art work: ");
}



function postInitWavesurfer(wavesurfer)
{
    console.log("postInitWavesurfer called with wavesufer = " + wavesurfer);
    
    wavesurfer.load(gs.variables.mp3url);
    
    wavesurfer.on('audioprocess', function () {
    var current_time = wavesurfer.getCurrentTime();
    var current_time_rounded = Math.round(current_time * 10) / 10
    var current_time_rounded = current_time.toFixed(1);
    $('#audioCurrentPos').html(current_time_rounded + " secs");
    
    if (current_time == 0) {
        recommendFromStart();
    }
    else if ((currentPosIsZero) && (current_time > 0)) {
        recommendFromPos();
    }
    });

    wavesurfer.on('ready', function () {

    console.log("**** wavesurfer ready()");
    
    if ('p_frameOffset' in gs.cgiParams) {
        var frameOffset = gs.cgiParams['p_frameOffset'];
        //console.log("**** starting play @ " + frameOffset);
        //wavesurfer.play(frameOffset);
        //console.log("**** setting play seek @ " + frameOffset);
        wavesurfer.seekTo(frameOffset/AMC_SONG_DURATION);

        console.log("av_document.js keeping 'currentPosRunup' at 0");
        /*if (frameOffset>1.0) {
        currentPosRunup = 1.0; // 1 second
        }*/
    }
    });

}

/*

y-top: 146

Centre: 412,443

y-bot:735

x-left: 120

x-right 710


Full image:
  911 x 825 pxs



  AV centre: 412,443
  
delta x/y: from centre: 292 <-> 298
-1 <-> 0 <-> +1
   295   295


SVG:

  241 x 248 
    scaled 
    0.26458

*/

var av_chart_orig_r = 295;

var av_chart_orig_x_org = 412;
var av_chart_orig_y_org = 443;

var av_chart_orig_x_dim = 911;
var av_chart_orig_y_dim = 825;

var av_chart_disp_x_dim = 300; // ****
var av_chart_disp_x_mid = av_chart_disp_x_dim/2.0;

var av_chart_scale = av_chart_orig_x_dim / av_chart_disp_x_dim;

function display_to_av_coord(disp_x,disp_y)
{
    var scaled_disp_x = disp_x * av_chart_scale;
    var scaled_disp_y = disp_y * av_chart_scale;

    var orig_av_x = scaled_disp_x - av_chart_orig_x_org; 
    var orig_av_y = -1 * (scaled_disp_y - av_chart_orig_y_org); // flip y axis

    var av_x = orig_av_x / av_chart_orig_r;
    var av_y = orig_av_y / av_chart_orig_r;
    
    var capped_av_x = Math.max(Math.min(av_x,1.0),-1.0);
    var capped_av_y = Math.max(Math.min(av_y,1.0),-1.0);

    return { "x": capped_av_x, "y": capped_av_y };
}

function av_chart_click(elem,e)
{
    var offset = $(elem).offset();

    var elem_x_org = offset.left;
    var elem_y_org = offset.top;

    var disp_x = e.pageX - elem_x_org;
    var disp_y = e.pageY - elem_y_org;

    /*
    var scaled_disp_x = disp_x * av_chart_scale;
    var scaled_disp_y = disp_y * av_chart_scale;

    var orig_av_x = scaled_disp_x - av_chart_orig_x_org; 
    var orig_av_y = -1 * (scaled_disp_y - av_chart_orig_y_org); // flip y axis

    var av_x = orig_av_x / av_chart_orig_r;
    var av_y = orig_av_y / av_chart_orig_r;
    
    var capped_av_x = Math.max(Math.min(av_x,1.0),-1.0);
    var capped_av_y = Math.max(Math.min(av_y,1.0),-1.0);
    */  

    av_coord = display_to_av_coord(disp_x,disp_y);
    var capped_av_x = av_coord.x;
    var capped_av_y = av_coord.y;
    
    console.log(`av x,y: (${capped_av_x},${capped_av_y})`);

    var form = $('#av-query-form')[0];
    
    submitAVRecommendation(form, capped_av_x, capped_av_y, null);
    
}

$(document).ready(function() {

    const doc_url = new URL(window.location);
    var renderWave = doc_url.searchParams.get('renderWave');

    if (renderWave && (renderWave == 1)) {
    // showing the waveform => offer link to spectrogram
    const sts_url = new URL(window.location);
    sts_url.searchParams.set('renderWave', 0);
    $('#switch-to-spectrogram').attr("href",sts_url);
    $('#switch-to-waveform').hide();

    $('#av-timelinebar-help').hide();
    }
    else {
    // show the spectrogram => offer link to waveform
    
    const stw_url = new URL(window.location);
    stw_url.searchParams.set('renderWave', 1);
    $('#switch-to-waveform').attr("href",stw_url);
    $('#switch-to-spectrogram').hide();

    $('#av-timelinebar-help').show();   
    }

    $('#av-chart-img').on("click",function(e) { av_chart_click(this,e) } );
});