var currLetter = null;
var offsetX = 0;
var offsetY = 0;
var zTop = 0;
var hostURI = '';
var updateBusy = 0;
var bbOffsetLeft = 8;
var bbOffsetTop = 8;

function lbFalse()
{
    return ( false );
}

function lbGrab(e, letter)
{
    updateBusy = 1;

    document.onMouseDown = lbFalse;

    e = e || window.event;

    currLetter = letter;
	letter.style.position = 'absolute';
    letter.style.zIndex = ++zTop;
    document.onmousemove = lbDrag;
    document.onmouseup = lbDrop;
    offsetX = letter.offsetLeft - e.clientX;
    offsetY = letter.offsetTop - e.clientY;
}

function lbDrag(e)
{
    e = e || window.event;

    var x, y;

    if ( e.clientX + offsetX + currLetter.offsetWidth > 1000 )
        x = 1000 - currLetter.offsetWidth;
    else if ( e.clientX + offsetX < 0 )
        x = 0
    else
        x = e.clientX + offsetX

    if ( e.clientY + offsetY + currLetter.offsetHeight > 750 )
        y = 750 - currLetter.offsetHeight;
    else if ( e.clientY + offsetY < 0 )
        y = 0
    else
        y = e.clientY + offsetY

    currLetter.style.left = x.toString(10) + 'px';
    currLetter.style.top  = y.toString(10) + 'px';

    return ( false );
}

function lbDrop()
{
    if (currLetter) {
        lbSendState(currLetter);
        currLetter = null;
    }

    document.onmousemove = null;
    document.onmouseup = null;
    document.onmousedown = null;
}

function lbInit(h, z)
{
    hostURI = h;
    zTop = z;
    var bb = document.getElementById('blackboard');
    if ( bb ) {
        bbOffsetLeft = bb.offsetLeft;
        bbOffsetTop = bb.offsetTop;
    }
    lbCenter();
    window.onresize = lbCenter;
    setInterval("lbGetUpdates()",5000);
    setTimeout("lbFade('blackboard', 100, 20)", 1000);
    setTimeout("lbFade('welcome', 0, 100)", 2000);
}

function lbCenter()
{
    var bb = document.getElementById('blackboard');
    if ( bb ) {
        if ( document.body.clientWidth < 1000 ) {
            bb.style.left = 0 - bbOffsetLeft;
        } else {
            bb.style.left = (document.body.clientWidth - 1000)/2 - bbOffsetLeft;
        }
        if ( document.body.clientHeight < 750 ) {
            bb.style.top = 0 - bbOffsetTop;
        } else {
            bb.style.top = (document.body.clientHeight - 750)/2 - bbOffsetTop;
        }
    }
    var bb = document.getElementById('obscura');
    if ( bb ) {
        bb.style.width = document.body.clientWidth;
        bb.style.height = document.body.clientHeight;
    }
}

function lbSendState(l)
{
    updateBusy = 1;
    var uri = 'http://'+hostURI+'/letterboard/update.php/' + l.id + '/' + l.style.left + '/' + l.style.top + '/' + l.style.zIndex;
    var request = (typeof(XMLHttpRequest) != "undefined") ? new XMLHttpRequest() : new ActiveXObject("MSXML2.XMLHTTP.3.0");
    request.open("GET", uri, false);
    request.send(null);
    updateBusy = 0;
}

function lbGetUpdates()
{
    if ( updateBusy )
        return;

    updateBusy = 1;

    var uri = 'http://'+hostURI+'/letterboard/update.php';
    var request = (typeof(XMLHttpRequest) != "undefined") ? new XMLHttpRequest() : new ActiveXObject("MSXML2.XMLHTTP.3.0");
    var letters, pos, l, x, y, z, elem;
    var i = 0;
    request.open("GET", uri, false);
    request.send(null);
    if ( request.readyState == 4 && request.status == 200 ) {
        letters = request.responseText.split(':');
        while ( letters[i] ) {
            pos = letters[i].split(',');
            l = pos[0];
            x = pos[1];
            y = pos[2];
            z = pos[3];
            elem = document.getElementById(l);
            if ( elem ) {
                elem.style.left = x+'px';
                elem.style.top = y+'px';
                elem.style.zIndex = z;
            }
            i++;
        }
    }

    updateBusy = 0;
}

function lbReset()
{
    var colors = new Array('red','green','blue','yellow');
    var letters = new Array('A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z');
    var elem;
    var x, y;

    elem = document.getElementById('redZ');
    if ( !elem )
        return;

    var maxX = 1000 - elem.offsetWidth;
    var maxY = 750 - elem.offsetHeight;

    for ( var c = 0; c < 4; c++ ) {
        for ( var l = 0; l < 26; l++ ) {
            elem = document.getElementById(colors[c]+letters[l]);
            if ( elem ) {
                if ( c > 1 ) {
                    elem.style.left = (maxX/25 * l)+'px';
                    if ( c > 2 ) {
                        elem.style.top = (750 - elem.offsetHeight)+'px';
                    } else {
                        elem.style.top = '0px';
                    }
                } else {
                    elem.style.top = (maxY/25 * l)+'px';
                    if ( c > 0 ) {
                        elem.style.left = (1000 - elem.offsetWidth)+'px';
                    } else {
                        elem.style.left = '0px';
                    }
                }
                elem.style.zIndex = 0;
                lbSendState(elem);
            }
        }
    }
}

function lbFade(id, startOpac, endOpac)
{
    var factor = ( endOpac - startOpac ) / 5;
    var total = startOpac;

    for ( var i = 0; i < 6; i++ ) {
        setTimeout("lbChangeOpacity('" + id + "', " + total + ")", i * 100 );
        total += factor;
    }
}

function lbChangeOpacity(id, opac)
{
    var style = document.getElementById(id).style;
    if ( style ) {
        style.opacity = (opac / 100);
        style.MozOpacity = (opac / 100);
        style.KhtmlOpacity = (opac / 100);
        style.filter = "alpha(opacity=" + opac + ")";
    }
}

function lbCloseWelcome()
{
    lbFade('welcome', 100, 0);
    setTimeout("lbFinishCloseWelcome()", 600);
}

function lbFinishCloseWelcome()
{
    var elem = document.getElementById('welcome');
    if ( elem )
        elem.style.zIndex = -1;
    var elem = document.getElementById('obscura');
    if ( elem )
        elem.style.zIndex = -1;
    lbFade('blackboard', 20, 100);
}

