Amélioration ergonomie de l'installation

.gitattributes

@@ -73,6 +73,14 @@ dist/images/cookie-24.gif -text
 dist/images/creer.gif -text
 dist/images/croix-rouge.gif -text
 dist/images/deconnecter-24.gif -text
+dist/images/degrade-etapes-clair-left.gif -text
+dist/images/degrade-etapes-clair-right.gif -text
+dist/images/degrade-etapes-fonce-left.gif -text
+dist/images/degrade-etapes-fonce-right.gif -text
+dist/images/degrade-etapes-rouge-left.gif -text
+dist/images/degrade-etapes-rouge-right.gif -text
+dist/images/degrade-etapes-vert-left.gif -text
+dist/images/degrade-etapes-vert-right.gif -text
 dist/images/degrade.jpg -text
 dist/images/deplierbas.gif -text
 dist/images/deplierhaut.gif -text

dist/minipres.css

-body { font-family: Trebuchet Ms,Verdana, Geneva, Sans, sans-serif; font-size: 0.9em; color: #2e3436; background: #babdb6 url(images/minipres-gris.png) no-repeat scroll 97% 100px;
+body { font-family: ,Verdana, Geneva, Sans, sans-serif; font-size: 0.9em; color: #2e3436; background: #babdb6 url(images/minipres-gris.png) no-repeat scroll 97% 100px;
 }
 
 h1 { margin: 1em 0 1em 0; font-size: 1.3em; font-weigth: bold; color: #5c3566; }
@@ -16,6 +16,13 @@ fieldset, .fieldset { text-align: left; padding: 0; border: 0; margin-top: 1em;
 legend { font-weight: bold; font-size: 1.1em; color: #000; }
 label {}
 
+body.minipres fieldset, body.minipres .fieldset  {
+	border: 1px solid #cccccc;
+	padding: 10px;
+	font-family: helvetica, arial, sans;
+
+}
+
 #minipres { width: 40em; background: #FFF repeat; margin: 1em auto; padding: 1em; border: 1px solid #888; text-align: center; }
 
 .pass #minipres { width: 90%; }
@@ -30,9 +37,9 @@ label {}
 .fondl { background-color: #eee; background-position: center bottom; padding: 3px; border: 1px solid #333; font-size: 0.9em; font-family: Verdana, Geneva, Sans, sans-serif; }
 .formo { width: 100%; display: block; background-color: #FFF; background-position: center bottom; margin-bottom: 1em; padding: 3px; border: 1px solid #333; behavior: url(win_width.htc); font-size: 1em; font-family: Verdana, Geneva, Sans, sans-serif; }
 
-p.resultat { background-color: #fcaf3e; padding: 0.2em 0.1em; border: 1px solid  #f57900; text-align: center; color: #FFF; font-weight: bold; }
-p.resultat.ok {background-color:#73d216;border-color:#C2EF95;}
-p.resultat.echec {background-color:#d60c0c;border-color:#f57900;}
+p.resultat { background-color: #fcaf3e; padding: 0.2em 0.1em;  text-align: center; color: #FFF; font-weight: bold; }
+p.resultat.ok {background-color:#73d216;}
+p.resultat.echec {background-color:#d60c0c;}
 
 #etapes { display: block; position: absolute; top: 10px; left: 10px; }
 #etapes span { margin-top: -0.5em; display: block; padding: 12px 14px; margin-bottom: 5px; }
@@ -43,3 +50,55 @@ p.resultat.echec {background-color:#d60c0c;border-color:#f57900;}
 #etapes span.todo { background: url(images/etape-todo.gif) center no-repeat; }
 
 .nettoyeur { clear: both; height: 0; line-height: 0; font-size: 0; margin: 0; padding: 0; }
+
+
+#infos_etapes {
+	padding: 0px;
+	margin: 0px;
+	margin-top: 0px;
+	margin-bottom: 0px;
+	height: 74px;
+	overflow: hidden;
+	text-align: left;
+	font-family: helvetica, arial, sans;
+
+}
+
+#infos_etapes li {
+	float: left; 
+	width: 121px;
+	padding-left: 20px;
+	padding-right: 20px;
+	padding-top: 10px;
+	height: 69px;
+	text-align: left;
+	font-size: 12px;
+	line-height: 1.05em;
+	margin-left: -17px;
+}
+#infos_etapes li span.numero_etape {
+	font-weight: bold;
+	font-size: 36px;
+	padding-right: 3px;
+	padding-left: 3px;
+	padding-top: 7px;
+	float: left;
+	display: block;
+	height: 50px;
+	font-family: helvetica, arial, sans;
+}
+#infos_etapes li.encours {
+	background: url(../dist/images/degrade-etapes-fonce-left.gif) top left;
+	color: white;
+	font-weight: bold;
+}
+#infos_etapes li.prochains {
+	background: url(../dist/images/degrade-etapes-clair-left.gif) top left;
+}
+#infos_etapes li.valides {
+	background: url(../dist/images/degrade-etapes-vert-left.gif) top left;
+}
+#infos_etapes li.erreur {
+	background: url(../dist/images/degrade-etapes-rouge-left.gif) top left;
+	color: white;
+}

ecrire/inc/install.php

@@ -155,16 +155,30 @@ function bouton_suivant($code = '') {
 }
 
 // http://doc.spip.org/@info_progression_etape
-function info_progression_etape($en_cours,$phase,$dir){
+function info_progression_etape($en_cours,$phase,$dir, $erreur = false){
 	//$en_cours = _request('etape')?_request('etape'):"";
 	$liste = find_all_in_path($dir,$phase.'(([0-9])+|fin)[.]php$');
 	$debut = 1; $etat = "ok";
-	$last = count($liste)-1; // ne pas afficher l'etape finale qui dit juste "tout est OK"
-	$texte_etat = array('ok'=>'OK','encours'=>_L('en cours'),'todo'=>_L('à venir'));
+	$last = count($liste); 
+//	$texte_etat = array('ok'=>'OK','encours'=>_L('en cours'),'todo'=>_L('à venir'));
+	
+	$intitule_etat["etape_"][1] = _L("Connexion à votre base de données");
+	$intitule_etat["etape_"][2] = _T('menu_aide_installation_choix_base');
+	$intitule_etat["etape_"][3] = _T('info_informations_personnelles');
+	$intitule_etat["etape_"][4] = _T('info_derniere_etape');
+	
+	$intitule_etat["etape_ldap"][1] = _T('titre_connexion_ldap');
+	$intitule_etat["etape_ldap"][2] = _T('titre_connexion_ldap');
+	$intitule_etat["etape_ldap"][3] = _T('info_chemin_acces_1');
+	$intitule_etat["etape_ldap"][4] = _T('info_reglage_ldap');
+	$intitule_etat["etape_ldap"][5] = _T('info_ldap_ok');
+	
+//	$aff_etapes = "<span id='etapes'>";
+
+	$aff_etapes = "<ul id='infos_etapes'>";
 	
-	$aff_etapes = "<span id='etapes'>";
 	foreach($liste as $etape=>$fichier){
-		if ($etape=="$phase$en_cours.php"){
+/*		if ($etape=="$phase$en_cours.php"){
 			$etat = "encours";
 		}
 		$aff_etapes .= ($debut<$last)
@@ -172,9 +186,21 @@ function info_progression_etape($en_cours,$phase,$dir){
 			: '';
 		if ($etat == "encours")
 			$etat = 'todo';
+*/		
+		if ($debut < $last) {
+			if ($debut == $en_cours && $erreur) $class = "erreur";
+			else if ($debut == $en_cours) $class = "encours";
+			else if ($debut > $en_cours) $class = "prochains";
+			else $class = "valides";
+
+			$aff_etapes .= "<li class='$class'>";
+			$aff_etapes .= "<span class='numero_etape'>$debut</span>".$intitule_etat["$phase"][$debut];
+			$aff_etapes .= "</li>";
+		}
 		$debut++;
 	}
-	$aff_etapes .= "<br class='nettoyeur' />&nbsp;</span>\n";
+	$aff_etapes .= "</ul>";
+	$aff_etapes .= "<br class='nettoyeur' /\n";
 	return $aff_etapes;
 }
 

ecrire/inc/minipres.php

@@ -42,12 +42,12 @@ function install_debut_html($titre = 'AUTO', $onLoad = '') {
 		"<title>".
 		textebrut($titre).
 		"</title>
-		<link rel='stylesheet' href='".find_in_path('minipres.css').
+		<link rel='stylesheet' href='".direction_css(find_in_path('minipres.css')).
 		"' type='text/css' media='all' />\n" .
  // cet appel permet d'assurer un copier-coller du nom du repertoire a creer dans tmp (esj)
 		http_script('',  "spip_barre.js") .
 "</head>
-<body".$onLoad.">
+<body".$onLoad." class='minipres'>
 	<div id='minipres'>
 	<h1>".
 	  $titre .

ecrire/install/etape_1.php

@@ -34,6 +34,8 @@ function install_etape_1_dist()
 			$chmod = $regs[1]; 
 		}
 	}
+	
+	
 
 	$db = array($adresse_db, _T('entree_base_donnee_2'));
 	$login = array($login_db, _T('entree_login_connexion_2'));
@@ -44,6 +46,9 @@ function install_etape_1_dist()
 			defined('_INSTALL_USER_DB'),
 			defined('_INSTALL_PASS_DB'));
 
+
+	echo info_progression_etape(1,'etape_','install/');
+
 	// ces deux chaines de langues doivent etre reecrites
 #	echo info_etape(_T('info_connexion_mysql'), _T('texte_connexion_mysql').aide ("install1"));
 	echo info_etape(_L('Connexion à votre base de données'),
@@ -51,11 +56,12 @@ function install_etape_1_dist()
 			. _L("Consultez les informations fournies par votre hébergeur : vous devez y trouver le serveur de base de données qu'il propose et vos identifiants personnels pour vous y connecter.")
 			.'</p>'
 			.'<p>'
-			. _L("SPIP sait utiliser MySQL (le plus r&eacute;pandu), PostgreSQL et SQLite (actuellement sans Plugins).")
+			. _L("SPIP sait utiliser <b>MySQL</b> (le plus r&eacute;pandu), <b>PostgreSQL</b> et <b>SQLite</b>*.")
+			// Passer l'avertissement SQLIte en  commentaire, on pourra facilement le supprimer par la suite sans changer les traductions.
+			. _L("<br />  (*Attention: pour l'instant la plupart des plugins SPIP ne sont pas compatibles avec SQLite. )")
 			.'</p>'
 			);
 	echo install_connexion_form($db, $login, $pass, $predef, "\n<input type='hidden' name='chmod' value='$chmod' />", 2);
-	echo info_progression_etape(1,'etape_','install/');
 	echo install_fin_html();
 }
 

ecrire/install/etape_2.php

@@ -63,6 +63,9 @@ function install_etape_2_dist()
 		echo "<p class='resultat ok'><b>"._T('info_connexion_ok')."</b></p>\n";
 		echo info_etape(_T('menu_aide_installation_choix_base').aide ("install2"));
 
+		echo info_progression_etape(2,'etape_','install/');
+
+
 		spip_connect_db($adresse_db, 0, $login_db, $pass_db, '',$server_db);
 
 		echo "\n", '<!-- ',  sql_version($server_db), ' -->' ;
@@ -76,6 +79,9 @@ function install_etape_2_dist()
 		echo install_etape_2_form($hidden, $checked, $res, 3);
 	} else  {
 		echo info_etape(_T('info_connexion_base'));
+
+		echo info_progression_etape(1,'etape_','install/',true);
+
 		echo "<p class='resultat echec'><b>",
 #		  _T('avis_connexion_echec_1'),
 		  _L('La connexion &agrave; la base de donn&eacute;es a &eacute;chou&eacute;.'),
@@ -87,7 +93,6 @@ function install_etape_2_dist()
 		  "</p>";
 	}
 	
-	echo info_progression_etape(2,'etape_','install/');
 	echo install_fin_html();
 }
 

ecrire/install/etape_3.php

@@ -162,6 +162,8 @@ function install_propose_ldap()
 function install_premier_auteur($email, $login, $nom, $pass, $hidden)
 {
 	return info_etape(_T('info_informations_personnelles'),
+			info_progression_etape(3,'etape_','install/'),
+
 		     "<b>"._T('texte_informations_personnelles_1')."</b>" .
 			     aide ("install5") .
 			     "<p>" .
@@ -237,8 +239,11 @@ function install_etape_3_dist()
 
 		$res = install_bases($adresse_db, $login_db, $pass_db,  $server_db, $choix_db, $sel_db, $chmod_db);
 
-		if ($res)
+		if ($res) {
+			$res .= info_progression_etape(2,'etape_','install/', true);
+
 			$res .= "<p class='resultat echec'><b>"._T('avis_operation_echec')."</b></p>"._T('texte_operation_echec');
+		}
 	
 	} else { 
 		$res = '';
@@ -274,7 +279,6 @@ function install_etape_3_dist()
 
 	echo install_debut_html();
 	echo $res;
-	echo info_progression_etape(3,'etape_','install/');
 	echo install_fin_html();
 }
 

ecrire/install/etape_4.php

@@ -38,6 +38,7 @@ function install_etape_4_dist()
 			echo minipres(
 			'AUTO',
 			"<h2>$echec</h2>\n".
+			info_progression_etape(3,'etape_','install/', true).
 			"<p class='resultat echec'>"._T('avis_connexion_echec_2')."</p>"
 			);
 			exit;
@@ -53,6 +54,7 @@ function install_etape_4_dist()
 		redirige_url_ecrire('install');
 
 	echo install_debut_html('AUTO', ' onload="document.getElementById(\'suivant\').focus();return false;"');
+	echo info_progression_etape(5,'etape_','install/');
 
 	echo info_etape(_T('info_derniere_etape'),
 			_T('info_utilisation_spip')
@@ -110,7 +112,6 @@ function install_etape_4_dist()
 	  . bouton_suivant(_T('login_espace_prive'));
 
 	echo generer_form_ecrire('install', $suite);
-	echo info_progression_etape(4,'etape_','install/');
 	echo install_fin_html();
 }
 

ecrire/install/etape_ldap1.php

@@ -39,7 +39,7 @@ function install_etape_ldap1_dist()
 
 	echo install_debut_html();
 
-	echo info_etape(_T('titre_connexion_ldap'), _T('entree_informations_connexion_ldap'));
+	echo info_etape(_T('titre_connexion_ldap'),info_progression_etape(1,'etape_ldap','install/'), _T('entree_informations_connexion_ldap'));
 
 	echo generer_form_ecrire('install', (
 	 "\n<input type='hidden' name='etape' value='ldap2' />"
@@ -89,7 +89,6 @@ function install_etape_ldap1_dist()
 
 	. bouton_suivant()));
 
-	echo info_progression_etape(1,'etape_ldap','install/');
 	echo install_fin_html();
 }
 

ecrire/install/etape_ldap2.php

@@ -50,7 +50,7 @@ function install_etape_ldap2_dist()
 	}
 
 	if ($ldap_link) {
-		echo info_etape(_T('titre_connexion_ldap'),_T('info_connexion_ldap_ok'));
+		echo info_etape(_T('titre_connexion_ldap'),info_progression_etape(2,'etape_ldap','install/'),_T('info_connexion_ldap_ok'));
 
 		echo generer_form_ecrire('install', (
 		  "\n<input type='hidden' name='etape' value='ldap3' />"
@@ -63,7 +63,7 @@ function install_etape_ldap2_dist()
 		. bouton_suivant()));
 	}
 	else {
-		echo info_etape(_T('titre_connexion_ldap')),
+		echo info_etape(_T('titre_connexion_ldap')), info_progression_etape(1,'etape_ldap','install/', true),
 			"<p class='resultat'>"._T('avis_connexion_ldap_echec_1')."</p>",
 			"<p>"._T('avis_connexion_ldap_echec_2').
 			"<br />\n"._T('avis_connexion_ldap_echec_3') .
@@ -71,7 +71,6 @@ function install_etape_ldap2_dist()
 		;
 	}
 
-	echo info_progression_etape(2,'etape_ldap','install/');
 	echo install_fin_html();
 }
 

ecrire/install/etape_ldap3.php

@@ -27,7 +27,7 @@ function install_etape_ldap3_dist()
 
 	echo install_debut_html();
 
-	echo info_etape(_T('info_chemin_acces_1'),_T('info_chemin_acces_2'));
+	echo info_etape(_T('info_chemin_acces_1'),info_progression_etape(3,'etape_ldap','install/'),_T('info_chemin_acces_2'));
 
 	$ldap_link = @ldap_connect("$adresse_ldap", "$port_ldap");
 	@ldap_bind($ldap_link, "$login_ldap", "$pass_ldap");
@@ -81,7 +81,6 @@ function install_etape_ldap3_dist()
 	. "\n</fieldset>"
 	. bouton_suivant()));
 
-	echo info_progression_etape(3,'etape_ldap','install/');
 	echo install_fin_html();
 }
 

ecrire/install/etape_ldap4.php

@@ -35,11 +35,13 @@ function install_etape_ldap4_dist()
 
 	if ($fail) {
 		echo info_etape(_T('info_chemin_acces_annuaire')),
+			info_progression_etape(3,'etape_ldap','install/', true),
 			"<p class='resultat'><b>"._T('avis_operation_echec')."</b></p><p>"._T('avis_chemin_invalide_1'),
 			" (<tt>".htmlspecialchars($base_ldap)."</tt>) "._T('avis_chemin_invalide_2')."</p>";
 	}
 	else {
 		info_etape(_T('info_reglage_ldap'));
+		echo info_progression_etape(4,'etape_ldap','install/');
 
 		lire_fichier(_FILE_CONNECT_TMP, $conn);
 		if ($p = strpos($conn, "'');")) {
@@ -76,7 +78,6 @@ function install_etape_ldap4_dist()
 		. bouton_suivant()));
 	}
 
-	echo info_progression_etape(4,'etape_ldap','install/');
 	echo install_fin_html();
 }