/* jQuery controls for HV front */
// Vars for animation.
var obj_count;
var objchange_interval;
var intro_anim = 1;
// Vars for tracking random#.
var rannum_prev = 0;
var rannum_prev2 = 0;
var rannum_next = 0;

/* HTML for 1pixelout flash mp3-player: w/o mp3 url */
var audplay1 = '<big><object type="application/x-shockwave-flash" data="http://hearingvoices.com/news/wp-content/plugins/audio-player/assets/player.swf" width="400" height="24" id="audioplayer1"><param name="movie" value="http://hearingvoices.com/news/wp-content/plugins/audio-player/assets/player.swf" /><param name="FlashVars" value="playerID=1&amp;bg=0x111111&amp;leftbg=0x660000&amp;lefticon=0xefefef&amp;rightbg=0x6699cc&amp;rightbghover=0x3366ff&amp;righticon=0xefefef&amp;righticonhover=0xffffff&amp;text=0x111111&amp;slider=0x6C95A9&amp;track=0xFFFFFF&amp;border=0x80B3CC&amp;loader=0xE5EFF5&amp;autostart=yes&amp;soundFile=';
	
var audplay2 = '" /><param name="quality" value="high" /><param name="menu" value="false" /><param name="wmode" value="transparent" /><\/object><\/big>';

$(document).ready(function(){ 

	/* START jQuery MP3-play/Object-Animation (w/ img/text pulled from hidden HTML) */	
	/* Add rows of objects to DOM at top of page ('#obj_rows') */	
	$('.obj_html').each(function (i) {
		$('#obj_rows').append('<div class="obj_img"><\/div>'); // Add divs.
        var image = new Image();
		$('.obj_img:eq(' + i + ')').prepend(image); // Insert image objects in divs.
		// Get/set image attributes from html-data ('.obj_html').
		imgobj_src = $('.obj_html:eq(' + i + ') img').attr('src');
		imgobj_alt = $('.obj_html:eq(' + i + ') img').attr('alt');
		$('.obj_img:eq(' + i + ') img').attr('src', imgobj_src).attr('alt', imgobj_alt).attr('width', '170').attr('height', '85');
    });

	/* Add JavaScript-only objects, text, and styles */
	$('#obj_rows').before('<p id="info_win"><\/p>'); // Overlay-window (hid by styles.css).
	$('#obj_rows').css({'width' : '875px', 'padding-top' : '20px'});
	$('.obj_img').css({'float' : 'left'}); // Make row.
	$('.obj_img:eq(5)').css({'clear' : 'both'}); // Wrap to new row.
	$('.obj_img:eq(10)').css({'clear' : 'both'}); // Wrap to new row.
	// Fade images; add pointer.
	$('.obj_img img').css({'cursor' : 'pointer', 'padding' : '1px', 'opacity' : '0.4'});
	// Div for mp3-player and object-related html.
	$('#obj_info #audgraf').empty().append('<span id="click_pic"><br /><em>(click a pic above to hear story)<\/em><\/span>');
	$('#audgraf #click_pic').css({'color' : '#999', 'font-size' : '0.8em', 'margin-bottom' : '10px'});
	$('#obj_info').css({'padding' : '6px 0 20px 0', 'width' : '860px'});
	$('#obj_info h2').css({'margin-bottom' : '12px'});
		
	/* Call random number generator, which calls intro-animation */
	objchange_interval = setInterval(randomNum, 2000); //time in milliseconds
    
    /* Intro-animation */
    function objChanger(obj_num) {
    	// Darken previous image, light next one.
    	$('.obj_img img').animate({opacity: '0.4'}, 100);
		$('.obj_img:eq(' + obj_num + ') img').animate({opacity: '1.0'}, 100);
		// Get object-related text; show in pop-up overlay-win at top-left of object.		
		var objtitle = $('.obj_title:eq(' + obj_num + ') .story_title').text();
		var offset = $('.obj_img:eq(' + obj_num + ')').offset();
		$('#info_win').empty().text(objtitle).css({'top' : (offset.top + 45 + 'px'), 'left' : (offset.left + 'px')}).fadeIn(350);
		
		// Remember past two random numbers.
		rannum_prev2 = rannum_prev;
		rannum_prev = obj_num;
	}
 
	/* Get random number, based on number of objects (images) */
	obj_count = $('.obj_img').size();
 	function randomNum() {
 		if (intro_anim) {
 			rannum_next = Math.floor(Math.random()*obj_count);
 			// Don't repeat previous two random#'s.
 			if (rannum_next == rannum_prev || rannum_next == rannum_prev2) randomNum();
 				else objChanger(rannum_next);
 		}
 	}
	
	/* Delays hover until mouse moves (in case mouse is over object on-load. */
	$('#page').mousemove(function() { mouse = 1 });

	/* Add hover events to objects (images); stop Intro-animation */
	$('.obj_img img').hover(
		function() { // Mouseover: stop Intro-animation, show overlay-win.
			if (mouse == 1) {
				clearInterval(objchange_interval);
				var index = $('.obj_img img').index(this); // Get index# of hovered object.
				objChanger(index); // Send index# to animation function.
				window.status='Click image to hear the story.';return true; // Status bar text.
			}
		},	
		function() { // Mouseout: hide overlay-win, fade images.		
 //   		$('.obj_img img').animate({opacity: '0.3'}, 100);
//	     	$("#info_win").hide();
      		window.status='';return true; // Status bar text.
		}
	);

	/* Capture clicks; add mp3-player-div; play MP3 */
	$('.obj_img img').bind('click', function(e){	
		clearInterval(objchange_interval); // Stop intro-animation.
		$('#play_line').remove(); // Remove close-link line. 
		$("#info_win").hide(); // Hide overlay-win.
		e.stopPropagation();
		intro_anim = 0;
		index = $('.obj_img img').index(this);
		// Get mp3-url related to clicked object.
		var audplay_mp3 = $('.obj_title:eq(' + (index) + ') a').attr('href');
		// Insert flash player w/ mp3-url below object-rows.
		$('#obj_info #audplay').empty().html(audplay1 + audplay_mp3 + audplay2);
		// Insert object-related (by index#) html below object-rows.
		$('#obj_info #audgraf').empty().append($('.obj_html:eq(' + index + ')').html());
		$('#obj_info img').css({'float' : 'left', 'padding-right' : '10px'});
		$('#obj_info p').css({'margin' : '4px 0 4px 0'});
		// Add text/close-link line.
		$('#obj_info').prepend('<div id="play_line"><span id="play_now">Now Playing<\/span> <span id="play_close">[X]<\/span><br /><\/div>');
		$('#play_now').css({'color' : '#f3ebbe', 'font-size' : '1.1em', 'font-style' : 'italic', 'font-variant' : 'small-caps', 'margin-left' : '210px','float' : 'left'});
		$('#play_close').css({'color' : '#39F', 'font-size' : '0.9em', 'cursor' : 'pointer', 'float' : 'right'});
		$('#play_close').bind('mouseover',function() { // For close-link line.
			e.stopPropagation();
			window.status='Click to close this audio player.';return true;
		});
		$('#play_close').bind('mouseout',function(e) { // For close-link line..
			e.stopPropagation();
			window.status='';return true;
		});
		$('#play_close').bind('click',function(e) { // Click close-link empties mp3-player div.
			clearInterval(objchange_interval);
			e.stopPropagation();
			$('#audgraf, #audplay, #play_now, #play_close').empty();
			$('#obj_info #audgraf').empty().append('<span id="click_pic">(click a pic above to hear story)<\/span>');
			$('#click_pic').css({'color' : '#999', 'font-size' : '0.8em', 'font-style' : 'italic'});
			$('#audgraf').css({'margin' : '15px 0'});
			intro_anim = 1;
			objchange_interval = setInterval(randomNum, 2000); // Start intro-anim again.
		});
    });
	/* END jQuery MP3-play/Object-Animation */	
	
	/* jQuery: show/hide bottom/sidebar links */
	$('.showhide').hide();
	$('.showhide_click').append('&#177;').css({'display' : 'inline'});
	$('#jq_menu').css({'font-style' : 'italic'});
 	$('.showhide_click').hover(
 		function() {
    		$(this).css('color', '#39F');
    		window.status = 'Click to Open/Close Links'; return true;
  		},
  		function () {
    		$(this).css('color', '#f3ebbe');
    		window.status = ''; return true;
  		}
	);
 	 	
	$('.showhide_click').click(
		function(i) {
			var id = $(i.target).attr('id');
			$('#' + id + '_t').toggle();
 		}
 	); 	

	/* Show completed html ('body' hid by js in HTML); keep html-data hid. */
	$('body').css('display', 'block');
	$('.obj_html, #audtitle').css('display', 'none');
	
	$('.jq').show();
	
});