// Place your application-specific JavaScript functions and classes here
// This file is automatically included by javascript_include_tag :defaults
jQuery.preloadImages = function()
{
  for(var i = 0; i<arguments.length; i++)
  {
    jQuery("<img>").attr("src", arguments[i]);
  }
}
$(function(){
	
	$.preloadImages("mainNav_Blog.gif", "mainNav_Blog_dwn.gif", "mainNav_Blog_hvr.gif", "mainNav_Design.gif", "mainNav_Design_dwn.gif", "mainNav_Design_hvr.gif", 
	"mainNav_ForSale.gif", "mainNav_ForSale_dwn.gif", "mainNav_ForSale_hvr.gif", "mainNav_Illustration.gif", "mainNav_Illustration_dwn.gif", "mainNav_Illustration_hvr.gif", 
	"mainNav_Miscellaneous.gif", "mainNav_Miscellaneous_dwn.gif", "mainNav_Miscellaneous_hvr.gif", "mainNav_Sequential.gif", "mainNav_Sequential_dwn.gif", "mainNav_Sequential_hvr.gif", 
	"mainNav_Type.gif", "mainNav_Type_dwn.gif", "mainNav_Type_hvr.gif" );
	
	//SET LEFT NAV SELECTED STATE FOR CURRENT PAGE
	var homeState = $(document.body).attr('id');
	if (homeState != '') {
		$('#nav a img#' + homeState).attr('src', '/images/mainNav_' + homeState + '_hvr.gif');
		$('#av a img#' + homeState).parent('a').addClass('selected');
	}	
	
	// DYNAMIC WIDTH
	var cWidth = 0
	$(window).load(windowDo)
	function windowDo(){
		$('.imageSection').each(function(){
			cWidth = cWidth + $(this).find('img').width() + 31;
			$('#contentInner').css('width', cWidth);
			var cMarg = Math.floor((450 - $(this).find('img').height())/2);
			$(this).find('img').css('margin-top', cMarg);
			$(this).find('.caption').css('width', ($(this).find('img').width() + 10))
		})
		if ($(document.body).width() > (cWidth + 260)) {
			$('#content').css('overflow-x', 'hidden')
		}
		$('#content').css('visibility', 'visible');
	}
	
	/* (ANTIQUATED) DYNAMIC VERTICAL SPACING
	var cPad = Math.floor(($(document.body).height() - 525)/2) + 25;
	if (cPad > 0){
		$('#content').css('padding-top', cPad);
		$('#mainNavContain').css('margin-top', cPad)
	}*/
	
	/*$(window).resize(function(){
		var cPad = Math.floor(($(document.body).height() - 525)/2) + 25;
		if (cPad > 0) {
			$('#content').css('padding-top', cPad);
			$('#mainNavContain').css('margin-top', cPad)			
		}
	});*/
	
	/* PLACEMENT OF PREV/NEXT PAGE LINKS
	$('.pagination').show();
	$('.prev_page').css('margin-left', Math.floor($(document.body).width()/2) - 55).show();
	$(window).resize(function(){
		$('.prev_page').css('margin-left', Math.floor($(document.body).width()/2) - 55);
		if ($(document.body).width() > (cWidth + 260)) {
			$('#content').css('overflow-x', 'hidden');
		} else {
			$('#content').css('overflow-x', 'scroll')
		}
	})*/
	
	// MAIN NAV IMAGE REPLACE	   
	$('#nav a img').live('mouseover mouseout', function(event){
		var id = $(this).attr('id');
		var repl = '/images/mainNav_' + id + '_hvr.gif';
		var norm = '/images/mainNav_' + id + '.gif';
		var down = '/images/mainNav_' + id + '_dwn.gif'
		if (event.type == 'mouseover') {
			$('#' + id).attr('src', repl);
		  } else {
			$('#' + id).attr('src', norm);
		  }
	});
	
	// PAGINATION IMAGE REPLACE
	$('.pagination a img').live('mouseover mouseout', function(event){
		var title = $(this).attr('title');
		if (title == 'Next Page') { title = 'next' } else { title = 'prev' }
		var norm = '/images/' + title + '_page.png';
		var repl = '/images/' + title + '_page_hvr.png';
		var down = '/images/' + title + '_page_dwn.png';
		if (event.type == 'mouseover') {
			$('.' + title + '_page img').attr('src', repl);
		} else {
			$('.' + title + '_page img').attr('src', norm);
		} 
	});
	
	// ... FOR ONCLICK
	$('#nav a img').live('mousedown mouseup', function(event){
		var id = $(this).attr('id');
		var repl = '/images/mainNav_' + id + '_hvr.gif';
		var norm = '/images/mainNav_' + id + '.gif';
		var down = '/images/mainNav_' + id + '_dwn.gif'
		if (event.type == 'mousedown') {
			$('#' + id).attr('src', down)
		} else {
			$('#' + id).attr('src', repl);
		}
	});
	
	// PAGINATION IMAGE REPLACE ... FOR ONCLIC
	$('.pagination a img').live('mousedown mouseup', function(event){
		var title = $(this).attr('title');
		if (title == 'Next Page') { title = 'next' } else { title = 'prev' }
		var norm = '/images/' + title + '_page.png';
		var repl = '/images/' + title + '_page_hvr.png';
		var down = '/images/' + title + '_page_dwn.png';
		if (event.type == 'mousedown') {
			$('.' + title + '_page img').attr('src', down);
		} else {
			$('.' + title + '_page img').attr('src', repl);
		} 
	});
	
	// CONTACT INFO IMAGE REPLACE
	$('#contactImg img').live('mouseover mouseout', function(event){
		if (event.type == 'mouseover') {
			$(this).attr('src', '/images/mainNavBG_Bot_hvr.gif')
		} else {
			$(this).attr('src', '/images/mainNavBG_Bot.gif')
		}
	});
	
	// LEFT NAV TOP IMAGE REPLACE
	$('#mainNavTop img').live('mouseover mouseout', function(event){
		if (event.type == 'mouseover') {
			$(this).attr('src', '/images/mainNavBG_Top_hvr.gif')
		} else {
			$(this).attr('src', '/images/mainNavBG_Top.gif')
		}
	});
	
	// CONTACT INFO SHOW/HIDE
	$('a#contactImg').toggle(function(){
		$('#contactBox').fadeIn({duration: 500});
	}, function(){
		$('#contactBox').fadeOut({duration: 500});
	});
	
	// CAPTION REVEAL
	$('.imageSection').hover(function(){  
	    $('.caption', this).stop().animate({height:'35px'},{queue:false,duration:300});  
	}, function() {  
		$('.caption', this).stop().animate({height:'0px'},{queue:false,duration:300});  
	});
	
	
	// SORT FUNCTIONALITY
	$('#sortList').dragsort({dragSelector: "div", dragEnd: saveOrder, placeHolderTemplate: "<li class='placeHolder'><div></div></li>"});
	$('#linkSortList').dragsort({dragSelector: "li", dragEnd: linkSaveOrder, placeHolderTemplate: "<li class='placeHolder'><div class='link'></div></li>"});
	function saveOrder() {
		$('#sortList li').each(function(i){
			$(this).find('input').attr('value', i + 1);
			$(this).find('.placement').replaceWith('<span class="placement">' + (i + 1) + '</span>')
		})
	}
	function linkSaveOrder() {
		$('#linkSortList li').each(function(i){
			$(this).find('input').attr('value', i + 1);
			$(this).find('.placement').replaceWith('<span class="placement">' + (i + 1) + '</span>')
		})
	}
	
})