// Define scroll data for images
var introObj = {};

introObj[1] = {};
introObj[2] = {};
introObj[3] = {};
introObj[4] = {};

// Set scroll duration
introObj[1]['duration'] = 4500;
introObj[2]['duration'] = 4500;
introObj[3]['duration'] = 11000;
introObj[4]['duration'] = 4500;

// Set scroll target
introObj[1]['target'] = '100%';
introObj[2]['target'] = '0%';
introObj[3]['target'] = '0%';
introObj[4]['target'] = '100%';

// Set scroll axis
introObj[1]['axis'] = 'x';
introObj[2]['axis'] = 'x';
introObj[3]['axis'] = 'y';
introObj[4]['axis'] = 'x';

var $j = jQuery.noConflict();

$j(document).ready(function() {
  $j(function() {

    // Define first typing example:
    new TypingText(document.getElementById("introtext"));
    
    // Type out examples:
    TypingText.runAll();
    
    // Start slideshow after timeout
    var timeout = window.setTimeout(function() {
      $j('#introtext').fadeOut(1000, function() {
        flipImage(1);
        $j('.watermark').fadeIn(1000);
      }); 
    }, 6500);
  });
});
    
    
function flipImage(i) {
  // Reset scroll position
  resetImage(i);
  
  // Scroll image
  scrollImage(i);
}


function resetImage(i) {
  // Show image
  $j('#image' + i).fadeIn(1000);

  // Get start position
  start = (introObj[i]['target'] == '100%') ? '0%' : '100%';
  
  // Scroll to start position
  $j('#image' + i).parent().scrollTo(start, 0);
}


function scrollImage(i) {
  // Set pointer to next or first image
  j = (i == 4) ? 1 : i+1;
  
  $j('#image' + i).parent().scrollTo(introObj[i]['target'], {
    duration: introObj[i]['duration'],
    axis: introObj[i]['axis'],
    onAfter: function() { 
      $j('#image' + i).fadeOut(1000);
      flipImage(j);
    }
  });
}