function front(){
    this.blockResize
    this.thumbnail=false
    this.hei=0
    this.indexLoad=0
    this.elementSet=-1
    this.dragClick=false
    this.delta
    
    this.init=function(){
        
        $.ajaxSetup({
            cache:true,
            sync:false,
            beforeSend:function(jqXHR, sett){
                utils.waiter()
            },
            complete:function(jqXHR, sett){
                utils.dewaiter()
            }
        });

        $("#header").click(function(){
            //window.document.location.href="/new";
        	window.document.location.href="/";
        }).css("cursor","pointer")

        $("#leftCol #menuLeft div.page,#leftCol #menuLeft div.categorie").mouseover(function(){
            $(this).css("color","#000")
            $(this).find("a").css("color","#000")
        }).mouseout(function(){
            $(this).css("color","")
            $(this).find("a").css("color","")
        })
        
        
       
        //if ($.browser.msie) {
        		//$("div.leftos,div.rightos").css("cursor","pointer")
        		//alert($("div.leftos").css("cursor"))
        //}
        $("div.leftos,div.rightos").click(front.nextos)
        $("div.leftos").hover(function(){$(this).css({background: "url('/new/media/img/images/left_curs.png') 20px 50% no-repeat"})},function(){$(this).css({background: ""})})
        $("div.rightos").hover(function(){$(this).css({background: "url('/new/media/img/images/right_curs.png') right 50% no-repeat"})},function(){$(this).css({background: ""})})
        
        $("#thumbnails").click(front.thumbnailise)

        $("#leftCol .page[id='a"+$("#global").attr("page")+"']").removeClass("unsel")
        //$("#leftCol #n1 .categorie").addClass("selected")
        //console.log($("#leftCol .menuCont:eq(1) .categorie ,#leftCol .menuCont:eq(1) .page[id='a"+$("#global").attr("page")+"']"))
        $("#leftCol .menuCont:eq(1) .categorie ,#leftCol .menuCont:eq(1) .page[id='a"+$("#global").attr("page")+"']").addClass("selected")
        // this.place()
        $(window).resize(front.place)
        $(window).resize()
        /*$(".jspArrowLeft").live("mouseover",function(){front.delta=-10;front.diapo=true;front.dragClick=true;front.diaporama()})
        $(".jspArrowRight").live("mouseover",function(){front.delta=10;front.diapo=true;front.dragClick=true;front.diaporama()})
        $(".jspArrowLeft,.jspArrowRight").live("mouseout",function(){
        	
        	if(front.diapo){
        		front.diapo=false
        		front.dragClick=false
        	}
        })*/
    }
    
    this.diaporama=function(){
    	front.timer=null
    	try{
			scrollerApi.scrollByX(front.delta,false)
		}
		catch(err){}
    	if(front.diapo){
    		if(!front.timer){
    			front.timer=window.setTimeout(function(){
    			front.diaporama()
    			
    			},50)
    		}
    	}
    	
    }

    this.place=function(){
        
        $("div.ImgItem").hide()
         
        front.glHeight=$(window).height()-(70)

        if(front.glHeight>730)
            front.glHeight=730

        
        $("#global").css({
            height:front.glHeight,
            width:$(window).width()-(40)
        })
        


        $("#leftCol").css({
        
            height:front.glHeight - $("#header").height()+15
        })

        $("#rightCol,#rightCol .jspContainer").css({

            height:front.glHeight - $("#header").height()
        })
        // console.log($(window).width()-(70)-276)
        $("#rightCol,#rightCol .jspContainer,#rightCol .jspPane").css({
            width:$(window).width()-(40)-276
        })

        /*$(".videoScreen").css({
            width:$("#rightCol").width()-5,
            height:$("#rightCol").height()-5
        })*/

        $("#leftCol #menuLeft").height(front.glHeight - $("#header").height()-25)
        var ppos=$("#rightCol").position()
        $("div.leftos,div.rightos").css({height:front.glHeight - $("#header").height()-25,width:($(window).width()-(40)-300)/2,top:ppos.top,left:ppos.left})
        $("div.rightos").css({left:"",right:0})
        
        if(!front.blockResize){
            front.blockResize=window.setTimeout(function(){

                if(!front.thumbnail){
                    if($("div.videoItem").length>0){
                        
                    	$("div.videoItem").bind("click",front.showVideo)
                        $("div.videoItem").hover(function(e){
                           
                            $(e.currentTarget).find("div.play").toggleClass("displayNone")
                        }, function(e){
                            $(e.currentTarget).find("div.play").toggleClass("displayNone")
                        })

                        front.loadvignettes()
                    }else if ($("div.ImgItem").length>0){
                    	$("div.leftos,div.rightos").css("display","block")
                        front.indexLoad=0
                        front.loadImages(true)
                    }
                    else if ($("div.textuel").length>0){
                        $("#contener").height($("div.textuel").height())
                    // if($(".jspPane").length==0){
                    // scroller=$('#rightCol').jScrollPane({
                    // showArrows: true,
                    // horizontalDragMinWidth:40
                    //
                    // });
                    // scrollerApi= scroller.data('jsp');
                    // }
                    // scrollerApi.reinitialise()
                    
                    }
                }else{
                    front.thumbnailise()
                }
                front.blockResize=null
            },500)
        }
    //
        
    


    }

    this.nextos=function(e){
    	var delta=0
    	var animation=true
    	
    	if($(e.currentTarget).hasClass("leftos")){
    		delta=-1
    	}
    	else{
    		delta=1
    	}
    	var off=$("#rightCol").offset()
    	front.delta=delta
    	if(scrollerApi.getPercentScrolledX()<1){
    	$("div.ImgItem").each(function(){
    		var toff=$(this).offset()
    		if(toff.left>=off.left){
    			var i=$(this).index("div.ImgItem")
    			if((i+delta)<0){
    				i=$("div.ImgItem").length
    			}
    			
    			scrollerApi.scrollToElement( $("div.ImgItem:eq("+(i+delta)+")"),true,animation)
    			return false
    		}
    	})
    	}
    	else if(delta<0){
    		$("div.ImgItem").each(function(){
        		var toff=$(this).offset()
        		if(toff.left>=off.left){
        			var i=$(this).index("div.ImgItem")
        			if((i+delta)<0){
        				i=$("div.ImgItem").length
        			}
        			
        			scrollerApi.scrollToElement( $("div.ImgItem:eq("+(i+delta)+")"),true,animation)
        			return false
        		}
        	})
    	}
    	else{
    		scrollerApi.scrollToElement( $("div.ImgItem:eq(0)"),true,animation)
    		return false
    	}
    	
    	
    }
    
    
    this.clickRub=function(e){
        e.stopImmediatePropagation()
        if( $(e.currentTarget).parent("div.menuCont").attr("id")=="n1"){
            $(e.currentTarget).removeClass("unsel").addClass("selected")
            $(e.currentTarget).siblings().each(function(){
            $(this).addClass("unsel").removeClass("selected")
        })
    }
        else{
            $(e.currentTarget).removeClass("unsel")
            $(e.currentTarget).siblings().each(function(){
            $(this).addClass("unsel").removeClass("selected")
        })
        }
        
        $("#rightCol,#thumbnails").fadeOut()
        // if($(e.currentTarget).parent(".menuCont").attr("id")!="n0")
        $(e.currentTarget).siblings().slideUp()
        $.post("/new/lib/php/gateway.php", {
            func:"getSsMenu",
            "class":"frontclass",
            "id":$(e.currentTarget).attr("id").substr(1)
        },function(data){
            
            $(e.currentTarget).parent("div.menuCont").attr("class","menuCont open")
            $("div#menuLeft").find("div.menuCont:gt("+$(e.currentTarget).parent("div.menuCont").index("div.menuCont")+")").remove()
            $("div#menuLeft").append("<div id='n"+($(e.currentTarget).parent("div.menuCont").index("div.menuCont")+1)+"' class='menuCont'>"+data.html+"</div>")
            $("div#menuLeft div#n"+($(e.currentTarget).parent("div.menuCont").index("div.menuCont")+1)+" div.categorie,div#menuLeft div#n"+($(e.currentTarget).parent("div.menuCont").index("div.menuCont")+1)+" div.page").addClass("unsel")
            $("#leftCol #menuLeft div.page,#leftCol #menuLeft div.categorie").mouseover(function(){
                $(this).css("color","#000")
                $(this).find("a").css("color","#000")
            }).mouseout(function(){
                $(this).css("color","")
                $(this).find("a").css("color","")
            })
            api.gereEvent();
        },"json")
    }
    
    
   

this.loadImages=function(first){
    	
        var i=front.indexLoad
        
        if(first){
        	$("div.ImgItem div.img").unbind("click",front.showPict)
        	$("#prct").addClass("displayNone")
        	$("div.leftos,div.rightos").css("display","block")
        	$("div.ImgItem div.name").removeClass("it")
            $("div.ImgItem").css({display:"none",width:"",height:""})
            $("div.ImgItem").attr("vis","0")
            $("#contener,.jspPane").width(0)
            $("#contener").css("height","")
            $("#contener .spacer").remove()
            $("#thumbnails").removeClass("displayNone")
            front.hei= front.glHeight - $("#header").height()-40
            if ($.browser.msie) {
            	//front.hei= front.glHeight - $("#header").height()-70
            }
            //$("#contener").css("height","")
            /*if(front.elementSet>=0){
            	$("div.ImgItem:lt("+(front.elementSet+1)+")").each(function(){
            		
            		var tw= (front.hei * $(this).find("div.img").attr("dw"))/$(this).find("div.img").attr("dh")
            		$(this).width(tw)
            		$(this).css({display:""})
            	})
            }*/
        	$("div.ImgItem div.img").css("height","100%")
        	$("div.ImgItem").each(function(){
        		var tw= (front.hei * $(this).find("div.img").attr("dw"))/$(this).find("div.img").attr("dh")
        		$(this).width(tw)
        		$(this).height(front.hei)
        		$(this).css({display:""})
        		$("#contener").width($("#contener").width()+tw+10)
        	})
            
        	
        	
        }


        var hei= front.glHeight - $("#header").height()-40
       
        var mapath=unescape($("div.ImgItem:eq("+i+")").find("div.img").attr("path")).replace(reg1,"%26").replace(reg2,"%2B").replace(reg3,"%20")

        
        // var img=$("<img
		// src='/new/lib/php/getImg.php?h="+front.hei+"&p="+mapath+"'/>")
        //var img=$("<img src='/new/"+mapath+"' height='"+front.hei+"'/>")
       //.attr("height",front.hei).attr("src","/"+mapath)
        var img=new Image()
        $(img).load(function(){
            if(front.thumbnail==false){
               
                $("div.ImgItem:eq("+i+")").find("div.img").html(img)
            
            
            
            
                // if ( $.browser.msie ) {
                if($(".jspPane").length==0){
                    scroller=$('#rightCol').jScrollPane({
                        showArrows: true,
                        horizontalDragMinWidth:40,
                        verticalDragMinWidth:40,
                        maintainPosition:true,
                        stickToRight:true,
                        //animateScroll:true,
                        animateEase:'linear',
                        arrowScrollOnHover:true
                    });
                    scrollerApi= scroller.data('jsp');

                }
                else{
                	//scrollerApi.destroy()
                }
               
               
                    
                    //$("div.ImgItem:eq("+i+")").css("display",'')
                    $("div.ImgItem:eq("+i+")").attr("vis","1")
                    //$("div.ImgItem:eq("+i+")").width($(img).width())



                    var vi=0
                    $("div.ImgItem[vis='1']").each(function(){
                    	vi=vi+$(this).find("div.img img").width()+10
                        
                    })
                    if(front.elementSet>=0){
                    	$("div.ImgItem:lt("+(front.elementSet+1)+")[vis='0']").each(function(){
                        
                    		vi=vi+$(this).width()+10
                        
                    	})
                    }
                
                    //$("#contener").width(vi)

                    scrollerApi.reinitialise()
                    
                    if((front.elementSet>=0)&&(front.dragClick==false)){
                    	scrollerApi.scrollToElement( $("div.ImgItem:eq("+front.elementSet+")"),true,false)
                    }
                
                
                if(((i+1)<$("div.ImgItem").length)){
                    if($("div.ImgItem").length>$("div.ImgItem[vis='1']").length){
	                	if(i==front.indexLoad){
	                        front.setPrct($("div.ImgItem[vis='1']").length)
	                        front.indexLoad++
	                        front.loadImages()
	                    }
                    }
                    else if($("div.ImgItem").length==$("div.ImgItem[vis='1']").length){
                    	$("div.jspHorizontalBar div.jspDrag span.prct").remove()
                        $("#contener").append("<div class='spacer'></div>")
                        front.elementSet=-1
                        front.prethumbnails(0)
                    }
                }
                else {
                	if($("div.ImgItem:eq(0)").attr("vis")=="0"){
                		front.setPrct($("div.ImgItem[vis='1']").length)
                        front.indexLoad=0
                        front.loadImages()
                	}else{
                	$("div.jspHorizontalBar div.jspDrag span.prct").remove()
                    $("#contener").append("<div class='spacer'></div>")
                    front.elementSet=-1
                    front.prethumbnails(0)
                	}
                }
            }
        }).attr("height",front.hei).attr("src","/new/"+mapath)
        
       

    }





    this.prethumbnails=function(i){
        var img=$("<img src='/new/lib/php/getImg.php?h=110&w=170&c=1&p="+unescape($("div.ImgItem:eq("+i+")").find("div.img").attr("path")).replace(reg1,"%26").replace(reg2,"%2B")+"'/>")

        $(img).load()
        if((i+1)<$("div.ImgItem").length){
            front.prethumbnails(i+1)
        }
    }

    this.thumbnailise=function(){
    	$("div.leftos,div.rightos").css("display","none")
        front.thumbnail=true;
        $("div.ImgItem").css("width","")
        var hei= front.glHeight - $("#header").height()-20
        // $("#rightCol .jspPane")
        $("div.ImgItem div.name").addClass("it")
        var nbLignes=Math.floor(hei/130)
        var nbColonnes=Math.ceil($("div.ImgItem").length/nbLignes)
        $("#contener").width($("#rightCol").width())
        $("#thumbnails").addClass("displayNone")
        $("#thumbnails").html("Thumbnails Off")
         $("#thumbnails").removeClass("displayNone")
        $("#thumbnails").unbind("click")
        $("#thumbnails").click(function(){
            window.document.location=""
        })
        
        // image:170*110 + 30 texte ->140 de haut +10 de margin->150
        $("div.ImgItem").removeAttr("vis")
        $("div.ImgItem").hide()
        $("div.ImgItem div.img img").remove()
        $("#contener .spacer").remove()
        $("div.ImgItem div.img").click(front.showPict)
        front.loadThumbNails(nbColonnes,0)
        front.elementSet=-1
        $("div.ImgItem div.img").height("auto")
    }

    this.loadThumbNails=function(nb,i){
        
        if(i==0){
            // $("#contener").width(0)
            $("#rightCol .jspPane").css("left",0)
            $("div.ImgItem").css("display", "none")
        }
        var img=$("<img src='/new/lib/php/getImg.php?h=110&w=170&c=1&p="+unescape($("div.ImgItem:eq("+i+")").find("div.img").attr("path")).replace(reg1,"%26").replace(reg2,"%2B")+"'/>")
        $(img).load(function(){
            if(front.thumbnail==true){
                $("div.ImgItem:eq("+i+")").find("div.img").html(img)
                $("div.ImgItem:eq("+i+")").css({"display":'',height:130})
                $("div.ImgItem:eq("+i+")").width($(img).width())
                var pos=$("div.ImgItem:eq("+i+")").position()
                $("#contener,.jspPane").height(pos.top + 150)
                /*
				 * if(i<nb){ var vi=0
				 * $("div.ImgItem:lt("+(i+1)+")").each(function(){
				 * vi=vi+$(this).find("div.img img").width()+10 })
				 * $("#contener").width(vi) } if((i+1)%nb==0){
				 * $("div.ImgItem:eq("+i+")").after("<div class='spacer'></div>") }
				 */
           
                scrollerApi.reinitialise()

                if(((i+1)<$("div.ImgItem").length)&&(front.thumbnail==true)){
                    front.setPrct(i+1)
                    front.loadThumbNails(nb,i+1)

                }
                else{
                	$("#prct").html("").addClass("displayNone")
                   
                    $("#contener").append("<div class='spacer'></div>")
                }
            }
        })
    }

    this.loadvignettes=function(){
        front.video=true;
        var hei= front.glHeight - $("#header").height()-20
        var nbLignes=Math.floor(hei/130)
        var nbColonnes=Math.ceil($("div.videoItem").length/nbLignes)
        $("div.videoItem div.name").addClass("it")
        $("#contener .spacer").remove()
        $("#contener").width($("#rightCol").width())
        front.loadvignette(nbColonnes,0)
    }
    this.loadvignette=function(nb,i){
        if(i==0){
            //$("#contener").width(0)
            $("#rightCol .jspPane").css("left",0)
            $("div.videoItem").css("display", "none")
        }
        var img=$("<img src='/new/lib/php/getImg.php?h=110&w=170&c=1&p="+unescape($("div.videoItem:eq("+i+")").find("div.vignette").attr("path")).replace(reg1,"%26").replace(reg2,"%2B")+"'/>")
        $(img).load(function(){
            $("div.videoItem:eq("+i+")").find("div.vignette").html(img)
            $("div.videoItem:eq("+i+")").css({
                "cursor":"pointer",
                display:"",
                width:170
            })
            $("div.videoItem:eq("+i+") div.play").remove()
            $("div.videoItem:eq("+i+")").find("div.vignette").after("<div class='play displayNone'><img src='/new/media/img/icon/play.png'/></div>")
            
            scrollerApi.reinitialise()

            if((i+1)<$("div.videoItem").length){
                front.setPrct(i+1)
                front.loadvignette(nb,i+1)
            }
            else{
            	
            	$("div#prct").addClass("displayNone").html("")
            }
        })
    }

    this.showVideo=function(){
        //console.log("show vid")
        var chemin=$(this).attr("chemin")
        if(chemin.toLowerCase().indexOf("youtube")!=-1){
            chemin=chemin.replace(/^(.*)watch\?v=(.+)$/gi,'http://www.youtube.com/v/$2')
        }else if(chemin.toLowerCase().indexOf("dailymotion")!=-1){
            chemin=chemin.replace(/^(.*)swf\/(.+)_.*$/gi,'http://www.dailymotion.com/swf/video/$2')

        }else if(chemin.toLowerCase().indexOf("vimeo")!=-1){
            chemin=chemin.replace(/^(.*)\/([0-9]+)$/gi,'http://vimeo.com/moogaloop.swf?clip_id=$2')
        }
        var w,h,t,l
        l=0
        h=$("#rightCol").height()-5
        if(h>360){
            h=360
        }
        w=(640*h)/360
        // t=($("#rightCol").height()-h)/2
        // if(t<0)
        var pos=$("#rightCol").offset()
        t=pos.top + 5
        l=pos.left +5
        var strObj='<object width="100%" height="100%" id="vidObj"><param name="movie" value="'+chemin+'"></param><param name="allowFullScreen" value="true"></param><param name="allowScriptAccess" value="always"></param><embed src="'+chemin+'" type="application/x-shockwave-flash" width="100%" height="100%" allowfullscreen="true" allowscriptaccess="always" wmode="transparent"></embed></object>';
        // $(this).html(strObj)
        $("body").append("<div class='videoScreen'></div>")
        $(".videoScreen").css({
            width:w,
            height:h,
            top:t,
            left:l
        })
        $("div.jspContainer").fadeOut();
        $(".videoScreen").html(strObj).fadeIn();
        $("#thumbnails").html("return to thumbnails").unbind('click').click(function(){
            window.document.location.href=""
        }).show()

    }

    this.showPict=function(e){
        e.stopImmediatePropagation()
        var ind=$(e.currentTarget).parent("div.ImgItem").index("div.ImgItem")
        front.thumbnail=false
        front.elementSet=ind
        front.indexLoad=ind
        var tt=Math.round((front.hei/2)-30)
        $("div.ImgItem div.img img").remove()
        /*$("div.ImgItem div.img img").each(function(){
        	utils.centering($(this),$(this).parent("div.img"),"width")
        })*/
        
        
        scrollerApi.destroy()
        
        
        front.loadImages(true)
        front.dragClick=false
        

        $("#thumbnails").html("thumbnails").unbind('click').click(function(){
            front.thumbnailise()
        })

    

    }

    this.setPrct=function(i){
        var prc=Math.round((100*i)/$("div.ImgItem,div.videoItem").length)
        
        if(front.thumbnail){
        	$("div.jspHorizontalBar div.jspDrag span.prct").remove()
        	$("div#prct").removeClass("displayNone").html(prc+"%")
        }
        else{
        	if($("div.jspHorizontalBar div.jspDrag span.prct").length==0){
        		$("div.jspHorizontalBar div.jspDrag").append("<span class='prct'></span>")
        	}
        	$("div.jspHorizontalBar div.jspDrag span.prct").html(prc+"%")
        }
        
        
    }


}

front=new front()
$(document).ready(function(){

    front.init();
    api.gereEvent();

})

var scroller,scrollerApi

var reg1=new  RegExp("&",'g')
var reg2=new  RegExp("\\+",'g')
var reg3=new  RegExp(" ",'g')
$(function()
{
    scroller=$('#rightCol').jScrollPane({
        showArrows: true,
        horizontalDragMinWidth:40,
        verticalDragMinWidth:40,
        maintainPosition:true,
        stickToRight:true,
        //animateScroll:true,
        animateEase:'linear',
        arrowScrollOnHover:true
    });
    scrollerApi= scroller.data('jsp');
});


