Mithril element remove animation

readme.md

Parameters

param	type	description
accessor	function	accessor for the element whose style should be modified
style	Object or Function	styles to apply
rm	Function	function to remove element from view (usually from an array)

#Usage

  m('.list', [
    m('.item', [
      m('.btn.remove', {
        onclick: remove_style({
          accessor: function(ev){ return ev.target.parentNode;},
          style: {opacity: '0'}
        })
      })
    ])
  ])

remove_element.js

function remove_style( options ) {
    options = options || {};
    return function ( ev ) {
        if ( !options.style ) return;
        el = options.accessor ? options.accessor( ev ) : ev.target;
        if ( !el.addEventListener ) return;
        m.startComputation();
        var applied = [];
        var style = typeof options.style == 'function' ? options.style() : options.style || {};
        for ( var name in style ) {
            applied.push( name );
            el.style[ name ] = style[ name ];
        }
        var compStyle = window.getComputedStyle( el );
        var props = compStyle[ 'transition-property' ].split( ', ' );
        var amount = 0;
        for ( var i = 0; i < props.length; ++i ) {
            if ( ~applied.indexOf( props[ i ] ) ) ++amount;
        }
        el.addEventListener( 'transitionend', function ( ev ) {
            if ( ev.target === el ) --amount;
            if ( amount === 0 ) {
                if ( options.rm ) options.rm();
                m.endComputation();
            }
        } );
    };
}

module.exports = remove_style;