Accessibilité: la balise body prends la classe de la feuille de style sélectionnée.

application/modules/opac/views/scripts/head.phtml

@@ -68,14 +68,21 @@ if($current_profil->hasPageCss())
 
 if ($this->accessibilite_on) {  //Feuilles de styles pour les déficiences visuelles
 	$head_scripts
-		->addOPACStyleSheet('blanc_sur_noir', array('rel' => 'alternate stylesheet',
-																								'title' => $this->_('Blanc sur noir')))
-		->addOPACStyleSheet('noir_sur_blanc', array('rel' => 'alternate stylesheet',
-																								'title' => $this->_('Noir sur blanc'))) 
-		->addOPACStyleSheet('bleu_sur_jaune', array('rel' => 'alternate stylesheet',
-																								'title' => $this->_('Bleu sur jaune')))
-		->cssAddLine($this->_('<link rel="alternate stylesheet" type="text/css" href="#" title="%s">', 
+		->addOPACStyleSheet('blanc_sur_noir', ['rel' => 'alternate stylesheet',
+																					 'title' => $this->_('Blanc sur noir'),
+                                           'data-name' => 'style_blanc_sur_noir'])
+
+		->addOPACStyleSheet('noir_sur_blanc', ['rel' => 'alternate stylesheet',	
+																				   'title' => $this->_('Noir sur blanc'),
+                                           'data-name' => 'style_noir_sur_blanc'])
+ 
+		->addOPACStyleSheet('bleu_sur_jaune', ['rel' => 'alternate stylesheet',
+																					 'title' => $this->_('Bleu sur jaune'),
+                                           'data-name' => 'style_bleu_sur_jaune'])
+
+		->cssAddLine($this->_('<link rel="alternate stylesheet" type="text/css" href="#" title="%s" data-name="style_defaut">', 
 													'Style par défaut'))
+
 		->cssAddLine('<link id="accessibility_stylesheet" rel="stylesheet" type="text/css" href="#" title="CSS accessibilité">')
 		->addAdminScript('jquery.cookie')
 		->addJQueryReady('initAccessibilityOptions();');

public/opac/js/accessibility.js

@@ -3,6 +3,7 @@ var initAccessibilityOptions = function() {
 	var dialog;
 	var default_font_size;
 	var font_size_display;
+	var current_style  = "style_defaut";
 
 	function bodyFontSize() {
 		return $('body').css('font-size').replace('px', '');
@@ -28,6 +29,18 @@ var initAccessibilityOptions = function() {
 	}
 
 
+	function switchToStyle(style) {
+		$("body").removeClass(current_style);
+		current_style = style;
+
+		var url_stylesheet = $("link[data-name='"+style+"']").attr('href');
+		$("link#accessibility_stylesheet").attr("href", url_stylesheet);
+
+		$("body").addClass(current_style);
+		$.cookie("accessibility_style", style, {expires: 365, path: '/'});
+	}
+	
+
 	function createAccessibilityDialog() {
 		dialog = $("<div id='accessibility_dialog' title='Style'><ul style='white-space:nowrap'></ul></div>").
 			appendTo($("#open_accessibility")).
@@ -45,7 +58,7 @@ var initAccessibilityOptions = function() {
 		$('link[rel="alternate stylesheet"]').each(function(index, element){
 			$('<li>'+$(element).attr('title')+'</li>').
 				appendTo(css_list).
-				attr('data-css', $(element).attr('href')).
+				attr('data-css', $(element).attr('data-name')).
 				css('cursor', 'pointer').
 				addClass('ui-widget-content');
 		});
@@ -53,10 +66,11 @@ var initAccessibilityOptions = function() {
 		css_list.selectable({
 			selected: function(event, ui){
 				var css = $(ui.selected).attr('data-css');
+
 				if (css == undefined)
 					css = $(event.srcElement).attr('data-css');
-				$("link#accessibility_stylesheet").attr("href", css);
-				$.cookie("accessibility_css",css, {expires: 365, path: '/'});
+
+				switchToStyle(css);
 				return false;
 			}
 		});
@@ -108,7 +122,7 @@ var initAccessibilityOptions = function() {
 	createAccessibilityDialog();
 
 	/* Restaure le CSS sélectionné précédemment*/
-	if($.cookie("accessibility_css")) {
-		$("link#accessibility_stylesheet").attr("href",$.cookie("accessibility_css"));
+	if($.cookie("accessibility_style")) {
+		switchToStyle($.cookie("accessibility_style"));
 	}
 }