/* PimDerks is HTML5 based and IE7 has trouble selecting HTML5 elements */ 

/**
 * This class handles all main JavaScript functionality
 */

 var $p = jQuery.noConflict();

 
$p.pimderks = 
{
	
	/**
	 * Perform initialization, which main responsibility is to set-up the event
	 * listeners
	 */
	init: function() {	
		
		// HTML5 placeholder fallback for older browsers
		$p('*[placeholder]').each(function(){
			var value = $p(this).val();
			var placeholder = $p(this).attr("placeholder");
			if(value == '' || value == placeholder){
				$p(this).val($p(this).attr("placeholder")).addClass('placeholder');
			}
		});
		
		$p('*[placeholder]').bind('focus',function(){
			var value = $p(this).val();
			var placeholder = $p(this).attr("placeholder");
			if(value == placeholder){
				$p(this).val('').removeClass('placeholder');
			}
		}),
		
		$p('*[placeholder]').bind('blur',function(){
			var value = $p(this).val();
			var placeholder = $p(this).attr("placeholder");
			if(value == ''){
				$p(this).val(placeholder).addClass('placeholder');
			} else {
				$p(this).removeClass('placeholder');
			}
		}),
				  	
    	// Filter portfolio
    	$p('ul.filter li a').bind('click',function(){
    		var filter = $p(this).attr('class');
    		if(filter){
    			$p('ul.projects li:has(dt:not(.type.' + filter + '))').animate({opacity:0.4},500);
    			$p('ul.projects li:has(dt.type.' + filter + ')').animate({opacity:1.0},500);
    		} else {
    			$p('ul.projects li').show().animate({opacity:1},500);
    		}
    		$p('ul.filter li').removeClass("active");
    		$p(this).parent().addClass("active");
    		return false;
    	});   
    	
    	$p('a[href*="http"]').bind('click',function(){
	   		window.open($p(this).attr('href'));
    	    return false;	
    	});		
    	
    	// Portfolio highlights 
    	$p('div.highlights div').scrollable({size:1,items:'ol',keyboard:true,next:'li.next a',prev:'li.prev a'}).navigator({navi:'ul.highlights-items'});
    	$p('li.next a, li.prev a').bind('click',function(){ return false;});
    	
    	// Animate controls in highlights block
    	$p('li.next a').hover(function(){
    		$p(this).stop().css({backgroundPosition:'-394px 0px'}).animate({backgroundPosition:'-380px -55px'},500);	
    	},
    	function(){    	
    		$p(this).stop().css({backgroundPosition:'-380px -55px'}).animate({backgroundPosition:'-394px 0px'},500);	
    	});
    	
    	// Animate controls
    	$p('li.prev a').hover(function(){
    		$p(this).stop().css({backgroundPosition:'-340px -165px'}).animate({backgroundPosition:'-355px -111px'},500);	
    	},
    	function(){
    		$p(this).stop().css({backgroundPosition:'-355px -111px'}).animate({backgroundPosition:'-340px -165px'},500);	
    	});
    	
    	// Fancybox binding
    	$p("ul.projects a").fancybox(); 
    	
	}	
};

// Initialize the SOT object, which handles all initialization
$p(document).ready(function() {
	$p.pimderks.init();	
});