Learn how to use jQuery at the Blog

Bullet PR « visit

  • Added 7 months ago
  • 1229 Lines of Code shown
  • 3 Links of Interest
http://bulletpr.co.uk
Source Code Links of Interest
This is my Source Code and I don't want to show it here
View Source Code only (as overlay) 
// That code snippet belongs to Bullet PR - http://bulletpr.co.uk

/*
** MADE WITH LOVE BY
** PEPPERMINT & SUPERHEROES
** www.peppermnt.com 
** www.superhero.es
*/



jQuery(
  function ($) { 
	var URI 		= new URIParser($),
		$wrapper 	= $('div#wrapper');

	init();
	initNav();
	initContent();
	initScroller();
	
   	function init(){
   		
   		$body = $('html,body').attr('scrollTop',0);
   		
   		
   		
   		preload();
   		
   		$.ajaxSetup({
			cache: false,
			dataType: 'html',
			global: false,
			timeout: 5000
		});
   	}
   	
   	function preload(){
   		$wrapper
   			.css({height:0,overflow:'hidden'})
   		
     	$(window).bind('load',on_load)
   		
   	}
   	
   	
   	
   	function on_load(e){
		$wrapper
			.css({height:'auto',overflow:'auto'})
			
		$('div#preloader')
			.css({display:'none'})
			.remove();
			
   		if (URI.segment(1)!='')
   			$('body').triggerHandler('ACTIVATE_NAV',URI.segment(1));
   	}
   	
   	function initNav(){
   		new Nav($('div#navigation'));
   	}
   	
   	function initContent(){
   		new Content($('div#content'));
   	}
   	
   	function initScroller(){
   		new Scroller()
   	}

  }
);


function NavItem($self,index){
	
	var $btn 	= $self.find('a'),
		LINK 	= $btn.attr('rel'),
		ID 		= index;
	
	init();
	initListeners();
	
	function init(){
		$btn.bind('click',on_click)
		$btn.bind('mouseover',on_mouse_over)
		$btn.bind('mouseout',on_mouse_out)
	}
	function initListeners(){
		//$('body').bind('ACTIVATE_NAV',ACTIVATE_NAV);
		$('body').bind('TOP',ACTIVATE_NAV);
	}
	function on_click(e){
		$('body').triggerHandler('ACTIVATE_NAV',[LINK,ID])
	}
	function on_mouse_over(e){
		
	}
	function on_mouse_out(e){
	
	}
	
	function ACTIVATE_NAV(e,id){
		if (id==LINK){
			if (!$self.hasClass('active'))
				$self.removeClass().addClass('active')
		}else{
			if ($self.hasClass('active'))
				$self.removeClass();
		}
	}
	
}

function Nav($self){

	var active 		= true,
		_activenav 	= 'home',
	    $xpand 		= $('a#expand-collapse');
	    
	init();
	initListeners();
	
	function init(){
		
		
		new NavItem($('div#logo'),0)
		
		$xpand.bind('click',on_expand_collapse)
		$self.find('li').each(
			function (index){
				new NavItem($(this),index+1)
			});

		
	}
	
	function on_activate_nav(e,i){
		_activenav = i
	}		
	
	
	function initListeners(){
		$('body').bind('ACTIVATE_PORTFOLIO',HIDE);
		$('body').bind('DEACTIVATE_PORTFOLIO',SHOW);
		$('body').bind('ACTIVATE_VIDEO',HIDE);
		$('body').bind('ACTIVATE_NAV',on_activate_nav);
		
		$(window).bind('load',SHOW);
	}
	
	function on_expand_collapse(){
		if (active)
			COLLAPSE();
		else
			SHOW();
			
	}
	
	function SHOW(e){
		active=true;
		$self.unbind('mouseover',on_collapsed_mouse_over)
		$xpand.removeClass()
		$self.animate({bottom:-10},1000,'easeInOutQuad');
	}
	
	function COLLAPSE(){
		/*
		active=false;
		$xpand.removeClass().addClass('xpand');
	 	$self.animate({bottom:-135},1000,'easeInOutQuad',on_collapse_complete);
	 	*/
	} 
	
	function HIDE(e){
		COLLAPSE();
	}
	
	function on_collapse_complete (e) {
		$self.bind('mouseover',on_collapsed_mouse_over)
	}
	
	function on_collapsed_mouse_over (e) {
		SHOW()
	}
	
}

function Content($self){
	var _activeindex 	= 0,
		_activeid		= 'home'
		
	init();
	initListeners();
	
	function init(){
		new Home($('div#content-home'))
		new Portfolio($('div#content-work'));
		new About($('div#content-about'));
		new Contact($('div#content-contact'))
		new Blog($('div#content-client'));
	}
	
	function initListeners(){
		$('body').bind('ACTIVATE_NAV',CHANGE_SECTION);
		$(window).bind('resize',on_resize);
	}
	
	function CHANGE_SECTION(e,id,index){
		//set active for window resize
		
		_activeid = id
		_activeindex = index;
	
	}
	
	
	
	function on_resize(e){

	}
}

function Portfolio($self){

	init();
	initListeners();
	
	function init(){
		
		new PortfolioDetail($('div#portfolio-detail'));
		$self.find('div.work-items ul li a').each(initPortfolioItem);
	}
	
	function initListeners(){
		$('body').bind('ACTIVATE_PORTFOLIO',QUERY_PORTFOLIO);
		
	}
	
	function initPortfolioItem(index){
		new PortfolioItem($(this),index)
	}
	
	function QUERY_PORTFOLIO(e,id){
		
	}
}

function PortfolioItem($self,index){
	
	var ID 		= $self.attr('rel'),
		$IMG 	= $self.find('img');
	
	init();
	
	function init(){
		$self.bind('click',on_click)
		$self.bind('mouseover',on_mouse_over)
		$self.bind('mouseout',on_mouse_out)
	}
	
	function on_click(e){
		if (ID!="0")
			$('body').triggerHandler('ACTIVATE_PORTFOLIO',[ID])			
	}
	
	function on_mouse_over(e){
		$self
			.css( {backgroundPosition: "0 -26px"} )
			.stop()
			.animate({backgroundPosition:'(0 2px)'},{duration:250},'easeInOutQuart',show_image)
		$IMG
			.stop()
			.css({opacity:0,bottom:44})
			.animate({bottom:44},250)
			.animate({opacity:1,bottom:22})
	}
	function show_image(){

	}
	function on_mouse_out(e){
		$IMG.stop()
		$self.stop().animate({backgroundPosition:'(0 -26px)'},{duration:250})
	}
}

function PortfolioDetail($self){
	var $Content 			= $self.find('div#detail-content'),
		$BG					= $self.find('div#detail-bg'),
		$Next				= $self.find('a#next-btn'),
		$Prev				= $self.find('a#prev-btn'),
		$Close				= $self.find('a#close-btn'),
		$Clouds			 	= $('div#clouds'),
		$Masthead			= null,
		_active				= 0;
		_nextactive			= false,
		_prevactive			= false,
		_open				= false,
		_total				= 0;
		
	
	init();
	initListeners();
	
	function init(){
		
		$BG.bind('click',on_bg_click);
		$Close.bind('click',on_close_click)
		$Next.bind('click',on_next)
		$Prev.bind('click',on_prev)
	
	
		
	}
	
	function on_next(e){
		_active++
		if (_active>_total)
			_active=_total;
			
		check_nav();
			
		if (_active<=_total)
			$('body').triggerHandler('CHANGE_ITEM',_active)
		
		e.preventDefault();
	}
	
	function on_prev(e){
		_active--
		if (_active<0)
			_active = 0;
			
		check_nav();
		
		if (_active>=0)
			$('body').triggerHandler('CHANGE_ITEM',_active)
		
		e.preventDefault();
	}
	
	function check_nav(){
	
		var n_opacity = (_active<_total) ? 1 : .25
		var p_opacity = (_active>0) ? 1 : .25
		
		$Prev.css({opacity:p_opacity});
		$Next.css({opacity:n_opacity});
		
	}


	
	function initListeners(){
		$('body').bind('ACTIVATE_PORTFOLIO',query_portfolio);
		$('body').bind('ACTIVATE_NAV',close_portfolio);
	}
	
	function on_bg_click(e){
	
		e.preventDefault();
	}
	
	
	function query_portfolio(e,id){
	
		$Close.css({display:'block'})
		
//		$self.css({display:'block',opacity:0,height:0}).animate({opacity:1},1000,'easeInOutQuart',showDesign);
		$self.css({display:'block',height:0,top:'0'}).animate({height:'100%'},1200,'easeInOutQuart',showDesign);		
		$Clouds.css({top:-1*$Clouds.height()}).animate({top:0},1000,'easeInOutQuart')
		$BG.css({opacity:1});
		
		$(window).bind('wheel',on_scroll_wheel)
		
		
		$.ajax({
				beforeSend: function () {},
				data: {id:id,gateway:'detail'},
				error: function () {},
				success: on_query_success,
				url: 'gateway/gateway.php'
			});

	}
	
	function on_scroll_wheel(e,delta){
      e.preventDefault();
	}
	
	function on_query_success(response){
		$Content.html(response)
		initContent()
		
	}
	
	function showDesign(){
		$('body').triggerHandler('CHANGE_ITEM',[_active])
		$Content.css({opacity:1})
		showContent();
	}

	
	function showContent(){

		if (_total>=1){
			$Next.animate({right:50},1000,'easeInOutQuart');
			$Prev.animate({left:50},1000,'easeInOutQuart');
			check_nav();
		}

		$Masthead.css({opacity:0}).animate({opacity:1},12000,'easeInOutQuart',finish_intro)
		
	}
	
	function finish_intro(){
		
		$('body').triggerHandler('DETAIL_COMPLETE')
		
	}
	
	function initContent(){
	
		_active	= 0;
		_open 	= true
		_total = -1;
		
		$Masthead = $Content.find('div#detail-masthead').css({opacity:0});
		
		$Content
			.find('div.detail-item')
			.each(
				function(i){
					_total++;
					new DetailItem($(this),i);
				}
		)
		
		$Content
			.find('div#detail-masthead h2')
			.each(
				function(i){
					new DetailOption($(this))
				}
			);
	
	
	}
	
	
	
	function on_close_click(e){
		e.preventDefault()
		close_portfolio();
	}
	function close_portfolio(e){
		if (_open){
			
			$(window).unbind('wheel',on_scroll_wheel)
			$('body').triggerHandler('DEACTIVATE_PORTFOLIO',0)
			$Clouds.animate({top:-1*$Clouds.height()},750,'easeInOutQuart',complete_close)
			$Close.css({display:'none'})
			$Content.animate({opacity:0},750,'easeInOutQuart')
			$Next.animate({right:-150},750,'easeInOutQuart');
			$Prev.animate({left:-150},750,'easeInOutQuart');
		}
		
	}
	
	function complete_close(){
		$self.animate({top:'100%'},750,'easeInOutQuart',dispose);
	}
	
	function dispose(){
		_open = false
		$self.css({display:'none'});
	}
	
}


function DetailItem($self,index){
	var selfindex 	= index,
		is_video	= false,
		is_active	= false,
		$video_btn 	= null,
		$video_id	= 0,
		$video_img	= null;
		
	
	init();
	
	function init(){
		$('body').bind('CHANGE_ITEM',on_change);
		
		$self.css({
			overflow:'hidden',
			width:$(window).width(),
			height:$(window).height(),
			paddingLeft:0,
			position:'absolute',
			left:$(window).width()
			}
		)
		
		if ($self.hasClass('video'))
			init_video();
		
		$('body').bind('FLASH_CALLBACK',flash_callback)
		$(window).bind('resize',on_resize)
	}
	function init_video(){
		
		//alert('HAS VIDEO')
		is_video	= true;
		$video_btn 	= $self.find('a');
		$video_id 	= $video_btn.attr('rel');
		$asset_id	= $video_btn.attr('rev');
		$video_img	= $self.find('div.video-button')
		$video_btn.bind('click',on_video_click);
		
		
		
	}
	
	function on_resize(e){
		$self.css({
			overflow:'hidden',
			width:$(window).width(),
			height:$(window).height()
			}
		)
	}
	
	function on_video_click(e){
		is_active = true;
		
		$video_img.css({display:'none'})
		
		var flashvars = {
 			 movie:'/assets/user/video/' + $video_id
		};
			
		var params = {
			wmode: "transparent",
  			menu: "false",
  			allowFullScreen: "false"
		};
		$('div#inline-video-'+$asset_id).html('<div id="inline-video-'+$asset_id+'-flash"></div>')
		swfobject.embedSWF("/assets/flash/InlinePlayer.swf", 'inline-video-'+$asset_id+'-flash', "683", "384", "9.0.115", "/assets/flash/expressInstall.swf",flashvars,params);
		$('body').bind('DEACTIVATE_PORTFOLIO',close_video)
		e.preventDefault();
	}
	
	function flash_callback(e){
		close_video();
	}
	
	function close_video(){
		if (is_active){
			//alert('closeVideo')
			$('div#inline-video-'+$asset_id).html(' ' );
			$video_img.css({display:'block'})
			is_active=false
		}
		
	}
	
	function on_change(e,i,first){
		
		/*
		if ($(window).height() < 700)
			$self.find('img').css({height:400})
		*/
		
		if ($(window).height() < 850){
			if ($(window).height() < 650){
				$self.find('img').css({height:400})
			}else{
				var offset = Math.floor(($(window).height() - 650)/50) * 50
				$self.find('img').css({height:400+offset})
			}
			
		}
		

		if (i==selfindex){
			
			if (first)
				$self.css({left:0})
			else
				$self.animate({left:0},1200,'easeInOutQuart')
			
		}else{
			if (is_video==true)
				close_video();
				
			if (i>selfindex)
				$self.animate({left:$(window).width()*-1},1200,'easeInOutQuart')
			else
				$self.animate({left:$(window).width()},1200,'easeInOutQuart')
		}
	}
	
	
	
}

function DetailOption($self){
	var $btn 	= $self.find('a'),
		rel		= $btn.attr('rel'),
		rev		= $btn.attr('rev'),
		type	= $self.attr('class');
		
	init();
	
	function init(){
		switch (type){
			case 'audio':
				create_audio_player();
			break;
			
			case "link":
				create_link();
			break;
			
		}
	}
	
	function create_audio_player(){
		
		$self
			.css({height:13})
			.html('<div id="audio_player"></div>')
		
		var flashvars = {
 			 mp3:'/assets/user/audio/' + rel
		};
			
		var params = {
  			menu: "false",
  			allowFullScreen: "false"
		};

		$('body').bind('DETAIL_COMPLETE',function(){swfobject.embedSWF("/assets/flash/AudioPlayer.swf", 'audio_player' , "111", "11", "9.0.115", "/assets/flash/expressInstall.swf",flashvars,params);})
		$('body').bind('DEACTIVATE_PORTFOLIO',function(){$self.html(' ')})
		
	}
	
	function create_link(){
		$self.css({visibility:'hidden'})
		$btn.bind('click',on_link_click)
		$('body').bind('DETAIL_COMPLETE',function(){$self.css({visibility:'visible'})})
		$('body').bind('DEACTIVATE_PORTFOLIO',function(){$self.css({visibility:'hidden'})})
	}
	
	function on_link_click(e){
		window.open($btn.attr('href'),'_blank');
		e.preventDefault();
	}
	
	
}

function NewsletterSignup($self){
	var $btn 		= $self.find('a#newsletter-btn'),
		$submitbtn	= $self.find('a#newsletter-subscribe'),
		$form 		= $self.find('div#newsletter-form'),
		$nav 		= $self.find('div#newsletter-nav'),
		$xbtn		= $self.find('a#newsletter-close'),
		$formitems	= $self.find('div#newsletter-input'),
		$submitform = $self.find('form#FORM-NEWSLETTER'),
		$iframe		= $self.find('iframe'),
		active		= false;

	init()
	
	function init(){
		$('body').bind('TUNNEL',on_tunnel_event)
		$btn.bind('click',on_btn_click)
		$xbtn.bind('click',closeNewsletter)
		$submitbtn.bind('click',submit_newsletter)
		$formitems.find('input').each(
			function(){
				$(this).bind('focus',on_input_focus)
				$(this).bind('blur',on_input_blur)
			}
		);	
	}
	
	function on_tunnel_event(e,id){
		$formitems.html('<p class="thanks-newsletter">Thanks for signing up! You should receive a confirmation email shortly.</p>')
		$submitbtn.css({display:'none'})
	}
	function on_input_focus(e){
		if($(this).val()==$(this).attr('title'))
			$(this).val('')
	}
	
	function on_input_blur(e){
		if($(this).val()=='')
			$(this).val($(this).attr('title'))
	}
	
	function on_btn_click(e){
		if (active)
			closeNewsletter();
		else
			openNewsletter();
		
		e.preventDefault();
	}
	
	function closeNewsletter(){
	
		$formitems.css({display:'none'})
		
		$nav.animate({bottom:-50})
		
		$form
			.css({overflow:'hidden'})
			.animate({height:0})
			
		active=false;
		
	}
	
	function submit_newsletter(e){

		$iframe.unbind('load',iframe_load).bind('load',iframe_load)
		$submitform.submit();
		
		e.preventDefault();		
		
	}
	
	function iframe_load(e){
		
		$('body').triggerHandler('TUNNEL','newsletter')
	}
	
	function openNewsletter(){
		
		
		$formitems.css({display:'none'})
		
		$nav.css({bottom:-50})
		$form
			.css({height:0,overflow:'hidden'})
			.animate({height:125},1000,'easeInOutQuint',on_open_complete)
			
		active=true
	}
	
	function on_open_complete(e){
		$formitems.css({display:'block'})
		$nav.animate({bottom:3},250)
	}
}

function Contact($self){
	init()
	
	function init(){
		new NewsletterSignup($self.find('div#newsletter-signup'));
		$self
			.find('a.animated')
			.each(
				function(){
					new AnimatedLink($(this))
				}
			)
		
		$self
			.find('a.download')
			.each(
				function(){
					new DownloadLink($(this))
				}
			)
	}
	
	
}

function About($self){

	var $btn 	 	= $('a#about-play'),
		$content 	= $('div#about-flash'),
		video_file 	= $btn.attr('rel'),
		active		= false;
		
		 
	init();
	initListeners();
	
	function init(){
		
		$btn.bind('click',on_play_click);
		
	}

	function initListeners(){
		$('body').bind('ACTIVATE_NAV',ACTIVATE_NAV);
		$('body').bind('FLASH_CALLBACK',flash_callback)
		
	}
	
	function ACTIVATE_NAV(e,id){
		
		if (active)
			HIDE()

	}
	
	
	function on_play_click(){
		
		SHOW();
		$('body').triggerHandler('ACTIVATE_VIDEO')		
	}
	
	function SHOW(){
	
		active = true;
		
		$btn.css({display:'none'});
		
		var flashvars = {
 			 movie:'/assets/user/video/' + video_file
		};
			
		var params = {
			wmode: "transparent",
  			menu: "false",
  			allowFullScreen: "true"
		};

		swfobject.embedSWF("/assets/flash/VideoPlayer.swf", "about-flash", "100%", "630", "9.0.115", "/assets/flash/expressInstall.swf",flashvars,params);
	
	}
	
	function flash_callback(e){
		if (active)
			HIDE()
	}
	
	function HIDE(){
	
		active = false
		$btn.css({display:'block'})
		swfobject.embedSWF("null.swf", "about-flash", "100%", "1", "9.0.115", "/assets/flash/expressInstall.swf");
		$content.html('');
		
	}
}

function Blog($self){
	var $More = $self.find('div#more-posts');
		
	init();
	
	function init(){
		new MoreBlog($More);
		
		$self.find('div#blog-aux ul li a').each(initBlogCategory);
		
		
		$self
			.find('a.blogger')
			.each(
				function(){
					$(this).bind('click',function(){$('body').triggerHandler('CATEGORY',$(this).attr('rel'))})
				}
			)
			
		$self
			.find('p a')
			.bind(
				'click',
				function(e){
					window.open($(this).attr('href'),'_blank');
					e.preventDefault()
				}
			)
			
		$self
			.find('a.email')
			.each(
				function(){
					$(this)
						.bind('click',
							function(e){
								location.href='mailto:'+$(this).attr('rel')+'@legworkstudio.com';
								e.preventDefault();
							}
						)
				}
			)
	}
	
	function initBlogCategory(index){
		new BlogCategory($(this),index)
	}
}

function MoreBlog($self){
	
	var uri 		= 'gateway.php',
		active		= 0,
		active_cat	= 0,
		$Content 	= $('div#blog-posts'),
		$Btn		= $self.find('a');
	
	init();
	
	function init(){
		
		$Btn.bind('click',on_click)
		$('body').bind('BLOG_CATEGORY',set_category)
		$('body').bind('BLOG_CATEGORY_LOAD',init_more)
	}
	
	function set_category(e,i){
		active_cat = i;
		$self.css({display:'none'})
		active=0;
	}
	
	function init_more(){
		check_more();
	}
	
	function on_click(e){
		active++;
		
		$.ajax({
				beforeSend: on_send,
				data: {id:active_cat,gateway:'blog',_offset:active},
				error: function () {},
				success: on_query_success,
				url: 'gateway/'+uri
			});
			
		e.preventDefault();

	
	}
	
	function on_send(){
		//$Content.html('<img src="../img/load.gif" alt="Loading" />')
	}
	
	function check_more(){
		$Content
			.find('a#blog-ajax-'+active)
			.each(
				function(){
					
					if (parseInt($(this).attr('rel'))<=parseInt($(this).attr('rev')))
						$self.css({display:'none'})
					else
						$self.css({display:'block'})
				})
	}
	
	function on_query_success(response){
	
		
				
		$Content.append(response)
		
		check_more()
		
		$Content
			.find('a.blogger')
			.each(
				function(){
					$(this).bind('click',function(){$('body').triggerHandler('CATEGORY',$(this).attr('rel'))})
				}
			);
		
		$Content
			.find('p a')
			.bind(
				'click',
				function(e){
					window.open($(this).attr('href'),'_blank');
					e.preventDefault()
				}
			)
			
		$Content
			.find('a.email')
			.each(
				function(){
					$(this)
						.bind('click',
							function(e){
								location.href='mailto:'+$(this).attr('rel')+'@legworkstudio.com';
								e.preventDefault();
							}
						)
				}
			);
	}

	
}
function BlogCategory($self,index){
	
	
	var uri = 'gateway.php',
		id  = $self.attr('rel'),
		$Content = $('div#blog-posts');
	
	init();
	
	function init(){
		$('body').bind('CATEGORY',on_remote_click)
		$self.bind('click',on_click)
		new AnimatedLink($self)
	}
	
	function on_remote_click(e,cid){
		if (cid==id)
			on_click();
	}
	
	function on_click(e){
		$('body').triggerHandler('BLOG_CATEGORY',id)
		$.ajax({
				beforeSend: on_send,
				data: {gateway:'blog',id:id},
				error: function () {},
				success: on_query_success,
				url: 'gateway/'+uri
			});

	
	}
	
	function on_send(){

		$Content.html('<img src="../img/load.gif" alt="Loading" />')
	}
	
	function on_query_success(response){

		
		$Content.html(response)
		$('body').triggerHandler('BLOG_CATEGORY_LOAD')		
		
		$Content
			.find('a.blogger')
			.each(
				function(){
					$(this).bind('click',function(){$('body').triggerHandler('CATEGORY',$(this).attr('rel'))})
				}
			);
		$Content
			.find('p a')
			.bind(
				'click',
				function(e){
					window.open($(this).attr('href'),'_blank');
					e.preventDefault()
				}
			)
		$Content
			.find('a.email')
			.each(
				function(){
					$(this)
						.bind('click',
							function(e){
								location.href='mailto:'+$(this).attr('rel')+'@legworkstudio.com';
								e.preventDefault();
							}
						)
				}
			);
	}

	
}

function DownloadLink($self){
	var file = $self.attr('rel');
	
	init()
	
	function init(){
		$self.bind('click',on_click)
	}
	
	function on_click(e){
		if($('div#download-file'))
			$('div#download-file').remove()
		$('body').append('<div id="download-file"><iframe src="/gateway/download.php?file=' + file + '">/iframe></div>' )
		e.preventDefault();
	}
}

function AnimatedLink($self){
	init()
	
	function init(){
		$self.bind('mouseover',on_mouse_over).bind('mouseout',on_mouse_out);
	
	}
	
	function on_mouse_over(e){
		$self
			.css( {backgroundPosition: "0 -26px"} )
			.stop()
			.css({color:'#fff'})
			.animate({backgroundPosition:'(0 2px)'},{duration:250})
	}
	
	function on_mouse_out(e){
		$self
			.stop()
			.css({color:'#000'})
			.animate({backgroundPosition:'(0 -26px)'},{duration:250})
	}

}

function Home($self){
	var $imgwrapper  = $self.find('div.content-item'),
		$imgmap		 = $('map');
		
	init()
	function init(){
		$imgwrapper
			.css({opacity:1})
		
		$imgmap.find('area').bind('click',on_map_click)
		
	}
	
	function on_map_click(e){
		$('body').triggerHandler('ACTIVATE_NAV',$(this).attr('alt'))
		e.preventDefault();
	}
}
function Scroller(){
	
	if ($('body').attr('id')=='index')
		init();
	
	function init (){
		
		$('body').bind('ACTIVATE_NAV',on_activate_nav);
		$(window).bind('scroll',on_scroll)
	}
	
	function on_activate_nav(e,id){
		var position = $('div#content-'+id).offset().top;
		$body.stop().animate({scrollTop: position},1200,'easeInOutQuart',on_scroll_complete);
		
	}
	
	function on_scroll_complete(){
	}
	
	function on_scroll(e){
	
		var pos = ($.browser.safari) ? $('body').attr('scrollTop') : $body.attr('scrollTop')
	
		var content = new Array('home','work','about','clients','contact')
		
		for (var i=0;i<content.length;i++) {
			
			
			
			var $prevtop 	= (i==0) ? 0 : $('div#content-'+content[i-1]).offset().top;
			var $curtop 	= $('div#content-'+content[i]).offset().top;
	
			
			
			if ($curtop < pos+100 && pos+100>$prevtop){	
				$('body').triggerHandler('TOP',content[i])
			}
			
			
		}
			
	
		
	}
	
}


/*
**
** URI PARSING
**
*/

function URIParser($){
	
	this.Hash 			= location.hash;
	this.HashObjects	= this.Hash.split("/");
		
	initialize();
	
	function initialize(){
		
	}
	
}

URIParser.prototype.segment=function(id){
	if (this.HashObjects[id])
		return this.HashObjects[id];
	else
		return '';
}

/*
** FLASH
**
*/

function call_back(){
	$('body').triggerHandler('FLASH_CALLBACK');
}
  1. http://gsgd.co.uk/sandbox/jquery/easing/
  2. http://plugins.jquery.com/project/backgroundPosition-Effect
  3. http://plugins.jquery.com/project/mousewheel