JSArray = new Array();

document.onkeydown = function(event) {
        event = event || window.event;
        if (event.keyCode == 37) {
                go(CUR, -1, CKEY);
        } else if (event.keyCode == 39) {
                go(CUR, 1, CKEY);
        } else if (event.keyCode == 27) {
                hide('box');
        }
}
 
function go(array, act, ckey) {
        if (act == -1) {
                if (CKEY == 0) {
                        CKEY = JSArray[array].length-1;
                } else {
                        CKEY = CKEY-1;
                }
                swap(JSArray[array][CKEY], 'image');
        } else if (act == 1) {
                if (CKEY == JSArray[array].length-1) {
                        CKEY = 0;
                } else {         
                        CKEY = CKEY+1;
                }
                swap(JSArray[array][CKEY], 'image');
        }
        if (act == 0) {
                CKEY = ckey;
                swap(JSArray[array][CKEY], 'image');
        }
}
 
function swap(image, id) {
        box = document.getElementById(id);
        if (box.src != image) {
//                document.getElementById('loading').src = "loading.gif";
                box.src = image;
        }
        resize(id);
}

function swap2(id1, id2) {
        box1 = document.getElementById(id1);
        box2 = document.getElementById(id2);
        if (box1.src != box2.src) {
                box1.src = box2.src;
        }
        resize(id1);
}

function resize(id) {
        img = document.getElementById('loading');
        img.removeAttribute('width');
        img.removeAttribute('height');
        mbox = document.getElementById('box');
        if (img.width > window.innerWidth) {
                img.height = (img.height / (img.width/(window.innerWidth - 128)))
                img.width = window.innerWidth - 128;
        }
        if (img.height > window.innerHeight) {
                img.width = (img.width / (img.height/(window.innerHeight - 128)))
                img.height = window.innerHeight - 128;
        }
        if (img.width < 200) {
                mbox.style.width = img.width + 215;
                mbox.style.marginLeft = '-'+((img.width + 215) / 2);
        } else {
                mbox.style.width = img.width + 15;
        mbox.style.marginLeft = '-'+((img.width + 15) / 2);
        }
        if (img.height < 300) {
                mbox.style.height = img.height + 315;
                mbox.style.marginTop = '-'+((img.height + 315) / 2);
        } else {
                mbox.style.height = img.height + 15;
                mbox.style.marginTop = '-'+((img.height + 15) / 2);
        }
        document.getElementById('leftarrow').style.top = (((parseInt(mbox.style.height)) / 2) - 32);
        document.getElementById('rightarrow').style.top = (((parseInt(mbox.style.height)) / 2) - 29);
}

function display(array, offset) {
        mbox = document.getElementById('box');
        mbox.style.visibility = "visible";
//	fade('box');
        go(array, 0, offset);
        CUR = array;
}

function hide(id1) {
        document.getElementById(id1).style.visibility = "hidden";

	document.getElementById('loading').src = "loading.gif";
        CKEY = 0;
}