/**
 * Keep the content positioned vertically at a nice fraction of the viewport,
 * slightly above center, through viewport size changes. Keep the horizontal
 * position centered.
 *
 * If the calculated position is higher than the original position determined
 * by CSS, use the original position instead.
 *
 */


jQuery(document).ready(function($) {

    // Since there is only one of these, don't worry about messing with the prototype.
    var repositioner = function() {
        this.$         = $("#content");
        this.$viewport = $(window);
        this.ratio     = 5 / 12;

        this.props = {
            "height" : {
                "outer" : {
                    "half" : this.$.outerHeight(true) / 2,
                },
                "inner" : {
                    "half" : this.$.innerHeight() / 2,
                },
            },
            "width" : {
                "outer" : {
                    "half" : this.$.outerWidth(true) / 2,
                },
            },
            "margin" : {
                "top"    : this.$.css("margin-top"),
                "bottom" : this.$.css("margin-bottom"),
            },
            "pos" : {
                "type" : this.$.css("position"),
                "top"  : this.$.css("top"),
                "left" : this.$.css("left"),
            },
            "offset" : this.$.offset(),
        };

        this.reposition = function() {
            var new_top =
                (this.ratio * this.$viewport.height())
                - this.props.height.outer.half;

            if (new_top > this.props.offset.top) {
                this.$
                    .css("margin-top",    "0")
                    .css("margin-bottom", "0")
                    .css("position",      "absolute")
                    .css("top",           new_top + "px")
                    .css("left",
                            (
                                (this.$viewport.width() / 2)
                                - this.props.width.outer.half
                            )
                            + "px"
                    );
            }
            else {
                this.$
                    .css("margin-top",    this.props.margin.top)
                    .css("margin-bottom", this.props.margin.bottom)
                    .css("position",      this.props.pos.type)
                    .css("top",           this.props.pos.top)
                    .css("left",          this.props.pos.left);
            }
        };

        this.listen = function() {
            this.$viewport.resize($.proxy(this.reposition, this));
            return this;
        };
    };

    try {
        (new repositioner()).listen().reposition();
    }
    catch(e) {}

});