/*******************************************************************************

BatesHori Website gallery.js
(c) 2009 BuzaMoto. All rights reserved.
Author: Takashi Okamoto - http://www.buzamoto.com/

*******************************************************************************/
var FRAME = 0;
var FRAME_LIMIT;
var TRANSITION_DURATION = 0.8;
var OPACITY_DURATION = 0.4;
var OPACITY_FADED = 0.3;
var MOVE_DURATION = 0.8;
var IMAGE_POS = { prev: 600, curr: 0 };
var BLOB_DURATION = { appear: 0.1, fade: 0.2 };
var VISIBLE_IMAGE_COUNT = 3;
var galleryRebuilding = false;
var loadedImages = [];

function xnext() {
  if (FRAME >= FRAME_LIMIT-1) {
    start();
    return;
  }
  
  var currentFrame = FRAME++;
  var changeText = false;

  if ($('text_'+FRAME) && !$('text_'+FRAME).hasClassName('no_change')) {
    changeText = true;
    disableTextContent();
  }
  new Effect.Parallel([
    new Effect.Move('image_'+currentFrame, { sync: true, x: IMAGE_POS.prev, mode: 'absolute'}),
    new Effect.Opacity($('image_'+FRAME), { sync: true, to: 1.0, from: OPACITY_FADED,
      beforeStart: function(effect) {
        if ($('gallery_counter')) $('gallery_counter').update((getElementNumber(effect.element)+1)+"/"+FRAME_LIMIT);
      },
      afterFinish: function(effect) {
        effect.element.removeClassName('faded');
        if (changeText) {
          showTextContent(getElementNumber(effect.element));
          enableTextContent();
        }
        $('image_'+currentFrame).hide();
        
        // load cache image
        window.setTimeout(function() {
          var cacheElement;
          if (cacheElement = imageCacheExists(getElementNumber(effect.element)+VISIBLE_IMAGE_COUNT)) {
            cacheElement.show();
          }
        }, 10);
      }
    })
  ], { duration: TRANSITION_DURATION });
}

function xprev() {
  if (FRAME <= 0) return;
  
  var currentFrame = FRAME--;
  var changeText = false;
  var changeTextNumber = false;
  
  if ($('text_'+FRAME) && !$('text_'+currentFrame).hasClassName('no_change') && !$('text_'+FRAME).hasClassName('no_change')) {
    changeText = true;
    disableTextContent();
  } else if ($('text_'+FRAME).hasClassName('no_change') && !$('text_'+currentFrame).hasClassName('no_change')) {
    changeText = true;
    var e = $('text_'+FRAME);
    while (e = e.previous()) {
      if (!e.hasClassName('no_change')) {
        changeTextNumber = getTextElementNumber(e);
        break;
      }
    }
    disableTextContent();
  }
  new Effect.Parallel([
    new Effect.Move('image_'+FRAME, { sync: true, x: IMAGE_POS.curr, mode: 'absolute' }),
    new Effect.Opacity($('image_'+currentFrame), { sync: true, to: OPACITY_FADED, from: 1.0,
      beforeStart: function(effect) {
        $('image_'+(getElementNumber(effect.element)-1)).show();
        if ($('gallery_counter')) $('gallery_counter').update(currentFrame+"/"+FRAME_LIMIT);
      },
      afterFinish: function(effect) {
        if (changeText) {
          showTextContent(getElementNumber(effect.element)-1, changeTextNumber);
          enableTextContent();
        }
        // hide cache image
        window.setTimeout(function() {
          var cacheElement;
          if (cacheElement = imageCacheExists(getElementNumber(effect.element)+VISIBLE_IMAGE_COUNT)) {
            cacheElement.hide();
          }
        }, 10);
      }
    })
  ], { duration: TRANSITION_DURATION });
}

function start() {
  if (FRAME >= FRAME_LIMIT-1) {
    galleryRebuilding = true;
    disableTextContent();
    
    new Effect.Opacity('image_'+FRAME, {
      duration: OPACITY_DURATION,
      from: 1.0,
      to: OPACITY_FADED,
      afterFinish: function() {
        new Effect.Appear('gallery-blob', {
          duration: BLOB_DURATION.appear,
          afterFinish: function() {
            for (var i = FRAME; i > -1; --i) {
              var element = $('image_'+i);
              element.addClassName('faded');
              if (i > 0) {
                new Effect.Move(element, {
                  //queue: 'end',
                  delay: (FRAME_LIMIT-1-i)*0.2,
                  duration: MOVE_DURATION,
                  x: IMAGE_POS.curr,
                  mode: 'absolute',
                  beforeStart: function() {
                    $('image_'+i).show();
                  },
                  afterFinish: function(effect) {
                    if ($('gallery_counter')) $('gallery_counter').update((FRAME--)+"/"+FRAME_LIMIT);
                    // hide cache image
                    var cacheElement;
                    var cacheElementImageNumber = parseInt(getElementNumber(effect.element))+VISIBLE_IMAGE_COUNT;
                    if (cacheElement = imageCacheExists(cacheElementImageNumber)) {
                      cacheElement.hide();
                    }
                  }
                });
              } else {
                new Effect.Move(element, {
                  //queue: 'end',
                  delay: (FRAME_LIMIT-1-i)*0.2,
                  duration: MOVE_DURATION,
                  x: IMAGE_POS.curr,
                  mode: 'absolute',
                  beforeStart: function() {
                    $('image_'+i).show();
                  },
                  afterFinish: function(effect) {
                    if ($('gallery_counter')) $('gallery_counter').update(FRAME+1+"/"+FRAME_LIMIT);
                    new Effect.Opacity(effect.element, {
                      duration: OPACITY_DURATION,
                      from: OPACITY_FADED,
                      to: 1.0,
                      afterFinish: function(effect) {
                        effect.element.removeClassName('faded');
                        new Effect.Fade('gallery-blob', { duration: BLOB_DURATION.fade,
                          afterFinish: function() {
                            showTextContent(0);
                            enableTextContent();
                            galleryRebuilding = false;
                          }
                        });
                      }
                    });
                  }
                });
              }
            }
          }
        });
      }
    });
  }
}

function getElementNumber(element) {
  return parseInt(element.id.substring(6));
}

function getTextElementNumber(element) {
  return parseInt(element.id.substring(5));
}

function imageCacheExists(frame) {
  return $('image_'+frame);
}

function enableTextContent() {
  if ($('text-list') && !$('text-list').visible()) {
    new Effect.Appear('text-list', {duration: BLOB_DURATION.appear});
  }
}

function showTextContent(frame, specific_frame) {
  if ($('text-list')) {
    $('text-list').childElements().each(function(element) { element.hide(); });
    if (specific_frame != undefined && specific_frame !== false) frame = specific_frame;
    if ($('text_'+frame)) $('text_'+frame).show();
  }
}

function disableTextContent() {
  if ($('text-list') && $('text-list').visible()) {
    new Effect.Fade('text-list', {duration: BLOB_DURATION.fade});
  }
}

Event.observe(window, 'load', function() {
  FRAME_LIMIT = $('image-list').childElements().length;
  $('gallery_prev').observe('click', function(e) {
    if (galleryRebuilding != true)
      xprev();
    Event.stop(e);
  });
  $('gallery_next').observe('click', function(e) {
    if (galleryRebuilding != true)
      xnext();
    Event.stop(e);
  });
  if ($('gallery_counter')) $('gallery_counter').update("1/"+FRAME_LIMIT);
  
  // preload images
  window.setTimeout(function() {
    var i = 0;
    $('image-list').childElements().each(function(li) {
      loadedImages[i] = new Image();
      loadedImages[i].src = li.down('img').src;
      i++;
    });
  }, 10);
});