// Setup variables for objects
var categoryList;
var videoTranscript;
var contentData;
var actionTabs;

// How do we handle the action items when very first clicked (its like a 3 stage accordion)
var actionItems = {
	resetCaller: function(id) {
		actionItems.reset({'id': id});
	},
	
  reset: function(event) {
		
    id = (event.id) ? event.id : $(event.currentTarget).id;

    var containers = [];

  }
};

// Load everything we need for the Video System
var videoSystem = {
  initialize: function() {

    Event.observe('content_transcripts_title', 'click', videoSystem.hideScrollbars);

    contentData = new Accordion('content_container_data', {toggleWithPrevious: true});

    $('content_list_content').setStyle({
      height: '233px',
      display: 'block'
    });
    
    contentData.showAccordion = $('content_list_content');
     
    actionItems.boundReset = actionItems.reset.bindAsEventListener(actionItems);

	},
	
	loadingContactForm: function() {
		$('contact_wrapper').innerHTML = '<div class="loading_spinner"><img src="/video/images/player/form_loading.gif" alt="loading" /></div>'
	},
	
	loadingEmailToAFriend: function() {
		$('email_friend_wrapper').innerHTML = '<div class="loading_spinner"><img src="/video/images/player/form_loading.gif" alt="loading" /></div>'
	},
	hideScrollbars: function() {
	  if (!videoSystem.transcriptOpen) {
      window.setTimeout("$('content_transcript').addClassName('open')", 450);
	    videoSystem.transcriptOpen = true;
	  } else {
		  $('content_transcript').removeClassName('open');
	    videoSystem.transcriptOpen = false;
	  }
	  
	}
	
};

// Setup the observer
Event.observe(window, 'load', videoSystem.initialize, false);

function debug(msg) {
	alert(msg);
}