MediaWiki:JSScripts/Toolbar
Un livre de Wikibooks.
/*
Lors de l'édition d'une page, pourquoi rassembler tous les boutons en un seul groupe, le plus souvent mal ordonné, pour finir par ne plus retrouver le bouton recherché ?
Ce script permet la création de barres d'outils séparées. Chaque barre possède un titre et peut être affichée ou cachée (mémorisation par cookie).
Utilisation
Dans votre script monobook.js :
- Ajoutez les 2 lignes de code suivantes :
- obtenir("Toolbar");
- obtenirCss("Toolbar");
- Créez une fonction de configuration pour cette extension :
- function maBarreDOutil()
- {
- ...
- }
- addSetup("Toolbar",maBarreDOutil);
- Vous pouvez créer une fonction de configuration pour chaque nouvelle barre d'outils ou créer toutes vos barres d'outils dans la même fonction de configuration.
- Dans cette fonction, créez la barre d'outils en appelant la fonction createToolbar(id, titre) en lui attribuant un identifiant unique et un titre.
- Exemple: var mabarre = createToolbar( "MYBAR" , "Ma barre d'outils" );
- Ajouter des boutons à la barre, en appelant les méthodes de l'objet créé :
- addButton(imageFile, speedTip, tagOpen, tagClose, sampleText, summary)
- Ajouter un bouton d'édition.
- Exemple: mabarre.addButton(url_wpen+'c/c8/Button_redirect.png','Redirection',"#REDIRECT [[","]]",'nom de la destination');
- addModel(imageFile, text, summary)
- Ajouter un bouton d'insertion de modèle.
- Exemple: mabarre.addModel(url_wpfr+"e/eb/Button_accueilB.png","{{subst:" + "Bienvenue" + "}}" + "--" + "~~" + "~~", "Bienvenue !");
- addScript(imageFile, speedTip, code, summary)
- Ajouter un bouton appelant un code javascript.
- Exemple: mabarre.addScript(url_wpcm+"c/cb/Button_wikipedia.png", "Importation des liens de wikipédia", "replaceExtLinks('w')");
Ces méthodes ont des paramètres communs :
- imageFile
- Le nom de l'image du bouton (obligatoire),
- speedTip
- Texte affiché lors du survol du bouton par la souris (obligatoire),
- summary
- Texte à placer dans le champ "Résumé" (optionnel).
Exemple de script
obtenir("Toolbar"); obtenirCss("Toolbar"); function maBarreDOutil() { var mabarre = createToolbar( "MYBAR" , "Ma barre d'outils" ); mabarre.addButton(url_wpen+'c/c8/Button_redirect.png', 'Redirection', "#REDIRECT [[","]]",'nom de la destination'); mabarre.addModel(url_wpfr+"e/eb/Button_accueilB.png", "{{subst:" + "Bienvenue" + "}}" + "--" + "~~" + "~~", "Bienvenue !"); mabarre.addScript(url_wpcm+"c/cb/Button_wikipedia.png", "Importation des liens de wikipédia", "replaceExtLinks('w')"); } addSetup("Toolbar",maBarreDOutil);
Barres d'outils prédéfinies
Voici une liste des extensions créant une barre d'outils utilisant ce script :
- MediaWiki:JSScripts/Smileys : une barre d'insertion de smileys ou émoticônes dans les pages de discussion.
- ...
Source
*/ /*********************************************/ /* Barres d'outils séparées (auteur: DavidL) */ /*********************************************/ function SetVar(name,value) { var expires=new Date(); expires.setFullYear(expires.getFullYear()+1); document.cookie=name+"="+escape(value)+ ";expires="+expires.toGMTString()+";path=/"; } function GetVar(name,defvalue) { var s=";"+document.cookie.replace(/ /g,"")+";"; var i=s.indexOf(";"+name+"="); if (i<0) return defvalue; i+=name.length+2; return unescape(s.substring(i,s.indexOf(";",i))); } var visible_toolbars=GetVar("toolbars","").split("/"); function findToolbar(id) { for(var i in visible_toolbars) if (visible_toolbars[i]==id) return i; return -1; } // Créer/Obtenir le conteneur de barres d'outils function getToolbarContainer() { var e=document.getElementById("toolbarcontainer"); if (e!=null) return e; else { var e=document.getElementById("toolbar"); if (e==null) return null; var tc=document.createElement("div"); tc.setAttribute("id","toolbarcontainer"); var p=e.parentNode; e=p.replaceChild(tc,e); var alls=document.createElement("div"); alls.setAttribute("id","all_toolbars"); alls.appendChild(document.createTextNode("Barres d'outils :")); tc.appendChild(alls); tc.appendChild(e); return tc; } } function addToolbarButton(toolbar, imageFile, speedTip, tagOpen, tagClose, sampleText, summary) { toolbar.buttons.push( {"imageFile": imageFile, "speedTip": speedTip, "tagOpen": tagOpen, "tagClose": tagClose, "sampleText": sampleText, "summary": summary}); } function addToolbarButtonScript(toolbar, imageFile, speedTip, jsCode, summary) { toolbar.buttons.push( {"imageFile": imageFile, "speedTip": speedTip, "jscode": jsCode, "summary": summary}); } function showToolbar(id,n) { var t=document.getElementById(id); if (n==2) n=(t.style.display&&(t.style.display=="none"))?1:0; t.style.display=(n==0)?"none":"block"; var ti=findToolbar(id); if (n==1) {if (ti<0) visible_toolbars.push(id);} else if (ti>=0) visible_toolbars.splice(ti,1); SetVar("toolbars",visible_toolbars.join("/")); return false; } var toolbars=[]; // Créer une nouvelle barre d'outils function createToolbar(id,title) { var node=document.createElement("div"); node.setAttribute("id",id); node.setAttribute("title",title); node.setAttribute("class","toolbar_perso"); node.setAttribute("className","toolbar_perso"); var titlenode=document.createElement("div"); titlenode.setAttribute("class","toolbartitle"); titlenode.setAttribute("className","toolbartitle"); titlenode.appendChild(document.createTextNode(title)); node.appendChild(titlenode); if (findToolbar(id)<0) node.style.display="none"; var link=document.createElement("a"); link.setAttribute("id",id+"_link"); link.setAttribute("href","#"); link.setAttribute("onclick","return showToolbar('"+id+"',2);"); if (document.all) { link.onclick=function(){return showToolbar(id,2);} } link.setAttribute("title","montrer / cacher"); link.appendChild(document.createTextNode("["+title+"]")); var toolbar={ "buttons": [], "title": title, "node": node, "nodelink": link, "addButton": function(imageFile, speedTip, tagOpen, tagClose, sampleText, summary) {addToolbarButton(this, imageFile, speedTip, tagOpen, tagClose, sampleText, summary);}, "addModel": function(imageFile, text, summary) {addToolbarButton(this, imageFile, summary, '', text, '', summary);}, "addScript": function(imageFile, speedTip, code, summary) {addToolbarButtonScript(this, imageFile, speedTip, code, summary);} }; toolbars.push(toolbar); return toolbar; } /* function mwInsertEditButton(parent, item) { var image = document.createElement("img"); image.width = 23; image.height = 22; image.src = item.imageFile; image.border = 0; image.style.cursor = "pointer"; var ref = document.createElement("a"); var href; if (item.jscode != null) href="javascript:"+item.jscode+";"; else href="javascript:insertTags(\"" + item.tagOpen + "\",\"" + item.tagClose + "\",\"" + item.sampleText + "\");"; if (item.summary != null) href+="javascript:changeSummary(\"" + item.summary + "\");"; ref.setAttribute("href", href); ref.setAttribute("title", item.speedTip); ref.appendChild(image); parent.appendChild(ref); } */ function openToolbars() { if (toolbars.length>0) { var tc=getToolbarContainer(); if (tc==null) return; var tca=document.getElementById("all_toolbars"); for(var i in toolbars) { var t=toolbars[i]; tc.appendChild(t.node); tca.appendChild(document.createTextNode(" ")); tca.appendChild(t.nodelink); for(var j in t.buttons) mwInsertEditButton(t.node,t.buttons[j]); } } toolbars=[]; } addOnloadHook(openToolbars); doSetup("Toolbar"); /*********************************************/ /*
*/
