@simhub2/justflipit 3.0.0

package/src/justFlipIt-modern.js

@@ -0,0 +1,483 @@
+/*!
+ * Modern justFlipIt v3.0.0
+ * https://github.com/SimHub/justFlipIt
+ *
+ * Copyright simon Lackmann
+ * Released under the MIT license
+ *
+ * Date: 2023
+ */
+
+(function (root, factory) {
+  if (typeof define === "function" && define.amd) {
+    define([], factory);
+  } else if (typeof module === "object" && module.exports) {
+    module.exports = factory();
+  } else {
+    root.justFlipIt = factory();
+  }
+})(typeof self !== "undefined" ? self : this, function () {
+  "use strict";
+
+  // Feature detection
+  const supportsGrid =
+    typeof CSS !== "undefined" &&
+    CSS.supports &&
+    CSS.supports("display", "grid");
+  const supportsWebAnimations =
+    typeof Element !== "undefined" && "animate" in Element.prototype;
+  const supportsCustomProperties =
+    window.CSS && CSS.supports && CSS.supports("color", "var(--test)");
+
+  // Style generation based on browser support
+  function generateStyles() {
+    // Base styles that work everywhere
+    let baseStyles =
+      "._justFlipIt_panel {perspective:1000px;-webkit-perspective:1000px;-moz-perspective:1000px;position:relative;}" +
+      "._justFlipIt_panel .front{height:inherit;width:inherit;position:absolute;top:0;z-index:900;transform-style:preserve-3d;backface-visibility:hidden;transition:transform .4s ease-in-out;}" +
+      "._justFlipIt_panel .back, ._justFlipIt_panel .backY{height:inherit;width:inherit;position:absolute;top:0;z-index:1000;transform-style:preserve-3d;backface-visibility:hidden;transition:transform .4s ease-in-out;}";
+
+    // Add prefixed versions for older browsers
+    let prefixedStyles =
+      "._justFlipIt_panel .front{-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-webkit-transition:transform .4s ease-in-out;-moz-transition:transform .4s ease-in-out;}" +
+      "._justFlipIt_panel .back, ._justFlipIt_panel .backY{-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-webkit-transition:transform .4s ease-in-out;-moz-transition:transform .4s ease-in-out;}";
+
+    // X-axis rotations
+    let xAxisStyles =
+      "._justFlipIt_panel .back{transform:rotateX(-180deg);-webkit-transform:rotateX(-180deg);-moz-transform:rotateX(-180deg);}" +
+      "._justFlipIt_panel._flip_ .front{transform:rotateX(180deg);-webkit-transform:rotateX(180deg);-moz-transform:rotateX(180deg);}" +
+      "._justFlipIt_panel._flip_ .back{transform:rotateX(0);-webkit-transform:rotateX(0);-moz-transform:rotateX(0);}";
+
+    // Y-axis rotations
+    let yAxisStyles =
+      "._justFlipIt_panel .backY{transform:rotateY(-180deg);-webkit-transform:rotateY(-180deg);-moz-transform:rotateY(-180deg);}" +
+      "._justFlipIt_panel._flipY_ .front{transform:rotateY(180deg);-webkit-transform:rotateY(180deg);-moz-transform:rotateY(180deg);}" +
+      "._justFlipIt_panel._flipY_ .backY{transform:rotateY(0);-webkit-transform:rotateY(0);-moz-transform:rotateY(0);}";
+
+    // PATCH: Transparency-Style
+    let transparentStyle =
+      "._justFlipIt_panel {background: transparent !important; box-shadow: none !important;}" +
+      "._justFlipIt_panel > * {box-sizing: border-box;}";
+
+    return (
+      baseStyles + prefixedStyles + xAxisStyles + yAxisStyles + transparentStyle
+    );
+  }
+
+  // Add styles to document head
+  function addStyles() {
+    if (document.querySelector('[data-justflipitstyle="justFlipIt"]')) {
+      return; // Styles already added
+    }
+
+    const styleElement = document.createElement("style");
+    styleElement.setAttribute("data-justflipitstyle", "justFlipIt");
+    styleElement.textContent = generateStyles();
+
+    document.head.appendChild(styleElement);
+  }
+
+  // Helper functions to replace jQuery
+  function getStyle(element, property) {
+    return window.getComputedStyle(element, null).getPropertyValue(property);
+  }
+
+  function addClass(element, className) {
+    if (element.classList) {
+      element.classList.add(className);
+    } else {
+      element.className += " " + className;
+    }
+  }
+
+  function removeClass(element, className) {
+    if (element.classList) {
+      element.classList.remove(className);
+    } else {
+      element.className = element.className.replace(
+        new RegExp(
+          "(^|\\b)" + className.split(" ").join("|") + "(\\b|$)",
+          "gi",
+        ),
+        " ",
+      );
+    }
+  }
+
+  function toggleClass(element, className) {
+    if (element.classList) {
+      element.classList.toggle(className);
+    } else {
+      var classes = element.className.split(" ");
+      var existingIndex = classes.indexOf(className);
+
+      if (existingIndex >= 0) {
+        classes.splice(existingIndex, 1);
+      } else {
+        classes.push(className);
+      }
+
+      element.className = classes.join(" ");
+    }
+  }
+
+  function hasClass(element, className) {
+    if (element.classList) {
+      return element.classList.contains(className);
+    } else {
+      return new RegExp("(^| )" + className + "( |$)", "gi").test(
+        element.className,
+      );
+    }
+  }
+
+  // NEU: Funktion zur Anwendung der benutzerdefinierten Animationseinstellungen
+  function applyAnimationSettings(element, duration, easing) {
+    const transitionValue = `transform ${duration / 1000}s ${easing}`;
+    element.style.transition = transitionValue;
+    element.style.WebkitTransition = transitionValue;
+    element.style.MozTransition = transitionValue;
+  }
+
+  // PATCH: Verbesserte Style-Kopierfunktion
+  function copyStyles(src, dest) {
+    const computed = window.getComputedStyle(src);
+    // Kopiere alle visuellen Eigenschaften
+    const properties = [
+      "background",
+      "backgroundColor",
+      "backgroundImage",
+      "backgroundPosition",
+      "backgroundRepeat",
+      "backgroundSize",
+      "borderRadius",
+      "borderTopLeftRadius",
+      "borderTopRightRadius",
+      "borderBottomLeftRadius",
+      "borderBottomRightRadius",
+      "border",
+      "borderTop",
+      "borderRight",
+      "borderBottom",
+      "borderLeft",
+      "boxShadow",
+      "color",
+      "opacity",
+    ];
+    properties.forEach((prop) => {
+      if (
+        computed[prop] &&
+        computed[prop] !== "none" &&
+        computed[prop] !== "initial" &&
+        computed[prop] !== ""
+      ) {
+        dest.style[prop] = computed[prop];
+      }
+    });
+  }
+
+  // Modern animation with fallback
+  function animateFlip(element, start, end, duration, easing = "ease-in-out") {
+    if (supportsWebAnimations) {
+      // Use Web Animations API
+      const keyframes = [{ transform: start }, { transform: end }];
+
+      const options = {
+        duration: duration,
+        easing: easing,
+        fill: "forwards",
+      };
+
+      return element.animate(keyframes, options);
+    } else {
+      // Fallback to CSS transitions (already set in the CSS)
+      element.style.transform = end;
+      element.style.webkitTransform = end;
+      element.style.mozTransform = end;
+      return null;
+    }
+  }
+
+  // Store for instances
+  const instanceMap = new WeakMap();
+
+  // Main justFlipIt class
+  class JustFlipIt {
+    constructor(element, options = {}) {
+      // Make sure styles are added
+      addStyles();
+
+      this.element = element;
+      this.settings = Object.assign(
+        {},
+        {
+          Template: "", // Template for back side
+          Click: false, // Click behavior
+          FlipX: false, // Flip direction
+          Style: [], // Custom styles
+          Duration: 400, // Animation duration in ms
+          Easing: "ease-in-out", // Animation easing function
+        },
+        options,
+      );
+
+      this.elementWidth = getStyle(element, "width");
+      this.elementHeight = getStyle(element, "height");
+      this.elementBackgroundColor = getStyle(element, "background-color");
+      this.originalClassName = element.className;
+      this.originalTagName = element.tagName.toLowerCase();
+      this.originalId = element.id || "";
+
+      // Set flip direction
+      if (this.settings.FlipX === true) {
+        this.flipClass = "_flip_";
+        this.backClass = "back";
+        this.rotateStart = "rotateX(0deg)";
+        this.rotateFront = "rotateX(180deg)";
+        this.rotateBack = "rotateX(-180deg)";
+        this.rotateReset = "rotateX(0deg)";
+      } else {
+        this.flipClass = "_flipY_";
+        this.backClass = "backY";
+        this.rotateStart = "rotateY(0deg)";
+        this.rotateFront = "rotateY(180deg)";
+        this.rotateBack = "rotateY(-180deg)";
+        this.rotateReset = "rotateY(0deg)";
+      }
+
+      // Initialize flip
+      this._init();
+
+      // Store instance
+      instanceMap.set(element, this);
+    }
+
+    _init() {
+      const originalElement = this.element;
+      const originalClassName = this.originalClassName;
+
+      // Create panel structure
+      const hoverPanel = document.createElement(this.originalTagName);
+      addClass(hoverPanel, "hover");
+      addClass(hoverPanel, "_justFlipIt_panel");
+
+      // Create front wrapper
+      const frontWrapper = document.createElement("div");
+      addClass(frontWrapper, "front");
+
+      // Clone element for back side if no template provided
+      const clone = originalElement.cloneNode(true);
+      clone.className = ""; // Remove classes
+
+      // Create back wrapper
+      const backWrapper = document.createElement("div");
+      addClass(backWrapper, this.backClass);
+      if (originalClassName) {
+        originalClassName.split(" ").forEach((cls) => {
+          if (cls) addClass(backWrapper, cls);
+        });
+      }
+
+      // PATCH: Styles übernehmen und Original komplett transparent machen
+      copyStyles(originalElement, frontWrapper);
+      copyStyles(originalElement, backWrapper);
+
+      // NEU: Wende benutzerdefinierte Animationseinstellungen an
+      applyAnimationSettings(
+        frontWrapper,
+        this.settings.Duration,
+        this.settings.Easing,
+      );
+      applyAnimationSettings(
+        backWrapper,
+        this.settings.Duration,
+        this.settings.Easing,
+      );
+
+      // Mache das Original komplett transparent und ohne Border/Shadow/usw.
+      originalElement.style.all = "inherit"; // Reset alles zur Sicherheit
+      originalElement.style.background = "transparent";
+      originalElement.style.backgroundColor = "transparent";
+      originalElement.style.backgroundImage = "none";
+      originalElement.style.border = "none";
+      originalElement.style.borderRadius = "0";
+      originalElement.style.boxShadow = "none";
+      originalElement.style.outline = "none";
+
+      // If template provided, use that instead of clone
+      if (this.settings.Template) {
+        backWrapper.innerHTML = this.settings.Template;
+      } else {
+        backWrapper.appendChild(clone);
+      }
+
+      // Restructure DOM
+      originalElement.parentNode.insertBefore(hoverPanel, originalElement);
+      frontWrapper.appendChild(originalElement);
+      hoverPanel.appendChild(frontWrapper);
+      hoverPanel.appendChild(backWrapper);
+
+      // Copy original classes to hover panel
+      if (originalClassName) {
+        originalClassName.split(" ").forEach((cls) => {
+          if (cls) addClass(hoverPanel, cls);
+        });
+      }
+
+      // Apply styles
+      hoverPanel.style.width = this.elementWidth;
+      hoverPanel.style.height = this.elementHeight;
+
+      // Apply custom styles
+      if (this.settings.Style && this.settings.Style.length) {
+        this.settings.Style.forEach((styleObj) => {
+          if (styleObj.el) {
+            if (styleObj.el.toLowerCase() === "self") {
+              Object.assign(hoverPanel.style, styleObj.style);
+            } else {
+              const targetElements = hoverPanel.querySelectorAll(styleObj.el);
+              targetElements.forEach((el) => {
+                Object.assign(el.style, styleObj.style);
+              });
+            }
+          }
+        });
+      }
+
+      // Set up event handlers
+      this._setupEvents(hoverPanel);
+
+      // Store reference to original element
+      this.hoverPanel = hoverPanel;
+      this.frontWrapper = frontWrapper;
+      this.backWrapper = backWrapper;
+    }
+
+    _setupEvents(hoverPanel) {
+      if (this.settings.Click === true) {
+        hoverPanel.addEventListener("click", (e) => {
+          e.preventDefault();
+          this._toggleFlip();
+        });
+      } else if (typeof this.settings.Click === "string") {
+        const clickElements = hoverPanel.querySelectorAll(this.settings.Click);
+        clickElements.forEach((el) => {
+          el.addEventListener("click", () => {
+            this._toggleFlip();
+          });
+        });
+      } else {
+        // Default hover behavior
+        hoverPanel.addEventListener("mouseenter", () => {
+          this._flip(true);
+        });
+        hoverPanel.addEventListener("mouseleave", () => {
+          this._flip(false);
+        });
+      }
+    }
+
+    _toggleFlip() {
+      const isFlipped = hasClass(this.hoverPanel, this.flipClass);
+      this._flip(!isFlipped);
+    }
+
+    _flip(shouldFlip) {
+      if (shouldFlip) {
+        addClass(this.hoverPanel, this.flipClass);
+        if (supportsWebAnimations) {
+          animateFlip(
+            this.frontWrapper,
+            this.rotateStart,
+            this.rotateFront,
+            this.settings.Duration,
+            this.settings.Easing,
+          );
+          animateFlip(
+            this.backWrapper,
+            this.rotateBack,
+            this.rotateReset,
+            this.settings.Duration,
+            this.settings.Easing,
+          );
+        }
+      } else {
+        removeClass(this.hoverPanel, this.flipClass);
+        if (supportsWebAnimations) {
+          animateFlip(
+            this.frontWrapper,
+            this.rotateFront,
+            this.rotateStart,
+            this.settings.Duration,
+            this.settings.Easing,
+          );
+          animateFlip(
+            this.backWrapper,
+            this.rotateReset,
+            this.rotateBack,
+            this.settings.Duration,
+            this.settings.Easing,
+          );
+        }
+      }
+    }
+
+    destroy() {
+      const hoverPanel = this.hoverPanel;
+      const originalElement = hoverPanel.querySelector(".front > *");
+
+      // Restore original classes
+      originalElement.className = this.originalClassName;
+
+      // Put the original element back in its place
+      hoverPanel.parentNode.insertBefore(originalElement, hoverPanel);
+      hoverPanel.parentNode.removeChild(hoverPanel);
+
+      // Remove from instance map
+      instanceMap.delete(this.element);
+    }
+  }
+
+  // Main function to initialize justFlipIt
+  function justFlipIt(selector, options = {}) {
+    if (typeof selector === "string") {
+      // If selector is a string, find all matching elements
+      const elements = document.querySelectorAll(selector);
+      return Array.from(elements).map((el) => {
+        return new JustFlipIt(el, options);
+      });
+    } else if (selector instanceof Element) {
+      // If selector is a DOM element
+      return new JustFlipIt(selector, options);
+    } else if (selector.length) {
+      // If selector is array-like (NodeList, HTMLCollection, etc.)
+      return Array.from(selector).map((el) => {
+        return new JustFlipIt(el, options);
+      });
+    }
+  }
+
+  // Destroy method
+  justFlipIt.destroy = function (selector) {
+    if (typeof selector === "string") {
+      // If selector is a string, find all matching elements
+      const elements = document.querySelectorAll(selector);
+      Array.from(elements).forEach((el) => {
+        const instance = instanceMap.get(el);
+        if (instance) instance.destroy();
+      });
+    } else if (selector instanceof Element) {
+      // If selector is a DOM element
+      const instance = instanceMap.get(selector);
+      if (instance) instance.destroy();
+    } else if (selector.length) {
+      // If selector is array-like (NodeList, HTMLCollection, etc.)
+      Array.from(selector).forEach((el) => {
+        const instance = instanceMap.get(el);
+        if (instance) instance.destroy();
+      });
+    }
+  };
+
+  return justFlipIt;
+});

package/src/justFlipIt-modern.min.js

@@ -0,0 +1 @@
+((t,e)=>{"function"==typeof define&&define.amd?define([],e):"object"==typeof module&&module.exports?module.exports=e():t.justFlipIt=e()})("undefined"!=typeof self?self:this,function(){"undefined"!=typeof CSS&&CSS.supports&&CSS.supports("display","grid");let a="undefined"!=typeof Element&&"animate"in Element.prototype;window.CSS&&CSS.supports&&CSS.supports("color","var(--test)");function i(t,e){return window.getComputedStyle(t,null).getPropertyValue(e)}function o(t,e){t.classList?t.classList.add(e):t.className+=" "+e}function n(t,e,s){e=`transform ${e/1e3}s `+s;t.style.transition=e,t.style.WebkitTransition=e,t.style.MozTransition=e}function l(t,e){let s=window.getComputedStyle(t);["background","backgroundColor","backgroundImage","backgroundPosition","backgroundRepeat","backgroundSize","borderRadius","borderTopLeftRadius","borderTopRightRadius","borderBottomLeftRadius","borderBottomRightRadius","border","borderTop","borderRight","borderBottom","borderLeft","boxShadow","color","opacity"].forEach(t=>{s[t]&&"none"!==s[t]&&"initial"!==s[t]&&""!==s[t]&&(e.style[t]=s[t])})}function s(t,e,s,i,r="ease-in-out"){a?t.animate([{transform:e},{transform:s}],{duration:i,easing:r,fill:"forwards"}):(t.style.transform=s,t.style.webkitTransform=s,t.style.mozTransform=s)}let r=new WeakMap;class p{constructor(t,e={}){var s;document.querySelector('[data-justflipitstyle="justFlipIt"]')||((s=document.createElement("style")).setAttribute("data-justflipitstyle","justFlipIt"),s.textContent="._justFlipIt_panel {perspective:1000px;-webkit-perspective:1000px;-moz-perspective:1000px;position:relative;}._justFlipIt_panel .front{height:inherit;width:inherit;position:absolute;top:0;z-index:900;transform-style:preserve-3d;backface-visibility:hidden;transition:transform .4s ease-in-out;}._justFlipIt_panel .back, ._justFlipIt_panel .backY{height:inherit;width:inherit;position:absolute;top:0;z-index:1000;transform-style:preserve-3d;backface-visibility:hidden;transition:transform .4s ease-in-out;}._justFlipIt_panel .front{-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-webkit-transition:transform .4s ease-in-out;-moz-transition:transform .4s ease-in-out;}._justFlipIt_panel .back, ._justFlipIt_panel .backY{-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-webkit-transition:transform .4s ease-in-out;-moz-transition:transform .4s ease-in-out;}._justFlipIt_panel .back{transform:rotateX(-180deg);-webkit-transform:rotateX(-180deg);-moz-transform:rotateX(-180deg);}._justFlipIt_panel._flip_ .front{transform:rotateX(180deg);-webkit-transform:rotateX(180deg);-moz-transform:rotateX(180deg);}._justFlipIt_panel._flip_ .back{transform:rotateX(0);-webkit-transform:rotateX(0);-moz-transform:rotateX(0);}._justFlipIt_panel .backY{transform:rotateY(-180deg);-webkit-transform:rotateY(-180deg);-moz-transform:rotateY(-180deg);}._justFlipIt_panel._flipY_ .front{transform:rotateY(180deg);-webkit-transform:rotateY(180deg);-moz-transform:rotateY(180deg);}._justFlipIt_panel._flipY_ .backY{transform:rotateY(0);-webkit-transform:rotateY(0);-moz-transform:rotateY(0);}._justFlipIt_panel {background: transparent !important; box-shadow: none !important;}._justFlipIt_panel > * {box-sizing: border-box;}",document.head.appendChild(s)),this.element=t,this.settings=Object.assign({},{Template:"",Click:!1,FlipX:!1,Style:[],Duration:400,Easing:"ease-in-out"},e),this.elementWidth=i(t,"width"),this.elementHeight=i(t,"height"),this.elementBackgroundColor=i(t,"background-color"),this.originalClassName=t.className,this.originalTagName=t.tagName.toLowerCase(),this.originalId=t.id||"",!0===this.settings.FlipX?(this.flipClass="_flip_",this.backClass="back",this.rotateStart="rotateX(0deg)",this.rotateFront="rotateX(180deg)",this.rotateBack="rotateX(-180deg)",this.rotateReset="rotateX(0deg)"):(this.flipClass="_flipY_",this.backClass="backY",this.rotateStart="rotateY(0deg)",this.rotateFront="rotateY(180deg)",this.rotateBack="rotateY(-180deg)",this.rotateReset="rotateY(0deg)"),this._init(),r.set(t,this)}_init(){var t=this.element,e=this.originalClassName;let s=document.createElement(this.originalTagName);o(s,"hover"),o(s,"_justFlipIt_panel");var i=document.createElement("div"),r=(o(i,"front"),t.cloneNode(!0));r.className="";let a=document.createElement("div");o(a,this.backClass),e&&e.split(" ").forEach(t=>{t&&o(a,t)}),l(t,i),l(t,a),n(i,this.settings.Duration,this.settings.Easing),n(a,this.settings.Duration,this.settings.Easing),t.style.all="inherit",t.style.background="transparent",t.style.backgroundColor="transparent",t.style.backgroundImage="none",t.style.border="none",t.style.borderRadius="0",t.style.boxShadow="none",t.style.outline="none",this.settings.Template?a.innerHTML=this.settings.Template:a.appendChild(r),t.parentNode.insertBefore(s,t),i.appendChild(t),s.appendChild(i),s.appendChild(a),e&&e.split(" ").forEach(t=>{t&&o(s,t)}),s.style.width=this.elementWidth,s.style.height=this.elementHeight,this.settings.Style&&this.settings.Style.length&&this.settings.Style.forEach(e=>{e.el&&("self"===e.el.toLowerCase()?Object.assign(s.style,e.style):s.querySelectorAll(e.el).forEach(t=>{Object.assign(t.style,e.style)}))}),this._setupEvents(s),this.hoverPanel=s,this.frontWrapper=i,this.backWrapper=a}_setupEvents(t){!0===this.settings.Click?t.addEventListener("click",t=>{t.preventDefault(),this._toggleFlip()}):"string"==typeof this.settings.Click?t.querySelectorAll(this.settings.Click).forEach(t=>{t.addEventListener("click",()=>{this._toggleFlip()})}):(t.addEventListener("mouseenter",()=>{this._flip(!0)}),t.addEventListener("mouseleave",()=>{this._flip(!1)}))}_toggleFlip(){t=this.hoverPanel,e=this.flipClass;var t,e=t.classList?t.classList.contains(e):new RegExp("(^| )"+e+"( |$)","gi").test(t.className);this._flip(!e)}_flip(t){var e;t?(o(this.hoverPanel,this.flipClass),a&&(s(this.frontWrapper,this.rotateStart,this.rotateFront,this.settings.Duration,this.settings.Easing),s(this.backWrapper,this.rotateBack,this.rotateReset,this.settings.Duration,this.settings.Easing))):(t=this.hoverPanel,e=this.flipClass,t.classList?t.classList.remove(e):t.className=t.className.replace(new RegExp("(^|\\b)"+e.split(" ").join("|")+"(\\b|$)","gi")," "),a&&(s(this.frontWrapper,this.rotateFront,this.rotateStart,this.settings.Duration,this.settings.Easing),s(this.backWrapper,this.rotateReset,this.rotateBack,this.settings.Duration,this.settings.Easing)))}destroy(){var t=this.hoverPanel,e=t.querySelector(".front > *");e.className=this.originalClassName,t.parentNode.insertBefore(e,t),t.parentNode.removeChild(t),r.delete(this.element)}}function t(t,e={}){var s;return"string"==typeof t?(s=document.querySelectorAll(t),Array.from(s).map(t=>new p(t,e))):t instanceof Element?new p(t,e):t.length?Array.from(t).map(t=>new p(t,e)):void 0}return t.destroy=function(t){var e;"string"==typeof t?(e=document.querySelectorAll(t),Array.from(e).forEach(t=>{t=r.get(t);t&&t.destroy()})):t instanceof Element?(e=r.get(t))&&e.destroy():t.length&&Array.from(t).forEach(t=>{t=r.get(t);t&&t.destroy()})},t});