1 line
2.0 KiB
JavaScript
1 line
2.0 KiB
JavaScript
|
window.VT=window.VT||{},VT.AppFlip=function(a,b){function c(){var c=new Map;return a.querySelectorAll(b.selector).forEach(function(a){var b=a.dataset.key||a,d=a.style.transform?a.style.transform.replace(/^.*scale\(1\)/,""):"";c.set(b,{key:b,el:a,rect:a.getBoundingClientRect(),ancestor:null,transform:d})}),d(c),c}function d(b){b.forEach(function(c){for(var d=c.el.parentNode;d&&d!==a;){var e=b.get(d.dataset.key||d);if(e)return void(c.ancestor=e);d=d.parentNode}})}function e(b,c){function d(a){return!(a.ancestor&&d(a.ancestor))&&!c.has(a.key)}var e=[];return b.forEach(function(b){b.el.classList.contains("_noflip")||!d(b)||(b.el.style.position="fixed",b.el.style.left=b.rect.left+"px",b.el.style.top=b.rect.top+"px",b.el.style.width=b.rect.right-b.rect.left+"px",b.el.style.transition="none",b.el.style.transform="",a.appendChild(b.el),e.push(b))}),e}function f(a,b){function c(d){if(!d.calculated){d.calculated=!0;var e=a.get(d.key);e?(d.deltaX=e.rect.left-d.rect.left,d.deltaY=e.rect.top-d.rect.top,d.ancestor&&(c(d.ancestor),d.deltaX-=d.ancestor.deltaX,d.deltaY-=d.ancestor.deltaY)):(d.appear=!0,d.deltaX=0,d.deltaY=0)}}var d=[];return b.forEach(function(a){a.el.classList.contains("_noflip")||(c(a),a.appear?(a.el.style.transition="none",a.el.style.opacity="0",d.push(a)):(0!==a.deltaX||0!==a.deltaY)&&(a.el.style.transition="none",a.el.style.transform="translate("+a.deltaX+"px, "+a.deltaY+"px) scale(1) "+a.transform,d.push(a)))}),d}function g(a){a.forEach(function(a){a.el.style.transition="",a.el.style.opacity="0"}),setTimeout(function(){a.forEach(function(a){a.el.parentNode&&a.el.parentNode.removeChild(a.el)})},b.removeTimeout)}function h(a){a.forEach(function(a){a.el.style.transition="",a.el.style.transform=a.transform,a.el.style.opacity=""})}var i,j=0===b.initialDelay,k=0;setTimeout(function(){j=!0},b.initialDelay||100),a.addEventListener("beforeFlip",function(){!j||1<++k||(i=c())}),a.addEventListener("flip",function(){if(j&&!(0<--k)){var a=c(),b=e(i,a),d=f(i,a);requestAnimationFrame(function(){requestAnimationFrame(function(){g(b),h(d),i=null})})}})};
|