source: main/trunk/model-sites-dev/mozarts-laptop/collect/digital-music-stand/script/musicstand.js@ 30461

function MusicStand(httpdoc,cgiargc,docoid,thisOID,cgiNumPages,cgiGotoPage,
            cgiPageWidth,cgiPageHeight,cgiScaleFactor)
{

  var httpdocument = httpdoc;
  var collect      = cgiargc;
  var site         = gs.xsltParams.site_name;
    
  var docid   = docoid;
  var _cutpos = docid.indexOf(".");
  var docRoot = (_cutpos>0) ? docid.substr(0,_cutpos) : docid;

  var assocDir = thisOID;

  var totalPageCount = cgiNumPages;
  var speedBreak = 500;
  var pageXDim = cgiPageWidth;
  var pageYDim = cgiPageHeight;
  var scaleFactor = cgiScaleFactor;

  var topVal    = 0;
  var rightVal  = pageXDim;
  var bottomVal = 0;
  var leftVal   = 0;

  var pageNum = cgiGotoPage;

  var pageAnimTimer;

  var cgiPrefix;
  var cgiSuffix;

  var postitBgCol  = "rgba(255,200,200,0.7)";
  var postitSelCol = "rgba(128,0,0,0.7)";

  var username = null;

  imageserverURL = function()
  {
      //return gsapi.apiURL("image-server.pl");
      return "cgi-bin/image-server.pl";
  }

  this.setStyleColors = function(bg,sel)
  {
    postitBgCol = bg;
    postitSelCol = sel;
  }


  this.setUsername = function(cgiUsername)
  {
    username = cgiUsername;
  }

  this.getUsername = function()
  {
      return username;
  }

  this.getScaleFactor = function() 
  {
      return scaleFactor;
  }

  this.getPageNum = function() 
  {
      return pageNum;
  }

  this.getDocRoot = function()
  {
      return docRoot;
  }

  this.getDocOID = function()
  {
      return docid;
  }

  this.getSpeedBreak = function() 
  {
      return speedBreak;
  }

  this.setSpeedBreak = function(newSpeedBreak) 
  {
      speedBreak = newSpeedBreak;
  }


  this.setPagePrefix = function(p)
  {
      cgiPrefix = p;
  }

  this.setPageSuffix = function(s)
  {
      cgiSuffix = s;
  }


  this.docwritePrevPageNum = function()
  {
      document.write(pageNum-1);
  }

  this.activatePrevPageNum = function()
  {
      if (pageNum>1) { 
          displayInline('prevpagespan');
      }
      else {
          displayNone('prevpagespan');
      }
  }


  this.docwriteOptOfPages = function()
  {
      if (totalPageCount>1) {
        document.write(' of ' + totalPageCount + ' pages');
      }
  }

  this.docwriteNextPageNum = function()
  {
      document.write(pageNum+1);
  }

  this.activateNextPageNum = function()
  {
      if (pageNum < totalPageCount) { 
          displayInline('nextpagespan');
      }
      else {
          displayNone('nextpagespan');
      }
  }

  delayedShowStatus = function(mess)
  {
    window.status = mess; 
  }

  this.showStatus = function(mess)
  {
    window.status = mess; 

    // NS6 series of browsers set URL after doing event
    // => have a delayed version that sets the status bar
    setTimeout("delayedShowStatus('"+mess+"')",10);

    return true;
  }


  pageAnimPrivate = function(direction,pagePrefix,pageSuffix) 
  {
    var imagediv = (direction>0) ? 'nextpagediv' : 'prevpagediv';
        var imagelayer = document.getElementById(imagediv)
        var bleedlayer = document.getElementById('animedgebleed')

    var deltaY;
    var deltaTime;

    if (bottomVal<speedBreak) {
      deltaY = 2;
      deltaTime = 10;
    }
    else {
      deltaY = 1;
      deltaTime = 30;
    }

    if(bottomVal < pageYDim) {  
        bottomVal += deltaY;
        imagelayer.style.clip="rect("+topVal+"px "+rightVal+"px "+bottomVal+"px "+leftVal+"px)"
        bleedlayer.style.clip="rect("+topVal+"px "+rightVal+"px "+(bottomVal+2)+"px "+leftVal+"px)"
        var callPageAnim = "pageAnimPrivate("+direction+",'"+pagePrefix+"','"+pageSuffix+"')";
        pageAnimTimer = setTimeout(callPageAnim,deltaTime)
    }
    else {

      // finished => update the image that is the current page
      var thisimg = document.getElementById('thispageimg')
      var nextimg = document.getElementById('nextpageimg')
      var previmg = document.getElementById('prevpageimg')
      
      if (direction>0) {
        if (pageNum<totalPageCount) {
            pageNum++;
        previmg.src = thisimg.src;
            thisimg.src = nextimg.src;

        resetValues(); // reset clip rectangles

            var nextSrc = httpnextanimPrivate(pagePrefix,pageSuffix,pageNum+1);
            nextimg.src = nextSrc;

            var nextspan = document.getElementById('nextpagespan');

        // update page numbers displayed for next and prev
            var nextval = document.getElementById('nextpageval');
        if (pageNum<totalPageCount) {
            nextval.innerHTML = (pageNum+1);
            displayInline('nextpagespan');
        }
        else {
            nextval.innerHTML = "";
            displayNone('nextpagespan');
        }

            var prevval = document.getElementById('prevpageval');
        prevval.innerHTML = (pageNum-1);

        displayInline('prevpagespan');
        }
      }
      else {
        // previous page
        if (pageNum>0) {
            pageNum--;
        nextimg.src = thisimg.src;
            thisimg.src = previmg.src;

        resetValues(); // reset clip rectangles

            var prevSrc = httpnextanimPrivate(pagePrefix,pageSuffix,pageNum-1);
            previmg.src = prevSrc;

        // update page numbers displayed for next and prev
            var nextval = document.getElementById('nextpageval');
        nextval.innerHTML = (pageNum+1);

        displayInline('nextpagespan');
            //var nextspan = document.getElementById('nextpagespan');
        //nextspan.style.display = "block";

            var prevspan = document.getElementById('prevpagespan');

            var prevval = document.getElementById('prevpageval');
        if (pageNum>1) {
            prevval.innerHTML = (pageNum-1);
            displayInline('prevpagespan');
        }
        else {
            prevval.innerHTML = "";
            displayNone('prevpagespan');
        }
        }
      }

      // update docid member variable (pageNum reflect new page value)
          docid = docRoot + "." + pageNum;

/*
      // remove any existing annotations
      annotate.clearAnnotations();

          //var annotateCanvasElem = document.getElementById("annotateCanvas");
          //annotateCanvasElem.style.display = "none";

      // load in new ones for this page
      annotate.loadAnnotations(docid);

          //annotateCanvasElem.style.display = "block";
*/

      // update slide position (pageNum already changed)


      var username = musicStand.getUsername();
      var metaval;

      if (username != null) {
          // try of user specific one, if it exists
          var metaname = username + "-sliderposTop";
          metaval  = gsapi.getLiveMetadata(docid,metaname);
          if (metaval == "") {
              // fallback to looking up non-user specific one
              metaval  = gsapi.getLiveMetadata(docid,"sliderposTop");
          }
      }
      else {
              //metaval  = gsapi.getLiveMetadata(docid,"sliderposTop");
              metaval  = 700; // ******** hack
      }
      var sliderposTop = parseInt(metaval);

      updateSlider(sliderposTop);

    }
  }

  cancelPageAnimPrivate = function() {
      clearTimeout(pageAnimTimer);
      resetValues();
  }

  this.cancelPageAnim = function() {
      cancelPageAnimPrivate();
  }

  this.pageAnim = function(direction,pagePrefix,pageSuffix) 
  {
      pageAnimPrivate(direction,pagePrefix,pageSuffix);
  }

  httpnextanimPrivate = function(pagePrefix,pageSuffix,nextPageNum)
  {
    var imgserver = imageserverURL();

    var screenWidth = screen.width;
    var screenHeight = screen.height;

    nextPageNum--; // filenames use values one less that pageNum

    var url = imgserver + "?a=fit-screen"
    url += "&c="+collect;
    url += "&site="+site;
    url += "&pageWidth="+pageXDim;
    url += "&pageHeight="+pageYDim;
    url += "&assocDir=" + assocDir;
    url += "&assocFile=" + pagePrefix;


    if (totalPageCount>1) {
      url += "-" + nextPageNum;
    }
    url += pageSuffix;

    if (orientation == "landscape") {
        url += "&orientation=landscape";
    }

    return url;
  }

  this.httpnextanim = function(pagePrefix,pageSuffix,nextPageNum)
  {
      return httpnextanimPrivate(pagePrefix,pageSuffix,nextPageNum);
  }


  httpprevanimPrivate = function(pagePrefix,pageSuffix,prevPageNum)
  {
    var imgserver = imageserverURL();

    var screenWidth = screen.width;
    var screenHeight = screen.height;

    prevPageNum--; // filenames use values one less that pageNum

    var url = imgserver + "?a=fit-screen"
    url += "&c="+collect;
    url += "&site="+site;
    url += "&pageWidth="+pageXDim;
    url += "&pageHeight="+pageYDim;
    url += "&assocDir=" + assocDir;
    url += "&assocFile=" + pagePrefix;


    if (totalPageCount>1) {
      url += "-" + prevPageNum;
    }
    url += pageSuffix;

    if (orientation == "landscape") {
        url += "&orientation=landscape";
    }

    return url;
  }

  this.httpprevanim = function(pagePrefix,pageSuffix,prevPageNum)
  {
      return httpprevanimPrivate(pagePrefix,pageSuffix,prevPageNum);
  }


    
  nextPageAnimPrivate = function(pagePrefix,pageSuffix) 
  {
      // set up next page

      if (pageNum<totalPageCount) {
          //saveAnnotations();
          pageAnimPrivate(1,pagePrefix,pageSuffix);
      }
  }

  this.nextPageAnim = function(pagePrefix,pageSuffix) 
  {
      nextPageAnimPrivate(pagePrefix,pageSuffix);
  }

  prevPageAnimPrivate = function(pagePrefix,pageSuffix) 
  {
      // set up next page

      if (pageNum>1) {
          //saveAnnotations();
          pageAnimPrivate(-1,pagePrefix,pageSuffix);
      }
  }

  this.prevPageAnim = function(pagePrefix,pageSuffix) 
  {
      prevPageAnimPrivate(pagePrefix,pageSuffix);
  }

  this.nextOrPrevPageEventLRMouse = function(evt,pagePrefix,pageSuffix) 
  {
      if (!evt) var evt = window.event;

      var rightclick = false;
      if (evt.which) rightclick = (evt.which == 3);
      else if (evt.button) rightclick = (evt.button == 2);

      var leftclick = false;
      if (evt.which) leftclick = (evt.which == 1);
      else if (evt.button) leftclick = (evt.button == 1);

      if (rightclick) { 
          this.nextPageAnim(pagePrefix,pageSuffix); 
      }
      else if (leftclick) { 
          this.prevPageAnim(pagePrefix,pageSuffix); 
      }


      return false;
  }


  var numClicks = 0;
  var clicksTimer = null;

  this.nextOrPrevPageEvent = function(evt,pagePrefix,pageSuffix) 
  //this.pageMenu = function(e)
  {
      //var pagePrefix = cgiPrefix;
      //var pageSuffix = cgiSuffix;

      if (clicksTimer!=null) {
        clearTimeout(clicksTimer);
      }

      var callPageAction = 'pageAction("'+pagePrefix+'","'+pageSuffix+'")';
      clicksTimer = setTimeout(callPageAction,1000);

      numClicks = (numClicks % 3) + 1;

      var menu = document.getElementById("pagemenu");
      menu.style.visibility = "visible";

      for (var i=1; i<=3; i++) {
          var menuItem = document.getElementById("pagemenu"+i);
      if (i==numClicks) {
        menuItem.style.backgroundColor = postitSelCol;
      }
      else {
        menuItem.style.backgroundColor = postitBgCol;
      }
      }
      
      return false;
  }
  
  pageAction = function(pagePrefix,pageSuffix)
  {
      var menu = document.getElementById("pagemenu");
      menu.style.visibility = "hidden";

      var keepState = numClicks;

      clicksTimer = null;
      numClicks = 0;

      if (keepState==1) {
        cancelPageAnimPrivate();
      }
      else if (keepState==2) {
          nextPageAnimPrivate(pagePrefix,pageSuffix); 
      }
      else if (keepState==3) { 
          prevPageAnimPrivate(pagePrefix,pageSuffix); 
      }

  }

  this.hidePageMenu = function(elem,event)
  {
    elem.style.visibility="hidden";
    //de.cursor.setCursorAtXY(mouseX,mouseY);
  }


  resetValues = function() 
  {
      var nextlayer = document.getElementById('nextpagediv')
      var prevlayer = document.getElementById('prevpagediv')
      var bleedlayer = document.getElementById('animedgebleed')

      topVal=0;
      rightVal=pageXDim;
      bottomVal=0;
      leftVal=0

      var startingClip = "rect("+topVal+"px "+rightVal+"px "+bottomVal+"px "+leftVal+"px)";

      nextlayer.style.clip=startingClip;
      prevlayer.style.clip=startingClip;
      bleedlayer.style.clip=startingClip;
  }
}