// JavaScript Document

$(document).ready(function () {
	var leftCurrent = parseInt($('#videoIdentifier').css('left'));
	var leftGoal;
	var leftClick;
	
	$('#videoControls > #videoButton').click(function() {
		leftClick = $(this).attr('class');
		if (leftClick == 'vB-1') {
			$('#videoIdentifier').animate({'left': 6}, 500);
			changeVideo(1);
			changeCaption(1);
		}
		else if (leftClick == 'vB-2') {
			$('#videoIdentifier').animate({'left': 93}, 500);
			changeVideo(2);
			changeCaption(2);
		}
		else if (leftClick == 'vB-3') {
			$('#videoIdentifier').animate({'left': 180}, 500);
			changeVideo(3);
			changeCaption(3);
		}
		else if (leftClick == 'vB-4') {
			$('#videoIdentifier').animate({'left': 267}, 500);
			changeVideo(4);
			changeCaption(4);
		}
	});
	
	function changeCaption (capValue) {
		var capIdOld = parseInt($('#videoIdentifier').css('left'));
		
		var capOld;
		switch (capIdOld) {
			case 6: capOld = 'caption_01'; break;
			case 93: capOld = 'caption_02';break;
			case 180: capOld = 'caption_03';break;
			case 267: capOld = 'caption_04';break;
			default: break;
		}
		
		var capNew = 'caption_0' + capValue;
		
		$('#' + capOld).css('display', 'none');
		$('#' + capNew).css('display', 'block');
	}
	
    function changeVideo (vidValue) {
        var vidIdOld = parseInt($('#videoIdentifier').css('left'));
        
        var vidOld;
        switch (vidIdOld) {
            case 6: vidOld = 'videoContent_01'; break;
            case 93: vidOld = 'videoContent_02';break;
            case 180: vidOld = 'videoContent_03';break;
            case 267: vidOld = 'videoContent_04';break;
            default: break;
        }
        
        var vidNew = 'videoContent_0' + vidValue;
        
		$('#' + vidOld).get(0).stopVideo();
		
        $('#' + vidOld).css('display', 'none');
        $('#' + vidNew).css('display', 'block');

    }
});