kuasha/cosmos

View on GitHub
samples/adminpanel/app/bower_components/jquery-ui/ui/effect-explode.js

Summary

Maintainability
F
4 days
Test Coverage
/*!
 * jQuery UI Effects Explode 1.11.0
 * http://jqueryui.com
 *
 * Copyright 2014 jQuery Foundation and other contributors
 * Released under the MIT license.
 * http://jquery.org/license
 *
 * http://api.jqueryui.com/explode-effect/
 */
(function( factory ) {
    if ( typeof define === "function" && define.amd ) {

        // AMD. Register as an anonymous module.
        define([
            "jquery",
            "./effect"
        ], factory );
    } else {

        // Browser globals
        factory( jQuery );
    }
}(function( $ ) {

return $.effects.effect.explode = function( o, done ) {

    var rows = o.pieces ? Math.round( Math.sqrt( o.pieces ) ) : 3,
        cells = rows,
        el = $( this ),
        mode = $.effects.setMode( el, o.mode || "hide" ),
        show = mode === "show",

        // show and then visibility:hidden the element before calculating offset
        offset = el.show().css( "visibility", "hidden" ).offset(),

        // width and height of a piece
        width = Math.ceil( el.outerWidth() / cells ),
        height = Math.ceil( el.outerHeight() / rows ),
        pieces = [],

        // loop
        i, j, left, top, mx, my;

    // children animate complete:
    function childComplete() {
        pieces.push( this );
        if ( pieces.length === rows * cells ) {
            animComplete();
        }
    }

    // clone the element for each row and cell.
    for ( i = 0; i < rows ; i++ ) { // ===>
        top = offset.top + i * height;
        my = i - ( rows - 1 ) / 2 ;

        for ( j = 0; j < cells ; j++ ) { // |||
            left = offset.left + j * width;
            mx = j - ( cells - 1 ) / 2 ;

            // Create a clone of the now hidden main element that will be absolute positioned
            // within a wrapper div off the -left and -top equal to size of our pieces
            el
                .clone()
                .appendTo( "body" )
                .wrap( "<div></div>" )
                .css({
                    position: "absolute",
                    visibility: "visible",
                    left: -j * width,
                    top: -i * height
                })

            // select the wrapper - make it overflow: hidden and absolute positioned based on
            // where the original was located +left and +top equal to the size of pieces
                .parent()
                .addClass( "ui-effects-explode" )
                .css({
                    position: "absolute",
                    overflow: "hidden",
                    width: width,
                    height: height,
                    left: left + ( show ? mx * width : 0 ),
                    top: top + ( show ? my * height : 0 ),
                    opacity: show ? 0 : 1
                }).animate({
                    left: left + ( show ? 0 : mx * width ),
                    top: top + ( show ? 0 : my * height ),
                    opacity: show ? 1 : 0
                }, o.duration || 500, o.easing, childComplete );
        }
    }

    function animComplete() {
        el.css({
            visibility: "visible"
        });
        $( pieces ).remove();
        if ( !show ) {
            el.hide();
        }
        done();
    }
};

}));