//MATT BOX VERSION 0.2 ALPHA/////////////////////
//CHANGE THIS TO THE LOCATION OF THE LOADING GIF.
//CALL MATTBOX FROM AN ONCLICK LIKE THIS
// Image:
// onclick="mattbox('/media/images/example.jpg','type=1');return false;//
// HTML Element:
// onclick="mattbox('IDofDiv','type=2');return false;  //


var loadingImageLocation = "ld.gif";
/////////////////////////////////////////////////




//BROWSER VERSION DETECTION
var BrowserDetect={init:function(){this.browser=this.searchString(this.dataBrowser)||"An unknown browser";this.version=this.searchVersion(navigator.userAgent)||this.searchVersion(navigator.appVersion)||"an unknown version";this.OS=this.searchString(this.dataOS)||"an unknown OS";},searchString:function(data){for(var i=0;i<data.length;i++){var dataString=data[i].string;var dataProp=data[i].prop;this.versionSearchString=data[i].versionSearch||data[i].identity;if(dataString){if(dataString.indexOf(data[i].subString)!=-1)
return data[i].identity;}
else if(dataProp)
return data[i].identity;}},searchVersion:function(dataString){var index=dataString.indexOf(this.versionSearchString);if(index==-1)return;return parseFloat(dataString.substring(index+this.versionSearchString.length+1));},dataBrowser:[{string:navigator.userAgent,subString:"OmniWeb",versionSearch:"OmniWeb/",identity:"OmniWeb"},{string:navigator.vendor,subString:"Apple",identity:"Safari"},{prop:window.opera,identity:"Opera"},{string:navigator.vendor,subString:"iCab",identity:"iCab"},{string:navigator.vendor,subString:"KDE",identity:"Konqueror"},{string:navigator.userAgent,subString:"Firefox",identity:"Firefox"},{string:navigator.vendor,subString:"Camino",identity:"Camino"},{string:navigator.userAgent,subString:"Netscape",identity:"Netscape"},{string:navigator.userAgent,subString:"MSIE",identity:"Explorer",versionSearch:"MSIE"},{string:navigator.userAgent,subString:"Gecko",identity:"Mozilla",versionSearch:"rv"},{string:navigator.userAgent,subString:"Mozilla",identity:"Netscape",versionSearch:"Mozilla"}],dataOS:[{string:navigator.platform,subString:"Win",identity:"Windows"},{string:navigator.platform,subString:"Mac",identity:"Mac"},{string:navigator.platform,subString:"Linux",identity:"Linux"}]};BrowserDetect.init();
//END BROWSER VERSION DETECTION

//WINDOW SIZE DETECTION
function windowSize() {
  var myWidth = 0, myHeight = 0;
  if( typeof( window.innerWidth ) == 'number' ) {
    //Non-IE
    myWidth = window.innerWidth;
    myHeight = window.innerHeight;
  } 
  else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
    //IE 4 compatible
    myWidth = document.body.clientWidth;
    myHeight = document.body.clientHeight;
  }
  return [myWidth,myHeight];
}
//END WINDOW SIZE DETECTION

//USAGE - call mattbox from anything.
//obj is either an object to be loaded, or an image, as declared by flags
//flags - width;height;type;

//GLOBALS
var bolMattBox = false;
var bolObjectLoaded = false;
var bolBackgroundReady = false;
var oFlags;

var ldImage = new Image;
ldImage.src = loadingImageLocation;
ldImage.style.display = "block";
if (BrowserDetect.browser=="Explorer")
        {ldImage.style.position = "absolute";}
    else
        {ldImage.style.position = "fixed";}
ldImage.style.left = "50%";
ldImage.style.top = "50%";
ldImage.style.marginLeft = "-" + (parseInt(ldImage.width)/2) + "px";
ldImage.style.marginTop = "-" + (parseInt(ldImage.height)/2) + "px";
ldImage.style.zIndex = 1001;
ldImage.id = "MB-LoadingImage";


function mattbox(obj,flags)
{
    if (bolMattBox) return false;
    bolObjectLoaded = false;
    bolBackgroundReady = false;
    bolMattBox = true;
    oFlags = new Object;
    //process flags
    if (!obj||!flags) return false;
    var arFlags = flags.split(";");
    var arKeyPair
    for (i=0;i<arFlags.length;i++)
        {
            arKeyPair = arFlags[i].split("=");
            if (!arKeyPair[0]||!arKeyPair[1]) continue;
            oFlags[arKeyPair[0]] = arKeyPair[1];
        }
if (typeof(oFlags.incAlpha)=="undefined") {oFlags.incAlpha = 1;}
else {oFlags.incAlpha = parseInt(oFlags.incAlpha);}

if (typeof(oFlags.endAlpha)=="undefined") {oFlags.endAlpha = 0;}
else {oFlags.endAlpha = parseInt(oFlags.endAlpha);}

if (typeof(oFlags.msAlpha)=="undefined") {oFlags.msAlpha = 50;}
else {oFlags.msAlpha = parseInt(oFlags.msAlpha);}

if (typeof(oFlags.closeButton)=="undefined") {oFlags.closeButton = false;}
else {oFlags.closeButton=true;}

if (oFlags.type=="1")
{
//image type. so preload image.
    var preImg = new Image;
    preImg.src = obj;
}

if (oFlags.type=="2")
{
    oFlags.objectID = obj;
}
   
//create background
    createBackground(oFlags);
    window.onresize = resizeBackground;

//create Object
    createObject(obj,oFlags);

//fade in background
fade(document.getElementById("MB-Background"),oFlags.incAlpha,oFlags.endAlpha,oFlags.msAlpha,function(){if (bolObjectLoaded) {showObject(oFlags);} else {document.body.appendChild(ldImage);}bolBackgroundReady = true;})
return true;
}

function showObject(oFlags)
{
    if (oFlags.type=="1")
    {
        var o = document.getElementById("MB-Object");
    }
    if (oFlags.type=="2")
    {
        var o = document.getElementById("MB-" + oFlags.objectID);
    }
    if (!o) return true;
    if (BrowserDetect.browser=="Explorer")
        {o.style.position = "absolute";}
    else
        {o.style.position = "fixed";}
    o.style.left = "50%";
    o.style.top = "50%";
    if (oFlags.type=="1")
    {
        o.style.marginLeft = "-" + (parseInt(o.width)/2) + "px";
        o.style.marginTop = "-" + (parseInt(o.height)/2) + "px";
    }
    o.style.zIndex = 1002;
    o.style.opacity = "0.0";
    o.style.filter = "alpha(opacity=0)";
    o.style.display = "block";
    if (oFlags.type=="2")
    {
        o.style.marginLeft = "-" + (parseInt(o.clientWidth)/2) + "px";
        o.style.marginTop = "-" + (parseInt(o.clientHeight)/2) + "px";
    }
    if (!oFlags.closeButton)
        {
        o.onclick = function(){mattboxclose(oFlags);}
        o.style.cursor = "pointer";
        o.alt = "Click to close";
        o.title = "Click to close";
        }
    fade(o,oFlags.incAlpha,10,oFlags.msAlpha,function(){if(ldImage.parentNode){document.body.removeChild(ldImage)}})
    return true;
}

function createObject(obj,oFlags)
{
    if (oFlags.type=="1")
    {
    //Dealing with an image here.
        var o = new Image;
        o.style.display="none";
        o.id = "MB-Object";
        o.onload = function() {if(bolBackgroundReady) {showObject(oFlags);}bolObjectLoaded=true;}   
        o.src = obj;
        document.body.appendChild(o);
    }
    if (oFlags.type=="2")
        //Dealing with a div here.
    {
        var o = document.getElementById(obj);
        if (!o) {alert('Invalid ID!');return false;}
        var n = o.cloneNode(true);
        n.id = "MB-" + n.id;
        n.style.display="none";
        document.body.appendChild(n);
        bolObjectLoaded = true;
    }    
}

function createBackground(oFlags)
{
    var o = document.getElementById("MB-Background");
    if (o) o.parentNode.removeChild(o);
    o = document.createElement("DIV");
    o.id = "MB-Background";
    if (BrowserDetect.browser=="Explorer")
        {o.style.position = "absolute";}
    else
        {o.style.position = "fixed";}
    o.style.top = "0px";
    o.style.left = "0px";
    o.style.display = "none";
    o.style.zIndex = 1000;
    var size = windowSize();
    o.style.width = size[0] + "px";
    o.style.height = size[1] + "px"
    if (oFlags.bgClass)
        {o.className = oFlags.bgClass;}
    else
        {
            o.style.opacity = "0.0";
            o.style.filter = "alpha(Opacity=0)";
            o.style.background = "#000";
        }
    document.body.appendChild(o);
    o.style.display = "block";
    return true;
}


function hidewindowed()
{
//I'll do this later.
}

function resizeBackground()
{
    var o = document.getElementById("MB-Background");
    if (!o) return true;
    var size = windowSize();
    o.style.width = size[0] + "px";
    o.style.height = size[1] + "px"
    return true;
}

function mattboxclose(oFlags)
{
    if (!bolMattBox) {return false;}
    bolMattBox = false;
    //Fade out object and background at same time
    if (oFlags.type=="1") {var o = document.getElementById("MB-Object");}
    if (oFlags.type=="2") {var o = document.getElementById("MB-"+oFlags.objectID);}
    
    fade(o,-oFlags.incAlpha,0,oFlags.msAlpha,function(){
        document.body.removeChild(o);
        fade(document.getElementById("MB-Background"),-oFlags.incAlpha,0,oFlags.msAlpha,function(){
            document.body.removeChild(document.getElementById("MB-Background"));
        });
    })
    //fadeOutObject(oFlags);
}

function fade(object,inc,end,ms,endevent)
{
    
    var op = parseFloat(object.style.opacity) * 10;
    op += inc;
    if ((inc > 0 && op >= end)||(inc < 0 && op <= end)) {
        object.style.opacity = end / 10;
        object.style.filter = "alpha(Opacity=" + end * 10 + ")";
        window.setTimeout(endevent,0);return true;
    }
    
    object.style.opacity = op / 10;
    object.style.filter = "alpha(Opacity=" + op * 10 + ")";
    
    window.setTimeout(function(){fade(object,inc,end,ms,endevent);},ms)
}