/* 
Blue Coyote Theater Group interface javascript 
Copyright 2011, Fund for the City of New York
All rights reserved.

This source file is distributable subject to the terms of the
FCNY Open Source License. 
*/

// lightbox for previews and thumbnails
var lightbox = { "version": "1.2", "counter": 0, "images": [] }

lightbox.previewClick = function( e ) {
  e.stop();
  var preview = e.src();
  var lb_id = getNodeAttribute( preview, "lightbox_id" );
  var rawimage = $( "lightbox_" + lb_id );
  if ( rawimage.lightbox===undefined ) {
    if ( !rawimage.width ) {
      var width = rawimage.currentStyle.width.substring( 0, rawimage.currentStyle.width.indexOf("px") );
      var height = rawimage.currentStyle.height.substring( 0, rawimage.currentStyle.height.indexOf("px") );
    }
    else {
      var width = rawimage.width;
      var height = rawimage.height;
    }
    rawimage.lightbox = { "w": width, "h": height };
  }
  else {
    var width = rawimage.lightbox.w;
    var height = rawimage.lightbox.h;
  }
  // get viewport size, and resize image (reduce only) to fit
  var winsize = getViewportDimensions();
  // take 16 off for scrollbars
  winsize.w = winsize.w - 16;
  if ( winsize.w < 1024 ) {
    winsize.h = winsize.h - 16;
  }
  var targetw = winsize.w - 20;
  var targeth = winsize.h - 20;
  if ( width > targetw ) {
    var ratio = targetw / width;
    width = targetw;
    height = Math.floor( height * ratio );
  }
  if ( height > targeth ) {
    var ratio = targeth / height;
    height = targeth;
    width = Math.floor( width * ratio );
  }
  // set position in window
  if ( window.pageYOffset===undefined ) {
    var scrolledto = document.documentElement.scrollTop;
  }
  else {
    var scrolledto = window.pageYOffset;
  }
  var posx = ( winsize.w - width ) / 2;
  if ( posx < 10 ) posx = 10;
  var posy = ( winsize.h - height ) / 3;
  if ( posy < 10 ) posy = 10;
  posy = posy + scrolledto;
  log( "Winsize", winsize, "scrolled to", scrolledto, "rawimage size", rawimage.lightbox.w,"x",rawimage.lightbox.h,"final position", posx,"x",posy, "final size",width,"x",height );
  rawimage.style.left = posx+"px";
  rawimage.style.top = posy+"px";
  rawimage.style.width = width+"px";
  rawimage.style.height = height+"px";
  if ( rawimage && hasElementClass( rawimage, "loaded" ) ) {
    addElementClass( rawimage, "active" );
    addElementClass( $("top"), "lightbox" );
    //ScrollTo( rawimage );
    log("click",preview,"lb_id", lb_id);
  }
  else {
    log( "no rawimage or not loaded" );
  }
}
lightbox.rawimageClick = function( e ) {
  e.stop();
  var rawimage = e.src();
  var origid = getNodeAttribute( rawimage, "original_id" );
  var orig = $( origid );
  removeElementClass( $("top"), "lightbox" );
  //ScrollTo( orig );
  removeElementClass( rawimage, "active" );
}
lightbox.rawImageLoad = function( e ) {
  e.stop();
  var rawimage = e.src();
  if ( !rawimage.complete ) {
    // not complete
    window.setTimeout('lightbox.rawImagePostLoad("'+rawimage.id+'")', 1000);
  }
  else {
    lightbox.rawImagePostLoad( rawimage.id );
  }
}
lightbox.rawImagePostLoad = function( rawimageid ) {
  var rawimage = $( rawimageid );
  if ( !rawimage.width ) {
    var width = rawimage.currentStyle.width.substring( 0, rawimage.currentStyle.width.indexOf("px") );
    var height = rawimage.currentStyle.height.substring( 0, rawimage.currentStyle.height.indexOf("px") );
  }
  else {
    var width = rawimage.width;
    var height = rawimage.height;
  }
  // check to see that rawimage is bigger than original in width or height
  var origid = getNodeAttribute( rawimage, "original_id" );
  var orig = $( origid );
  if ( orig.width >= width && orig.height >= height ) {
    // do not lightbox
    removeElementClass( orig, "lightbox" );
    disconnect( orig.lightboxclick );
    log("No lightbox for",orig.id,"since raw image is smaller");
  }
  else {
    if ( !getNodeAttribute( orig, "title" ) ) {
      setNodeAttribute( orig, "title", "Click to view full size." );
    }
    addElementClass( orig, "loaded" );
    addElementClass( rawimage, "loaded" );
    connect( rawimage, "onclick", lightbox, "rawimageClick" );
  }
}
lightbox.init = function() {
  iterateElementsByTagAndClassName ( "img", null, $("Object"), function( images, i ) {
    // if image src includes token preview or thumbnail
    if ( images[i].src.indexOf( "preview" ) > -1 || images[i].src.indexOf( "thumbnail" ) > -1 ) {
      // make sure preview is last namepart
      var names = images[i].src.split( "/" );
      var lastname = names.pop();
      // posterize name
      names.push("poster");
      // check for nolightbox on image and 2 parents
      if ( hasElementClass(images[i], "nolightbox") || hasElementClass(images[i].parentNode, "nolightbox") || hasElementClass(images[i].parentNode.parentNode, "nolightbox") ) {
        return;
      }
      // check for link tag in 3 parents
      if ( images[i].parentNode.tagName=="A" || images[i].parentNode.parentNode.tagName=="A" || images[i].parentNode.parentNode.parentNode.tagName=="A" ) {
        return;
      }
      if ( ( lastname.indexOf( "preview" )==0 || lastname.indexOf( "thumbnail" )==0 ) ) {
        // connect onclick and add lightbox class
        lightbox.counter ++;
        if ( !images[i].id ) {
          images[i].id = "lightbox_original_" + lightbox.counter;
          log("Assigned id to images",i,",",images[i].id);
        }
        images[i].lightboxclick = connect( images[i], "onclick", lightbox, "previewClick" );
        addElementClass( images[i], "lightbox" );
        setNodeAttribute( images[i], "lightbox_id", lightbox.counter );
        var rawname = names.join("/") + ".jpg";
        var rawimage = IMG( { "id": "lightbox_"+lightbox.counter, "src": rawname, "class": "rawimage", "title": "Click again to close image", "original_id": images[i].id } );
        connect( rawimage, "onload", lightbox, "rawImageLoad" );
        $("top").appendChild( rawimage );
      }
    }
  });
  log("Lightbox set up for",lightbox.counter,"images");
}

connect( window, "onload", lightbox, "init" );