Changeset 592 for ether_statistics/web/project/statistics-script.jsp

Timestamp:

10/11/12 13:55:16 (12 years ago)

Author:

vmipsl

Message:

menu + divs

File:

• ether_statistics/web/project/statistics-script.jsp (modified) (7 diffs)

ether_statistics/web/project/statistics-script.jsp

@@ -14 +14 @@
         this.language = '<spring:message code="language"/>';
         this.webmaster = "<%=WebHelper.getProperty(request, "mail.webmaster")%>";
-        this.projectsArray = ["logo_Ether_50.jpg", "logo_Ndacc_50.jpg", "logo_ECCAD_50.gif", "logo_iasi_50.jpg", "logo_gosat_50.jpg", "logo_Iagos_50.jpg", "logo_tropico_50.jpg", "logo_Megapoli_50.png", "logo_mimosa_50.png", "logo_reprobus_50.png", "logo_geisa_50.jpg", "logo_tapas_50.png", "logo_acomida_50.jpg", "logo_omer7A_50.jpg", "logo_girafe_50.JPG", "logo_arletty_50.jpg"];
         this.projectsPath = "resources/images/";
+        this.projectsArray = [
+            {id:"logo_Ether_50", img:"logo_Ether_50.jpg", top:"-16px", left:"125px"},
+            {id:"logo_Ndacc_50", img:"logo_Ndacc_50.jpg", top:"1.66667px", left:"46.3334px"},
+            {id:"logo_ECCAD_50", img:"logo_ECCAD_50.gif", top:"39.3333px", left:"109.333px"},
+            {id:"logo_iasi_50", img:"logo_iasi_50.jpg", top:"-78.6667px", left:"77.6666px"},
+            {id:"logo_gosat_50", img:"logo_gosat_50.jpg", top:"-0.333328px", left:"200.667px"},
+            {id:"logo_Iagos_50", img:"logo_Iagos_50.jpg", top:"36px", left:"138px"},
+            {id:"logo_tropico_50", img:"logo_tropico_50.jpg", top:"-74px", left:"45px"},
+            {id:"logo_Megapoli_50", img:"logo_Megapoli_50.png", top:"-74.3333px", left:"15.3333px"},
+            {id:"logo_mimosa_50", img:"logo_mimosa_50.png", top:"-45.6667px", left:"76.3334px"},
+            {id:"logo_reprobus_50", img:"logo_reprobus_50.png", top:"-48px", left:"161.667px"},
+            {id:"logo_geisa_50", img:"logo_geisa_50.jpg", top:"22px", left:"167.667px"},
+            {id:"logo_tapas_50", img:"logo_tapas_50.png", top:"58.3333px", left:"125px"},
+            {id:"logo_acomida_50", img:"logo_acomida_50.jpg", top:"-77.3333px", left:"225px"},
+            {id:"logo_omer7A_50", img:"logo_omer7A_50.jpg", top:"22.6667px", left:"76.3334px"},
+            {id:"logo_girafe_50", img:"logo_girafe_50.JPG", top:"-79.6667px", left:"192.333px"},
+            {id:"logo_arletty_50", img:"logo_arletty_50.jpg", top:"-79px", left:"161.667px"}
+        ]
 
         this.bindButtons();
         this.createDivs();
-        this.createCircleMenu();
+        this.animateMenuCircle();
         $( ".containerToDrag" ).draggable();
     },
@@ -35 +52 @@
     createDivs: function()
     {
-        var div1 = this.createDiv( "div1", "150", "200", "200", "100", "Main statistics", "content" );
+        var div1 = this.createDiv( "div1", "150", "200", "140", "53", "Main statistics", "div1" );
         this.parent.append( div1 );
-        var div2 = this.createDiv( "div2", "250", "200", "150", "300", "MEGAPOLI Statistics", "content" );
+        var div2 = this.createDiv( "div2", "430", "430", "140", "230", "MEGAPOLI Statistics", "div2" );
         this.parent.append( div2 );
-        var div3 = this.createDiv( "div3", "150", "200", "300", "600", "TAPAS Statistics", "content" );
+        var div3 = this.createDiv( "div3", "200", "300", "180", "700", "TAPAS Statistics", "div3" );
         this.parent.append( div3 );
+        var div4 = this.createDiv( "div4", "150", "200", "370", "53", "Hop hop hop", "div4" );
+        this.parent.append( div4 );
     },
 
@@ -60 +79 @@
     },
 
-    createCircleMenu: function()
+    createCircleMenuOld: function()
     {
         var menuSize = this.containerMenu.width();
@@ -74 +93 @@
             var divLogo = $( document.createElement( "div" ) );
             divLogo.html( '<img id="img_' + this.projectsArray[i] + '"src="' + this.projectsPath + '' + this.projectsArray[i] + '" width="' + logoSize + 'px" height="' + logoSize + 'px"/>' );
-            divLogo.addClass( "divLogo" );
+            divLogo.addClass( "divLogo containerToDrag" );
             divLogo.attr( {id:this.projectsArray[i], style:"position:absolute; top:" + top + "px; left:" + left + "px"} );
             this.containerMenu.append( divLogo );
@@ -84 +103 @@
                 var divLogo2 = $( document.createElement( "div" ) );
                 divLogo2.html( '<img id="img_' + this.projectsArray[i] + '"src="' + this.projectsPath + '' + this.projectsArray[i] + '" width="' + logoSize + 'px" height="' + logoSize + 'px"/>' );
-                divLogo2.addClass( "divLogo" );
+                divLogo2.addClass( "divLogo containerToDrag" );
                 divLogo2.attr( {id:this.projectsArray[i], style:"position:absolute; top:" + top + "px; left:" + left + "px"} );
                 this.containerMenu.append( divLogo2 );
@@ -198 +217 @@
             height:'500px',
             width:'500px'
-        }, 5000, function()
+        }, 2000, function()
         {
             $( "#login_text" ).css( "visibility", "visible" );
@@ -206 +225 @@
             top:'82px',
             left: '155px'
-        }, 5000, function()
-        {
-        } );
+        }, 2000, function()
+        {
+        } );
+    },
+
+    animateMenuCircle: function()
+    {
+        var menuSize = this.containerMenu.width();
+        var nbLogosForSize = (this.projectsArray.length / 2) + 1;
+        var divLogoSize = menuSize / nbLogosForSize;
+        var logoSize = divLogoSize - 5;
+
+        var initTop = this.projectsArray[0].top;
+        var initLeft = this.projectsArray[0].left;
+
+        jQuery.each( this.projectsArray, jQuery.proxy( function( i, logo )
+        {
+            var divLogo = $( document.createElement( "div" ) );
+            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="' + logoSize + 'px" height="' + logoSize + 'px"/>' );
+            $( "#menuCircle" ).append( divLogo );
+        }, this ) );
+
+        jQuery.each( this.projectsArray, jQuery.proxy( function( i, logo )
+        {
+            $( "#" + logo.id ).animate( {
+                top:logo.top,
+                left:logo.left
+            }, 5000, function()
+            {
+            } );
+        }, this ) );
     }
-
 } );