commit 0bd646e44064921316fc51262ea66c40f172c76b
Author: Marc Souviron <victor.pongnian@laposte.net>
Date:   Sat Aug 24 02:35:12 2013 +0200

    remise en forme du travail de Victor Pongnian suit à son stage
    Il reste pas mal de cosmétique à revoir mais le système devrait déjà être utilisable dans l'état.

diff --git a/.htaccess b/.htaccess
new file mode 100644
index 0000000..a6593f6
--- /dev/null
+++ b/.htaccess
@@ -0,0 +1,4 @@
+AddDefaultCharset UTF-8
+php_value output_buffering off
+php_value display_errors on
+php_value error_reporting 32767
diff --git a/addParams.php b/addParams.php
index e64d387..dfaf1fa 100644
--- a/addParams.php
+++ b/addParams.php
@@ -1,118 +1,106 @@
 <!DOCTYPE html>
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
+<head>
+   <meta http-equiv="Content-type" content="text/html; charset=UTF-8"/>
+   <link rel="stylesheet" media="screen" href="css/index_style.css" />
+   <title>Positionnerment dun panoramique</title>
 <?php
-if(isset($_GET['dir']) && isset($_GET['panorama'])){
-	
-	$_GET['dir'] = htmlspecialchars($_GET['dir']);              //Protection des variables GET.
-	$_GET['panorama'] = htmlspecialchars($_GET['panorama']);    // ...
-	
-	if (isset($_POST['param_latitude']) && isset($_POST['param_longitude']) 
-	&& isset($_POST['param_altitude']) && isset($_POST['param_elevation']) 
-	&& isset($_POST['param_title']) && isset($_POST['param_loop'])) {
-		
-		foreach ($_POST as $value)                              //Protection des variables POST.
-		{	
-		    $value = htmlspecialchars($value);
-		}
+   // tableau de vérification de conformité
+ $params = array('title' => array('name' => 'titre', 
+				  'pattern' => '^.{1,50}$',
+				  'required' => true),
+		 'latitude' => array('name' => 'latitude', 
+				     'type' => 'numeric',
+				     'min' => -180,
+				     'max' => 180,
+				     'required' => true),
+		 'longitude' => array('name' => 'longitude', 
+				     'type' => 'numeric',
+				      'min' => -180,
+				      'max' => 180,
+				      'required' => true),
+		 'altitude' => array('name' => 'altitude', 
+				     'type' => 'numeric',
+				     'min' => -180,
+				     'max' => 180,
+				     'required' => true),
+		 'loop' => array('name' => 'image_loop', 
+				 'type' => 'boolean',
+				 'required' => false),
+		 'dir' => array('required' => true),
+		 'panorama' => array('required' => true));
+$wrong = array();
+$values = array();
+// vérification de la conformité
+foreach($params as $param => $check) {
+  if (isset($_REQUEST['param_'.$param])) {
+    $tst = $_REQUEST['param_'.$param];
+    if ((isset($check['min']) || isset($check['max'])) && ! is_numeric($tst)) $wrong[$param] = "<em>$tst</em> ne correspond pas à une valeur numérique";
+    else if (isset($check['min']) && $tst < $check['min']) $wrong[$param] = "<em>$tst</em> trop bas";
+    else if (isset($check['max']) && $tst > $check['max']) $wrong[$param] = "<em>$tst</em> trop haut";
+    else if (isset($check['pattern']) && preg_match('/'.preg_quote($check['pattern']).'/', $tst)) $wrong[$param] = "<em>$tst</em> non conforme";
+    else $values[$param] = $tst;
+  } else if (isset($check['required']) && $check['required']) {
+    $wrong[$param] = '<em>$tst</em> est un paramètre manquant';
+  }
+}
 
-		/* --- Vérification des inputs avec des regex. ---*/
-	    // Pour la latitude : ( Le javascript bride entre -90 et 90)
-	    if (preg_match("#^(\-?[1-9]+[0-9]?[.,]{0,1}[0-9]{0,6}|\-?[0-9]{1}[.,]{0,1}[0-9]{0,6})$#", $_POST['param_latitude']))
-	    {
-	    	$lat = $_POST['param_latitude'];
-	        //echo 'Le ' . $_POST['param_latitude'] . ' est un numéro <strong>valide</strong> !';
-	    }
-	    else
-	    {
-	        echo 'Le ' . $_POST['param_latitude'] . ' n\'est pas valide, recommencez !';
-	        
-	    }
-	    
-	    // Pour la longitude : ( Le javascript bride entre -180 et 180)
-	    if (preg_match("#^(\-?[1-9]+[0-9]?[.,]{0,1}[0-9]{0,6}|\-?[0-9]{0,1}[.,]{1}[0-9]{0,6})$#", $_POST['param_longitude']))
-	    {
-	    	$lon = $_POST['param_longitude'];
-	        //echo 'Le ' . $_POST['param_longitude'] . ' est un numéro <strong>valide</strong> !';
-	    }
-	    else
-	    {
-	        echo 'Le ' . $_POST['param_longitude'] . ' n\'est pas valide, recommencez !';
-	        
-	    }
-	    
-	    // Pour l'altitude ( Le javascript bride entre 0 et 500)
-	    if (preg_match("#^([1-9]+[0-9]{0,4}|0)$#", $_POST['param_altitude']))
-	    {
-	    	$alt = $_POST['param_altitude'];
-	        //echo 'Le ' . $_POST['param_altitude'] . ' est un numéro <strong>valide</strong> !';
-	    }
-	    else
-	    {
-	        echo 'Le ' . $_POST['param_altitude'] . ' n\'est pas valide, recommencez !';
-	        
-	    }
-	    
-	    // Pour l'élévation  ( Le javascript bride entre -10 et 10)
-	    if (preg_match("#^(\-?[1-9]+[0-9]?|0)$#", $_POST['param_elevation']))
-	    {
-	    	$ele = $_POST['param_elevation'];
-	        //echo 'Le ' . $_POST['param_elevation'] . ' est un numéro <strong>valide</strong> !';
-	    }
-	    else
-	    {
-	        echo 'Le ' . $_POST['param_elevation'] . ' n\'est pas valide, recommencez !';
-	        
-	    }
-	    
-	    $loop = $_POST['param_loop'];   // Variable radio automatiquement présente
-	    if(isset($lat) && isset($lon) && isset($alt) && isset($ele) && isset($loop)) {
- 	
-	    	// On recherche le dossier correspondant au panorama en question
-	    	$dir_file = "/var/www/data/tsf2/vpongnian/panorama/".$_GET['dir']."/".$_GET['panorama'];
-	    	$dir_open = opendir($dir_file);
-	    	while (false !== ($file = readdir($dir_open))) {
-    	               // Si on trouve bien des tuiles
-		       if (preg_match('/(.*)_[0-9]+_[0-9]+_[0-9]+\.jpg$/', $file, $reg)) {
-			 $prefix = $reg[1];
-			 $new_param_file = $prefix.".params";
-			 break;   // On sort à la première tuile trouvée
-		       }
-		    }
-		    closedir($dir_open);
-		    
-		    $retour = "\n"; 
-                    // On vérifie qu'on a bien crée un nouveau fichier .params et on écrit dedans.
-		    if(isset($new_param_file)){
-		    	$param_file = fopen($dir_file."/".$new_param_file,'a+');
-		    	fputs($param_file,"titre = \"" . $_POST['param_title'] . "\"");
-		    	fputs($param_file,$retour);
-		    	fputs($param_file,"latitude = " . $lat);
-		    	fputs($param_file,$retour);
-		    	fputs($param_file,"longitude = " . $lon);
-		    	fputs($param_file,$retour);
-		    	fputs($param_file,"altitude = " . $alt);
-		    	fputs($param_file,$retour);
-		    	fputs($param_file,"elevation = " . $alt);
-		    	fputs($param_file,$retour);
-		    	fputs($param_file,"image_loop =" . $loop);
-		    	fputs($param_file,$retour);
-		    	fclose($param_file);
-		    	
-		    	echo 'Paramétrage OK. Retour au panorama';
-		    	header("Refresh: 1; URL=index.php");  
-		    } else {
-		    	
-		    	echo "<script>alert(\"impossible d'écrire dans le fichier\")</script>";
-		    }
-	    }
+if (isset($values['panorama'])) {
+  $back_url = sprintf('panorama.php?panorama=%s', $values['panorama']);
+  if (isset($values['dir'])) $back_url .= '&amp;dir='. $values['dir'];
+} else {
+  $back_url = '.';
+}
+
+if (count($wrong) == 0) {
+  // On recherche le dossier correspondant au panorama en question
+  $dir_file = "./".$values['dir']."/".$values['panorama'];
+  $dir_open = opendir($dir_file);
+  while (false !== ($file = readdir($dir_open))) {
+    // Si on trouve bien des tuiles
+    if (preg_match('/(.*)_[0-9]+_[0-9]+_[0-9]+\.jpg$/', $file, $reg)) {
+      $prefix = $reg[1];
+      $new_param_file = $prefix.".params";
+      break;   // On sort à la première tuile trouvée
+    }
+  }
+  closedir($dir_open);
+  
+  // On vérifie qu'on a bien créée un nouveau fichier .params et on écrit dedans.
+  if(isset($new_param_file)){
+    $fid = fopen($dir_file."/".$new_param_file,'a+');
+    echo '<p>Les valeurs suivantes sont utilisées.</p>'."\n";
+    echo "<dl>\n";
+    foreach ($values as $k => $v) {
+      echo "$k -$v<br/>\n";
+      if (isset($params[$k]['name'])) {
+	$nm = $params[$k]['name'];
+	if (isset($params[$k]['type']) && $params[$k]['type'] == 'numeric') {
+	  $vf = $v;
+	} else if (isset($params[$k]['type']) && $params[$k]['type'] == 'boolean') {
+	  $vf = $v ? "true" : "false"; 
 	} else {
-		echo '<script>alert(\'$_POST manquant\')</script>';
-		header("Refresh: 2; URL=javascript:history.back();"); 	
+	  $vf = "\"$v\"";
 	}
-} else {
-echo '<script>alert(\'La destinaton est manquante\')</script>';
-header("Refresh: 2; URL=javascript:history.back();");
+	fputs($fid, "$nm = $vf\n");
+	printf("<dt>%s</dt>\n<dd>%s</dd>\n", $nm, $vf);
+      }
+    }
+    echo "</dl>\n";
+    fclose($fid);
+    echo '<p class="succes">Paramétrage terminé.</p>'."\n";
+  } else {
+    printf("<p class=\"error\">impossible d'écrire dans le fichier '%s'</p>\n", $dir_file);
+  }
+ } else {
+  echo '<p class="error">Les valeurs suivantes sont incorrectes.</p>'."\n";
+  echo "<dl>\n";
+  foreach ($wrong as $k => $v) {
+    printf("<dt>%s</dt>\n<dd>%s</dd>\n", $k, $v);
+  }
+  echo "</dl>\n";
 }
+printf('<a href="%s">Retour au panorama</a></p>'."\n", $back_url);
 
 ?>
 </html>
diff --git a/class/index.php b/class/index.php
old mode 100755
new mode 100644
diff --git a/class/site_point.class.php b/class/site_point.class.php
old mode 100755
new mode 100644
index 1a5de01..ccb0b83
--- a/class/site_point.class.php
+++ b/class/site_point.class.php
@@ -7,6 +7,8 @@ class site_point {
   private $zooms;
 
   public function __construct($dir) {
+    // si $dir n'est pas un répertoire il ne s'agit pas d'un panorama.
+    if (!is_dir($dir)) return;
     $this->base_dir = $dir;
     $dir_fd = opendir($this->base_dir);
   
@@ -80,8 +82,7 @@ class site_point {
     
     $e = atan2(($alt2 - $alt1)/1000 - $d*$d/(2*$rt), $d);  // angle de l'élévation en radians
     //    printf("%s, %s, %s, %s\n",$lat1, $this->params['latitude'], $lat, $dLat);
-	
-    return array($d, $cap*180/M_PI, $e*180/M_PI, $rapport);   // les résultats sont en degrés
+    return array($d, $cap*180/M_PI, $e*180/M_PI);   // les résultats sont en degrés
   }
   
 }
diff --git a/class/sites_dir.class.php b/class/sites_dir.class.php
old mode 100755
new mode 100644
index 1f5e2a9..c8d5057
--- a/class/sites_dir.class.php
+++ b/class/sites_dir.class.php
@@ -4,19 +4,11 @@ class sites_dir {
 
   public function __construct($dir) {
     $this->base_dir = $dir;
-    }
+  }
   
   public function get_sites() {
-	try
-	{
-	    $dir_fd = opendir($this->base_dir);
-	}
-	catch(Exception $e)
-	{
-		die('Erreur : '.$e->getMessage());
-	}
-	     
- 
+    $dir_fd = @opendir($this->base_dir);
+
     $point_list = array();
     while (false !== ($point_dir = readdir($dir_fd))) {
       $pt = new site_point($this->base_dir.'/'.$point_dir);
@@ -26,7 +18,6 @@ class sites_dir {
   }
   
   public function get_dir() {
-  	return $this->base_dir;
+    return $this->base_dir;
   }
-
 }
diff --git a/class/utils.class.php b/class/utils.class.php
new file mode 100644
index 0000000..796c94b
--- /dev/null
+++ b/class/utils.class.php
@@ -0,0 +1,18 @@
+<?php
+
+abstract class utils {
+  static public function init() {
+    function __autoload($class) {
+      $class_loc = 'class/'.$class.'.class.php';
+      if (is_readable($class_loc)) {
+	require_once($class_loc);
+      }
+    }
+
+    function errorToException($code, $msg, $file, $line) {
+      throw new Exception($msg);
+    }
+    set_error_handler('errorToException');
+  }
+
+}
diff --git a/creerPano.php b/creerPano.php
deleted file mode 100644
index 4313bb0..0000000
--- a/creerPano.php
+++ /dev/null
@@ -1,62 +0,0 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
-	<head>
-		<meta http-equiv="Content-type" content="text/html; charset=UTF-8"/>
-		<link rel="stylesheet" media="screen" href="css/ttn_style_1.css" />
-    	<title>creation d'un panoramique</title>
-    	<script type="text/javascript">
-    	
-		function showLoad(outgoingLink){
- 
-		var link = document.getElementById(outgoingLink);
-		var loader = document.createElement('img');
-		loader.id = 'loader';
-		loader.src ='images/loader2.gif';
-		var li = link.parentNode;
-		li.appendChild(loader);
-		}
-    	</script>
-    </head>
-    <body>
-	    <img id="top" src="images/top.png" alt="">
-		<div id="page_container">
-		    <h1><img src="images/tetaneutral.png"></h1>
-		  	<h2>Listes des photos sur le serveur</h2> 
-		  	<p>Cliquez pour générer un panorama</p>  
-       		<div id="containerList">
-		    	<ul>
-		    	
-	       		<?php
-                        
-	       		$base_dir = "/var/www/data/tsf2/vpongnian/panorama/upload/"; // modifier selon l'arborescence.
-				    try
-					{
-                                            // On ouvre le dossier ou se trouve les images
-					    $dir_fd = opendir($base_dir); 
-					    
-					    $i=0;         // Garantir l'unicité du id des liens.
-					    while (false !== ($image_name = readdir($dir_fd))) {
-					    	$dir = $base_dir.$image_name;   
-					    	
-							if ($image_name != "." && $image_name != "..")   // N'affiche pas les répertoires parents et courant.
-							{
-							     printf('<li><a href="genererPano.php?name=%s" id="link_'.$i.'" onclick="showLoad(this.id);return true;">%s</a></li>'."\n",$image_name,$image_name);
-							     $i++; 
-							}  
-							      
-					        	
-					    }
-					}
-					catch(Exception $e)
-					{
-						die('Erreur : '.$e->getMessage());
-					} 
-	       		?>
-       			</ul>
-    		</div>
-    		<div id="footer"><a href="./index.php">Retour à l'index</a></div>
-			
-    	</div>
-    	<img id="bottom" src="images/bottom.png" alt="">
-    </body>
-</html>
diff --git a/css/index_style.css b/css/index_style.css
index 8964d95..465f670 100644
--- a/css/index_style.css
+++ b/css/index_style.css
@@ -1,137 +1,91 @@
-	body
-	{
-		
-		background:#44F;
-		font-family:"Lucida Grande", Tahoma, Arial, Verdana, sans-serif;
-		font-size:small;
-		margin:8px 0 16px;
-		text-align:center;
-		overflow:auto;
-		
-	}
-	
-	#top
-	{
-		display:block;
-		height:10px;
-		margin:10px auto 0;
-		width:650px;
-	}
-	
-	div#index_container
-	{
-		background:#fff;
-		
-		margin: auto;
-		text-align:left;
-		width:640px;
-	}
-	
-	div#index_container h2 {
-		margin:1.05em;
-		text-shadow: 0.1em 0.1em 0.15em #44F; 
-	}
-	#bottom
-	{
-		display:block;
-		height:10px;
-		margin:0 auto;
-		width:650px;
-	}
-	
-	h1
-	{
-		background-color:#6699CC;
-		margin:0;
-		min-height:0;
-		padding:0;
-		text-decoration:none;
-		text-align: center;
-		
-	}
-	
-	h1 a
-	{
-		
-		display:block;
-		height:100%;
-		min-height:40px;
-		
-	}
-	
-	h1 img
-	{
-		margin-top: 8px;
-	}
-	
-	img
-	{
-		/*behavior:url(css/iepngfix.htc);*/
-		border:none;
-	}
-	
-	div#containerList
-	{
-		margin:20px 20px 0;
-		padding:0 0 20px;
-	}
-	
-	#containerList
-	{
-		font-family:Lucida Grande, Tahoma, Arial, Verdana, sans-serif;
-		
-	}
-	
-	#containerList li
-	{
-		width:100%;
-		margin:1.05em;
-		font-size:14px;
-		
-	}
-	
-	div#containerList ul
-	{
-		font-size:100%;
-		list-style-type:circle;
-		margin:0;
-		padding:0;
-		width:100%;
-	}
-	
-	div#interaction {
-		background-color:#fff;
-		margin: auto;
-		width:640px;
-		border-top: 2px dotted #44F;
-	}
-	
-	div#interaction li{
-	
-		display:inline-block;
-		list-style-type:none;
-		margin:1.08em;
-	
-	}
-	
-	div#interaction li a{
-	
-	    color:#3F2DFF;
-	    text-decoration:none;
-	    font-size:16px;
-    }
-	 
-	div#interaction li a:hover {
-		color:#FF9900;
-		text-decoration:underline;
-	}
-	
-	
-	
-	p a {
-		background-color:#fff;
-		border-radius: 4px;
-		padding:3px;
-		text-shadow: 0.1em 0.05em 0.15em #444; 
-		font-size:11px;
-	}
\ No newline at end of file
+* {
+    margin:0;
+    padding:0;
+    font-family:Arial, Verdana, sans-serif;
+}
+
+body {
+    background-color:#44F;
+    text-align:center;
+    width:50rem;
+    margin:auto;
+}
+
+header {
+    margin:1rem 0;
+    box-shadow:0 0 0.5rem 0 #000;
+    background-color:#69C;
+}
+
+h1 {
+    text-align:center;
+    padding:0.2rem;
+}
+
+img {vertical-align:middle}
+
+h2 {
+    padding:0.5em 1em;
+    text-shadow: 0.1em 0.1em 0.15em #44F; 
+}
+
+#main {
+    box-shadow:0 0 0.5rem 0 #000;
+    text-align:left;
+    background-color:#FFF;
+}
+
+#main a {text-decoration:none}
+
+#pano-list li samp:after {
+    padding-left:1em;
+    content:'fichier non configuré';
+    font-weight:bold;
+    color:#F00;
+}
+#pano-list li {
+    list-style-type:circle;
+    list-style-position:inside;
+    border:dashed #777 0;
+    border-top-width:0.1em;
+    padding:0.3em 1em;
+}
+
+#pano-list li:nth-child(6n),
+#pano-list li:nth-child(6n+1),
+#pano-list li:nth-child(6n+2) {
+    background-color:#FFE;
+}
+
+#pano-list li:nth-child(6n+3),
+#pano-list li:nth-child(6n+4),
+#pano-list li:nth-child(6n+5) {
+    background-color:#FEF;
+}
+
+#interaction {
+    text-align:center;
+    border:solid #777 0;
+    border-top-width:0.1em;
+    padding:0.5em 0;
+}
+
+#interaction a {
+    padding:1em;
+}
+
+#interaction a:hover {
+    color:#F90;
+    text-decoration:underline;
+}
+
+footer {
+  margin:1rem 0
+}
+
+.validators a {
+    background-color:#fff;
+    border-radius: 0.4rem;
+    padding:0.3ex;
+    text-shadow: 0.1em 0.05em 0.15em #444; 
+}
diff --git a/css/all.css b/css/map.css
old mode 100755
new mode 100644
similarity index 51%
rename from css/all.css
rename to css/map.css
index 92a473e..0e41cd0
--- a/css/all.css
+++ b/css/map.css
@@ -1,4 +1,5 @@
 * {
+    font-family:Arial, Verdana, sans-serif;
     padding:0;
     margin:0;
 }
@@ -49,69 +50,54 @@ legend:hover {
     cursor:default;
 }
 
-fieldset#control {
-    text-shadow:2px 2px 2px #000, -2px -2px 2px #000;
-    color:#FFF;
-    float:left;
-    position:absolute;
-    top:1em;
-    left:2em;
-    background-color:rgba(128,128,128,0.5);
-    border:solid #F00 1px;
-    border-radius:0.5em;
-    padding:0.2em 0.5em;
-}
+img {vertical-align:middle}
 
 input {
     vertical-align:middle;
 }
 
-
 input[type="number"] {
     border-radius:1em;
     display:block;
     float:right;
+    width:10ex;
 }
 
-#locadraw input[type="number"] {
-    width:10ex;
+input[type="submit"],
+input[type="reset"],
+input[type="button"] {
+    border-radius:0.4rem;
+    padding:0.2em 1em;
+    margin:0.2em;
 }
 
-#res>:not(ul), #control, #params, #info ,#addParams ,#adding, #loca{
-    user-select:none;
-    -khtml-user-select:none;
-    -o-user-select:none;
-    -moz-user-select:-moz-none;
-    -webkit-user-select:none;
+input[type="checkbox"] {
+    margin:0 1em;
 }
 
-div#params {
-    padding:0.2em 1.3em;
+#params {
+    padding:0.2em 0.5em;
     border-radius:0.5em;
     background-color:rgba(128,128,128,0.5);
     border:solid #00F 1px;
     position:absolute;
     top:1em;
     right:2em;
-    float:right;
+    min-width:10em;
+    color:#FFF;
 }
 
-div#params em {
-	
+#params em {	
     display:block;
     float:right;
     background-color:#88F;
     border-radius:0.5em;
     padding:0 0.5em;
-    color:#FFF;
-}
-
-div#params em:nth-child[2] {
-    display:inline;
+    color:#FF0;
 }
 
-span#loca{
-	text-shadow:2px 2px 2px #000, -2px -2px 2px #000;
+#loca_show {
+    text-shadow:2px 2px 2px #000, -2px -2px 2px #000;
     color:#FFF;
     float:left;
     position:absolute;
@@ -122,137 +108,83 @@ span#loca{
     padding:0 1em; 
 }
 
-
-div#addParams  {
-	text-shadow:2px 2px 2px #000, -2px -2px 2px #000;
+#addParams {
+    text-shadow:2px 2px 2px #000, -2px -2px 2px #000;
     color:#FFF;
-    float:left;
     position:absolute;
     top:1em;
     right:2em;
-    
     border:solid #F00 1px;
     border-radius:0.5em;
     padding:0.2em 0.5em;
     background-color:#F88; 
-    padding:0 1em; 
-   
+    padding:0 1em;
 }
 
-div#addParams label {
-        
+#addParams label {
     border-radius:0.5em;
     padding:0 1em;
 }
 
-div#addParams label:hover {
-	 color: #FF0; 
-     
+#addParams label:hover {
+    color: #FF0; 
 }
 
-fieldset#locadraw {
-    
+fieldset {
+    border:solid #F00 1px;
+    border-radius:0.5em;
+    padding:0 0.5em;
     color:#FFF;
-    float:left;
     position:absolute;
+    background-color:rgba(128,128,128,0.5);
+}
+
+fieldset#control {
+    top:1em;
+    left:2em;
+    padding:0.2em 0.5em;
+}
+
+
+fieldset#locadraw {
     bottom:1em;
     left:1em;
-    background-color:rgba(128,128,128,0.5);
-    border:solid #F00 1px;
-    border-radius:0.5em;
-    padding:0 1em;
     visibility:hidden;
+    min-width:10em;
 }
 
 fieldset#adding {
-    
-    color:#FFF;
-    float:left;
-    position:absolute;
     top:1em;
     right:2em;
-    background-color:rgba(128,128,128,0.5);
-    border:solid #F00 1px;
-    border-radius:0.5em;
-    padding:0 1em;
     visibility: hidden;
 }
 
-
-
-form#form_param label {
-	
-    margin-right: 15px;
-    width: 0.5em;
-    padding:0.3em 0.5em;
-    min-height: 1px;
-    text-align: left;
+#form_param label {	
     text-shadow:2px 2px 2px #000, -2px -2px 2px #000;
 }
  
 
 input:focus {
-  border-color: rgba(82, 168, 236, 0.75);
-  -moz-box-shadow: 0 0 8px rgba(82, 168, 236, 0.5);
-  -webkit-box-shadow: 0 0 8px rgba(82, 168, 236, 0.5);
-  box-shadow: 0 0 8px rgba(82, 168, 236, 0.5);
-}
- 
-.correct {
-  border-color: rgba(68, 191, 68, 0.75);
+  background-color:#004;
+  color:#FFF;
+  border-color:#F00;
 }
  
-.correct:focus {
-  border-color: rgba(68, 191, 68, 0.75);
-  -moz-box-shadow: 0 0 8px rgba(68, 191, 68, 0.5);
-  -webkit-box-shadow: 0 0 8px rgba(68, 191, 68, 0.5);
-  box-shadow: 0 0 8px rgba(68, 191, 68, 0.5);
-}
- 
-.incorrect {
-  border-color: rgba(191, 68, 68, 0.75);
-}
- 
-.incorrect:focus {
-  border-color: rgba(191, 68, 68, 0.75);
-  -moz-box-shadow: 0 0 8px rgba(191, 68, 68, 0.5);
-  -webkit-box-shadow: 0 0 8px rgba(191, 68, 68, 0.5);
-  box-shadow: 0 0 8px rgba(191, 68, 68, 0.5);
-} 
-
-/*p#chsignInfo {
-color:#F00;
-font-size: 12px;
-margin:1.02em 1em;
-background-color: #CCC;
-border-radius: 4px;
-padding:2px;
-}*/
-
-.answer {
-  margin:0.2em 0;
-  display:block;
-}
-
-.answer input {
-  border-radius:0.5rem;
-  padding:0.2em 0.7em;
-}
-
-.form_button {
-    background-color:rgba(128,128,128,0.9);
-    /*background: url(button.png) no-repeat top;*/
-    display:inline-block;
-}
-
 .validators {
     text-align:center;
-    background-color:#CCC;
+    background-color:rgba(50%,50%,50%,0.5);
     border:solid 1px #F55;
-    border-width:0 0 1px 0;
-    display:none;
+    border-radius:0.5em;
+    border-width:1px;
+    position:absolute;
+    bottom:1em;
+    left:45%;
+    padding:0.2em 0.5em;
+    font-size:80%;
 }
 
+.validators img {height:1em}
+
 #res {
     padding:0.2em 0.4em;
     color:#FF8;
@@ -263,11 +195,10 @@ padding:2px;
     border:solid #FFF 1px;
 }
 
-#res:empty {padding:0;}
+#res:empty {display:none}
 
 #res li {
     list-style-type: none;
     color:#FFF;
     background-color:rgba(100,0,0,0.5);
-
 }
diff --git a/description b/description
deleted file mode 100644
index 31802c9..0000000
--- a/description
+++ /dev/null
@@ -1 +0,0 @@
-Système de visualisateton et de parcours des panoramas via le Web.
diff --git a/envoyer.php b/envoyer.php
index ba995b3..bcb168b 100644
--- a/envoyer.php
+++ b/envoyer.php
@@ -1,168 +1,36 @@
-<?php $uid = md5(uniqid(rand())); ?>
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
+<!DOCTYPE html>
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
-	<head>
-    	
-    	<meta http-equiv="Content-type" content="text/html; charset=UTF-8"/>
-    	<link type="image/x-icon" rel="shortcut icon" href="images/tsf.png"/>
-  		<link rel="stylesheet" media="screen" href="css/view.css" />
-    	<title>Upload d'une image sur le serveur !</title>
-    	        <!-- suivi de l'upload par ajax. Peut être utile pour certains navigateurs qui ne renseigne pas l'avancement.
-		<script type="text/javascript">
-			var HttpRequestObject = false;
-			if(window.XMLHttpRequest) {
-			   HttpRequestObject = new XMLHttpRequest();
-			}
-			else if(window.ActiveXObject) {
-			   HttpRequestObject = new ActiveXObject("Microsoft.XMLHTTP");
-			}
-			
-			function startProgress(uid) {
-			  
-				
-			   <!--document.getElementById('upload').style.display = 'none';-->
-			   document.getElementById('pb_outer').style.display = 'block';
-			   setTimeout('getProgress("' + uid + '")', 1000);
-			  
-			   
-			   
-			}
-			function getProgress(uid) {
-			   if(HttpRequestObject) {
-			      HttpRequestObject.open('GET', 'getprogress.php?uid=' + uid, true);
-			      HttpRequestObject.onreadystatechange = function() {
-			         if(HttpRequestObject.readyState == 4 && HttpRequestObject.status == 200) {
-			            var response = HttpRequestObject.responseText;
-			            var elem = response.split('#');
-			            var progress = elem[0];
-			            var url =elem[1];
-			            var message=elem[2];
-			            
-			            document.getElementById('pb_inner').style.width = progress + '%';
-			            document.getElementById('pb_inner').innerHTML = progress + '%';
-			           
-			            if(progress < 100) {
-			               
-			               setTimeout('getProgress("' + uid + '")', 100);
-			                
-			            } else {
-				            if(message !=='') {
-				            	document.getElementById('pb_outer').style.display = 'none';
-				            	document.getElementById('pb_inner').style.width = 'none';
-				           		alert(message);
-				            } else {
-					            document.getElementById('pb_inner').innerHTML = 'Upload Complete!';
-					            document.location.href= url; 
-				            }
-			            }
-			         }
-			      }
-			      
-			      HttpRequestObject.send(null);
-			   }
-			}
-			
-			function showLoader() {
-				document.getElementById('loader').innerHTML = "Veuillez patienter ...  ";
-				
-				
-			}
-			
-		</script>
-	</head>
-	<body id="main_body">
-  		<img id="top" src="images/top.png" alt="">
-		<div id="form_container">
-			<h1><img src="images/tetaneutral.png"></h1>
-		
-	    	<form onSubmit="startProgress('<?php echo $uid; ?>');" action="uploadTest.php" method="post" class="appnitro" enctype="multipart/form-data" name="upload" id="upload" target="upload_frame">
-				 <h2>Ajouter un nouveau panorama</h2>
-										
-			<ul>
-				<li id="li_1" >
-					<label for="file" class="description">Envoyer le fichier :</label>
-					<div>
-			        <input type="hidden" name="APC_UPLOAD_PROGRESS" id="progress_key" value="<?php echo $uid; ?>" />
-			        <input type="file" name="file" id="file" />
-			   	 	</div>  
-				</li>
-				
-				<li class="buttons">
-	        		<input type="submit" name="submit" id="submit" value="Submit" />
-	        	</li>
-			</ul>
-			</form>
-			<!-- Fin du formulaire -->
-			<div id="footer">
-				<a href="./index.php">Retour liste</a>
-			</div>
-		</div>
-		<div id="infoSize">
-		<img src="images/bulle.png" id="bulle"/>
-		<label id="txtInfo">Le fichier à envoyer doit etre une image de type .tif ou .jpeg<br />
-        Taille maximale : 300 Mo</label>
-    	</div>
-		<!-- Barre d'upload -->
-		<div id="pb_outer">
-  		<div id="pb_inner"></div>
-  		</div>
-  		<p id="info"></p>
+  <head>
+    <meta http-equiv="Content-type" content="text/html; charset=UTF-8"/>
+    <link type="image/x-icon" rel="shortcut icon" href="images/tsf.png"/>
+    <link rel="stylesheet" media="screen" href="css/view.css" />
+    <title>Envoi d'une image sur le serveur</title>
+  </head>
+  <body id="main_body">
+    <img id="top" src="images/top.png" alt="">
+    <div id="form_container">
+      <h1><img src="images/tetaneutral.svg"></h1>
+      <form action="uploadReceive.php" method="post" enctype="multipart/form-data" id="upload">
+	<h2>Ajouter un nouveau panorama</h2>
+	<ul>
+	  <li id="li_1" >
+	    <label for="file" class="description">Envoyer le fichier :</label>
+	    <div>
+	      <input type="hidden" name="APC_UPLOAD_PROGRESS" id="progress_key" value="panoramas"/>
+	      <input type="file" name="files[]" id="file" multiple="multiple"
+		     title="Le fichier à envoyer doit être une image de taille maximale 300 Mo"/>
+	    </div>  
+	  </li>
 	  
-	  <iframe style="display: none" id="upload_frame" name="upload_frame"></iframe>
-	 
-    <?php 
-    
-    /*******************************************************************
-     * Permet d'afficher l'image uploadée sur le serveur
-     *******************************************************************/
-
-    if(isset($_GET['img']) && isset($_GET['dir'])){
-  
-    	apc_delete('link');   // Suppression de la variable cache.
-    	
-    	$image_name = htmlspecialchars($_GET['img']);
-    	$dir_image = htmlspecialchars($_GET['dir']);
-    	
-        $basename = basename($_GET['img']);
-    	$filePartArr = explode('.', $basename);  
-        $ext = $filePartArr[count($filePartArr) - 1];
-	if($ext=="tif"){
-		$basename = basename($_GET['img'],".tif");
-	}else if($ext=="jpeg"){
-	      $basename = basename($_GET['img'],".jpeg");
-       	} else {
-	      $basename = basename($_GET['img'],".jpg");
-	} 
-    	        //Permet d'afficher l'image après uptload ( Conversion des .tiff et .jpg pour affichage dans le navigateur )
-		$input = 'convert /var/www/data/tsf2/vpongnian/panorama/upload/'.$_GET['img'].' -resize 10% /var/www/data/tsf2/vpongnian/panorama/upload/'.$basename.'.jpg'; // Adapter les chemins absolus ou relatifs
-		$escaped_command = escapeshellcmd($input);
-		$output = shell_exec($escaped_command);
-		echo "<pre>$output</pre>\n";
-		
-    ?><div id="genererPano">
-		<form enctype="multipart/form-data" action="<?php echo "envoyer.php"/*htmlspecialchars($_SERVER['PHP_SELF'])*/; ?>" method="post" onSubmit="showLoader()">
-		  <p>
-		    <label id="l_generer" for="no" title="Génerer le panoramique">Generer le panoramique :</label>
-		    <input type="hidden" name="image_name" value="<?php echo $image_name; ?>" />
-		    <input type="submit" name="no" value="pas maintenant"/>
-		    <input type="submit" name="yes" value="oui" />
-		    <label id="loader"></label>
-		  </p>
-		</form>
-	  </div>
-    <?php 
-   
-    echo "<img src=/data/tsf2/vpongnian/panorama/upload/".$basename.".jpg id='imageUpload'/>";
-    }  
-    if (isset($_POST['no'])) {
-		header("Location: ./index.php"); /* Redirection du navigateur */
-		exit;
-	} 
-	if (isset($_POST['yes'])) {
-		header("Location: ./genererPano.php?name=".$_POST['image_name']);
-		exit;
-	}
-    ?>
-   
+	  <li class="buttons">
+	    <input type="submit" name="submit" id="submit" value="Submit" />
+	  </li>
+	</ul>
+      </form>
+      <!-- Fin du formulaire -->
+      <div id="footer">
+	<a href="./index.php">Retour liste</a>
+      </div>
+    </div>
   </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/genererPano.php b/genererPano.php
index 847ad22..b6cadca 100644
--- a/genererPano.php
+++ b/genererPano.php
@@ -1,40 +1,58 @@
-<?php
-	if (isset($_GET['name'])) {
-		// Protection de la variable GET
-		$pano_name = htmlspecialchars($_GET['name']);
-		$filePartArr = explode('.',$pano_name);  
-		$ext = $filePartArr[count($filePartArr) - 1];
-		if($ext=="tif"){
-			$pano_basename = basename($pano_name,".tif");
-		}else if($ext=="jpeg"){
-		      $pano_basename = basename($pano_name,".jpeg");
-		} else {
-			$pano_basename = basename($pano_name,".jpg");
-		} 
+<!DOCTYPE html>
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
+<head>
+  <meta http-equiv="Content-type" content="text/html; charset=UTF-8"/>
+  <link type="image/x-icon" rel="shortcut icon" href="images/tsf.png"/>
+  <title>convertiseur image vers panorama</title>
+</head>
 
-		//Partie exécutante du script gen_tiles qui gènere les tuiles à partir d'une image.
-		$input = './to_tiles/gen_tiles.sh -p '.$pano_basename.' /var/www/data/tsf2/vpongnian/panorama/upload/'.$pano_name;
-		$escaped_command = escapeshellcmd($input);
-		$output = shell_exec($escaped_command);
-		$log_file = fopen('./log/'.$pano_basename.'.log','a+');
-		fputs($log_file, $output);   // verbose intégré dans un .log.
-		fclose($log_file);
-		
-                // Ouverture d'un nouveau dossier qui contiendra toutes les tuiles.
-		$dir = '/var/www/data/tsf2/tiles/'.$pano_basename;
-		
-		mkdir($dir,0777);
-		
-		$dir_fd = opendir('/var/www/data/tsf2/vpongnian/panorama');
+<?php
+require 'class/utils.class.php';
+utils::init();
+if (isset($_GET['name'])) {
+  $pano_name = $_GET['name'];
+  $pano_basename = preg_replace('/\.[^.]+$/', '', $pano_name);
+  
+  //Partie exécutante du script gen_tiles qui gènere les tuiles à partir d'une image.
+  $panos_dir = 'tiles';
+  $pano_dest = $panos_dir.'/'.$pano_basename;
+  if (! is_dir($panos_dir)) {
+    echo "<p class=\"error\">le répertoire \"$panos_dir\" n'est pas accessible</p>\n";
+  } else if (file_exists($pano_dest)) {
+    echo "<p class=\"error\">le nom de répertoire \"$pano_dest\" est déjà pris</p>\n";
+  } else {
+    mkdir($pano_dest);
+    $escaped_command = escapeshellcmd('./to_tiles/gen_tiles.sh -p '.$pano_dest.'/'.$pano_basename.' ./upload/'.$pano_name);
 		
-		while (false !== ($image_name = readdir($dir_fd))) {
-	    	        // Déplacement des tuiles dans le nouveau dossier à partir de dir_fd.
-			if(preg_match('/(.*)_[0-9]+_[0-9]+_[0-9]+\.jpg$/', $image_name, $reg)) {
-	        	rename("./".$image_name, $dir."/".$image_name);
-	    	}
-	    	
-	    }
-	    closedir($dir_fd);
-	    header("Location: ./index.php?");
+    printf("<h2>Exécution de la commande :</h2>\n<p class=\"cmd\"><samp>%s</samp></p>\n<pre>", htmlspecialchars($escaped_command));
+    if ($fp = popen($escaped_command, 'r')) {
+      while (!feof($fp)) {
+	//set_time_limit (20); 
+	$results = fgets($fp, 4096);
+	if (strlen($results) == 0) {
+	  // stop the browser timing out
+	  flush();
+	} else {
+	  $tok = strtok($results, "\n");
+	  while ($tok !== false) {
+	    echo htmlspecialchars(sprintf("%s\n",$tok))."<br/>";
+	    flush(); 
+	    $tok = strtok("\n");
+	  }
 	}
-?>
\ No newline at end of file
+      }
+      print("</pre>\n");
+      if (pclose($fp) === 0) {
+	print("<h4><span class=\"success\">Opération réussie</span></h4>\n");
+	printf("<p>Pour acceder directement au panorama <a href=\"panorama.php?dir=%s&amp;panorama=%s\">cliquer ici</a></p>\n", 
+	       $panos_dir, $pano_basename);
+      } else {
+	print("<h4><span class=\"error\">Opération en échec durant l'exécution du script !</span></h4>\n");
+      }
+    } else {
+      print("<h4><span class=\"error\">Opération en échec à l'ouverture du script !</span></h4>\n");
+    }
+  }
+  print("<p>Pour acceder à la liste des panoramas <a href=\".\">cliquer ici</a></p>\n") ;
+}
+?>
diff --git a/getprogress.php b/getprogress.php
deleted file mode 100644
index 51ecf89..0000000
--- a/getprogress.php
+++ /dev/null
@@ -1,11 +0,0 @@
-<?php
-header('Expires: Tue, 08 Oct 1991 00:00:00 GMT');
-header('Cache-Control: no-cache, must-revalidate');
-
-if(isset($_GET['uid'])){
-   $status = apc_fetch('upload_' . $_GET['uid']);
-   $url = apc_fetch('link');
-   $message = apc_fetch('info');
-   echo round($status['current']/$status['total']*100)."#".$url."#".$message;
-}
-?>
\ No newline at end of file
diff --git a/images/bottom.png b/images/bottom.png
deleted file mode 100644
index 7f46c80..0000000
Binary files a/images/bottom.png and /dev/null differ
diff --git a/images/bulle.png b/images/bulle.png
deleted file mode 100644
index 53724ea..0000000
Binary files a/images/bulle.png and /dev/null differ
diff --git a/images/loader2.gif b/images/loader2.gif
deleted file mode 100644
index 6bdc3b5..0000000
Binary files a/images/loader2.gif and /dev/null differ
diff --git a/images/tetaneutral.png b/images/tetaneutral.png
deleted file mode 100644
index d1285a7..0000000
Binary files a/images/tetaneutral.png and /dev/null differ
diff --git a/images/tetaneutral.svg b/images/tetaneutral.svg
new file mode 100644
index 0000000..94bd7a1
--- /dev/null
+++ b/images/tetaneutral.svg
@@ -0,0 +1,50 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   version="1.1"
+   width="371.90289"
+   height="55.950001"
+   id="svg2">
+  <metadata
+     id="metadata8">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs6" />
+  <rect
+     width="371.90289"
+     height="55.950001"
+     ry="0"
+     x="0"
+     y="0"
+     id="rect2993"
+     style="opacity:0.91000001;fill:#fffbf4;fill-opacity:1;stroke:none" />
+  <text
+     x="22.015928"
+     y="43.308048"
+     transform="scale(0.97381679,1.0268872)"
+     id="text2987"
+     xml:space="preserve"
+     style="font-size:43.09389877px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#b2a58d;fill-opacity:1;stroke:none;font-family:Sans"><tspan
+       x="22.015928"
+       y="43.308048"
+       id="tspan2989"><tspan
+   id="tspan2991"
+   style="font-size:43.09389877px;font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;text-align:start;line-height:125%;writing-mode:lr-tb;text-anchor:start;fill:#b2a58d;fill-opacity:1;font-family:Sans;-inkscape-font-specification:Sans Bold">teta</tspan><tspan
+   id="tspan3763"
+   style="fill:#e8d7bc;fill-opacity:1">neutral</tspan>.net</tspan></text>
+</svg>
diff --git a/images/top.png b/images/top.png
deleted file mode 100644
index 48749b7..0000000
Binary files a/images/top.png and /dev/null differ
diff --git a/images/valid_css.svg b/images/valid_css.svg
new file mode 100644
index 0000000..2f1eda3
--- /dev/null
+++ b/images/valid_css.svg
@@ -0,0 +1,366 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" overflow="visible" xmlns:xlink="http://www.w3.org/1999/xlink"
+     preserveAspectRatio="xMinYMin meet" viewBox="0 0 88 31" width="88" height="31">
+  <g shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality">
+    <g shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality">
+      <g id="Background">
+      </g>
+      <g id="Guides">
+      </g>
+      <g id="Foreground">
+        <g>
+          <polygon points="0,0 88,0 88,31 0,31 0,0   " fill="none"/>
+          <path d="M44,15.5" fill="none"/>
+        </g>
+        <g>
+          <polygon points="0,0 83,0 83,31 0,31 0,0   " fill="#B3CEE1"/>
+          <path d="M41.5,15.5" fill="#B3CEE1"/>
+        </g>
+        <g>
+          <polygon points="0.365,0 36.809,0 36.809,31 0.365,31 0.365,0   " fill="#FFFFFF"/>
+          <path d="M18.587,15.5" fill="#FFFFFF"/>
+        </g>
+        <g>
+          <polygon points="4.692,2.291 44.697,2.291 44.697,26.897 4.692,26.897 4.692,2.291   " fill="none"/>
+          <path d="M24.695,14.594" fill="none"/>
+        </g>
+        <g>
+          <g>
+            <defs>
+              <polygon points="0,30 83,30 83,31 0,31 0,30     " id="XMLID_640_"/>
+            </defs>
+            <use xlink:href="#XMLID_640_" fill="#504D4C"/>
+            <clipPath id="XMLID_666_">
+              <use xlink:href="#XMLID_640_"/>
+            </clipPath>
+            <g clip-path="url(#XMLID_666_)">
+              <g>
+                <polygon points="0,0 88,0 88,31 0,31 0,0      " fill="none"/>
+                <path d="M44,15.5" fill="none"/>
+              </g>
+              <g>
+                <polygon points="0,0 83,0 83,31 0,31 0,0      " fill="#48494B"/>
+                <path d="M41.5,15.5" fill="#48494B"/>
+              </g>
+              <g>
+                <polygon points="0.365,0 36.809,0 36.809,31 0.365,31 0.365,0      " fill="#4F4F4F"/>
+                <path d="M18.587,15.5" fill="#4F4F4F"/>
+              </g>
+            </g>
+          </g>
+        </g>
+        <g>
+          <g>
+            <defs>
+              <polygon points="82,0 83,0 83,31 82,31 82,0     " id="XMLID_642_"/>
+            </defs>
+            <use xlink:href="#XMLID_642_" fill="#504D4C"/>
+            <clipPath id="XMLID_667_">
+              <use xlink:href="#XMLID_642_"/>
+            </clipPath>
+            <g clip-path="url(#XMLID_667_)">
+              <g>
+                <polygon points="0,0 88,0 88,31 0,31 0,0      " fill="none"/>
+                <path d="M44,15.5" fill="none"/>
+              </g>
+              <g>
+                <polygon points="0,0 83,0 83,31 0,31 0,0      " fill="#48494B"/>
+                <path d="M41.5,15.5" fill="#48494B"/>
+              </g>
+              <g>
+                <g>
+                  <defs>
+                    <polygon points="0,30 83,30 83,31 0,31 0,30        " id="XMLID_644_"/>
+                  </defs>
+                  <use xlink:href="#XMLID_644_" fill="#191919"/>
+                  <clipPath id="XMLID_668_">
+                    <use xlink:href="#XMLID_644_"/>
+                  </clipPath>
+                  <g clip-path="url(#XMLID_668_)">
+                    <g>
+                      <polygon points="0,0 88,0 88,31 0,31 0,0         " fill="none"/>
+                      <path d="M44,15.5" fill="none"/>
+                    </g>
+                    <g>
+                      <polygon points="0,0 83,0 83,31 0,31 0,0         " fill="#181818"/>
+                      <path d="M41.5,15.5" fill="#181818"/>
+                    </g>
+                    <g>
+                      <polygon points="0.365,0 36.809,0 36.809,31 0.365,31 0.365,0         " fill="#191919"/>
+                      <path d="M18.587,15.5" fill="#191919"/>
+                    </g>
+                  </g>
+                </g>
+              </g>
+            </g>
+          </g>
+        </g>
+        <g>
+          <polygon points="0,0 1,0 1,31 0,31 0,0   " fill="#CCCCCC"/>
+          <path d="M0.5,15.5" fill="#CCCCCC"/>
+        </g>
+        <g>
+          <g>
+            <defs>
+              <polygon points="2.16,29.005 82.16,29.005 82.16,30.005 2.16,30.005 2.16,29.005     " id="XMLID_646_"/>
+            </defs>
+            <use xlink:href="#XMLID_646_" fill="#9E9C9C"/>
+            <clipPath id="XMLID_669_">
+              <use xlink:href="#XMLID_646_"/>
+            </clipPath>
+            <g clip-path="url(#XMLID_669_)">
+              <g>
+                <polygon points="0,0 88,0 88,31 0,31 0,0      " fill="none"/>
+                <path d="M44,15.5" fill="none"/>
+              </g>
+              <g>
+                <polygon points="0,0 83,0 83,31 0,31 0,0      " fill="#9097A0"/>
+                <path d="M41.5,15.5" fill="#9097A0"/>
+              </g>
+              <g>
+                <polygon points="0.365,0 36.809,0 36.809,31 0.365,31 0.365,0      " fill="#B5B5B5"/>
+                <path d="M18.587,15.5" fill="#B5B5B5"/>
+              </g>
+              <g>
+                <g>
+                  <defs>
+                    <polygon points="0,30 83,30 83,31 0,31 0,30        " id="XMLID_648_"/>
+                  </defs>
+                  <use xlink:href="#XMLID_648_" fill="#383838"/>
+                  <clipPath id="XMLID_670_">
+                    <use xlink:href="#XMLID_648_"/>
+                  </clipPath>
+                  <g clip-path="url(#XMLID_670_)">
+                    <g>
+                      <polygon points="0,0 88,0 88,31 0,31 0,0         " fill="none"/>
+                      <path d="M44,15.5" fill="none"/>
+                    </g>
+                    <g>
+                      <polygon points="0,0 83,0 83,31 0,31 0,0         " fill="#343536"/>
+                      <path d="M41.5,15.5" fill="#343536"/>
+                    </g>
+                    <g>
+                      <polygon points="0.365,0 36.809,0 36.809,31 0.365,31 0.365,0         " fill="#383838"/>
+                      <path d="M18.587,15.5" fill="#383838"/>
+                    </g>
+                  </g>
+                </g>
+              </g>
+              <g>
+                <g>
+                  <defs>
+                    <polygon points="82,0 83,0 83,31 82,31 82,0        " id="XMLID_650_"/>
+                  </defs>
+                  <use xlink:href="#XMLID_650_" fill="#383838"/>
+                  <clipPath id="XMLID_671_">
+                    <use xlink:href="#XMLID_650_"/>
+                  </clipPath>
+                  <g clip-path="url(#XMLID_671_)">
+                    <g>
+                      <polygon points="0,0 88,0 88,31 0,31 0,0         " fill="none"/>
+                      <path d="M44,15.5" fill="none"/>
+                    </g>
+                    <g>
+                      <polygon points="0,0 83,0 83,31 0,31 0,0         " fill="#343536"/>
+                      <path d="M41.5,15.5" fill="#343536"/>
+                    </g>
+                    <g>
+                      <g>
+                        <defs>
+                          <polygon points="0,30 83,30 83,31 0,31 0,30           " id="XMLID_652_"/>
+                        </defs>
+                        <use xlink:href="#XMLID_652_" fill="#131313"/>
+                        <clipPath id="XMLID_672_">
+                          <use xlink:href="#XMLID_652_"/>
+                        </clipPath>
+                        <g clip-path="url(#XMLID_672_)">
+                          <g>
+                            <polygon points="0,0 88,0 88,31 0,31 0,0            " fill="none"/>
+                            <path d="M44,15.5" fill="none"/>
+                          </g>
+                          <g>
+                            <polygon points="0,0 83,0 83,31 0,31 0,0            " fill="#131313"/>
+                            <path d="M41.5,15.5" fill="#131313"/>
+                          </g>
+                          <g>
+                            <polygon points="0.365,0 36.809,0 36.809,31 0.365,31 0.365,0            " fill="#131313"/>
+                            <path d="M18.587,15.5" fill="#131313"/>
+                          </g>
+                        </g>
+                      </g>
+                    </g>
+                  </g>
+                </g>
+              </g>
+            </g>
+          </g>
+        </g>
+        <g>
+          <g>
+            <defs>
+              <polygon points="80.806,1 81.806,1 81.806,31 80.806,31 80.806,1     " id="XMLID_654_"/>
+            </defs>
+            <use xlink:href="#XMLID_654_" fill="#9E9C9C"/>
+            <clipPath id="XMLID_673_">
+              <use xlink:href="#XMLID_654_"/>
+            </clipPath>
+            <g clip-path="url(#XMLID_673_)">
+              <g>
+                <polygon points="0,0 88,0 88,31 0,31 0,0      " fill="none"/>
+                <path d="M44,15.5" fill="none"/>
+              </g>
+              <g>
+                <polygon points="0,0 83,0 83,31 0,31 0,0      " fill="#9097A0"/>
+                <path d="M41.5,15.5" fill="#9097A0"/>
+              </g>
+              <g>
+                <g>
+                  <defs>
+                    <polygon points="0,30 83,30 83,31 0,31 0,30        " id="XMLID_656_"/>
+                  </defs>
+                  <use xlink:href="#XMLID_656_" fill="#383838"/>
+                  <clipPath id="XMLID_674_">
+                    <use xlink:href="#XMLID_656_"/>
+                  </clipPath>
+                  <g clip-path="url(#XMLID_674_)">
+                    <g>
+                      <polygon points="0,0 88,0 88,31 0,31 0,0         " fill="none"/>
+                      <path d="M44,15.5" fill="none"/>
+                    </g>
+                    <g>
+                      <polygon points="0,0 83,0 83,31 0,31 0,0         " fill="#343536"/>
+                      <path d="M41.5,15.5" fill="#343536"/>
+                    </g>
+                    <g>
+                      <polygon points="0.365,0 36.809,0 36.809,31 0.365,31 0.365,0         " fill="#383838"/>
+                      <path d="M18.587,15.5" fill="#383838"/>
+                    </g>
+                  </g>
+                </g>
+              </g>
+              <g>
+                <g>
+                  <defs>
+                    <polygon points="2.16,29.005 82.16,29.005 82.16,30.005 2.16,30.005 2.16,29.005        " id="XMLID_658_"/>
+                  </defs>
+                  <use xlink:href="#XMLID_658_" fill="#818181"/>
+                  <clipPath id="XMLID_675_">
+                    <use xlink:href="#XMLID_658_"/>
+                  </clipPath>
+                  <g clip-path="url(#XMLID_675_)">
+                    <g>
+                      <polygon points="0,0 88,0 88,31 0,31 0,0         " fill="none"/>
+                      <path d="M44,15.5" fill="none"/>
+                    </g>
+                    <g>
+                      <polygon points="0,0 83,0 83,31 0,31 0,0         " fill="#6E7176"/>
+                      <path d="M41.5,15.5" fill="#6E7176"/>
+                    </g>
+                    <g>
+                      <polygon points="0.365,0 36.809,0 36.809,31 0.365,31 0.365,0         " fill="#818181"/>
+                      <path d="M18.587,15.5" fill="#818181"/>
+                    </g>
+                    <g>
+                      <g>
+                        <defs>
+                          <polygon points="0,30 83,30 83,31 0,31 0,30           " id="XMLID_660_"/>
+                        </defs>
+                        <use xlink:href="#XMLID_660_" fill="#272727"/>
+                        <clipPath id="XMLID_676_">
+                          <use xlink:href="#XMLID_660_"/>
+                        </clipPath>
+                        <g clip-path="url(#XMLID_676_)">
+                          <g>
+                            <polygon points="0,0 88,0 88,31 0,31 0,0            " fill="none"/>
+                            <path d="M44,15.5" fill="none"/>
+                          </g>
+                          <g>
+                            <polygon points="0,0 83,0 83,31 0,31 0,0            " fill="#252626"/>
+                            <path d="M41.5,15.5" fill="#252626"/>
+                          </g>
+                          <g>
+                            <polygon points="0.365,0 36.809,0 36.809,31 0.365,31 0.365,0            " fill="#272727"/>
+                            <path d="M18.587,15.5" fill="#272727"/>
+                          </g>
+                        </g>
+                      </g>
+                    </g>
+                    <g>
+                      <g>
+                        <defs>
+                          <polygon points="82,0 83,0 83,31 82,31 82,0           " id="XMLID_662_"/>
+                        </defs>
+                        <use xlink:href="#XMLID_662_" fill="#272727"/>
+                        <clipPath id="XMLID_677_">
+                          <use xlink:href="#XMLID_662_"/>
+                        </clipPath>
+                        <g clip-path="url(#XMLID_677_)">
+                          <g>
+                            <polygon points="0,0 88,0 88,31 0,31 0,0            " fill="none"/>
+                            <path d="M44,15.5" fill="none"/>
+                          </g>
+                          <g>
+                            <polygon points="0,0 83,0 83,31 0,31 0,0            " fill="#252626"/>
+                            <path d="M41.5,15.5" fill="#252626"/>
+                          </g>
+                          <g>
+                            <g>
+                              <defs>
+                                <polygon points="0,30 83,30 83,31 0,31 0,30              " id="XMLID_664_"/>
+                              </defs>
+                              <use xlink:href="#XMLID_664_" fill="#101010"/>
+                              <clipPath id="XMLID_678_">
+                                <use xlink:href="#XMLID_664_"/>
+                              </clipPath>
+                              <g clip-path="url(#XMLID_678_)">
+                                <g>
+                                  <polygon points="0,0 88,0 88,31 0,31 0,0               " fill="none"/>
+                                  <path d="M44,15.5" fill="none"/>
+                                </g>
+                                <g>
+                                  <polygon points="0,0 83,0 83,31 0,31 0,0               " fill="#101010"/>
+                                  <path d="M41.5,15.5" fill="#101010"/>
+                                </g>
+                                <g>
+                                  <polygon points="0.365,0 36.809,0 36.809,31 0.365,31 0.365,0               " fill="#101010"/>
+                                  <path d="M18.587,15.5" fill="#101010"/>
+                                </g>
+                              </g>
+                            </g>
+                          </g>
+                        </g>
+                      </g>
+                    </g>
+                  </g>
+                </g>
+              </g>
+            </g>
+          </g>
+        </g>
+        <g>
+          <polygon points="0,0 83,0 83,1 0,1 0,0   " fill="#CCCCCC"/>
+          <path d="M41.5,0.5" fill="#CCCCCC"/>
+        </g>
+        <g>
+          <polyline fill-rule="evenodd" stroke="#005A9C" points="    68.273,18.844 74.291,24.348 86.001,12.637   " clip-rule="evenodd" stroke-miterlimit="3.8637" stroke-width="4.8117" fill="none"/>
+        </g>
+        <g>
+          <path clip-rule="evenodd" d="M45.772,18.318c-0.345,0.179-0.705,0.314-1.079,0.406    c-0.375,0.091-0.765,0.136-1.172,0.136c-1.214,0-2.176-0.338-2.886-1.015c-0.71-0.681-1.064-1.602-1.064-2.764    c0-1.165,0.354-2.086,1.064-2.763c0.709-0.681,1.671-1.021,2.886-1.021c0.407,0,0.797,0.045,1.172,0.137    c0.374,0.091,0.734,0.226,1.079,0.405v1.508c-0.349-0.237-0.692-0.412-1.03-0.522c-0.339-0.111-0.695-0.166-1.069-0.166    c-0.671,0-1.198,0.215-1.582,0.645c-0.384,0.43-0.576,1.022-0.576,1.777c0,0.752,0.192,1.343,0.576,1.773    c0.384,0.43,0.911,0.644,1.582,0.644c0.374,0,0.73-0.055,1.069-0.166c0.338-0.111,0.682-0.285,1.03-0.522V18.318z" fill-rule="evenodd"/>
+          <path clip-rule="evenodd" d="M52.502,11.658v1.543c-0.4-0.179-0.791-0.314-1.172-0.405    c-0.381-0.091-0.741-0.137-1.079-0.137c-0.449,0-0.781,0.062-0.996,0.186c-0.215,0.124-0.322,0.315-0.322,0.576    c0,0.195,0.072,0.348,0.215,0.459c0.146,0.107,0.41,0.2,0.791,0.278l0.801,0.161c0.811,0.163,1.387,0.41,1.729,0.742    c0.342,0.332,0.513,0.804,0.513,1.416c0,0.804-0.239,1.403-0.718,1.797c-0.475,0.391-1.203,0.585-2.183,0.585    c-0.462,0-0.926-0.043-1.392-0.131c-0.465-0.088-0.931-0.218-1.396-0.391v-1.587c0.466,0.247,0.915,0.434,1.348,0.562    c0.437,0.124,0.856,0.185,1.26,0.185c0.41,0,0.725-0.068,0.942-0.205c0.218-0.137,0.327-0.332,0.327-0.586    c0-0.228-0.075-0.404-0.225-0.527c-0.146-0.124-0.441-0.234-0.884-0.333l-0.728-0.161c-0.729-0.156-1.263-0.406-1.602-0.748    c-0.335-0.342-0.503-0.802-0.503-1.381c0-0.726,0.234-1.284,0.703-1.675s1.143-0.586,2.021-0.586c0.4,0,0.813,0.031,1.235,0.093    C51.612,11.448,52.05,11.538,52.502,11.658z" fill-rule="evenodd"/>
+          <path clip-rule="evenodd" d="M59.805,11.658v1.543c-0.4-0.179-0.791-0.314-1.172-0.405    c-0.381-0.091-0.741-0.137-1.079-0.137c-0.449,0-0.781,0.062-0.996,0.186c-0.215,0.124-0.322,0.315-0.322,0.576    c0,0.195,0.072,0.348,0.215,0.459c0.146,0.107,0.41,0.2,0.791,0.278l0.801,0.161c0.811,0.163,1.387,0.41,1.729,0.742    c0.342,0.332,0.513,0.804,0.513,1.416c0,0.804-0.239,1.403-0.718,1.797c-0.475,0.391-1.203,0.585-2.183,0.585    c-0.462,0-0.926-0.043-1.392-0.131s-0.931-0.218-1.396-0.391v-1.587c0.465,0.247,0.915,0.434,1.348,0.562    c0.436,0.124,0.856,0.185,1.26,0.185c0.41,0,0.724-0.068,0.942-0.205c0.218-0.137,0.327-0.332,0.327-0.586    c0-0.228-0.075-0.404-0.225-0.527c-0.146-0.124-0.441-0.234-0.884-0.333l-0.728-0.161c-0.729-0.156-1.263-0.406-1.602-0.748    c-0.335-0.342-0.503-0.802-0.503-1.381c0-0.726,0.234-1.284,0.703-1.675s1.143-0.586,2.021-0.586c0.4,0,0.812,0.031,1.235,0.093    C58.915,11.448,59.352,11.538,59.805,11.658z" fill-rule="evenodd"/>
+        </g>
+        <g>
+          <g>
+            <path d="M33.077,7.037l0.334,2.034l-1.185,2.266c0,0-0.455-0.961-1.21-1.493c-0.636-0.449-1.051-0.546-1.699-0.412     c-0.833,0.171-1.777,1.167-2.189,2.395c-0.493,1.469-0.498,2.179-0.515,2.833c-0.027,1.046,0.137,1.665,0.137,1.665     s-0.719-1.331-0.712-3.279c0.005-1.391,0.223-2.652,0.867-3.896c0.566-1.094,1.408-1.751,2.154-1.828     c0.772-0.08,1.382,0.292,1.854,0.695c0.495,0.423,0.996,1.347,0.996,1.347L33.077,7.037z"/>
+            <path d="M33.222,18.546c0,0-0.523,0.936-0.85,1.296c-0.326,0.36-0.91,0.996-1.631,1.313c-0.721,0.317-1.099,0.377-1.811,0.309     c-0.712-0.069-1.374-0.481-1.605-0.652c-0.232-0.172-0.824-0.678-1.159-1.15c-0.335-0.472-0.858-1.417-0.858-1.417     s0.292,0.946,0.474,1.348c0.105,0.231,0.428,0.938,0.886,1.553c0.427,0.574,1.257,1.562,2.519,1.786     c1.262,0.223,2.128-0.344,2.343-0.481c0.214-0.137,0.667-0.516,0.953-0.822c0.299-0.32,0.582-0.728,0.738-0.972     c0.114-0.178,0.301-0.541,0.301-0.541L33.222,18.546z"/>
+          </g>
+          <g>
+            <path d="M11.437,7.127l2.852,9.698l2.852-9.698h2.065L14.486,23.06h-0.197l-2.951-9.875L8.388,23.06H8.191     L3.47,7.127h2.065l2.852,9.698l1.928-6.531L9.372,7.127H11.437z" fill="#005A9C"/>
+            <path d="M25.072,17.946c0,1.443-0.384,2.656-1.151,3.64c-0.767,0.983-1.76,1.475-2.98,1.475     c-0.918,0-1.718-0.292-2.4-0.875c-0.682-0.583-1.187-1.374-1.515-2.371l1.613-0.668c0.236,0.604,0.548,1.079,0.935,1.426     c0.387,0.348,0.843,0.521,1.367,0.521c0.551,0,1.016-0.308,1.397-0.924s0.571-1.357,0.571-2.223c0-0.957-0.204-1.698-0.61-2.223     c-0.472-0.616-1.214-0.924-2.223-0.924h-0.787v-0.944l2.754-4.761h-3.325l-0.925,1.574h-0.59V7.127h7.672v0.964l-2.912,5.016     c1.023,0.328,1.797,0.925,2.321,1.791C24.809,15.763,25.072,16.779,25.072,17.946z" fill="#005A9C"/>
+          </g>
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>
diff --git a/images/valid_xhtml.svg b/images/valid_xhtml.svg
new file mode 100644
index 0000000..07c981d
--- /dev/null
+++ b/images/valid_xhtml.svg
@@ -0,0 +1,923 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:xlink="http://www.w3.org/1999/xlink"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xml:space="preserve"
+   version="1.1"
+   overflow="visible"
+   preserveAspectRatio="xMinYMin meet"
+   viewBox="0 0 88 31"
+   id="svg2"
+   inkscape:version="0.48.3.1 r9886"
+   width="88"
+   height="31"
+   sodipodi:docname="valid_xhtml11.svg"><metadata
+   id="metadata481"><rdf:RDF><cc:Work
+       rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
+         rdf:resource="http://purl.org/dc/dcmitype/StillImage" /><dc:title></dc:title></cc:Work></rdf:RDF></metadata><defs
+   id="defs479" /><sodipodi:namedview
+   pagecolor="#ffffff"
+   bordercolor="#666666"
+   borderopacity="1"
+   objecttolerance="10"
+   gridtolerance="10"
+   guidetolerance="10"
+   inkscape:pageopacity="0"
+   inkscape:pageshadow="2"
+   inkscape:window-width="640"
+   inkscape:window-height="480"
+   id="namedview477"
+   showgrid="false"
+   inkscape:zoom="3.5"
+   inkscape:cx="44"
+   inkscape:cy="15.5"
+   inkscape:window-x="0"
+   inkscape:window-y="24"
+   inkscape:window-maximized="0"
+   inkscape:current-layer="svg2" />
+  <g
+   shape-rendering="geometricPrecision"
+   text-rendering="geometricPrecision"
+   image-rendering="optimizeQuality"
+   id="g4">
+    <g
+   shape-rendering="geometricPrecision"
+   text-rendering="geometricPrecision"
+   image-rendering="optimizeQuality"
+   id="g6">
+      <g
+   id="Background">
+      </g>
+      <g
+   id="Guides">
+      </g>
+      <g
+   id="Foreground">
+        <g
+   id="g11">
+          <polygon
+   points="0,0 88,0 88,31 0,31 0,0   "
+   fill="none"
+   id="polygon13" />
+          <path
+   d="M44,15.5"
+   fill="none"
+   id="path15" />
+        </g>
+        <g
+   id="g17">
+          <polygon
+   points="0,0 83,0 83,31 0,31 0,0   "
+   fill="#B3CEE1"
+   id="polygon19" />
+          <path
+   d="M41.5,15.5"
+   fill="#B3CEE1"
+   id="path21" />
+        </g>
+        <g
+   id="g23">
+          <polygon
+   points="0.365,0 36.809,0 36.809,31 0.365,31 0.365,0   "
+   fill="#FFFFFF"
+   id="polygon25" />
+          <path
+   d="M18.587,15.5"
+   fill="#FFFFFF"
+   id="path27" />
+        </g>
+        <g
+   id="g29">
+          <polygon
+   points="4.692,2.291 44.697,2.291 44.697,26.898 4.692,26.898 4.692,2.291   "
+   fill="none"
+   id="polygon31" />
+          <path
+   d="M24.695,14.594"
+   fill="none"
+   id="path33" />
+        </g>
+        <g
+   id="g35">
+          <g
+   id="g37">
+            <defs
+   id="defs39">
+              <polygon
+   points="0,30 83,30 83,31 0,31 0,30     "
+   id="XMLID_217_" />
+            </defs>
+            <use
+   xlink:href="#XMLID_217_"
+   fill="#504D4C"
+   id="use42" />
+            <clipPath
+   id="XMLID_243_">
+              <use
+   xlink:href="#XMLID_217_"
+   id="use45" />
+            </clipPath>
+            <g
+   clip-path="url(#XMLID_243_)"
+   id="g47">
+              <g
+   id="g49">
+                <polygon
+   points="0,0 88,0 88,31 0,31 0,0      "
+   fill="none"
+   id="polygon51" />
+                <path
+   d="M44,15.5"
+   fill="none"
+   id="path53" />
+              </g>
+              <g
+   id="g55">
+                <polygon
+   points="0,0 83,0 83,31 0,31 0,0      "
+   fill="#48494B"
+   id="polygon57" />
+                <path
+   d="M41.5,15.5"
+   fill="#48494B"
+   id="path59" />
+              </g>
+              <g
+   id="g61">
+                <polygon
+   points="0.365,0 36.809,0 36.809,31 0.365,31 0.365,0      "
+   fill="#4F4F4F"
+   id="polygon63" />
+                <path
+   d="M18.587,15.5"
+   fill="#4F4F4F"
+   id="path65" />
+              </g>
+            </g>
+          </g>
+        </g>
+        <g
+   id="g67">
+          <g
+   id="g69">
+            <defs
+   id="defs71">
+              <polygon
+   points="82,0 83,0 83,31 82,31 82,0     "
+   id="XMLID_219_" />
+            </defs>
+            <use
+   xlink:href="#XMLID_219_"
+   fill="#504D4C"
+   id="use74" />
+            <clipPath
+   id="XMLID_244_">
+              <use
+   xlink:href="#XMLID_219_"
+   id="use77" />
+            </clipPath>
+            <g
+   clip-path="url(#XMLID_244_)"
+   id="g79">
+              <g
+   id="g81">
+                <polygon
+   points="0,0 88,0 88,31 0,31 0,0      "
+   fill="none"
+   id="polygon83" />
+                <path
+   d="M44,15.5"
+   fill="none"
+   id="path85" />
+              </g>
+              <g
+   id="g87">
+                <polygon
+   points="0,0 83,0 83,31 0,31 0,0      "
+   fill="#48494B"
+   id="polygon89" />
+                <path
+   d="M41.5,15.5"
+   fill="#48494B"
+   id="path91" />
+              </g>
+              <g
+   id="g93">
+                <g
+   id="g95">
+                  <defs
+   id="defs97">
+                    <polygon
+   points="0,30 83,30 83,31 0,31 0,30        "
+   id="XMLID_221_" />
+                  </defs>
+                  <use
+   xlink:href="#XMLID_221_"
+   fill="#191919"
+   id="use100" />
+                  <clipPath
+   id="XMLID_245_">
+                    <use
+   xlink:href="#XMLID_221_"
+   id="use103" />
+                  </clipPath>
+                  <g
+   clip-path="url(#XMLID_245_)"
+   id="g105">
+                    <g
+   id="g107">
+                      <polygon
+   points="0,0 88,0 88,31 0,31 0,0         "
+   fill="none"
+   id="polygon109" />
+                      <path
+   d="M44,15.5"
+   fill="none"
+   id="path111" />
+                    </g>
+                    <g
+   id="g113">
+                      <polygon
+   points="0,0 83,0 83,31 0,31 0,0         "
+   fill="#181818"
+   id="polygon115" />
+                      <path
+   d="M41.5,15.5"
+   fill="#181818"
+   id="path117" />
+                    </g>
+                    <g
+   id="g119">
+                      <polygon
+   points="0.365,0 36.809,0 36.809,31 0.365,31 0.365,0         "
+   fill="#191919"
+   id="polygon121" />
+                      <path
+   d="M18.587,15.5"
+   fill="#191919"
+   id="path123" />
+                    </g>
+                  </g>
+                </g>
+              </g>
+            </g>
+          </g>
+        </g>
+        <g
+   id="g125">
+          <polygon
+   points="0,0 1,0 1,31 0,31 0,0   "
+   fill="#CCCCCC"
+   id="polygon127" />
+          <path
+   d="M0.5,15.5"
+   fill="#CCCCCC"
+   id="path129" />
+        </g>
+        <g
+   id="g131">
+          <g
+   id="g133">
+            <defs
+   id="defs135">
+              <polygon
+   points="2.16,29.005 82.16,29.005 82.16,30.005 2.16,30.005 2.16,29.005     "
+   id="XMLID_223_" />
+            </defs>
+            <use
+   xlink:href="#XMLID_223_"
+   fill="#9E9C9C"
+   id="use138" />
+            <clipPath
+   id="XMLID_246_">
+              <use
+   xlink:href="#XMLID_223_"
+   id="use141" />
+            </clipPath>
+            <g
+   clip-path="url(#XMLID_246_)"
+   id="g143">
+              <g
+   id="g145">
+                <polygon
+   points="0,0 88,0 88,31 0,31 0,0      "
+   fill="none"
+   id="polygon147" />
+                <path
+   d="M44,15.5"
+   fill="none"
+   id="path149" />
+              </g>
+              <g
+   id="g151">
+                <polygon
+   points="0,0 83,0 83,31 0,31 0,0      "
+   fill="#9097A0"
+   id="polygon153" />
+                <path
+   d="M41.5,15.5"
+   fill="#9097A0"
+   id="path155" />
+              </g>
+              <g
+   id="g157">
+                <polygon
+   points="0.365,0 36.809,0 36.809,31 0.365,31 0.365,0      "
+   fill="#B5B5B5"
+   id="polygon159" />
+                <path
+   d="M18.587,15.5"
+   fill="#B5B5B5"
+   id="path161" />
+              </g>
+              <g
+   id="g163">
+                <g
+   id="g165">
+                  <defs
+   id="defs167">
+                    <polygon
+   points="0,30 83,30 83,31 0,31 0,30        "
+   id="XMLID_225_" />
+                  </defs>
+                  <use
+   xlink:href="#XMLID_225_"
+   fill="#383838"
+   id="use170" />
+                  <clipPath
+   id="XMLID_247_">
+                    <use
+   xlink:href="#XMLID_225_"
+   id="use173" />
+                  </clipPath>
+                  <g
+   clip-path="url(#XMLID_247_)"
+   id="g175">
+                    <g
+   id="g177">
+                      <polygon
+   points="0,0 88,0 88,31 0,31 0,0         "
+   fill="none"
+   id="polygon179" />
+                      <path
+   d="M44,15.5"
+   fill="none"
+   id="path181" />
+                    </g>
+                    <g
+   id="g183">
+                      <polygon
+   points="0,0 83,0 83,31 0,31 0,0         "
+   fill="#343536"
+   id="polygon185" />
+                      <path
+   d="M41.5,15.5"
+   fill="#343536"
+   id="path187" />
+                    </g>
+                    <g
+   id="g189">
+                      <polygon
+   points="0.365,0 36.809,0 36.809,31 0.365,31 0.365,0         "
+   fill="#383838"
+   id="polygon191" />
+                      <path
+   d="M18.587,15.5"
+   fill="#383838"
+   id="path193" />
+                    </g>
+                  </g>
+                </g>
+              </g>
+              <g
+   id="g195">
+                <g
+   id="g197">
+                  <defs
+   id="defs199">
+                    <polygon
+   points="82,0 83,0 83,31 82,31 82,0        "
+   id="XMLID_227_" />
+                  </defs>
+                  <use
+   xlink:href="#XMLID_227_"
+   fill="#383838"
+   id="use202" />
+                  <clipPath
+   id="XMLID_248_">
+                    <use
+   xlink:href="#XMLID_227_"
+   id="use205" />
+                  </clipPath>
+                  <g
+   clip-path="url(#XMLID_248_)"
+   id="g207">
+                    <g
+   id="g209">
+                      <polygon
+   points="0,0 88,0 88,31 0,31 0,0         "
+   fill="none"
+   id="polygon211" />
+                      <path
+   d="M44,15.5"
+   fill="none"
+   id="path213" />
+                    </g>
+                    <g
+   id="g215">
+                      <polygon
+   points="0,0 83,0 83,31 0,31 0,0         "
+   fill="#343536"
+   id="polygon217" />
+                      <path
+   d="M41.5,15.5"
+   fill="#343536"
+   id="path219" />
+                    </g>
+                    <g
+   id="g221">
+                      <g
+   id="g223">
+                        <defs
+   id="defs225">
+                          <polygon
+   points="0,30 83,30 83,31 0,31 0,30           "
+   id="XMLID_229_" />
+                        </defs>
+                        <use
+   xlink:href="#XMLID_229_"
+   fill="#131313"
+   id="use228" />
+                        <clipPath
+   id="XMLID_249_">
+                          <use
+   xlink:href="#XMLID_229_"
+   id="use231" />
+                        </clipPath>
+                        <g
+   clip-path="url(#XMLID_249_)"
+   id="g233">
+                          <g
+   id="g235">
+                            <polygon
+   points="0,0 88,0 88,31 0,31 0,0            "
+   fill="none"
+   id="polygon237" />
+                            <path
+   d="M44,15.5"
+   fill="none"
+   id="path239" />
+                          </g>
+                          <g
+   id="g241">
+                            <polygon
+   points="0,0 83,0 83,31 0,31 0,0            "
+   fill="#131313"
+   id="polygon243" />
+                            <path
+   d="M41.5,15.5"
+   fill="#131313"
+   id="path245" />
+                          </g>
+                          <g
+   id="g247">
+                            <polygon
+   points="0.365,0 36.809,0 36.809,31 0.365,31 0.365,0            "
+   fill="#131313"
+   id="polygon249" />
+                            <path
+   d="M18.587,15.5"
+   fill="#131313"
+   id="path251" />
+                          </g>
+                        </g>
+                      </g>
+                    </g>
+                  </g>
+                </g>
+              </g>
+            </g>
+          </g>
+        </g>
+        <g
+   id="g253">
+          <g
+   id="g255">
+            <defs
+   id="defs257">
+              <polygon
+   points="80.806,1 81.806,1 81.806,31 80.806,31 80.806,1     "
+   id="XMLID_231_" />
+            </defs>
+            <use
+   xlink:href="#XMLID_231_"
+   fill="#9E9C9C"
+   id="use260" />
+            <clipPath
+   id="XMLID_250_">
+              <use
+   xlink:href="#XMLID_231_"
+   id="use263" />
+            </clipPath>
+            <g
+   clip-path="url(#XMLID_250_)"
+   id="g265">
+              <g
+   id="g267">
+                <polygon
+   points="0,0 88,0 88,31 0,31 0,0      "
+   fill="none"
+   id="polygon269" />
+                <path
+   d="M44,15.5"
+   fill="none"
+   id="path271" />
+              </g>
+              <g
+   id="g273">
+                <polygon
+   points="0,0 83,0 83,31 0,31 0,0      "
+   fill="#9097A0"
+   id="polygon275" />
+                <path
+   d="M41.5,15.5"
+   fill="#9097A0"
+   id="path277" />
+              </g>
+              <g
+   id="g279">
+                <g
+   id="g281">
+                  <defs
+   id="defs283">
+                    <polygon
+   points="0,30 83,30 83,31 0,31 0,30        "
+   id="XMLID_233_" />
+                  </defs>
+                  <use
+   xlink:href="#XMLID_233_"
+   fill="#383838"
+   id="use286" />
+                  <clipPath
+   id="XMLID_251_">
+                    <use
+   xlink:href="#XMLID_233_"
+   id="use289" />
+                  </clipPath>
+                  <g
+   clip-path="url(#XMLID_251_)"
+   id="g291">
+                    <g
+   id="g293">
+                      <polygon
+   points="0,0 88,0 88,31 0,31 0,0         "
+   fill="none"
+   id="polygon295" />
+                      <path
+   d="M44,15.5"
+   fill="none"
+   id="path297" />
+                    </g>
+                    <g
+   id="g299">
+                      <polygon
+   points="0,0 83,0 83,31 0,31 0,0         "
+   fill="#343536"
+   id="polygon301" />
+                      <path
+   d="M41.5,15.5"
+   fill="#343536"
+   id="path303" />
+                    </g>
+                    <g
+   id="g305">
+                      <polygon
+   points="0.365,0 36.809,0 36.809,31 0.365,31 0.365,0         "
+   fill="#383838"
+   id="polygon307" />
+                      <path
+   d="M18.587,15.5"
+   fill="#383838"
+   id="path309" />
+                    </g>
+                  </g>
+                </g>
+              </g>
+              <g
+   id="g311">
+                <g
+   id="g313">
+                  <defs
+   id="defs315">
+                    <polygon
+   points="2.16,29.005 82.16,29.005 82.16,30.005 2.16,30.005 2.16,29.005        "
+   id="XMLID_235_" />
+                  </defs>
+                  <use
+   xlink:href="#XMLID_235_"
+   fill="#818181"
+   id="use318" />
+                  <clipPath
+   id="XMLID_252_">
+                    <use
+   xlink:href="#XMLID_235_"
+   id="use321" />
+                  </clipPath>
+                  <g
+   clip-path="url(#XMLID_252_)"
+   id="g323">
+                    <g
+   id="g325">
+                      <polygon
+   points="0,0 88,0 88,31 0,31 0,0         "
+   fill="none"
+   id="polygon327" />
+                      <path
+   d="M44,15.5"
+   fill="none"
+   id="path329" />
+                    </g>
+                    <g
+   id="g331">
+                      <polygon
+   points="0,0 83,0 83,31 0,31 0,0         "
+   fill="#6E7176"
+   id="polygon333" />
+                      <path
+   d="M41.5,15.5"
+   fill="#6E7176"
+   id="path335" />
+                    </g>
+                    <g
+   id="g337">
+                      <polygon
+   points="0.365,0 36.809,0 36.809,31 0.365,31 0.365,0         "
+   fill="#818181"
+   id="polygon339" />
+                      <path
+   d="M18.587,15.5"
+   fill="#818181"
+   id="path341" />
+                    </g>
+                    <g
+   id="g343">
+                      <g
+   id="g345">
+                        <defs
+   id="defs347">
+                          <polygon
+   points="0,30 83,30 83,31 0,31 0,30           "
+   id="XMLID_237_" />
+                        </defs>
+                        <use
+   xlink:href="#XMLID_237_"
+   fill="#272727"
+   id="use350" />
+                        <clipPath
+   id="XMLID_253_">
+                          <use
+   xlink:href="#XMLID_237_"
+   id="use353" />
+                        </clipPath>
+                        <g
+   clip-path="url(#XMLID_253_)"
+   id="g355">
+                          <g
+   id="g357">
+                            <polygon
+   points="0,0 88,0 88,31 0,31 0,0            "
+   fill="none"
+   id="polygon359" />
+                            <path
+   d="M44,15.5"
+   fill="none"
+   id="path361" />
+                          </g>
+                          <g
+   id="g363">
+                            <polygon
+   points="0,0 83,0 83,31 0,31 0,0            "
+   fill="#252626"
+   id="polygon365" />
+                            <path
+   d="M41.5,15.5"
+   fill="#252626"
+   id="path367" />
+                          </g>
+                          <g
+   id="g369">
+                            <polygon
+   points="0.365,0 36.809,0 36.809,31 0.365,31 0.365,0            "
+   fill="#272727"
+   id="polygon371" />
+                            <path
+   d="M18.587,15.5"
+   fill="#272727"
+   id="path373" />
+                          </g>
+                        </g>
+                      </g>
+                    </g>
+                    <g
+   id="g375">
+                      <g
+   id="g377">
+                        <defs
+   id="defs379">
+                          <polygon
+   points="82,0 83,0 83,31 82,31 82,0           "
+   id="XMLID_239_" />
+                        </defs>
+                        <use
+   xlink:href="#XMLID_239_"
+   fill="#272727"
+   id="use382" />
+                        <clipPath
+   id="XMLID_254_">
+                          <use
+   xlink:href="#XMLID_239_"
+   id="use385" />
+                        </clipPath>
+                        <g
+   clip-path="url(#XMLID_254_)"
+   id="g387">
+                          <g
+   id="g389">
+                            <polygon
+   points="0,0 88,0 88,31 0,31 0,0            "
+   fill="none"
+   id="polygon391" />
+                            <path
+   d="M44,15.5"
+   fill="none"
+   id="path393" />
+                          </g>
+                          <g
+   id="g395">
+                            <polygon
+   points="0,0 83,0 83,31 0,31 0,0            "
+   fill="#252626"
+   id="polygon397" />
+                            <path
+   d="M41.5,15.5"
+   fill="#252626"
+   id="path399" />
+                          </g>
+                          <g
+   id="g401">
+                            <g
+   id="g403">
+                              <defs
+   id="defs405">
+                                <polygon
+   points="0,30 83,30 83,31 0,31 0,30              "
+   id="XMLID_241_" />
+                              </defs>
+                              <use
+   xlink:href="#XMLID_241_"
+   fill="#101010"
+   id="use408" />
+                              <clipPath
+   id="XMLID_255_">
+                                <use
+   xlink:href="#XMLID_241_"
+   id="use411" />
+                              </clipPath>
+                              <g
+   clip-path="url(#XMLID_255_)"
+   id="g413">
+                                <g
+   id="g415">
+                                  <polygon
+   points="0,0 88,0 88,31 0,31 0,0               "
+   fill="none"
+   id="polygon417" />
+                                  <path
+   d="M44,15.5"
+   fill="none"
+   id="path419" />
+                                </g>
+                                <g
+   id="g421">
+                                  <polygon
+   points="0,0 83,0 83,31 0,31 0,0               "
+   fill="#101010"
+   id="polygon423" />
+                                  <path
+   d="M41.5,15.5"
+   fill="#101010"
+   id="path425" />
+                                </g>
+                                <g
+   id="g427">
+                                  <polygon
+   points="0.365,0 36.809,0 36.809,31 0.365,31 0.365,0               "
+   fill="#101010"
+   id="polygon429" />
+                                  <path
+   d="M18.587,15.5"
+   fill="#101010"
+   id="path431" />
+                                </g>
+                              </g>
+                            </g>
+                          </g>
+                        </g>
+                      </g>
+                    </g>
+                  </g>
+                </g>
+              </g>
+            </g>
+          </g>
+        </g>
+        <g
+   id="g433">
+          <polygon
+   points="0,0 83,0 83,1 0,1 0,0   "
+   fill="#CCCCCC"
+   id="polygon435" />
+          <path
+   d="M41.5,0.5"
+   fill="#CCCCCC"
+   id="path437" />
+        </g>
+        <g
+   id="g439">
+          <polyline
+   fill-rule="evenodd"
+   stroke="#005A9C"
+   points="    68.273,18.845 74.291,24.348 86.001,12.637   "
+   clip-rule="evenodd"
+   stroke-miterlimit="3.8637"
+   stroke-width="4.8117"
+   fill="none"
+   id="polyline441" />
+        </g>
+        <g
+   id="g443">
+          <g
+   id="g445">
+            <path
+   d="M33.077,7.037l0.334,2.034l-1.185,2.266c0,0-0.455-0.961-1.21-1.494c-0.636-0.448-1.051-0.545-1.699-0.412     c-0.833,0.171-1.777,1.167-2.189,2.395c-0.493,1.469-0.498,2.179-0.515,2.832c-0.027,1.047,0.137,1.665,0.137,1.665     s-0.719-1.33-0.712-3.278c0.005-1.391,0.223-2.652,0.867-3.896c0.566-1.095,1.408-1.751,2.154-1.829     c0.772-0.08,1.382,0.293,1.854,0.695c0.495,0.423,0.996,1.348,0.996,1.348L33.077,7.037z"
+   id="path447" />
+            <path
+   d="M33.222,18.547c0,0-0.523,0.936-0.85,1.296c-0.326,0.361-0.91,0.996-1.631,1.313c-0.721,0.317-1.099,0.377-1.811,0.309     c-0.712-0.068-1.374-0.48-1.605-0.652c-0.232-0.172-0.824-0.678-1.159-1.15s-0.858-1.416-0.858-1.416s0.292,0.946,0.474,1.348     c0.105,0.231,0.428,0.938,0.886,1.553c0.427,0.574,1.257,1.562,2.519,1.785s2.128-0.343,2.343-0.48     c0.214-0.137,0.667-0.516,0.953-0.822c0.299-0.32,0.582-0.728,0.738-0.972c0.114-0.179,0.301-0.541,0.301-0.541L33.222,18.547z"
+   id="path449" />
+          </g>
+          <g
+   id="g451">
+            <path
+   d="M11.437,7.127l2.852,9.698l2.852-9.698h2.065l-4.721,15.933h-0.197l-2.951-9.875l-2.951,9.875H8.191     L3.47,7.127h2.065l2.852,9.698l1.928-6.531L9.372,7.127H11.437z"
+   fill="#005A9C"
+   id="path453" />
+            <path
+   d="M25.072,17.946c0,1.443-0.384,2.656-1.151,3.639c-0.767,0.983-1.76,1.475-2.98,1.475     c-0.918,0-1.718-0.292-2.4-0.875c-0.682-0.583-1.187-1.374-1.515-2.371l1.613-0.668c0.236,0.603,0.548,1.079,0.935,1.426     c0.387,0.348,0.843,0.521,1.367,0.521c0.551,0,1.016-0.308,1.397-0.924s0.571-1.357,0.571-2.223c0-0.958-0.204-1.698-0.61-2.223     c-0.472-0.616-1.214-0.925-2.223-0.925h-0.787v-0.944l2.754-4.761h-3.325l-0.925,1.574h-0.59V7.127h7.672v0.964l-2.912,5.016     c1.023,0.328,1.797,0.925,2.321,1.791C24.809,15.763,25.072,16.779,25.072,17.946z"
+   fill="#005A9C"
+   id="path455" />
+          </g>
+        </g>
+        <g
+   id="g457">
+          <polygon
+   points="44.053,9.392 46.583,13.112 44.625,13.112 42.92,10.622 41.231,13.112     39.263,13.112 41.792,9.392 39.361,5.822 41.324,5.822 42.92,8.171 44.512,5.822 46.485,5.822   "
+   clip-rule="evenodd"
+   fill-rule="evenodd"
+   id="polygon459" />
+          <polygon
+   points="47.8,5.822 49.68,5.822 49.68,8.601 52.454,8.601 52.454,5.822     54.333,5.822 54.333,13.112 52.454,13.112 52.454,10.021 49.68,10.021 49.68,13.112 47.8,13.112   "
+   clip-rule="evenodd"
+   fill-rule="evenodd"
+   id="polygon461" />
+          <polygon
+   points="55.4,5.822 62.119,5.822 62.119,7.243 59.702,7.243 59.702,13.112     57.822,13.112 57.822,7.243 55.4,7.243   "
+   clip-rule="evenodd"
+   fill-rule="evenodd"
+   id="polygon463" />
+          <polygon
+   points="63.191,5.822 65.583,5.822 67.244,9.724 68.914,5.822 71.301,5.822     71.301,13.112 69.524,13.112 69.524,7.78 67.844,11.711 66.653,11.711 64.973,7.78 64.973,13.112 63.191,13.112   "
+   clip-rule="evenodd"
+   fill-rule="evenodd"
+   id="polygon465" />
+          <polygon
+   points="73.242,5.822 75.122,5.822 75.122,11.691 78.422,11.691 78.422,13.112     73.242,13.112   "
+   clip-rule="evenodd"
+   fill-rule="evenodd"
+   id="polygon467" />
+        </g>
+        <g
+   id="g469">
+          
+          
+          
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>
\ No newline at end of file
diff --git a/index.php b/index.php
old mode 100755
new mode 100644
index c4c63ef..119a744
--- a/index.php
+++ b/index.php
@@ -1,56 +1,56 @@
 <!DOCTYPE html>
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
-<head>
-  <meta http-equiv="Content-type" content="text/html; charset=UTF-8"/>
-  <title>Liste des panoramas</title>
-  <link rel="stylesheet" media="screen" href="css/index_style.css" />
-  <script src="js/pano.js"></script>
-</head>
-<body>
-	<img id="top" src="images/top.png" alt="">
-	<div id="index_container">
-		<h1><img src="images/tetaneutral.png" /></h1>
-	  	<h2>Liste des panoramas</h2>
-		   <?php
-		  
-		   require 'class/site_point.class.php';
-		   require 'class/sites_dir.class.php';
-		   
-		   echo '<div id="containerList">';
-		   echo '<ul>';
-		 
-		   if(isset($_GET['dir']) && is_dir($_GET['dir'])) {
-		     $base_dir = $_GET['dir']; 
-		   } else {
-		    $base_dir='tiles';
-		   }
-		   
-		   $dir = new sites_dir($base_dir);
-		 
-		   
-		   foreach($dir->get_sites() as $pt) {
-		   
-		     $params = $pt->get_params();
-		     if (isset($params['titre'])) {
-		       $cmt = $params['titre'];
-		      
-		     } else {
-		       $cmt = sprintf('fichier <samp>%s/%s</samp>', $pt->get_name(), $pt->get_prefix());
-		     }
-		     
-		     printf ('<li><a href="panorama.php?dir=%s&amp;panorama=%s">%s</a></li>'."\n", $base_dir, $pt->get_name(), $cmt);
-		   }
-		   ?>
-		</div>
-	</div>
-   <div id="interaction">
-   
-   <li><a href="./envoyer.php" title="Envoyer une image sur le site">Ajouter un panorama</a></li>
-   <li><a href="./creerPano.php" title="Générer un panorama à partir d\'une image déjà envoyée">Générer un panorama</a></li>
- 
-   </div>
-   </ul>
- <img id="bottom" src="images/bottom.png" alt="">
-  <p><a href="http://validator.w3.org/check?uri=referer">page xHTML validé !</a></p>
-</body>
+  <head>
+    <meta http-equiv="Content-type" content="text/html; charset=UTF-8"/>
+    <title>Liste des panoramas</title>
+    <link rel="stylesheet" media="screen" href="css/index_style.css"/>
+  </head>
+  <body>
+    <header>
+      <h1><img src="images/tetaneutral.svg" alt="tetaneutral.net"/></h1>
+    </header>
+    <section id="main">
+      <h2>Liste des panoramas</h2>
+      <?php
+require 'class/utils.class.php';
+utils::init();
+
+if(isset($_GET['dir']) && is_dir($_GET['dir'])) {
+  $base_dir = $_GET['dir']; 
+} else {
+  $base_dir='tiles';
+}
+
+$dir = new sites_dir($base_dir);
+try {
+  $sites_list = $dir->get_sites();
+
+  echo "<ul id=\"pano-list\">\n";
+	
+  foreach($sites_list as $pt) {
+    $params = $pt->get_params();
+    $pos_file = sprintf('%s/%s', $pt->get_name(), $pt->get_prefix());
+    if (isset($params['titre'])) {
+      $cmt = $params['titre'];
+      $title = sprintf(' title="fichier : %s"', $pos_file);
+    } else {
+      $cmt = sprintf('<samp>%s</samp>', $pos_file);
+      $title = ''; 
+    }
+    printf ('<li%s><a href="panorama.php?dir=%s&amp;panorama=%s">%s</a></li>'."\n", $title, $base_dir, $pt->get_name(), $cmt);
+  }
+  echo "</ul>\n";
+} catch (Exception $e) {
+  printf("<h3 class=\"warning\">désolé mais aucun site n'est disponible...</h3>\n");
+}
+?>
+      <p id="interaction">
+	<a href="envoyer.php" title="Envoyer une image sur le site">Ajouter un panorama</a>
+	<a href="creerPano.php" title="Générer un panorama à partir d\'une image déjà envoyée">Générer un panorama</a>
+      </p>
+    </section>
+    <footer>
+      <p class="validators"><a href="http://validator.w3.org/check?uri=referer">page xHTML validé !</a></p>
+    </footer>
+  </body>
 </html>
diff --git a/js/hide_n_showForm.js b/js/hide_n_showForm.js
index 9ae4f74..76dc58d 100644
--- a/js/hide_n_showForm.js
+++ b/js/hide_n_showForm.js
@@ -1,5 +1,4 @@
 function showForm() { 
-  
     var displayAddParams = document.getElementById('addParams');
     var displayAdding = document.getElementById ('adding');
     displayAddParams.style.visibility = 'hidden';
@@ -7,7 +6,6 @@ function showForm() {
 } 
   
 function hideForm() { 
-      
     var displayAddParams = document.getElementById('addParams');
     var displayAdding = document.getElementById ('adding');
     displayAddParams.style.visibility = 'visible';
@@ -15,17 +13,15 @@ function hideForm() {
 } 
   
 function showLoca() { 
-      
-    var displayloca = document.getElementById('loca');
+    var displayloca = document.getElementById('loca_show');
     var putDraw = document.getElementById ('locadraw');
     displayloca.style.visibility = 'hidden';
     putDraw.style.visibility = 'visible'; 
 } 
   
 function hideLoca() { 
-      
-    var displayloca = document.getElementById('loca');
+    var displayloca = document.getElementById('loca_show');
     var putDraw = document.getElementById ('locadraw');
     displayloca.style.visibility = 'visible';
     putDraw.style.visibility = 'hidden';
-} 
\ No newline at end of file
+}
diff --git a/js/pano.js b/js/pano.js
old mode 100755
new mode 100644
index 38ec503..a4c54c3
--- a/js/pano.js
+++ b/js/pano.js
@@ -171,9 +171,8 @@ function drawDecorations(ox, oy, tx, ty, twidth, theight) {
     
 }
 
-function insert_drawn_point(lat,lon,alt) {
-	
-	var rt = 6371;  // Rayon de la terre
+function insert_drawn_point(lat, lon, alt) {
+    var rt = 6371;  // Rayon de la terre
     var alt1 = document.getElementById('pos_alt').childNodes[0].nodeValue;
     var lat1 = document.getElementById('pos_lat').childNodes[0].nodeValue*Math.PI/180;
     var lon1 = document.getElementById('pos_lon').childNodes[0].nodeValue*Math.PI/180;
@@ -196,8 +195,7 @@ function insert_drawn_point(lat,lon,alt) {
     return {d:d, cap:cap*180/Math.PI, ele:e*180/Math.PI};   // les résultats sont en degrés
 }
 
-localate_point = function () {
-	
+function localate_point() {
     var lat = document.getElementById("loca_latitude").value;
     var lon = document.getElementById("loca_longitude").value;
     var alt = document.getElementById("loca_altitude").value;
@@ -209,23 +207,16 @@ localate_point = function () {
 	alert("La longitude "+lon+"n'est pas correcte");
 	return;
     }
-    if (lat == '' || isNaN(alt) || alt < -400) {
+    if (lat == '' || isNaN(alt) || alt < -400 || alt > 10000000) {
 	alert("l'altitude "+alt+"n'est pas correcte");
 	return;
     }
-	    var opt_ced = new Array();
-	    opt_dce = insert_drawn_point(lat,lon,alt);
-	    // -----Première solution : afficher dynamiquement le point !
-	    var d = opt_dce.d;
-	    var cap = opt_dce.cap;
-	    var ele = opt_dce.ele;
-	    
-	    display_temp(d, cap, ele);
-	   
+    var opt_ced = new Array();
+    opt_dce = insert_drawn_point(lat, lon, alt);
+    display_temp(opt_dce.d, opt_dce.cap, opt_dce.ele);
 }
 
-function display_temp(d,cap,ele) {
-   
+function display_temp(d,cap,ele) {  
     point_list[point_list.length] = new Array("point temporaire", d,cap,ele, "temporary");
     reset_zooms();
     putImage(last.x, last.y);
@@ -235,8 +226,7 @@ function arrayUnset(array, value){
     array.splice(array.indexOf(value), 1);
 }
 
-erase_point = function() {
-	
+function erase_point() {	
 	for (var i=0; i<point_list.length; i++) {
 		if(point_list[i][0] == "point temporaire"){
 			arrayUnset(point_list,point_list[i]);
@@ -784,8 +774,6 @@ function clean_canvas_events(e) {
     speed.y = 0;
 }
 
-
-
 canvas_set_size = function() {
     canvas.style.border = border_width+"px solid red";
     canvas.width = window.innerWidth-2*border_width;
@@ -799,20 +787,17 @@ canvas_resize = function() {
     putImage(last.x, last.y);
 }
 
-
-
 function paramIn(e) {
-	
-	 e = e || window.event; 
-	 var relatedTarget = e.relatedTarget || e.fromElement; 
-	 
-	 while (relatedTarget != adding && relatedTarget.nodeName != 'BODY' && relatedTarget != document && relatedTarget != localisation) {
-	        relatedTarget = relatedTarget.parentNode;
-	 }
-	 
-	 if (relatedTarget != adding && relatedTarget != localisation) {
-		 document.removeEventListener('keydown', keys, false);
-	 }
+    e = e || window.event; 
+    var relatedTarget = e.relatedTarget || e.fromElement; 
+    
+    while (relatedTarget != adding && relatedTarget.nodeName != 'BODY' && relatedTarget != document && relatedTarget != localisation) {
+	relatedTarget = relatedTarget.parentNode;
+    }
+    
+    if (relatedTarget != adding && relatedTarget != localisation) {
+	document.removeEventListener('keydown', keys, false);
+    }
 }
 
 function paramOut(e) {
@@ -830,10 +815,9 @@ function paramOut(e) {
  
 }
 
-window.onload = function() {
-	
-	localisation = document.getElementById("locadraw");
-	adding = document.getElementById("adding");
+window.onload = function() {	
+    localisation = document.getElementById("locadraw");
+    adding = document.getElementById("adding");
     canvas = document.getElementById("mon-canvas");
     cntext = canvas.getContext("2d");
     canvas_set_size();
@@ -866,17 +850,26 @@ window.onload = function() {
     elvtn_control.onclick = change_angle;
 
     change_angle();
-    loca_temp = document.getElementById("loca_button");
-    loca_temp.onclick = localate_point;
-    loca_erase = document.getElementById("loca_erase");
-    loca_erase.onclick = erase_point;
+    loca_temp = document.getElementById("loca_show");
+    if (loca_temp) {
+	loca_temp.onclick = showLoca;
+	loca_temp = document.getElementById("loca_hide");
+	loca_temp.onclick = hideLoca;
+	loca_temp = document.getElementById("loca_button");
+	loca_temp.onclick = localate_point;
+	loca_erase = document.getElementById("loca_erase");
+	loca_erase.onclick = erase_point;
+	localisation.addEventListener('mouseover',paramIn,false);
+	localisation.addEventListener('mouseout',paramOut,false);
+    }
     canvas.addEventListener('mousedown', onImageClick, false);
     document.addEventListener('keydown', keys, false);
     canvas.addEventListener('mousewheel', wheel_zoom, false);
     window.onresize = canvas_resize;
-    adding.addEventListener('mouseover',paramIn,false);
-    adding.addEventListener('mouseout',paramOut,false);
-    localisation.addEventListener('mouseover',paramIn,false);
-    localisation.addEventListener('mouseout',paramOut,false);
-      
+    if (adding) {
+	document.getElementById("paramFormHide").onclick = hideForm;
+	document.getElementById("paramFormShow").onclick = showForm;
+	adding.addEventListener('mouseover', paramIn, false);
+	adding.addEventListener('mouseout', paramOut, false);
+    }
 };
diff --git a/js/pano_deroulant.js b/js/pano_deroulant.js
deleted file mode 100644
index 25d3d20..0000000
--- a/js/pano_deroulant.js
+++ /dev/null
@@ -1,153 +0,0 @@
-	
-	function getInfoBox(element) {
-	    
-        while (element = element.nextSibling) {
-            if (element.className === 'infobox') {
-                return element;
-            }
-        }
-         
-        return false;
-     
-    }
-	
-	 // Fonctions de vérification du formulaire, elles renvoient « true » si tout est OK
-    
-    var check = {}; // On met toutes nos fonctions dans un objet littéral
-     
-	check['param_title'] = function() {
-	        
-	        var title = document.getElementById('param_title');
-	        
-	        if (title.value.length >= 4) {
-	            title.className = 'correct';
-	            
-	            return true;
-	        } else {
-	            title.className = 'incorrect';
-	            
-	            return false;
-	        }
-	};
-        
-    check['param_latitude'] = function() {
-        
-        var latitude = document.getElementById('param_latitude');
-        var lat = parseFloat(latitude.value);
-       
-        if (!isNaN(lat) && lat >= -90 &&  lat <= 90) { 
-            latitude.className = 'correct';
-           
-            return true;
-        
-        } else {
-            latitude.className = 'incorrect';
-           
-            return false;
-        }
-     
-    };
-    
-    check['param_longitude'] = function() {
-        
-        var longitude = document.getElementById('param_longitude');
-        var lon = parseFloat(longitude.value);
-        	
-        if (!isNaN(lon) && lon >= -180 &&  lon <= 180) {
-            longitude.className = 'correct';
-            
-            return true;
-        
-        } else {
-            longitude.className = 'incorrect';
-            
-            return false;
-        }
-     
-    };
-    
-    check['param_altitude'] = function() {
-        
-        var altitude = document.getElementById('param_altitude');
-        var alt = parseInt(altitude.value);
-        
-        if (!isNaN(alt) && alt >= 0 && alt <= 10000) {
-            altitude.className = 'correct';
-            
-            return true;
-        
-        } else {
-            altitude.className = 'incorrect';
-            
-            return false;
-        }
-     
-    };
-    
-    check['param_elevation'] = function() {
-        
-    	
-        var elevation = document.getElementById('param_elevation');
-        var ele = parseFloat(elevation.value);
-        
-        if (!isNaN(ele) && ele >= -10 &&  ele <= 10) {
-            elevation.className = 'correct';
-           
-            return true;
-        
-        } else {
-            elevation.className = 'incorrect';
-            
-            return false;
-        }
-     
-    };
-    
-    (function() { // Utilisation d'une fonction anonyme pour éviter les variables globales.
-        
-        var form_param = document.getElementById('form_param'),
-            inputs = document.getElementsByTagName('input'),
-            inputsLength = inputs.length;
-    
-        for (var i = 0 ; i < inputsLength ; i++) {
-        	
-	            if (inputs[i].type == 'text') {
-	     		
-	                inputs[i].onkeyup = function() {
-	                    check[this.id](this.id); // « this » représente l'input actuellement modifié
-	                };
-	     
-	            }
-        	
-        }
-     
-        form_param.onsubmit = function() {
-     
-            var result = true;
-     
-            for (var i in check) {
-       		
-                result = check[i](i) && result;	
-            }
-     
-            if (result) {
-                alert('Le formulaire est bien rempli.');
-                return true;
-            } else {
-            	
-            return false;
-            }
-     
-        };
-     
-        form_param.onreset = function() {
-     
-            for (var i = 0 ; i < inputsLength ; i++) {
-                if (inputs[i].type == 'text' || inputs[i].type == 'number') {
-                    inputs[i].className = '';
-                }
-            }
-     
-        };
-     
-    })();
\ No newline at end of file
diff --git a/panorama.php b/panorama.php
old mode 100755
new mode 100644
index 9a59ef9..c58329e
--- a/panorama.php
+++ b/panorama.php
@@ -2,8 +2,50 @@
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
 <head>
   <?php
-   require 'class/site_point.class.php';
-   require 'class/sites_dir.class.php';
+   require 'class/utils.class.php';
+   utils::init();
+
+   $form_extpoint = <<<'EO_FORM_EXTPOINT'
+<img src="images/locapoint.svg" id="loca_show" alt="localiser un point" title="pour localiser un point..."/>
+<fieldset id="locadraw"><legend id="loca_hide">Localiser un point</legend>
+  <label class="form_col" title="La latitude ϵ [-90°, 90°]. Ex: 12.55257">Latitude :
+    <input  name="loca_latitude" type="number" min="-90" max="90"  id="loca_latitude"/></label>
+  <label class="form_col" title="La longitude ϵ [-180°, 180°]. Ex: 144.14723">Longitude :
+    <input name="loca_longitude" type="number" min="-180" max="180" id="loca_longitude"/></label>
+  <label class="form_col" title="L'altitude positive Ex: 170">Altitude :
+    <input  name="loca_altitude" type="number" min="-400" id="loca_altitude"/></label>
+  <div class="answer">
+    <input type="button" value="Localiser" id="loca_button"/> 
+    <input type="button" value="Effacer" id="loca_erase"/>
+  </div>
+</fieldset>
+EO_FORM_EXTPOINT;
+
+   $form_param = <<<'EO_FORM_PARAM'
+<div id="addParams">		
+  <label id="paramFormShow">Paramétrer le panorama</label>	
+</div>
+     <form action="addParams.php?param_dir=%s&amp;param_panorama=%s" id="form_param" method="post">
+  <fieldset id="adding"><legend id="paramFormHide">Paramétrage du panorama</legend>
+    <label title="Au moins 4 caractères">Titre :
+      <input type="text" pattern="^.{1,40}$" name="param_title" placeholder="%s" 
+	     title="ne doit pas contenir pus de 40 caractères" required=""/></label>
+    <label title="La latitude ϵ [-90°, 90°]. Ex : 46.55257">Latitude :
+      <input name="param_latitude" type="number" min="-90" max="90" placeholder="43.56" required="" step="any"/></label>
+    <label title="La longitude ϵ [-180°, 180°]. Ex : 1.45">Longitude :
+      <input name="param_longitude" type="number" min="-180" max="180" placeholder="1.45" required="" step="any"/></label>
+    <label title="L'altitude exprmée en mètres et &gt; -400. Ex : 170">Altitude :
+      <input name="param_altitude" type="number" min="-400" required="" placeholder="170" step="any"/></label>
+    <label title="L'image fait-elle 360° ?">Rebouclage :
+      <input type="checkbox" name="param_loop" value="true"></label>
+    
+    <div>
+      <input type="submit" value="Submit"/> 
+      <input type="reset" value="Reset"/>
+    </div>
+  </fieldset>
+</form>
+EO_FORM_PARAM;
 
    if (isset($_GET['dir']) && isset($_GET['panorama'])) {
      $dir   = $_GET['dir'];
@@ -24,17 +66,17 @@
    $prefix = $pt->get_prefix();
   ?>
   <meta http-equiv="Content-type" content="text/html; charset=UTF-8"/>
-   <?php
+  <?php
      $titre = 'panorama';
-     if ($params && isset($params['titre'])) $titre .= ' ; '.$params['titre'];
-     printf ("<title>%s</title>\n", $params['titre']);
+     if ($params && isset($params['titre'])) $titre .= ' : '.$params['titre'];
+     printf ("<title>%s</title>\n", $titre);
   ?>
   <script>
    <?php
      printf ("var img_prefix = '%s/%s'\n", $base_dir, $prefix);
      if (is_array($params)) $opt_vals = array_merge($params, $opt_vals);
      foreach(array('to_cap', 'to_ele', 'to_zoom', 'image_loop') as $val) {
-       if (isset($opt_vals[$val])) printf ('var '.$val.' = '.$opt_vals[$val].";\n"); // correction du décalage angulaire par rapport au Nord
+        if (isset($opt_vals[$val])) printf ('var '.$val.' = '.$opt_vals[$val].";\n"); // correction du décalage angulaire par rapport au Nord
      }
   ?>
   </script>
@@ -92,34 +134,30 @@
      }
    }
   
-  $localLat = (isset($_POST["loca_latitude"])) ? $_POST["loca_latitude"] : NULL;
-  $localLon = (isset($_POST["loca_longitude"])) ? $_POST["loca_longitude"] : NULL;
-  $localAlt = (isset($_POST["loca_altitude"])) ? $_POST["loca_altitude"] : NULL;
+   $localLat = (isset($_POST["loca_latitude"])) ? $_POST["loca_latitude"] : NULL;
+   $localLon = (isset($_POST["loca_longitude"])) ? $_POST["loca_longitude"] : NULL;
+   $localAlt = (isset($_POST["loca_altitude"])) ? $_POST["loca_altitude"] : NULL;
  
-  if ($localLat && $localLon && $localAlt) {
-  	  list($localDistance, $localCap, $localEle) = $pt->coordsToCap($localLat, $localLon, $localAlt);
-  	  $n = "point temporaire";
-      printf('point_list[%d] = new Array("%s", %03lf, %03lf, %03lf, "temporary");'."\n",$ipt++, $n, $localDistance, $localCap, $localEle);
-  } 
+   if ($localLat && $localLon && $localAlt) {
+     list($localDistance, $localCap, $localEle) = $pt->coordsToCap($localLat, $localLon, $localAlt);
+     $n = "point temporaire";
+     printf('point_list[%d] = new Array("%s", %03lf, %03lf, %03lf, "temporary");'."\n",$ipt++, $n, $localDistance, $localCap, $localEle);
+   } 
   ?>
   </script>
-  
- 
-
-  
   <link type="image/x-icon" rel="shortcut icon" href="images/tsf.png"/>
-  <link rel="stylesheet" media="screen" href="css/all.css" />
+  <link rel="stylesheet" media="screen" href="css/map.css" />
   <script src="js/hide_n_showForm.js"></script> 
 </head>
 <body>
   <canvas id="mon-canvas">
-    Ce message indique que ce navigateurs est vétuste car il ne supporte pas <samp>canvas</samp> (IE6, IE7, IE8, ...)
+    Ce message indique que ce navigateur est vétuste car il ne supporte pas <samp>canvas</samp> (IE6, IE7, IE8, ...)
   </canvas>
   
   <fieldset id="control"><legend>contrôle</legend>
       <label>Zoom : <input type="range" min="0" max="2" value="2" id="zoom_ctrl"/></label>
-      <label>Cap : <input type="number" min="0" max="360" step="10" value="0" autofocus="" id="angle_ctrl"/></label>
-      <label>Élévation : <input type="number" min="-90" max="90" step="1" value="0" autofocus="" id="elvtn_ctrl"/></label>
+      <label>Cap : <input type="number" min="0" max="360" step="10" value="0" autofocus="" id="angle_ctrl" step="any"/></label>
+      <label>Élévation : <input type="number" min="-90" max="90" step="1" value="0" autofocus="" id="elvtn_ctrl" step="any"/></label>
   </fieldset>
 
   <?php
@@ -130,72 +168,11 @@
        printf ("<p>longitude : <em><span id=\"pos_lon\">%.5f</span>°</em></p>\n", $params['longitude']);
        if (isset($params['altitude'])) printf ("<p>altitude : <em><span id=\"pos_alt\">%d</span> m</em></p>\n", $params['altitude']); 
        print("</div>\n");
-       ?>
-       <span id="loca"><img src="images/locapoint.svg" id="icone" onclick="showLoca()"/></span>
-  <fieldset id="locadraw"><legend id="" onclick="hideLoca()">Localiser un point</legend>
-    <form id="form_loca" method="post" name="form_localate" action="panorama.php?dir=<?php echo $_GET['dir'];?>&amp;panorama=<?php echo $_GET['panorama'];?>">
-      <label class="form_col" title="La latitude ϵ [-90°, 90°]. Ex: 12.55257">Latitude :
-	<input  name="loca_latitude" type="number" min="-90" max="90"  id="loca_latitude"/></label>
-	         
-      <label class="form_col" title="La longitude ϵ [-180°, 180°]. Ex: 144.14723">Longitude :
-	<input name="loca_longitude" type="number" min="-180" max="180" id="loca_longitude"/></label>
-	      
-      <label class="form_col" title="L'altitude positive Ex: 170">Altitude :
-	<input  name="loca_altitude" type="number" min="-400" id="loca_altitude"/></label>
-	       
-      <div class="answer">
-	<input type="button" value="Localiser" id="loca_button" class="form_button"/> 
-	<input type="reset" value="Reset" class="form_button"/>
-	<input type="button" value="Effacer" class="form_button" id="loca_erase"/>
-      </div>
-	      
-    </form>
-  </fieldset>
-       <?php
-     } elseif ($params == false ){
+       echo $form_extpoint;
+     } elseif ($params == false ) {
      	$dir   = $_GET['dir'];
         $name  = $_GET['panorama'];
-     	?>
-       <div id="addParams">		
-     	  <label onclick="showForm()" value="Hide label">Paramétrer le panorama</label>	
-       </div>
-       <fieldset id="adding"><legend id="lgd" onclick="hideForm()">Paramètrer le panorama</legend>
-	 <form action="addParams.php?dir=<?php echo $dir;?>&amp;panorama=<?php echo $name;?>" id="form_param" method="post">
-	   	  
-	   <label class="form_col" for="param_title" title="Au moins 4 caractères">Titre: </label>
-	   <input type="text" id="param_title" name="param_title"/>
-	   
-	   <label class="form_col" for="param_latitude" title="La latitude ϵ [-90°, 90°]. Ex: 12.55257">Latitude: </label>
-	   <input  name="param_latitude" type="text" id="param_latitude" />
-	         
-	   <label class="form_col" for="param_longitude" title="La longitude ϵ [-180°, 180°]. Ex: 144.14723">Longitude: </label>
-	   <input name="param_longitude" type="text" id="param_longitude" />
-	   
-	   <label class="form_col" for="param_altitude" title="L'altitude positive Ex: 170">Altitude: </label>
-	   <input  name="param_altitude" type="text" id="param_altitude" />
-	  
-	   <label class="form_col" for="param_elevation" title="élévation ϵ [-10,10] ( valeur par défaut : 0)">Elévation: </label>
-	   <input  name="param_elevation" type="text" id="param_elevation" />
-	   
-	   <label class="form_col" for="param_loop" title="L'image fait elle 360° ? ">Rebouclage: </label>
-	   <input class="radio" type="radio" name="param_loop" value="true" checked="checked"> Oui
-           <input class="radio" type="radio" name="param_loop" value="false"> Non
-	   
-	   <input type="hidden" value="Localiser" id="loca_button" class="form_button" style="width:70px" /> 
-	   <input type="hidden" value="Effacer" class="form_button" id="loca_erase"/>
-	  
-	   <div class="answer">
-	     <input type="submit" value="Submit" class="form_button"/> 
-	     <input type="reset" value="Reset" class="form_button"/>
-	   </div>
-	      
-  	 </form>
-       </fieldset>
-  
- 
-       <script src="js/pano_deroulant.js"></script> 
-      
-     	<?php
+        printf($form_param, $dir, $name, $name);
      }
      echo '<p id="info"></p>'."\n";
      if (count($extra_names) > 1) {
@@ -203,15 +180,19 @@
        foreach ($extra_names as $nm) {
 	 echo '<option>'.$nm."</option>\n";
        }
-       echo "</select>\n<br/>";
+       echo "</select>\n";
        echo "<input type=\"button\" id=\"do-insert\" value=\"insérer\"/>\n";
        echo "<input type=\"button\" id=\"do-delete\" value=\"suppimer\"/>\n";
        echo "<input type=\"button\" id=\"do-cancel\" value=\"annuler\"/>\n";
        echo "</p>\n";
      }
      
-     ?>
-  <p class="validators"><a href="http://validator.w3.org/check?uri=referer">page xHTML validé !</a></p>
+  ?>
   <p id="res"></p>
+  <div class="validators">
+    pages validées par
+    <a href="http://validator.w3.org/check?uri=referer"><img src="images/valid_xhtml.svg" alt="Valid XHTML 1.1" title="xHTML 1.1 validé !"/></a>
+    <a href="http://jigsaw.w3.org/css-validator/check/referer"><img src="images/valid_css.svg" alt="CSS validé !" title="CSS validé !"/></a>
+  </div>
 </body>
 </html>
diff --git a/ref_points.php b/ref_points.php
old mode 100755
new mode 100644
diff --git a/to_tiles/gen_tiles.sh b/to_tiles/gen_tiles.sh
index ec805ac..9095c93 100755
--- a/to_tiles/gen_tiles.sh
+++ b/to_tiles/gen_tiles.sh
@@ -1,5 +1,21 @@
 #!/bin/bash
 
+trap clean_tmp EXIT
+# fin d'eviter tout problème de locales en reste en C de base.
+
+set -e
+export LANG=C
+
+# pour éliminer systématiquement les fichier temporaires créés ic
+function clean_tmp() {
+    if [ -n "$wfname" ]; then
+	rm $wfname
+    fi
+    if [ -n "$tmp_file" ]; then
+	rm $tmp_file
+    fi
+}
+
 test_mode=false
 memory_limit=256
 crop_x=256
@@ -42,7 +58,7 @@ if [ -z "$prefix" ]; then
     prefix=$(basename $1|sed 's/\..*$//')
 fi
 
-wfname=$prefix.pnm
+wfname=$(mktemp ${prefix}_XXXX.pnm)
 if ! $test_mode; then
     anytopnm $fname > $wfname
 else
@@ -51,12 +67,14 @@ fi
 
 echo "préfixe : "$prefix
 
+tmp_file=$(mktemp)
+
 for ((z=$min_scale; z <= $max_scale; z++))
 do
     fprefix=${prefix}_00$z
-    LANG=C  printf -v ratio %1.4lf $(echo "1 / (2^$z)" | bc -l)
+    printf -v ratio %1.4lf $(echo "1 / (2^$z)" | bc -l)
     echo génération du ratio $ratio
-    zwfname=tmp.pnm
+    zwfname=$tmp_file
 
     if $test_mode; then
 	if [ $ratio = 1.0000 ]; then
@@ -73,18 +91,24 @@ do
 	if [ $ratio = 1.0000 ]; then
 	    zwfname=$wfname
 	else
-	    pnmscale $ratio $wfname > $zwfname
+	    if ! pnmscale $ratio $wfname > $zwfname; then
+		echo "operation 'pnmscale $ratio $wfname > $zwfname' en erreur"
+		exit 1
+	    fi
 	fi
-	convert $zwfname \
+	if convert $zwfname \
 	    -limit memory $memory_limit \
             -crop ${crop_x}x${crop_x} \
             -set filename:tile "%[fx:page.x/${crop_x}]_%[fx:page.y/${crop_y}]" \
-            +repage +adjoin "${fprefix}_%[filename:tile].jpg"
+            +repage +adjoin "${fprefix}_%[filename:tile].jpg"; then
+	    echo "Nombre des fichiers produits :" $(ls -la ${fprefix}_*| wc -l)
+	else
+	    echo "operation 'convert' en erreur"
+	    exit 2
+	fi
     fi
 done
 
-echo  ${fprefix}_*
-
 if ! $test_mode; then
 ## les lignes ci dessous sont destinnées à mettre des 0 en debut des numéros de ligne et de colonnes
 ## Il y a certainement plus simple mais là c'est du rapide et efficace.
@@ -92,7 +116,4 @@ if ! $test_mode; then
     rename 's/_(\d)_(\d+\.jpg)$/_00$1_$2/' ${prefix}_*
     rename 's/_(\d+)_(\d\d)(\.jpg)$/_$1_0$2$3/' ${prefix}_*
     rename 's/_(\d+)_(\d)(\.jpg)$/_$1_00$2$3/' ${prefix}_*
-    rm $zwfname $wfname
-else
-    echo rm $zwfname $wfname
 fi
diff --git a/uploadReceive.php b/uploadReceive.php
new file mode 100644
index 0000000..8ebbd9d
--- /dev/null
+++ b/uploadReceive.php
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
+<head>
+   <meta http-equiv="Content-type" content="text/html; charset=UTF-8"/>
+   <link rel="stylesheet" media="screen" href="css/index_style.css" />
+   <title>Transfert de panoramique</title>
+</head>
+<body>
+<?php
+ 
+$dest_dir ='upload';
+
+if(!empty($_POST) && !empty($_FILES)) {
+  foreach (array_keys($_FILES['files']['name']) as $i) {
+    if(!empty($_FILES['files']['name'][$i])) {
+      if(isset($_FILES['files']['error'][$i]) && UPLOAD_ERR_OK === $_FILES['files']['error'][$i]) {
+	move_uploaded_file($_FILES['files']['tmp_name'][$i],$dest_dir.'/'.basename($_FILES['files']['name'][$i]));
+	printf("<h2>transfert de %s réalisé</h2>\n", $_FILES['files']['name'][$i]);
+      } else {
+	$message = 'Une erreur interne a empêché l\'upload de l\'image : '. $_FILES['files']['error'][$i];
+      }
+    } else {
+      $message = 'Veuillez passer par le formulaire svp !';
+    }
+  }
+  if (isset($message)) {
+    echo "<h2>$message</h2>\n";
+  }
+}
+?>
+<p>Pour acceder à la liste des images transférées afin de convertir en panorama <a href="creerPano.php">cliquer ici</a></p>
+</body>
+</html>
diff --git a/uploadTest.php b/uploadTest.php
deleted file mode 100644
index 057e533..0000000
--- a/uploadTest.php
+++ /dev/null
@@ -1,92 +0,0 @@
-<?php
- 
-// Constantes
-define('TARGET', '/var/www/data/tsf2/vpongnian/panorama/upload/');    // Repertoire cible
-define('MAX_SIZE', 300000000);    // Taille max en octets du fichier
-define('WIDTH_MAX', 200000);    // Largeur max de l'image en pixels
-define('HEIGHT_MAX', 100000);    // Hauteur max de l'image en pixels
-
-
-// Creation du repertoire cible si inexistant
-
-/*if( !is_dir(TARGET) ) {
-  if( !mkdir(TARGET, 0755) ) {
-    exit('Erreur : le répertoire cible ne peut-être créé ! Vérifiez que vous diposiez des droits suffisants pour le faire ou créez le manuellement !');
-  }
-}
-*/
-
-// Script d'upload
-
-	// Variables
-	$extension = '';
-	$message = '';
-	$nomImage = '';
-	$url='';
-	$already=false;
-	
-	// Tableaux de donnees
-	$tabExt = array('jpeg','tif','jpg');    // Extensions autorisees
-	$infosImg = array();
-	$stats = array();
-	
-	
-	if(!empty($_POST))
-	{
-		
-	  // On verifie si le champ est rempli
-	  if( !empty($_FILES['file']['name']) )
-	  {
-	  	
-	    // Recuperation de l'extension du fichier
-	    $extension  = pathinfo($_FILES['file']['name'], PATHINFO_EXTENSION);
-	 
-	    // On verifie l'extension du fichier
-	    if(in_array(strtolower($extension),$tabExt))
-	    {
-	      // On recupere les dimensions du fichier
-	      $infosImg = getimagesize($_FILES['file']['tmp_name']);
-	 
-	      // On verifie les dimensions et taille de l'image
-	      if(($infosImg[0] <= WIDTH_MAX) && ($infosImg[1] <= HEIGHT_MAX) && (filesize($_FILES['file']['tmp_name']) <= MAX_SIZE))
-	      {
-	        // Parcours du tableau d'erreurs
-	        if(isset($_FILES['file']['error']) 
-	          && UPLOAD_ERR_OK === $_FILES['file']['error'])
-	        {
-	          // On bouge le fichier uploadé dans un répertoire a son nom
-	          // on garde en cache la variable $url qui permettra de passer sur une page envoyer.php plus avancée.
-	 	
-	          $err = $_FILES['file']['error'];
-		    echo "<script>alert(\"$err\");</script>";
-	            $url ="envoyer.php?dir=upload/".$_FILES['file']['name']."&img=".$_FILES['file']['name'];
-	            move_uploaded_file($_FILES['file']['tmp_name'],TARGET.basename($_FILES['file']['name']));
-				apc_store('link', $url);
-				
-	        }
-	        else
-	        {
-	        	$message = 'Une erreur interne a empêché l\'uplaod de l\'image : '. $_FILES['file']['error'];
-	        }
-	      }
-	      else
-	      {
-	        // Sinon erreur sur les dimensions et taille de l'image
-	        $message = 'Erreur dans les dimensions de l\'image !';  
-	      }
-	    }
-	    else
-	    {
-	      // Sinon on affiche une erreur pour l'extension
-	      $message = 'L\'extension du fichier est incorrecte !';
-	    }
-	  }
-	  else
-	  {
-	    // Sinon on affiche une erreur pour le champ vide
-	 	$message = 'Veuillez remplir le formulaire svp !';
-	  }
-	  // On met en cache un message d'erreur.
-	  apc_store('info', $message);
-	}
-?>
\ No newline at end of file
