MediaWiki:Gadget-MoveResizeAbsolute.js

/* {{Projet:JavaScript/Script|MoveResizeAbsolute}} */

/* <noinclude>

Fonctions standards pour gérer des éléments en position absolute :
* 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 MoveResizeAbsolute_NavIsIE(){
     var agt=navigator.userAgent.toLowerCase();
     var is_ie = ((agt.indexOf("msie") != -1) && (agt.indexOf("opera") == -1));
     MoveResizeAbsolute_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 MoveResizeAbsolute_GetScreenWidth(){
     var ScreenWidth;
     if(MoveResizeAbsolute_NavIsIE()){
          ScreenWidth = parseInt(screen.width);
     }else{
          ScreenWidth = parseInt(window.innerWidth);
     }
     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 MoveResizeAbsolute_GetScreenHeight(){
     var ScreenHeight;
     if(MoveResizeAbsolute_NavIsIE()){
          ScreenHeight = parseInt(screen.height);
     }else{
          ScreenHeight = parseInt(window.innerHeight);
     }
     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)
* LeftLimit = limite gauche, en pixel (facultatif)
* TopLimit = limite haut, en pixel (facultatif)

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

function MoveResizeAbsolute_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(MoveResizeAbsolute_NavIsIE()){
               positionSouris_X = parseInt( event.clientX + monbody.scrollLeft );
               positionSouris_Y = parseInt( event.clientY + monbody.scrollTop );
          }else{
               positionSouris_X = parseInt( event.pageX );
               positionSouris_Y = parseInt( event.pageY );
          }
          for(var a=0;a<elementsToMove.length;a++){
               elementsToMove.initialX = parseInt( positionSouris_X - elementsToMove.offsetLeft);
               elementsToMove.initialY = parseInt( positionSouris_Y - elementsToMove.offsetTop);
               $( elementsToMove ).css( 'opacity', '.8' );
          }
          monbody.onmousemove = function(event) {
               if(!event) { event = window.event; }
               var positionSouris_X;
               var positionSouris_Y;
               if(MoveResizeAbsolute_NavIsIE()){
                    positionSouris_X = parseInt( event.clientX + monbody.scrollLeft );
                    positionSouris_Y = parseInt( event.clientY + monbody.scrollTop );
               }else{
                    positionSouris_X = parseInt( event.pageX );
                    positionSouris_Y = parseInt( event.pageY );
               }
               var PositionGauche;
               var PositionHaut;
               var LeftLimitDone = false;
               var TopLimitDone = false;
               for(var a=0;a<elementsToMove.length;a++){
                    PositionGauche = parseInt( positionSouris_X ) - elementsToMove.initialX;
                    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 ).css( {
                         left: PositionGauche + 'px',
                         top: PositionHaut + 'px'
                    } );
               }
               if(LeftLimitDone){
                    for(var a=0;a<elementsToMove.length;a++){
                         if(LeftLimit) $( elementsToMove ).css( 'left', LeftLimit + 'px' );
                    }
                    LeftLimitDone = false;
               }
               if(TopLimitDone){
                    for(var a=0;a<elementsToMove.length;a++){
                         if(TopLimit) $( elementsToMove ).css( 'top', TopLimit + 'px' );
                    }
                    TopLimitDone = false;
               }
          };
          monbody.onmouseup=function(event) {
               for(var a=0;a<elementsToMove.length;a++){
                    $( elementsToMove ).css( 'opacity', '' );
               }
               monbody.onmousemove = null;
               monbody.onmouseup = null;
          };
     };
     $( elementArea ).css( '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 = largeur minimum, en pixel (facultatif)
* MinHeight = hauteur minimum, en pixel (facultatif)

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

function MoveResizeAbsolute_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(MoveResizeAbsolute_NavIsIE()){
               positionSouris_X = parseInt( event.clientX + monbody.scrollLeft );
               positionSouris_Y = parseInt( event.clientY + monbody.scrollTop );
          }else{
               positionSouris_X = parseInt( event.pageX );
               positionSouris_Y = parseInt( event.pageY );
          }
          for(var a=0;a<elementsToResize.length;a++){
               elementsToResize.initialWidth = parseInt( positionSouris_X - elementsToResize.offsetWidth );
               elementsToResize.initialHeight = parseInt( positionSouris_Y - elementsToResize.offsetHeight );
               $( elementsToResize ).css( 'opacity', '.8' );
          }
          monbody.onmousemove=function(event) {
               if(!event) { event = window.event; }
               var positionSouris_X;
               var positionSouris_Y;
               if(MoveResizeAbsolute_NavIsIE()){
                    positionSouris_X = parseInt( event.clientX + monbody.scrollLeft );
                    positionSouris_Y = parseInt( event.clientY + monbody.scrollTop );
               }else{
                    positionSouris_X = parseInt( event.pageX );
                    positionSouris_Y = parseInt( event.pageY );
               }
               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 ).css( {
                         width: NewWidth + 'px',
                         height: NewHeight + 'px'
                    } );
               }
               if(MinWidthDone){
                    for(var a=0;a<elementsToResize.length;a++){
                         if(MinWidth) $( elementsToResize ).css( 'width', MinWidth + 'px' );
                    }
               }
               if(MinHeightDone){
                    for(var a=0;a<elementsToResize.length;a++){
                         if(MinHeight) $( elementsToResize ).css( 'height', MinHeight + 'px' );
                    }
               }

          };
          monbody.onmouseup=function(event) {
               for(var a=0;a<elementsToResize.length;a++){
                    $( elementsToResize ).css( 'opacity', '' );
               }
               monbody.onmousemove = null;
               monbody.onmouseup = null;
          };
     };
     $( elementArea ).css( 'cursor', 'se-resize' );
}
//</nowiki></pre></source></div>