/**
 * [c]Copyright: newmagic datensysteme gmbH[/c]
 * [a]Autor:     Matthias Eipeldauer[/a]
 * [cre]Datum:     25.09.2008[/cre]
 * [desc]
 * mm8Lightbox.js stellt eine Klasse für die Benutzerinteraktion (mm8UIControl) zur Verfügung.
 * Diese Objekte stellen "Lightbox Elemente" dar, die über dem normalen Content der Seite schweben, aber nicht verschoben werden können.
 * 
 * Die Lightboxen stellen eine Standardisierung der vorhandenen Lightbox Elemente dar, die auch über die entsprechenden
 * Rückwärtskompatibilitätsfunktionen verfügen.
 * [/desc]
 **/

//----
include ("mm8UIControl.js");

resizeobj = null;
resizetimer = null;
fadeinobj = null;
fadetimer = null;
fadeval = 0;


/*class*/function mm8Lightbox(id)/*extends mm8UIControl*/
{
  this.superclass=new mm8UIControl(id);
  for (x in this.superclass) (x!="superclass")?this[x]=this.superclass[x]:"";
  this.superclass.childClass = this;
  this.type.push("mm8Lightbox");
  
  this.openurl = "";
  this.targetWidth = 0;
  this.targetHeight = 0;
  
  
  
  this.rawCode   = '<div id="{xID}Background"></div>';
  this.rawCode += '<div id="{xID}Box" style="left:{xLeft}px;top:{xTop}px;">';
  this.rawCode += ' <div id="{xID}ContentContainer">{CONTENT}</div>';
  if (mm8IsLocalDebug)
  {
    this.rawCode += ' <div id="{xID}BoxClose" onclick="CloseBox()" onmouseover="ShowCloser()" onmouseout="HideCloser()"><img src="imgs/closelightbox.png"></div>';
  }
  else
  {
    this.rawCode += ' <div id="{xID}BoxClose" onclick="CloseBox()" onmouseover="ShowCloser()" onmouseout="HideCloser()"><img src="' + mm8WebDbUrl + '/sysWebfiles/homepage.grafik/$file/closelightbox.png"></div>';
  }
  this.rawCode += '</div>';
  
  this.rawContent = new Object();
  
  this.rawContent['default'] = ' <iframe id="{xID}BoxContent" width="100%" height="100%" style="border:none;" src="{SRC}"></iframe>';
  
  this.rawContent['vidstreamMSIE']  = '<OBJECT id="{xID}BoxContent" height="100%" width="100%" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000">';
  this.rawContent['vidstreamMSIE'] += '  <PARAM value="' + mm8WebDbUrl + '/flvplayer.swf?Open&file={SRC}" name="movie" />';
  this.rawContent['vidstreamMSIE'] += '  <PARAM value="#000" name="bgcolor" />';
  this.rawContent['vidstreamMSIE'] += '  <PARAM value="high" name="quality" />';
  this.rawContent['vidstreamMSIE'] += '</OBJECT>';

  this.rawContent['vidstream']      = '<embed';
  this.rawContent['vidstream']     += '  height="100%"';
  this.rawContent['vidstream']     += '  width="100%"';
  this.rawContent['vidstream']     += '  quality="high"';
  this.rawContent['vidstream']     += '  bgcolor="#000"';
  this.rawContent['vidstream']     += '  name="{xID}BoxContent"';
  this.rawContent['vidstream']     += '  id="{xID}BoxContent"';
  this.rawContent['vidstream']     += '  style=""';
  this.rawContent['vidstream']     += '  src="' + mm8WebDbUrl + '/flvplayer.swf?Open&file={SRC}"';
  this.rawContent['vidstream']     += '  type="application/x-shockwave-flash"/>';

  this.rawContent['image'] = '<img src="{SRC}" id="{xID}BoxContent">';
  this.rawContent[''] = this.rawContent['default'];
  
  this.imageCache = "<img src='{SRC}' style='position:absolute;left:-10000px;top:-10000px;'>"
  
  this.storedContent = "";
  
  this.Render = function()
  {
    sHTML = this.rawCode;
    sContent = "default";
    
    su = this.openurl.toLowerCase();
    
    if (su.indexOf('.flv') > -1)
    {
      sContent = "vidstream";
      if (mm8IsMSIE) sContent += "MSIE";
    }
    if (su.indexOf('.jpg') > -1 || su.indexOf('.png') > -1 || su.indexOf('gif') > -1)
    {
      sContent = "image";
      sHTML += this.imageCache;
    }
    
    sHTML = sHTML.replace(/\{CONTENT\}/g, this.rawContent[sContent]);
    sHTML = sHTML.replace(/\{xID\}/g, this.id);
    sHTML = sHTML.replace(/\{SRC\}/g, this.openurl);
    sHTML = sHTML.replace(/\{xLeft\}/g, this.iPosX);
    sHTML = sHTML.replace(/\{xTop\}/g, this.iPosY);
    
    return sHTML;
  };
  
  this.QFadeOut = function()
  {
    elems = ["Box", "BoxContent", "BoxClose"];
    for(i=0; i < elems.length; i++)
    {
      xElem = document.getElementById(this.id + elems[i]);
      xElem.style.opacity = 0;
      xElem.style.filter = "alpha(opacity=0)";
    }
    fadeval = 0;
  }
  
  this.QFadeIn = function()
  {
    elems = ["Box", "BoxContent", "BoxClose"];
    for(i=0; i < elems.length; i++)
    {
      xElem = document.getElementById(this.id + elems[i]);
      xElem.style.opacity = 1;
      xElem.style.filter = "alpha(opacity=100)";
    }
    fadeval = 100;
  }

  this.DoFadeIn = function()
  {
    elems = ["BoxContent", "BoxClose"];
    
    if (fadeval < 100 && fadetimer == null)
    { 
      fadeinobj = this;
      fadetimer = window.setInterval("_DoFadeIn()", 1);
    }
    for(i=0;i<elems.length; i++)
    {
      xObj = document.getElementById(this.id + elems[i]);
      xObj.style.opacity = fadeval/100;
      xObj.style.filter = "alpha(opacity=" + fadeval + ")";
    }
    
    fadeval += 1;
    
    if (fadeval >100)
    {
      window.clearInterval(fadetimer);
      fadeobj = null;
      fadetimer = null;
    }
  }
  
  this.DoResize = function()
  {
    xBG = document.getElementById(this.id + "Box");
    if ((this.width != this.targetWidth || this.height != this.targetHeight) && resizetimer == null)
    { 
      resizeobj = this;
      resizetimer = window.setInterval("_DoResize()", 10);
      xBG.style.opacity = "1";
      xBG.style.filter = "alpha(opacity=100)";
    }

    if (window.innerWidth)
    {
      iSX = window.innerWidth;
      iSY = window.innerHeight;
    }
    else
    {
      iSX = document.body.clientWidth;  // MS IE 7: Berechnet die Breite RICHTIG
      iSY = document.body.clientHeight; // MS IE 7: Berechnet die Höhe falsch
      if (!iSY && iSY != 0)
        iSY = document.documentElement.clientHeight; // MS IE 7: Berechnet die Höhe RICHTIG
    }

    
    xWidth = xBG.offsetWidth;
    xHeight = xBG.offsetHeight;
    if (xWidth != this.targetWidth)
    {
      if (xWidth > this.targetWidth)
      {
        xBG.style.width = xWidth -2 + "px";
      }
      else
      {
        xBG.style.width = xWidth +2 + "px";
      }
      xBG.style.left = ((iSX - xBG.offsetWidth)/2) + "px";
    }
    if (xHeight != this.targetHeight)
    {
      if (xHeight > this.targetHeight)
      {
        xBG.style.height = xHeight -2 + "px";
      }
      else
      {
        xBG.style.height = xHeight +2 + "px";
      }
      xBG.style.top = ((iSY - xBG.offsetHeight)/2) + "px";
    }
    if (Math.abs(xBG.offsetWidth - this.targetWidth) < 3)
    {
      xBG.style.width = this.targetWidth + "px";
      this.width = this.targetWidth;
    } 
    if (Math.abs(xBG.offsetHeight - this.targetHeight) < 3)
    {
      xBG.style.height = this.targetHeight + "px";
      this.height = this.targetHeight;
    }
  
    // Content + Closer Fade In
    if (xBG.offsetWidth == this.targetWidth && xBG.offsetHeight == this.targetHeight)
    {
      window.clearInterval(resizetimer);
      if (this.storedContent != "") this.RestoreContent();
      xObj = document.getElementById(this.id + "BoxContent");
      xObj.style.width = "100%";
      xObj.style.height = "100%";
      this.DoFadeIn();
      resizetimer = null;
    }  
  };
  
  this.ClearContent = function()
  {
    xElem = document.getElementById(this.id + "ContentContainer");
    this.storedContent = xElem.innerHTML;
    xElem.innerHTML = "";
  };
  
  this.RestoreContent = function()
  {
    xElem = document.getElementById(this.id + "ContentContainer");
    xElem.innerHTML = this.storedContent;
    this.storedContent = "";
  };
  
  this.Close = function(EventArgs)
  {
    xElem = document.getElementById(this.id + this.mm8BaseContainerTag);
    xElem.innerHTML = "";
    xParent = xElem.parentNode;
    xParent.removeChild(xElem);
    
    // BG
    xElem = document.getElementById(this.id + "Background");
    xElem.style.display = "none";
    xParent = xElem.parentNode;
    xParent.removeChild(xElem);
  };

  
  mm8UIControls[this.id] = this;
}


// Kompatibilitätsfunktion:
// erstelle eine Lightbox und öffne diese. Die Parameter sizex und sizey sind optional.
//
/*public*/function CreateLightBox(url, sizex, sizey)
{
  xObj = new mm8Lightbox("xLight");
  xObj.BaseClass = "xLight";
  xObj.openurl = url;
  if (sizex) xObj.width = sizex;
  if (sizey) xObj.height = sizey;
  xObj.mm8BaseContainerTag = "Box"; // -> erzeugt dann xLightBox als BaseContainer.
  
  if (sizex && sizey)
  {
    xObj.SetPosition(-5000,-5000);
    document.getElementsByTagName("body")[0].innerHTML += xObj.Render();
    this.IsVisible = true;
    this.bIsVisible = true;
    document.getElementById("xLightBox").style.padding = "0px";
    xObj.QFadeOut();
    xObj.SetSize(100,100);
    xObj.CenterOnScreen('xLightBox');
    xObj.ClearContent();
    xObj.targetWidth = sizex;
    xObj.targetHeight = sizey;
    xObj.DoResize();
  }
  else
  {
    //xObj.SetPosition(-5000,-5000);
    document.getElementsByTagName("body")[0].innerHTML += xObj.Render();
    xObj.IsVisible = true;
    xObj.bIsVisible = true;
    xObj.CenterOnScreen("xLightBox");
  }
  
}

/*public*/function CreateLightBoxAjax(url, sizex, sizey)
{
  xObj = new mm8Lightbox("xLight");
  xObj.BaseClass = "xLight";
  if (sizex) xObj.width = sizex;
  if (sizey) xObj.height = sizey;
  xObj.mm8BaseContainerTag = "Box"; // -> erzeugt dann xLightBox als BaseContainer.
  xObj.mm8ContentElem = "ContentContainer";
  
  document.getElementsByTagName("body")[0].innerHTML += xObj.Render();
  xObj.IsVisible = true;
  xObj.bIsVisible = true;
  xObj.CenterOnScreen("xLightBox");
  xObj.SetContent("GET!!" + url);
}


/*public*/function CloseBox()
{
  xObj = mm8UIControls["xLight"];
  xObj.Close();
}

/*public*/function ShowCloser()
{
  
}

/*public*/function HideCloser()
{

}



function _DoResize()
{
  resizeobj.DoResize();
}

function _DoFadeIn()
{
  fadeinobj.DoFadeIn();
}