MouseMover - JavaScript-Quelltext

Quelltext von mousemover.js

Dies ist die Auflistung der Datei mousemover.js.

Im Gegensatz zu den meisten derartigen Seiten funktioniert das Teil nicht nur in Netscape4.x, Netscape6 und MSIE, sondern auch im Konqueror und in der Opera.

Im folgenden Quelltext sind Prozedurdeklarationen rot und Kommentare grün markiert.
/* Objektbeweger
 * (c) 2002 Ulrich Kritzner
 * Die Verwendung dieses Scripts in kommerziellen Seiten ist kostenpflichtig
 */

var mausx=0,mausy=0,ux=0,uy=0;
var moveobjects=new Array();
var moveattributes=new Array();
var currentObj=-1;
var zIndex=0;
var eventhandler=0;


/* Ereignishandler setzen ------------------------------------------- */
function SetMoveEventHandler(handler)
{
  eventhandler=handler;
}


/* extra fuer den Konqueror: Extraktion einer Zahl aus
   einer Zeichenkette, die eine Einheit enthaelt (px) --------------- */
function GetInt(s)
{
  var i,ret=0,c,z;
  if (typeof(s)=="string")
  {
    for (i=0;i<s.length;i++)
    {
      z=s.charAt(i);
      c=parseInt(z);
      if (isNaN(c)||((z!="0")&&(c==0)))
        return ret;
      ret*=10;
      ret+=c;
    }
  }
  else
    ret=parseInt(s);
  return ret;
}


/* fuegt ein Objekt in das Array der zu verwaltenden Elemente ein --- */
function AddMoveObject(objname,xp,yp,handlewidth,handleheight,width,height)
{
  var i;
  i=moveobjects.length;
  if (document.all)                    /* MSIE, Konqueror, Opera: --- */
    moveobjects[i]=eval("document.all."+objname+".style");
  else                                               /* Netscape: --- */
  {
    if (typeof(document.getElementById)=="function")
                                                    /* Netscape6: --- */
      moveobjects[i]=document.getElementById(objname).style;
    else                                            /* Netscape4: --- */
      moveobjects[i]=eval("document."+objname);
  }
  moveobjects[i].zIndex=zIndex+i+1;
  moveobjects[i].width=width;
  moveobjects[i].height=height;
  moveattributes[i]=new Object();
  moveattributes[i].x=GetInt(moveobjects[i].left);
  moveattributes[i].y=GetInt(moveobjects[i].top);
  moveattributes[i].width=moveobjects[i].width;
  moveattributes[i].height=moveobjects[i].height;
  moveattributes[i].xp=xp;
  moveattributes[i].yp=yp;
  moveattributes[i].handlewidth=handlewidth;
  moveattributes[i].handleheight=handleheight;
  moveattributes[i].xd=handlewidth/2;
  moveattributes[i].yd=handleheight/2;
  moveobjects.length=i+1;
}


/* Objekt ueber das Dokument ziehen --------------------------------- */
function MouseAction()
{
  if (currentObj<0)
    return;
  moveattributes[currentObj].x=mausx-moveattributes[currentObj].xd-moveattributes[currentObj].xp;
  moveattributes[currentObj].y=mausy-moveattributes[currentObj].yd-moveattributes[currentObj].yp;
  moveobjects[currentObj].left=moveattributes[currentObj].x;
  moveobjects[currentObj].top=moveattributes[currentObj].y;
}


/* Objekt-Kaskade --------------------------------------------------- */
function Cascade(xbase,ybase,xdiff,ydiff)
{
  var i;
  currentObj=-1;
  if (typeof(eventhandler)=="function")
  {
    eventhandler(currentObj);
  }
  for (i=0;i<moveobjects.length;i++)
  {
    moveattributes[i].x=xbase+(moveobjects[i].zIndex-zIndex-1)*xdiff;
    moveattributes[i].y=ybase+(moveobjects[i].zIndex-zIndex-1)*ydiff;
    moveobjects[i].left=moveattributes[i].x;
    moveobjects[i].top=moveattributes[i].y;
  }
}


/* Objekt zeigen ---------------------------------------------------- */
function Show(num)
{
  var i,z=zIndex;
  currentObj=-1;
  if (typeof(eventhandler)=="function")
  {
    eventhandler(currentObj);
  }
  if ((num<0)||(num>=moveobjects.length))
    return;
  z=moveobjects[num].zIndex;  
  for (i=0;i<moveobjects.length;i++)
  {
    if ((moveobjects[i].zIndex>z)&&(i!=num))
      moveobjects[i].zIndex--;
  }
  moveobjects[num].zIndex=zIndex+moveobjects.length;
}


/* Objekt aktivieren ------------------------------------------------ */
function Activate(num)
{
  var i,z=zIndex;
  currentObj=-1;
  if ((num<0)||(num>=moveobjects.length))
    return;
  currentObj=num;
  if (typeof(eventhandler)=="function")
  {
    eventhandler(currentObj);
  }
  z=moveobjects[currentObj].zIndex;  
  for (i=0;i<moveobjects.length;i++)
  {
    if ((moveobjects[i].zIndex>z)&&(i!=currentObj))
      moveobjects[i].zIndex--;
  }
  moveobjects[currentObj].zIndex=zIndex+moveobjects.length;
}


/* Objekt anfassen -------------------------------------------------- */
function MouseActivate()
{
  var i,x,y,z=zIndex;
  currentObj=-1;
  for (i=0;i<moveobjects.length;i++)
  {
    moveattributes[i].x=GetInt(moveobjects[i].left);
    moveattributes[i].y=GetInt(moveobjects[i].top);
    x=mausx-moveattributes[i].x-moveattributes[i].xp;
    y=mausy-moveattributes[i].y-moveattributes[i].yp;
    if ((x>0)&&(y>0)&&(x<moveattributes[i].handlewidth)&&
        (y<moveattributes[i].handleheight)&&(moveobjects[i].zIndex>z))
    {
      currentObj=i;
      z=moveobjects[currentObj].zIndex;  
    }
  }
  if (typeof(eventhandler)=="function")
  {
    eventhandler(currentObj);
  }
  if (currentObj<0)
    return;
  for (i=0;i<moveobjects.length;i++)
  {
    if ((moveobjects[i].zIndex>z)&&(i!=currentObj))
      moveobjects[i].zIndex--;
  }
  moveobjects[currentObj].zIndex=zIndex+moveobjects.length;
  MouseAction();
}


/* Objekt loslassen ------------------------------------------------- */
function MouseDeActivate()
{
  MouseAction();
  currentObj=-1;
  if (typeof(eventhandler)=="function")
  {
    eventhandler(currentObj);
  }
}


/* Mausereignis auswerten ------------------------------------------- */
function MouseEvent(event)
{
  if (typeof(event)!="object")                         /* kein event? */
    return;
  if (event.type=="mouseup")
  {
    if (document.all)                                /* MSIE: ------- */
    {
      if (event.button>1)                      /* nur linke Maustaste */
        return;
    }
    else                                             /* Netscape: --- */
    {
      if (event.which>1)                       /* nur linke Maustaste */
      {
        return;
      }
    }
  }
  if (document.all)                                  /* MSIE: ------- */
  {
    mausx=event.clientX;
    mausy=event.clientY;
    if (document.body.scrollLeft)
      mausx+=document.body.scrollLeft;
    if (document.body.scrollTop)
      mausy+=document.body.scrollTop;
  }
  else                                               /* Netscape: --- */
  {
    mausx=event.pageX;
    mausy=event.pageY;
  }
  if (event.type=="mousemove")
    MouseAction();
  if (event.type=="mouseup")
  {
    if ((ux==mausx)&&(uy==mausy))
      return;
    ux=mausx;
    uy=mausy;
    if (currentObj<0)
      MouseActivate();
    else
      MouseDeActivate();
  }
}


/* Ereignisroutinen zuweisen ---------------------------------------- */
function MouseInit(zIndexBase)
{
  if (zIndexBase)
    zIndex=zIndexBase;
  if (document.all)                    /* MSIE, Konqueror, Opera: --- */
  {
    window.onmousemove=MouseEvent;
    window.onmouseup=MouseEvent;
  }
  else                                               /* Netscape: --- */
  {
    if (typeof(document.addEventListener)=="function")
    {                                               /* Netscape6: --- */
      document.addEventListener("mousemove",MouseEvent,true);
      document.addEventListener("mouseup",MouseEvent,true);
    }
    else                                            /* Netscape4: --- */
    {
      window.captureEvents(Event.MOUSEMOVE);
      window.captureEvents(Event.MOUSEUP);
      window.onmousemove=MouseEvent;
      window.onmouseup=MouseEvent;
    }
  }
}
Autor: Ulrich Kritzner