jQuery(function($){
			var listHeight = 0 ;
			var loaded = false ;
			$(window).ready(function() {
				//alert("ready") ;
				posLoader() ;
				rotateLoader() ;
			}); 
			$(window).load(init) ;
			
			function init(){
				loaded = true ;
				showSite() ;
				initList() ;
				initContentUi() ;
				setScrollbar() ;
				initMouseWheel() ;
				initSideButtons() ;
				hideLoader() ;
				hashChange() ;
			}
			$(window).resize(function() {
				setScrollbar() ;
				posLoader() ;
			});
			$(window).bind( 'hashchange', hashChange) ;
			function hashChange(e){
				var hashArray = location.hash.split('/');
				var itemId = hashArray[2] ;
				if(itemId == undefined){
					/*item = $(".item#"+init_hash) ;*/
					itemId = init_hash ;
				}else{
					/*item = $(".item#"+itemId) ;*/
					_gaq.push(['_trackPageview', hashArray[1]+"/"+hashArray[2]]);
				}
				/*alert(itemId) ;*/
				openPage(itemId) ;
				setLeftAndRightButtons(itemId);
			}
			function setLeftAndRightButtons(itemId){
				var item = $(".item#"+itemId) ;
				var c = $(".item") ;
				var pos = c.index(item) ;
				var prevLink = item.prev().children(".rov").attr("href") ;
				var nextLink = item.next().children(".rov").attr("href") ;
				if(pos == 0){
					$("#prevRef").children().css("display","none") ;
				}else{
					$("#prevRef").children().css("display","block") ;
				}
				if(pos == (c.length -1) ){
					$("#nextRef").children().css("display","none") ;
				}else{
					$("#nextRef").children().css("display","block") ;
				}
				$("#prevRef").children().attr("href",prevLink) ;
				$("#nextRef").children().attr("href",nextLink) ;
				//alert(pos) ;
			}
			function posLoader(){
				$("#loader").css("top",($(window).height() - $("loader").height())/2); 
				$("#loader").css("left",($(window).width() - $("loader").width())/2); 
			}
			function hideLoader(){
				$("#loader").css("top",0); 
				$("#loader").css("left",0); 
				$("#loader").css("display","none"); 
			}
			function rotateLoader(){
				if(!loaded){
					if($("#loaderImg").rotate){
						$("#loaderImg").rotate(-180) ;
						$("#loaderImg").rotate({animateTo:180,duration:1000,callback:rotateLoader,easing:""});
					}
				}
				//$("#loaderImg").rotate(45) ;
			}
			function setScrollbar(){
				if(listHeight == 0){
					listHeight = $("#list").height() ;
					//alert(listHeight) ;
					$("#listContainer").css("overflow","hidden");
				}
				heightAv = getHeightAvailableForList() - 8 ;
				if(heightAv < $(".item").height()){
					heightAv = $(".item").height() ;
				}
				$("#listContainer").css("height",heightAv);
				$("#scrollbar").css("height",heightAv);
				$("#scroll").draggable({ 
					axis: "y", 
					containment: "parent", 
					drag: function(event, ui) {
						Scroll();
					},
					stop: function(event, ui) {
						Scroll();
					}
				});
				$("#scrollbar").click(function(e) {
					var mouseCoord=(e.pageY - $(this).offset().top);
					var targetPos=mouseCoord+$("#scroll").height();
					if(targetPos<$("#scrollbar").height()){
						$("#scroll").css("top",mouseCoord);
						Scroll();
					} else {
						$dragger.css("top",$("#scrollbar").height()-$("#scroll").height());
						Scroll();
					}
				});
				//initMouseWheel() ;

			}
			function getItemHeight(){
				return 106 ;
			}
			function getHeightAvailableForList(){
				return (Math.floor(($(window).height()-$("#content").height()-94 - 10)/getItemHeight())*getItemHeight()) ;
			}
			function showSite(){
				showItem($("#title"),0) ;				
				showItem($("#subTitle"),300) ;
				showItem($("#content"),600) ;
				showItem($("#scrollbar"),1200) ;
				showItem($("#prevRef"),1500) ;
				showItem($("#nextRef"),1700) ;
				var i = 0 ;
				$(".item").each(function() {
					showItem($(this),1000+i*100) ;
					$(this).hover(function(){ rovItem($(this));},function(){ rouItem($(this));}) ;
					i ++ ;
				}) ;
			}
			function initSideButtons(){
				$(".sideNavBtn").hover(function(){ rovSideButton($(this));},function(){ rouSideButton($(this));}) ;
			}
			function rovSideButton(btn){
				btn.stop().animate({opacity: 1}, 900,"easeOutSine");
			}
			function rouSideButton(btn){
				btn.stop().animate({opacity: 0.3}, 900,"easeOutSine");
			}
			function initContentUi(){
				$(".showSiteLink").hover(function(){ rovContent($(".showSiteLink"));},function(){ rouContent($(".showSiteLink"));}) ;
				$(".offLineSite").hover(function(){ rovContent($(".offLineSite"));},function(){ rouContent($(".offLineSite"));}) ;
				
		
			}
			function rovContent(content){
				content.stop().animate({opacity: 1}, 20,"easeOutSine");
			}
			function rouContent(content){
				content.stop().animate({opacity: 0}, 20,"easeOutSine");
			}
			
			
			function showItem(item,tweenDelay){
				item.delay(tweenDelay).animate({opacity: 1}, 700,"easeOutQuart");
			}
			function initList(){
				$(".item").each(function() {
					//$(this).click(function(event){clickItem($(this)) }) ;
				})
			}
			function openPage(itemId){
				var item = $(".item#"+itemId) ;
				//alert(item.css("background-image")) ;
				var img  = item.css("background-image") ;
				var itemTitle = item.children(".rov").children(".itemTitle").text() ;
				var itemText = item.children(".rov").children(".itemText").text() ;
				var itemDate = item.children(".rov").children(".itemDate").text() ;
				var itemRef = item.children(".rov").children(".itemRef").text() ;
				var itemColor = item.children(".rov").children(".itemColor").text() ;
				var itemLink = item.children(".itemLink").text() ;
				
				var contentImage = $("#contentImage") ;
				var openedTitle = $("#openedTitle") ;
				var openedText = $("#openedText") ;
				var openedDate = $("#openedDate") ;
				
				var openedLinkHtml = "" ;
				if(itemLink){
					openedLinkHtml = '<a class="showSiteLink" href="'+itemLink+'" target="_blank"><span style="background-color:'+itemColor+'">Voir le site</span></a>';
				}else{
					openedLinkHtml = '<span class="offLineSite" href="'+itemLink+'" target="_blank"><span style="background-color:'+itemColor+'">Ce site n\'est plus en ligne.</span></span>' ;
				}
				contentImage.css("background-image",img) ;
				openedTitle.css("color",itemColor) ;
				openedText.css("color",itemColor) ;
				openedDate.css("color",itemColor) ;
				contentImage.html(openedLinkHtml) ;
				openedTitle.text(itemTitle) ;
				openedText.text(itemText) ;
				openedDate.text(itemDate+" // "+itemRef) ;

				
				contentImage.stop().css("opacity",0) ;
				openedTitle.stop().css("opacity",0) ;
				openedText.stop().css("opacity",0) ;
				openedDate.stop().css("opacity",0) ;
				
				showItem(openedTitle,0) ;				
				showItem(contentImage,300) ;
				showItem(openedText,600) ;
				showItem(openedDate,900) ;
				//showItem(openedDate,900) ;
				
				initContentUi() ;
				setScrollbar() ;
				
				// ganal
				
			}
			function rovItem(item){
				item.children(".rov").animate({opacity: 1}, 40,"easeOutSine");
				item.children(".rov").children(".itemTitle").animate({width: 182}, 20,"easeOutSine");
			}
			function rouItem(item){
				item.children(".rov").animate({opacity: 0}, 40,"easeOutSine");
				item.children(".rov").children(".itemTitle").animate({width: 0}, 20,"easeOutSine");
			}
			function Scroll(){
				var listHeight = $("#list").outerHeight();
				var scrollAmount= (listHeight - $("#listContainer").height() ) ;
				var draggerAvHeight = $("#listContainer").height() - $("#scroll").height() ;
				var draggerPerc =  $("#scroll").position().top / draggerAvHeight ;
				var targY=-Math.floor(draggerPerc*scrollAmount/getItemHeight())*getItemHeight();
				$("#list").stop().animate({top: targY}, 700, "easeOutSine"); //with easing
			}
			function initMouseWheel(){
				$("#listContainer").bind("mousewheel", function(event, delta) {
					var vel = Math.abs(delta*20);
					$("#scroll").css("top", $("#scroll").position().top-(delta*vel));
					Scroll();
					if($("#scroll").position().top<0){
						$("#scroll").css("top", 0);
						$("#list").stop();
						Scroll();
					}
					if($("#scroll").position().top>$("#scrollbar").height()-$("#scroll").height()){
						$("#scroll").css("top", $("#scrollbar").height()-$("#scroll").height());
						$("#list").stop();
						Scroll();
					}
					return false;
				});
				
			}
}) ;