Une feuille CSS peut en cacher une autre

Si vous avez l'habitude de voir passer les trains quand vous êtes devant un passage à niveau, vous devez savoir qu'un train peut en cacher un autre et qu'on ne traverse pas les voies en courant juste après le passage du premier train. Normalement c'est marqué sur un panneau, sauf s'il a été volé.

Votre navigateur internet (Chome, Firefox, Vivaldi, Opéra, ...) peut vous jouer la même entourloupe.
En effet, pour avoir un affichage rapide de la prochaine page HTML que vous allez regarder, les feuilles de style externes contenus dans des fichiers .css sont mis en cache dans le navigateur car elles ne changent pratiquement pas.
Sauf si vous ajoutez ou retirez un plugin à votre CMS favori, s'il est correctement écrit pour que ses propres règles CSS fusionnent avec celles des autres plugins dans les fichiers communs plugins/admin.css et plugins/site.css.
Si vous développez un plugin, c'est ennuyeux pour vous et les étourdis ne manqueront pas de vous dire " Ça marche pas ! ". La seule réponse a leur dire est : "Tape F5 sur ton clavier"

Cela provient d'un bug de PluXml qui ne notifie pas aux navigateurs que les contenus des fichiers admin.css et site.css ont changé.
C'est assez facile à corriger en ajoutant aux noms des fichiers un paramètre aux noms des fichiers comme admin.css?d=xxx et site.css?d=xxx, où xxx évolue en fonction da la date de modification des fichiers.

Let's go !

On se base pour cela sur le temps EPOC. Pour ceux qui n'ont connu que Window$ dans leur vies, rappelons qu'il s'agit du nombre de secondes écoulées depuis le 01/01/1970, soit 1526550455 secondes à l'heure de la rédaction de ce billet. C'est un gros nombre. Avec un nombre qui boucle sur environ 30 jours, cela serait aussi bien, En fait, cela sera 48,54 jours.

Si vous avez croisé des bandes de bits à l'époque des micro-controlleurs 6502 ou Z80 , disons que les 48,54 jours sont également à 4194303 secondes, soit en binaire 2 puissance 22 - 1, et en hexadécimal 3fffff. Là, normalement vous sentez le masque de bits venir.

Plongeons les mains dans le cambouis !
Il faut faire 2 petites modifs au fichier core/lib/class.plx.motor.php, en rajoutant une constante TIME_MASK et une méthode pluginsCss :

[== PHP ==]
<?php
// ...........
class plxMotor {

	const TIME_MASK = 4194303; # 2 puissance 22 - 1; base_convert(4194303, 10, 16) -> 3fffff; => 48,54 jours
// .......
	public function pluginsCss($admin=false) {
		$cible = ($admin) ? 'admin' : 'site';
		$filename = "{$this->aConf['racine_plugins']}$cible.css";
		if(is_file(PLX_ROOT.$filename)) {
			$href = ($admin) ? PLX_ROOT.$filename : $this->urlRewrite($filename);
			$href .= '?d='.base_convert(filemtime(PLX_ROOT.$filename) & self::TIME_MASK, 10, 36);
			echo <<< LINK
<link rel="stylesheet" type="text/css" href="$href" media="screen" />\n
LINK;
		}
	}

}
/* ----- fin du fichier -------- */
?>

Côté site, on modifie le fichier core/lib/class.plx.show.php en simplifiant la méthode pluginsCss() comme ceci :

[== PHP ==]
	public function pluginsCss() {
		# Hook Plugins
		if(eval($this->plxMotor->plxPlugins->callHook('plxShowPluginsCss'))) return;
		$this->plxMotor->pluginsCss();
	}

Quelque soit le thème employé, le navigateur sera notifié à chaque modification du fichier commun à tous les plugins plugins/site.css
Côté admin, il faut remplacer la balise <link> qui pointe vers admin.css dans le fichier core/admin/top.php:
Avant modif :

[== PHP ==]
       <?php
       if(file_exists(PLX_ROOT.$plxAdmin->aConf['racine_plugins'].'admin.css'))
               echo '<link rel="stylesheet" type="text/css" href="'.PLX_ROOT.$plxAdmin->aConf['racine_plugins'].'admin.css" media="screen" />'."\n";
       ?>

Après modif :

[== PHP ==]
	<?php $plxAdmin->pluginsCss(true); ?>

Si vous affichez le code source dans le navigateur, le lien vers la feuille de style ressemble à quelque chose comme ceci

[== HTML ==]
<link rel="stylesheet" type="text/css" href="../../plugins/admin.css?d=2e1ij" media="screen" />

Si vous savez utiliser patch, le diff est sur Github :
https://gist.github.com/bazooka07/0b8401610dbda39e990052f01e29c6cb

Bon amusement