Nota SPIP-Contrib : une contrib encore en plein développement (vous aurez été prévenus). L’idée de cette publication à ce stade est de faire avancer la documentation en même temps que le code.
Présentation
Ce plugin a pour but de faciliter l’ajout de plugins pour jQuery par d’autres plugins ou pour des squelettes. Il est développé pour SPIP 1.9.3.
Il télécharge automatiquement certaines librairies pour JQuery à l’installation, dans un dossier lib/.
Il propose 2 balises #JQUERY_PLUGIN et #JQUERY_PLUGIN_THEME
Un formulaire CFG permet de cocher les plugins que l’on veut activer en permanence sur le site. Un pipeline permet à d’autres plugins d’ajouter ceux dont ils ont besoin également.
Liste des librairies proposées
Autocomplete : http://bassistance.de/jquery-plugin...
DatePicker : http://jquery.com/plugins/project/d...
Easing : http://jquery.com/plugins/project/Easing
SyncHeight : http://ginader.devjavu.com/browser/... (gère la hauteur de colonnes)
UI : http://jquery.com/plugins/project/ui
Validate : http://jquery.com/plugins/project/v...
Yav : http://jquery.com/plugins/project/j...
Installation
A la première activation du plugin, des boutons "télécharger" apparaissent dans la page de configuration des plugins disant qu’il manque des librairies (SPIP>1.9.3). Tant que toutes les librairies de plugins pour jQuery ne seront pas téléchargées, il ne sera pas possible d’activer le plugin SPIP « jquery_plugins ».
Le téléchargement installe les fichiers dans des sous-répertoires du répertoire lib/, par exemple, pour jquery.UI : lib/jquery.ui-1.0/.
Activer en permanence certains plugins
Depuis jquery_plugins
Pour cela, il suffit de se rendre sur la page de configuration du plugin (ecrire/?exec=cfg&cfg=jqueryp), de cocher les plugins désirés et de valider.
Ces plugins seront ajoutés automatiquement au fichier jquery.js.html appelé par spip pour charger jquery et ses plugins.
Depuis un autre plugin
Référencer dans plugin.xml le plugin et le pipeline :
<necessite id="jqueryp" />
<pipeline>
<nom>insert_jquery_plugins</nom>
<inclure>PREFIX_pipeline.php</inclure>
</pipeline> dans le fichier PREFIX_pipeline.php (ajoute ui.mouse et ui.tabs) :
function PREFIX_insert_jquery_plugins($flux) {
return jqueryp_add_plugins(array('ui.mouse','ui.tabs'), $flux);
}Cette méthode ajoute aussi automatiquement le code javascript des plugins dans le fichier (surchargé) jquery.js.html grace au pipeline et à la présence de la balise #PIPELINE{insert_jquery_plugins}.
Si un plugin est activé plusieurs fois (par différents plugins), son code ne sera présent qu’une seule fois.
Activer le plugin sur certains squelettes uniquement
Il est possible de mettre un lien vers le script d’un plugin jquery dans un squelette. C’est ce que fait la balise #JQUERY_PLUGIN
Une autre balise totalement optionnelle permet d’ajouter des css pour styler les plugins, c’est le rôle de #JQUERY_PLUGIN_THEME
Balise #JQUERY_PLUGIN
Une balise #JQUERY_PLUGIN permet d’appeler un ou plusieurs plugins pour jquery.
Exemples :
#JQUERY_PLUGIN{ui.tabs} ajoute
<script src="lib/jquery.ui-1.0/ui.tabs.js" type="text/javascript"></script> #JQUERY_PLUGIN{ui.tabs, ui.dimensions} ajoute les deux extentions ui.tabs et ui.dimensions.
Balise #JQUERY_PLUGIN_THEME
Une balise #JQUERY_PLUGIN_THEME{nom_theme_ou_squelette, plugin_1, plugin_2} ajoute un lien css (balise html link) vers un thème (3 thèmes sont fournis avec la librairie jquery.UI : light, dark et flora) ou vers un squelette SPIP renvoyant du css.
Exemples :
#JQUERY_PLUGIN_THEME{light} ajoute
<link media="screen" type="text/css" href="lib/jquery.ui-1.0/themes/light/light.css" rel="stylesheet"/> #JQUERY_PLUGIN_THEME{light, tabs} ajoute
<link media="screen" type="text/css" href="lib/jquery.ui-1.0/themes/light/light.css" rel="stylesheet"/>
<link media="screen" type="text/css" href="lib/jquery.ui-1.0/themes/light/light.tabs.css" rel="stylesheet"/> #JQUERY_PLUGIN_THEME{jqueryp.tabs.css} ajoute :
<link media="screen" type="text/css" href="http://zazen/spip/marcimat/spip.php?page=jqueryp.tabs.css"
rel="stylesheet"/>Attention : cette balise renvoie un
<link rel="stylesheet"
src="adresse_css" />, une balise qui ne devrait être présente que dans
le <head>
Commentaire : On pourait aussi intégrer directement le css par un <style> avec le code
css dedans. Là, ça irait aussi dans le body... je crois. A voir donc.
Comment utiliser ces librairies dans un plugin ?
Soit déclarer la dépendance de ’jqueryp’ dans son plugin.xml :
<necessite id="jqueryp" /> pour appeler ce plugin et avoir à disposition la balise
#JQUERY_PLUGIN{} et le pipeline insert_jquery_plugins
soit, si la librairie voulue est optionnelle, en mettant par exemple dans son squelette :
[(#PLUGIN{jqueryp}|?{' '})
#JQUERY_PLUGIN{ui.tabs}
]Ajouter une librairie dans le plugin
Si la librairie est livrée en zip, simplement ajouter le nom du dossier décompressé et l’adressee du zip dans un nécessite de plugin.xml :
<necessite id="lib:jquery.ui-1.0" src="http://jqueryjs.googlecode.com/files/jquery.ui-1.0.zip" />
si la librairie est livrée au format texte, il faut remplir la partie ’install’ (optionnelle pour les librairies en zip) dans jqueryp_options.php.
Dans tous les cas,il faut remplir jqueryp_options.php.
Exemple :
$GLOBALS['jquery_plugins'] = array(
//datepicker
'datepicker' => array(
'dir' => 'jquery.datepicker',
'url' => 'http://jquery.com/plugins/project/datepicker',
'install' => array(
'jquery.datePicker.js' => 'http://jquery.com/plugins/files/jquery.datePicker.js_1.txt'
),
'files' => array(
'datepicker' => 'jquery.datePicker.js'
)
)
/* ... */
);Change Log
Todo : Version 0.4
utilisation du pipeline déjà présent dans SPIP 1.9.3 insert_js (merci Renato pour l’info), à la place de insert_jquery_plugins et de la surcharge de jquery.js.html. Impossible en l’état sans surcharger 2 fichiers du Core ! car charge_script n’accepte que des fichiers .js contenus dans /javascript et donc pas dans /lib.
Version 0.3.5
meilleure interface de configuration
LIB :
- + Autocomplete
Version 0.3.4
LIB :
- + Validate
Version 0.3.3
Annule la compatibilité 1.9.2 qui avait encore des problèmes car ce n’est pas la même version de JQuery d’installé en SPIP 1.9.2 (version 1.1) et SPIP 1.9.3 (version 1.2.1) et les plugins fournis ici ne sont pas tous compatibles.
Version 0.3.2
Retrocompatibilité 1.9.2 (formulaire CFG)
Version 0.3.1
changements dans le code pour preparer l’utilisation du pipeline insert_js (mais c’est toujours insert_jquery_plugins qui est utilisé)
Version 0.3
Correction Bug : les plugin récupérés au format texte étaient téléchargés à chaque hit.
Retrocompatibilité 1.9.2 (téléchargement des librairies zippées gràce aux fonctions ’chargeur’ de Toggg)
Version 0.2
Téléchargement automatique de plugins au format texte pour jquery
LIB :
- + DatePicker
- + Easing
- + SyncHeight
Version 0.1
Téléchargement automatique de librairies pour jquery zippées (SPIP 1.9.3)
Pipeline insert_jquery_plugins pour ajouter automatiquement le code des plugins actifs dans jquery.js.html
LIB :
- + UI
- + Yav
Le futur
Il y a tellement de possibilités avec ces librairies qu’il y a des chances pour que les spipeurs aient plein de bonnes idées pour l’utiliser et pour améliorer ce plugin (et il ne faudrait surtout pas se géner !).
A commencer par proposer des librairies à ajouter...
Toute suggestion ou contribution est donc la bienvenue !
RSS 2.0