/**
 * JavaScript-Methoden
 *
 * Author: Benjamin Pramann, Andreas Mette, DSISoft GmbH, 28.06.2010
 * Version : 1.2.0
 */



/**
 * Erzeugt ein Bild in einem Div, bindet das Div dynamisch in die Html-Seite ein
 * und liefert es zurueck; Ist bereits ein Div mit der angegebenen divId vorhanden,
 * so wird dieses verwendet und eingebunden und es wird kein neues erzeugt.
 **/
function getHoverDiv(imgSrc, divId) {
   var hoverDiv = document.getElementById(divId);
   if (!hoverDiv) {
      // erzeuge neues Bild
      var hoverImg = new Image();
      hoverImg.src = imgSrc;
      // Abfrage, ob das Bild auch wirklich geladen ist
      if (hoverImg.complete == true) {
         // erzeuge Div mit Bild
         hoverDiv = document.createElement("div");
         hoverDiv.id = divId;
         hoverDiv.appendChild(hoverImg);
      } /* endif */
   } /* endif */
   // fuege das Bild ein
   if (hoverDiv)
      document.body.appendChild(hoverDiv);
   return hoverDiv;
} /* end getHoverDiv() */

/**
 * Overlay einfuegen und bewegen.
 **/
function mouseMove(ev, imgSrc, divId) {
   var overlayDiv = getHoverDiv(imgSrc, divId);
   if (overlayDiv) {
      // Das Overlay muss zunaechst auf Block gesetzt werden,
      // damit spaeter auf seine Groesse zugegriffen werden kann
      overlayDiv.style.display = 'block';

      // Hole den horizontalen und vertikalen Abstand des Overlays
      var horizontalOverlayMargin = getHorizontalOverlayMargin();
      var verticalOverlayMargin = getVerticalOverlayMargin();

      // Hole die Scroll-Position
      var scrollTop = getScrollTop();
      var scrollLeft = getScrollLeft();

      // Ermittle neue Position
      var top = ev.clientY + scrollTop + verticalOverlayMargin;
      var left = ev.clientX + scrollLeft + horizontalOverlayMargin;

      // Hole die Breite und Hoehe des Overlays
      var overlayWidth = overlayDiv.offsetWidth;
      var overlayHeight = overlayDiv.offsetHeight;

      // Hole die Breite und Hoehe des Browserfensters
      var clientWidth = getClientWidth();
      var clientHeight = getClientHeight();

      // Wenn Groesse des Overlays und des Browserfensters verfuegbar,
      // so kontrolliere, ob die Position angepasst werden muss
      if (overlayWidth > 0 && overlayHeight > 0 && clientWidth > 0 && clientHeight > 0) {

         // Berechne die gerade noch sichtbare Position des Browserfensters rechts und unten,
         // ueber die das Overlay also nicht hinausragen darf
         var clientBottom = scrollTop + clientHeight;
         var clientRight = scrollLeft + clientWidth;

         // Wenn das Overlay nach unten rausragt, so platziere es am unteren Bildschirmrand;
         // Sollte das Browserfenster allerdings nicht gross genug sein, so dass das Overlay
         // entweder nach oben oder nach unten rausragen wuerde, so lasse es im Zweifel
         // lieber nach unten rausragen.
         if (top + overlayHeight + verticalOverlayMargin > clientBottom) {
            top = Math.max(verticalOverlayMargin, clientBottom - overlayHeight - verticalOverlayMargin);
         } /* endif */
         // Wenn das Overlay nach rechts rausragt, so platziere es am rechten Bildschirmrand;
         // Sollte das Browserfenster allerdings nicht breit genug sein, so dass das Overlay
         // entweder nach links oder nach rechts rausragen wuerde, so lasse es im Zweifel
         // lieber nach rechts rausragen.
         if (left + overlayWidth + horizontalOverlayMargin > clientRight) {
            left = Math.max(horizontalOverlayMargin, clientRight - overlayWidth - horizontalOverlayMargin);
         } /* endif */

         // Um ein Flackern zu vermeiden wird das Overlay ueber dem Cursor platziert,
         // falls es nicht mehr rechts unter dem Mauscursor platziert werden kann
         if (
            left <= ev.clientX + scrollLeft &&
            left + overlayWidth >= ev.clientX + scrollLeft &&
            top <= ev.clientY + scrollTop &&
            top + overlayHeight >= ev.clientY + scrollTop
         )  {
            top = ev.clientY + scrollTop - overlayHeight - verticalOverlayMargin;
         } /* endif */

      } /* endif */

      // Uebernehme neue Position
      overlayDiv.style.top = top;
      overlayDiv.style.left = left;
   } /* endif */
} /* end mouseMove() */

/**
 * Overlay entfernen.
 **/
function mouseOut(divId) {
   var hoverDiv = document.getElementById(divId);
   if (hoverDiv)
      document.body.removeChild(hoverDiv);
} /* end mouseOut() */

/**
 * Liefert die Scroll-Position oben zurueck.
 */
function getScrollTop () {
   var result = 0;
   if (window.pageYOffset) {
      result = window.pageYOffset;
   } else if (document.documentElement && document.documentElement.scrollTop) {
      result = document.documentElement.scrollTop;
   } else if (document.body.scrollTop) {
      result = document.body.scrollTop;
   } /* endif */
   return result;
} /* end getScrollTop() */

/**
 * Liefert die Scroll-Position links zurueck.
 */
function getScrollLeft () {
   var result = 0;
   if (window.pageXOffset) {
      result = window.pageXOffset;
   } else if (document.documentElement && document.documentElement.scrollLeft) {
      result = document.documentElement.scrollLeft;
   } else if (document.body.scrollLeft) {
      result = document.body.scrollLeft;
   } /* endif */
   return result;
} /* getScrollLeft() */

/**
 * Hole Breite des Browserfensters.
 */
function getClientWidth () {
   var result = 0;
   if (window.innerWidth) {
      result = window.innerWidth;
   } else if (document.documentElement && document.documentElement.clientWidth) {
      result = document.documentElement.clientWidth;
   } else if (document.body.clientWidth) {
      result = document.body.clientWidth;
   } /* endif */
   return result;
} /* end getClientWidth() */

/**
 * Hole Hoehe des Browserfensters.
 */
function getClientHeight () {
   var result = 0;
   if (window.innerHeight) {
      result = window.innerHeight;
   } else if (document.documentElement && document.documentElement.clientHeight) {
      result = document.documentElement.clientHeight;
   } else if (document.body.clientHeight) {
      result = document.body.clientHeight;
   } /* endif */
   return result;
} /* end getClientHeight() */

/**
 * Liefert den Abstand des Overlays nach links und nach rechts zurueck.
 */
function getHorizontalOverlayMargin () {
   return 20;
} /* end getHorizontalOverlayMargin() */

/**
 * Liefert den Abstand des Overlays nach oben und nach unten zurueck.
 */
function getVerticalOverlayMargin () {
   return 20;
} /* end getVerticalOverlayMargin() */


