diff -r 909dfe0c1dca -r 4267d6d27a7d front_idill/src/index.html
--- a/front_idill/src/index.html	Thu May 24 10:35:27 2012 +0200
+++ b/front_idill/src/index.html	Wed May 30 10:21:36 2012 +0200
@@ -30,6 +30,7 @@
         <script type="text/javascript" src="../lib/less-1.3.0.min.js"></script>
         <script type="text/javascript" src="../lib/underscore-min.js"></script>
         <script type="text/javascript" src="../lib/jquery.min.js"></script>
+        <script type="text/javascript" src="../lib/jquery-ui.min.js"></script>
         <script type="text/javascript" src="./mosaic/js/mosaic.js"></script>
         <script type="text/javascript" src="./mosaic/js/localMosaic.js"></script>
 		<script type="text/javascript" src="./player/metadataplayer/LdtPlayer-core.js"></script>
@@ -50,18 +51,38 @@
         <!-- Scripts principaux. -->
         <script type="text/javascript">
             //Longueur de la mosaïques et nombre d'images à afficher (seront importés des paramètres du Middleware).
-            var length = 5, imagesToShow = 20, totalImages = 23;
+			var default_parameters = new Object();
+			default_parameters['local'] = true;
+			default_parameters['length'] = 5;
+			default_parameters['imagesToShow'] = 20;
+			default_parameters['totalImages'] = 23;
+			default_parameters['timePrezoom'] = 500;
+			default_parameters['timePreUnzoom'] = 200;
+			default_parameters['timeZoom'] = 500;
+			default_parameters['timeUnzoom'] = 400;
+			default_parameters['timeNeighbourGlowing'] = 1000;
+			default_parameters['timeNeighbourUnglowing'] = 1000;
+			default_parameters['timeMovingToNeighbour'] = 1000;
+			default_parameters['timeSearchFade'] = 2000;
+			default_parameters['timeNotifyFade'] = 2000;
+			default_parameters['timeFilterFade'] = 2000;
+			default_parameters['timeFilling'] = 500;
+			default_parameters['zoomPercentage'] = 0.80;
+			default_parameters['prezoomPercentage'] = 0.25;
+			default_parameters['zoomedMargin'] = 42;
+			
+            /*var length = 5, imagesToShow = 20, totalImages = 23;
             //Temps de chargement du prezoom en ms (seront importés des paramètres du Middleware).
             var timePrezoom = 500, timePreUnzoom = 200, timeZoom = 500, timeUnzoom = 400;
             var timeNeighbourGlowing = 1000, timeNeighbourUnglowing = 1000, timeMovingToNeighbour = 1000;
 			var timeSearchFade = 2000;
 			var timeNotifyFade = 2000;
             var zoomPercentage = 0.80, prezoomPercentage = 0.25;
-            var zoomedMargin = 42;
+            var zoomedMargin = 42;*/
             //On instancie la mosaïque.
-            var mos = new mosaic(length, imagesToShow, totalImages, zoomPercentage, prezoomPercentage, zoomedMargin);
+            
             //On spécifie les attributs de temps.
-            mos.zoomTime = timeZoom;
+            /*mos.zoomTime = timeZoom;
             mos.unzoomTime = timeUnzoom;
             mos.preZoomTime = timePrezoom;
             mos.preUnzoomTime = timePreUnzoom;
@@ -69,7 +90,7 @@
             mos.timeNeighbourUnglowing = timeNeighbourUnglowing;
             mos.timeMovingToNeighbour = timeMovingToNeighbour;
 			mos.timeSearchFade = timeSearchFade;
-			mos.timeNotifyFade = timeNotifyFade;
+			mos.timeNotifyFade = timeNotifyFade;*/
             //On instancie une mosaïque locale pour le zoom total (pas encore implémenté).
             //var lMos = new localMosaic(length, imagesToShow, zoomedMargin);
             //mos.localMos = lMos;
@@ -80,17 +101,11 @@
                 imgs[i] = i + '.jpg';
 			}*/
             
-            //Si on a changé les dimensions de la fenêtre, on raffraichit la mosaïque.
-            $(window).resize(function ()
-            {
-                mos.loadMosaic();
-            });
-            
             //Si la page a chargé, on raffraichit la mosaïque.
             $(document).ready(function ()
             {
-                mos.loadMosaic();
-				//mos.newSearch();
+				var mos = new mosaic('./config.json', default_parameters);
+                //mos.loadMosaic();
                 
                 $('.snapshotDivs').mouseenter(function ()
                 {
@@ -99,56 +114,7 @@
                 });
                 $('body').keypress(function (event)
                 {
-					//Sinon si on a appuyé sur 's' ou 'S'.
-					if(event.which == 103 || event.which == 71)
-					{
-						//Si on est déjà en recherche par courbes.
-						if(mos.currentMode == "SEARCH" || mos.currentMode == "FILTER")
-						{
-							//On quitte cette recherche.
-							mos.leaveSearch();
-							//Si on était en mode recherche.
-							if(mos.currentMode == "SEARCH")
-							{
-								//On revient dans la vidéo.
-								mos.currentMode = "VIDEO";
-							}
-							else
-							{
-								//Sinon c'est qu'on était dans la mosaïque.
-								mos.currentMode = "MOSAIC";
-							}
-						}
-						else
-						{
-							//Si on est en plein écran.
-							if(mos.fullscreen)
-							{
-								//On entre en mode recherche.
-								mos.currentMode = "SEARCH";
-							}
-							//Sinon.
-							else
-							{
-								//On entre en mode filtrage.
-								mos.currentMode = "FILTER";
-							}
-							
-							mos.startSearch();
-						}
-					}
-					//Si c'est a ou A.
-					else if(event.which == 65 || event.which == 97)
-					{
-						if(!mos.helpDisplayed)
-						{
-							mos.notifyHelp();
-						}
-						else
-						{
-							mos.removeHelp();
-						}
-					}
+					mos.manageControlEvents(event);
                 });
             });
         </script>