Index: ether_statistics/web/project/statistics-script.jsp
===================================================================
--- ether_statistics/web/project/statistics-script.jsp	(revision 663)
+++ ether_statistics/web/project/statistics-script.jsp	(revision 667)
@@ -9,5 +9,5 @@
         /** *********** CONTAINERS *********** **/
         this.parent = $( "#containerMiddle" );
-        this.containerMenu = $( "#menuCircle" );
+        this.containerMenu = $( "#menuLogo" );
         this.containerErrors = $( "#errors" );
 
@@ -15,5 +15,8 @@
         this.language = '<spring:message code="language"/>';
         this.webmaster = "<%=WebHelper.getProperty(request, "mail.webmaster")%>";
-        this.projectsPath = "resources/images/";
+        this.jSONUser = <%=WebHelper.getJSONUser( request )%> ? <%=WebHelper.getJSONUser( request )%> : false;
+        this.logoSizeSmall = 30;
+        this.logoSizeBig = 50;
+
         this.projectsArray = [
             {id:"ETHER", img:"logo_Ether_50.jpg", top:"-16px", left:"125px"},
@@ -34,5 +37,4 @@
             {id:"ARLETTY", img:"logo_arletty_50.jpg", top:"-79px", left:"161.667px"}
         ];
-        this.widthInitLogin = $( "#login_bg" ).width();
         this.widthInitMentionsOrCredits = $( "#mentions" ).width();
 
@@ -40,8 +42,6 @@
         this.yArray = [0, 10, 30, 50, 100];
 
-
         this.bindButtons();
-        this.createDraggableSlides();
-        this.createMenuCircle();
+        this.createMenuLogo();
 
         $( document ).ready( jQuery.proxy( function()
@@ -49,13 +49,12 @@
             $( ".containerToDrag" ).draggable();
             // Menu
-            this.animateMenuCircle();
-            this.bindMenuCircle();
-            // Slides
-//            this.onClickHelp();
-            this.selectedLogo = $( "#ETHER" )[0];
-            this.isSelectedLogoEther = true;
-            this.onClickLogo();
-
-            this.changeRightSlide();
+            this.animateMenuLogos();
+            this.bindMenuLogos();
+            this.createRightSlide();
+
+            if( !this.jSONUser )
+                this.onClickHelp();
+            else
+                this.handleLogin();
         }, this ) );
     },
@@ -67,18 +66,14 @@
         $( "#home_button" ).bind( "dblclick", this.onClickHome );
         $( "#language_button" ).bind( "dblclick", jQuery.proxy( this.onClickLanguage, this ) );
-        $( "#mail_button" ).bind( "dblclick", this.onClickMail );
-        $( "#login_button" ).bind( "dblclick", jQuery.proxy( this.onClickLogin, this ) );
+        $( "#mail_button" ).bind( "dblclick", jQuery.proxy( this.onClickMail, this ) );
         $( "#help" ).bind( "click", jQuery.proxy( this.onClickHelp, this ) );
         $( "#credits" ).bind( "dblclick", jQuery.proxy( this.onClickCredits, this ) );
         $( "#mentions" ).bind( "dblclick", jQuery.proxy( this.onClickMentions, this ) );
-    },
-
-    createMenuCircle: function()
-    {
-        var menuSize = this.containerMenu.width();
-        var nbLogosForSize = (this.projectsArray.length / 2) + 1;
-        var divLogoSize = menuSize / nbLogosForSize;
-        this.logoSize = divLogoSize - 5;
-
+        $( "#login_button" ).bind( "click", jQuery.proxy( this.onClickLogin, this ) );
+        $( "#logout_button" ).bind( "dblclick", jQuery.proxy( this.onClickLogout, this ) );
+    },
+
+    createMenuLogo: function()
+    {
         var initTop = this.projectsArray[0].top;
         var initLeft = this.projectsArray[0].left;
@@ -89,10 +84,10 @@
             divLogo.addClass( "divLogo containerToDrag" );
             divLogo.attr( {id:logo.id, style:"position:absolute; top:" + initTop + "; left:" + initLeft} );
-            divLogo.html( '<img id="img_' + logo.id + '"src="' + this.projectsPath + '' + logo.img + '" width="' + this.logoSize + 'px" height="' + this.logoSize + 'px"/>' );
-            $( "#menuCircle" ).append( divLogo );
+            divLogo.html( '<img id="img_' + logo.id + '"src="resources/images/' + logo.img + '" width="' + this.logoSizeSmall + 'px" height="' + this.logoSizeSmall + 'px"/>' );
+            this.containerMenu.append( divLogo );
         }, this ) );
     },
 
-    createDraggableSlides: function()
+    createAllSlides: function()
     {
         this.leftTopSlide = new DragSlide( {id:"leftTop", parent:this.parent, width:"170", height:"200", top:"140px", left:"53px",
@@ -110,5 +105,14 @@
             specificClass:"containerStatistics", specificTitleClass:"containerStatisticsTitle", specificContentClass:"containerStatisticsContent"} );
 
-        this.rightSlide = new DragSlide( {id:"right", parent:this.parent, width:"200", height:"300", top:"180px", left:"698px",
+        this.rightSlide = new DragSlide( {id:"right", parent:this.parent, width:"200", height:"270", top:"210px", left:"698px",
+            specificClass:"containerStatistics", specificTitleClass:"containerStatisticsTitle", specificContentClass:"containerStatisticsContent"} );
+
+        this.rightLoginSlide = new DragSlide( {id:"loginRight", parent:this.parent, width:"200", height:"25", top:"170px", left:"697px",
+            specificClass:"containerStatistics", specificTitleClass:"containerStatisticsTitle", specificContentClass:"containerStatisticsContent"} );
+    },
+
+    createRightSlide: function()
+    {
+        this.rightSlide = new DragSlide( {id:"right", parent:this.parent, width:"200", height:"270", top:"210px", left:"698px",
             specificClass:"containerStatistics", specificTitleClass:"containerStatisticsTitle", specificContentClass:"containerStatisticsContent"} );
     },
@@ -122,5 +126,28 @@
             {
                 location.reload();
-            }
+            },
+            error: jQuery.proxy( this.showErrors, [this] )
+        } );
+    },
+
+    requestLogin: function()
+    {
+        var login = $( "#loginValue" ).val();
+        var pwd = $( "#pwdValue" ).val();
+        $.ajax( {
+            url: "project?methodName=login&login=" + login + "&pwd=" + pwd,
+            dataType: 'json', // Info needed since jquery.1.7 !!
+            success:jQuery.proxy( this.handleLogin, this ),
+            error: jQuery.proxy( this.showErrors, [this, "489px", "566px"] )
+        } );
+    },
+
+    requestLogout: function()
+    {
+        $.ajax( {
+            url: "project?methodName=logout",
+            dataType: 'json', // Info needed since jquery.1.7 !!
+            success:jQuery.proxy( this.handleLogout, this ),
+            error: jQuery.proxy( this.showErrors, [this] )
         } );
     },
@@ -134,9 +161,9 @@
             url: "statistic?methodName=searchMainStatisticsByProject&name=" + this.selectedLogo.id,
             success:jQuery.proxy( this.handleDataByLogo, this ),
-            error: jQuery.proxy( this.showErrors, [this] )
-        } );
-    },
-
-    // HANDLES ******************************************************** = retours ajax
+            error: jQuery.proxy( this.showLoginError, this )
+        } );
+    },
+
+    // HANDLES ********************************************************
     handleDataByLogo: function( result )
     {
@@ -147,4 +174,90 @@
     },
 
+    handleLogin: function( result )
+    {
+        this.containerErrors.empty();
+        this.containerErrors.css( "visibility", "hidden" );
+
+        if( result )
+            this.jSONUser = result.jSONUser;
+
+        $( "#loginValue" ).empty();
+        $( "#pwdValue" ).empty();
+        $( "#login_text" ).css( "visibility", "hidden" );
+        $( "#login" ).animate( {
+            top:'47px',
+            left:'126px'
+        }, 2000, function()
+        {
+        } );
+
+        $( "#login_bg" ).animate( {
+            opacity: 1,
+            height:'60px',
+            width:'67px'
+        }, 2000, function()
+        {
+        } );
+
+        $( "#login_img" ).animate( {
+            top:'25px',
+            left: '16px',
+            width: '0',
+            height: '0'
+        }, 2000, jQuery.proxy( function()
+        {
+            // Slides
+            this.parent.empty();
+            this.createAllSlides();
+            this.changeRightSlide();
+
+            // User
+            if( this.jSONUser.name )
+                this.rightLoginSlide.setTitle( this.jSONUser.name );
+            else
+                this.rightLoginSlide.setTitle( '<spring:message code="label.unknown"/>' );
+            $( "#logout_button" ).css( "visibility", "visible" );
+
+            // Logo
+            this.selectedLogo = $( "#ETHER" )[0];
+            this.isSelectedLogoEther = true;
+            this.onClickLogo();
+        }, this ) );
+    },
+
+    handleLogout: function()
+    {
+        this.jSONUser = false;
+        this.parent.empty();
+        this.createRightSlide();
+        this.onClickHelp();
+
+        $( "#logout_button" ).css( "visibility", "hidden" );
+        $( "#login" ).css( { zIndex:1 } ).animate( {
+            top:'79px',
+            left:'88px'
+        }, 2000, function()
+        {
+        } );
+
+        $( "#login_bg" ).animate( {
+            opacity: 0.85,
+            height:'500px',
+            width:'500px'
+        }, 2000, function()
+        {
+            $( "#login_text" ).css( "visibility", "visible" );
+        } );
+
+        $( "#login_img" ).animate( {
+            top:'103px',
+            left: '148px',
+            width: '30px',
+            height: '30px'
+        }, 2000, function()
+        {
+        } );
+    },
+
     // EVENTS ********************************************************
     onClickHome: function()
@@ -161,12 +274,4 @@
     {
         document.location.href = "mailto:" + this.webmaster + "?subject=[STATISTICS]";
-    },
-
-    onClickLogin: function()
-    {
-        if( this.widthInitLogin == $( "#login_bg" ).width() )
-            this.enlargeLogin();
-        else
-            this.reduceLogin();
     },
 
@@ -191,11 +296,18 @@
         this.rightSlide.setTitle( '<spring:message code="label.help"/>' );
         this.rightSlide.setContent( "<spring:message code='label.help.content'/>" );
-        var backHelpButton = new Button( {value:"<spring:message code="label.display.actions"/>", parent:this.rightSlide.getDivContent(), className: "small positive back_button", onClick:jQuery.proxy( this.changeRightSlide, this )} );
-    },
-
-    onClickButtonLogin: function()
-    {
-        // TODO reduce cloud
-
+        if( this.jSONUser )
+            var backHelpButton = new Button( {value:"<spring:message code="label.display.actions"/>", parent:this.rightSlide.getDivContent(), className: "small positive back_button", onClick:jQuery.proxy( this.changeRightSlide, this )} );
+    },
+
+    onClickLogin: function()
+    {
+        this.containerErrors.empty();
+        this.containerErrors.css( "visibility", "hidden" );
+        this.requestLogin();
+    },
+
+    onClickLogout: function()
+    {
+        this.requestLogout();
     },
 
@@ -203,5 +315,13 @@
     {
         this.isSelectedLogoEther = (this.selectedLogo == $( "#ETHER" )[0]);
-        this.requestDataByLogo();
+
+        if( this.jSONUser )
+            this.requestDataByLogo();
+        else
+        {
+            this.showErrors( "<spring:message code="error.connection.need"/>" );
+            this.containerErrors.css( {top:"489px", left:"566px"} );
+            this.containerErrors.css( "visibility", "visible" );
+        }
     },
 
@@ -221,55 +341,22 @@
     {
         var context = this[0] ? this[0] : this;
-        var text = this[1];
+        var topValue = this[1] ? this[1] : false;
+        var leftValue = this[2] ? this[2] : false;
         context.containerErrors.show();
-//        if( text )
-//            context.containerErrors.html( interfaceTexts[result.responseText] + " " + text );
-//        else if( interfaceTexts[result.responseText] )
-//            context.containerErrors.html( interfaceTexts[result.responseText] );
-        if( result.responseText )
+        if( result.responseText && interfaceTexts[result.responseText] )
+            context.containerErrors.html( interfaceTexts[result.responseText] );
+        else if( result.responseText )
             context.containerErrors.html( result.responseText );
         else
             context.containerErrors.html( result );
-    },
-
-    reduceLogin: function()
-    {
-        $( "#login" ).css( { zIndex:0 } );
-        $( "#login_text" ).css( "visibility", "hidden" );
-        $( "#login_bg" ).animate( {
-            opacity: 1,
-            height:'60px',
-            width:'78px',
-            zIndex:'0'
-        }, 2000, function()
-        {
-        } );
-
-        $( "#login_button" ).animate( {
-            top:'16px',
-            left: '20px'
-        }, 2000, function()
-        {
-        } );
-    },
-
-    enlargeLogin: function()
-    {
-        $( "#login" ).css( { zIndex:1 } );
-        $( "#login_bg" ).animate( {
-            opacity: 0.45,
-            height:'500px',
-            width:'500px'
-        }, 2000, function()
-        {
-            $( "#login_text" ).css( "visibility", "visible" );
-        } );
-
-        $( "#login_button" ).animate( {
-            top:'82px',
-            left: '155px'
-        }, 2000, function()
-        {
-        } );
+        if( topValue && leftValue )
+            context.containerErrors.css( {top: topValue, left: leftValue} );
+        context.containerErrors.css( "visibility", "visible" );
+    },
+
+    showLoginError: function( result )
+    {
+        this.onClickLogout();
+        this.onClickLogo();
     },
 
@@ -287,5 +374,5 @@
             opacity: 1,
             height:'42px',
-            width:'59px',
+            width:this.widthInitMentionsOrCredits + 'px',
             zIndex:'0'
         }, 2000, function()
@@ -317,5 +404,5 @@
     },
 
-    animateMenuCircle: function()
+    animateMenuLogos: function()
     {
         jQuery.each( this.projectsArray, jQuery.proxy( function( i, logo )
@@ -330,22 +417,41 @@
     },
 
-    bindMenuCircle: function()
-    {
+    bindMenuLogos: function()
+    {
+        var gap = (this.logoSizeBig - this.logoSizeSmall) / 2;
+        var logoSizeBig = this.logoSizeBig + "px";
+        var logoSizeSmall = this.logoSizeSmall + "px";
         var gridimage;
-        $( '.divLogo' ).mouseover(
-                function()
-                {
-                    gridimage = $( this ).find( 'img' ); //Define target as a variable
-                    gridimage.stop().animate( {width: 50, height:50}, 150 );
-                } ).mouseout(
-                jQuery.proxy( function( element )
-                {
-                    this.selectedLogo = element.currentTarget;
-                    gridimage.stop().animate( {width: this.logoSize, height:this.logoSize}, 150 );
-                }, this ) ).dblclick(
-                jQuery.proxy( function()
-                {
-                    this.onClickLogo();
-                }, this ) );
+
+        $( '.divLogo' ).mouseover( function( element )
+        {
+            gridimage = $( this ).find( 'img' ); //Define target as a variable
+            gridimage.stop().animate( {
+                width: logoSizeBig,
+                height: logoSizeBig
+            }, 150 );
+            $( this ).animate( {
+                top: "-=10px",
+                left: "-=10px"
+            }, 150 );
+        } );
+
+        $( '.divLogo' ).mouseout( function( element )
+        {
+            $( this ).animate( {
+                top: "+=10px",
+                left: "+=10px"
+            }, 150 );
+            gridimage.stop().animate( {
+                width: logoSizeSmall,
+                height:logoSizeSmall
+            }, 150 );
+        } );
+
+        $( '.divLogo' ).dblclick( jQuery.proxy( function( element )
+        {
+            this.selectedLogo = element.currentTarget;
+            this.onClickLogo();
+        }, this ) );
     },
 
@@ -379,5 +485,5 @@
         new Button( {value:"<spring:message code="statistics.data.download"/>", parent:this.rightSlide.getDivContent(), className: "positive action_button", onClick:jQuery.proxy( this.displayDownloadEvolution, this )} );
         new Button( {value:"<spring:message code="statistics.map.distribution"/>", parent:this.rightSlide.getDivContent(), className: "positive action_button", onClick:jQuery.proxy( this.displayMapDistribution, this )} );
-        new Button( {value:"<spring:message code="label.export"/>", parent:this.rightSlide.getDivContent(), className: "blue export_button print-preview", onClick:jQuery.proxy( this.onClickPrint, this )} );
+        new Button( {value:"<spring:message code="label.print"/>", parent:this.rightSlide.getDivContent(), className: "blue export_button print-preview", onClick:jQuery.proxy( this.onClickPrint, this )} );
     },
 
@@ -547,4 +653,5 @@
         this.changeMiddleSlideForMap();
     }
+
 } );
 
