MediaWiki:Gadget-MoveResizeFixed.js

Dans cet article, nous allons explorer en profondeur le sujet de MediaWiki:Gadget-MoveResizeFixed.js et tous les aspects qui y sont liés. De son origine à son impact sur la société actuelle, en passant par son évolution dans le temps et son influence sur différents domaines d'études. MediaWiki:Gadget-MoveResizeFixed.js est un sujet d'une grande importance tant historiquement que dans le contexte actuel, et il est essentiel de le comprendre pour avoir une vision complète de sa pertinence dans le monde d'aujourd'hui. À travers cet article, nous allons examiner en profondeur chaque aspect de MediaWiki:Gadget-MoveResizeFixed.js et fournir un aperçu détaillé pour nous aider à comprendre son rôle et sa signification aujourd'hui.
/* {{Catégorisation JS|MoveResizeFixed}} */

/* <noinclude>

Fonctions standards pour gérer des éléments en position fixed : 
* fonction "move",
* fonction "resize"

Voir page de discussion.</noinclude>
== CODES SOURCE ==
<!--
*/

/* -->
=== FONCTION : navigateur ===

* Renvoie true si le navigateur est Internet Explorer

<!--
*/
// --><div style="border:1px dashed green;margin:1em;padding:1em;"><source lang=javascript>
//<pre><nowiki>

function MoveResizeFixed_NavIsIE(){
     var agt=navigator.userAgent.toLowerCase();
     var is_ie = ((agt.indexOf("msie") != -1) && (agt.indexOf("opera") == -1));
     MoveResizeFixed_NavIsIE = function () {
          return is_ie;
     };
     return is_ie;
}

//</nowiki></pre></source></div><!--
/*
-->
=== FONCTION : largeur de l'écran ===
* Renvoie la largeur de l'écran (en pixels)

<!--
*/
// --><div style="border:1px dashed green;margin:1em;padding:1em;"><source lang=javascript>
//<pre><nowiki>

function MoveResizeFixed_GetScreenWidth(){
     var ScreenWidth = 0;
     if( typeof( window.innerWidth ) == 'number' ) {
          ScreenWidth = parseInt(window.innerWidth);
     }else if( document.documentElement && document.documentElement.clientWidth ){
          ScreenWidth = parseInt(document.documentElement.clientWidth);
     }else if( document.body && document.body.clientWidth ){
          ScreenWidth = parseInt(document.body.clientWidth);
     }
     return ScreenWidth;
}

//</nowiki></pre></source></div><!--
/*
-->
=== FONCTION : hauteur de l'écran ===
* Renvoie la hauteur de l'écran (en pixels)

<!--
*/
//--><div style="border:1px dashed green;margin:1em;padding:1em;"><source lang=javascript>
//<pre><nowiki>

function MoveResizeFixed_GetScreenHeight(){
     var ScreenHeight = 0;
     if( typeof( window.innerHeight ) == 'number' ) {
          ScreenHeight = parseInt(window.innerHeight);
     }else if( document.documentElement && document.documentElement.clientHeight ){
          ScreenHeight = parseInt(document.documentElement.clientHeight);
     }else if( document.body && document.body.clientHeight ){
          ScreenHeight = parseInt(document.body.clientHeight);
     }
     return ScreenHeight;
}

//</nowiki></pre></source></div><!--
/*
--> 
=== FONCTION : MOVE ===

Transforme un élément en ancre pour bouger un autre élément (en position fixed)
* elementArea = élément ancre (obligatoire)
* elementsToMove = éléments à bouger (obligatoire, dans une Array)
* LeftLimit = limites gauche, en pixel (facultatif, dans une Array)
* TopLimit = limites haut, en pixel (facultatif, dans une Array)

<!--
*/
//--><div style="border:1px dashed green;margin:1em;padding:1em;"><source lang=javascript>
//<pre><nowiki>

function MoveResizeFixed_AddMoveArea(elementArea, elementsToMove, LeftLimit, TopLimit){
     if((!elementArea)||(!elementsToMove)) return;
     elementArea.onmousedown=function(event) {
          var monbody = document.body;
          if(!event) { event = window.event; }
          var positionSouris_X;
          var positionSouris_Y;
          if(MoveResizeFixed_NavIsIE()){ 
               positionSouris_X = parseInt( event.clientX + monbody.scrollLeft );
               positionSouris_Y = parseInt( event.clientY + monbody.scrollTop );
          }else{
               positionSouris_X = parseInt( event.clientX );
               positionSouris_Y = parseInt( event.clientY );
          } 
          for(var a=0;a<elementsToMove.length;a++){
               elementsToMove.initialX = parseInt( positionSouris_X - elementsToMove.offsetLeft);
               elementsToMove.initialY = parseInt( positionSouris_Y - elementsToMove.offsetTop);
               elementsToMove.style.opacity = '.8';
          }
          monbody.onmousemove = function(event) {
               if(!event) { event = window.event; }
               var positionSouris_X;
               var positionSouris_Y;
               if(MoveResizeFixed_NavIsIE()){
                    positionSouris_X = parseInt( event.clientX + monbody.scrollLeft );
                    positionSouris_Y = parseInt( event.clientY + monbody.scrollTop );
               }else{
                    positionSouris_X = parseInt( event.clientX );
                    positionSouris_Y = parseInt( event.clientY );
               }
               var LeftLimitDone = false;
               var TopLimitDone = false;
               for(var a=0;a<elementsToMove.length;a++){
                    var PositionGauche = parseInt( positionSouris_X ) - elementsToMove.initialX;
                    var PositionHaut = parseInt(positionSouris_Y ) - elementsToMove.initialY;
                    if(LeftLimit){
                         if(LeftLimit || LeftLimit==0){
                              if( PositionGauche < parseInt(LeftLimit)){
                                   PositionGauche = LeftLimit;
                                   LeftLimitDone = true;
                              }
                         }
                    }
                    if(TopLimit){
                         if(TopLimit || TopLimit==0){
                              if( PositionHaut < parseInt(TopLimit)){
                                   PositionHaut = parseInt(TopLimit);
                                   TopLimitDone = true;
                              }
                         }
                    }
                    elementsToMove.style.left = PositionGauche + 'px';
                    elementsToMove.style.top = PositionHaut + 'px';
               }
               if(LeftLimitDone){
                    for(var a=0;a<elementsToMove.length;a++){
                         if(LeftLimit) elementsToMove.style.left = LeftLimit + 'px';
                    }
               }
               if(TopLimitDone){
                    for(var a=0;a<elementsToMove.length;a++){
                         if(TopLimit) elementsToMove.style.top = TopLimit + 'px';
                    }
               }
          };
          monbody.onmouseup=function(event) {
               for(var a=0;a<elementsToMove.length;a++){
                    elementsToMove.style.opacity = '';
               }
               monbody.onmousemove = null;
               monbody.onmouseup = null;
          };
     };
     elementArea.style.cursor = "move";
}

//</nowiki></pre></source></div><!--
/*
-->
=== FONCTION : RESIZE ===

Transforme un élément en ancre pour redimensionner un autre élément (en position fixed)
* elementArea = élément ancre (obligatoire)
* elementsToResize = éléments à redimensionner (obligatoire, dans une Array)
* MinWidth = largeurs minimum, en pixel (facultatif, dans une Array)
* MinHeight = hauteurs minimum, en pixel (facultatif, dans une Array)

<!--
*/
//--><div style="border:1px dashed green;margin:1em;padding:1em;"><source lang=javascript>
//<pre><nowiki>

function MoveResizeFixed_AddResizeArea(elementArea, elementsToResize, MinWidth, MinHeight){
     if((!elementArea)||(!elementsToResize)) return;
     elementArea.onmousedown = function(event){
          var monbody = document.body;
          if(!event) { event = window.event; }
          var positionSouris_X;
          var positionSouris_Y;
          if(MoveResizeFixed_NavIsIE()){ 
               positionSouris_X = parseInt( event.clientX + monbody.scrollLeft );
               positionSouris_Y = parseInt( event.clientY + monbody.scrollTop );
          }else{
               positionSouris_X = parseInt( event.clientX );
               positionSouris_Y = parseInt( event.clientY );
          }
          for(var a=0;a<elementsToResize.length;a++){
               elementsToResize.initialWidth = parseInt( positionSouris_X - elementsToResize.offsetWidth );
               elementsToResize.initialHeight = parseInt( positionSouris_Y - elementsToResize.offsetHeight );
               elementsToResize.style.opacity = '.8';
          }
          monbody.onmousemove=function(event) {
               if(!event) { event = window.event; }
               var positionSouris_X;
               var positionSouris_Y;
               if(MoveResizeFixed_NavIsIE()){ 
                    positionSouris_X = parseInt( event.clientX + monbody.scrollLeft );
                    positionSouris_Y = parseInt( event.clientY + monbody.scrollTop );
               }else{
                    positionSouris_X = parseInt( event.clientX );
                    positionSouris_Y = parseInt( event.clientY );
               }
               var MinWidthDone = false;
               var MinHeightDone = false;
               for(var a=0;a<elementsToResize.length;a++){
                    var NewWidth = parseInt( positionSouris_X - elementsToResize.initialWidth  );
                    var NewHeight = parseInt( positionSouris_Y - elementsToResize.initialHeight );
                    if(MinWidth){
                         if(MinWidth || MinWidth==0){
                              if(NewWidth<parseInt(MinWidth)){
                                   NewWidth = MinWidth;
                                   MinWidthDone = true;
                              }
                         }
                    }
                    if(MinHeight){
                         if(MinHeight || MinHeight==0){
                              if(NewHeight<parseInt(MinHeight)){
                                   NewHeight = MinHeight;
                                   MinHeightDone = true;
                              }
                         }
                    }
                    elementsToResize.style.width  = NewWidth + 'px';
                    elementsToResize.style.height = NewHeight + 'px';
               }
               if(MinWidthDone){
                    for(var a=0;a<elementsToResize.length;a++){
                         if(MinWidth) elementsToResize.style.width  = MinWidth + 'px';
                    }
               }
               if(MinHeightDone){
                    for(var a=0;a<elementsToResize.length;a++){
                         if(MinHeight) elementsToResize.style.height  = MinHeight + 'px';
                    }
               }
          };
          monbody.onmouseup=function(event) {
               for(var a=0;a<elementsToResize.length;a++){
                    elementsToResize.style.opacity = '';
               }
               monbody.onmousemove = null;
               monbody.onmouseup = null;
          };
     };
     elementArea.style.cursor = "se-resize";
}
//</nowiki></pre></source></div>