Voir la source de Discussion utilisateur:Dr Brains/MagicSidebox.js

{{:Utilisateur:Dr Brains/onglets}}
[[Image:Demo MagicSidebox.png|thumb|600px|Démonstration du script en action.]]
'''<big>[[Utilisateur:Dr Brains/MagicSidebox.js|MagicSidebox]]</big>''' est un script permettant de transformer la barre de navigation gauche pour permettre le Drag & Drop, autrement dit, les boîtes de la barre de navigation deviennent déroulante et réorganisables. L'ordre des boîtes ainsi que leur état (enroulées ou déroulées) sont enregistrés après chaque modification sur un cookie local dans l'ordinateur de l'utilisateur. Ces informations ne se perdent donc pas après un changement de page ou la fermeture du navigateur.

Il est basé sur le script "Docking Boxes" version 2.05, dont la dernière version est disponible [http://www.brothercake.com/site/resources/scripts/dbx/ ici]. La version 2.05 peut être téléchargée [http://cookandy.com/downloads/mediawiki/andy-s-mediawiki-skin ici], où elle est utilisée dans un skin perso pour faire précisément ce que fait [[Utilisateur:Dr Brains/MagicSidebox.js|MagicSidebox]]. Ce skin, et donc l'équivalent du présent script, peut être testé [http://testwiki.cookandy.com/index.php?title=Main_Page ici].

== Description ==

=== Utilisation ===

==== Habillage ====

Ce script fonctionne uniquement avec l'habillage Monobook. 

Une version pour Vector/Açai est disponible sur la page [[Utilisateur:Dr Brains/VectorMagicSidebox.js]].

==== Navigateur ====

Ce script fonctionne correctement avec 
* Firefox 3.5 
* Opera 10
* Google Chrome 3

Il ne marche pas avec
* Internet explorer 7 et 8

=== Caractéristiques ===

Le script effectue plusieurs opérations avant la "transformation", dues au fait que le nombre de boîtes DOIT être constant sur toutes les pages. En effet, si une page n'a pas le même nombre de boîtes que ce qui est enregistré sur le cookie, l'ordre des boîtes est perdu.

Or, certaines boîtes n'apparaissent que sous condition.

C'est la cas pour :
* Les liens interwikis
* Les liens "Autres projets" (liens vers Commons, WikiBook, etc...)
* Les catégories lors de l'utilisation du gadget [[MediaWiki:Gadget-CatsaGauche.js]]

Pour palier à ce défaut, le script teste donc si ces boîtes sont présentes, et si ce n'est pas le cas, il crée en une "fausse" pour faire le nombre. Dans le cas des catégories, une version modifiée du gadget est utilisée pour créer la boîte. Aussi, CatsaGauche ne doit pas être utilisé car il créerait une autre boîte (non permanente donc amenant le défaut expliqué plus haut).

Une version light (monobook uniquement) de [[Utilisateur:Dr Brains/favoris.js]] est également utilisée pour ajouter un panneau "favoris" où les utilisateurs peuvent stocker des liens vers leurs pages favorites. 
{{Boîte déroulante début|titre=Démo boîte favoris}}
[[Image:Demo favoris.png|thumb|500px]]
{{Boîte déroulante fin}}

Les boîtes ré-organisables sont donc, dans l'ordre initial :
# Le logo (qui ne peut pas être déplacé directement mais peut descendre en plaçant une autre boîte au-dessus),
# la boîte "Favoris",
# la boîte de recherche,
# la boîte "Navigation",
# la boîte "Contribuer,
# la boîte "Créer un livre", due à l'extension collection installée sur Wikipédia,
# la boîte "Catégories",
# la boîte à outils,
# la boîte "Autres projets",
# la boîte "Autres langues".

=== Relations avec d'autres scripts ===

Ce script transforme beaucoup d'éléments de la page et pourrait entrer en conflit avec un autre script. Par conséquent, il doit être appelé '''en tout dernier''' dans le monobook.

Pour info, parmi les modifications effectuées :

* Tous les élément de classe "portlet" et "pBody" (sauf deux, les liens perso et les onglets) sont transformés respectivement en "dbx-box" et "dbx-content", 
* Le <nowiki><div></nowiki> de gauche reçoit la classe "dbx-group" et son Id est modifiée : elle passe de "column-one" à "sidebox" (le script qui gère les boîtes ne veut pas de tiret). 
* Le <nowiki><div></nowiki> "globalWrapper" (le <nowiki><div></nowiki> principal, qui inclue tous les éléments de la page) reçoit la classe "container13".

== Installer le script ==

Deux possibilités pour installer ce gadget :
* Importer via un élément <nowiki><script></nowiki> et un élément <nowiki><link></nowiki> dans son [[Spécial:MyPage/monobook.js|monobook.js]]
* Copier entièrement le code source dans des [[Aide:Sous-pages|sous-pages personnelles]].

=== Importer ===

Pour importer le script, ajouter dans votre page [[Spécial:MyPage/monobook.js|monobook.js]] le code suivant :
{| style="border:3px dotted red;"
|
<syntaxhighlight lang=javascript>
document.write('<script type="text/javascript" src="'
+ 'http://fr.wikipedia.org/w/index.php?title=Utilisateur:Dr_Brains/MagicSidebox.js'
+ '&action=raw&ctype=text/javascript&dontcountme=s"></script>');
</syntaxhighlight>
|}

Ceci importera le code tel qu'il se trouve sur la page [[Utilisateur:Dr Brains/MagicSidebox.js]]

L'avantage de cette méthode est la simplicité, l'inconvénient est l'absence de personnalisation, ou plutôt l'obligation d'avoir la même que la mienne.

=== Copier ===

Pour pouvoir personnaliser le script, il est nécessaire de 
# copier les deux parties du [[Discussion utilisateur:Dr Brains/MagicSidebox.js#MagicSidebox.js|code javascript]] dans une sous page personnelle, par exemple [[Spécial:MyPage/MagicSidebox.js|Utilisateur:<VOTRE NOM>/MagicSidebox.js]]
# ajouter à votre page monobook le code suivant en remplaçant le texte en majuscules par les pages utilisées pour les opérations précédentes (remplacer les espaces par des underscores : {{Touche|shift}} + {{Touche|8}} ) :
{| style="border:3px dotted red;"
|
<syntaxhighlight lang=javascript>
document.write('<script type="text/javascript" src="'
+ 'http://fr.wikipedia.org/w/index.php?title=PAGE_OÙ_LE_CODE_JS_A_ÉTÉ_COPIÉ'
+ '&action=raw&ctype=text/javascript&dontcountme=s"></script>');
</syntaxhighlight>
|}
Cette méthode permet la personnalisation du script, et notamment le retrait de boîtes jugées inutiles ou indésirables.

== Personnaliser le script ==

=== Masquer des boîtes ===

Il est possible de masquer une ou plusieurs boîtes.

Pour cela, modifier la valeur des variables dans la première partie personnalisable du [[Discussion utilisateur:Dr Brains/MagicSidebox.js#Première partie : Modifications de l'affichage|code Javascript]] (voir ci-dessous). Les valeurs possibles sont <tt>true</tt> ou <tt>false</tt>. Par défaut, toutes sont à <tt>true</tt>.
{| style="border:3px dotted red;"
|
<syntaxhighlight lang=javascript>
////////////////////////////////////////////////////////////////////// PARTIE PERSONNALISABLE /////////////////////////////////////////////////////////////////////////////
 
var DisplayLogoPortlet = true;                     // Affichage (ou pas) du logo
 
var DisplayFavoritesPortlet = true;                // Affichage (ou pas) des favoris
 
var DisplaySearchPortlet = true;                   // Affichage (ou pas) de la boîte de recherche
 
var DisplayNavigationPortlet = true;               // Affichage (ou pas) de la boîte "Navigation"
 
var DisplayContribuerPortlet = true;               // Affichage (ou pas) de la boîte "Contribuer"
 
var DisplayBookPortlet = true;                     // Affichage (ou pas) de la boîte "Créer un livre"
 
var DisplayCategoriesPortlet = true;               // Affichage (ou pas) de la boîte "Catégories"
 
var DisplayToolboxPortlet = true;                  // Affichage (ou pas) de la boîte à outils
 
var DisplayProjectsPortlet = true;                // Affichage (ou pas) de la boîte "Autres projet"
 
var DisplayLangPortlet = true;                     // Affichage (ou pas) des interwikis
 
////////////////////////////////////////////////////////////////////// PARTIE PERSONNALISABLE /////////////////////////////////////////////////////////////////////////////
</syntaxhighlight>
|}

=== Modifier le comportement des boîtes ===

Certains paramètres peuvent être modifiés dans la deuxième partie personnalisable du [[Discussion utilisateur:Dr Brains/MagicSidebox.js#Deuxième partie : Animation des boîtes|code Javascript]].

Les textes des popups sont également modifiables.

{| style="border:3px dotted red;"
|
<syntaxhighlight lang=javascript>
/////////////////////////////////////////////////////////////// PARTIE PERSONNALISABLE ///////////

		'no',			                          // restrict drag movement to container axis ['yes'|'no']
		'10', 			                          // animate re-ordering [frames per transition, or '0' for no effect]
		'yes', 		              	                  // include open/close toggle buttons ['yes'|'no']
		'open', 		                          // default state ['open'|'closed']

		'ouvrir', 		                          // word for "open", as in "open this box"
		'fermer', 		                          // word for "close", as in "close this box"
		'Cliquer et glisser pour déplacer cette boite',   // sentence for "move this box" by mouse
		'Cliquer pour %toggle% cette boîte',              // pattern-match sentence for "(open|close) this box" by mouse
		'Déplacer cette boîte avec le clavier',           // sentence for "move this box" by keyboard
		', ou utiliser une touche pour la %toggle%',      // pattern-match sentence-fragment for "(open|close) this box" by keyboard

////////////////////////////////////////////////////////////// FIN DE LA PARTIE PERSONNALISABLE /////////
</syntaxhighlight>
|}

== CODE SOURCE ==
{{Boîte déroulante début|titre=Code source version Monobook}}
{| style="border:3px dashed green;"
|
<syntaxhighlight lang=javascript line>
/**************************************************************************
 * Libère les panneaux de la barre de navigation gauche                   *
 *                                                                        *
 * à appeler après tous les scripts créant des nouveaux panneaux          *
 *                                                                        *
 * Documentation : [[Discussion utilisateur:Dr Brains/MagicSidebox.js]]   *
 *                                                                        *
 *  Remplace :                                                            *
 * * MediaWiki:Gadget-CatsaGauche.js                                      *
 * * Utilisateur:Dr Brains/favoris.js                                     *
 *                                                                        *
 * A besoin de                                                            *
 **(http://fr.wikipedia.org/wiki/Utilisateur:Dr Brains/MagicSidebox.js)   *
 **(http://fr.wikipedia.org/wiki/Utilisateur:Dr Brains/MagicSidebox.css)  *
 *                                                                        *
 * Fonctionne avec  :                                                     *
 * * Firefox 3.5                                                          *
 *                                                                        *
 * Ne fonctionne pas avec :                                               *
 * * Internet Explorer 7                                                  *
 *                                                                        *
 * Habillage Monobook uniquement                                          *
 *                                                                        *
 * Basé sur le script Docking Boxes version 2.05 (voir plus bas)          *
 *  http://www.brothercake.com/site/resources/scripts/dbx/                *
 *                                                                        *
 *  [[Catégorie:MediaWiki:Fonction Monobook en JavaScript]]               *
 **************************************************************************/

//********************************************************************************************************************************  FONCTION PRINCIPALE
 
function MagicSidebar(){

////////////////////////////////////////////////////////////////////// PARTIE PERSONNALISABLE ///////////////////////////////////////////////////////////

var DisplayLogoPortlet = true;                     // Affichage (ou pas) du logo

var DisplayFavoritesPortlet = true;                // Affichage (ou pas) des favoris

var DisplaySearchPortlet = true;                   // Affichage (ou pas) de la boîte de recherche

var DisplayNavigationPortlet = true;               // Affichage (ou pas) de la boîte "Navigation"

var DisplayContribuerPortlet = true;               // Affichage (ou pas) de la boîte "Contribuer"

var DisplayBookPortlet = true;                     // Affichage (ou pas) de la boîte "Créer un livre"

var DisplayCategoriesPortlet = true;               // Affichage (ou pas) de la boîte "Catégories"

var DisplayToolboxPortlet = true;                  // Affichage (ou pas) de la boîte à outils

var DisplayProjectsPortlet = true;                // Affichage (ou pas) de la boîte "Autres projets"

var DisplayLangPortlet = true;                     // Affichage (ou pas) des interwikis

////////////////////////////////////////////////////////////////////// FIN DE LA PARTIE PERSONNALISABLE //////////////////////

// Boîtes additionnelles
 
    var Fav_TEST = document.getElementById('p-fav');
    if(!Fav_TEST){
        addFavoritesPortlet();
    }
    var Cat_TEST = document.getElementById('p-cat');
    if((!Cat_TEST)&&( DisplayCategoriesPortlet == true)){    
        addCatPortlet();
    }
    var Projets_TEST = document.getElementById('p_projects');
    if((!Projets_TEST)&&( DisplayProjectsPortlet == true)){
        addProjectPortlet();
    }
    var lang_TEST = document.getElementById("p-lang");
    if ((!lang_TEST)&&( DisplayLangPortlet == true)){
        addLangPortlet();
    }


// Préférences
 
    if( DisplayLogoPortlet == false){                     // Affichage (ou pas) du logo
        var RemoveDbx = document.getElementById("p-logo");
        if(RemoveDbx)document=document.getElementById("column-one").removeChild(RemoveDbx);
    } 
    if( DisplayFavoritesPortlet == false){                   // Affichage (ou pas) de la boîte "favoris"
        var RemoveDbx = document.getElementById("p-fav");
        if(RemoveDbx)document=document.getElementById("column-one").removeChild(RemoveDbx);  
    } 
    if( DisplaySearchPortlet == false){                   // Affichage (ou pas) de la boîte de recherche
        var RemoveDbx = document.getElementById("p-search");
        if(RemoveDbx)document=document.getElementById("column-one").removeChild(RemoveDbx);       
    }        
    if( DisplayNavigationPortlet == false){                // Affichage (ou pas) de la boîte "Navigation"
        var RemoveDbx = document.getElementById("p-navigation");
        if(RemoveDbx)document=document.getElementById("column-one").removeChild(RemoveDbx);       
    }
    if( DisplayContribuerPortlet == false){                // Affichage (ou pas) de la boîte "Contribuer"
        var RemoveDbx = document.getElementById("p-Contribuer");
        if(RemoveDbx)document=document.getElementById("column-one").removeChild(RemoveDbx);      
    }
    if( DisplayBookPortlet == false){                      // Affichage (ou pas) de la boîte "Créer un livre"
        var RemoveDbx = document.getElementById("p-coll-create_a_book");
        if(RemoveDbx)document=document.getElementById("column-one").removeChild(RemoveDbx);       
    }
    if( DisplayCategoriesPortlet == false){                   // Affichage (ou pas) de la boîte "Catégories"
        var RemoveDbx = document.getElementById("p-cat");
        if(RemoveDbx)document=document.getElementById("column-one").removeChild(RemoveDbx);       
    }
    if( DisplayToolboxPortlet == false){                   // Affichage (ou pas) de la boîte à outils
        var RemoveDbx = document.getElementById("p-tb");
        if(RemoveDbx)document=document.getElementById("column-one").removeChild(RemoveDbx);       
    }
    if( DisplayProjectsPortlet == false){                 // Affichage (ou pas) de la boîte "Autres projet"
        var RemoveDbx = document.getElementById("p-projects");
        if(RemoveDbx)document=document.getElementById("column-one").removeChild(RemoveDbx);  
    }
    if( DisplayLangPortlet == false){                     // Affichage (ou pas) des interwikis
        var RemoveDbx = document.getElementById("p-lang");
        if(RemoveDbx)document=document.getElementById("column-one").removeChild(RemoveDbx);     
    }

// Transformation

    var global_div = document.getElementById( "globalWrapper" );
    global_div.setAttribute( "class", "container13" );
 
    var column_div = document.getElementById( "column-one" );
    column_div.setAttribute( "class", "dbx-group" );

    var Panneaux_div = column_div.getElementsByTagName("div");
    for(i=0;i<Panneaux_div.length;i++){
        if ($(Panneaux_div[i]).hasClass( "portlet" )){
            var Id_Panneaux_div = Panneaux_div[i].getAttribute("id");
            if( (Id_Panneaux_div != "p-personal" ) && (Id_Panneaux_div != "p-cactions" ) ){
                magicPortlets(Panneaux_div[i]);  
            }
        }
    }



    column_div.setAttribute( "id", "sidebox" ); 
}
addOnloadHook(MagicSidebar);

//******************************************************************************************************* FIN DE LA FONCTION PRINCIPALE

//*******************************************************************************************************  TRANSFORMATION DES PANNEAUX 

function magicPortlets(dbx_panneau){

    $(dbx_panneau).removeClass("portlet");
    $(dbx_panneau).addClass("dbx-box");

    var dbx_handle_div = document.createElement( "div" );
    dbx_handle_div.setAttribute( "class", "dbx-handle" );

    var dbx_h5 = dbx_panneau.getElementsByTagName("h5");
    for(i=0;i<dbx_h5.length;i++){
        dbx_handle_div.appendChild( dbx_h5[i] );
        dbx_panneau.appendChild( dbx_handle_div); 
    }

    var pBodies = dbx_panneau.getElementsByTagName("div");
    for(i=0;i<pBodies.length;i++){
        if ($(pBodies[i]).hasClass( "pBody" )){
            $(pBodies[i]).removeClass( "pBody" )
            $(pBodies[i]).addClass("dbx-content")
            dbx_panneau.appendChild( pBodies[i]);
        }
    }
}


//*******************************************************************************************************  FIN DE LA TRANSFORMATION DES PANNEAUX

//*******************************************************************************************************  PANNEAU FAVORIS

function addFavoritesPortlet(){

/////////////////////////////// PARTIE PERSONNALISABLE /////////////////////////////////////////////////////////////////////////////////////////

//////////////////////////////// POPUPS //////////

// popup titre //
var PopupTitle_fav = "Cliquer pour ajouter la page courante aux favoris" ; 

// popup aide (?) //
var PopupHelp_fav = "INFORMATION : Cette liste est stockée sur un cookie local. Si vous effacez vos cookies, cette liste disparaîtra." ;

// popup retrait [-] //
var PopupRemove_fav = "Cliquer pour retirer de la liste la page : " ;


//////////////////////////////// TEXTES ///////////

// titre de la boîte //
var Title_fav = "Ajouter aux favoris" ; 

// texte de la boîte vide //
var NoFavorites_fav = "Vous n'avez pas de favoris." ; 
	
/////////////////////////////// PARAMÈTRES /////////////////

// début de l'URL des liens //
var Path_fav = "http://fr.wikipedia.org/wiki/" ; 

/////////////////////////////// FIN DE LA PARTIE PERSONNALISABLE /////////////////////////////////////////////////////////////////////


// * création du titre du panneau *
 
var span_fav = document.createElement( "span" );
span_fav.setAttribute( "title",PopupTitle_fav );  
span_fav.setAttribute( "fixdabsx","3");  
span_fav.setAttribute( "requireclick","off"); 
span_fav.setAttribute( "style","cursor:pointer");  
var a_fav = document.createElement( "a" );
a_fav.setAttribute( "href", "javascript:storePage()" );
var title_fav = document.createTextNode( Title_fav ) ;
a_fav.appendChild( title_fav ) ;
span_fav.appendChild( a_fav ) ;

var h5_fav = document.createElement( "h5" );
h5_fav.appendChild( span_fav ) ;

// * création de la liste de favoris *

var ul_fav = document.createElement( "ul" );
var pageList = getCookie("pageList");
var pageListTitle = getCookie("pageListTitle");
if (pageList != "" && pageList != null) {
        pSplit = pageList.split(";")
        for (a=0;a<pSplit.length;a++) {
                if (pSplit[a] != '' && pSplit[a] != 'null') {
                        if (pageListTitle != "" && pageListTitle != null) {
                                pSplitTitle = pageListTitle.split(";")
                                for (a=0;a<pSplitTitle.length;a++) {
                                        if (pSplitTitle[a] != '' && pSplitTitle[a] != 'null') {
 
                                               var li_fav = document.createElement( "li" );
                                               li_fav.setAttribute( "id", "t-whatlinkshere");
 
                                                var spanaCR_fav = document.createElement( "span" );
                                                spanaCR_fav.setAttribute( "title",  PopupRemove_fav + pSplitTitle[a] );  
                                                spanaCR_fav.setAttribute( "fixdabsx","3");  
                                                spanaCR_fav.setAttribute( "requireclick","off"); 
                                                spanaCR_fav.setAttribute( "style","cursor:pointer");  
                                                var aCR_fav = document.createElement( "a" );
                                                aCR_fav.setAttribute( "href", "javascript:removePage('" + pSplitTitle[a] + "')" );
                                                var smallR_fav = document.createElement( "small" );
                                                var font_fav = document.createElement( "font" );
                                                font_fav.setAttribute( "color", "red" );
                                                var textaCR_fav = document.createTextNode( "[-]");
                                                font_fav.appendChild( textaCR_fav );
                                                smallR_fav.appendChild( font_fav );
                                                aCR_fav.appendChild( smallR_fav );
                                                spanaCR_fav.appendChild( aCR_fav ) ;  
 
                                                var spanaC_fav = document.createElement( "span" );
                                                spanaC_fav.setAttribute( "title", "" + pSplitTitle[a] + "");  
                                                spanaC_fav.setAttribute( "fixdabsx","3");  
                                                spanaC_fav.setAttribute( "requireclick","off"); 
                                                spanaC_fav.setAttribute( "style","cursor:pointer"); 
                                                var aC_fav = document.createElement( "a" );
                                                aC_fav.setAttribute( "href", "" + Path_fav + pSplitTitle[a] +"");
                                                var smallT_fav = document.createElement( "small" ); 
                                                var textaC_fav = document.createTextNode( "" + pSplitTitle[a] + "") ;
                                                smallT_fav.appendChild( textaC_fav ) ;
                                                aC_fav.appendChild( smallT_fav );
                                                spanaC_fav.appendChild( aC_fav ) ;  
 
                                                li_fav.appendChild( spanaCR_fav );
                                                li_fav.appendChild( spanaC_fav );
                                                ul_fav.appendChild( li_fav );
                                        }
                                }
                        }
                }
        }
} else {
        var li_fav = document.createElement( "li" );
        var nofav_fav = document.createTextNode( NoFavorites_fav );
        li_fav.appendChild( nofav_fav );
        ul_fav.appendChild( li_fav );
}

// * insertion du panneau  *

        var div_fav = document.createElement( "div" );
        div_fav.setAttribute( "class", "pBody" );
        div_fav.appendChild( ul_fav ) ;
 
        var portlet_fav = document.createElement( "div" ) ;
        portlet_fav.setAttribute( "class", "portlet" );
        portlet_fav.setAttribute( "id", "p-fav" ) ;
        portlet_fav.appendChild( h5_fav ) ;
        portlet_fav.appendChild( div_fav ) ;

        div_ptb = document.getElementById( "p-search" );
        document.getElementById("column-one").insertBefore( portlet_fav, div_ptb)
}

// ** FONCTIONS SUBALTERNES **
 
// * Ajout d'une page à la liste *
 
function storePage(){
    thisPage = document.location.href;
    thisPageTitle = wgPageName;
    var pageList = getCookie("pageList");
    var pageListTitle = getCookie("pageListTitle");
    var linkFound = false;
    if (pageList != "" && pageList != null) {
        pSplit = pageList.split(";");
    for (a=0;a<pSplit.length;a++) {
                }
        }
    if (!linkFound) {
        if (pageList == null || pageList == ";") {
                pageList = thisPage;
                pageListTitle = thisPageTitle;
        } else {
                pageList += ";" + thisPage;
                pageListTitle += ";" + thisPageTitle;
        }
    }
    var now = new Date();
    var nextYear = new Date(now.getTime() + 1000 * 60 * 60 * 24 * 365 );
    setCookie("pageList",pageList,nextYear);
    setCookie("pageListTitle",pageListTitle,nextYear);
    window.location.reload();
}
 
// * Suppression d'une page de la liste *
 
function removePage(url){
    var pageListTitle = getCookie("pageListTitle");
    var linkList = ""
    if (pageListTitle != "" && pageListTitle != null) {
            pSplitTitle = pageListTitle.split(";");
            for (a=0;a<pSplitTitle.length;a++) {
                    if (pSplitTitle[a] != url && pSplitTitle[a] != '') linkList += ";" + pSplitTitle[a];
            }
    }
    var now = new Date();
    var nextYear = new Date(now.getTime() + 1000 * 60 * 60 * 24 * 365 );
    setCookie("pageList",linkList,nextYear);
    setCookie("pageListTitle",linkList,nextYear);
    window.location.reload();
}

// * Mise à jour du cookie *
 
function setCookie (cookieName, cookieValue, expires, path) {
    document.cookie = escape(cookieName) + '=' + escape(cookieValue) + (expires ? '; EXPIRES=' + expires.toGMTString() : '') + "; PATH=/" ; 
}
 
// * Interrogation du cookie *
 
function getCookie (cookieName) {
    var cookieValue = null;
    var posName = document.cookie.indexOf(escape(cookieName) + '=' );
    if (posName != -1) {
        var posValue = posName + (escape(cookieName) + '=' ).length;
        var endPos = document.cookie.indexOf(';', posValue) ;
        if (endPos != -1) {
            cookieValue = unescape(document.cookie.substring(posValue, endPos));
        } else {
            cookieValue = unescape(document.cookie.substring(posValue));
        }
    }
return cookieValue;
}

//******************************************************************************************************************************** FIN DU PANNEAU FAVORIS

//********************************************************************************************************************************  PANNEAU CATÉGORIES

function addCatPortlet(){

    var portlet = document.createElement( "div" ) ;
    portlet.setAttribute( "class", "portlet" );
    portlet.setAttribute( "id", "p-cat" ) ;
 
    var h5_cats = document.createElement( "h5" );
    var text = document.createTextNode( "Catégories" ) ;
    h5_cats.appendChild( text ) ;



    var catlinks = document.getElementById("catlinks");
    if (!catlinks) { 
        var div_cats = document.createElement( "div" );
        div_cats.setAttribute( "class", "pBody" );
        var ul_cats = document.createElement( "UL" );
        var li_nocats = document.createElement( "LI" );
        var text_nocats = document.createTextNode( "Aucune" );
        li_nocats.appendChild( text_nocats );
        ul_cats.appendChild( li_nocats );
        div_cats.appendChild( ul_cats ) ;
    } else {
        var div_cats = document.createElement( "div" );
        div_cats.setAttribute( "class", "pBody" );
        var ul_cats = document.createElement( "UL" );
        var categories = catlinks.getElementsByTagName("a") ;
        var a_debut = 1 ; // evitons le lien Categories:
        for (var i = a_debut ; i < categories.length ; i++ ) {
                var a = categories[i] ;
                var li_cats = document.createElement( "LI" ) ;
                li_cats.appendChild( a.cloneNode(1) ) ;
                ul_cats.appendChild( li_cats );
        }
        div_cats.appendChild( ul_cats ) ;
    } 

 

    portlet.appendChild( h5_cats ) ;
    portlet.appendChild( div_cats ) ;
 
    div_ptb = document.getElementById( "p-tb" );
    document.getElementById("column-one").insertBefore( portlet, div_ptb)

}

//********************************************************************************************************************************  FIN DU PANNEAU CATÉGORIES

//********************************************************************************************************************************  PANNEAU AUTRES PROJETS

function addProjectPortlet(){

    var list = document.createElement("LI");
    var newlist = document.createElement("UL");
    var newlinktext = document.createTextNode("Aucun");
    list.appendChild(newlinktext);
    newlist.appendChild(list);

    var interProject = document.createElement("DIV");
    interProject.className = "portlet" ;
    interProject.setAttribute( "id", "p-projects" );
    interProject.innerHTML = '<h5>Autres projets<\/h5><div class="pBody"><ul>'+newlist.innerHTML+'</ul></div>';
    $( interProject ).insertAfter( "#p-tb" );
}

//********************************************************************************************************************************  FIN DU PANNEAU AUTRES PROJETS

//********************************************************************************************************************************  PANNEAU AUTRES LANGUES (interwiki)

function addLangPortlet(){

    var dbx_lang = document.createElement( "div" );
    dbx_lang.setAttribute( "class", "portlet" );
    dbx_lang.setAttribute( "id", "p_lang" );

    var dbx_lang_h5 = document.createElement( "h5" );
    var dbx_lang_text = document.createTextNode( "Autres langues" );
    dbx_lang_h5.appendChild( dbx_lang_text );


    var dbx_lang_content = document.createElement( "div" );
    dbx_lang_content.setAttribute( "class", "pBody" );
    var dbx_lang_text_ul = document.createElement( "ul" );
    var dbx_lang_text_li = document.createElement( "li" );
    var dbx_lang_text_content = document.createTextNode( "Aucune" );
    dbx_lang_text_li.appendChild( dbx_lang_text_content );
    dbx_lang_text_ul.appendChild( dbx_lang_text_li );
    dbx_lang_content.appendChild( dbx_lang_text_ul );
    dbx_lang.appendChild( dbx_lang_h5 );
    dbx_lang.appendChild( dbx_lang_content );

    var column_div = document.getElementById( "column-one");
    column_div.appendChild( dbx_lang);
}

//********************************************************************************************************************************  FIN DU PANNEAU AUTRES LANGUES

//******************************************************************************************** DÉFINITION DES DBX-GROUP ( http://www.brothercake.com/site/resources/scripts/dbx/   script dbx-key.js)

window.onload = function()
{
	//initialise the docking boxes manager
	var manager = new dbxManager('main'); 	//session ID [/-_a-zA-Z0-9/]

	//create new docking boxes group
	var sidebox = new dbxGroup(
		'sidebox', 		// container ID [/-_a-zA-Z0-9/]
		'vertical', 		// orientation ['vertical'|'horizontal']
		'7', 			// drag threshold ['n' pixels]

///////////////////////////////////////////////////////// PARTIE PERSONNALISABLE ////////////////////////////////////////////////////////////////////////////

		'no',			                          // restrict drag movement to container axis ['yes'|'no']
		'10', 			                          // animate re-ordering [frames per transition, or '0' for no effect]
		'yes', 		              	                  // include open/close toggle buttons ['yes'|'no']
		'open', 		                          // default state ['open'|'closed']

		'ouvrir', 		                          // word for "open", as in "open this box"
		'fermer', 		                          // word for "close", as in "close this box"
		'Cliquer et glisser pour déplacer cette boite',   // sentence for "move this box" by mouse
		'Cliquer pour %toggle% cette boîte',              // pattern-match sentence for "(open|close) this box" by mouse
		'Déplacer cette boîte avec le clavier',           // sentence for "move this box" by keyboard
		', ou utiliser une touche pour la %toggle%',      // pattern-match sentence-fragment for "(open|close) this box" by keyboard

//////////////////////////////////////////////////////// FIN DE LA PARTIE PERSONNALISABLE ////////////////////////////////////////////////////////////////////

		'%mytitle%  [%dbxtitle%]' // pattern-match syntax for title-attribute conflicts
		);

};

//**********************************************************************************************  FIN DE LA DÉFINITION DES DBX-GROUP 

//**********************************************************************************************  FONCTION DRAG & DROP ( http://www.brothercake.com/site/resources/scripts/dbx/   script dbx.js)


// DBX2.05 :: Docking Boxes (dbx)
// *********************************************************************************************************************************************************
// DOM scripting by brothercake -- http://www.brothercake.com/
// GNU Lesser General Public License -- http://www.gnu.org/licenses/lgpl.html
//***********************************************************************************************************************************************************

var dbx;
function dbxManager(sid){
    dbx = this;
    if(!/^[-_a-z0-9]+$/i.test(sid)) { 
        alert('Error from dbxManager:\n"' + sid + '" is an invalid session ID');
        return; 
    }
    this.supported = !(document.getElementsByTagName('*').length == 0 || (navigator.vendor == 'KDE' && typeof window.sidebar == 'undefined'));
    if(!this.supported) { 
        return; 
    }
    this.etype = typeof document.addEventListener != 'undefined' ? 'addEventListener' : typeof document.attachEvent != 'undefined' ? 'attachEvent' : 'none';
    this.eprefix = (this.etype == 'attachEvent' ? 'on' : '');
    if(typeof window.opera != 'undefined' && parseFloat(navigator.userAgent.toLowerCase().split(/opera[\/ ]/)[1].split(' ')[0], 10) < 7.5){
        this.etype = 'none';
    }
    if(this.etype == 'none') { 
        this.supported = false;
        return;
    }
    this.running = 0;
    this.sid = sid;
    this.savedata = {};
    this.cookiestate = this.getCookieState();
};

dbxManager.prototype.setCookieState = function(){ ////////////////////////////////////////////////////////////////////////// SET COOKIE
    var now = new Date();
    now.setTime(now.getTime() + (365*24*60*60*1000));
    var str = '';
    for(j in this.savedata){
        if(typeof this.savedata[j]!='function'){
            str += j + '=' + this.savedata[j] + '&'
        }
    }
    this.state = str.replace(/^(.+)&$/, '$1');
    this.cookiestring = this.state.replace(/,/g, '|');
    this.cookiestring = this.cookiestring.replace(/=/g, ':');
    if(typeof this.onstatechange == 'undefined' || this.onstatechange()){
        document.cookie = 'dbx-' + this.sid + '=' + this.cookiestring + '; EXPIRES=' + now.toGMTString() + '; PATH=/';
    }
};

dbxManager.prototype.getCookieState = function(){ ////////////////////////////////////////////////////////////////////////// GET COOKIE
    this.cookiestate = null;
    if(document.cookie){
        if(document.cookie.indexOf('dbx-' + this.sid)!=-1){
            this.cookie = document.cookie.split('dbx-' + this.sid + '=')[1].split(';')[0].split('&');
            for(var i in this.cookie){
                if(typeof this.cookie[i]!='function'){
                    this.cookie[i] = this.cookie[i].replace(/\|/g, ',');
                    this.cookie[i]= this.cookie[i].replace(/:/g, '=');
                    this.cookie[i] = this.cookie[i].split('=');
                    this.cookie[i][1] = this.cookie[i][1].split(',');
                }
            }
            this.cookiestate = {};
            for(i in this.cookie){
                if(typeof this.cookie[i]!='function'){
                    this.cookiestate[this.cookie[i][0]] = this.cookie[i][1];
                }
            }
        }
    }
return this.cookiestate;
};

dbxManager.prototype.addDataMember = function(gid, order){
    this.savedata[gid] = order;
};

dbxManager.prototype.createElement = function(tag){
    return typeof document.createElementNS != 'undefined' ? document.createElementNS('http://www.w3.org/1999/xhtml', tag) : document.createElement(tag);
};

dbxManager.prototype.getTarget = function(e, pattern, node){
    if(typeof node != 'undefined'){
        var target = node;
    }else{
        target = typeof e.target != 'undefined' ? e.target : e.srcElement;
    }
    var regex = new RegExp(pattern, '');
    while(!regex.test(target.className)){
        target = target.parentNode;
    }
    return target;
};

function dbxGroup(gid, dir, thresh, fix, ani, togs, def, open, close, move, toggle, kmove, ktoggle, syntax){
    if(!/^[-_a-z0-9]+$/i.test(gid)) { 
        alert('Error from dbxGroup:\n"' + gid + '" is an invalid container ID'); return; 
    }
    this.container = document.getElementById(gid);
    if(this.container == null || !dbx.supported) {
        return; 
    }
    var self = this;
    this.gid = gid;
    this.dragok = false;
    this.box = null;
    this.vertical = dir == 'vertical';
    this.threshold = parseInt(thresh, 10);
    this.restrict = fix == 'yes';
    this.resolution = parseInt(ani, 10);
    this.toggles = togs == 'yes';
    this.defopen = def != 'closed';
    this.vocab = {'open' : open,'close' : close,'move' : move,'toggle' : toggle,'kmove' : kmove,'ktoggle' : ktoggle,'syntax' : syntax};
    this.container.style.position = 'relative';this.container.style.display = 'block';
    if(typeof window.opera != 'undefined'){
        this.container.style.display = 'run-in';
    }
    this.boxes = [];this.buttons = [];this.order = [];this.eles = this.container.getElementsByTagName('*');
    for(var i=0; i<this.eles.length; i++){
        if(/dbx\-box/i.test(this.eles[i].className) && !/dbx\-dummy/i.test(this.eles[i].className)){
            this.eles[i].style.position = 'relative';
            this.eles[i].style.display = 'block';
            this.boxes.push(this.eles[i]);
            this.eles[i].className += ' dbx-box-open';
            this.eles[i].className += ' dbxid' + this.order.length;
            this.order.push(this.order.length.toString() + '+');
            this.eles[i][dbx.etype](dbx.eprefix + 'mousedown', function(e){
            if(!e) { e = window.event; }
            self.mousedown(e, dbx.getTarget(e, 'dbx\-box'));
            }, false);
        }
        if(/dbx\-handle/i.test(this.eles[i].className)){
        this.eles[i].style.position = 'relative';
        this.eles[i].style.display = 'block';
        this.eles[i].className += ' dbx-handle-cursor';
        this.eles[i].setAttribute('title', this.eles[i].getAttribute('title') == null || this.eles[i].title == '' ? this.vocab.move : this.vocab.syntax.replace('%mytitle%', this.eles[i].title).replace('%dbxtitle%', this.vocab.move));
        if(this.toggles){
            this.buttons.push(this.addToggleBehavior(this.eles[i]));
        }else{
            this.eles[i][dbx.etype](dbx.eprefix + 'key' + (typeof document.uniqueID != 'undefined' || navigator.vendor == 'Apple Computer, Inc.' ? 'down' : 'press'), function(e){
            if(!e) {
                e = window.event; }return self.keypress(e, dbx.getTarget(e, 'dbx\-handle'));
            }, false);
            this.eles[i][dbx.etype](dbx.eprefix + 'focus', function(e){
            if(!e) {
                e = window.event; 
            }
            self.createTooltip(null, dbx.getTarget(e, 'dbx\-handle'));
            }, false);
            this.eles[i][dbx.etype](dbx.eprefix + 'blur', function(){self.removeTooltip();}, false);
        }
    }
}

dbx.addDataMember(this.gid, this.order.join(','));
    var dummy = this.container.appendChild(dbx.createElement('span'));
    dummy.className = 'dbx-box dbx-dummy';
    dummy.style.display = 'block';
    dummy.style.width = '0';dummy.style.height = '0';
    dummy.style.overflow = 'hidden';
    if(this.vertical) {
        dummy.className += ' dbx-offdummy'; 
    }
    this.boxes.push(dummy);
    if(dbx.cookiestate != null && typeof dbx.cookiestate[this.gid] != 'undefined'){
        var num = dbx.cookiestate[this.gid].length;
            if(num == this.boxes.length - 1){
                for(i=0; i<num; i++){
                    var index = parseInt(dbx.cookiestate[this.gid][i], 10);
                    this.container.insertBefore(this.boxes[index], dummy);
                    if(this.toggles && /\-$/.test(dbx.cookiestate[this.gid][i])){
                        this.toggleBoxState(this.buttons[index], false);
                    }
                }
                this.getBoxOrder();
            }
        }else if(!this.defopen && this.toggles){
        var len = this.buttons.length;
        for(i=0; i<len; i++){
            this.toggleBoxState(this.buttons[i], true);
        }
    }

    document[dbx.etype](dbx.eprefix + 'mouseout', function(e){
        if(typeof e.target == 'undefined') { 
            e = window.event; e.relatedTarget = e.toElement;
        }
        if(e.relatedTarget == null){
        self.mouseup(e);
        }
    }, false);

    document[dbx.etype](dbx.eprefix + 'mousemove', function(e){
        self.mousemove(e);
        return !self.dragok;
    }, false);
    document[dbx.etype](dbx.eprefix + 'mouseup', function(e){
        self.mouseup(e);
    }, false);
    this.keydown = false;
    document[dbx.etype](dbx.eprefix + 'keydown', function(){
        self.keydown = true;
    }, false);
    document[dbx.etype](dbx.eprefix + 'keyup', function(){
    self.keydown = false;
    }, false);
};

dbxGroup.prototype.addToggleBehavior = function(){
    var self = this;
    var button = arguments[0].appendChild(dbx.createElement('a'));
    button.appendChild(document.createTextNode('\u00a0'));
    button.style.cursor = 'pointer';
    button.href = 'javascript:void(null)';
    button.className = 'dbx-toggle dbx-toggle-open';
    button.setAttribute('title', this.vocab.toggle.replace('%toggle%', this.vocab.close));
    button.hasfocus = typeof window.opera != 'undefined' || navigator.vendor == 'Apple Computer, Inc.' ? null : false;
    this.tooltip = null;
    button.onclick = function(){
        if(this.hasfocus === true || this.hasfocus === null){
            self.removeTooltip();
            self.toggleBoxState(this, true);
        }
    };
    button['onkey' + (typeof document.uniqueID != 'undefined' || navigator.vendor == 'Apple Computer, Inc.' ? 'down' : 'press')] = function(e){
        if(!e) {
            e = window.event;
        }
        return self.keypress(e, this);
    };
    button.onfocus = function(){
    var len = self.buttons.length;
    for(var i=0; i<len; i++){
        self.buttons[i].className = self.buttons[i].className.replace(/[ ](dbx\-toggle\-hilite\-)(open|closed)/, '');
    }
    var isopen = (/dbx\-toggle\-open/.test(this.className));
    this.className += ' dbx-toggle-hilite-' + (isopen ? 'open' : 'closed');
    self.createTooltip(isopen, this);
    this.isactive = true;
    if(this.hasfocus !== null) {
        this.hasfocus = true; 
    }
};

button.onblur = function(){
    this.className = this.className.replace(/[ ](dbx\-toggle\-hilite\-)(open|closed)/, '');
    self.removeTooltip();
    if(this.hasfocus !== null) {
        this.hasfocus = false; 
    }
};
return button;};

dbxGroup.prototype.toggleBoxState = function(button, regen){
    var isopen = (/dbx\-toggle\-open/.test(button.className));
    var parent = dbx.getTarget(null, 'dbx\-box', button);dbx.box = parent;dbx.toggle = button;
    if(typeof dbx.container == 'undefined'){
        dbx.group = dbx.getTarget(null, 'dbx\-group', parent);
    }
    else { 
    dbx.group = dbx.container;
    }
    if((!isopen && (typeof dbx.onboxopen == 'undefined' || dbx.onboxopen()))||(isopen && (typeof dbx.onboxclose == 'undefined' || dbx.onboxclose()))){
        button.className = 'dbx-toggle dbx-toggle-' + (isopen ? 'closed' : 'open');
        button.title = this.vocab.toggle.replace('%toggle%', isopen ? this.vocab.open : this.vocab.close);
        if(typeof button.isactive != 'undefined'){
            button.className += ' dbx-toggle-hilite-' + (isopen ? 'closed' : 'open')
        }
        parent.className = parent.className.replace(/[ ](dbx-box-)(open|closed)/, ' $1' + (isopen ? 'closed' : 'open'));
        if(regen) {
            this.getBoxOrder(); 
        }
    }
};

dbxGroup.prototype.shiftBoxPosition = function(e, anchor, positive){
    var parent = dbx.getTarget(null, 'dbx\-box', anchor);
    dbx.group = this.container;
    dbx.box = parent;dbx.event = e;
    if(typeof dbx.onboxdrag == 'undefined' || dbx.onboxdrag()){
        var positions = [];
        var len = this.boxes.length;
        for(var i=0; i<len; i++){
            positions[i] = [i, this.boxes[i][this.vertical ? 'offsetTop' : 'offsetLeft']];
            if(parent == this.boxes[i]) {
                this.idref = i; 
            }
        }
        positions.sort(this.compare);
        for(i=0; i<len; i++){
            if(positions[i][0] == this.idref){
                if((positive && i < len - 2) || (!positive && i > 0)){
                    var sibling = this.boxes[positions[i + (positive ? 1 : -1)][0]];
                    if(this.resolution > 0){
                        var visipos = { 'x' : parent.offsetLeft, 'y' : parent.offsetTop };
                        var siblingpos = { 'x' : sibling.offsetLeft, 'y' : sibling.offsetTop };
                    }
                    var obj = { 'insert' : (positive ? sibling : parent), 'before' : (positive ? parent : sibling) 
                };
                this.container.insertBefore(obj.insert, obj.before);
                if(this.resolution > 0){
                    var animators ={'sibling' : new dbxAnimator(this, sibling, siblingpos, this.resolution, true, anchor),'parent' : new dbxAnimator(this, parent, visipos, this.resolution, true, anchor)};
                }else{
                    anchor.focus();}break;
                }
            }
        }
        this.getBoxOrder();
    }
};

dbxGroup.prototype.compare = function(a, b){return a[1] - b[1];
};

dbxGroup.prototype.createTooltip = function(isopen, anchor){
    if(this.keydown){
        this.tooltip = this.container.appendChild(dbx.createElement('span'));
        this.tooltip.style.visibility = 'hidden';
        this.tooltip.className = 'dbx-tooltip';
        if(isopen != null){
            this.tooltip.appendChild(document.createTextNode(this.vocab.kmove + this.vocab.ktoggle.replace('%toggle%', isopen ? this.vocab.close : this.vocab.open)));
        }else{
            this.tooltip.appendChild(document.createTextNode(this.vocab.kmove));
        }
        var parent = dbx.getTarget(null, 'dbx\-box', anchor);
        this.tooltip.style.left = parent.offsetLeft + 'px';
        this.tooltip.style.top = parent.offsetTop + 'px';
        var tooltip = this.tooltip;window.setTimeout(function(){
            if(tooltip != null) {
                tooltip.style.visibility = 'visible';
            }
        }, 500);
    }
};

dbxGroup.prototype.removeTooltip = function(){
    if(this.tooltip != null){
        this.tooltip.parentNode.removeChild(this.tooltip);
        this.tooltip = null;
    }
};

dbxGroup.prototype.mousedown = function(e, box){
    var node = typeof e.target != 'undefined' ? e.target : e.srcElement;
    if(node.nodeName == '#text') {
        node = node.parentNode; 
    }
    if(!/dbx\-(toggle|box|group)/i.test(node.className)){
        while(!/dbx\-(handle|box|group)/i.test(node.className)){
            node = node.parentNode;
        }
    }
    if(/dbx\-handle/i.test(node.className)){
        this.removeTooltip();this.released = false;
        this.initial = { 'x' : e.clientX, 'y' : e.clientY };
        this.current = { 'x' : 0, 'y' : 0 };
        this.createCloneBox(box);
        if(typeof e.preventDefault != 'undefined' ) {
            e.preventDefault(); 
        }
        if(typeof document.onselectstart != 'undefined'){
            document.onselectstart = function() { 
                return false; 
            }
        }
    }
};

dbxGroup.prototype.mousemove = function(e){
    if(this.dragok && this.box != null){
        this.positive = this.vertical ? (e.clientY > this.current.y ? true : false) : (e.clientX > this.current.x ? true : false);
        this.current = { 'x' : e.clientX, 'y' : e.clientY };
        var overall = { 'x' : this.current.x - this.initial.x, 'y' : this.current.y - this.initial.y };
        if(((overall.x >= 0 && overall.x <= this.threshold) || (overall.x <= 0 && overall.x >= 0 - this.threshold))&&((overall.y >= 0 && overall.y <= this.threshold) || (overall.y <= 0 && overall.y >= 0 - this.threshold))){
            this.current.x -= overall.x;this.current.y -= overall.y;
        }
        if(this.released || overall.x > this.threshold || overall.x < (0 - this.threshold) || overall.y > this.threshold || overall.y < (0 - this.threshold)){
            dbx.group = this.container;
            dbx.box = this.box;
            dbx.event = e;
            if(typeof dbx.onboxdrag == 'undefined' || dbx.onboxdrag()){
                this.released = true;
                if(!this.restrict || !this.vertical) {
                    this.boxclone.style.left = (this.current.x - this.difference.x) + 'px'; 
                }
                if(!this.restrict || this.vertical) {
                    this.boxclone.style.top = (this.current.y - this.difference.y) + 'px'; 
                }
                this.moveOriginalToPosition(this.current.x, this.current.y);
                if(typeof e.preventDefault != 'undefined' ) { 
                    e.preventDefault(); 
                }
            }
        }
    }
    return true;
};

dbxGroup.prototype.mouseup = function(e){
    if(this.box != null){
        this.moveOriginalToPosition(e.clientX, e.clientY);
        this.removeCloneBox();
        this.getBoxOrder();
        if(typeof document.onselectstart != 'undefined'){
            document.onselectstart = function() { 
                return true; 
            }
        }
    }
    this.dragok = false;
};

dbxGroup.prototype.keypress = function(e, anchor){
    if(/^(3[7-9])|(40)$/.test(e.keyCode)){
    this.removeTooltip();
        if((this.vertical && /^(38|40)$/.test(e.keyCode)) || (!this.vertical && /^(37|39)$/.test(e.keyCode))){
        this.shiftBoxPosition(e, anchor, /^[3][78]$/.test(e.keyCode) ? false : true);
            if(typeof e.preventDefault != 'undefined') {
                e.preventDefault();
            }else {
                return false; 
            }
            typeof e.stopPropagation != 'undefined' ? e.stopPropagation() : e.cancelBubble = true;this.keydown = false;
        }
    }
    return true;
};

dbxGroup.prototype.getBoxOrder = function(){
    this.order = [];
    var len = this.eles.length;
    for(var j=0; j<len; j++){
        if(/dbx\-box/i.test(this.eles[j].className) && !/dbx\-(clone|dummy)/i.test(this.eles[j].className)){
            this.order.push(this.eles[j].className.split('dbxid')[1] + (/dbx\-box\-open/i.test(this.eles[j].className) ? '+' : '-'));
        }
    }
    dbx.savedata[this.gid] = this.order.join(',');
    dbx.setCookieState();
};

dbxGroup.prototype.createClone = function(){
    var clone = this.container.appendChild(arguments[0].cloneNode(true));
    clone.className += ' dbx-clone';
    clone.style.position = 'absolute';
    clone.style.visibility = 'hidden';
    clone.style.zIndex = arguments[1];
    clone.style.left = arguments[2].x + 'px';
    clone.style.top = arguments[2].y + 'px';
    clone.style.width = arguments[0].offsetWidth + 'px';
    clone.style.height = arguments[0].offsetHeight + 'px';
    return clone;
};

dbxGroup.prototype.createCloneBox = function(box){
    this.box = box;
    this.position = { 'x' : this.box.offsetLeft, 'y' : this.box.offsetTop };
    this.difference = { 'x' : (this.initial.x - this.position.x), 'y' : (this.initial.y - this.position.y) };
    this.boxclone = this.createClone(this.box, 30000, this.position);
    this.boxclone.style.cursor = 'move';
    this.dragok = true;
};

dbxGroup.prototype.removeCloneBox = function(){
    this.container.removeChild(this.boxclone);
    this.box.style.visibility = 'visible';
    this.box = null;
};

dbxGroup.prototype.moveOriginalToPosition = function(clientX, clientY){
    var cloneprops = {'xy' : this.vertical ? clientY - this.difference.y : clientX - this.difference.x,'wh' : this.vertical ? this.boxclone.offsetHeight : this.boxclone.offsetWidth};
    this.box.style.visibility = 'hidden';
    this.boxclone.style.visibility = 'visible';
    var len = this.boxes.length;
    for(var i=0; i<len; i++){
        var boxprops = {'xy' : this.vertical ? this.boxes[i].offsetTop : this.boxes[i].offsetLeft,'wh' : this.vertical ? this.boxes[i].offsetHeight : this.boxes[i].offsetWidth};
        if((this.positive && cloneprops.xy + cloneprops.wh > boxprops.xy && cloneprops.xy < boxprops.xy)||(!this.positive && cloneprops.xy < boxprops.xy && cloneprops.xy + cloneprops.wh > boxprops.xy)){
            if(this.boxes[i] == this.box) { 
                return; 
            }
            var sibling = this.box.nextSibling;
            while(sibling.className == null || !/dbx\-box/.test(sibling.className)){
                sibling = sibling.nextSibling;
            }
            if(this.boxes[i] == sibling) {
                return; 
            }
            if(this.resolution > 0){
                if(this.box[this.vertical ? 'offsetTop' : 'offsetLeft'] < boxprops.xy){
                    var visibox = this.boxes[i].previousSibling;
                    while(visibox.className == null || !/dbx\-box/.test(visibox.className)){
                        visibox = visibox.previousSibling;
                    }
                }else{
                    visibox = this.boxes[i];
                }
                var visipos = { 'x' : visibox.offsetLeft, 'y' : visibox.offsetTop };
            }
            var prepos = { 'x' : this.box.offsetLeft, 'y' : this.box.offsetTop };
            this.container.insertBefore(this.box, this.boxes[i]);
            this.initial.x += (this.box.offsetLeft - prepos.x);
                this.initial.y += (this.box.offsetTop - prepos.y);
            if(this.resolution > 0 && visibox != this.box){
                var animator = new dbxAnimator(this, visibox, visipos, this.resolution, false, null);
            }else{
            }
            break;
        }
    }
};

function dbxAnimator(caller, box, pos, res, kbd, anchor){
    this.caller = caller;
    this.box = box;
    this.timer = null;
    var before = pos[this.caller.vertical ? 'y' : 'x'];
    var after = this.box[this.caller.vertical ? 'offsetTop' : 'offsetLeft'];
    if(before != after){
        if(dbx.running > this.caller.boxes.length - 1) { 
            return;
        }
        var clone = this.caller.createClone(this.box, 29999, arguments[2]);
        clone.style.visibility = 'visible';
        this.box.style.visibility = 'hidden';
        this.animateClone(clone,before,after > before ? after - before : 0 - (before - after),this.caller.vertical ? 'top' : 'left',res,kbd,anchor);
    }
};

dbxAnimator.prototype.animateClone = function(clone, current, change, dir, res, kbd, anchor){
    var self = this;
    var count = 0;
    dbx.running ++;
    this.timer = window.setInterval(function(){
        count ++;
        current += change / res;
        clone.style[dir] = current + 'px';
        if(count == res){
            window.clearTimeout(self.timer);
            self.timer = null;
            dbx.running --;
            self.caller.container.removeChild(clone);
            self.box.style.visibility = 'visible';
            if(kbd){
                if(anchor != null && anchor.parentNode.style.visibility != 'hidden'){
                    anchor.focus();
                }else if(self.caller.toggles){
                    var button = self.caller.buttons[parseInt(self.box.className.split('dbxid')[1],10)];
                    if(button != null && typeof button.isactive != 'undefined'){
                        button.focus();
                    }
                }
            }
        }
    }, 20);
};

if(typeof window.attachEvent != 'undefined'){
    window.attachEvent('onunload', function(){
        var ev = ['mousedown', 'mousemove', 'mouseup', 'mouseout', 'click', 'keydown', 'keyup', 'focus', 'blur', 'selectstart', 'statechange', 'boxdrag', 'boxopen', 'boxclose'];
        var el = ev.length;var dl = document.all.length;
        for(var i=0; i<dl; i++){
            for(var j=0; j<el; j++){
                document.all[i]['on' + ev[j]] = null;
            }
        }
    });
}
</syntaxhighlight>
|}
{{Boîte déroulante fin}}
{{Boîte déroulante début|titre=Code source version Vector}}
<syntaxhighlight lang=javascript line>
/********************************************************************************
 * Libère les panneaux de la barre de navigation gauche                         *
 *                                                                              *
 * à appeler après tous les scripts créant des nouveaux panneaux                *
 *                                                                              *
 * Documentation : [[Discussion utilisateur:Dr Brains/MagicSidebox.js]]         *
 *                                                                              *
 *  Remplace :                                                                  *
 * * MediaWiki:Gadget-CatsaGauche.js                                            *
 * * Utilisateur:Dr Brains/favoris.js                                           *
 *                                                                              *
 * Fonctionne avec  :                                                           *
 * * Firefox 3.5                                                                *
 * * Google Chrome 3                                                            *
 *                                                                              *
 * Ne fonctionne pas avec :                                                     *
 * * Internet Explorer 7                                                        *
 * * Opera 10                                                                   *
 *                                                                              *
 * Habillage Vector uniquement                                                  *
 *                                                                              *
 * Basé sur le script Docking Boxes version 2.05 (voir plus bas)                *
 *  http://www.brothercake.com/site/resources/scripts/dbx/                      *
 *                                                                              *
 *  [[Catégorie:MediaWiki:Fonction Monobook en JavaScript]]  <nowiki>           *
 ********************************************************************************/

//********************************************************************************************************************************  FONCTION PRINCIPALE
 


////////////////////////////////////////////////////////////////////// PARTIE PERSONNALISABLE /////////////////////////////////////////////////////////////////////////////

var DisplayLogoPortlet = true;                     // Affichage (ou pas) du logo

var DisplayFavoritesPortlet = true;                // Affichage (ou pas) des favoris

var DisplayNavigationPortlet = true;               // Affichage (ou pas) de la boîte "Navigation"

var DisplayContribuerPortlet = true;               // Affichage (ou pas) de la boîte "Contribuer"

var DisplayBookPortlet = true;                     // Affichage (ou pas) de la boîte "Créer un livre"

var DisplayCategoriesPortlet = true;               // Affichage (ou pas) de la boîte "Catégories"

var DisplayToolboxPortlet = true;                  // Affichage (ou pas) de la boîte à outils

var DisplayLangPortlet = true;                     // Affichage (ou pas) des interwikis

////////////////////////////////////////////////////////////////////// PARTIE PERSONNALISABLE /////////////////////////////////////////////////////////////////////////////


function MagicSidebar(){

// Boîtes additionnelles

    var fav_TEST = document.getElementById("p-fav");
    if(!fav_TEST){addFavoritesPortlet();}

    var cat_TEST = document.getElementById("p-cat");
    if(!cat_TEST){addCatPortlet();}

    var lang_TEST = document.getElementById("p-lang");
    if (!lang_TEST){
        addLangPortlet();
    }

// Préférences

    if( DisplayLogoPortlet == false){                     // Affichage (ou pas) du logo
        var RemoveDbx = document.getElementById("p-logo");
        document=document.getElementById("panel").removeChild(RemoveDbx);
    } 
    if( DisplayFavoritesPortlet == false){                   // Affichage (ou pas) de la boîte "favoris"
        var RemoveDbx = document.getElementById("p-fav");
        document=document.getElementById("panel").removeChild(RemoveDbx);  
    }   
    if( DisplayNavigationPortlet == false){                // Affichage (ou pas) de la boîte "Navigation"
        var RemoveDbx = document.getElementById("p-navigation");
        document=document.getElementById("panel").removeChild(RemoveDbx);       
    }
    if( DisplayContribuerPortlet == false){                // Affichage (ou pas) de la boîte "Contribuer"
        var RemoveDbx = document.getElementById("p-Contribuer");
        document=document.getElementById("panel").removeChild(RemoveDbx);      
    }
    if( DisplayBookPortlet == false){                      // Affichage (ou pas) de la boîte "Créer un livre"
        var RemoveDbx = document.getElementById("p-coll_-create_a_book");
        document=document.getElementById("panel").removeChild(RemoveDbx);       
    }
    if( DisplayCategoriesPortlet == false){                   // Affichage (ou pas) de la boîte "Catégories"
        var RemoveDbx = document.getElementById("p-cat");
        document=document.getElementById("panel").removeChild(RemoveDbx);       
    }
    if( DisplayToolboxPortlet == false){                   // Affichage (ou pas) de la boîte à outils
        var RemoveDbx = document.getElementById("p-tb");
        document=document.getElementById("panel").removeChild(RemoveDbx);       
    }
    if( DisplayLangPortlet == false){                     // Affichage (ou pas) des interwikis
        var RemoveDbx = document.getElementById("p-lang");
        document=document.getElementById("panel").removeChild(RemoveDbx);     
    }

// Style 

document.write('<style type="text/css">'
+'.dbx-clone {position:absolute;visibility:hidden;}'
+'.dbx-clone, .dbx-clone .dbx-handle-cursor {cursor:move !important;}'
+'.dbx-dummy {display:block;width:0;height:0;overflow:hidden;border:0px;}'
+'.dbx-group, .dbx-box, .dbx-handle {position:relative;display:block;}'
+'.dbx-box {margin-bottom:10px;margin-left:0.2em;padding:0;border:1px solid #595f66;overflow:hidden;width:11.9em;font-size:80%;}'
+'#panel-outer {position:absolute !important;top:0;left:0;}'
+'.dbx-group {}'
+'* html .dbx-group {width:170px;padding-bottom:0;}'
+'.dbx-handle {background: #f2f3f4;border-bottom:1px solid #f2f3f4;margin: 0px;padding: 0px 0 1px 0;}'
+'div.dbx-handle h5 {background: transparent url(/media/wikipedia/commons/0/09/Tile_sub.gif);border-bottom: 1px solid #595F66;color: #595f66; font-size: 10px;font-weight: bold; letter-spacing: 1px;margin: 0; padding: 5px;}'	
+'* html .dbx-handle { width:150px; }'
+'.dbx-handle-cursor {cursor:move;}'
+'a.dbx-toggle, a.dbx-toggle:visited {display:block;width:20px;height:15px;overflow:hidden;background:url(/media/wikipedia/commons/7/75/Toggle.gif) no-repeat;position:absolute;top:2px;right:3px;text-indent:-50px;text-decoration:none;}'
+'a.dbx-toggle-open, a.dbx-toggle-open:visited {background-position:0 0;}'
+'a.dbx-toggle-closed, a.dbx-toggle-closed:visited {background-position:0 -20px;}'
+'a.dbx-toggle-hilite-open, a.dbx-toggle-hilite-open:visited {background-position:-20px 0;}'
+'a.dbx-toggle-hilite-closed, a.dbx-toggle-hilite-closed:visited {background-position:-20px -20px;}'
+'.dbx-tooltip {display:block;position:absolute;margin:36px 0 0 125px;width:185px;border:1px solid #000;background:#ffd;color:#000;font:normal normal normal 0.85em tahoma, arial, sans-serif;padding:2px 4px 3px 5px;text-align:left;}'
+'* html .dbx-tooltip { width:195px; }'
+'*[class="dbx-tooltip"]:lang(en) {border-color:InfoText;background:InfoBackground;color:InfoText;font:small-caption;font-weight:normal;}'	
+'.dbx-content {padding:0 5px 10px 5px;background:#f2f3f4;border-top:1px solid #f2f3f4;margin:0px;font-size:85%;}'
+'.dbx-box-closed .dbx-content {display:block;height:10px;padding:0;overflow:hidden;}'
+'.dbx-box-closed .dbx-content * {display:none;}'
+'.dbx-clone {opacity:0.8;-khtml-opacity:0.8;}'
+'div.container13 {border:0px;margin-bottom:10px;}'
+'#p-logo {top: 0;left: 0;position: absolute;z-index: 3;height: 155px;width: 12em;border:none;overflow: visible;}'
+'</style>');

// Transformation

      var Column_div = document.getElementById("panel");
      Column_div.setAttribute("class", "dbx-group");
      Column_div.setAttribute("style", "position:absolute !important;top:0;left:0;");

    var logo_div = document.getElementById( "p-logo" );
    logo_div.setAttribute( "class", "portal" );


    var Panneaux_div = document.getElementsByTagName("div");
    for(i=0;i<Panneaux_div.length;i++){
        if ($(Panneaux_div[i]).hasClass( "portal" )){
            magicPortlets(Panneaux_div[i]); 
        }
    }
}
addOnloadHook(MagicSidebar);





//******************************************************************************************************************************** FIN DE LA FONCTION PRINCIPALE

//********************************************************************************************************************************  TRANSFORMATION DES PANNEAUX 

function magicPortlets(dbx_panneau){

    dbx_panneau.setAttribute("class","dbx-box");

    var dbx_handle_div = document.createElement( "div" );
    dbx_handle_div.setAttribute( "class", "dbx-handle" );

    var dbx_h5 = dbx_panneau.getElementsByTagName("h5");
    for(i=0;i<dbx_h5.length;i++){
        dbx_handle_div.appendChild( dbx_h5[i] );
        dbx_panneau.appendChild( dbx_handle_div); 
    }

    var pBodies = dbx_panneau.getElementsByTagName("div");
    for(i=0;i<pBodies.length;i++){
        if ($(pBodies[i]).hasClass( "body" )){
            $(pBodies[i]).removeClass( "body" )
            $(pBodies[i]).addClass("dbx-content")
            dbx_panneau.appendChild( pBodies[i]);
        }
    }
}


//********************************************************************************************************************************  FIN DE LA TRANSFORMATION DES PANNEAUX

//********************************************************************************************************************************  PANNEAU FAVORIS

function addFavoritesPortlet(){

/////////////////////////////// PARTIE PERSONNALISABLE //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

//////////////////////////////// POPUPS //////////

// popup titre //
var PopupTitle_fav = "Cliquer pour ajouter la page courante aux favoris" ; 

// popup aide (?) //
var PopupHelp_fav = "INFORMATION : Cette liste est stockée sur un cookie local. Si vous effacez vos cookies, cette liste disparaîtra." ;

// popup retrait [-] //
var PopupRemove_fav = "Cliquer pour retirer de la liste la page : " ;


//////////////////////////////// TEXTES ///////////

// titre de la boîte //
var Title_fav = "Ajouter aux favoris" ; 

// texte de la boîte vide //
var NoFavorites_fav = "Vous n'avez pas de favoris." ; 
	
/////////////////////////////// PARAMÈTRES /////////////////

// début de l'URL des liens //
var Path_fav = "http://fr.wikipedia.org/wiki/" ; 

// affichage de l'aide (icône (?) à droite du titre) //
var ShowHelp_fav = false; 

/////////////////////////////// FIN DE LA PARTIE PERSONNALISABLE //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////


// * création du titre du panneau *
 
var span_fav = document.createElement( "span" );
span_fav.setAttribute( "title",PopupTitle_fav );  
span_fav.setAttribute( "fixdabsx","3");  
span_fav.setAttribute( "requireclick","off"); 
span_fav.setAttribute( "style","cursor:pointer");  
var a_fav = document.createElement( "a" );
a_fav.setAttribute( "href", "javascript:storePage()" );
var title_fav = document.createTextNode( Title_fav ) ;
a_fav.appendChild( title_fav ) ;
span_fav.appendChild( a_fav ) ;

if (ShowHelp_fav == true){ 
        var spanhelp_fav = document.createElement( "span" );
        spanhelp_fav.setAttribute( "title", PopupHelp_fav );  
        spanhelp_fav.setAttribute( "fixdabsx","3");  
        spanhelp_fav.setAttribute( "requireclick","off"); 
        spanhelp_fav.setAttribute( "style","cursor:pointer"); 
        var help_fav = document.createTextNode( " (?)" ) ;
        spanhelp_fav.appendChild( help_fav ) ;
}

var h5_fav = document.createElement( "h5" );
h5_fav.appendChild( span_fav ) ;
if (ShowHelp_fav == true){ 
        h5_fav.appendChild( spanhelp_fav ) ; 
}

// * création de la liste de favoris *

var ul_fav = document.createElement( "ul" );
var pageList = getCookie("pageList");
var pageListTitle = getCookie("pageListTitle");
if (pageList != "" && pageList != null) {
        pSplit = pageList.split(";")
        for (a=0;a<pSplit.length;a++) {
                if (pSplit[a] != '' && pSplit[a] != 'null') {
                        if (pageListTitle != "" && pageListTitle != null) {
                                pSplitTitle = pageListTitle.split(";")
                                for (a=0;a<pSplitTitle.length;a++) {
                                        if (pSplitTitle[a] != '' && pSplitTitle[a] != 'null') {
 
                                               var li_fav = document.createElement( "li" );
                                               li_fav.setAttribute( "id", "t-whatlinkshere");
 
                                                var spanaCR_fav = document.createElement( "span" );
                                                spanaCR_fav.setAttribute( "title",  PopupRemove_fav + pSplitTitle[a] );  
                                                spanaCR_fav.setAttribute( "fixdabsx","3");  
                                                spanaCR_fav.setAttribute( "requireclick","off"); 
                                                spanaCR_fav.setAttribute( "style","cursor:pointer");  
                                                var aCR_fav = document.createElement( "a" );
                                                aCR_fav.setAttribute( "href", "javascript:removePage('" + pSplitTitle[a] + "')" );
                                                var smallR_fav = document.createElement( "small" );
                                                var font_fav = document.createElement( "font" );
                                                font_fav.setAttribute( "color", "red" );
                                                var textaCR_fav = document.createTextNode( "[-]");
                                                font_fav.appendChild( textaCR_fav );
                                                smallR_fav.appendChild( font_fav );
                                                aCR_fav.appendChild( smallR_fav );
                                                spanaCR_fav.appendChild( aCR_fav ) ;  
 
                                                var spanaC_fav = document.createElement( "span" );
                                                spanaC_fav.setAttribute( "title", "" + pSplitTitle[a] + "");  
                                                spanaC_fav.setAttribute( "fixdabsx","3");  
                                                spanaC_fav.setAttribute( "requireclick","off"); 
                                                spanaC_fav.setAttribute( "style","cursor:pointer"); 
                                                var aC_fav = document.createElement( "a" );
                                                aC_fav.setAttribute( "href", "" + Path_fav + pSplitTitle[a] +"");
                                                var smallT_fav = document.createElement( "small" ); 
                                                var textaC_fav = document.createTextNode( "" + pSplitTitle[a] + "") ;
                                                smallT_fav.appendChild( textaC_fav ) ;
                                                aC_fav.appendChild( smallT_fav );
                                                spanaC_fav.appendChild( aC_fav ) ;  
 
                                                li_fav.appendChild( spanaCR_fav );
                                                li_fav.appendChild( spanaC_fav );
                                                ul_fav.appendChild( li_fav );
                                        }
                                }
                        }
                }
        }
} else {
        var li_fav = document.createElement( "li" );
        var nofav_fav = document.createTextNode( NoFavorites_fav );
        li_fav.appendChild( nofav_fav );
        ul_fav.appendChild( li_fav );
}

// * insertion du panneau  *

        var div_fav = document.createElement( "div" );
        div_fav.setAttribute( "class", "body" );
        div_fav.appendChild( ul_fav ) ;
 
        var portlet_fav = document.createElement( "div" ) ;
        portlet_fav.setAttribute( "class", "portal" );
        portlet_fav.setAttribute( "id", "p-fav" ) ;
        portlet_fav.appendChild( h5_fav ) ;
        portlet_fav.appendChild( div_fav ) ;

        div_ptb = document.getElementById( "p-tb" );
        document.getElementById("panel").insertBefore( portlet_fav, div_ptb)
}

// ** FONCTIONS SUBALTERNES **
 
// * Ajout d'une page à la liste *
 
function storePage(){
    thisPage = document.location.href;
    thisPageTitle = wgPageName;
    var pageList = getCookie("pageList");
    var pageListTitle = getCookie("pageListTitle");
    var linkFound = false;
    if (pageList != "" && pageList != null) {
        pSplit = pageList.split(";");
    for (a=0;a<pSplit.length;a++) {
                }
        }
    if (!linkFound) {
        if (pageList == null || pageList == ";") {
                pageList = thisPage;
                pageListTitle = thisPageTitle;
        } else {
                pageList += ";" + thisPage;
                pageListTitle += ";" + thisPageTitle;
        }
    }
    var now = new Date();
    var nextYear = new Date(now.getTime() + 1000 * 60 * 60 * 24 * 365 );
    setCookie("pageList",pageList,nextYear);
    setCookie("pageListTitle",pageListTitle,nextYear);
    window.location.reload();
}
 
// * Suppression d'une page de la liste *
 
function removePage(url){
    var pageListTitle = getCookie("pageListTitle");
    var linkList = ""
    if (pageListTitle != "" && pageListTitle != null) {
            pSplitTitle = pageListTitle.split(";");
            for (a=0;a<pSplitTitle.length;a++) {
                    if (pSplitTitle[a] != url && pSplitTitle[a] != '') linkList += ";" + pSplitTitle[a];
            }
    }
    var now = new Date();
    var nextYear = new Date(now.getTime() + 1000 * 60 * 60 * 24 * 365 );
    setCookie("pageList",linkList,nextYear);
    setCookie("pageListTitle",linkList,nextYear);
    window.location.reload();
}

// * Mise à jour du cookie *
 
function setCookie (cookieName, cookieValue, expires, path) {
    document.cookie = escape(cookieName) + '=' + escape(cookieValue) + (expires ? '; EXPIRES=' + expires.toGMTString() : '') + "; PATH=/" ; 
}
 
// * Interrogation du cookie *
 
function getCookie (cookieName) {
    var cookieValue = null;
    var posName = document.cookie.indexOf(escape(cookieName) + '=' );
    if (posName != -1) {
        var posValue = posName + (escape(cookieName) + '=' ).length;
        var endPos = document.cookie.indexOf(';', posValue) ;
        if (endPos != -1) {
            cookieValue = unescape(document.cookie.substring(posValue, endPos));
        } else {
            cookieValue = unescape(document.cookie.substring(posValue));
        }
    }
return cookieValue;
}

//******************************************************************************************************************************** FIN DU PANNEAU FAVORIS

//********************************************************************************************************************************  PANNEAU CATÉGORIES

function addCatPortlet(){

    var portlet = document.createElement( "div" ) ;
    portlet.setAttribute( "class", "portal" );
    portlet.setAttribute( "id", "p-cat" ) ;
 
    var h5_cats = document.createElement( "h5" );
    var text = document.createTextNode( "Catégories" ) ;
    h5_cats.appendChild( text ) ;



    var catlinks = document.getElementById("catlinks");
    if (!catlinks) { 
        var div_cats = document.createElement( "div" );
        div_cats.setAttribute( "class", "body" );
        var ul_cats = document.createElement( "UL" );
        var li_nocats = document.createElement( "LI" );
        var text_nocats = document.createTextNode( "Aucune" );
        li_nocats.appendChild( text_nocats );
        ul_cats.appendChild( li_nocats );
        div_cats.appendChild( ul_cats ) ;
    } else {
        var div_cats = document.createElement( "div" );
        div_cats.setAttribute( "class", "body" );
        var ul_cats = document.createElement( "UL" );
        var categories = catlinks.getElementsByTagName("a") ;
        var a_debut = 1 ; // evitons le lien Categories:
        for (var i = a_debut ; i < categories.length ; i++ ) {
                var a = categories[i] ;
                var li_cats = document.createElement( "LI" ) ;
                li_cats.appendChild( a.cloneNode(1) ) ;
                ul_cats.appendChild( li_cats );
        }
        div_cats.appendChild( ul_cats ) ;
    } 

 

    portlet.appendChild( h5_cats ) ;
    portlet.appendChild( div_cats ) ;
 
    div_ptb = document.getElementById( "p-tb" );
    document.getElementById("panel").insertBefore( portlet, div_ptb)

}

//********************************************************************************************************************************  FIN DU PANNEAU CATÉGORIES

//********************************************************************************************************************************  PANNEAU AUTRES LANGUES (interwiki)

function addLangPortlet(){

    var dbx_lang = document.createElement( "div" );
    dbx_lang.setAttribute( "class", "portal" );
    dbx_lang.setAttribute( "id", "p_lang" );

    var dbx_lang_h5 = document.createElement( "h5" );
    var dbx_lang_text = document.createTextNode( "Autres langues" );
    dbx_lang_h5.appendChild( dbx_lang_text );


    var dbx_lang_content = document.createElement( "div" );
    dbx_lang_content.setAttribute( "class", "body" );
    var dbx_lang_text_ul = document.createElement( "ul" );
    var dbx_lang_text_li = document.createElement( "li" );
    var dbx_lang_text_content = document.createTextNode( "Aucune" );
    dbx_lang_text_li.appendChild( dbx_lang_text_content );
    dbx_lang_text_ul.appendChild( dbx_lang_text_li );
    dbx_lang_content.appendChild( dbx_lang_text_ul );
    dbx_lang.appendChild( dbx_lang_h5 );
    dbx_lang.appendChild( dbx_lang_content );

    var column_div = document.getElementById( "panel");
    column_div.appendChild( dbx_lang);
}

//********************************************************************************************************************************  FIN DU PANNEAU AUTRES LANGUES

//********************************************************************************************************************************  DÉFINITION DES DBX-GROUP ( http://www.brothercake.com/site/resources/scripts/dbx/   script dbx-key.js)

window.onload = function()
{
	//initialise the docking boxes manager
	var manager = new dbxManager('main'); 	//session ID [/-_a-zA-Z0-9/]

	//create new docking boxes group
	var panel= new dbxGroup(
		'panel', 		// container ID [/-_a-zA-Z0-9/]
		'vertical', 		// orientation ['vertical'|'horizontal']
		'7', 			// drag threshold ['n' pixels]
		'no',			// restrict drag movement to container axis ['yes'|'no']
		'10', 			// animate re-ordering [frames per transition, or '0' for no effect]
		'yes', 			// include open/close toggle buttons ['yes'|'no']
		'open', 		// default state ['open'|'closed']

		'ouvrir', 		// word for "open", as in "open this box"
		'fermer', 		// word for "close", as in "close this box"
		'Cliquer et glisser pour déplacer cette boite', // sentence for "move this box" by mouse
		'Cliquer pour %toggle% cette boîte', // pattern-match sentence for "(open|close) this box" by mouse
		'Déplacer cette boîte avec le clavier', // sentence for "move this box" by keyboard
		', ou utiliser une touche pour la %toggle%',  // pattern-match sentence-fragment for "(open|close) this box" by keyboard
		'%mytitle%  [%dbxtitle%]' // pattern-match syntax for title-attribute conflicts
		);

};

//********************************************************************************************************************************  FIN DE LA DÉFINITION DES DBX-GROUP 

//********************************************************************************************************************************  FONCTION DRAG & DROP ( http://www.brothercake.com/site/resources/scripts/dbx/   script dbx.js)


// DBX2.05 :: Docking Boxes (dbx)
// *********************************************************************************************************************************************************
// DOM scripting by brothercake -- http://www.brothercake.com/
// GNU Lesser General Public License -- http://www.gnu.org/licenses/lgpl.html
//***********************************************************************************************************************************************************

var dbx;
function dbxManager(sid){
    dbx = this;
    if(!/^[-_a-z0-9]+$/i.test(sid)) { 
        alert('Error from dbxManager:\n"' + sid + '" is an invalid session ID');
        return; 
    }
    this.supported = !(document.getElementsByTagName('*').length == 0 || (navigator.vendor == 'KDE' && typeof window.sidebar == 'undefined'));
    if(!this.supported) { 
        return; 
    }
    this.etype = typeof document.addEventListener != 'undefined' ? 'addEventListener' : typeof document.attachEvent != 'undefined' ? 'attachEvent' : 'none';
    this.eprefix = (this.etype == 'attachEvent' ? 'on' : '');
    if(typeof window.opera != 'undefined' && parseFloat(navigator.userAgent.toLowerCase().split(/opera[\/ ]/)[1].split(' ')[0], 10) < 7.5){
        this.etype = 'none';
    }
    if(this.etype == 'none') { 
        this.supported = false;
        return;
    }
    this.running = 0;
    this.sid = sid;
    this.savedata = {};
    this.cookiestate = this.getCookieState();
};

dbxManager.prototype.setCookieState = function(){ ////////////////////////////////////////////////////////////////////////// SET COOKIE
    var now = new Date();
    now.setTime(now.getTime() + (365*24*60*60*1000));
    var str = '';
    for(j in this.savedata){
        if(typeof this.savedata[j]!='function'){
            str += j + '=' + this.savedata[j] + '&'
        }
    }
    this.state = str.replace(/^(.+)&$/, '$1');
    this.cookiestring = this.state.replace(/,/g, '|');
    this.cookiestring = this.cookiestring.replace(/=/g, ':');
    if(typeof this.onstatechange == 'undefined' || this.onstatechange()){
        document.cookie = 'dbx-' + this.sid + '=' + this.cookiestring + '; EXPIRES=' + now.toGMTString() + '; PATH=/';
    }
};

dbxManager.prototype.getCookieState = function(){ ////////////////////////////////////////////////////////////////////////// GET COOKIE
    this.cookiestate = null;
    if(document.cookie){
        if(document.cookie.indexOf('dbx-' + this.sid)!=-1){
            this.cookie = document.cookie.split('dbx-' + this.sid + '=')[1].split(';')[0].split('&');
            for(var i in this.cookie){
                if(typeof this.cookie[i]!='function'){
                    this.cookie[i] = this.cookie[i].replace(/\|/g, ',');
                    this.cookie[i]= this.cookie[i].replace(/:/g, '=');
                    this.cookie[i] = this.cookie[i].split('=');
                    this.cookie[i][1] = this.cookie[i][1].split(',');
                }
            }
            this.cookiestate = {};
            for(i in this.cookie){
                if(typeof this.cookie[i]!='function'){
                    this.cookiestate[this.cookie[i][0]] = this.cookie[i][1];
                }
            }
        }
    }
return this.cookiestate;
};

dbxManager.prototype.addDataMember = function(gid, order){
    this.savedata[gid] = order;
};

dbxManager.prototype.createElement = function(tag){
    return typeof document.createElementNS != 'undefined' ? document.createElementNS('http://www.w3.org/1999/xhtml', tag) : document.createElement(tag);
};

dbxManager.prototype.getTarget = function(e, pattern, node){
    if(typeof node != 'undefined'){
        var target = node;
    }else{
        target = typeof e.target != 'undefined' ? e.target : e.srcElement;
    }
    var regex = new RegExp(pattern, '');
    while(!regex.test(target.className)){
        target = target.parentNode;
    }
    return target;
};

function dbxGroup(gid, dir, thresh, fix, ani, togs, def, open, close, move, toggle, kmove, ktoggle, syntax){
    if(!/^[-_a-z0-9]+$/i.test(gid)) { 
        alert('Error from dbxGroup:\n"' + gid + '" is an invalid container ID'); return; 
    }
    this.container = document.getElementById(gid);
    if(this.container == null || !dbx.supported) {
        return; 
    }
    var self = this;
    this.gid = gid;
    this.dragok = false;
    this.box = null;
    this.vertical = dir == 'vertical';
    this.threshold = parseInt(thresh, 10);
    this.restrict = fix == 'yes';
    this.resolution = parseInt(ani, 10);
    this.toggles = togs == 'yes';
    this.defopen = def != 'closed';
    this.vocab = {'open' : open,'close' : close,'move' : move,'toggle' : toggle,'kmove' : kmove,'ktoggle' : ktoggle,'syntax' : syntax};
    this.container.style.position = 'relative';this.container.style.display = 'block';
    if(typeof window.opera != 'undefined'){
        this.container.style.display = 'run-in';
    }
    this.boxes = [];this.buttons = [];this.order = [];this.eles = this.container.getElementsByTagName('*');
    for(var i=0; i<this.eles.length; i++){
        if(/dbx\-box/i.test(this.eles[i].className) && !/dbx\-dummy/i.test(this.eles[i].className)){
            this.eles[i].style.position = 'relative';
            this.eles[i].style.display = 'block';
            this.boxes.push(this.eles[i]);
            this.eles[i].className += ' dbx-box-open';
            this.eles[i].className += ' dbxid' + this.order.length;
            this.order.push(this.order.length.toString() + '+');
            this.eles[i][dbx.etype](dbx.eprefix + 'mousedown', function(e){
            if(!e) { e = window.event; }
            self.mousedown(e, dbx.getTarget(e, 'dbx\-box'));
            }, false);
        }
        if(/dbx\-handle/i.test(this.eles[i].className)){
        this.eles[i].style.position = 'relative';
        this.eles[i].style.display = 'block';
        this.eles[i].className += ' dbx-handle-cursor';
        this.eles[i].setAttribute('title', this.eles[i].getAttribute('title') == null || this.eles[i].title == '' ? this.vocab.move : this.vocab.syntax.replace('%mytitle%', this.eles[i].title).replace('%dbxtitle%', this.vocab.move));
        if(this.toggles){
            this.buttons.push(this.addToggleBehavior(this.eles[i]));
        }else{
            this.eles[i][dbx.etype](dbx.eprefix + 'key' + (typeof document.uniqueID != 'undefined' || navigator.vendor == 'Apple Computer, Inc.' ? 'down' : 'press'), function(e){
            if(!e) {
                e = window.event; }return self.keypress(e, dbx.getTarget(e, 'dbx\-handle'));
            }, false);
            this.eles[i][dbx.etype](dbx.eprefix + 'focus', function(e){
            if(!e) {
                e = window.event; 
            }
            self.createTooltip(null, dbx.getTarget(e, 'dbx\-handle'));
            }, false);
            this.eles[i][dbx.etype](dbx.eprefix + 'blur', function(){self.removeTooltip();}, false);
        }
    }
}

dbx.addDataMember(this.gid, this.order.join(','));
    var dummy = this.container.appendChild(dbx.createElement('span'));
    dummy.className = 'dbx-box dbx-dummy';
    dummy.style.display = 'block';
    dummy.style.width = '0';dummy.style.height = '0';
    dummy.style.overflow = 'hidden';
    if(this.vertical) {
        dummy.className += ' dbx-offdummy'; 
    }
    this.boxes.push(dummy);
    if(dbx.cookiestate != null && typeof dbx.cookiestate[this.gid] != 'undefined'){
        var num = dbx.cookiestate[this.gid].length;
            if(num == this.boxes.length - 1){
                for(i=0; i<num; i++){
                    var index = parseInt(dbx.cookiestate[this.gid][i], 10);
                    this.container.insertBefore(this.boxes[index], dummy);
                    if(this.toggles && /\-$/.test(dbx.cookiestate[this.gid][i])){
                        this.toggleBoxState(this.buttons[index], false);
                    }
                }
                this.getBoxOrder();
            }
        }else if(!this.defopen && this.toggles){
        var len = this.buttons.length;
        for(i=0; i<len; i++){
            this.toggleBoxState(this.buttons[i], true);
        }
    }

    document[dbx.etype](dbx.eprefix + 'mouseout', function(e){
        if(typeof e.target == 'undefined') { 
            e = window.event; e.relatedTarget = e.toElement;
        }
        if(e.relatedTarget == null){
        self.mouseup(e);
        }
    }, false);

    document[dbx.etype](dbx.eprefix + 'mousemove', function(e){
        self.mousemove(e);
        return !self.dragok;
    }, false);
    document[dbx.etype](dbx.eprefix + 'mouseup', function(e){
        self.mouseup(e);
    }, false);
    this.keydown = false;
    document[dbx.etype](dbx.eprefix + 'keydown', function(){
        self.keydown = true;
    }, false);
    document[dbx.etype](dbx.eprefix + 'keyup', function(){
    self.keydown = false;
    }, false);
};

dbxGroup.prototype.addToggleBehavior = function(){
    var self = this;
    var button = arguments[0].appendChild(dbx.createElement('a'));
    button.appendChild(document.createTextNode('\u00a0'));
    button.style.cursor = 'pointer';
    button.href = 'javascript:void(null)';
    button.className = 'dbx-toggle dbx-toggle-open';
    button.setAttribute('title', this.vocab.toggle.replace('%toggle%', this.vocab.close));
    button.hasfocus = typeof window.opera != 'undefined' || navigator.vendor == 'Apple Computer, Inc.' ? null : false;
    this.tooltip = null;
    button.onclick = function(){
        if(this.hasfocus === true || this.hasfocus === null){
            self.removeTooltip();
            self.toggleBoxState(this, true);
        }
    };
    button['onkey' + (typeof document.uniqueID != 'undefined' || navigator.vendor == 'Apple Computer, Inc.' ? 'down' : 'press')] = function(e){
        if(!e) {
            e = window.event;
        }
        return self.keypress(e, this);
    };
    button.onfocus = function(){
    var len = self.buttons.length;
    for(var i=0; i<len; i++){
        self.buttons[i].className = self.buttons[i].className.replace(/[ ](dbx\-toggle\-hilite\-)(open|closed)/, '');
    }
    var isopen = (/dbx\-toggle\-open/.test(this.className));
    this.className += ' dbx-toggle-hilite-' + (isopen ? 'open' : 'closed');
    self.createTooltip(isopen, this);
    this.isactive = true;
    if(this.hasfocus !== null) {
        this.hasfocus = true; 
    }
};

button.onblur = function(){
    this.className = this.className.replace(/[ ](dbx\-toggle\-hilite\-)(open|closed)/, '');
    self.removeTooltip();
    if(this.hasfocus !== null) {
        this.hasfocus = false; 
    }
};
return button;};

dbxGroup.prototype.toggleBoxState = function(button, regen){
    var isopen = (/dbx\-toggle\-open/.test(button.className));
    var parent = dbx.getTarget(null, 'dbx\-box', button);dbx.box = parent;dbx.toggle = button;
    if(typeof dbx.container == 'undefined'){
        dbx.group = dbx.getTarget(null, 'dbx\-group', parent);
    }
    else { 
    dbx.group = dbx.container;
    }
    if((!isopen && (typeof dbx.onboxopen == 'undefined' || dbx.onboxopen()))||(isopen && (typeof dbx.onboxclose == 'undefined' || dbx.onboxclose()))){
        button.className = 'dbx-toggle dbx-toggle-' + (isopen ? 'closed' : 'open');
        button.title = this.vocab.toggle.replace('%toggle%', isopen ? this.vocab.open : this.vocab.close);
        if(typeof button.isactive != 'undefined'){
            button.className += ' dbx-toggle-hilite-' + (isopen ? 'closed' : 'open')
        }
        parent.className = parent.className.replace(/[ ](dbx-box-)(open|closed)/, ' $1' + (isopen ? 'closed' : 'open'));
        if(regen) {
            this.getBoxOrder(); 
        }
    }
};

dbxGroup.prototype.shiftBoxPosition = function(e, anchor, positive){
    var parent = dbx.getTarget(null, 'dbx\-box', anchor);
    dbx.group = this.container;
    dbx.box = parent;dbx.event = e;
    if(typeof dbx.onboxdrag == 'undefined' || dbx.onboxdrag()){
        var positions = [];
        var len = this.boxes.length;
        for(var i=0; i<len; i++){
            positions[i] = [i, this.boxes[i][this.vertical ? 'offsetTop' : 'offsetLeft']];
            if(parent == this.boxes[i]) {
                this.idref = i; 
            }
        }
        positions.sort(this.compare);
        for(i=0; i<len; i++){
            if(positions[i][0] == this.idref){
                if((positive && i < len - 2) || (!positive && i > 0)){
                    var sibling = this.boxes[positions[i + (positive ? 1 : -1)][0]];
                    if(this.resolution > 0){
                        var visipos = { 'x' : parent.offsetLeft, 'y' : parent.offsetTop };
                        var siblingpos = { 'x' : sibling.offsetLeft, 'y' : sibling.offsetTop };
                    }
                    var obj = { 'insert' : (positive ? sibling : parent), 'before' : (positive ? parent : sibling) 
                };
                this.container.insertBefore(obj.insert, obj.before);
                if(this.resolution > 0){
                    var animators ={'sibling' : new dbxAnimator(this, sibling, siblingpos, this.resolution, true, anchor),'parent' : new dbxAnimator(this, parent, visipos, this.resolution, true, anchor)};
                }else{
                    anchor.focus();}break;
                }
            }
        }
        this.getBoxOrder();
    }
};

dbxGroup.prototype.compare = function(a, b){return a[1] - b[1];
};

dbxGroup.prototype.createTooltip = function(isopen, anchor){
    if(this.keydown){
        this.tooltip = this.container.appendChild(dbx.createElement('span'));
        this.tooltip.style.visibility = 'hidden';
        this.tooltip.className = 'dbx-tooltip';
        if(isopen != null){
            this.tooltip.appendChild(document.createTextNode(this.vocab.kmove + this.vocab.ktoggle.replace('%toggle%', isopen ? this.vocab.close : this.vocab.open)));
        }else{
            this.tooltip.appendChild(document.createTextNode(this.vocab.kmove));
        }
        var parent = dbx.getTarget(null, 'dbx\-box', anchor);
        this.tooltip.style.left = parent.offsetLeft + 'px';
        this.tooltip.style.top = parent.offsetTop + 'px';
        var tooltip = this.tooltip;window.setTimeout(function(){
            if(tooltip != null) {
                tooltip.style.visibility = 'visible';
            }
        }, 500);
    }
};

dbxGroup.prototype.removeTooltip = function(){
    if(this.tooltip != null){
        this.tooltip.parentNode.removeChild(this.tooltip);
        this.tooltip = null;
    }
};

dbxGroup.prototype.mousedown = function(e, box){
    var node = typeof e.target != 'undefined' ? e.target : e.srcElement;
    if(node.nodeName == '#text') {
        node = node.parentNode; 
    }
    if(!/dbx\-(toggle|box|group)/i.test(node.className)){
        while(!/dbx\-(handle|box|group)/i.test(node.className)){
            node = node.parentNode;
        }
    }
    if(/dbx\-handle/i.test(node.className)){
        this.removeTooltip();this.released = false;
        this.initial = { 'x' : e.clientX, 'y' : e.clientY };
        this.current = { 'x' : 0, 'y' : 0 };
        this.createCloneBox(box);
        if(typeof e.preventDefault != 'undefined' ) {
            e.preventDefault(); 
        }
        if(typeof document.onselectstart != 'undefined'){
            document.onselectstart = function() { 
                return false; 
            }
        }
    }
};

dbxGroup.prototype.mousemove = function(e){
    if(this.dragok && this.box != null){
        this.positive = this.vertical ? (e.clientY > this.current.y ? true : false) : (e.clientX > this.current.x ? true : false);
        this.current = { 'x' : e.clientX, 'y' : e.clientY };
        var overall = { 'x' : this.current.x - this.initial.x, 'y' : this.current.y - this.initial.y };
        if(((overall.x >= 0 && overall.x <= this.threshold) || (overall.x <= 0 && overall.x >= 0 - this.threshold))&&((overall.y >= 0 && overall.y <= this.threshold) || (overall.y <= 0 && overall.y >= 0 - this.threshold))){
            this.current.x -= overall.x;this.current.y -= overall.y;
        }
        if(this.released || overall.x > this.threshold || overall.x < (0 - this.threshold) || overall.y > this.threshold || overall.y < (0 - this.threshold)){
            dbx.group = this.container;
            dbx.box = this.box;
            dbx.event = e;
            if(typeof dbx.onboxdrag == 'undefined' || dbx.onboxdrag()){
                this.released = true;
                if(!this.restrict || !this.vertical) {
                    this.boxclone.style.left = (this.current.x - this.difference.x) + 'px'; 
                }
                if(!this.restrict || this.vertical) {
                    this.boxclone.style.top = (this.current.y - this.difference.y) + 'px'; 
                }
                this.moveOriginalToPosition(this.current.x, this.current.y);
                if(typeof e.preventDefault != 'undefined' ) { 
                    e.preventDefault(); 
                }
            }
        }
    }
    return true;
};

dbxGroup.prototype.mouseup = function(e){
    if(this.box != null){
        this.moveOriginalToPosition(e.clientX, e.clientY);
        this.removeCloneBox();
        this.getBoxOrder();
        if(typeof document.onselectstart != 'undefined'){
            document.onselectstart = function() { 
                return true; 
            }
        }
    }
    this.dragok = false;
};

dbxGroup.prototype.keypress = function(e, anchor){
    if(/^(3[7-9])|(40)$/.test(e.keyCode)){
    this.removeTooltip();
        if((this.vertical && /^(38|40)$/.test(e.keyCode)) || (!this.vertical && /^(37|39)$/.test(e.keyCode))){
        this.shiftBoxPosition(e, anchor, /^[3][78]$/.test(e.keyCode) ? false : true);
            if(typeof e.preventDefault != 'undefined') {
                e.preventDefault();
            }else {
                return false; 
            }
            typeof e.stopPropagation != 'undefined' ? e.stopPropagation() : e.cancelBubble = true;this.keydown = false;
        }
    }
    return true;
};

dbxGroup.prototype.getBoxOrder = function(){
    this.order = [];
    var len = this.eles.length;
    for(var j=0; j<len; j++){
        if(/dbx\-box/i.test(this.eles[j].className) && !/dbx\-(clone|dummy)/i.test(this.eles[j].className)){
            this.order.push(this.eles[j].className.split('dbxid')[1] + (/dbx\-box\-open/i.test(this.eles[j].className) ? '+' : '-'));
        }
    }
    dbx.savedata[this.gid] = this.order.join(',');
    dbx.setCookieState();
};

dbxGroup.prototype.createClone = function(){
    var clone = this.container.appendChild(arguments[0].cloneNode(true));
    clone.className += ' dbx-clone';
    clone.style.position = 'absolute';
    clone.style.visibility = 'hidden';
    clone.style.zIndex = arguments[1];
    clone.style.left = arguments[2].x + 'px';
    clone.style.top = arguments[2].y + 'px';
    clone.style.width = arguments[0].offsetWidth + 'px';
    clone.style.height = arguments[0].offsetHeight + 'px';
    return clone;
};

dbxGroup.prototype.createCloneBox = function(box){
    this.box = box;
    this.position = { 'x' : this.box.offsetLeft, 'y' : this.box.offsetTop };
    this.difference = { 'x' : (this.initial.x - this.position.x), 'y' : (this.initial.y - this.position.y) };
    this.boxclone = this.createClone(this.box, 30000, this.position);
    this.boxclone.style.cursor = 'move';
    this.dragok = true;
};

dbxGroup.prototype.removeCloneBox = function(){
    this.container.removeChild(this.boxclone);
    this.box.style.visibility = 'visible';
    this.box = null;
};

dbxGroup.prototype.moveOriginalToPosition = function(clientX, clientY){
    var cloneprops = {'xy' : this.vertical ? clientY - this.difference.y : clientX - this.difference.x,'wh' : this.vertical ? this.boxclone.offsetHeight : this.boxclone.offsetWidth};
    this.box.style.visibility = 'hidden';
    this.boxclone.style.visibility = 'visible';
    var len = this.boxes.length;
    for(var i=0; i<len; i++){
        var boxprops = {'xy' : this.vertical ? this.boxes[i].offsetTop : this.boxes[i].offsetLeft,'wh' : this.vertical ? this.boxes[i].offsetHeight : this.boxes[i].offsetWidth};
        if((this.positive && cloneprops.xy + cloneprops.wh > boxprops.xy && cloneprops.xy < boxprops.xy)||(!this.positive && cloneprops.xy < boxprops.xy && cloneprops.xy + cloneprops.wh > boxprops.xy)){
            if(this.boxes[i] == this.box) { 
                return; 
            }
            var sibling = this.box.nextSibling;
            while(sibling.className == null || !/dbx\-box/.test(sibling.className)){
                sibling = sibling.nextSibling;
            }
            if(this.boxes[i] == sibling) {
                return; 
            }
            if(this.resolution > 0){
                if(this.box[this.vertical ? 'offsetTop' : 'offsetLeft'] < boxprops.xy){
                    var visibox = this.boxes[i].previousSibling;
                    while(visibox.className == null || !/dbx\-box/.test(visibox.className)){
                        visibox = visibox.previousSibling;
                    }
                }else{
                    visibox = this.boxes[i];
                }
                var visipos = { 'x' : visibox.offsetLeft, 'y' : visibox.offsetTop };
            }
            var prepos = { 'x' : this.box.offsetLeft, 'y' : this.box.offsetTop };
            this.container.insertBefore(this.box, this.boxes[i]);
            this.initial.x += (this.box.offsetLeft - prepos.x);
                this.initial.y += (this.box.offsetTop - prepos.y);
            if(this.resolution > 0 && visibox != this.box){
                var animator = new dbxAnimator(this, visibox, visipos, this.resolution, false, null);
            }else{
            }
            break;
        }
    }
};

function dbxAnimator(caller, box, pos, res, kbd, anchor){
    this.caller = caller;
    this.box = box;
    this.timer = null;
    var before = pos[this.caller.vertical ? 'y' : 'x'];
    var after = this.box[this.caller.vertical ? 'offsetTop' : 'offsetLeft'];
    if(before != after){
        if(dbx.running > this.caller.boxes.length - 1) { 
            return;
        }
        var clone = this.caller.createClone(this.box, 29999, arguments[2]);
        clone.style.visibility = 'visible';
        this.box.style.visibility = 'hidden';
        this.animateClone(clone,before,after > before ? after - before : 0 - (before - after),this.caller.vertical ? 'top' : 'left',res,kbd,anchor);
    }
};

dbxAnimator.prototype.animateClone = function(clone, current, change, dir, res, kbd, anchor){
    var self = this;
    var count = 0;
    dbx.running ++;
    this.timer = window.setInterval(function(){
        count ++;
        current += change / res;
        clone.style[dir] = current + 'px';
        if(count == res){
            window.clearTimeout(self.timer);
            self.timer = null;
            dbx.running --;
            self.caller.container.removeChild(clone);
            self.box.style.visibility = 'visible';
            if(kbd){
                if(anchor != null && anchor.parentNode.style.visibility != 'hidden'){
                    anchor.focus();
                }else if(self.caller.toggles){
                    var button = self.caller.buttons[parseInt(self.box.className.split('dbxid')[1],10)];
                    if(button != null && typeof button.isactive != 'undefined'){
                        button.focus();
                    }
                }
            }
        }
    }, 20);
};

if(typeof window.attachEvent != 'undefined'){
    window.attachEvent('onunload', function(){
        var ev = ['mousedown', 'mousemove', 'mouseup', 'mouseout', 'click', 'keydown', 'keyup', 'focus', 'blur', 'selectstart', 'statechange', 'boxdrag', 'boxopen', 'boxclose'];
        var el = ev.length;var dl = document.all.length;
        for(var i=0; i<dl; i++){
            for(var j=0; j<el; j++){
                document.all[i]['on' + ev[j]] = null;
            }
        }
    });
}
// </nowiki>
</syntaxhighlight>
{{Boîte déroulante fin}}