// Plate Tectonics

$(document).ready(function() {
	// status and defaults
	// Main - News - Bio - Shows - Press - Photos - Music
  window.plates = [
  { name: '#title', height: 460, width: 340, left: 28, top: 28 },
  { name: '#news', height: 340, width: 340, left: 388, top: 28 },
  { name: '#bio', height: 220, width: 220, left: 748, top: 148 },
  { name: '#shows', height: 340, width: 460, left: 508, top: 388 },
  { name: '#press', height: 220, width: 220, left: 268, top: 508 },
  { name: '#photos', height: 220, width: 220, left: 28, top: 508 },
  { name: '#music',  height: 100, width: 100, left: 388, top: 388 }
  ];
  window.currentPlate = 0;
  window.newPlates = [];
  window.moveOrder = [0, 1, 2, 3, 4, 5, 6];
  
  $('#title').click(function() {
  	if (window.currentPlate != 0) {
		resetPlates();
	}
  });
  
  $('#news').click(function() {
	if (window.currentPlate != 1) {
		// resetPlates();
		newsPlate();
	}
  });
  
  $('#bio').click(function() {
	if (window.currentPlate != 2) {
		// resetPlates();
		bioPlate();
	}
  });
  
  $('#shows').click(function() {
	if (window.currentPlate != 3) {
		// resetPlates();
		showsPlate();
	}
  });
  
  $('#photos').click(function() {
	if (window.currentPlate != 5) {
		// resetPlates();
		photosPlate();
	}
  });
  
  $('#music').click(function() {
	if (window.currentPlate != 6) {
		// resetPlates();
		musicPlate();
	}
  });
  
  $('#press').click(function() {
	if (window.currentPlate != 4) {
	  resetPlates();
	  $('#press-more').fadeIn(800);
	  window.currentPlate = 4;
	}
  });
  
  $('#press-more').click(function() {
	  $('#press-more').fadeOut(800);
	  window.currentPlate = 0;
  });
  
  var playPause = 0;
  $('.audio-controls').click(function () {
  	if (playPause == 0) {
  		$(this).addClass("pause").removeClass("play");
  		document.getElementById('player').play();
  		playPause = 1;
  	} else {
  		$(this).addClass("play").removeClass("pause");
  		document.getElementById('player').pause();
  		playPause = 0;
  	}
  });
  
});

function plateSet(pOrder) {
	// count the number of animations (for queue delaying)
	var iNum = 0;
	
	for( i=0 ; i < pOrder.length ; i++ ) {
		var n = pOrder[i];

		var thisPlate = window.newPlates[Math.floor(n)];
		var thisPlateID = thisPlate["name"];
		var oldPlate = window.plates[Math.floor(n)];
		
		var aSeq = Math.round((n - Math.floor(n)) * 10);
				
		// animate only what needs to be changed
		switch (aSeq) {
			case 1:
				// animate
				$(thisPlateID).stop(true).delay(iNum*250).animate({
				  "height" : thisPlate["height"],
				  "top" : thisPlate["top"]
				}, 400, "swing").animate({
				  "width" : thisPlate["width"],
				  "left" : thisPlate["left"]
				}, 400, "swing");
				iNum++;
				break;
			case 2:
				// animate
				$(thisPlateID).stop(true).delay(iNum*250).animate({
				  "width" : thisPlate["width"],
				  "left" : thisPlate["left"]
				}, 400, "swing").animate({
				  "height" : thisPlate["height"],
				  "top" : thisPlate["top"]
				}, 400, "swing");
				iNum++;
				break;
			default:
				// animate
				$(thisPlateID).stop(true).delay(iNum*275).animate({
				  "height" : thisPlate["height"],
				  "top" : thisPlate["top"],
				  "width" : thisPlate["width"],
				  "left" : thisPlate["left"]
				}, 400, "swing");
				
		};
		// advance the delay amount
		iNum++;
	};
	window.plates = window.newPlates;
};

function resetPlates() {
  window.newPlates = [
  { name: '#title', height: 460, width: 340, left: 28, top: 28 },
  { name: '#news', height: 340, width: 340, left: 388, top: 28 },
  { name: '#bio', height: 220, width: 220, left: 748, top: 148 },
  { name: '#shows', height: 340, width: 460, left: 508, top: 388 },
  { name: '#press', height: 220, width: 220, left: 268, top: 508 },
  { name: '#photos',  height: 220, width: 220, left: 28, top: 508 },
  { name: '#music', height: 100, width: 100, left: 388, top: 388 }
  ];
  
  // set them in this order
	switch (window.currentPlate) {
	  case 1:
	    window.moveOrder = [1, 3, 4, 5, 6, 0];
    	$(".news-content").fadeTo(800, 0.25).css("overflow-y","hidden").animate({ "scrollTop": 0 }, 600, "swing");
	    break;
	  case 2:
	    window.moveOrder = [2.2, 3, 1, 6, 0];
        $(".shows-title").delay(1000).animate({"width" : 300}, 400, "swing");
	    break;
	  case 3:
	    window.moveOrder = [3, 4.2, 5, 6, 0];
    	$(".shows-content").fadeTo(800, 0.25).css("overflow-y","hidden").animate({ "scrollTop": 0 }, 600, "swing");
	    break;
	  case 5:
	    window.moveOrder = [5, 4.1, 3];
	    break;
	  default:
	    window.moveOrder = [6, 0];
	};
    plateSet(window.moveOrder);
    
  $(".newsfader").stop(true).delay(800).fadeIn(800);
  window.currentPlate = 0;
};

function newsPlate() {
  window.newPlates = [
  { name: '#title', height: 340, width: 340, left: 28, top: 28 },
  { name: '#news', height: 700, width: 340, left: 388, top: 28 },
  { name: '#bio', height: 220, width: 220, left: 748, top: 148 },
  { name: '#shows', height: 340, width: 220, left: 748, top: 388 },
  { name: '#press', height: 220, width: 340, left: 28, top: 508 },
  { name: '#photos', height: 100, width: 220, left: 28, top: 388 },
  { name: '#music', height: 100, width: 100, left: 268, top: 388 }
  ];
	// set them in this order
	switch (window.currentPlate) {
	  case 2:
	    window.moveOrder = [6, 5, 4, 2.2, 3.1, 1];
        $(".shows-title").delay(1600).animate({"width" : 300}, 400, "swing");
	    break;
	  case 3:
	    window.moveOrder = [3, 6, 5, 4.1, 1];
    	$(".shows-content").fadeTo(800, 0.25).css("overflow-y","hidden").animate({ "scrollTop": 0 }, 600, "swing");
	    break;
	  case 5:
	    window.moveOrder = [0, 6, 5.2, 4.1, 1];
	    break;
	  case 6:
	    window.moveOrder = [6, 5, 4, 3, 1];
	    break;
	  default:
	    window.moveOrder = [0, 6, 5, 4, 3, 1];
	};
	plateSet(window.moveOrder);
	
  $(".newsfader").stop(true).fadeOut(600);
  $(".news-content")
    .css("overflow-y","auto")
    .delay(1600)
    .fadeTo(1000, 0.99);
  window.currentPlate = 1;
};

function bioPlate() {
  window.newPlates = [
  { name: '#title', height: 340, width: 340, left: 28, top: 28 },
  { name: '#news', height: 100, width: 340, left: 388, top: 28 },
  { name: '#bio', height: 340, width: 580, left: 388, top: 148 },
  { name: '#shows', height: 220, width: 460, left: 508, top: 508 },
  { name: '#press', height: 220, width: 220, left: 268, top: 508 },
  { name: '#photos', height: 220, width: 220, left: 28, top: 508 },
  { name: '#music', height: 100, width: 340, left: 28, top: 388 }
  ];
	// set them in this order
	switch (window.currentPlate) {
	  case 1:
	    window.moveOrder = [1, 4, 5, 6, 3.2, 2.1];
    	$(".news-content").fadeTo(800, 0.25).css("overflow-y","hidden").animate({ "scrollTop": 0 }, 600, "swing");
        $(".shows-title").delay(1200).animate({"width" : 373}, 400, "swing");
	    break;
	  case 3:
	    window.moveOrder = [3.2, 4.2, 5, 1, 2.1, 6];
        $(".shows-title").delay(300).animate({"width" : 373}, 300, "swing");
    	$(".shows-content").fadeTo(800, 0.25).css("overflow-y","hidden").animate({ "scrollTop": 0 }, 600, "swing");
        $(".newsfader").stop(true).delay(600).fadeOut(250);
	    break;
	  case 5:
	    window.moveOrder = [5, 4.1, 3.2, 0, 6, 1, 2.1];
        $(".shows-title").delay(800).animate({"width" : 373}, 400, "swing");
        $(".newsfader").stop(true).delay(600).fadeOut(250);
	    break;
	  case 6:
	    window.moveOrder = [6, 3, 1, 2.1];
        $(".shows-title").delay(100).animate({"width" : 373}, 400, "swing");
        $(".newsfader").stop(true).delay(600).fadeOut(250);
	    break;
	  default:
	    window.moveOrder = [0, 6, 1, 3, 2.1];
        $(".shows-title").delay(600).animate({"width" : 373}, 400, "swing");
        $(".newsfader").stop(true).delay(600).fadeOut(250);
	};
	plateSet(window.moveOrder);
	
  window.currentPlate = 2;
};

function showsPlate() {
    window.newPlates = [
  { name: '#title', height: 340, width: 340, left: 28, top: 28 },
  { name: '#news', height: 340, width: 340, left: 388, top: 28 },
  { name: '#bio', height: 220, width: 220, left: 748, top: 148 },
  { name: '#shows', height: 340, width: 700, left: 268, top: 388 },
  { name: '#press', height: 100, width: 220, left: 28, top: 628 },
  { name: '#photos', height: 100, width: 220, left: 28, top: 508 },
  { name: '#music', height: 100, width: 220, left: 28, top: 388 }
  ];
	// set them in this order
	switch (window.currentPlate) {
	  case 1:
	    window.moveOrder = [1, 4.2, 5, 6, 3];
    	$(".news-content").fadeTo(800, 0.25).css("overflow-y","hidden").animate({ "scrollTop": 0 }, 600, "swing");
	    $(".newsfader").stop(true).fadeIn(400);
	    break;
	  case 2:
	    window.moveOrder = [2.2, 1, 6, 5, 4.1, 3.1];
	    $(".newsfader").stop(true).delay(600).fadeIn(400);
	    $(".shows-title").delay(2000).animate({"width" : 300}, 400);
	    break;
	  case 5:
	    window.moveOrder = [5.2, 4.1, 0, 6, 3];
	    break;
	  case 6:
	    window.moveOrder = [6, 5, 4.1, 3];
	    break;
	  default:
	    window.moveOrder = [0, 6, 5, 4.1, 3];
	};
	plateSet(window.moveOrder);
	
  $(".shows-content")
    .css("overflow-y","auto")
    .delay(1600)
    .fadeTo(1000, 1);
  window.currentPlate = 3;
};

function photosPlate() {
    window.newPlates = [
  { name: '#title', height: 460, width: 340, left: 28, top: 28 },
  { name: '#news', height: 340, width: 340, left: 388, top: 28 },
  { name: '#bio', height: 220, width: 220, left: 748, top: 148 },
  { name: '#shows', height: 340, width: 220, left: 748, top: 388 },
  { name: '#press', height: 100, width: 220, left: 508, top: 388 },
  { name: '#photos', height: 220, width: 700, left: 28, top: 508 },
  { name: '#music', height: 100, width: 100, left: 388, top: 388 }
  ];
	// set them in this order
	switch (window.currentPlate) {
	  case 1:
	    window.moveOrder = [1, 4.2, 6, 5.1, 0];
    	$(".news-content").fadeTo(800, 0.25).css("overflow-y","hidden").animate({ "scrollTop": 0 }, 600, "swing");
	    $(".newsfader").stop(true).fadeIn(400);
	    break;
	  case 2:
	    window.moveOrder = [2.2, 1, 3.1, 4.2, 6, 0, 5];
        $(".shows-title").delay(1100).animate({"width" : 300}, 400, "swing");
	    $(".newsfader").stop(true).delay(600).fadeIn(400);
	    break;
	  case 3:
	    window.moveOrder = [3, 4.2, 5, 6, 0];
    	$(".shows-content").fadeTo(800, 0.25).css("overflow-y","hidden").animate({ "scrollTop": 0 }, 600, "swing");
	    break;
	  case 6:
	    window.moveOrder = [3, 4.2, 6, 5, 0];
	    break;
	  default:
	    window.moveOrder = [3, 4.2, 5];
	};
	plateSet(window.moveOrder);
	
  window.currentPlate = 5;
};

function musicPlate() {
  window.newPlates = [
  { name: '#title', height: 340, width: 340, left: 28, top: 28 },
  { name: '#news', height: 340, width: 340, left: 388, top: 28 },
  { name: '#bio', height: 220, width: 220, left: 748, top: 148 },
  { name: '#shows', height: 340, width: 460, left: 508, top: 388 },
  { name: '#press', height: 220, width: 220, left: 268, top: 508 },
  { name: '#photos', height: 220, width: 220, left: 28, top: 508 },
  { name: '#music', height: 100, width: 460, left: 28, top: 388 }
  ];
    // set them in this order
	switch (window.currentPlate) {
	  case 1:
	    window.moveOrder = [1, 4, 5, 3, 6];
    	$(".news-content").fadeTo(800, 0.25).css("overflow-y","hidden").animate({ "scrollTop": 0 }, 600, "swing");
	    $(".newsfader").stop(true).fadeIn(400);
	    break;
	  case 2:
	    window.moveOrder = [2.2, 1, 6, 3];
        $(".shows-title").delay(1200).animate({"width" : 300}, 400, "swing");
	    $(".newsfader").stop(true).delay(800).fadeIn(400);
	    break;
	  case 3:
	    window.moveOrder = [3, 4.2, 5, 6];
    	$(".shows-content").fadeTo(800, 0.25).css("overflow-y","hidden").animate({ "scrollTop": 0 }, 600, "swing");
	    break;
	  case 5:
	    window.moveOrder = [0, 6, 5, 4.1, 3];
	    break;
	  default:
	    window.moveOrder = [0, 6];
	};
	plateSet(window.moveOrder);
	
   window.currentPlate = 6;
};
