var zIndex = 0;// global z-index counter
var mouseStatus='up';
var selectedBox;
var mouseXstart;
var mouseYstart;

function GetXmlHttpObject() {
    if (window.XMLHttpRequest) {
    // code for IE7+, Firefox, Chrome, Opera, Safari
        return new XMLHttpRequest();
    }
    if (window.ActiveXObject) {
    // code for IE6, IE5
        return new ActiveXObject("Microsoft.XMLHTTP");
    }
    return null;
}

function box(name) {
	this.boxname = document.getElementById(name);
    this.style = document.getElementById(name).style;
	this.sides = document.getElementById(name+'sidesbg');
	this.tb = document.getElementById(name+'topbottombg');
    this.onmouseup = document.getElementById(name).onmouseup;
    this.onmousedown = box.onmousedown;
    this.name = name;
    this.minWidth = 50;
    this.minHeight = 50;
    this.minXpos = 600;
    this.minYpos = 200;
    this.opacity = 10;
    this.open = false;
	this.locked = false;
    this.fillContent = function() {
        ajaxpage('pages/contact.php', name+'div');
    }
//    $(this).draggable();

	function printout(method, x, y, mx) {
		var s = '#' + name + ' (' + method + ')' + ' x:' + x + ', y:' + y;
//        document.getElementById('info').innerHTML = s;
	}

    this.startDrag = function() {
        if (this.locked == false) {
            this.startX = this.x;
            this.startY = this.y;
            document.onmousemove = this.drag;
            document.onmouseup = this.dragEnd;
            printout('drag', this.x, this.y,this.mouseX);
        }
        return false;
    }
    
	this.drag = function(e) {
		e = e ? e : window.event;
        x = window[name].startX + (e.clientX - mouseXstart);
		y = window[name].startY + (e.clientY - mouseYstart);
        window[name].setSize('','',x,y);
        printout('drag', x,window[name].style.zIndex);
		return false;
	}

	this.dragEnd = function() {
		document.onmousemove = null;
		document.onmouseup = null;
	}    
    
    this.bringToFront = function() {
        zIndex += 1;
        this.style.zIndex = zIndex;
    }
    
/*    this.boxname.onmousedown = function(e) {
		e = e ? e : window.event;
        mouseXstart = e.clientX;
		mouseYstart = e.clientY;
        window[name].bringToFront();
        window[name].startDrag();
//        window[name].fade(80);
    }
*/
    this.update = function() {
        if(this.w != -999) {
            this.style.width = this.w + 'px';
            if (this.tb) { this.tb.style.width = (this.w - 26) + 'px'; }
        }
        if(this.h != -999) {
            this.style.height = this.h + 'px';
            if (this.sides) { this.sides.style.height = (this.h - 26) + 'px'; }
        }
        if(this.x!= -999) {
            this.style.left = this.x + 'px';
        }
        if(this.y != -999) {
            this.style.top = this.y + 'px';
        }
    }
    
	this.setSize = function(w,h,x,y) {
        if(typeof w != "string") this.w = w;
        if(typeof h != "string") this.h = h;
        if(typeof x != "string") this.x = x;
        if(typeof y != "string") this.y = y;
        this.update();
    }
    
    this.increment = function(endWidth, endHeight, endXpos, endYpos) {
        if(endWidth != -999) { 
            var w = this.w;
            if(w!=endWidth) {
                if(w<endWidth-2) { w+=3; }
                else if(w>endWidth+2) { w-=3; }
                else w=endWidth;
            }
        } else {
            var w = endWidth;
            this.w = endWidth;
        }
        if(endHeight != -999) { 
            var h = this.h; 
            if(h!=endHeight) {
                if(h<endHeight-2) { h+=3; }
                else if(h>endHeight+2) { h-=3; }
                else h=endHeight;
            }
        } else {
            var h = endHeight;
            this.h = endHeight;
        }
        if(endXpos != -999) { 
            var x = this.x;
            if(x!=endXpos) {
                if(x<endXpos-2) { x+=3; }
                else if(x>endXpos+2) { x-=3; }
                else x=endXpos;
            }
        } else {
            var x = endXpos;
            this.x = endXpos;
        }
        if(endYpos != -999) {
            var y = this.y;
            if(y!=endYpos) {
                if(y<endYpos-2) { y+=3; }
                else if(y>endYpos+2) { y-=3; }
                else y=endYpos;
            }
        } else {
            var y = endYpos;
            this.y = endYpos;
        }
            
        this.setSize(w,h,x,y);

        if(this.w==endWidth && this.h==endHeight && this.x==endXpos && this.y==endYpos) {
            this.locked=false;
            clearInterval(this.expInterval);
            return;
        }
    }
    
    this.expand = function(w,h,x,y,z) {
        this.expInterval = window.setInterval(this.name+'.increment('+ w + ',' + h + ',' + x + ',' + y +')',z);
    }
    
    this.expandMenu = function(h) {
        this.expInterval = window.setInterval(this.name+'.increment("no", '+ h + ', "no", "no")',20);
    }
    
    this.resize = function(endWidth, endHeight, endXpos, endYpos, speed) {
        if (this.locked==false) {
            this.locked=true; 
            if (this.open == true) {
                this.expand(this.minWidth, this.minHeight, this.minXpos, this.minYpos, speed);
                this.open = false;
            } else {
                this.expand(endWidth, endHeight, endXpos, endYpos, speed);
                this.open = true;
            }
        }
    }
    
    
    this.setOpacity = function() {
        opacity  = this.opacity;
        this.style.opacity = (opacity == 100)?99.999:opacity;
        // IE/Win
        this.style.filter = "alpha(opacity:"+opacity+")";
        // Safari<1.2, Konqueror
        this.style.KHTMLOpacity = opacity/100;
        // Older Mozilla and Firefox
        this.style.MozOpacity = opacity/100;
        // Safari 1.2, newer Firefox and Mozilla, CSS3
        this.style.opacity = opacity/100;
    }

    this.fade = function(targetOpacity) {
        if (this.opacity + 4 < targetOpacity) {
            this.opacity += 5;
        } else if (this.opacity - 4 > targetOpacity) {
            this.opacity -= 5;
        } else { 
            this.opacity = targetOpacity;
            clearInterval(this.fadeInterval);
        }
        this.setOpacity();
    }
    
    this.beginFade = function(targetOpacity) {
        this.fadeInterval = window.setInterval(this.name+'.fade('+ targetOpacity +')',10);
    }
   
}


var xmlhttp;

function showUser(str) {

    xmlhttp=GetXmlHttpObject();
    if (xmlhttp==null) {
        alert ("Browser does not support HTTP Request");
        return;
    }
    var url="pages/"+str+".php";
    url=url+"?name="+str;
    url=url+"&sid="+Math.random();
    xmlhttp.onreadystatechange=stateChanged(str);
    xmlhttp.open("GET",url,true);
    xmlhttp.send(null);
}

function getUrl(str,div) {

    xmlhttp=GetXmlHttpObject();
    if (xmlhttp==null) {
        alert ("Browser does not support HTTP Request");
        return;
    }
    var url=str;
    xmlhttp.onreadystatechange=stateChanged(div);
    xmlhttp.open("GET",url,true);
    xmlhttp.send(null);
}

function stateChanged(str) {
    if (xmlhttp.readyState==4) {
        document.getElementById(str+'div').innerHTML=xmlhttp.responseText;
    }
}

function centerPage() {
     var availHeight;
     var availWidth;
  
     if(typeof(window.innerWidth) == 'number'){
         availWidth = window.innerWidth;
         availHeight = window.innerHeight;
     }else if(document.documentElement && document.documentElement.clientWidth) {
         availWidth = document.documentElement.clientWidth;
         availHeight = document.documentElement.clientHeight;
     }else if(document.body && document.body.clientWidth) {
        availWidth = document.body.clientWidth;
        availHeight = document.body.clientHeight;
     }
  
     var sideBar = document.getElementById('sideBar');
     var content = document.getElementById('main');
//     var navbar = document.getElementById('navMenu');
     var contentWidth = 850;
     var left = (availWidth/2) - (contentWidth/2);
     content.style.marginLeft=left+"px";
//     navbar.style.marginLeft=left+"px";
     sideBar.style.marginLeft=left+"px";
}
window.onload = function() {
    initialise();
}

function createSmallBox(id, html, width, height, left, top) {
   var newdiv = document.createElement('div');
   newdiv.setAttribute('id', id);
   var topleft = document.createElement('span');
   topleft.setAttribute('class', 'topleft');
   var topright = document.createElement('span');
   topright.setAttribute('class', 'topright');
   var bottomleft = document.createElement('span');
   bottomleft.setAttribute('class', 'bottomleft');
   var bottomright = document.createElement('span');
   bottomright.setAttribute('class', 'bottomright');
   var sidesbg = document.createElement('span');
   sidesbg.setAttribute('class', 'sidesbg');
   sidesbg.setAttribute('id',id+'sidesbg');
   var sidesbg2 = document.createElement('span');
   var topbottombg = document.createElement('span');
   topbottombg.setAttribute('class', 'topbottombg');
   topbottombg.setAttribute('id', id+'topbottombg');
   var topbottombg2 = document.createElement('span');
   var divcontent = document.createElement('div');
   divcontent.setAttribute('class', 'divcontent');
   divcontent.setAttribute('id', id+'div');
   newdiv.appendChild(topleft);
   newdiv.appendChild(topright);
   newdiv.appendChild(bottomleft);
   newdiv.appendChild(bottomright);
   newdiv.appendChild(sidesbg);
   sidesbg.appendChild(sidesbg2);
   newdiv.appendChild(topbottombg);
   topbottombg.appendChild(topbottombg2);


   if (!width) { newdiv.style.width = '300px';
   } else { newdiv.style.width = width; }
   
   if (!height) { newdiv.style.height = '300px';
   } else { newdiv.style.height = height; }
   
   newdiv.style.position = "absolute";

       if ((left || top) || (left && top)) {
       if (left) { newdiv.style.left = left; }
       if (top) { newdiv.style.top = top; }
   }
   
   document.getElementById('dragbox_wrapper').appendChild(newdiv);
   window[id] = new box(id);
   window[id].setSize(200,200,0,0);

   if (html) {
       divcontent.innerHTML = html;
   } else {
       divcontent.innerHTML = "nothing";
   }
}