jquery-fracs-0.15.0.demo.main.js Maven / Gradle / Ivy

Go to download
(function () {
'use strict';

var $ = jQuery;

function round(value, decs) {

    var pow;

    if (isNaN(decs) || decs <= 0) {
        return Math.round(value);
    }
    pow = Math.pow(10, decs);
    return Math.round(value * pow) / pow;
}

function color(r1, g1, b1, r2, g2, b2, frac) {

    var invFrac = 1 - frac;
    var r = Math.floor(r1 * invFrac + r2 * frac);
    var g = Math.floor(g1 * invFrac + g2 * frac);
    var b = Math.floor(b1 * invFrac + b2 * frac);

    return 'rgb(' + r + ',' + g + ',' + b + ')';
}

function generateContent() {

    var $body = $('body');
    var $panelFracs = $('.panel .fracs');
    var i, $section, $label, $ul, $rectsul, $li;

    function scrollToFn($target) {

        return function () { $target.fracs('scrollToThis', 50, 50, 500); };
    }


    for (i = 1; i < 10; i += 1) {

        //section
        $section = $('')
            .appendTo($body)
            .width(i * 300)
            .height(Math.round(Math.random() * 600 + 100));

        $label = $('#' + i + '')
            .appendTo($section);

        $ul = $('')
            .appendTo($label)
            .append($(' of max possible visibility'))
            .append($(' visible'))
            .append($(' of viewport'));

        $rectsul = $('visible rect ')
            .appendTo($ul)
            .find('ul')
                .append($('document space '))
                .append($('element space '))
                .append($('viewport space '));

        // panel
        $li = $('')
            .appendTo($panelFracs)
            .append($('' + i + ''))
            .append($(''));

        $section.add($li).click(scrollToFn($section));

        $section.data('panel', $li);
    }


    var box1top = $('#box-1').offset().top;
    var box1height = $('#box-1').height();
    var $elOut = $('')
                    .append('simple "<div> as viewport" demo')
                    .css({
                        top: box1top,
                        height: box1height
                    })
                    .appendTo($body);

    for (i = 1; i < 10; i += 1) {
        $('')
            .css({
                width: i * 80,
                height: Math.round(Math.random() * 60 + 10)
            })
            .appendTo($elOut);
    }
    $('