/* Copyright © 2010 Jamie Zawinski <jwz@dnalounge.com>

   Permission to use, copy, modify, distribute, and sell this software
   and its documentation for any purpose is hereby granted without
   fee, provided that the above copyright notice appear in all copies
   and that both that copyright notice and this permission notice
   appear in supporting documentation.  No representations are made
   about the suitability of this software for any purpose.  It is
   provided "as is" without express or implied warranty.

   This code is used by the dnalounge.com top level page to make the
   mini-photo-gallery animate.
 */


// Split the opacity of the two divs at ratio.  Assumes they are the
// same height, adjascent, and that their parent does not contain
// non-combatant materiel.
//
function fade_divs (odiv, ndiv, ratio) {
  var p = odiv.parentNode;
  if (ratio > 1) { ratio = 1; }
  if (ratio < 1) {
    p.style.position    = 'relative';
    odiv.style.position = 'static';
    ndiv.style.position = 'absolute';
    ndiv.style.top      = 0;
    odiv.style.display  = 'block';
    ndiv.style.display  = 'block';
    odiv.style.opacity  = 1 - ratio;
    ndiv.style.opacity  = ratio;
    odiv.style.width    = p.offsetWidth + 'px';
    ndiv.style.width    = p.offsetWidth + 'px';

  } else {   // done
    odiv.style.position = 'static';
    ndiv.style.position = 'static';
    odiv.style.display  = 'none';
    ndiv.style.display  = 'block';
    odiv.style.opacity  = 1;
    ndiv.style.opacity  = 1;
    odiv.style.width    = 'auto';
    ndiv.style.width    = 'auto';
  }
}


// Loop an animation from one div to another at fps.
// When done, delay for linger, then call animate_line() to start over.
//
function animate_divs (line, odiv, ndiv, start, duration, linger, fps) {
  var end = start + (1000 * duration);
  var now = new Date().getTime();
  var ratio = (now - start) / (end - start);
  fade_divs (odiv, ndiv, ratio);
  if (now < end) {
    setTimeout (animate_divs, 1000 / fps,
                line, odiv, ndiv, start, duration, linger, fps);
  } else {
    setTimeout (animate_line, 1000 * linger,
                line, duration, linger, fps);
  }
}


// How many frames of snapshots are present in the document.
// Makes assumptions about div id naming conventions.
//
function total_frames() {
  var result = -1;
  for (var i = 0; result < 0 && i < 100; i++) {
    var div = document.getElementById ("snaps_0_" + i);
    if (!div) { result = i; }
  }
  return result;
}


// How many lines of snapshots are present in the document.
// Makes assumptions about div id naming conventions.
//
function total_lines() {
  var result = -1;
  for (var i = 0; result < 0 && i < 100; i++) {
    var div = document.getElementById ("snaps_" + i + "_0");
    if (!div) { result = i; }
  }
  return result;
}


// Which of the snapshot frames is currently displayed.
// Makes assumptions about div id naming conventions.
//
function displayed_frame (line) {
  var which = -1;
  for (var i = 0; which < 0 && i < 100; i++) {
    var div = document.getElementById ("snaps_" + line + "_" + i);
    if (div.style.display != 'none') { which = i; }
  }
  return which;
}


// Start the looping animation timer for a single row of snapshots.
//
function animate_line (line, fade_duration, linger, fps) {
  var oframe = displayed_frame(line);
  var nframe = (oframe + 1) % total_frames();
  var odiv = "snaps_" + line + "_" + oframe;
  var ndiv = "snaps_" + line + "_" + nframe;
  animate_divs (line,
                document.getElementById (odiv),
                document.getElementById (ndiv),
                new Date().getTime(),
                fade_duration, linger, fps);
}


// Start all of the looping animation timers.
//
function start_snapshot_animations() {

  var fade_duration = 0.66;
  var fps           = 20;
  var linger        = 5;  //changed linger duration (mjuarez 011110)

  // Start an animation loop going for each line, in a little while:
  // stagger the starting times of the animations.
  //
  var lines = total_lines();
  for (var line = 0; line < lines; line++) {
    var stagger = (line + 0.5) * (linger + fade_duration) / lines;
    setTimeout (animate_line, stagger * 1000,
                line, fade_duration, linger, fps);
  }
}


// Find all of the snapshot images, and if they are not all loaded
// already, install image.onload handlers to check again each time one
// of these images finishes loading.  Once all snapshot images are
// loaded, calls start_snapshot_animations().
//
function wait_for_snapshot_images() {
  var snaps = new Array();
  var a = document.images;
  for (var i = 0; i < a.length; i++) {
    if (a[i].parentNode.parentNode.className == 'snaps') {
      snaps.push(a[i]);
    }
  }

  var loaded = 0;
  for (var i = 0; i < snaps.length; i++) {
    if (snaps[i].complete) {
      loaded++;
    } else {
      snaps[i].src = snaps[i].src;  // force Opera to load image
    }
  }

  for (var i = 0; i < snaps.length; i++) {
    snaps[i].onload = (loaded == snaps.length
                       ? undefined
                       : wait_for_snapshot_images);
  }

  if (loaded == snaps.length) {
    start_snapshot_animations();
  }
}

// Check for images in a second.
setTimeout (wait_for_snapshot_images, 1000);
