function initDetails() {
    $(".expanding .row").each(function() {
        var self = this;
        $(this).hover(function() {
            $(this).addClass("hovering");
        }, function() {
            $(this).removeClass("hovering");
        });
        $(this).click(function() {
            if ($(this).is(".open")) return;
            $(this).addClass("open");
            this.oldHeight = $(this).height();
            $(".details", this).css({
                display: "block",
                opacity: 0
            });
            $(".details", this).animate({
                opacity: 1,
            }, 400, "easeInCirc", function() {
                
            });
        });
        $(".close_details", this).click(function() {
            $(self).removeClass("open");
            $(".details", self).animate({
                opacity: 0
            }, 400, "easeInCirc", function() {
                $(this).css("display", "none");
                $(self).removeClass("open");
            });
            return false;
        });
    });
}


function initTooltips() {
    $("*[title]").each(initTooltip);
}


// Called with this = the element
function initTooltip(i) {
    this.ttText = this.title;
    this.title = ""; // Cancel the default tooltip
    
    var html = '<span class="tip-start"></span><span class="tip-middle">' + this.ttText + '</span><span class="tip-end"></span>';
    
    var ttID = "tip-" + i;
    $('<span class="tip" id="' + ttID + '">' + html + '</span>').appendTo('body'); // .insertAfter(this);
    
    $(this).hover(function(e) {
        // $('#' + ttID).css('display', 'block');
        var tip = $('#' + ttID);
        tip.stop().css({
            "display": "block",
            "opacity": 0,
            "left": e.pageX + 25,
            "top": e.pageY + 16
        })
        .animate({
            "left": "-=25",
        }, 400, "easeOutCirc")
        .animate({
            "opacity": 1,
        }, {
            queue: false,
            duration: 350
        });
    }, function() {
        // $("#" + ttID).css("display", "none");
        // Right now does it right away, but can use a tieout
        var tip = $("#" + ttID);
        tip.stop().animate({
            "left": "+=25",
            "opacity": 0,
        }, 400, "easeOutCirc", function() {
            $(this).css("display", "none");
        });
    });
}


function inputFocus() {
    $(".shy").focus(function() {
        if (!this.shyValue) this.shyValue = $(this).val();
        $(this).removeClass("shy");
        if ($(this).val() == this.shyValue) $(this).val("");
    })
    .blur(function() {
        if ($(this).val() == this.shyValue || $(this).val() == "") {
            $(this).addClass("shy").val(this.shyValue);
        }
    });
}

/* Codename Rainbows 0.2 */
/* April 04, 2008 */

function d(title, str) {
    if (title) title = unescape(title);
    if (str) str = unescape(str);
    if (str) $("#debug").append("<p><b>" + title + ":</b> " + str + "</p>");
    else if (title == "-") $("#debug").append("<p>------</p>");
    else if (title) $("#debug").append("<p>" + title + "</p>");
    else $("#debug").append("<br />");
}


function initGradients(s) {
    $(function() {
        $(s).each(function() {
            var el = this;
            // Parse the inputs
            var from = '#ffffff', to = '#000000';
            var
                fR = parseInt(from.substring(1, 3), 16),
                fG = parseInt(from.substring(3, 5), 16),
                fB = parseInt(from.substring(5, 7), 16),
                tR = parseInt(to.substring(1, 3), 16),
                tG = parseInt(to.substring(3, 5), 16),
                tB = parseInt(to.substring(5, 7), 16);
            
            var h = $(this).height() * 1.5;
            
            // h = h - Math.floor((h * .07));
            
            var html;
            
            if (this.initHTML)
                html = this.initHTML;
            else
                html = this.innerHTML;
            
            this.initHTML = html;
            this.innerHTML = '';
            
            for (var i = 0; i < h; i++) {
                var c = '#' +
                    (Math.floor(fR * (h - i) / h + tR * (i / h))).toString(16) +
                    (Math.floor(fG * (h - i) / h + tG * (i / h))).toString(16) +
                    (Math.floor(fB * (h - i) / h + tB * (i / h))).toString(16);
                
                if (c.length == 4) continue;
                d('.rainbow-' + i + '{ color: ' + c + '; }');
                // $('<span class="rainbow rainbow-' + i + '"><span style="top: ' + (-i - 1) + 'px;">' + html + '</span></span>').appendTo(this);
                $('<span class="rainbow rainbow-' + i + '" style="color: ' + c + ';"><span style="top: ' + (-i - 1) + 'px;">' + html + '</span></span>').appendTo(this);
            }
            
            $('<span class="highlight">' + html + '</span>').appendTo(this);
            $('<span class="shadow">' + html + '</span>').appendTo(this);
            $('<span class="source">' + html + '</span>').appendTo(this);
        
        });
    
    });
}

function initShadows(s) {
    $(function() {
        $(s).each(function() {
            if (this.initHTML)
                html = this.initHTML;
            else
                html = this.innerHTML;
            
            this.initHTML = html;
            this.innerHTML = '';
            
            $('<span class="wrap"><span class="source">' + html + '</span><span class="shadow">' + html + '</span></span>').appendTo(this);
            
        });
        
    });
}


/* Wrap original content in .source span, then insert .hover span */
/* If .shadow, clone .source span and change class to .shadow */
/* If .highlight, clone .source span and change class to .highlight */
/* (or generate those 2 extra spans while wrapping, as opposed to just 1) */
function goFish(selector, time) {
    if (!time) time = 500;
    
    if (!selector) selector = ".pufferfish";
    
    $(selector)
        .each(function() {
            var html = $(this).html();
            
            $(this).html('<span class="source">' + html + '</span><span class="hover"></span>');
            if ($(".highlight", this).length > 0)
                $(this).append('<span class="highlight">' + html + '</span>');
            
            if ($(".shadow", this).length > 0)
                $(this).append('<span class="shadow">' + html + '</span>');
        })
        .hover(
            function() {
                $(".hover", this).stop().animate({
                    "opacity": 1
                }, time);
            }, function() {
                $(".hover", this).stop().animate({
                    "opacity": 0
                }, time);
                // alert("!");
            }
        )
        .find(".hover").css("opacity", 0);
}


function Lightbox() {
    var boxId = null;
    var eContent = null;
    var eBox = null;
    var self = this;
    var shown = false;
    var boxTitle = '';
    var onLoadCallback = function() {};
    var onCloseCallback = function() {};
    var resizeCallback = function() {};
    
    /* Generate a unique div ID to use. */
    do {
        boxId = String('lightbox_' + Math.round(Math.random() * 1000000));
    } while(document.getElementById(boxId) !== null);
    
    this.shown = function() {
        return shown;
    }
    
    this.onWindowResize = function() {
        resizeCallback();
    };
    
    // Attach handler to the window's resize event.
    $(window).resize(this.onWindowResize);
    
    var calcBoxHeight = function() {
        var boxHeight = Math.round(window.innerHeight * 0.80);
        
        if (boxHeight < 400) {
            boxHeight = 400;
        } else if (boxHeight > 600) {
            boxHeight = 600;
        }
        
        return boxHeight-150;
    };
    
    var calcBoxTopOffset = function() {
        return Math.round(window.innerHeight * 0.20) -100;
    };
    
    var realResize = function() {
        self.contentElement().css('height', calcBoxHeight());
        eBox.find('div.light').css('top', calcBoxTopOffset());
        return false;
    };
    
    this.boxElement = function() {
        return eBox;
    };
    
    this.contentElement = function() {
        if (eContent === null) {
            var tmp;
            eContent = ((tmp = $('div.content', eBox)).size() == 1) ? tmp : null;
        }
        return eContent;
    };
    
    this.setTitle = function(t) {
        boxTitle = t;
    };
    
    this.wrapContent = function (content) {
        
        var boxHeight = calcBoxHeight();
        var boxTopOffset = calcBoxTopOffset();
        
        return '<div class="light" style="top: ' + boxTopOffset + 'px">'
                    + '<div class="shadows"><div class="shadow n"></div><div class="shadow w"></div><div class="shadow s"></div><div class="shadow e"></div><div class="shadow ne"></div><div class="shadow se"></div><div class="shadow sw"></div><div class="shadow nw"></div>'
                    // this close link had pufferfish for GG, but not needed for anime
                    + '<a class="close" href="#">Close</a>'
                    + '<div class="large pink title">'
                    + '<h2>' + boxTitle + '</h2>'
                    + '</div>'
                    + '<div class="large content" style="height:' + boxHeight + 'px;">'
                    + content
                    + '</div><!-- /content -->'
                    + '<div class="clear"></div>'
                    + '</div><!-- /shadows --></div><!-- /light -->';
    };
    
    this.show = function(data, params) {
        if (typeof(data) != "object") {
            data = {url: data}
        }
        if (eBox === null) {
            /* Prepend it to the body. */
            $('body').append('<div id="' + boxId + '" style="display:none;"></div>');
            /* Get a reference to the div. */
            eBox = $('#' + boxId);
            function _show(content) {
                /* Prepend it to the body. */
                eBox.append(self.wrapContent(content));
                self.hook_up_lightbox_links();
                self.hook_up_forms();
                $("a.close", eBox).click(self.hide).click(onCloseCallback);
                onLoadCallback();
                shown = true;
            }
            if (data.url) {
                $.get(data.url, params, function(content) {
                    _show(content);
                });
            }
            else if (data.html) {
                _show(data.html);
            }
        } else {
            //Force a resize, while the lightbox was closed it, the window could have been resized.
            realResize();
        }
        /* lightbox will be visible now; Enable resizing. */
        resizeCallback = realResize;
        eBox.show();
        $('#darkness').fadeIn(500);
        return false;
    };
    
    this.hide = function() {
        eBox.hide();
        $('#darkness').fadeOut(500);
        /* lightbox will be invisible now; Disable resizing. */
        resizeCallback = function() {};
        shown = false;
        return false;
    };
    
    this.fetch = function(url) {
        $.get(url, function(content) {
            $(".content", eBox).html(content);
            self.hook_up_lightbox_links();
            self.hook_up_forms();
            $(".content", eBox).animate({scrollTop: 0}, "fast");
            fuck(self);
        });
    };
    
    this.hook_up_lightbox_links = function() {
        $("a.open_in_lightbox", eBox).click(function() {
            self.fetch(this.href);
            return false;
        });
        // $(".heart_rating", eBox).click(postRating);
        // $(".bookmark", eBox).click(bookmark);
    };
    
    this.hook_up_forms = function() {
        lightbox = this;
        $("form.in_lightbox", eBox).submit(function() {
            var params = {};
            $.each($(this).serializeArray(), function(i, field) {
                params[field.name] = field.value;
            });
            $.post(this.action, params,
                function(data, textStatus) {
                    if (data.redirect) {
                        window.location.href = data.redirect;
                    } else if (data.lightbox) {
                        $(".content", eBox).html(data.lightbox.data);
                        self.hook_up_lightbox_links();
                        self.hook_up_forms();
                        fuck(lightbox);
                    }
                    else {
                        $(".content", eBox).html(data);
                        self.hook_up_lightbox_links();
                        self.hook_up_forms();
                        fuck(lightbox);
                    }
                }
            );
            return false;
        });
    };
    
    this.onClose = function(fn) {
        onCloseCallback = fn;
    };
    
    this.setTrigger = function(element) {
        $(element).click(this.show);
    };
    
    this.onFirstLoad = function(fn) {
        onLoadCallback = fn;
    };
}


function fuck(lightBox) {
    /* This styling needs to be re-ran, because the lightbox content is loaded dynamically. */
    
    $("input:text,input:password").addClass("text");
    $("input:checkbox,input:radio").addClass("checkbox");
    $("dl", lightBox.contentElement()).each(function(i) {
        var ul = $(this);
        ul.find("dd:first,dt:first").addClass("first").end().find("dt:last,dd:last").addClass("last");
    });
    // Tab Titles
    if(!lightBox.shown()) {
        $(".title h2", lightBox.boxElement()).each(
            function(i) {
                $(this).html('<span class="tab"><span class="tab-right">' + $(this).html() + '</span></span>');
            }
        );
    }
    goFish($(".pufferfish", lightBox.boxElement()));
    /*initGradients($(".rainbows", lightBox.boxElement()));
    initGradients($(".title .tab-right", lightBox.boxElement()));
    initGradients($(".anchors li a", lightBox.boxElement()));
    initShadows($("#subnavs ul a", lightBox.boxElement()));*/

}


function hookup_arctic_subnav() {
    $("#arctic_show_subnav").toggle(function() {
        $("#arctic_subnav").fadeIn("200");
    },function() { 
        $("#arctic_subnav").fadeOut("200");
    })
}


function openLightbox() {
    /* this caching isn't working 
    if (typeof(window.globalLightboxList) == 'undefined')
        window.globalLightboxList = {};
    if (typeof(window.globalLightboxList[this.href]) == 'undefined')
        lightbox = window.globalLightboxList[this.href] = new Lightbox(this.href);
    */
    var lightbox = new Lightbox();
    lightbox.setTitle(this.ttText);
    lightbox.onFirstLoad(function() { fuck(lightbox); });
    lightbox.show(this.href);
    return false;
}

function openMessageLightbox() {
    /* this caching isn't working 
    if (typeof(window.globalLightboxList) == 'undefined')
        window.globalLightboxList = {};
    if (typeof(window.globalLightboxList[this.href]) == 'undefined')
        lightbox = window.globalLightboxList[this.href] = new Lightbox(this.href);
    */
    var lightbox = new Lightbox();
    lightbox.setTitle(this.title);
    lightbox.onFirstLoad(function() { fuck(lightbox); });
    lightbox.onClose(function() {
        updateArcticNav();
    });
    lightbox.show(this.href);
    return false;
}

function submitIntoLightbox() {
    var params = {};
    form_data($(this)).each(function() {
        params[ this.name || this.id || this.parentNode.name || this.parentNode.id ] = this.value; 
        if(this.name == "game") {
            params["game"] = this.real_val;
        }
    });
    /* this caching isn't working 
    if (typeof(window.globalLightboxList) == 'undefined')
        window.globalLightboxList = {};
    if (typeof(window.globalLightboxList[this.href]) == 'undefined')
        lightbox = window.globalLightboxList[this.href] = new Lightbox(this.href);
    */
    var lightbox = new Lightbox();
    lightbox.setTitle(params["lightbox_title"]);
    delete params["lightbox_title"];
    lightbox.onFirstLoad(function() { fuck(lightbox); });
    lightbox.show(this.action, params);
    return false;
}


function hookup_lightboxes() {
    $("a.open_lightbox").click(openLightbox);
    $("a.open_message_lightbox").click(openMessageLightbox);
    $("form.submit_lightbox").submit(submitIntoLightbox);
}


function updateGamePoints() {
    $("#game_points").hide();
    $("#game_points").load("/game_points/", {}, function() {
        $("#game_points").fadeIn();
    });
}


function updateArcticNav() {
    $("#arctic_nav").hide();
    $("#arctic_nav").load("/arctic_nav/", {}, function() {
        $("#arctic_nav").fadeIn();
        initGradients(".rainbows");
        hookup_arctic_subnav();
        hookup_lightboxes();
    });
}


$(document).ready(function() {
    if ($.browser.msie) {
        $("body").addClass("ie");
    }
    if ($.browser.safari) {
        $("body").addClass("safari");
    }
    if ($.browser.firefox) {
        $("body").addClass("gecko");
    }
    if ($.browser.camino) {
        $("body").addClass("gecko");
    }
    if ($.browser.mozilla) {
        $("body").addClass("gecko");
    }
    if ($.browser.flock) {
        $("body").addClass("gecko");
    }
    if ($.browser.netscape) {
        $("body").addClass("gecko");
    }
    
    // Tagging
    $("input:text,input:password").addClass("text");
    $("input:checkbox,input:radio").addClass("checkbox");
    $("ul").each(function(i) {
        var ul = $(this);
        ul.find("li:first").addClass("first").end().find("li:last").addClass("last");
        ul.find("li").each(function(x) {
            if (x % 2 == 0) { $(this).addClass("even"); }
            if (x % 2 == 1) { $(this).addClass("odd"); }
            if (x % 4 == 3) { $(this).addClass("xdoubleEven"); }
        });
    });
    $(".list").each(function(i) {
        var ul = $(this);
        ul.find(".item:first").addClass("first").end().find(".item:last").addClass("last");
        ul.find(".item").each(function(x) {
            if (x % 2 == 0) { $(this).addClass("even"); }
            if (x % 2 == 1) { $(this).addClass("odd"); }
            if (x % 4 == 3) { $(this).addClass("xdoubleEven"); }
        });
    });
    $("dl").each(function(i) {
        var ul = $(this);
        ul.find("dd:first,dt:first").addClass("first").end().find("dt:last,dd:last").addClass("last");
    });
    
    // Tab Titles
    $(".title h2").each(function(i) { 
        $(this).html('<span class="tab"><span class="tab-right">' +$(this).html() + "</span></span>");
    });
    
    goFish(); 
    goFish("#navigation a");
    // Not pufferfish
    $("#navigation a").append('<span class="patch a"></span><span class="patch b"></span>');
    // />
    
    inputFocus();
    
    initShadows("#subnavs ul a");
    initShadows("#arctic_nav ul a");
    initShadows(".addshadows");
    initShadows(".title .tab-right");
    initShadows(".anchors li a");
    
    initTooltips();
    
    $(".ratings.module").each(function() {
        initRatings.apply(this);
        initRatingsDropdown.apply(this);
    });
    
    initDetails();
    
    $("#arctic_show_subnav").toggle(function() {
        $("#arctic_subnav").fadeIn("200");
    }, function() { 
        $("#arctic_subnav").fadeOut("200");
    });
    $(".arctic_hide_subnav").click(function() {
        $("#arctic_subnav").fadeOut("200");
    });
    
    // Initialize Tabs
    $(".anchors").tabs();
    $("#tabs").tabs();
    
    hookup_arctic_subnav();
    hookup_lightboxes();
    
    $("#arctic_login").submit(function() {
        var params = {};
        $.each($(this).serializeArray(), function(i, field) {
            params[field.name] = field.value;
        });
        $.post(this.action, params,
            function(data, textStatus) {
                if (data.lightbox) {
                    var lightbox = new Lightbox();
                    lightbox.setTitle(data.lightbox.title);
                    lightbox.onFirstLoad(function() { fuck(lightbox); });
                    lightbox.show({html: data.lightbox.data});
                }
                else if (data.redirect) {
                    window.location.href = data.redirect;
                }
            }
        );
        return false;
    });
});