var front;
var go;
var speed;
var slide;
var slide_button;
var slide_position;
var positions = new Array( 690, 675, 660, 630, 615, 600, 570, 555, 540, 510, 495, 480, 465, 450, 420, 390, 360, 330, 300, 270, 240, 210, 180, 150, 120, 90, 60, 30, 0 );

if ( typeof document.onselectstart != "undefined" ) document.onselectstart = new Function ( "if ( slide ) return false" );
else document.onmousedown = new Function ( "if ( slide ) return false" );

if ( window.addEventListener ) window.addEventListener ( 'mousemove', scroll_move, false );
else document.attachEvent( 'onmousemove', scroll_move )
if ( window.addEventListener ) window.addEventListener ( 'mouseup', scroll_off, false );
else document.attachEvent( 'onmouseup', scroll_off );

function scroll_on () {
  slide_button = document.getElementById( 'slide_button' );
  slide = 1;
}

function scroll_off () {
  if ( slide ) {
    slide = 0;
    speed = 1;
    slide_position = 0;
    slide_button.style.left = '332px';
  }
}

function scroll_move ( event ) {

  if ( slide ) {
    object = slide_button;
    pos = object.offsetLeft;
    while ( object = object.offsetParent ) pos += object.offsetLeft;
    slide_position = slide_button.offsetLeft - pos + event.clientX - 332;
    if ( Math.abs( slide_position ) > 332 ) slide_position = 332 * slide_position / Math.abs( slide_position )
    slide_button.style.left = ( slide_position + 332 ) + 'px';
  }

  return false;
}

function rotate ( process ) {

  if ( document.getElementById( 'first_img' ) ) {
    if ( !front || document.getElementById( 'image_container' ) !== front.parentNode ) {
      front = document.getElementById( 'first_img' );
      go = 0;
    }
  }

  if ( slide_position ) {
    speed = 3 * Math.pow ( Math.abs( slide_position ) / 330, 5/4 );
    if ( !go ) go = slide_position / Math.abs( slide_position );
    else if ( ( go / slide_position < 0 ) && ( speed < 1 ) ) speed = 1;
  }

  if ( document.getElementById( 'zoom' ) && ( document.getElementById( 'zoom' ).style.display == 'block' ) ) speed = 5;

  if ( go ) {

    if ( go > 0 ) {

      if ( searchChild ( front.parentNode, 0 ) > 5 ) {
        next = nextCircleElement ( front );
        next2 = nextCircleElement ( next );
        next3 = nextCircleElement ( next2 );
        next4 = nextCircleElement ( next3 );
        previous = previousCircleElement ( front );
        previous2 = previousCircleElement ( previous );
      } else {
        next = nextElement ( front );
        next2 = nextElement ( next );
        next3 = nextElement ( next2 );
        next4 = nextElement ( next3 );
        previous = previousElement ( front );
        previous2 = previousElement ( previous );
      }

    } else if ( go < 0 ) {

      if ( searchChild ( front.parentNode, 0 ) > 5 ) {
        next = previousCircleElement ( front );
        next2 = previousCircleElement ( next );
        next3 = previousCircleElement ( next2 );
        next4 = previousCircleElement ( next3 );
        previous = nextCircleElement ( front );
        previous2 = nextCircleElement ( previous );
      } else {
        next = previousElement ( front );
        next2 = previousElement ( next );
        next3 = previousElement ( next2 );
        next4 = previousElement ( next3 );
        previous = nextElement ( front );
        previous2 = nextElement ( previous );
      }

    }

    if ( next.nodeType == 1 ) {
      
      if ( !centered ( next ) ) {

        if ( !previous ) {
          if ( go < 0 ) {
            document.getElementById( 'right_arrow' ).style.opacity = '1';
            document.getElementById( 'right_arrow' ).style.cursor = 'pointer';
          } else {
            document.getElementById( 'left_arrow' ).style.opacity = '1';
            document.getElementById( 'left_arrow' ).style.cursor = 'pointer';
          }
        }

        if ( centered ( front ) ) {
          if ( next3.nodeType == 1 ) init_image ( next3 );
          if ( previous2.nodeType == 1 ) previous2.style.zIndex = 0;
          if ( previous.nodeType == 1 ) previous.style.zIndex = 1;
        }

        if ( previous.nodeType == 1 )  move_picture ( previous );
        move_picture ( front );
        move_picture ( next );
        if ( next2.nodeType == 1 ) move_picture ( next2 );

        if ( front.style.width < next.style.width ) { front.style.zIndex = 2; next.style.zIndex = 3; }

      } else {

        if ( previous2.nodeType == 1 ) previous2.style.visibility = 'hidden';
        if ( next2.nodeType == 1 ) next2.style.zIndex = 2;
        if ( next3.nodeType == 1 ) next3.style.zIndex = 1;
        if ( next4.nodeType == 1 ) next4.style.zIndex = 0;

        front = next;

        if ( ( go > 0 ) && !nextElement ( front ) ) {
          document.getElementById( 'right_arrow' ).style.opacity = '0.5';
          document.getElementById( 'right_arrow' ).style.cursor = 'auto';
        } else if ( !previousElement ( front ) ) {
          document.getElementById( 'left_arrow' ).style.opacity = '0.5';
          document.getElementById( 'left_arrow' ).style.cursor = 'auto';
        }

        go -= go / Math.abs( go );
        if ( ( !go || ( next.nodeType != 1 ) ) && document.getElementById( 'zoom' ) && ( document.getElementById( 'zoom' ).style.display == 'block' ) ) {
          if ( front.childNodes[ 0 ].nodeType == 1 ) image_click ( front.childNodes[ 0 ] );
          else image_click ( front.childNodes[ 1 ] );
        }
      }
    } else go = 0;
  }

  if ( !go ) speed = 1;

  if ( process == 1 ) {
    setTimeout( function () { rotate ( 1 ) }, Math.max ( Math.min ( Math.ceil ( 40 / speed ), 200 ), 40 ) );
    if ( speed > 1 ) for ( cont = 1; cont < speed; cont++ ) setTimeout( function () { rotate ( 0 ) }, 40 + cont );
  }
}

function move ( input ) {
  go += input;
  speed = Math.min ( Math.ceil( Math.abs ( go ) / 3 ), 5 );
  return 0;
}

function image_click ( image ) {
  if ( image.parentNode === front ) zoom ( image );
  else {
    next = nextCircleElement ( front );
    next2 = nextCircleElement ( next );
    previous = previousCircleElement ( front );
    previous2 = previousCircleElement ( previous );

    if ( image.parentNode === next ) go = 1;
    else if ( image.parentNode === previous ) go = -1;
    else if ( image.parentNode === next2 ) go = 2;
    else if ( image.parentNode === previous2 ) go = -2;
  }
}

function zoom ( image ) {
  div = document.getElementById( 'zoom' );
  videoID = searchChild ( image.parentNode, -1 ).innerHTML;

  zoomed = searchChild ( searchChild ( div, 1 ), 1 );
  zoomed.style.display = 'none';

  if ( videoID ) {
    nextElement(nextElement(zoomed)).src = 'http://player.vimeo.com/video/' + videoID;
    nextElement(zoomed).style.display = 'none';
    nextElement(nextElement(zoomed)).style.display = 'inline-block';
  } else {
    zoomed.src = '';
    zoomed.onload = zoom_loaded;
    zoomed.src = image.src.replace( 'thumb.php?image=', '' );
    nextElement(zoomed).style.display = 'inline-block';
    nextElement(nextElement(zoomed)).style.display = 'none';
  }

  searchChild ( document.getElementById( 'client' ), 1 ).innerHTML = searchChild ( image.parentNode, -5 ).innerHTML;
  searchChild ( document.getElementById( 'project' ), 1 ).innerHTML = searchChild ( image.parentNode, -4 ).innerHTML;
  searchChild ( document.getElementById( 'date' ), 1 ).innerHTML = generate_date ( searchChild ( image.parentNode, -3 ).innerHTML );
  document.getElementById( 'text' ).innerHTML = searchChild ( image.parentNode, -2 ).innerHTML;

  div.style.display = 'block';
}

function zoom_loaded () {
  zoomed = searchChild ( searchChild ( document.getElementById( 'zoom' ), 1 ), 1 );
  nextElement( zoomed ).style.display = 'none';
  zoomed.style.display = 'inline-block';
}

function generate_date ( date ) {
  months = new Array ( '', 'Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio', 'Julio', 'Agosto', 'Septiembre', 'Octubre', 'Noviembre', 'Diciembre' );
  year = date.substr ( 0, 4 );
  month = date.substr ( 4, 2 );
  return months [ parseInt ( month, 10 ) ] + ' de ' + year;
}

function move_picture ( object ) {

  if ( ielt8 () ) return ( move_picture_ie ( object ) );

  direction = go / Math.abs( go );

  old_position = object.style.left.replace( 'px', '' );
  if ( !old_position ) old_position = 690 * direction;
  old_sign = old_position / Math.abs( old_position );

  if ( old_position == 0 ) new_position = - direction * positions [ positions.length - 2 ];
  else {
    for ( cont = 0; cont < positions.length; cont++ ) if ( positions [ cont ] == Math.abs ( old_position ) ) break;
    if ( cont + old_sign * direction < 0 ) new_position = old_position;
    else new_position = old_sign * ( positions [ cont + old_sign * direction ] - 0 );
  }

  object.style.left = new_position + 'px';
  object.style.width = ( 340 * ( 1 - Math.abs ( new_position ) / 1400 ) ) + 'px';
  object.style.height = ( 210 * ( 1 - Math.abs ( new_position ) / 1400 ) ) + 'px';

  return 1;
}

function move_picture_ie ( object ) {

  direction = go / Math.abs( go );

  old_position = object.style.left.replace( 'px', '' );
  if ( !old_position ) old_position = ( -345 - 170 * ( 1 - 690 / 1400 ) ) * direction;
  old_position = Math.round ( ( old_position * 2 + object.offsetWidth ) / 15 ) * 15;
  old_sign = old_position / Math.abs( old_position );


  if ( old_position == 0 ) new_position = - direction * positions [ positions.length - 2 ];
  else {
    for ( cont = 0; cont < positions.length; cont++ ) if ( positions [ cont ] == Math.abs ( old_position ) ) break;
    if ( cont + old_sign * direction < 0 ) new_position = old_position;
    else new_position = old_sign * ( positions [ cont + old_sign * direction ] - 0 );
  }

  object.style.width = ( 340 * ( 1 - Math.abs ( new_position ) / 1400 ) ) + 'px';
  object.style.height = ( 210 * ( 1 - Math.abs ( new_position ) / 1400 ) ) + 'px';
  object.style.left = ( new_position / 2 - object.offsetWidth / 2 ) + 'px';
  return 1;
}

function ielt8 () {
  if ( '\v' === 'v' )
    if ( new RegExp ( "MSIE ([0-9]{1,}[\.0-9]{0,})" ).exec( navigator.userAgent ) != null)
      return ( ( parseFloat( RegExp.$1 ) < 8 ) && ( parseFloat( RegExp.$1 ) > 0 ) );

  return false;
}

function init_image ( image ) {
  if ( ielt8 () ) image.style.left = ( 345 * go / Math.abs( go ) - 170 * ( 1 - 690 / 1400 ) ) + 'px';
  else image.style.left = ( 690 * go / Math.abs( go ) ) + 'px';
  image.style.visibility = 'visible';
}

function centered ( image ) {
  if ( ielt8 () ) return ( Math.round ( image.style.left.replace( 'px', '' ) / 15 ) == Math.round ( image.offsetWidth / -30 ) );
  else return ( image.style.left === '0px' );
}

function init () {
  rotate ( 1 );
  initie ();
}

function initie () {
  if ( !ielt8 () ) return 0;

  if ( !front ) {
    setTimeout ( initie, 100 );
    return;
  }

  next = nextCircleElement ( front );
  next2 = nextCircleElement ( next );
  previous = previousCircleElement ( front );
  previous2 = previousCircleElement ( previous );

  front.style.left = '-170px';
  next.style.left = ( 210 - 170 * ( 1 - 420 / 1400 ) ) + 'px';
  previous.style.left = ( -210 - 170 * ( 1 - 420 / 1400 ) ) + 'px';
  next2.style.left = ( 345 - 170 * ( 1 - 690 / 1400 ) ) + 'px';
  previous2.style.left = ( -345 - 170 * ( 1 - 690 / 1400 ) ) + 'px';
}

init ();