Open Time

Après avoir mis en place toute la mécanique nécessaire pour la gestion du plugin, voyons aujourd’hui comment proposer un widget et ce que ça donne (enfin) côté public, pour les lecteurs du blog.

Première étape, prévoir ce qu’il faut pour la « gestion » du widget, du côté de l’administration, pour permettre son positionnement dans une des 3 zones possibles et la gestion des paramètres associés.

On commence par créer un fichier _widgets.php qui contiendra le code associé et on fait en sorte que ce fichier soit intégré dans le contexte d’administration, donc une petite ligne de plus dans le fichier _admin.php (voir ici le code complet de ce fichier) :

require dirname(__FILE__) . '/_widgets.php';

Puis le code, que je vais détailler, du fichier _widgets.php :

<?php
/**
 * @brief a11yConfig, a plugin for Dotclear 2
 *
 * @package Dotclear
 * @subpackage Plugins
 *
 * @author Franck Paul, Biou and contributors
 *
 * @copyright Franck Paul contact@open-time.net
 * @copyright GPL-2.0 https://www.gnu.org/licenses/gpl-2.0.html
 */

if (!defined('DC_RC_PATH')) {return;}

$core->blog->settings->addNamespace('a11yConfig');
if (!(boolean) $core->blog->settings->a11yConfig->active) {
    return;
}

$core->addBehavior('initWidgets', ['a11yconfigWidget', 'initWidgets']);
$core->addBehavior('initDefaultWidgets', ['a11yconfigWidget', 'initDefaultWidgets']);

class a11yconfigWidget
{
    public static function initWidgets($w)
    {
        $w->create('a11yconfig', 'a11yconfig', array('a11yconfigPublic', 'a11yconfigWidget'), null, __('Style selector to let users adapt your blog to their needs.'));

        $w->a11yconfig->setting('buttonname', __('Title') . ' :', __('Accessibility Settings'));

        $w->a11yconfig->setting('font', __('Font adaptation'), 1, 'check');
        $w->a11yconfig->setting('linespacing', __('Line Spacing adaptation'), 1, 'check');
        $w->a11yconfig->setting('justification', __('Justification adaptation'), 1, 'check');
        $w->a11yconfig->setting('contrast', __('Contrast adaptation'), 1, 'check');
        $w->a11yconfig->setting('image', __('Image replacement'), 1, 'check');

        $w->a11yconfig->setting('offline', __('Offline'), 0, 'check');
    }

    public static function initDefaultWidgets($w, $d)
    {
        $d['nav']->append($w->a11yconfig);
    }
}

Le début est usuel, vous l’avez déjà vu ailleurs, ensuite les lignes 16 à 19 permettent d’arrêter là tout traitement si le plugin est désactivé.

Ensuite, on prévoit deux traitements liés à des behaviors, j’ai parlé de ce système dans un billet précédent, le premier pour « enregistrer » notre nouveau widget et ses options, le second, facultatif, qui permet d’intégrer ce widget par défaut dans une des zones disponibles, pour un nouveau blog.

Un petit aparté au sujet des zones de widgets :

Il en existe trois dont les noms sont nav, extra et custom. Ses trois zones sont prévues d’emblée dans les jeux de template currywurst et dotty alors que seules les deux premières le sont pour le jeu de template mustek. Cela dit, un thème peut tout à fait prévoir d’intégrer toutes ses zones, quelques unes d’entre elles, voire aucune. Le choix est libre.

Le code correspondant, dans un fichier template, ressemble à celui-ci (extrait du jeu de template dotty, dans le fichier _sidebar.html :

<aside class="sidebar" id="sidebar" role="complementary">
	<tpl:IfWidgets type="nav">
		<div class="widgets blognav__widgets" id="blognav">
	        <h2 class="blognav__title">{{tpl:lang Blog menu}}</h2>
			{{tpl:Widgets type="nav"}}
		</div> <!-- # End #blognav -->
	</tpl:IfWidgets>
	<tpl:IfWidgets type="extra">
		<div class="widgets blogextra__widgets" id="blogextra">
	        <h2 class="blogextra__title">{{tpl:lang Extra menu}}</h2>
			{{tpl:Widgets type="extra"}}
		</div> <!-- # End #blogextra -->
	</tpl:IfWidgets>
</aside>

Sachez qu’il est aussi tout à fait possible d’inclure le widget de façon indépendante, en ajoutant ce code dans un des fichiers template de votre thème :

<tpl:Widget id="a11yconfig">
    <setting name="buttonname">Libellé du bouton</setting>
    ...
</tpl:Widget>

Reprenons le premier traitement lié au behavior initWidgets, qui permet d’enregistrer notre widget et de définir les options qu’il prévoit.

L’outil d’Access42 prévoit un certain nombre d’options, activables et désactivables en fonction des besoins, qui concernent :

• L’adaptation de la police de caractère.
• L’interlignage.
• La justification.
• La gestion du contraste.
• Le remplacement des images.

Si vous voulez en savoir un peu plus je vous conseille d’aller explorer ce site qui lui est dédié.

J’ai donc prévu, comme options possibles, l’activation et/ou la désactivation de chacune de ces possibilités, voir les lignes 32 à 36.

La ligne 28 permet de « créer » le widget en indiquant entre autre son nom de code, ici a11yconfig et la fonction gérant son aspect « publique » qu’on détaillera plus tard.

La ligne 30 permet de libeller le bouton qui sera affiché dans la zone où le widget sera intégré et enfin la ligne 38, assez courante pour tout les widgets, permet d’activer ou de désactiver le widget en question^[1].

Dès lors, on peut observer un nouvel entrant dans la liste des widgets disponibles :

Qu’on peut alors « glisser » dans une des zones proposée :

Puis on peut « ouvrir » le widget pour régler ses options :

On va faire une pause jusqu’à demain où on détaillera la partie « publique » de la gestion du widget.