var animationStep1 = {
  start: {
    x:-250,
    y:0,
    angle:90
  },
  end: {
    x:-800,
    y:-320,
    angle:-90,
    length:.5
  }
}
var animationStep2 = {
  start: {
    x:-800,
    y:-320,
    angle:90
  },
  end: {
    x:-320,
    y:-220,
    angle:-90,
    length:.5
  }
}
var animationStep3 = {
  start: {
    x:-320,
    y:-220,
    angle:90
  },
  end: {
    x:-960,
    y:-680,
    angle:90,
    length:.8
  }
}
$(window).load( function() {
  $findService = $('#findService form');
  $('select[name=type], select[name=service]', $findService).attr('selectedIndex', 0);
  $('select[name=gender]', $findService).bind('change', function() {
    type = '#serviceType_'+$(this).val();
    if( !$(type+':visible').length ) {
      $(type)
        .attr('disabled','')
        .show()
        .attr('selectedIndex',0)
        .siblings('select')
        .attr('disabled','disabled')
        .hide();
      $('div.service:visible', $findService).slideUp();
    }
  });
  $('select[name=type]', $findService).bind('change', function() {
    if( $(this).val() != '' ) {
      $target = $('div.services_'+$(this).val(), $findService);
      $current = $('div.service:visible', $findService);
      if( $current.length ) {
        $current.hide().find('select').attr('disabled', 'disabled');
        $target.show();
      } else {
        $target.slideDown();
      }
      $('select', $target).attr('disabled', '');
    } else {
      $('div.service:visible', $findService).slideUp();
    }
  });
  $('#scrollIn').css('height','10px').fadeIn(100, function() {
    $(this).animate({'width': '100%'}, 1000,function() {
      $(this).animate({'height': '300px'}, 1200, function() {
        $('#images').show();
        $(this).delay(500).fadeOut(300);
        $('#animation').show().animate({path: new $.path.bezier( animationStep1 )},1800,'linear', function() {
          $(this).animate({path: new $.path.bezier( animationStep2 )},1600,'linear', function() {
            $(this).animate({path: new $.path.bezier( animationStep3 )},1600,'linear');
            $('img', this).delay(1100).fadeOut(250, function() {
              $('#imageLayers').fadeIn();
              $('body').data('slideshow', setInterval( "slideSwitch()", 4000 ) );
              $('#imageLayers li').click( function() {
                clearInterval( $('body').data('slideshow') );
                slideSwitch( $('#images *[rel=' + $(this).text() + ']') );
              });
            });
          });
        });
      });
    });
  });
});


function slideSwitch(element) {
  var $active = $('#images > :visible');
  if ( $active.length == 0 ) $active = $( '#images > :first' );
  if( element ) {
    var $next = element;
  } else {
    var $next = $active.next().length ? $active.next() : $( '#images > :first' );
  }
  if( !$next.is(':visible') ) {
    $('#imageLayers li[rel='+$next.attr('rel')+']').addClass('selected').siblings().removeClass('selected');
    $active.css('z-index', 1);
    $next.css('z-index', 2).fadeIn(800, function() {
      $active.fadeOut(800, function() { $next.css('z-index', 1); });
    });
  }
}