$(document).ready(function(){

	$('div.filterBar').bind('click', filterBar_Click);
	$('.customCheckbox').bind('click', function(event){event.preventDefault()});
	$('.customCheckbox').bind('CGEvent-select', updateURL_Select);
	$('.customCheckbox').bind('CGEvent-deselect', updateURL_Deselect);
	
	$('#assetSearchBtn').click(textSearch_click);
	
	if(window.location.hash && window.location.hash.length > 2){
		parseFilterURL();
	}
	else{
		runSearch();	
	}	
});

var oldHash = '';
var newHash = '';

function filterBar_Click(){
	var thisBar = $(this);
	if(!thisBar.hasClass('open') && !thisBar.hasClass('noCollapse')){
		thisBar.next('.filterContent').slideDown('fast');
		thisBar.addClass('open');
	}
	else if(!thisBar.hasClass('noCollapse')){
		thisBar.next('.filterContent').slideUp('fast', function(){thisBar.removeClass('open');});
	}
}
function textSearch_click(){
	window.location.hash = 'search='+$('#assetSearch').val();
	
	$('.customCheckbox .customCheckboxHolder').removeClass('selected');
	$('input.customCheckbox').removeAttr('checked');
	$('#allCheck .customCheckboxHolder').addClass('selected');
	$('input#all').attr('checked', 'checked');
	
	$('.list').html('');
	
	runSearch();
}
function updateURL_Select(){
	$('#assetSearch').val('')
	
	sender = $(this);
	var filterSlug =  sender.parent().parent().attr('slug');
	var checkboxSlug = sender.attr('slug');
	
	
	
	//dont update the URLs for all and popular, just select them and run the search against them
	if (checkboxSlug == 'all') {
		$('#popularCheck .customCheckboxHolder').removeClass('selected');
		$('#popular').removeAttr('checked');
	}
	else if (checkboxSlug == 'popular'){
		$('#allCheck .customCheckboxHolder').removeClass('selected');
		$('#all').removeAttr('checked');
	}
	else{	
		window.location.hash = filterSlug + '=' + checkboxSlug;
	}
	updateCriteriaList();
}

function updateURL_Deselect(){
	sender = $(this);
	var filterSlug =  sender.parent().parent().attr('slug');
	
	var checkboxSlug = sender.attr('slug');
	if (checkboxSlug == 'all') {
		$('#popularCheck .customCheckboxHolder').addClass('selected');
		$('#popular').attr('checked', 'checked');
	}
	else if (checkboxSlug == 'popular'){
		$('#allCheck .customCheckboxHolder').addClass('selected');
		$('#all').attr('checked', 'checked');
	}
	else {
		window.location.hash = '';
	}
	
	updateCriteriaList();
		
}

function parseFilterURL(){
	var hash = window.location.hash;
	hash = hash.replace('#', '');
	hash = hash.split('=');
	
	if (hash[0] == 'search') {
		$('#assetSearch').val(hash[1]);
	}
	else if(hash[0] == 'assetid'){
		getAssetContent(hash[1]);	
	}
	else {
		var filterContainer = $('.filterContainer[slug="' + hash[0] + '"]')
		filterContainer.children('.filterBar').addClass('open')
		filterContainer.children('.filterContent').slideDown('fast');
		
		//$('#' + hash[1] + 'Check').trigger('click');
		$('#' + hash[1] + 'Check .customCheckboxHolder').addClass('selected');
		$('#' + hash[1]).attr('checked', 'checked');
	}
	updateCriteriaList();
}

function updateCriteriaList(){
	var string = '';
	var length = $('label.customCheckbox').children('.customCheckboxHolder.selected').length;
	
	var num = 0;
	$.each($('label.customCheckbox .customCheckboxHolder.selected'), function(i){
		if(i < (length -1))
			string += $(this).next('.text').html() +', ';
		else
			string += $(this).next('.text').html();
		
	});
	$('#currentCriteriaContainer .list').html(string);
	
	setTimeout(function(){runSearch();}, 200);
}



function runSearch(){
	var selection = $("input[name='selection']:checked").val();
	var searchStr = $('#assetSearch').val();
	
	var collectionIDList = '';
	var collectionCheckedLength = $("input[name='collections']:checked").length -1;
	$.each($('input[name="collections"]:checked'), function(i){
		if(i < collectionCheckedLength)
			collectionIDList += $(this).val() +',';
		else
			collectionIDList += $(this).val();	
	});
	
	var categoryIDList = '';
	var categoryCheckedLength = $("input[name='category']:checked").length -1;
	$.each($('input[name="category"]:checked'), function(i){
		if(i < categoryCheckedLength)
			categoryIDList += $(this).val() +',';
		else
			categoryIDList += $(this).val();	
	});
	
	var subjectsIDList = '';
	var subjectsCheckedLength = $("input[name='subjects']:checked").length -1;
	$.each($('input[name="subjects"]:checked'), function(i){
		if(i < subjectsCheckedLength)
			subjectsIDList += $(this).val() +',';
		else
			subjectsIDList += $(this).val();	
	});
	
	
	var timelineIDList = '';
	var timelineCheckedLength = $("input[name='timeline']:checked").length -1;
	$.each($('input[name="timeline"]:checked'), function(i){
		if(i < timelineCheckedLength)
			timelineIDList += $(this).val() +',';
		else
			timelineIDList += $(this).val();	
	});
	
	var mediatypeIDList = '';
	var mediatypeCheckedLength = $("input[name='mediatype']:checked").length -1;
	$.each($('input[name="mediatype"]:checked'), function(i){
		if(i < mediatypeCheckedLength)
			mediatypeIDList += $(this).val() +',';
		else
			mediatypeIDList += $(this).val();	
	});
	
	$('#resultsContainer').prepend('<div style="background:#fff; padding:4px; position:absolute; top:10px; left:10px;">Loading...</div>');
	$('#resultsContainer .result').css('display', 'none');
	
	$.ajax({
		type: "POST",
		url: "/_commongoal/util/AssetsAjax.cfc",
		dataType: "text",
		data: {
		   method: 'getAssets',
		   selection: selection,
		   searchStr: searchStr,
		   collectionIDList: collectionIDList,
		   categoryIDList: categoryIDList,
		   subjectsIDList: subjectsIDList,
		   timelineIDList: timelineIDList,
		   mediatypeIDList: mediatypeIDList,
		   publicAssets: 1
		},
		success: displayResults
	});	
}

var displayResults = function(results){
	var html = '';
	results = eval(results);
	$.each(results, function(i, retItem){
		 html += '<div class="result" id="asset'+retItem.ASSETID+'">';
		 	var fileNameArray = retItem.ASSETFILE.split('.');
			var ext = fileNameArray[fileNameArray.length - 1];
			if(ext == 'gif' || ext == 'jpg' || ext == 'png'){
				html += '<a href="javascript:;" onclick="getAssetContent('+retItem.ASSETID+');"><img src="/documents/Assets/'+retItem.ASSETID+'&thumb" class="photo thumbnail" /></a>'
			}
			else if (ext == 'swf' || ext == 'flv'){
				//PUT SWF/flv PLACE HOLDER
				html += '<a href="javascript:;" onclick="getAssetContent('+retItem.ASSETID+');"><img src="/graphics/libraryBrowser/flashIcon.jpg" class="photo thumbnail" /></a>';
			}
			html += '<a href="javascript:;" class="title" onclick="getAssetContent('+retItem.ASSETID+');">'+retItem.ASSETNAME+'</a>'		 
		 html += '</div>';
	});
	
	if(results.length == 0) {
		html += '<div>No results found matching your criteria.</div>';
	}
	html += '<div class="clear"></div>';
	
	$('#resultsContainer').html(html);	  
	$('#resultsContainer .result').css('display', 'block');
}

function getAssetContent(id){
	var thisItem = $('#asset'+id+'');
	var assetID = thisItem.attr('id');
	if(assetID){
		assetID = assetID.replace('asset','')
	}
	newHash = '#assetid='+id;
	$.ajax({
		type: "POST",
		url: "/_commongoal/util/AssetsAjax.cfc",
		dataType: "text",
		data: {
		   method: 'getAsset',
		   assetID: id
		},
		success: openLightBox
	});
}








var lightbox;
var baseWidth;
var viewHeight;
var infoHeight;

var openLightBox = function(results){
	if (lightbox) 
		lightbox.remove();
	
	var result = eval(results);
	result = result[0];
	
	
	
	var assetFileName = result.ASSETID;
	var ext = result.ASSETFILE.split('.');
	ext = ext[ext.length - 1];
	
	oldHash = window.location.hash;
	window.location.hash = newHash;
	
	var boxHTML = '<div id="assetLightbox"><img src="/graphics/libraryBrowser/close_button.jpg" alt="Close" id="closeLightboxBtn" /><div class="window"><div class="viewInfoContainer"><div class="viewContainer">';
	
	
	if (ext == 'gif' || ext == 'jpg' || ext == 'png'){
		boxHTML += '<div class="asset"><img class="container" src="" alt="" /></div>';
	}
	else if (ext == 'swf'){
		boxHTML += '<div class="asset"><embed id="flashEmbed" class="container" src="" type="application/x-shockwave-flash" play="true" loop="true" menu="true" wmode="transparent"></embed></div>';
	}
	else if (ext == 'flv'){
		boxHTML += '<div class="asset"><embed id="flashEmbed" class="container" width="300" height="200" src="/admin/dynamicapp/controls/frm/flv/cgwm_player.swf" flashvars="" type="application/x-shockwave-flash" play="true" loop="true" menu="true" wmode="transparent"></embed></div>';
	}
	
	boxHTML += '<div class="caption">'+result.DESCRIPTION+'</div><div class="clear"></div></div><!--viewContainer-->';
	
	
	boxHTML += '<div class="clear"></div></div><!--viewInfoContainer--></div><!--window--></div><!--lightbox-->';
	
	
	
	$('body').prepend(boxHTML);
	
	
	
	
	//do this  once the HTML is appended correctly
	lightbox = $('#assetLightbox');

	lightbox.find('tr:even').addClass('alt');
	
	//set correct width of lightbox by getting the asset inside's width.

	
	if (ext == 'gif' || ext == 'jpg' || ext == 'png') {
		lightbox.find('.container').attr('src', '/documents/Assets/' + assetFileName + '');
		lightbox.find('.container').load(asset_load);
	}
	else{
		$.ajax({
			url: '/documents/Assets/' + assetFileName,
			success: function(){
				if(ext == 'swf' || ext == 'gif' || ext == 'jpg' || ext == 'png')
					lightbox.find('.container').attr('src', '/documents/Assets/' + assetFileName + '');
				else if(ext == 'flv'){
					lightbox.find('.asset').html('<embed width="300" height="200" id="flashEmbed" class="container" src="/admin/dynamicapp/controls/frm/flv/cgwm_player.swf" flashvars="source=/documents/Assets/' + assetFileName+'" type="application/x-shockwave-flash" play="true" loop="true" menu="true" wmode="transparent"></embed>');
				}
				asset_load();
			}
		});
		
	}
	
	
	//after all content and sizing has been added - fade in
	var pageveil ='<div id="pageVeil" class="hidden"></div>';
	$('body').prepend(pageveil);
	toggleVeil();
	
	
	$('#closeLightboxBtn').click(function(){
		lightbox.fadeOut(1500);
		toggleVeil();
		lightbox.remove();
		window.location.hash = oldHash;
	});
	
	
	
	//lightbox.fadeIn(2000);
	
}

function asset_load(){
	
	//show it first off screen for it to calc height, then turn it off, reset the left position
	lightbox.css('left', '-10000px');
	lightbox.css('display', 'block');
	
	baseWidth = lightbox.find('.container').width()
	lightbox.width(baseWidth + 30);
	//set the window that contains the scroller
	lightbox.find('.window').width(baseWidth + 30);
	//get the scroll container too be the correct widths
	lightbox.find('.viewInfoContainer').width((baseWidth+30)*2);
	//basic viewport width
	lightbox.find('.viewContainer').width(baseWidth);
	//accounts for some padding and margin styles
	lightbox.find('.infoContainer').width(baseWidth + 16);
	//figure in the button width to get the caption
	lightbox.find('.caption').width(baseWidth - 140);
	
	//check for minimums
	if((baseWidth+30) < 200){
		
		lightbox.width(400);	
		$('.photo').css('margin', '0 auto 12px auto');
		lightbox.find('.window').width(400);
		lightbox.find('.viewInfoContainer').width(802);
		lightbox.find('.viewContainer').width(400 - 30);
		
		lightbox.find('.infoContainer').width(390);
		lightbox.find('.caption').width(228);
		baseWidth = 371;
		
	}
	
	viewHeight = lightbox.find('.viewContainer').outerHeight();
	
	lightbox.height(viewHeight);
	
	
	//correct position based on height and width - do negative margins
	var leftPos = lightbox.find('.window').width()/2;
	var topPos = lightbox.find('.window').height()/2;
	
	lightbox.css('marginLeft', '-'+leftPos+'px');
	lightbox.css('marginTop', '-'+topPos+'px');
	
	lightbox.css('display', 'none');
	lightbox.css('left', '50%');
	
	
	lightbox.fadeIn(2000);
	
	
}

function toggleVeil(){
	$('#pageVeil').height($(document).height());
	if($('#pageVeil').hasClass('hidden')){
		$('#pageVeil').css('opacity', 0);
		$('#pageVeil').show();
		$('#pageVeil').fadeTo(500, .5);
		$('#pageVeil').removeClass('hidden');
		
		$('#pageVeil').addClass('visible');
	}
	else{
		$('#pageVeil').fadeOut('fast', function(){
			$('#pageVeil').removeClass('visible');
			$('#pageVeil').addClass('hidden');										
		});	
		
	}
}