/*
 * jQuery.fracs 0.10
 * http://larsjung.de/fracs
 * 
 * provided under the terms of the MIT License
 */

/*
 * ModPlug 0.4
 * http://larsjung.de/modplug
 *
 * provided under the terms of the MIT License
 */

(function ($) {
    "use strict";
    /*globals jQuery */
    /*jslint confusion: true */

    var reference = "_mp_api";

    $.ModPlug = $.ModPlug || {
        plugin: function (namespace, options) {

            if (!namespace || $[namespace] || $.fn[namespace]) {
                // $.error("No namespace specified, or a plugin already exists on 'jQuery." + namespace + "'");
                return !namespace ? 1 : ($[namespace] ? 2 : 3);
            }

            var defaults = {
                    statics: {},
                    methods: {},
                    defaultStatic: undefined,
                    defaultMethod: undefined
                },
                settings = $.extend({}, defaults, options),
                staticPlug = function () {

                    var args, defaultMethod;

                    args = Array.prototype.slice.call(arguments);
                    defaultMethod = settings.defaultStatic instanceof Function ? settings.defaultStatic.apply(this, args) : settings.defaultStatic;
                    if (staticPlug[defaultMethod] instanceof Function) {
                        return staticPlug[defaultMethod].apply(this, args);
                    }
                    $.error("Static method defaulted to '" + defaultMethod + "' does not exist on 'jQuery." + namespace + "'");
                },
                methods = {},
                methodPlug = function (method) {

                    var args, defaultMethod;

                    if (methods[method] instanceof Function) {
                        args = Array.prototype.slice.call(arguments, 1);
                        return methods[method].apply(this, args);
                    }

                    args = Array.prototype.slice.call(arguments);
                    defaultMethod = settings.defaultMethod instanceof Function ? settings.defaultMethod.apply(this, args) : settings.defaultMethod;
                    if (methods[defaultMethod] instanceof Function) {
                        return methods[defaultMethod].apply(this, args);
                    }
                    $.error("Method '" + method + "' defaulted to '" + defaultMethod + "' does not exist on 'jQuery." + namespace + "'");
                },
                api = {
                    addStatics: function (newStatics) {

                        $.extend(staticPlug, newStatics);
                        staticPlug[reference] = api;
                        return this;
                    },
                    addMethods: function (newMethods) {

                        $.extend(methods, newMethods);
                        return this;
                    }
                };

            api.addStatics(settings.statics).addMethods(settings.methods);
            $[namespace] = staticPlug;
            $.fn[namespace] = methodPlug;
            return 0;
        },
        module: function (namespace, options) {

            if (!$[namespace] || !$[namespace][reference]) {
                // $.error("No ModPlug plugin exists on 'jQuery." + namespace + "'");
                return !$[namespace] ? 1 : 2;
            }

            var defaults = {
                    statics: {},
                    methods: {}
                },
                settings = $.extend({}, defaults, options);

            $[namespace][reference].addStatics(settings.statics).addMethods(settings.methods);
            return 0;
        }
    };

}(jQuery));

/*
 * jQuery.fracs - Core API
 */

(function ($) {
    "use strict";
    /*globals jQuery, HTMLElement */
    /*jslint browser: true, vars: true */

    
    var FracsData = function (htmlElementOrRect) {
    
        var target = htmlElementOrRect,
            callbacks = [],
            prevFracs;
    
        this.size = function () {
    
            return callbacks.length;
        };
    
        this.bind = function (callback) {
    
            if (callback instanceof Function && $.inArray(callback, callbacks) === -1) {
                callbacks.push(callback);
            }
        };
    
        this.unbind = function (callback) {
    
            if (callback instanceof Function) {
                var idx = $.inArray(callback, callbacks);
                if (idx >= 0) {
                    callbacks.splice(idx, 1);
                }
            } else {
                callbacks = [];
            }
        };
    
        this.check = function () {
    
            var rect = target instanceof HTMLElement ? $.fracs.rect(target) : target,
                fracs = $.fracs.fracs(rect, $.fracs.viewport());
    
            if (!prevFracs || !prevFracs.equals(fracs)) {
                $.each(callbacks, function (idx, callback) {
                    callback.call(target, fracs, prevFracs);
                });
                prevFracs = fracs;
            }
        };
    };

    
    var Rect = function (left, top, width, height) {
    
        var fracsData;
    
        this.left = Math.round(left);
        this.top = Math.round(top);
        this.width = Math.round(width);
        this.height = Math.round(height);
        this.right = this.left + this.width;
        this.bottom = this.top + this.height;
    
        this.equals = function (that) {
    
            return this.left === that.left && this.top === that.top && this.width === that.width && this.height === that.height;
        };
    
        this.area = function () {
    
            return this.width * this.height;
        };
    
        this.intersection = function (rect) {
    
            var left = Math.max(this.left, rect.left),
                right = Math.min(this.right, rect.right),
                top = Math.max(this.top, rect.top),
                bottom = Math.min(this.bottom, rect.bottom),
                width = right - left,
                height = bottom - top;
    
            return (width >= 0 && height >= 0) ? new Rect(left, top, width, height) : undefined;
        };
    
        this.envelope = function (rect) {
    
            var left = Math.min(this.left, rect.left),
                right = Math.max(this.right, rect.right),
                top = Math.min(this.top, rect.top),
                bottom = Math.max(this.bottom, rect.bottom),
                width = right - left,
                height = bottom - top;
    
            return new Rect(left, top, width, height);
        };
    
        this.bind = function (callback) {
    
            if (!fracsData) {
                fracsData = new FracsData(this);
                $(window).bind("scroll resize", fracsData.check);
            }
            fracsData.bind(callback);
        };
    
        this.unbind = function (callback) {
    
            if (fracsData) {
                fracsData.unbind(callback);
                if (fracsData.size() === 0) {
                    $(window).unbind("scroll resize", fracsData.check);
                    fracsData = undefined;
                }
            }
        };
    
        this.check = function () {
    
            if (fracsData) {
                fracsData.check();
            }
        };
    
        this.fracs = function () {
    
            $.fracs.fracs(this);
        };
    };

    
    var FracsResult = function (rectDocument, rectElement, rectViewport, visible, viewport, possible) {
    
        /*jslint confusion: true */
    
        if (!rectDocument || !rectElement || !rectViewport || !visible || !viewport || !possible) {
            this.rects = undefined;
            this.visible = 0;
            this.viewport = 0;
            this.possible = 0;
        } else {
            this.rects = {
                document: rectDocument,
                element: rectElement,
                viewport: rectViewport
            };
            this.visible = visible;
            this.viewport = viewport;
            this.possible = possible;
        }
    
        this.equals = function (that) {
    
            return this.fracsEqual(that) && this.rectsEqual(that);
        };
    
        this.fracsEqual = function (that) {
    
            return this.visible === that.visible && this.viewport === that.viewport && this.possible === that.possible;
        };
    
        this.rectsEqual = function (that) {
    
            if (!this.rects || !that.rects) {
                return this.rects === that.rects;
            }
            return this.rects.document.equals(that.rects.document)
                && this.rects.element.equals(that.rects.element)
                && this.rects.viewport.equals(that.rects.viewport);
        };
    };

    
    var ScrollState = function () {
    
        var document = $.fracs.document(),
            viewport = $.fracs.viewport(),
            width = document.width - viewport.width,
            height = document.height - viewport.height;
    
        this.width = width <= 0 ? undefined : viewport.left / width;
        this.height = height <= 0 ? undefined : viewport.top / height;
        this.left = viewport.left;
        this.top = viewport.top;
        this.right = document.right - viewport.right;
        this.bottom = document.bottom - viewport.bottom;
    
        this.equals = function (that) {
    
            return this.width === that.width && this.height === that.height
                && this.left === that.left && this.top === that.top
                && this.right === that.right && this.bottom === that.bottom;
        };
    };

    
    var ScrollStateTracker = function () {
    
        var prevState,
            callbacks = [],
            check = function () {
    
                var state = new ScrollState();
                if (!prevState || !prevState.equals(state)) {
                    $.each(callbacks, function (idx, callback) {
                        callback.call(window, state, prevState);
                    });
                    prevState = state;
                }
            };
    
        $(window).bind("resize scroll load", check);
    
        this.bind = function (callback) {
    
            callbacks.push(callback);
        };
    };

    
    // @beta
    var FracsElement = function (htmlElement, fracs) {
    
        this.element = htmlElement;
        this.fracs = fracs;
    
        this.update = function () {
    
            var fracs = $.fracs.fracs(this.element),
                changed = !this.fracs || !this.fracs.equals(fracs);
            this.fracs = fracs;
            return changed;
        };
    };

    
    // @beta
    var FracsGroup = function (htmlElements, property, callback) {
    
        var THIS = this,
            targets = [],
            prevBest = null;
    
        $.each(htmlElements, function (idx, element) {
            if (element instanceof HTMLElement) {
                targets.push(new FracsElement(element));
            }
        });
    
        this.check = function () {
    
            var best,
                viewport = $.fracs.viewport();
    
            $.each(targets, function (idx, target) {
                target.update();
                if (!best || target.fracs[property] > best.fracs[property]) {
                    best = target;
                }
            });
    
    
            if (best && best.fracs[property] === 0) {
                best = null;
            }
    
            if (prevBest !== best) {
                callback.call(THIS, best, prevBest);
                prevBest = best;
            }
        };
    };


    var $document = $(document),
        $window = $(window),
        $htmlBody = $("html,body"),
        scrollStateTracker,
        dataNs = "fracs",
        statics = {
            document: function () {

                /*jslint confusion: true */
                return new Rect(0, 0, $document.width(), $document.height());
            },
            viewport: function () {

                /*jslint confusion: true */
                return new Rect($window.scrollLeft(), $window.scrollTop(), $window.width(), $window.height());
            },
            rect: function (htmlElement) {

                var $target = $(htmlElement),
                    offset = $target.offset();

                if (!$target.is(":visible")) {
                    return new Rect(0, 0, 0, 0);
                }
                return new Rect(offset.left, offset.top, $target.outerWidth(), $target.outerHeight());
            },
            fracs: function (rect, viewport) {

                var intersection, intersectionElementSpace, intersectionViewportSpace, intersectionArea, possibleArea;

                rect = rect instanceof HTMLElement ? statics.rect(rect) : rect;
                viewport = viewport || statics.viewport();
                intersection = rect.intersection(viewport);

                if (!intersection) {
                    return new FracsResult();
                }

                intersectionElementSpace = new Rect(intersection.left - rect.left, intersection.top - rect.top, intersection.width, intersection.height);
                intersectionViewportSpace = new Rect(intersection.left - viewport.left, intersection.top - viewport.top, intersection.width, intersection.height);
                intersectionArea = intersection.area();
                possibleArea = Math.min(rect.width, viewport.width) * Math.min(rect.height, viewport.height);

                return new FracsResult(
                    intersection,
                    intersectionElementSpace,
                    intersectionViewportSpace,
                    intersectionArea / rect.area(),
                    intersectionArea / viewport.area(),
                    intersectionArea / possibleArea
               );
            },
            round: function (value, decs) {

                if (isNaN(decs) || decs <= 0) {
                    return Math.round(value);
                }
                return Math.round(value * Math.pow(10, decs)) / Math.pow(10, decs);
            },
            scrollTo: function (left, top, duration) {

                duration = isNaN(duration) ? 1000 : duration;
                $htmlBody.stop(true).animate({ scrollLeft: left, scrollTop: top }, duration);
            },
            scroll: function (left, top, duration) {

                duration = isNaN(duration) ? 1000 : duration;
                $htmlBody.stop(true).animate({ scrollLeft: $window.scrollLeft() + left, scrollTop: $window.scrollTop() + top }, duration);
            },
            scrollState: function (callback) {

                if (callback instanceof Function) {
                    scrollStateTracker = scrollStateTracker || new ScrollStateTracker();
                    scrollStateTracker.bind(callback);
                } else {
                    return new ScrollState();
                }
            }
        },
        methods = {
            bind: function (callback) {

                return this.each(function () {

                    var $this = $(this),
                        data = $this.data(dataNs);

                    if (!data) {
                        data = new FracsData(this);
                        $this.data(dataNs, data);
                        $window.bind("scroll resize", data.check);
                    }
                    data.bind(callback);
                });
            },
            unbind: function (callback) {

                return this.each(function () {

                    var $this = $(this),
                        data = $this.data(dataNs);

                    if (data) {
                        data.unbind(callback);
                        if (data.size() === 0) {
                            $this.removeData(dataNs);
                            $window.unbind("scroll resize", data.check);
                        }
                    }
                });
            },
            check: function () {

                return this.each(function () {

                    var data = $(this).data(dataNs);

                    if (data) {
                        data.check();
                    }
                });
            },
            fracs: function () {

                return statics.fracs(statics.rect(this.get(0)), statics.viewport());
            },
            rect: function () {

                return statics.rect(this.get(0));
            },
            max: function (property, callback) {

                if (callback instanceof Function) {

                    var data = new FracsGroup(this, property, callback);

                    $window.bind("scroll resize", data.check);
                    data.check();
                    return this;
                } else {
                    var obj, elements, maxValue;

                    if ($.inArray(property, [ "possible", "visible", "viewport" ]) >= 0) {
                        obj = "fracs";
                    } else if ($.inArray(property, [ "width", "height", "left", "right", "top", "bottom" ]) >= 0) {
                        obj = "rect";
                    } else {
                        return this;
                    }

                    this.each(function () {

                        var fracs = statics[obj](this);

                        if (!maxValue || fracs[property] > maxValue) {
                            elements = [ this ];
                            maxValue = fracs[property];
                        } else if (fracs[property] === maxValue) {
                            elements.push(this);
                        }
                    });
                    return $(elements);
                }
            },
            min: function (property) {

                var obj, elements, minValue;

                if ($.inArray(property, [ "possible", "visible", "viewport" ]) >= 0) {
                    obj = "fracs";
                } else if ($.inArray(property, [ "width", "height", "left", "right", "top", "bottom" ]) >= 0) {
                    obj = "rect";
                } else {
                    return this;
                }

                this.each(function () {

                    var fracs = statics[obj](this);

                    if (!minValue || fracs[property] < minValue) {
                        elements = [ this ];
                        minValue = fracs[property];
                    } else if (fracs[property] === minValue) {
                        elements.push(this);
                    }
                });
                return $(elements);
            },
            envelope: function () {

                var envelope, rect;

                this.each(function () {
                    rect = statics.rect(this);
                    envelope = !envelope ? rect : envelope.envelope(rect);
                });
                return envelope;
            },
            scrollTo: function (paddingLeft, paddingTop, duration) {

                var rect;

                paddingLeft = paddingLeft || 0;
                paddingTop = paddingTop || 0;
                rect = statics.rect(this.get(0));

                statics.scrollTo(rect.left - paddingLeft, rect.top - paddingTop, duration);
                return this;
            },
            softLink: function (paddingLeft, paddingTop, duration) {

                return this.filter("a[href^=#]").each(function () {
                    var $a = $(this),
                        href = $a.attr("href");
                    $a.click(function () {
                        $(href).fracs("scrollTo", paddingLeft, paddingTop, duration);
                    });
                });
            }
        },
        defaultStatic = function () {

            return "fracs";
        },
        defaultMethod = function () {

            if (arguments.length === 0) {
                return "fracs";
            } else if (arguments[0] instanceof Function) {
                return "bind";
            }
        };


    $.ModPlug.plugin("fracs", {
        statics: statics,
        methods: methods,
        defaultStatic: defaultStatic,
        defaultMethod: defaultMethod
    });

}(jQuery));

/*
 * jQuery.fracs - Outline API
 */

(function ($) {
    "use strict";

    /*globals jQuery */
    /*jslint browser: true, vars: true */

    
    var Outline = function (canvas, options) {
    
        if (!(canvas instanceof HTMLElement && canvas.nodeName.toLowerCase() === "canvas")) {
            return undefined;
        }
    
    
        var defaults = {
                crop: false,
                duration: 0,
                focusWidth: 0.5,
                focusHeight: 0.5,
                autoFocus: true,
                styles: [ {
                    selector: "header,footer,section,article",
                    fillStyle: "rgb(230,230,230)"
                }, {
                    selector: "h1",
                    fillStyle: "rgb(240,140,060)"
                }, {
                    selector: "h2",
                    fillStyle: "rgb(200,100,100)"
                }, {
                    selector: "h3",
                    fillStyle: "rgb(100,200,100)"
                }, {
                    selector: "h4",
                    fillStyle: "rgb(100,100,200)"
                } ],
                viewportStyle: {
                    fillStyle: "rgba(228,77,38,0.3)"
                },
                viewportDragStyle: {
                    fillStyle: "rgba(228,77,38,0.6)"
                },
                invertViewport: false
            },
            settings = $.extend({}, defaults, options),
            $window = $(window),
            $htmlBody = $("html,body"),
            $canvas = $(canvas),
            width = $canvas.attr("width"),
            height = $canvas.attr("height"),
            context = canvas.getContext("2d"),
            docRect,
            vpRect,
            scale,
            drag = false,
            focusWidth,
            focusHeight,
            scroll = function (event) {
    
                var r, x, y;
    
                r = $canvas.fracs("rect");
                x = event.pageX - r.left;
                y = event.pageY - r.top;
                $.fracs.scrollTo(x / scale - vpRect.width * focusWidth, y / scale - vpRect.height * focusHeight, settings.duration);
            },
            drawRect = function (context, rect, strokeWidth, strokeStyle, fillStyle, invert) {
    
                if (strokeWidth !== undefined && scale) {
                    strokeWidth = strokeWidth > 0.2 / scale ? strokeWidth : 0.2 / scale;
                }
    
                if (strokeStyle || fillStyle) {
                    if (invert !== true) {
                            context.beginPath();
                            context.rect(rect.left, rect.top, rect.width, rect.height);
                            if (fillStyle) {
                                context.fillStyle = fillStyle;
                                context.fill();
                            }
                            if (strokeStyle) {
                                context.lineWidth = strokeWidth;
                                context.strokeStyle = strokeStyle;
                                context.stroke();
                            }
                    } else {
                        if (fillStyle) {
                            context.beginPath();
                            context.rect(0, 0, docRect.width, rect.top);
                            context.rect(0, rect.top, rect.left, rect.height);
                            context.rect(rect.right, rect.top, docRect.right - rect.right, rect.height);
                            context.rect(0, rect.bottom, docRect.width, docRect.bottom - rect.bottom);
                            context.fillStyle = fillStyle;
                            context.fill();
                        }
                        if (strokeStyle) {
                            context.beginPath();
                            context.rect(rect.left, rect.top, rect.width, rect.height);
                            context.lineWidth = strokeWidth;
                            context.strokeStyle = strokeStyle;
                            context.stroke();
                        }
                    }
                }
            },
            drawElement = function (context, htmlElement, strokeWidth, strokeStyle, fillStyle) {
    
                var $element = $(htmlElement),
                    rect = $element.fracs("rect");
    
                if ($element.css("visibility") === "hidden") {
                    return;
                }
    
                strokeWidth = strokeWidth === "auto" ? $element.css("border-top-width") : strokeWidth;
                strokeStyle = strokeStyle === "auto" ? $element.css("border-top-color") : strokeStyle;
                fillStyle = fillStyle === "auto" ? $element.css("background-color") : fillStyle;
                drawRect(context, rect, strokeWidth, strokeStyle, fillStyle);
            },
            drawViewport = function () {
    
                var strokeWidth, strokeStyle, fillStyle;
    
                if (drag && settings.viewportDragStyle) {
                    strokeWidth = settings.viewportDragStyle.storkeWidth;
                    strokeStyle = settings.viewportDragStyle.strokeStyle;
                    fillStyle = settings.viewportDragStyle.fillStyle;
                } else {
                    strokeWidth = settings.viewportStyle.storkeWidth;
                    strokeStyle = settings.viewportStyle.strokeStyle;
                    fillStyle = settings.viewportStyle.fillStyle;
                }
                drawRect(context, vpRect, strokeWidth, strokeStyle, fillStyle, settings.invertViewport);
            },
            applyStyles = function (context) {
    
                $.each(settings.styles, function (idx, style) {
                    $(style.selector).each(function () {
                        drawElement(context, this, style.strokeWidth, style.strokeStyle, style.fillStyle);
                    });
                });
            },
            draw = function () {
    
                /*jslint confusion: true */
    
                var scaleX, scaleY;
    
                docRect = $.fracs.document();
                vpRect = $.fracs.viewport();
                scaleX = width / docRect.width;
                scaleY = height / docRect.height;
                scale = scaleX < scaleY ? scaleX : scaleY;
    
                if (settings.crop) {
                    $canvas.attr("width", docRect.width * scale).attr("height", docRect.height * scale);
                }
    
                context.clearRect(0, 0, $canvas.width(), $canvas.height());
    
                context.scale(scale, scale);
                applyStyles(context);
                drawViewport();
                context.scale(1 / scale, 1 / scale);
            },
            init = function () {
    
                $canvas
                    .css("cursor", "pointer")
                    .mousedown(function (event) {
    
                        var r;
    
                        event.preventDefault();
                        drag = true;
                        if (settings.autoFocus) {
                            r = $canvas.fracs("rect");
                            focusWidth = (((event.pageX - r.left) / scale) - vpRect.left) / vpRect.width;
                            focusHeight = (((event.pageY - r.top) / scale) - vpRect.top) / vpRect.height;
                        }
                        if (!settings.autoFocus || focusWidth < 0 || focusWidth > 1 || focusHeight < 0 || focusHeight > 1) {
                            focusWidth = settings.focusWidth;
                            focusHeight = settings.focusHeight;
                        }
                        scroll(event);
                        $canvas.css("cursor", "crosshair").addClass("dragOn");
                        $htmlBody.css("cursor", "crosshair");
                        $window
                            .bind("mousemove", scroll)
                            .one("mouseup", function (event) {
                                event.preventDefault();
                                $canvas.css("cursor", "pointer").removeClass("dragOn");
                                $htmlBody.css("cursor", "auto");
                                $window.unbind("mousemove", scroll);
                                drag = false;
                                draw();
                            });
                    });
                canvas.onselectstart = function () {
                    return false;
                };
                $window.bind("load resize scroll", draw);
                draw();
            };
    
    
        init();
    
    
        this.draw = draw;
    };


    var dataNs = "outline",
        methods = {
            outline: function (options) {

                return this.each(function () {

                    var outline;

                    if (options === "redraw") {
                        outline = $(this).data(dataNs);
                        if (outline) {
                            outline.draw();
                        }
                    } else {
                        outline = new Outline(this, options);
                        if (outline) {
                            $(this).data(dataNs, outline);
                        }
                    }
                });
            }
        };


    $.ModPlug.module("fracs", {
        methods: methods
    });

}(jQuery));