﻿var IE = document.all ? true : false;
if (!IE) document.captureEvents(Event.MOUSEMOVE)
document.onmousemove = getMouseXY;
var position = "LR";
var state = "";

var globalNo = 0;
var imageWidth = 300, imageHeight = 205;

var parentArray = new Array("#i1", "#i2", "#i3", "#i4", "#i5", "#i6", "#i7", "#i8");
var childArray = new Array("#i1_1", "#i2_1", "#i3_1", "#i4_1", "#i5_1", "#i6_1", "#i7_1", "#i8_1");

var lastVisited = "#i1_1";
$(document).ready(function() {
    $("#i1").mousedown(function() {
        window.open("Portfolio.aspx?loc=adventure", "_parent");
    });
    $("#i1_1").mousedown(function() {
        window.open("Portfolio.aspx?loc=adventure", "_parent");
    });

    $("#i3").mousedown(function() {
        window.open("Portfolio.aspx?loc=environmental_portraits", "_parent");
    });
    $("#i3_1").mousedown(function() {
        window.open("Portfolio.aspx?loc=environmental_portraits", "_parent");
    });

    $("#i2").mousedown(function() {
        window.open("Portfolio.aspx?loc=death_valley", "_parent");
    });
    $("#i2_1").mousedown(function() {
        window.open("Portfolio.aspx?loc=death_valley", "_parent");
    });

    $("#i4").mousedown(function() {
        window.open("Portfolio.aspx?loc=harley_davidson", "_parent");
    });
    $("#i4_1").mousedown(function() {
        window.open("Portfolio.aspx?loc=harley_davidson", "_parent");
    });

    $("#i5").mousedown(function() {
        window.open("Portfolio.aspx?loc=portraits", "_parent");
    });
    $("#i5_1").mousedown(function() {
        window.open("Portfolio.aspx?loc=portraits", "_parent");
    });

    $("#i6").mousedown(function() {
        window.open("Portfolio.aspx?loc=humor", "_parent");
    });
    $("#i6_1").mousedown(function() {
        window.open("Portfolio.aspx?loc=humor", "_parent");
    });
    $("#i8").mousedown(function() {
        window.open("Portfolio.aspx?loc=family", "_parent");
    });
    $("#i8_1").mousedown(function() {
        window.open("Portfolio.aspx?loc=family", "_parent");
    });
    $("#i7").mousedown(function() {
        window.open("Portfolio.aspx?loc=campaigns", "_parent");
    });
    $("#i7_1").mousedown(function() {
        window.open("Portfolio.aspx?loc=campaigns", "_parent");
    });
    
    SetImageOver("#td0"); SetImageOut("#td0");
    SetImageOver("#td1"); SetImageOut("#td1");
    SetImageOver("#td2"); SetImageOut("#td2");
    SetImageOver("#td3"); SetImageOut("#td3");
    SetImageOver("#td4"); SetImageOut("#td4");
    SetImageOver("#td5"); SetImageOut("#td5");
    SetImageOver("#td6"); SetImageOut("#td6");
    SetImageOver("#td7"); SetImageOut("#td7");

    $("#td21").mouseenter(function() { lastVisited = "dump"; });
    $("#td22").mouseenter(function() { lastVisited = "dump"; });
    $("#td23").mouseenter(function() { lastVisited = "dump"; });
    $("#td24").mouseenter(function() { lastVisited = "dump"; });
    $("#td25").mouseenter(function() { lastVisited = "dump"; });
    $("#td26").mouseenter(function() { lastVisited = "dump"; });

    $("#td21").mousemove(function() { lastVisited = "dump"; });
    $("#td22").mousemove(function() { lastVisited = "dump"; });
    $("#td23").mousemove(function() { lastVisited = "dump"; });
    $("#td24").mousemove(function() { lastVisited = "dump"; });
    $("#td25").mousemove(function() { lastVisited = "dump"; });
    $("#td26").mousemove(function() { lastVisited = "dump"; });

    var margin1 = imageHeight / 2;
    var margin2 = imageWidth / 2;
    var width = imageWidth;
    var height = imageHeight;
    var timeout = 250;

    function SetImageOver(img) {
        $(img).mouseenter(function() {
            lastVisited = childArray[img.toString().replace("#td", "")];
            MouseOverEvent(parentArray[img.toString().replace("#td", "")]);
        });
    }
    function SetImageOut(img) {
        $(img).mouseleave(function() {
            MouseOutEvent(childArray[img.toString().replace("#td", "")]);
            var c = childArray[img.toString().replace("#td", "")];
            var p = parentArray[img.toString().replace("#td", "")];
            var interval = window.setInterval(function() {
                if (lastVisited != c && ($(c).width() == width && $(c).height() == height)) {
                    if (position == "TB") {
                        $(p).css({ width: width + 'px', height: '0px', marginTop: '' + margin1 + 'px', marginLeft: '0px', opacity: '0.5' });
                        $(c).stop().animate({ width: width + 'px', height: '0px', marginTop: '' + margin1 + 'px', marginLeft: '0px', opacity: '0.5' }, { duration: timeout });
                        window.setTimeout(function() {
                            $(p).stop().animate({ width: width + 'px', height: '' + height + 'px', marginTop: '0px', marginLeft: '0px', opacity: '1' }, { duration: timeout });
                        }, timeout);
                    }
                    else {
                        $(p).stop().css({ width: '0px', height: '' + height + 'px', marginLeft: '' + margin2 + 'px', marginTop: '0px', opacity: '0.5' });
                        $(c).stop().animate({ width: '0px', height: '' + height + 'px', marginLeft: '' + margin2 + 'px', marginTop: '0px', opacity: '0.5' }, { duration: 300 });
                        window.setTimeout(function() {
                            $(p).stop().animate({ width: '' + width + 'px', height: '' + height + 'px', marginLeft: '0px', marginTop: '0px', opacity: '1' }, { duration: 300 });
                        }, timeout);
                    }
                    window.clearInterval(interval);
                }
            }, 1000);
        });
    }
    function MouseOverEvent(img) {
        if ($(img).width() == width && $(img).height() == height) {
            var id = "#" + $(img).attr("id");
            if (position == "TB") {
                $(id + "_1").css({ width: width + 'px', height: '0px', marginTop: '' + margin1 + 'px', marginLeft: '0px', opacity: '0.5' });
                $(id).stop().animate({ width: width + 'px', height: '0px', marginTop: '' + margin1 + 'px', marginLeft: '0px', opacity: '0.5' }, { duration: timeout });
                window.setTimeout(function() {
                    $(id + "_1").stop().animate({ width: width + 'px', height: '' + height + 'px', marginTop: '0px', marginLeft: '0px', opacity: '1' }, { duration: timeout });
                }, timeout);
            }
            else {
                $(id + "_1").stop().css({ width: '0px', height: '' + height + 'px', marginLeft: '' + margin2 + 'px', marginTop: '0px', opacity: '0.5' });
                $(id).stop().animate({ width: '0px', height: '' + height + 'px', marginLeft: '' + margin2 + 'px', marginTop: '0px', opacity: '0.5' }, { duration: timeout });
                window.setTimeout(function() {
                    $(id + "_1").stop().animate({ width: '' + width + 'px', height: '' + height + 'px', marginLeft: '0px', marginTop: '0px', opacity: '1' }, { duration: timeout });
                }, timeout);
            }
        }
    }

    function MouseOutEvent(id) {
        var pid = "#" + $(id).attr("id").replace("_1", "");
        var cid = "#" + $(id).attr("id");
        if ($(id).width() == width && $(id).height() == height) {
            if (position == "TB") {
                $(pid).css({ width: width + 'px', height: '0px', marginTop: '' + margin1 + 'px', marginLeft: '0px', opacity: '0.5' });
                $(cid).stop().animate({ width: width + 'px', height: '0px', marginTop: '' + margin1 + 'px', marginLeft: '0px', opacity: '0.5' }, { duration: timeout });
                window.setTimeout(function() {
                    $(pid).stop().animate({ width: width + 'px', height: '' + height + 'px', marginTop: '0px', marginLeft: '0px', opacity: '1' }, { duration: timeout });
                }, timeout);
            }
            else {
                $(pid).stop().css({ width: '0px', height: '' + height + 'px', marginLeft: '' + margin2 + 'px', marginTop: '0px', opacity: '0.5' });
                $(cid).stop().animate({ width: '0px', height: '' + height + 'px', marginLeft: '' + margin2 + 'px', marginTop: '0px', opacity: '0.5' }, { duration: 300 });
                window.setTimeout(function() {
                    $(pid).stop().animate({ width: '' + width + 'px', height: '' + height + 'px', marginLeft: '0px', marginTop: '0px', opacity: '1' }, { duration: 300 });
                }, 300);
            }
        }
    }
});