# Code coverage report for src/dom/PosAnimation.js

## Statements: 3.33% (1 / 30) Branches: 0% (0 / 10) Functions: 0% (0 / 4) Lines: 3.57% (1 / 28)

All files » src/dom/ » PosAnimation.js

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76

    1

     /*
     * L.PosAnimation is used by Leaflet internally for pan animations.
     */

    L.PosAnimation = L.Class.extend({
    	includes: L.Mixin.Events,

    	run: function (el, newPos, duration, easeLinearity) { // (HTMLElement, Point[, Number, Number])
    		this.stop();

    		this._el = el;
    		this._inProgress = true;

    		this.fire('start');

    		el.style[L.DomUtil.TRANSITION] = 'all ' + (duration || 0.25) +
    		        's cubic-bezier(0,0,' + (easeLinearity || 0.5) + ',1)';

    		L.DomEvent.on(el, L.DomUtil.TRANSITION_END, this._onTransitionEnd, this);
    		L.DomUtil.setPosition(el, newPos);

    		// toggle reflow, Chrome flickers for some reason if you don't do this
    		L.Util.falseFn(el.offsetWidth);

    		// there's no native way to track value updates of transitioned properties, so we imitate this
    		this._stepTimer = setInterval(L.bind(this.fire, this, 'step'), 50);
    	},

    	stop: function () {
    		if (!this._inProgress) { return; }

    		// if we just removed the transition property, the element would jump to its final position,
    		// so we need to make it stay at the current position

    		L.DomUtil.setPosition(this._el, this._getPos());
    		this._onTransitionEnd();
    		L.Util.falseFn(this._el.offsetWidth); // force reflow in case we are about to start a new animation
    	},

    	// you can't easily get intermediate values of properties animated with CSS3 Transitions,
    	// we need to parse computed style (in case of transform it returns matrix string)

    	_transformRe: /(-?[\d\.]+), (-?[\d\.]+)\)/,

    	_getPos: function () {
    		var left, top, matches,
    		    el = this._el,
    		    style = window.getComputedStyle(el);

    		if (L.Browser.any3d) {
    			matches = style[L.DomUtil.TRANSFORM].match(this._transformRe);
    			left = parseFloat(matches[1]);
    			top  = parseFloat(matches[2]);
    		} else {
    			left = parseFloat(style.left);
    			top  = parseFloat(style.top);
    		}

    		return new L.Point(left, top, true);
    	},

    	_onTransitionEnd: function () {
    		L.DomEvent.off(this._el, L.DomUtil.TRANSITION_END, this._onTransitionEnd, this);

    		if (!this._inProgress) { return; }
    		this._inProgress = false;

    		this._el.style[L.DomUtil.TRANSITION] = '';

    		clearInterval(this._stepTimer);

    		this.fire('step').fire('end');
    	}

    });