source: gs3-extensions/audioDB/trunk/src/interface/js/similarity-matrix-play.js@ 26291

// Audio objects
var baseSong;
var leftSong;
var rightSong;

var pannedPlayback = new Audio();

var leftBuffers = [];
var rightBuffers = [];

var leftStartTimeSecs  = 0.0;
var rightStartTimeSecs = 0.0;
var leftStartTimeOffset  = 0;
var rightStartTimeOffset = 0;

var playTrackerMode = "stopped";

var startPlayX;
var startPlayY;

var pannedPlayWidth;
var pannedPlayHeight;

var prevPlayedX = -1;
var prevPlayedY = -1;

//var prevPlayedOffset = -1;

var preparingDualAudio = 0;

function resetAudioBuffers()
{
    //console.log("Panned audio playback buffers initialized/reset");

    pannedPlayback = new Audio();
    pannedPlayback.mozSetup(2, baseSong.mozSampleRate);

    leftBuffers = [];
    rightBuffers = [];

    leftStartTimeSecs  = 0.0;
    rightStartTimeSecs = 0.0;
    leftStartTimeOffset  = 0;
    rightStartTimeOffset = 0;

    prevPlayedX = -1;
    prevPlayedY = -1;

    // prevPlayedOffset = -1;
}



function dualPlay(evt) 
{
    var mouse_x = evt.pageX;
    var mouse_y = evt.pageY;

    // display busy/loading cursor
    var playTrackerBusy = document.getElementById("playtrackerBusy");
    playTrackerBusy.setAttribute("style","visibility: visible;");
    preparingDualAudio = 1;

    var selfSimImg = document.getElementById("selfSimImgId");
    var imgWidth   = selfSimImg.getAttribute("width");
    var imgHeight  = selfSimImg.getAttribute("height") * yScaleSimImg;
    
    //console.log("image w x h = " + imgWidth +"," + imgHeight);

    var img_x = $("#selfSimImgId").offset().left;
    var img_y = $("#selfSimImgId").offset().top;
   
    var x_org = mouse_x - img_x;
    var y_org = mouse_y - img_y;
    var adjusted_y_org = imgHeight - y_org;
    
    //console.log("img (x y) = (" + img_x + "," + img_y + ")");
    //console.log("mouse (x y) = (" + mouse_x + "," + mouse_y + ")");
    //console.log("(x y) = (" + x_org + "," + adjusted_y_org + ")");

    startPlayX = x_org;
    startPlayY = y_org;

    pannedPlayWidth  = imgWidth - x_org;
    pannedPlayHeight = y_org;

    resetAudioBuffers();

    var baseSongSrc="sites/localsite/collect/" + collect +"/import/"+source;

    leftStartTimeSecs  = duration * (x_org / imgWidth);
    rightStartTimeSecs = duration * (adjusted_y_org / imgHeight);

    var sampleMult = baseSong.mozSampleRate * baseSong.mozChannels;
    leftStartTimeOffset  = leftStartTimeSecs * sampleMult;
    rightStartTimeOffset = rightStartTimeSecs * sampleMult;

    //leftSong.src  = baseSongSrc + "#t=" + leftStartTimeSecs + ",";
    //rightSong.src = baseSongSrc + "#t=" + rightStartTimeSecs + ",";

    leftSong.currentTime = leftStartTimeSecs;
    leftSong.play();

    rightSong.currentTime = rightStartTimeSecs;
    rightSong.play();

    // console.log("play tracker mode = " + playTrackerMode);
    if (togglePlayMode.match("pause")) {
    // i.e. currently displaying the pause button
    // stop
    if (playTrackerMode.match("stopped")) {
        // => playing through the main play bar
        soundManager.stopAll();
        togglePlayVisual(document.getElementById("mainPlayButton"));
    }
    }

    if (!playTrackerMode.match("playing")) {
    togglePlayVisual(document.getElementById("mainPlayButton"));
    }
}


function playTrackerOn(evt) 
{
    var playTracker = document.getElementById("playtracker");
    playTrackerMove(evt);
    playTracker.setAttribute("style","visibility: visible");
}

function playTrackerOff(evt) 
{    
    var playTracker = document.getElementById("playtracker");
    playTracker.setAttribute("style","visibility: hidden");
}

function updateLeftAndRightTimes(cx,cy)
{
    var selfSimImg = document.getElementById("selfSimImgId");
    var imgWidth  = selfSimImg.getAttribute("width");
    var imgHeight = selfSimImg.getAttribute("height") * yScaleSimImg;

    var adjusted_cy = imgHeight - cy;

    //var mysong = document.getElementById("mysong");
    //var barWidth = mysong.getElementWidth();


    // update L & R times on tracker
    var currPlayedXInSecs = (cx/imgWidth) * duration;
    var currPlayedYInSecs = (adjusted_cy/imgHeight) * duration;

    // Deliberately crossed to fit visual playTracker circlea 

    var leftTime = document.getElementById("leftTime");
    var leftText = "R: " + currPlayedXInSecs.toFixed(0) + " secs"; 
    // (used to do 1 decimal place)

    leftTextNode = leftTime.childNodes[0];
    leftTextNode.nodeValue = leftText;

    var rightTime = document.getElementById("rightTime");
    var rightText = "L: " + currPlayedYInSecs.toFixed(0) + " secs";
        
    rightTextNode = rightTime.childNodes[0];
    rightTextNode.nodeValue = rightText;

    // console.log("left text = " + leftText);
    // console.log("right text = " + rightext);
}


function playTrackerMove(evt) 
{
    if (!playTrackerMode.match("playing")) {
    var mouse_x = evt.pageX;
    var mouse_y = evt.pageY;

    var img_x = $("#selfSimImgId").offset().left;
    var img_y = $("#selfSimImgId").offset().top;
   
    var x_org = mouse_x - img_x;
    var y_org = mouse_y - img_y;
    
    updateLeftAndRightTimes(x_org,y_org);

    var playTracker = document.getElementById("playtracker");
    var transform = "translate("+x_org+","+y_org+")";
    playTracker.setAttribute("transform",transform);
    }

}

function svgInitSimilarityPlay() 
{
    var mysong = document.getElementById("mysong");
    var barWidth = mysong.getElementWidth();

    var baseSongSrc="sites/localsite/collect/" + collect +"/import/"+source;

    baseSong = new Audio();
    baseSong.src = baseSongSrc;
    baseSong.control = "control";

    baseSong.addEventListener('MozAudioAvailable', audioAvailable, false);
    baseSong.addEventListener('loadedmetadata', loadedMetadata, false);

    //leftSong = new Audio();
    leftSong = document.getElementById("leftsong");
    leftSong.addEventListener('MozAudioAvailable', audioAvailableLeft, false);
    leftSong.addEventListener('loadedmetadata', loadedMetadataLeft, false);

    //rightSong = new Audio();
    rightSong = document.getElementById("rightsong")
    rightSong.addEventListener('MozAudioAvailable', audioAvailableRight, false);
    rightSong.addEventListener('loadedmetadata', loadedMetadataRight, false);


    // Set up self similarity image

    var selfSimImgSrc="sites/localsite/collect/" + collect +"/bordered/line-interlaced/"+self_sim_png;
    //console.log("self sim img = " + selfSimImgSrc);

    var simPlayLine = document.getElementById("simPlayLineGroup");

    simPlayLine.setAttributeNS(SVG_NS,"transform","scale(1.0,"+yScaleSimImg+")");

    var selfSimImg = document.createElementNS(SVG_NS,"image");
    selfSimImg.setAttributeNS(XLINK_NS, "xlink:href", selfSimImgSrc);

    var selfSimImgWidth  = barWidth;
    var selfSimImgHeight = barWidth * (815.0 / 776.0);

    selfSimImg.setAttribute("x",0);
    selfSimImg.setAttribute("y",0);
    selfSimImg.setAttribute("id","selfSimImgId");
    selfSimImg.setAttribute("width",barWidth);
    selfSimImg.setAttribute("height",selfSimImgHeight);
    selfSimImg.setAttribute("onclick","dualPlay(evt)");
    selfSimImg.setAttribute("onmousemove","playTrackerMove(evt)");
    selfSimImg.setAttribute("onmouseover","playTrackerOn(evt)");
    //selfSimImg.setAttribute("onmouseout","playTrackerOff(evt)");

    simPlayLine.appendChild(selfSimImg);

    var svgSimilarityPlay = document.getElementById("svgSimilarityPlay");
    svgSimilarityPlay.setAttribute("height",0 + selfSimImgHeight * yScaleSimImg); // used to be 30 +


    // Firefox doesn't seem to like this being initialized statically
    // in the HTML page generate, so add it dynamically here
    var playTrackerBusy = document.getElementById("playtrackerBusy");
    playTrackerBusy.setAttributeNS(XLINK_NS,"xlink:href",
                   "ext/audioDB/icons/wait30trans.gif");

}




function loadedMetadata() {
    // Mute baseSong audio.
    baseSong.volume = 0;

    // Set up a pannedPlayback for baseSong to routed through
    // console.log("num channels = " + baseSong.mozChannels);

    pannedPlayback.mozSetup(2, baseSong.mozSampleRate);
}


function loadedMetadataLeft() {
    // Mute baseSong audio.
    leftSong.volume = 0;

    //leftSong.currentTime = leftStartTimeSecs;
    //leftSong.play();
    //console.log("left start time = " + leftStartTimeSecs);
}


function loadedMetadataRight() {
    // Mute baseSong audio.
    rightSong.volume = 0;

    //rightSong.currentTime = rightStartTimeSecs;
    //rightSong.play();
    //console.log("right start time = " + rightStartTimeSecs);

}

function audioAvailable(event) {
    // Write the current framebuffer
    alert("audioAvailable() should no longer be called");
    var frameBuffer = event.frameBuffer; // frameBuffer is Float32Array
    //writeAudio(frameBuffer);
}

function audioAvailableLeft(event) 
{
    // Write the current framebuffer
    var frameBuffer = event.frameBuffer; 
    writeAudio(frameBuffer,"left");

}

function audioAvailableRight(event) 
{
    // Write the current framebuffer
    var frameBuffer = event.frameBuffer; 
    writeAudio(frameBuffer,"right");
}




function activeAudioBuffer(audioBuffer,currentFullBufferSize,startTime) 
{
    var buffer;
    if (currentFullBufferSize < startTime) {
    // active audio starts at offset within this segment of audioBuffer

    var position = startTime - currentFullBufferSize;
    buffer = audioBuffer.subarray(position);
    }
    else {
    buffer = audioBuffer;
    }
    return buffer;
}

function panLeftEffect(buffer,s,panned_buffer,d) 
{
    panned_buffer[d] = buffer[s];
    if ((d+1) < panned_buffer.length) {
    panned_buffer[d+1] = 0;
    }
}

function panRightEffect(buffer,s,panned_buffer,d) 
{
    panned_buffer[d] = 0;
    if ((d+1) < panned_buffer.length) {
    panned_buffer[d+1] = buffer[s];
    }
}

function panAudioBuffersHead(buffer,position,panEffect)
{
    var remaining_len = buffer.length - position;
    var panned_buffer;
    if (baseSong.mozChannels == 1) {
    panned_buffer = new Float32Array(remaining_len * 2);

    var d=0;
    for (var s=position; s < buffer.length; s++) {
        panEffect(buffer,s,panned_buffer,d);
        d += 2;
    }
    }
    else {
    // assume stereo
    panned_buffer = new Float32Array(remaining_len);
      
    var d=0;
    for (var s=position; s < buffer.length; s+=2) {
        panEffect(buffer,s,panned_buffer,d);
        d += 2;
    }
    }

    return panned_buffer;
}

function mergeLeftAndRightPan(leftPannedBuffer,rightPannedBuffer)
{
    // left and right buffers guaranteed to be stereo samples
 
    // Deliberately crossed to fit visual playTracker circlea 

    var leftLen  = leftPannedBuffer.length;
    var rightLen = rightPannedBuffer.length;
    var maxLen = Math.max(leftLen,rightLen);

    var pannedBuffer = new Float32Array(maxLen);

    for (i=0; i < maxLen; i+=2) {

        if (i < leftLen-1) {
        // i+1 actually right pos
        pannedBuffer[i+1] = leftPannedBuffer[i];
    }
    else {
        pannedBuffer[i+1] = 0;
    }

        if (i < rightLen-1) {
        // actually left pos
        pannedBuffer[i] = rightPannedBuffer[i+1];
    }
    else {
        pannedBuffer[i] = 0;
    }
    }

    return pannedBuffer;

}

function writeAudio(audioBuffer,channel) 
{

    var mysong = document.getElementById("mysong");
    var barWidth = mysong.getElementWidth();

    // audioBuffer is Float32Array
    var audioBufferLen = audioBuffer.length; 

    if (channel.match("left")) {
        //var leftBuffer = activeAudioBuffer(audioBuffer,totalFullBufferSize,leftStartTimeOffset);
    leftBuffers.push({buffer: audioBuffer, position: 0});
    }

    if (channel.match("right")) {
        //var rightBuffer = activeAudioBuffer(audioBuffer,totalFullBufferSize,rightStartTimeOffset);
    rightBuffers.push({buffer: audioBuffer, position: 0});
    }


    // If there's buffered data in both left and right buffers,
    // then it's time to play something 

    var currPlayedX = null;
    var currPlayedY = null;

    while ((leftBuffers.length > 0) && (rightBuffers.length > 0)) {

    if (preparingDualAudio) {
        var playTrackerBusy= document.getElementById("playtrackerBusy");
        playTrackerBusy.setAttribute("style","visibility: hidden;");
        preparingDualAudio = 0;
    }


        var leftBuffer = leftBuffers[0].buffer;
    var leftBufferPos = leftBuffers[0].position;
        var leftPannedBuffer  = panAudioBuffersHead(leftBuffer,leftBufferPos,panLeftEffect);

        var rightBuffer = rightBuffers[0].buffer;
    var rightBufferPos = rightBuffers[0].position;
        var rightPannedBuffer = panAudioBuffersHead(rightBuffer,rightBufferPos,panRightEffect);

        var pannedBuffer = mergeLeftAndRightPan(leftPannedBuffer,rightPannedBuffer);

    // Send something to be played
    var written = pannedPlayback.mozWriteAudio(pannedBuffer);

    // get current play pos, and plot on selfSimImg
    var currentPlayedOffset = pannedPlayback.mozCurrentSampleOffset();

    var sampleRate = pannedPlayback.mozSampleRate;
    var numChannels = pannedPlayback.mozChannels;

    var pannedDurationLeft  = duration - leftStartTimeSecs;
    var pannedDurationRight = duration - rightStartTimeSecs;

    var totalNumSamplesLeft  = sampleRate * numChannels * pannedDurationLeft;
    var totalNumSamplesRight = sampleRate * numChannels * pannedDurationRight;

    var currentPlayedPercLeft  = currentPlayedOffset/totalNumSamplesLeft;
    var currentPlayedPercRight = currentPlayedOffset/totalNumSamplesRight;


    var currPlayedXPrecise = startPlayX + (currentPlayedPercLeft*pannedPlayWidth);
    var currPlayedYPrecise = startPlayY - (currentPlayedPercRight*pannedPlayHeight);
    currPlayedX = Math.round(currPlayedXPrecise);
    currPlayedY = Math.round(currPlayedYPrecise);


    if ((currPlayedX != prevPlayedX) || (currPlayedY != prevPlayedY)) {

        updateLeftAndRightTimes(currPlayedXPrecise,currPlayedYPrecise);

        var playTracker = document.getElementById("playtracker");
        var transform = "translate("+currPlayedX+","+currPlayedY+")";
        playTracker.setAttribute("transform",transform);
            
        if ((prevPlayedX == -1) && (prevPlayedY == -1)) {
        // notice the first time this happens
        playTracker.setAttribute("style","visibility: visible");
        playTrackerMode = "playing";
        }

        prevPlayedX = currPlayedX;
        prevPlayedY = currPlayedY;
    }

    // console.log("currently playing = " + currentPlayedSecs);


    // If all data wasn't written, keep it in the buffers:
    var doBreak = false;

    if (leftBufferPos + written < leftBuffer.length) {
        leftBuffers[0].position = leftBufferPos + written;
        doBreak = true;
    }
    else {
        leftBuffers.shift();
        }

    if (rightBufferPos + written < rightBuffer.length) {
        rightBuffers[0].position = rightBufferPos + written;
        doBreak = true;
    }
    else {
        rightBuffers.shift();
        }

    if (doBreak) {
        break;
    }
    }

    var currentPlayedOffset = pannedPlayback.mozCurrentSampleOffset();

    //if (currentPlayedOffset == prevPlayedOffset) {
    // Nothing more is playing

    var exceededX = ((currPlayedX != null) && (currPlayedX>barWidth));
    var exceededY = ((currPlayedY != null) && (currPlayedY<0));

    if ((exceededX || exceededY) && (!playTrackerMode.match("stopped"))) {

    // console.log("detected stop condition");

    // readed edge of play area
    playTrackerMode = "stopped";
    togglePlayVisual(document.getElementById("mainPlayButton"));
    playTrackerOff(null);
        
    //prevPlayedOffset = -1;
    }
    else {
    //prevPlayedOffset = currentPlayedOffset;
    }

}