$(document).ready(function() {
	
	$('.popit').click(function () {
		window.open($(this).attr('href'));
		return false;
	});

// --------- Reel Player

	var playItem = 0;

	$("#jplayer_playlist").hide(); // show links to mp3 files if javascript is disabled

	$("#jquery_jplayer").jPlayer({
		ready: function() {
			playListInit(true); // Parameter is a boolean for autoplay.
		},
		volume: 100,
		swfPath: '/_flash',
		nativeSupport: true
	})
	.jPlayer("onSoundComplete", function() {
		playListNext();
	});

	$("#jplayer_previous").click( function() {
		playListPrev();
		return false;
	});

	$("#jplayer_next").click( function() {
		playListNext();
		return false;
	});

	function playListInit(autoplay) {
		if(autoplay) {
			playListChange( playItem );
		} else {
			playListConfig( playItem );
		}
	}

	function playListConfig( index ) {
		playItem = index;
		$("#jquery_jplayer").jPlayer("setFile", reelPlayList[playItem].mp3);
		// script switches display of #jplayer_pause and #jplayer_play automagically
		$("#jplayer_pause").html((index+1) + " of " + reelPlayList.length + ': ' + reelPlayList[playItem].name);
	}

	function playListChange( index ) {
		playListConfig( index );
		$("#jquery_jplayer").jPlayer("play");
	}

	function playListNext() {
		var index = (playItem+1 < reelPlayList.length) ? playItem+1 : 0;
		playListChange( index );
	}

	function playListPrev() {
		var index = (playItem-1 >= 0) ? playItem-1 : reelPlayList.length-1;
		playListChange( index );
	}
	
	$('.home #player p').hover(function() {
		b4 = $('#jplayer_pause').html();
		$('#jplayer_pause').html('pause');
	}, function() {
		$('#jplayer_pause').html(b4);
	});

// --------- Audio Player in Work section

	$(".audio #main a").click(function () {
		// remove any player already loaded and show all previously hidden content
		$("#single_player").jPlayer("stop"); // gotta stop player first 'cause IE is retarded
		$("#thumbs li strong, #single_player, .jp-single-player").remove();
		$("#thumbs li a").show();

		// Get audio file urls and track name
		var mp3 = $(this).attr('href');
		var file_no_ext = mp3.substr(0,mp3.lastIndexOf("."));
		var mp3_file = file_no_ext + '.mp3';
		var track_title = $(this).parent().find('a').first().html();
		
		// construct HTML for player
		var audio_player =
			  '<h4>' + track_title + '</h4>'
			+ '<div id="single_player"></div>'
			+ '<div class="jp-single-player">'
			+ '	<div class="jp-interface">'
			+ '		<ul class="jp-controls">'
			+ '			<li id="play" class="jp-play">play</li>'
			+ '			<li id="pause" class="jp-pause">pause</li>'
			+ '			<li id="volume_min" class="jp-volume-min">min volume</li>'
			+ '			<li id="volume_max" class="jp-volume-max">max volume</li>'
			+ '		</ul>'
			+ '		<div class="jp-progress">'
			+ '			<div id="load_bar" class="jp-load-bar">'
			+ '				<div id="play_bar" class="jp-play-bar"></div>'
			+ '			</div>'
			+ '		</div>'
			+ '		<div id="volume_bar" class="jp-volume-bar">'
			+ '			<div id="volume_bar_value" class="jp-volume-bar-value"></div>'
			+ '		</div>'
			+ '		<div id="jplayer_play_time" class="jp-play-time"></div>'
			+ '		<div id="jplayer_total_time" class="jp-total-time"></div>'
			+ '	</div>'
			+ '</div>';

		// swap thumnail with player
		$("#audio_player").html(audio_player);

		// setup player functionality
		var jpPlayTime = $("#jplayer_play_time");	// Local copy of jQuery selectors,
		var jpTotalTime = $("#jplayer_total_time");	// for performance
		$("#single_player").jPlayer({
			ready: function () {
				this.element.jPlayer("setFile", mp3_file).jPlayer("play");
			},
			volume: 75,
			swfPath: '/_flash',
			nativeSupport: true,
			customCssIds: true
		})
		.jPlayer("cssId", "play", "play")
		.jPlayer("cssId", "pause", "pause")
		.jPlayer("cssId", "loadBar", "load_bar")
		.jPlayer("cssId", "playBar", "play_bar")
		.jPlayer("cssId", "volumeMin", "volume_min")
		.jPlayer("cssId", "volumeMax", "volume_max")
		.jPlayer("cssId", "volumeBar", "volume_bar")
		.jPlayer("cssId", "volumeBarValue", "volume_bar_value")
		.jPlayer("onProgressChange", function(loadPercent, playedPercentRelative, playedPercentAbsolute, playedTime, totalTime) {
			jpPlayTime.text($.jPlayer.convertTime(playedTime));
			jpTotalTime.text($.jPlayer.convertTime(totalTime));
		})
		.jPlayer("onSoundComplete", function() {
			this.element.jPlayer("stop");
		});

		$(".audio #main a").removeClass('selected');
		$(this).addClass('selected');

		return false;
	});
	

// --------- Video PLayer
	var vid = $("#video_file").attr("href");
	var pstr = $("#video_file img").attr("src");
	$("#video").jPlayer({
		ready: function () {
			$(this).jPlayer("setMedia", {
				m4v: vid,
				poster: pstr,
		volume: 60
			});
		},
		ended: function (event) {
			$(this).jPlayer("stop");
		},
		swfPath: "/_flash/video",
		supplied: "m4v",
		backgroundColor: "#171b1b"
	});

	// show + hide controls
	$(".work #video_player").hover(
		function () {
			$(".work #video_player .jp-interface").fadeIn('slow');
		}, 
		function () {
			$(".work #video_player .jp-interface").fadeOut('slow');
		}
	);


// --------- Services

	$(window).hashchange( function(){ // hashchange plugin
		var hash = location.hash;
		// set default tab
		if (hash == '') {
			hash = $('#services_list a:first').attr('href');
		}
		// Iterate over all nav links, setting the "selected" class as-appropriate.
		$('#services_list a').each(function(){
			var that = $(this);
			// tab styling
			that[ that.attr( 'href' ) === hash ? 'addClass' : 'removeClass' ]( 'selected' );
			// show section
			$('.section').removeClass('selected');
			$(hash).addClass('selected');
		});
	})
	// Event is only triggered when hash changes so we need to init
	// the hash the page may have loaded with
	$(window).hashchange();


// --------- Clients

	// adds a sexy little fade on none selected items

	$('#industries a').hover(function() {
		$('#clients').addClass('fade');
		var same_class = $(this).attr('class');
		$("#clients ." + same_class).addClass('related');
	}, function() {
		$('#clients').removeClass('fade');
		$('#clients a').removeClass('related');
	});

	$('#clients a').hover(function() {
		$('#industries').addClass('fade');
		var same_classes = $(this).attr('class');
		// might be more than 1 class so we split into an array and build selector from it
		var classes = same_classes.split(' ');
		var selector = '';
		classes.forEach(function(i) { selector += ('#industries .'+i+',') });
		$(selector).addClass('related');
	}, function() {
		$('#industries').removeClass('fade');
		$('#industries a').removeClass('related');
	});
	
	// just to make sure the page doesn't jump...
	$("#clients a, #industries a").click(function() {
		return false;
	});

// --------- Information

	$('.scroll').jScrollPane();

// --------- Contact

	// Text Area Value

	$('#c_form textarea').focus(function() {	// clear default values and style accordingly
		if ($(this).html() == "Enter you message here") {
			$(this).html('');
			$(this).removeClass("nofocus");
		}
	});
	$('#c_form textarea').blur(function() {
		if ($(this).val() == "") {
			$(this).html('Enter you message here');
			$(this).addClass("nofocus");
		}
	});
	// VALIDATION
	// custom validation for anti-spam question
	jQuery.validator.addMethod("spam_bot", function(value, element) {
		return this.optional(element) || /^green$/i.test(value);
	}, "");

	// validate signup form on keyup and submit
	$("#c_form").validate({
		rules: {
			name: "required",
			email: {
				required: true,
				email: true
			},
			msg: "required",
			himitsu: { required: true, spam_bot: true }
		},
		messages: {
			name: "",
			email: "",
			msg: "",
			himitsu: ""
		}
	});

});