Domain > alggh8vo61az.trickle.host

More information on this domain is in AlienVault OTX

DNS Resolutions

Date	IP Address
2025-08-26	3.163.115.96 (ClassC)
2026-02-10	3.163.24.43 (ClassC)

HTTP/1.1 200 OKContent-Type: text/htmlContent-Length: 89341Connection: keep-aliveDate: Tue, 10 Feb 2026 05:55:40 GMTLast-Modified: Tue, 05 Aug 2025 09:34:13 GMTETag: d90f28580c403e64bb02a72da1984783x-amz-server-side-encryption: AES256Accept-Ranges: bytesServer: AmazonS3X-Cache: Miss from cloudfrontVia: 1.1 250b49a977a2df6676d3fbf2508fc16e.cloudfront.net (CloudFront)X-Amz-Cf-Pop: HIO52-P2X-Amz-Cf-Id: -VV0AyE-7OhWJMY-N_V6ptpFrom-2bl_kFx3RUfaQZf4j0mfZPYORAcache-control: no-cacheVary: Origin

!DOCTYPE html>html langzh-CN>head>meta charsetutf-8/>meta contentwidthdevice-width, initial-scale1.0 nameviewport/>title>动态艺术画框演示 - Dynamic Art Frame Demo/title>meta content演示智能动态艺术画框技术，支持Ken Burns效果和背景虚化填充 namedescription/>meta content动态画框,Ken Burns,背景虚化,轮播,艺术展示 namekeywords/>meta content动态艺术画框演示 propertyog:title/>meta content演示智能动态艺术画框技术，支持Ken Burns效果和背景虚化填充 propertyog:description/>meta content动态艺术画框演示 nametwitter:title/>meta content演示智能动态艺术画框技术，支持Ken Burns效果和背景虚化填充 nametwitter:description/>script srchttps://resource.trickle.so/vendor_lib/unpkg/react@18/umd/react.production.min.js>/script>script srchttps://resource.trickle.so/vendor_lib/unpkg/react-dom@18/umd/react-dom.production.min.js>/script>script srchttps://cdn.tailwindcss.com>/script>link hrefhttps://resource.trickle.so/vendor_lib/unpkg/lucide-static@0.516.0/font/lucide.css relstylesheet/>style typetext/tailwindcss>    @layer theme {        :root {            --primary-color: #3b82f6;            --secondary-color: #1e293b;            --accent-color: #f59e0b;            --background-color: #0f172a;            --text-color: #f8fafc;            --border-radius: 12px;        }    }    @layer base {        body {            font-family: Inter, -apple-system, BlinkMacSystemFont, sans-serif;            background: var(--background-color);            color: var(--text-color);        }    }    @layer components {        .art-frame {            position: relative;            overflow: hidden;            border-radius: 0px;            box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);            border: 2px solid #1e293b;            touch-action: pan-y pinch-zoom;            user-select: none;            -webkit-user-select: none;            -moz-user-select: none;            -ms-user-select: none;        }        .art-frame:active {            transform: scale(0.995);            transition: transform 0.1s ease;        }        .art-frame-landscape {            width: 800px;            height: 500px;            aspect-ratio: 16/10;        }        .art-frame-portrait {            width: 500px;            height: 800px;            aspect-ratio: 10/16;        }        .ken-burns-effect {            animation: kenBurns 12s ease-in-out infinite;        }        .breathing-effect {            animation: breathing 8s ease-in-out infinite;        }        .subtle-ken-burns {            animation: subtleKenBurns 10s ease-in-out infinite;        }        .slide-transition {            transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);        }        .fade-transition {            transition: opacity 0.6s ease-in-out;        }        .insert-slide-in {            animation: insertSlideIn 1.2s cubic-bezier(0.68, -0.55, 0.265, 1.55);        }        .insert-zoom-bounce {            animation: insertZoomBounce 1s cubic-bezier(0.68, -0.55, 0.265, 1.55);        }        .insert-spiral-in {            animation: insertSpiralIn 1.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);        }        .insert-flip-reveal {            animation: insertFlipReveal 1.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);        }        .insert-particle-burst {            position: relative;            overflow: visible;        }        .insert-particle-burst::before {            content: ;            position: absolute;            top: 50%;            left: 50%;            width: 0;            height: 0;            background: radial-gradient(circle, rgba(59, 130, 246, 0.6) 0%, rgba(245, 158, 11, 0.4) 50%, transparent 70%);            border-radius: 50%;            transform: translate(-50%, -50%);            animation: particleBurst 0.8s ease-out;            pointer-events: none;            z-index: -1;        }        .current-image-exit {            animation: currentImageExit 0.8s ease-in-out forwards;        }        .blur-background {            filter: blur(20px) brightness(0.3);            transform: scale(1.2);        }        .home-frame-center {            display: flex;            align-items: center;            justify-content: center;            padding: 6%;        }        .home-frame-elegant {            display: flex;            align-items: center;            justify-content: center;            padding: 8% 12%;        }        .home-frame-cozy-left {            display: flex;            align-items: center;            justify-content: flex-start;            padding: 6% 4% 6% 10%;        }        .home-frame-cozy-right {            display: flex;            align-items: center;            justify-content: flex-end;            padding: 6% 10% 6% 4%;        }        .home-frame-balanced {            display: flex;            align-items: center;            justify-content: center;            padding: 7% 8%;        }        .home-frame-floating {            display: flex;            align-items: flex-start;            justify-content: center;            padding: 10% 8% 6% 8%;        }        .warm-frame-shadow {            box-shadow:                 0 4px 20px rgba(0, 0, 0, 0.15),                0 1px 4px rgba(0, 0, 0, 0.1);        }        .home-background {            background: linear-gradient(135deg,                 rgba(30, 41, 59, 0.9) 0%,                rgba(51, 65, 85, 0.8) 50%,                rgba(30, 41, 59, 0.9) 100%);        }        .soft-lighting {            position: relative;        }        .soft-lighting::before {            content: ;            position: absolute;            top: 0;            left: 0;            right: 0;            bottom: 0;            background: radial-gradient(ellipse at center,                 rgba(255, 255, 255, 0.02) 0%,                rgba(255, 255, 255, 0.005) 60%,                transparent 100%);            pointer-events: none;        }        .control-panel {            background: rgba(15, 23, 42, 0.9);            backdrop-filter: blur(10px);            border: 1px solid rgba(59, 130, 246, 0.2);            border-radius: var(--border-radius);        }        .mode-button {            background: rgba(59, 130, 246, 0.1);            border: 1px solid rgba(59, 130, 246, 0.3);            color: var(--text-color);            border-radius: 8px;            transition: all 0.3s ease;        }        .mode-button:hover {            background: rgba(59, 130, 246, 0.2);            border-color: var(--primary-color);        }        .mode-button.active {            background: var(--primary-color);            border-color: var(--primary-color);        }        .progress-bar {            background: linear-gradient(90deg, var(--primary-color) 0%, var(--accent-color) 100%);            height: 4px;            border-radius: 2px;            animation: progress 5s linear infinite;        }    }    @layer utilities {        @keyframes kenBurns {            0% { transform: scale(1.1) translateX(-2%); }            25% { transform: scale(1.15) translateX(2%); }            50% { transform: scale(1.2) translateX(-1%); }            75% { transform: scale(1.15) translateX(1%); }            100% { transform: scale(1.1) translateX(-2%); }        }        @keyframes breathing {            0%, 100% { transform: scale(1); }            50% { transform: scale(1.03); }        }        @keyframes subtleKenBurns {            0%, 100% { transform: scale(1); }            50% { transform: scale(1.03); }        }        @keyframes progress {            0% { width: 0%; }            100% { width: 100%; }        }        @keyframes insertSlideIn {            0% {                 transform: translateX(-120%) scale(0.8) rotate(-15deg);                opacity: 0;                filter: blur(10px);            }            30% {                 transform: translateX(-20%) scale(0.9) rotate(-5deg);                opacity: 0.7;                filter: blur(5px);            }            70% {                 transform: translateX(5%) scale(1.05) rotate(2deg);                opacity: 0.95;                filter: blur(1px);            }            100% {                 transform: translateX(0) scale(1) rotate(0deg);                opacity: 1;                filter: blur(0px);            }        }        @keyframes insertZoomBounce {            0% {                 transform: scale(0) rotate(180deg);                opacity: 0;                filter: brightness(2) saturate(2);            }            40% {                 transform: scale(1.2) rotate(20deg);                opacity: 0.8;                filter: brightness(1.5) saturate(1.5);            }            70% {                 transform: scale(0.95) rotate(-5deg);                opacity: 0.95;                filter: brightness(1.2) saturate(1.2);            }            100% {                 transform: scale(1) rotate(0deg);                opacity: 1;                filter: brightness(1) saturate(1);            }        }        @keyframes insertSpiralIn {            0% {                 transform: scale(0.3) rotate(720deg) translate(200px, -200px);                opacity: 0;                filter: hue-rotate(180deg) blur(15px);            }            30% {                 transform: scale(0.7) rotate(360deg) translate(50px, -50px);                opacity: 0.6;                filter: hue-rotate(90deg) blur(8px);            }            70% {                 transform: scale(1.1) rotate(90deg) translate(10px, -10px);                opacity: 0.9;                filter: hue-rotate(30deg) blur(2px);            }            100% {                 transform: scale(1) rotate(0deg) translate(0px, 0px);                opacity: 1;                filter: hue-rotate(0deg) blur(0px);            }        }        @keyframes insertFlipReveal {            0% {                 transform: perspective(1000px) rotateY(-90deg) rotateX(30deg) scale(0.8);                opacity: 0;                transform-origin: left center;            }            50% {                 transform: perspective(1000px) rotateY(0deg) rotateX(-10deg) scale(1.05);                opacity: 0.8;                transform-origin: center center;            }            80% {                 transform: perspective(1000px) rotateY(10deg) rotateX(5deg) scale(1.02);                opacity: 0.95;            }            100% {                 transform: perspective(1000px) rotateY(0deg) rotateX(0deg) scale(1);                opacity: 1;            }        }        @keyframes particleBurst {            0% {                 width: 0;                height: 0;                opacity: 1;            }            30% {                 width: 300px;                height: 300px;                opacity: 0.8;            }            100% {                 width: 600px;                height: 600px;                opacity: 0;            }        }        @keyframes currentImageExit {            0% {                 transform: scale(1) rotate(0deg);                opacity: 1;                filter: blur(0px);            }            50% {                 transform: scale(0.9) rotate(-5deg);                opacity: 0.5;                filter: blur(3px);            }            100% {                 transform: scale(0.8) rotate(-10deg);                opacity: 0;                filter: blur(8px);            }        }        .aspect-4-3 { aspect-ratio: 4/3; }        .aspect-3-4 { aspect-ratio: 3/4; }        .aspect-3-2 { aspect-ratio: 3/2; }        .aspect-2-3 { aspect-ratio: 2/3; }        .aspect-16-9 { aspect-ratio: 16/9; }        .aspect-9-16 { aspect-ratio: 9/16; }    }    /style>script idiframe-helper>(function () {  if (new URLSearchParams(location.search).get(design) ! true) {    return;  }  function forwardWheelEvent(event) {    event.preventDefault();    event.stopPropagation();    if (window.parent && window.parent ! window) {      window.parent.postMessage(        {          type: IFRAME_WHEEL,          path: window.__PREVIEW_PATH__ || location.pathname.split(/).pop(),          deltaX: event.deltaX,          deltaY: event.deltaY,          deltaZ: event.deltaZ,          deltaMode: event.deltaMode,          ctrlKey: event.ctrlKey,          shiftKey: event.shiftKey,          altKey: event.altKey,          metaKey: event.metaKey,          clientX: event.clientX,          clientY: event.clientY,        },        *      );    }  }  function forwardMouseMoveEvent(event) {    window.parent.postMessage(      {        type: IFRAME_MOUSE_MOVE,        path: window.__PREVIEW_PATH__ || location.pathname.split(/).pop(),        clientX: event.clientX,        clientY: event.clientY,      },      *    );  }  document.addEventListener(wheel, forwardWheelEvent, { passive: false });  document.addEventListener(mousemove, forwardMouseMoveEvent, {    passive: false,  });  function handleDOMContentLoaded() {    const elements  document.querySelectorAll(      .min-h-screen, .h-screen, .max-h-screen    );    elements.forEach((el) > {      if (el.className.includes(min-h-screen)) {        el.classList.remove(min-h-screen);        el.style.minHeight  900px;      }      if (el.className.includes(h-screen)) {        el.classList.remove(h-screen);        el.style.height  900px;      }      if (el.className.includes(max-h-screen)) {        el.classList.remove(max-h-screen);        el.style.maxHeight  900px;      }    });    function convertVhToPx(str, ratio  9) {      return str.replace(/(\d+)\s*vh/g, (_, vhValue) > {        const px  parseFloat(vhValue) * ratio;        return `${px}px`;      });    }    const targetElements  document.querySelectorAll(class*vh);    targetElements.forEach((el) > {      el.className  convertVhToPx(el.className);    });  }  function onReady(callback) {    if (document.readyState  loading) {      document.addEventListener(DOMContentLoaded, callback);    } else {      callback();    }  }  function onLoad(callback) {    if (document.readyState  complete) {      callback();    } else {      window.addEventListener(load, callback);    }  }  onReady(handleDOMContentLoaded);  onLoad(handleDOMContentLoaded);  setTimeout(() > {    handleDOMContentLoaded();  }, 500);  window.addEventListener(message, (event) > {    if (event.data.type  GET_IFRAME_CONTENT_HEIGHT) {      const body  document.body;      const html  document.documentElement;      const scrollHeight  Math.max(        body?.scrollHeight || 0,        html?.scrollHeight || 0      );      const offsetHeight  Math.max(        body?.offsetHeight || 0,        html?.offsetHeight || 0      );      const clientHeight  Math.max(        body?.clientHeight || 0,        html?.clientHeight || 0      );      const contentHeight  Math.max(scrollHeight, offsetHeight, clientHeight);      window.parent.postMessage(        {          type: GET_IFRAME_CONTENT_HEIGHT,          path: window.__PREVIEW_PATH__ || location.pathname.split(/).pop(),          height: contentHeight,          fileVersionId: event.data.fileVersionId,        },        *      );    }  });})();/script>script iddragable-helper>(() > {  let isDragModeActive  false;  let originalTransforms  new Map();  let controlPanel  null;  let sortableContainers  ;  const sendMessage  (type, data  {}) > {    if (window.parent && window.parent ! window) {      window.parent.postMessage({ type, data }, *);    }  };  const handleParentMessage  (event) > {    const { action, data }  event.data;    switch (action) {      case enableDragMode:        enableDragMode(data?.shared);        break;      case disableDragMode:        disableDragMode(data.reset);        break;      case toggleDragMode:        if (isDragModeActive) {          disableDragMode();        } else {          enableDragMode();        }        break;      case resetChanges:        resetChanges();    }  };  const loadSortableJS  () > {    return new Promise((resolve, reject) > {      if (window.Sortable) {        resolve(window.Sortable);        return;      }      sendMessage(dragModeLoading);      if (document.getElementById(sortable-js)) {        const checkInterval  setInterval(() > {          if (window.Sortable) {            clearInterval(checkInterval);            resolve(window.Sortable);          }        }, 100);        return;      }      const script  document.createElement(script);      script.id  sortable-js;      script.src         https://cdn.jsdelivr.net/npm/sortablejs@latest/Sortable.min.js;      script.onload  () > {        console.log(SortableJS loaded);        resolve(window.Sortable);      };      script.onerror  () > {        console.error(SortableJS load failed);        reject(new Error(Failed to load SortableJS));      };      document.head.appendChild(script);    });  };  let draggedElements  ;  let sortableInstances  ;  const enableDragMode  async (shared) > {    if (isDragModeActive) return;    try {      snapshotDom();      const Sortable  await loadSortableJS();      sendMessage(dragModeReady);      isDragModeActive  true;      const style  document.createElement(style);      style.textContent  `        .sortable-hover-highlight {          position: relative !important;          cursor: move !important;        }        .sortable-hover-highlight::before {          content: ;          position: absolute;          inset: -4px;          border: 2px dashed rgba(255, 165, 0, 0.7) !important;          pointer-events: none;          z-index: 2;        }        .sortable-hover-highlight::after {          content: ;          position: absolute;          inset: 0;          pointer-events: none;          background: rgba(255, 165, 0, 0.4);          z-index: 2;        }        .sortable-ghost {        opacity: 0.4;        background: rgba(255, 165, 0, 0.3) !important;        }        .sortable-drag {        background: rgba(0, 123, 255, 0.2) !important;        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15) !important;        }        .sortable-chosen {        transition: transform 0.2s ease !important;        }      `;      style.id  sortable-styles;      if (!document.head.querySelector(style#sortable-styles)) {        document.head.appendChild(style);      }      const containers  document.querySelectorAll(        *:not(html):not(body):not(script):not(style):not(meta):not(title):not(link)      );      sortableContainers  ;      containers.forEach((container) > {        if (          container.id  drag-control-panel ||          container.closest(#drag-control-panel)        ) {          return;        }        const children  Array.from(container.children).filter(          (child) >            !SCRIPT, STYLE, META, TITLE, LINK.includes(              child.tagName            ) && child.id ! drag-control-panel        );        if (children.length > 1) {          sortableContainers.push(container);          const sortableInstance  new Sortable(container, {            group: shared  true ? shared : undefined,            animation: 300,            ghostClass: sortable-ghost,            chosenClass: sortable-chosen,            dragClass: sortable-drag,            fallbackOnBody: true,            swapThreshold: 0.65,            onStart: function (evt) {              console.log(start drag:, evt.item.tagName);              if (!draggedElements.includes(evt.item)) {                draggedElements.push(evt.item);              }            },            onEnd: function (evt) {              draggedElements.push(evt.item);              sendMessage(dragDataChanged, {                description: formChangesDescription(),              });            },            onMove: function (evt) {              if (                evt.related &&                (evt.related.id  drag-control-panel ||                  evt.related.closest(#drag-control-panel))              ) {                return false;              }              return true;            },          });          sortableInstances.push(sortableInstance);        }      });      document.addEventListener(mousemove, highlightOnHover, true);      assignTmpIds();      recordInitialOrders();      sendMessage(dragModeEnabled);    } catch (error) {      console.error(enable drag mode failed:, error);    }  };  const disableDragMode  (reset  true) > {    if (!isDragModeActive) return;    isDragModeActive  false;    console.log(disable drag mode);    sortableInstances.forEach((instance) > {      if (instance && typeof instance.destroy  function) {        instance.destroy();      }    });    sortableInstances  ;    document.querySelectorAll(.sortable-container).forEach((container) > {      container.classList.remove(sortable-container);    });    const sortableStyles  document.head.querySelector(style#sortable-styles);    if (sortableStyles) {      sortableStyles.remove();    }    draggedElements  ;    originalTransforms.clear();    if (controlPanel) {      controlPanel.remove();      controlPanel  null;    }    document.removeEventListener(mousemove, highlightOnHover, true);    removeAllHighlights();    sendMessage(dragModeDisabled);    if (reset) {      resetChanges();    }  };  let hoverHighlights  ;  function createHighlightForElement(element) {    element.classList.add(sortable-hover-highlight);    hoverHighlights.push(element);  }  function removeAllHighlights() {    hoverHighlights.forEach((element) > {      element.classList.remove(sortable-hover-highlight);    });    hoverHighlights  ;  }  const highlightOnHover  (e) > {    let target  e.target;    if (target && target.nodeType  Node.TEXT_NODE && target.parentElement) {      target  target.parentElement;    }    let found  null;    for (const el of sortableContainers) {      if (el.contains(target) && el ! document.body) {        found  el;      }    }    removeAllHighlights();    if (found) {      createHighlightForElement(target);    }  };  let initialOrders  new Map();  let tmpElementIdCounter  1;  function assignTmpIds() {    const allElements  document.querySelectorAll(      *:not(html):not(body):not(script):not(style):not(meta):not(title):not(link)    );    allElements.forEach((el) > {      if (el.nodeType  1 && !el.hasAttribute(data-tmp-id)) {        el.setAttribute(data-tmp-id, tmp- + tmpElementIdCounter++);      }    });  }  function recordInitialOrders() {    initialOrders.clear();    sortableContainers.forEach((container) > {      const key  container;      const value  Array.from(container.children)        .filter(          (child) > child.nodeType  1 && child.hasAttribute(data-tmp-id)        )        .map((child) > child.getAttribute(data-tmp-id));      initialOrders.set(key, value);    });  }  function getCurrentOrder(container) {    return Array.from(container.children)      .filter(        (child) > child.nodeType  1 && child.hasAttribute(data-tmp-id)      )      .map((child) > child.getAttribute(data-tmp-id));  }  function isOrderChanged(container) {    const initOrder  initialOrders.get(container) || ;    const currOrder  getCurrentOrder(container) || ;    if (initOrder.length ! currOrder.length) return true;    for (let i  0; i  initOrder.length; i++) {      if (initOrderi ! currOrderi) return true;    }    return false;  }  const formChangesDescription  () > {    function attrsToString(el) {      return Array.from(el.attributes)        .map((attr) >          attr.name  data-tmp-id111 ? null : `${attr.name}${attr.value}`        )        .filter(Boolean)        .join( );    }    const changedParents  ;    sortableContainers.forEach((container) > {      if (isOrderChanged(container)) {        changedParents.push(container);      }    });    let possibleChangedIds  ;    changedParents.forEach((parentEl) > {      Array.from(parentEl.children).forEach((child) > {        const tmpId  child.getAttribute(data-tmp-id);        if (tmpId) possibleChangedIds.push(tmpId);      });    });    possibleChangedIds  ...new Set(possibleChangedIds);    const changedParentsList  changedParents.map((parentEl) > {      const ptag  parentEl.tagName.toLowerCase();      const pattrs  attrsToString(parentEl);      const childrenStr  Array.from(parentEl.children)        .map((child) > {          const ctag  child.tagName.toLowerCase();          const cattrs  attrsToString(child);          let textContent  child.textContent || ;          if (ctag  img) {            textContent               child.getAttribute(src) || child.getAttribute(alt) || ;          }          Array.from(child.children).forEach((grandChild) > {            if (grandChild.tagName.toLowerCase()  img) {              textContent                 textContent +                  +                (grandChild.getAttribute(src) ||                  grandChild.getAttribute(alt) ||                  );            } else {              textContent  textContent +   + grandChild.textContent || ;            }          });          textContent  textContent.trim();          const displayText             textContent.length > 100              ? textContent.slice(0, 100) + ...              : textContent;          return `  ${ctag}${            cattrs ?   + cattrs :           } data-content${displayText}>.../${ctag}>`;        })        .join(\n);      return `\`\`\`html\n${ptag}${        pattrs ?   + pattrs :       }>\n${childrenStr}\n/${ptag}>\n\`\`\``;    });    const uniqueDraggedElements  Array.from(new Set(draggedElements));    const draggedElementsList  uniqueDraggedElements      .filter((el) > {        const tmpId  el.getAttribute(data-tmp-id);        return tmpId && possibleChangedIds.includes(tmpId);      })      .map((el) > {        const tag  el.tagName.toLowerCase();        const attrs  attrsToString(el);        let textContent  el.textContent || ;        if (tag  img) {          textContent  el.getAttribute(src) || el.getAttribute(alt) || ;        }        Array.from(el.children).forEach((grandChild) > {          if (grandChild.tagName.toLowerCase()  img) {            textContent               textContent +                +              (grandChild.getAttribute(src) ||                grandChild.getAttribute(alt) ||                );          } else {            textContent  textContent +   + grandChild.textContent || ;          }        });        textContent  textContent.trim();        const displayText           textContent.length > 100            ? textContent.slice(0, 100) + ...            : textContent;        return `\`\`\`html\n${tag}${          attrs ?   + attrs :         } data-content${displayText}>.../${tag}>\n\`\`\``;      });    console.log({      dragged_elements: draggedElementsList,      changed_parents: changedParentsList,    });    if (changedParentsList.length  0) {      return;    }    let chat_content  `I just dragged the following elements, My goal is to achieve the desired page layout by dragging elements on the page:${draggedElementsList.join(\n)}Below is the parent element of the dragged elements, along with the current code of all sibling elements, reflecting the result after the drag-and-drop operation:${changedParentsList.join(\n---\n)}Please update the corresponding code to achieve the desired effect. Keep in mind that these drag-and-drop actions were intentional. Youre not supposed to fix layout issues caused by them, but rather detect the layout changes I made to the page elements based on the information provided above, and update the corresponding code accordingly.`;    return chat_content;  };  const saveChanges  async () > {    const chat_content  formChangesDescription();    sendMessage(runTask, {      extra: {        content: chat_content,      },    });    disableDragMode(false);  };  let originalDom  null;  const snapshotDom  () > {    originalDom  document.body.cloneNode(true);  };  const resetChanges  () > {    if (!!originalDom) {      document.body.innerHTML  originalDom.innerHTML;    }  };  const cleanup  () > {    window.removeEventListener(message, handleParentMessage);    disableDragMode();  };  window.addEventListener(message, handleParentMessage);  window.__dragModeCleanup  cleanup;})()/script>script idtrickle-project>        window.__PROTO_STATE__  {            userId: usr_1347286f60000001,            projectId: proj_1F1AMYph22f,            workspaceId: workspace_id_usr_1347286f60000001,            memberId: member_id_usr_1347286f60000001        };        /script>script idtrickle-badge>(function () {  const html  `div  idproto-trickle-badge-element  style    position: fixed;    transition-duration: 300ms;    background-color: black;    bottom: 1.5rem;    right: 1.5rem;    padding: 0.25rem 0.25rem 0.25rem 0.75rem;    border-radius: 0.5rem;    border: 1px solid rgb(31, 41, 55);    z-index: 199999;    transform: translateY(0);    box-shadow: none;    display: flex;    align-items: center;    onmouseoverthis.style.boxShadow0 0 15px rgba(85,85,85,0.3); this.style.borderColorrgb(55, 65, 81); this.style.transformtranslateY(-0.125rem);  onmouseoutthis.style.boxShadownone; this.style.borderColorrgb(31, 41, 55); this.style.transformtranslateY(0);>  a    href     target_blank    relnoopener noreferrer    style      display: flex;      align-items: center;      gap: 4px;      text-decoration: none;      color: white;      font-size: 12px;      font-weight: 500;      line-height: 16px;        >span>Built with/span    >span      >svg        height14        viewBox0 0 51 14        fillnone        xmlnshttp://www.w3.org/2000/svg      >        path          fill-ruleevenodd          clip-ruleevenodd          dM6.44785 0C7.7028 3.0822e-05 8.7202 1.00406 8.7202 2.24259V3.11582L9.48619 2.6794C10.573 2.06016 11.9628 2.42766 12.5903 3.50027C13.2177 4.57286 12.8453 5.94438 11.7585 6.56365L10.9921 7.00027L11.7583 7.43681C12.8451 8.05609 13.2175 9.42766 12.59 10.5003C11.9625 11.5728 10.5727 11.9403 9.48592 11.3211L8.71959 10.8844V11.7574C8.71958 12.9959 7.70221 14 6.44724 14C5.19228 14 4.17491 12.9959 4.1749 11.7574V10.8841L3.40884 11.3206C2.322 11.9398 0.932298 11.5723 0.304812 10.4997C-0.32266 9.42714 0.0496891 8.05563 1.1365 7.43635L1.90282 6.99967L1.13677 6.56319C0.0499497 5.94391 -0.322389 4.57234 0.305081 3.49973C0.932584 2.42717 2.32229 2.05968 3.40911 2.67894L7.53433 5.02937C7.77887 5.16041 8.00112 5.33689 8.18674 5.55504C8.19585 5.56572 8.20475 5.57654 8.21364 5.58736C8.21634 5.59066 8.21909 5.59394 8.22177 5.59725C8.32967 5.73017 8.42096 5.87389 8.49479 6.02517C8.49882 6.03339 8.50271 6.04168 8.50662 6.04993C8.50983 6.05671 8.5131 6.06348 8.51624 6.0703C8.52186 6.08244 8.52727 6.09467 8.53265 6.10687C8.53441 6.11089 8.53622 6.11491 8.53796 6.11894C8.64639 6.36876 8.70538 6.62974 8.71804 6.89003C8.72121 6.95243 8.72174 7.01508 8.71959 7.07778V9.62883L10.0362 10.3791C10.5961 10.6981 11.312 10.5087 11.6353 9.95621C11.9585 9.40368 11.7667 8.69716 11.2069 8.37813L9.84467 7.60197C9.37534 7.33455 9.37535 6.66599 9.84469 6.39859L11.2071 5.62234C11.7669 5.3033 11.9588 4.59672 11.6355 4.04419C11.3123 3.49168 10.5964 3.30241 10.0365 3.62138L8.67442 4.39745C8.2051 4.66486 7.61845 4.33059 7.61845 3.79576V2.24325C7.61845 1.60524 7.09432 1.08803 6.44785 1.08798C5.80134 1.08798 5.27725 1.60521 5.27725 2.24325V3.74329L4.17551 3.11555V2.24259C4.17551 1.00404 5.19287 4.27739e-06 6.44785 0ZM2.85891 3.62092C2.29903 3.3019 1.58308 3.49124 1.25983 4.04379C0.936594 4.59635 1.12843 5.30286 1.68831 5.62187L3.05038 6.39799C3.5197 6.66541 3.5197 7.33393 3.05039 7.60136L1.68804 8.37766C1.12816 8.69668 0.936308 9.40325 1.25956 9.95581C1.58282 10.5083 2.29877 10.6976 2.85864 10.3786L4.22071 9.60249C4.69004 9.33505 5.27671 9.66932 5.27671 10.2042V11.7567C5.27672 12.3948 5.80081 12.912 6.44731 12.912C7.09379 12.912 7.6179 12.3948 7.61791 11.7567V7.04135C7.62009 6.98015 7.61735 6.91906 7.60978 6.85871C7.60013 6.78091 7.58227 6.70341 7.55598 6.62743C7.55448 6.62307 7.5529 6.6187 7.55134 6.61436C7.54986 6.61023 7.54837 6.60607 7.54683 6.60194C7.54508 6.59723 7.54327 6.59251 7.54146 6.58781C7.53994 6.5839 7.53844 6.57996 7.53688 6.57606C7.53458 6.57029 7.53215 6.56454 7.52976 6.55881C7.52877 6.55645 7.5278 6.55406 7.5268 6.55171C7.47068 6.41988 7.38963 6.29766 7.28566 6.19268C7.28235 6.18933 7.27898 6.18602 7.27564 6.18272C7.27229 6.17942 7.26894 6.17609 7.26555 6.17283C7.18858 6.0986 7.10254 6.03609 7.01022 5.98628L2.85891 3.62092Z          fillwhite        />        path          dM19.5488 3.44322H22.8627C22.8971 3.49412 22.9272 3.56624 22.953 3.65956C22.9873 3.75288 23.0045 3.85468 23.0045 3.96497C23.0045 4.14313 22.9615 4.28736 22.8756 4.39765C22.7896 4.49945 22.6693 4.55035 22.5145 4.55035H19.6004L19.5488 3.44322ZM20.2322 4.55035H16.9054C16.8796 4.49097 16.8496 4.41461 16.8152 4.32129C16.7808 4.22797 16.7636 4.12616 16.7636 4.01588C16.7636 3.82923 16.8066 3.68925 16.8925 3.59593C16.9785 3.49412 17.1031 3.44322 17.2665 3.44322H20.1806L20.2322 4.55035ZM20.5417 4.20676V11.155C20.4901 11.1719 20.4041 11.1931 20.2838 11.2186C20.172 11.244 20.056 11.2568 19.9356 11.2568C19.6863 11.2568 19.5015 11.2101 19.3812 11.1168C19.2694 11.015 19.2135 10.858 19.2135 10.6459V4.20676H20.5417Z          fillwhite        />        path          dM24.6191 8.36805H23.3038V6.47193C23.3038 6.26832 23.3468 6.10288 23.4328 5.97563C23.5273 5.83989 23.6649 5.71263 23.8454 5.59386C24.0861 5.44115 24.3999 5.31389 24.7867 5.21209C25.1821 5.11028 25.6119 5.05938 26.0761 5.05938C26.824 5.05938 27.198 5.26723 27.198 5.68294C27.198 5.78474 27.1808 5.87806 27.1464 5.9629C27.1206 6.04774 27.0819 6.11985 27.0303 6.17924C26.9444 6.16227 26.8326 6.14954 26.6951 6.14106C26.5661 6.12409 26.4329 6.11561 26.2953 6.11561C25.9429 6.11561 25.6248 6.15379 25.3412 6.23014C25.0575 6.29801 24.8168 6.38709 24.6191 6.49738V8.36805ZM24.6191 7.93538V11.155C24.5675 11.1719 24.4858 11.1931 24.3741 11.2186C24.2709 11.244 24.1549 11.2568 24.0259 11.2568C23.7852 11.2568 23.6047 11.2144 23.4843 11.1295C23.364 11.0362 23.3038 10.8792 23.3038 10.6587V7.82085L24.6191 7.93538Z          fillwhite        />        path          dM27.8513 3.40504C27.8513 3.19295 27.9244 3.01479 28.0706 2.87057C28.2253 2.71786 28.4187 2.64151 28.6508 2.64151C28.8829 2.64151 29.072 2.71786 29.2182 2.87057C29.3643 3.01479 29.4374 3.19295 29.4374 3.40504C29.4374 3.61714 29.3643 3.7953 29.2182 3.93952C29.072 4.08375 28.8829 4.15586 28.6508 4.15586C28.4187 4.15586 28.2253 4.08375 28.0706 3.93952C27.9244 3.7953 27.8513 3.61714 27.8513 3.40504ZM29.3084 7.82085V11.155C29.2483 11.1719 29.1623 11.1931 29.0505 11.2186C28.9474 11.244 28.8313 11.2568 28.7024 11.2568C28.4703 11.2568 28.2941 11.2144 28.1737 11.1295C28.0534 11.0362 27.9932 10.8792 27.9932 10.6587V7.82085H29.3084ZM27.9932 8.46986V5.26299C28.0534 5.24602 28.135 5.22906 28.2382 5.21209C28.3499 5.18664 28.4703 5.17391 28.5992 5.17391C28.8399 5.17391 29.0162 5.22057 29.1279 5.31389C29.2483 5.39873 29.3084 5.55144 29.3084 5.77202V8.46986H27.9932Z          fillwhite        />        path          dM33.7309 6.11561C33.1808 6.11561 32.7209 6.29801 32.3512 6.66281C31.9816 7.01913 31.7968 7.53664 31.7968 8.21534C31.7968 8.89404 31.973 9.41155 32.3254 9.76787C32.6865 10.1242 33.155 10.3024 33.7309 10.3024C34.0662 10.3024 34.3499 10.2599 34.582 10.1751C34.8141 10.0818 35.0161 9.97997 35.188 9.86968C35.2998 9.93755 35.3857 10.0181 35.4459 10.1115C35.5147 10.1963 35.5491 10.3024 35.5491 10.4296C35.5491 10.6926 35.3728 10.9132 35.0204 11.0913C34.6679 11.261 34.2166 11.3459 33.6665 11.3459C33.0389 11.3459 32.4845 11.2313 32.0031 11.0023C31.5217 10.7732 31.1434 10.4296 30.8684 9.97148C30.6019 9.50488 30.4686 8.9195 30.4686 8.21534C30.4686 7.51967 30.6105 6.93854 30.8941 6.47193C31.1778 5.99684 31.5604 5.64476 32.0418 5.4157C32.5232 5.17815 33.0518 5.05938 33.6278 5.05938C34.178 5.05938 34.625 5.1527 34.9688 5.33934C35.3213 5.52599 35.4975 5.75081 35.4975 6.0138C35.4975 6.12409 35.4631 6.2259 35.3943 6.31922C35.3342 6.41254 35.2525 6.48465 35.1493 6.53556C34.9774 6.42527 34.7797 6.3277 34.5562 6.24287C34.3327 6.15803 34.0576 6.11561 33.7309 6.11561Z          fillwhite        />        path          dM37.6953 7.96083L40.6223 5.12301C40.8888 5.12301 41.0951 5.18239 41.2413 5.30117C41.396 5.41146 41.4734 5.55992 41.4734 5.74657C41.4734 5.89927 41.4218 6.03501 41.3186 6.15379C41.2241 6.26408 41.0779 6.39982 40.8802 6.56101L38.5592 8.57166L37.6953 7.96083ZM38.6624 7.65541L41.8086 10.506C41.7914 10.7435 41.7184 10.9302 41.5894 11.0659C41.4691 11.2016 41.3015 11.2695 41.0865 11.2695C40.9232 11.2695 40.7728 11.2271 40.6352 11.1422C40.5063 11.0574 40.3688 10.9344 40.2226 10.7732L37.6953 8.16444L38.6624 7.65541ZM37.9403 7.8972V11.155C37.8887 11.1719 37.807 11.1931 37.6953 11.2186C37.5921 11.244 37.4761 11.2568 37.3471 11.2568C37.1064 11.2568 36.9259 11.2144 36.8056 11.1295C36.6852 11.0362 36.6251 10.8792 36.6251 10.6587V7.78267L37.9403 7.8972ZM36.6251 8.43168V2.92147C36.6852 2.9045 36.7712 2.88753 36.8829 2.87057C36.9947 2.84512 37.115 2.83239 37.244 2.83239C37.4847 2.83239 37.6609 2.87481 37.7727 2.95965C37.8844 3.04448 37.9403 3.19719 37.9403 3.41777V8.54621L36.6251 8.43168Z          fillwhite        />        path          dM44.103 7.93538V11.155C44.0514 11.1719 43.9697 11.1931 43.858 11.2186C43.7548 11.244 43.6388 11.2568 43.5098 11.2568C43.2691 11.2568 43.0886 11.2144 42.9682 11.1295C42.8565 11.0362 42.8006 10.8792 42.8006 10.6587V7.82085L44.103 7.93538ZM42.8006 8.46986V2.92147C42.8522 2.9045 42.9339 2.88753 43.0456 2.87057C43.1574 2.84512 43.2734 2.83239 43.3938 2.83239C43.6431 2.83239 43.8236 2.87481 43.9353 2.95965C44.0471 3.04448 44.103 3.19719 44.103 3.41777V8.57166L42.8006 8.46986Z          fillwhite        />        path          dM46.0872 7.97356L49.7621 7.46453C49.7277 7.06579 49.5816 6.73493 49.3237 6.47193C49.0658 6.20045 48.7005 6.06471 48.2277 6.06471C47.7377 6.06471 47.3337 6.23438 47.0156 6.57373C46.6975 6.91308 46.5385 7.4009 46.5385 8.03718L46.5514 8.50803C46.6202 9.11038 46.8394 9.56426 47.209 9.86968C47.5787 10.1751 48.0687 10.3278 48.679 10.3278C49.04 10.3278 49.371 10.2727 49.6719 10.1624C49.9727 10.0521 50.2091 9.92907 50.3811 9.79333C50.4842 9.8612 50.5702 9.94603 50.639 10.0478C50.7077 10.1412 50.7421 10.2472 50.7421 10.366C50.7421 10.5526 50.6433 10.7223 50.4455 10.875C50.2564 11.0277 50.0028 11.1465 49.6848 11.2313C49.3667 11.3162 49.0057 11.3586 48.6016 11.3586C47.9311 11.3586 47.3466 11.2398 46.848 11.0023C46.358 10.7562 45.9754 10.3957 45.7004 9.92058C45.4253 9.43701 45.2877 8.84738 45.2877 8.15172C45.2877 7.65117 45.3608 7.21002 45.5069 6.82825C45.6617 6.43799 45.8723 6.11561 46.1388 5.8611C46.4053 5.5981 46.719 5.39873 47.0801 5.26299C47.4411 5.12725 47.8279 5.05938 48.2406 5.05938C48.7821 5.05938 49.2592 5.16967 49.6719 5.39025C50.0845 5.61083 50.4069 5.92048 50.639 6.31922C50.8797 6.71796 51 7.17184 51 7.68087C51 7.89296 50.9484 8.04991 50.8453 8.15172C50.7421 8.24504 50.596 8.30442 50.4068 8.32987L46.1388 8.92798L46.0872 7.97356Z          fillwhite        />/svg>/span  >/a >  span    idbadge-close-button    style      width: 24px;      height: 24px;      cursor: pointer;      display: flex;      align-items: center;      justify-content: center;        onclickdocument.body.removeChild(document.querySelector(#proto-trickle-badge-element))    >svg      xmlnshttp://www.w3.org/2000/svg      width16      height16      viewBox0 0 24 24      strokegrey      stroke-width2      stroke-linecapround      stroke-linejoinround    >      line x118 y16 x26 y218>/line>      line x16 y16 x218 y218>/line>/svg  >/span>/div>`;  fetch(    https://app.trickle.so/proto/api/subs/features/5?userId + window.__PROTO_STATE__.userId  )    .then((res) > res.json())    .then((res) > {      if (res.data && res.data.enable) {        return;      }      const el  document.createElement(div);      el.innerHTML  html;      document.body.appendChild(el.firstChild);    });})();/script>script idtrickle-analytics>!(function () {  var analytics  (window.analytics  window.analytics || );  if (!analytics.initialize)    if (analytics.invoked)      window.console &&        console.error &&        console.error(Segment snippet included twice.);    else {      analytics.invoked  !0;      analytics.methods          trackSubmit,        trackClick,        trackLink,        trackForm,        pageview,        identify,        reset,        group,        track,        ready,        alias,        debug,        page,        once,        off,        on,        addSourceMiddleware,        addIntegrationMiddleware,        setAnonymousId,        addDestinationMiddleware,      ;      analytics.factory  function (e) {        return function () {          var t  Array.prototype.slice.call(arguments);          t.unshift(e);          analytics.push(t);          return analytics;        };      };      for (var e  0; e  analytics.methods.length; e++) {        var key  analytics.methodse;        analyticskey  analytics.factory(key);      }      analytics.load  function (key, e) {        var t  document.createElement(script);        t.type  text/javascript;        t.async  !0;        t.src           https://cdn.segment.com/analytics.js/v1/ +          key +          /analytics.min.js;        var n  document.getElementsByTagName(script)0;        n.parentNode.insertBefore(t, n);        analytics._loadOptions  e;      };      console.log(analytics);      analytics._writeKey  FMFy0tKyTGNTC64dzUT5nA3IrqfP6yhr;      analytics.SNIPPET_VERSION  4.15.3;      analytics.load(ryeevPxktAiS6AL1tjATM0s7iGf7piwM, {        integrations: {          Segment.io: {            apiHost: app.trickle.so/sgmt/client,            apiKey: FMFy0tKyTGNTC64dzUT5nA3IrqfP6yhr,          },        },      });      try {        if (          window.parent.location.href !          https://app.trickle.so/project?id + window.__PROTO_STATE__.projectId        ) {          analytics.page({            project_id: window.__PROTO_STATE__.projectId,            user_id: window.__PROTO_STATE__.userId,            indice: nge-analytics-user,          });        }      } catch (e) {        analytics.page({          project_id: window.__PROTO_STATE__.projectId,          user_id: window.__PROTO_STATE__.userId,          indice: nge-analytics-user,        });      }    }})();/script>/head>body idtrickle-artifact-root-html>script idtrickle-storage srchttps://app.trickle.so/storage/trickle.js>/script>div idroot>/div>script>function ArtFrame({image,displayMode,frameOrientation,shouldUseKenBurns,insertMode,insertAnimation,isGestureActive}){try{constshowImage,setShowImageReact.useState(false);React.useEffect(()>{if(!insertMode){setShowImage(false);const timersetTimeout(()>setShowImage(true),100);return()>clearTimeout(timer)}},image.url,insertMode);React.useEffect(()>{if(insertMode){setShowImage(true)}},insertMode);const frameClassframeOrientationlandscape?art-frame-landscape:art-frame-portrait;const getInsertAnimationClass()>{if(!insertMode)return;switch(insertAnimation){caseslideIn:returninsert-slide-in;casezoomBounce:returninsert-zoom-bounce;casespiralIn:returninsert-spiral-in;caseflipReveal:returninsert-flip-reveal;caseparticleBurst:returninsert-particle-burst;default:returninsert-slide-in}};const renderKenBurnsMode()>React.createElement(div,{className:`art-frame ${frameClass} bg-gray-900 ${insertMode?getInsertAnimationClass():} ${isGestureActive?cursor-grabbing:cursor-grab} select-none`,data-uid:components/ArtFrame.js::div0::1271:44:6::1827:54:12},React.createElement(img,{src:image.url,alt:image.title,className:`absolute inset-0 w-full h-full object-cover transition-opacity duration-600 ${showImage?opacity-100:opacity-0} ${shouldUseKenBurns&&!insertMode?ken-burns-effect:} ${insertMode?current-image-exit:}`,data-uid:components/ArtFrame.js::div0.img1::1449:45:8::1814:53:10}));const renderArtFrameMode()>{const getMinimalWhitespaceLayout()>{const imageRatioimage.ratio;const isLandscapeFrameframeOrientationlandscape;const parseRatioratio>{constw,hratio.split(:).map(Number);return w/h};const imageAspectparseRatio(imageRatio);const frameAspectisLandscapeFrame?1.6:0.625;const shouldFillByWidthimageAspect>frameAspect;if(shouldFillByWidth){return{containerClass:absolute inset-0 flex items-center justify-center,containerStyle:{paddingLeft:0%,paddingRight:0%,paddingTop:3%,paddingBottom:3%},imageStyle:{width:100%,height:auto,maxHeight:94%,objectFit:contain},patternName:\u5BBD\u5EA6\u5145\u6EE1}}else{return{containerClass:absolute inset-0 flex items-center justify-center,containerStyle:{paddingLeft:3%,paddingRight:3%,paddingTop:0%,paddingBottom:0%},imageStyle:{height:100%,width:auto,maxWidth:94%,objectFit:contain},patternName:\u9AD8\u5EA6\u5145\u6EE1}}};const layoutgetMinimalWhitespaceLayout();return React.createElement(div,{className:`art-frame ${frameClass} bg-gray-900 ${insertMode?getInsertAnimationClass():} ${isGestureActive?cursor-grabbing:cursor-grab} select-none`,data-uid:components/ArtFrame.js::div0::3640:117:8::4903:150:14},React.createElement(div,{className:absolute inset-0,data-uid:components/ArtFrame.js::div0.div3::3848:119:10::4293:131:16},React.createElement(img,{src:image.url,alt:,className:`w-full h-full object-cover transition-opacity duration-800 ${showImage?opacity-100:opacity-0}`,style:{filter:blur(25px) brightness(0.3) saturate(0.7),transform:scale(1.1)},data-uid:components/ArtFrame.js::div0.div3.img1::3895:120:12::4276:130:14})),React.createElement(div,{className:layout.containerClass,style:layout.containerStyle,data-uid:components/ArtFrame.js::div0.div7::4348:134:10::4888:149:16},React.createElement(img,{src:image.url,alt:image.title,className:`object-contain transition-all duration-800 ${showImage?opacity-100:opacity-0} ${insertMode?:subtle-ken-burns}`,style:{...layout.imageStyle,boxShadow:0 8px 32px rgba(0, 0, 0, 0.4)},data-uid:components/ArtFrame.js::div0.div7.img1::4466:138:12::4871:148:14})))};if(displayModedynamic){return shouldUseKenBurns?renderKenBurnsMode():renderArtFrameMode()}else{return renderArtFrameMode()}}catch(error){console.error(ArtFrame component error:,error);return React.createElement(div,{className:art-frame bg-gray-800 flex items-center justify-center,data-uid:components/ArtFrame.js::div0::5205:164:6::5336:166:12},React.createElement(p,{className:text-gray-400,data-uid:components/ArtFrame.js::div0.p1::5286:165:8::5323:165:45},\u52A0\u8F7D\u5931\u8D25))}}/script>script>function ControlPanel({displayMode,onModeChange,frameOrientation,onFrameOrientationChange,isPlaying,onPlayToggle,currentIndex,totalImages,onImageSelect}){try{const modes{id:dynamic,name:\u667A\u80FD\u52A8\u6001\u753B\u6846,desc:\u81EA\u52A8\u9009\u62E9\u6700\u4F73\u5C55\u793A\u6548\u679C,icon:sparkles},{id:artframe,name:\u5E26\u52A8\u6001\u4E3B\u4F53\u7684\u827A\u672F\u753B\u6846,desc:\u9AD8\u7EA7\u80CC\u666F\u865A\u5316 + \u7EC6\u5FAE\u547C\u5438\u6548\u679C,icon:heart};const orientations{id:landscape,name:\u6A2A\u5C4F\u76F8\u6846 (16:10),icon:monitor},{id:portrait,name:\u7AD6\u5C4F\u76F8\u6846 (10:16),icon:smartphone};return React.createElement(div,{className:control-panel p-6 space-y-6,data-name:control-panel,data-file:components/ControlPanel.js,data-uid:components/ControlPanel.js::div0::714:42:6::5199:154:12},React.createElement(div,{className:space-y-4,data-uid:components/ControlPanel.js::div0.div3::854:44:8::2285:80:14},React.createElement(h3,{className:text-lg font-semibold flex items-center gap-2,data-uid:components/ControlPanel.js::div0.div3.h31::892:45:10::1069:48:15},React.createElement(div,{className:icon-play text-lg text-var(--primary-color),data-uid:components/ControlPanel.js::div0.div3.h31.div1::967:46:12::1036:46:81}),\u64AD\u653E\u63A7\u5236),React.createElement(div,{className:flex items-center gap-4,data-uid:components/ControlPanel.js::div0.div3.div3::1091:50:10::1646:62:16},React.createElement(button,{onClick:onPlayToggle,className:flex items-center gap-2 px-4 py-2 bg-var(--primary-color) text-white rounded-lg hover:bg-blue-600 transition-colors,data-uid:components/ControlPanel.js::div0.div3.div3.button1::1145:51:12::1494:57:21},React.createElement(div,{className:`icon-${isPlaying?pause:play} text-sm`,data-uid:components/ControlPanel.js::div0.div3.div3.button1.div1::1362:55:14::1432:55:84}),isPlaying?\u6682\u505C:\u64AD\u653E),React.createElement(span,{className:text-sm text-gray-400,data-uid:components/ControlPanel.js::div0.div3.div3.span3::1520:59:12::1629:61:19},currentIndex+1, / ,totalImages)),React.createElement(div,{className:flex gap-2,data-uid:components/ControlPanel.js::div0.div3.div7::1681:65:10::2270:79:16},Array.from({length:totalImages},(_,i)>React.createElement(button,{key:i,onClick:()>onImageSelect(i),className:`w-8 h-8 rounded-full border-2 transition-all ${icurrentIndex?border-var(--primary-color) bg-var(--primary-color):border-gray-600 hover:border-gray-400}`,data-uid:components/ControlPanel.js::div0.div3.div7.button0::1785:67:14::2237:77:23},React.createElement(span,{className:text-xs,data-uid:components/ControlPanel.js::div0.div3.div7.button0.span1::2173:76:16::2213:76:56},i+1))))),React.createElement(div,{className:space-y-4,data-uid:components/ControlPanel.js::div0.div7::2318:83:8::3550:112:14},React.createElement(h3,{className:text-lg font-semibold flex items-center gap-2,data-uid:components/ControlPanel.js::div0.div7.h31::2356:84:10::2537:87:15},React.createElement(div,{className:icon-settings text-lg text-var(--primary-color),data-uid:components/ControlPanel.js::div0.div7.h31.div1::2431:85:12::2504:85:85}),\u663E\u793A\u6A21\u5F0F),React.createElement(div,{className:space-y-2,data-uid:components/ControlPanel.js::div0.div7.div3::2559:89:10::3535:111:16},modes.map(mode>React.createElement(button,{key:mode.id,onClick:()>onModeChange(mode.id),className:`mode-button w-full p-3 text-left transition-all ${displayModemode.id?active:}`,data-uid:components/ControlPanel.js::div0.div7.div3.button0::2636:91:14::3502:109:23},React.createElement(div,{className:flex items-start gap-3,data-uid:components/ControlPanel.js::div0.div7.div3.button0.div1::2917:98:16::3478:108:22},React.createElement(div,{className:`icon-${mode.icon} text-lg mt-0.5 ${displayModemode.id?text-white:text-var(--primary-color)}`,data-uid:components/ControlPanel.js::div0.div7.div3.button0.div1.div1::2976:99:18::3148:101:28}),React.createElement(div,{className:flex-1,data-uid:components/ControlPanel.js::div0.div7.div3.button0.div1.div3::3167:102:18::3455:107:24},React.createElement(div,{className:font-medium,data-uid:components/ControlPanel.js::div0.div7.div3.button0.div1.div3.div1::3212:103:20::3258:103:66},mode.name),React.createElement(div,{className:`text-sm ${displayModemode.id?text-blue-100:text-gray-400}`,data-uid:components/ControlPanel.js::div0.div7.div3.button0.div1.div3.div3::3279:104:20::3430:106:41},mode.desc))))))),React.createElement(div,{className:space-y-4,data-uid:components/ControlPanel.js::div0.div11::3583:115:8::4646:139:14},React.createElement(h3,{className:text-lg font-semibold flex items-center gap-2,data-uid:components/ControlPanel.js::div0.div11.h31::3621:116:10::3803:119:15},React.createElement(div,{className:icon-rotate-90 text-lg text-var(--primary-color),data-uid:components/ControlPanel.js::div0.div11.h31.div1::3696:117:12::3770:117:86}),\u76F8\u6846\u65B9\u5411),React.createElement(div,{className:space-y-2,data-uid:components/ControlPanel.js::div0.div11.div3::3825:121:10::4631:138:16},orientations.map(orientation>React.createElement(button,{key:orientation.id,onClick:()>onFrameOrientationChange(orientation.id),className:`mode-button w-full p-3 text-left transition-all ${frameOrientationorientation.id?active:}`,data-uid:components/ControlPanel.js::div0.div11.div3.button0::3916:123:14::4598:136:23},React.createElement(div,{className:flex items-center gap-3,data-uid:components/ControlPanel.js::div0.div11.div3.button0.div1::4235:130:16::4574:135:22},React.createElement(div,{className:`icon-${orientation.icon} text-lg ${frameOrientationorientation.id?text-white:text-var(--primary-color)}`,data-uid:components/ControlPanel.js::div0.div11.div3.button0.div1.div1::4295:131:18::4479:133:28}),React.createElement(div,{className:font-medium,data-uid:components/ControlPanel.js::div0.div11.div3.button0.div1.div3::4498:134:18::4551:134:71},orientation.name)))))),React.createElement(div,{className:text-xs text-gray-500 leading-relaxed border-t border-gray-700 pt-4,data-uid:components/ControlPanel.js::div0.div15::4677:142:8::5186:153:14},React.createElement(p,{className:mb-2,data-uid:components/ControlPanel.js::div0.div15.p1::4773:143:10::4922:146:14},React.createElement(strong,{className:text-var(--accent-color),data-uid:components/ControlPanel.js::div0.div15.p1.strong1::4806:144:12::4870:144:76},\u667A\u80FD\u52A8\u6001\u753B\u6846\u6A21\u5F0F),\u4F1A\u6839\u636E\u7167\u7247\u4E0E\u753B\u6846\u7684\u5339\u914D\u5EA6\u81EA\u52A8\u9009\u62E9\u6700\u4F73\u663E\u793A\u65B9\u5F0F\u3002),React.createElement(p,{className:mb-2,data-uid:components/ControlPanel.js::div0.div15.p3::4933:147:10::5018:149:14},\u5339\u914D\u5EA6\u9AD8\u65F6\u4F7F\u7528 Ken Burns \u52A8\u6001\u6548\u679C\uFF0C\u5339\u914D\u5EA6\u4F4E\u65F6\u4F7F\u7528\u6E29\u99A8\u827A\u672F\u5C55\u793A\u3002),React.createElement(p,{data-uid:components/ControlPanel.js::div0.div15.p5::5029:150:10::5171:152:14},React.createElement(strong,{className:text-orange-400,data-uid:components/ControlPanel.js::div0.div15.p5.strong1::5045:151:12::5101:151:68},\u5E26\u52A8\u6001\u4E3B\u4F53\u7684\u827A\u672F\u753B\u6846\uFF1A),\u4F7F\u7528\u9AD8\u7EA7\u80CC\u666F\u865A\u5316\u586B\u5145\u6280\u672F\uFF0C\u4E3B\u4F53\u7167\u7247\u5C45\u4E2D\u5B8C\u6574\u5C55\u793A\u5E76\u5E94\u7528\u7EC6\u5FAE\u7684\u547C\u5438\u5F0F\u7F29\u653E\u6548\u679C\uFF0C\u8BA9\u9759\u6001\u7167\u7247\u4EA7\u751F\\u547C\u4E4B\u6B32\u51FA\\u7684\u751F\u547D\u611F\u3002)))}catch(error){console.error(ControlPanel component error:,error);return React.createElement(div,{className:control-panel p-6,data-uid:components/ControlPanel.js::div0::5306:160:6::5404:162:12},React.createElement(p,{className:text-gray-400,data-uid:components/ControlPanel.js::div0.p1::5350:161:8::5391:161:49},\u63A7\u5236\u9762\u677F\u52A0\u8F7D\u5931\u8D25))}}/script>script>function ImageInfo({image,frameOrientation,shouldUseKenBurns}){try{const getDisplayDescription()>{if(shouldUseKenBurns){return`照片与${frameOrientationlandscape?\u6A2A\u5C4F:\u7AD6\u5C4F}相框匹配度较好，使用动态缩放和平移效果撑满屏幕`}else{const parseRatioratio>{constw,hratio.split(:).map(Number);return w/h};const imageAspectparseRatio(image.ratio);const frameAspectframeOrientationlandscape?16/10:10/16;const shouldFillByWidthimageAspect>frameAspect;const fillDirectionshouldFillByWidth?\u5DE6\u53F3\u5145\u6EE1\u76F8\u6846:\u4E0A\u4E0B\u5145\u6EE1\u76F8\u6846;return`使用高级背景虚化填充技术，主体照片居中显示并${fillDirection}，最少留白设计配合细微呼吸效果，让静态照片产生生命感`}};const modeInfoshouldUseKenBurns?{name:Ken Burns \u52A8\u6001\u586B\u5145,description:getDisplayDescription(),icon:maximize,color:text-green-400,bgColor:bg-green-400/10}:{name:\u5E26\u52A8\u6001\u4E3B\u4F53\u7684\u827A\u672F\u753B\u6846,description:getDisplayDescription(),icon:heart,color:text-orange-400,bgColor:bg-orange-400/10};const frameInfoframeOrientationlandscape?\u6A2A\u5C4F\u76F8\u6846 (16:10):\u7AD6\u5C4F\u76F8\u6846 (10:16);return React.createElement(div,{className:control-panel p-6 space-y-4,data-name:image-info,data-file:components/ImageInfo.js,data-uid:components/ImageInfo.js::div0::1277:39:6::3374:90:12},React.createElement(h3,{className:text-lg font-semibold flex items-center gap-2,data-uid:components/ImageInfo.js::div0.h31::1390:40:8::1563:43:13},React.createElement(div,{className:icon-info text-lg text-var(--primary-color),data-uid:components/ImageInfo.js::div0.h31.div1::1463:41:10::1532:41:79}),\u5F53\u524D\u56FE\u7247\u4FE1\u606F),React.createElement(div,{className:space-y-3,data-uid:components/ImageInfo.js::div0.div5::1596:46:8::2216:62:14},React.createElement(div,{className:flex items-center gap-3,data-uid:components/ImageInfo.js::div0.div5.div1::1634:47:10::2129:59:16},React.createElement(div,{className:w-12 h-12 rounded-lg overflow-hidden border border-gray-600,data-uid:components/ImageInfo.js::div0.div5.div1.div1::1688:48:12::1943:54:18},React.createElement(img,{src:image.url,alt:image.title,className:w-full h-full object-cover,data-uid:components/ImageInfo.js::div0.div5.div1.div1.img1::1780:49:14::1924:53:16})),React.createElement(div,{data-uid:components/ImageInfo.js::div0.div5.div1.div3::1956:55:12::2112:58:18},React.createElement(p,{className:font-medium,data-uid:components/ImageInfo.js::div0.div5.div1.div3.p1::1976:56:14::2020:56:58},image.title),React.createElement(p,{className:text-sm text-gray-400,data-uid:components/ImageInfo.js::div0.div5.div1.div3.p3::2035:57:14::2093:57:72},\u6BD4\u4F8B: ,image.ratio))),React.createElement(p,{className:text-sm text-gray-300,data-uid:components/ImageInfo.js::div0.div5.p3::2141:61:10::2201:61:70},image.description)),React.createElement(div,{className:`p-4 rounded-lg border ${modeInfo.bgColor} border-gray-600`,data-uid:components/ImageInfo.js::div0.div9::2252:65:8::2706:73:14},React.createElement(div,{className:flex items-start gap-3,data-uid:components/ImageInfo.js::div0.div9.div1::2340:66:10::2691:72:16},React.createElement(div,{className:`icon-${modeInfo.icon} text-lg ${modeInfo.color} mt-0.5`,data-uid:components/ImageInfo.js::div0.div9.div1.div1::2393:67:12::2473:67:92}),React.createElement(div,{data-uid:components/ImageInfo.js::div0.div9.div1.div3::2486:68:12::2674:71:18},React.createElement(p,{className:`font-medium ${modeInfo.color}`,data-uid:components/ImageInfo.js::div0.div9.div1.div3.p1::2506:69:14::2572:69:80},modeInfo.name),React.createElement(p,{className:text-sm text-gray-300 mt-1,data-uid:components/ImageInfo.js::div0.div9.div1.div3.p3::2587:70:14::2655:70:82},modeInfo.description)))),React.createElement(div,{className:text-xs text-gray-500 space-y-2 border-t border-gray-700 pt-4,data-uid:components/ImageInfo.js::div0.div13::2737:76:8::3361:89:14},React.createElement(div,{className:flex items-start gap-2,data-uid:components/ImageInfo.js::div0.div13.div1::2827:77:10::2997:80:16},React.createElement(div,{className:icon-check-circle text-green-400 mt-0.5,data-uid:components/ImageInfo.js::div0.div13.div1.div1::2880:78:12::2943:78:75}),React.createElement(span,{data-uid:components/ImageInfo.js::div0.div13.div1.span3::2956:79:12::2980:79:36},frameInfo)),React.createElement(div,{className:flex items-start gap-2,data-uid:components/ImageInfo.js::div0.div13.div3::3008:81:10::3174:84:16},React.createElement(div,{className:icon-zap text-amber-400 mt-0.5,data-uid:components/ImageInfo.js::div0.div13.div3.div1::3061:82:12::3115:82:66}),React.createElement(span,{data-uid:components/ImageInfo.js::div0.div13.div3.span3::3128:83:12::3157:83:41},\u667A\u80FD\u5339\u914D\u7B97\u6CD5\u81EA\u52A8\u9009\u62E9\u6700\u4F73\u663E\u793A\u6548\u679C)),React.createElement(div,{className:flex items-start gap-2,data-uid:components/ImageInfo.js::div0.div13.div5::3185:85:10::3346:88:16},React.createElement(div,{className:icon-eye text-blue-400 mt-0.5,data-uid:components/ImageInfo.js::div0.div13.div5.div1::3238:86:12::3291:86:65}),React.createElement(span,{data-uid:components/ImageInfo.js::div0.div13.div5.span3::3304:87:12::3329:87:37},\u5E73\u6ED1\u8FC7\u6E21\u52A8\u753B\u63D0\u5347\u89C6\u89C9\u4F53\u9A8C))))}catch(error){console.error(ImageInfo component error:,error);return React.createElement(div,{className:control-panel p-6,data-uid:components/ImageInfo.js::div0::3478:96:6::3576:98:12},React.createElement(p,{className:text-gray-400,data-uid:components/ImageInfo.js::div0.p1::3522:97:8::3563:97:49},\u56FE\u7247\u4FE1\u606F\u52A0\u8F7D\u5931\u8D25))}}/script>script>const ImageUtils{calculateAspectRatioMatch:(imageRatio,frameRatio16:10)>{try{const parseRatioratio>{constw,hratio.split(:).map(Number);return w/h};const imageAspectparseRatio(imageRatio);const frameAspectparseRatio(frameRatio);const differenceMath.abs(imageAspect-frameAspect);const maxDifferenceMath.max(imageAspect,frameAspect);const matchScoreMath.max(0,1-difference/maxDifference);return matchScore}catch(error){console.error(Error calculating aspect ratio match:,error);return 0}},shouldUseKenBurns:(imageRatio,displayMode,frameOrientationlandscape)>{try{if(displayModeartframe)return false;if(displayModedynamic){const frameRatioframeOrientationlandscape?16:10:10:16;const matchScoreImageUtils.calculateAspectRatioMatch(imageRatio,frameRatio);if(frameOrientationlandscape&&(imageRatio3:4||imageRatio2:3||imageRatio9:16)){return false}if(frameOrientationportrait&&(imageRatio16:9||imageRatio3:2||imageRatio4:3)){return false}return matchScore>0.6}return false}catch(error){console.error(Error determining Ken Burns usage:,error);return false}},getDisplayStrategy:(imageRatio,displayMode)>{try{const matchScoreImageUtils.calculateAspectRatioMatch(imageRatio);const useKenBurnsImageUtils.shouldUseKenBurns(imageRatio,displayMode);return{imageRatio,matchScore:Math.round(matchScore*100),useKenBurns,strategy:useKenBurns?Ken Burns \u52A8\u6001\u586B\u5145:\u827A\u672F\u753B\u6846\u6A21\u5F0F,reason:useKenBurns?\u56FE\u7247\u6BD4\u4F8B\u4E0E\u753B\u6846\u5339\u914D\u5EA6\u8F83\u9AD8\uFF0C\u9002\u5408\u4F7F\u7528\u52A8\u6001\u6548\u679C:\u56FE\u7247\u6BD4\u4F8B\u4E0E\u753B\u6846\u5DEE\u5F02\u8F83\u5927\uFF0C\u4F7F\u7528\u80CC\u666F\u865A\u5316\u4FDD\u6301\u5B8C\u6574\u6027}}catch(error){console.error(Error getting display strategy:,error);return{imageRatio,matchScore:0,useKenBurns:false,strategy:\u827A\u672F\u753B\u6846\u6A21\u5F0F,reason:\u51FA\u73B0\u9519\u8BEF\uFF0C\u4F7F\u7528\u9ED8\u8BA4\u6A21\u5F0F}}}};/script>script>class ErrorBoundary extends React.Component{constructor(props){super(props);this.state{hasError:false,error:null}}static getDerivedStateFromError(error){if(error&&error.message&&error.message.includes(SortableJS)){console.warn(SortableJS error ignored:,error.message);return{hasError:false,error:null}}return{hasError:true,error}}componentDidCatch(error,errorInfo){if(error&&error.message&&error.message.includes(SortableJS)){console.warn(SortableJS error caught and ignored:,error.message);return}console.error(ErrorBoundary caught an error:,error,errorInfo.componentStack)}render(){if(this.state.hasError){return React.createElement(div,{className:min-h-screen flex items-center justify-center bg-gray-50,data-uid:app.js::div0::913:28:8::1415:39:14},React.createElement(div,{className:text-center,data-uid:app.js::div0.div1::998:29:10::1400:38:16},React.createElement(h1,{className:text-2xl font-bold text-gray-900 mb-4,data-uid:app.js::div0.div1.h11::1040:30:12::1103:30:75},\u51FA\u73B0\u9519\u8BEF),React.createElement(p,{className:text-gray-600 mb-4,data-uid:app.js::div0.div1.p3::1116:31:12::1165:31:61},\u62B1\u6B49\uFF0C\u53D1\u751F\u4E86\u610F\u5916\u9519\u8BEF\u3002),React.createElement(button,{onClick:()>window.location.reload(),className:px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700,data-uid:app.js::div0.div1.button5::1178:32:12::1383:37:21},\u91CD\u65B0\u52A0\u8F7D)))}return this.props.children}}function App(){try{React.useEffect(()>{const originalErrorwindow.onerror;window.onerrorfunction(message,source,lineno,colno,error){if(message&&typeof messagestring&&message.includes(SortableJS)){console.warn(SortableJS error suppressed:,message);return true}if(originalError){return originalError.apply(this,arguments)}return false};return()>{window.onerrororiginalError}},);constcurrentIndex,setCurrentIndexReact.useState(0);constdisplayMode,setDisplayModeReact.useState(dynamic);constframeOrientation,setFrameOrientationReact.useState(landscape);constisPlaying,setIsPlayingReact.useState(true);constimagesLoaded,setImagesLoadedReact.useState(false);constloadingProgress,setLoadingProgressReact.useState(0);constinsertMode,setInsertModeReact.useState(false);constinsertAnimation,setInsertAnimationReact.useState(slideIn);consttouchStartX,setTouchStartXReact.useState(0);consttouchEndX,setTouchEndXReact.useState(0);constisGestureActive,setIsGestureActiveReact.useState(false);constswipeCount,setSwipeCountReact.useState(0);const images{id:1,url:https://app.trickle.so/storage/public/images/usr_1347286f60000001/9055d288-ea18-496a-9e5d-90d11af8f391.jpeg,ratio:16:9,aspectClass:aspect-16-9,title:\u81EA\u7136\u98CE\u5149 (16:9),description:\u80F6\u7247\u6444\u5F71\u5F3A\u900F\u89C6\u955C\u5934\u611F},{id:2,url:https://app.trickle.so/storage/public/images/usr_1347286f60000001/31485950-0bb4-44e2-af41-91f34298db3b.jpeg,ratio:2:3,aspectClass:aspect-2-3,title:\u81EA\u7136\u98CE\u5149 (2:3),description:\u4F4E\u9971\u548C\u7EFF\u8272\u8C03\u8349\u5730\u98CE\u5149},{id:3,url:https://app.trickle.so/storage/public/images/usr_1347286f60000001/dc236707-514b-43a4-ab96-3cb82d1d491d.jpeg,ratio:4:3,aspectClass:aspect-4-3,title:\u80F6\u7247\u6444\u5F71 (4:3),description:\u5BF9\u7126\u6A21\u7CCA\u6C1B\u56F4\u611F\u6444\u5F71},{id:4,url:https://app.trickle.so/storage/public/images/usr_1347286f60000001/c230291c-024b-4c15-be44-aceaed419036.jpeg,ratio:3:4,aspectClass:aspect-3-4,title:\u4EBA\u50CF\u6444\u5F71 (3:4),description:\u6C1B\u56F4\u611F\u4EBA\u50CF\u5927\u7247\u89C6\u89D2},{id:5,url:https://app.trickle.so/storage/public/images/usr_1347286f60000001/f58b44f1-7fc8-4ad1-a4d4-f4d3d098c1e0.jpeg,ratio:9:16,aspectClass:aspect-9-16,title:\u4EBA\u7269\u8096\u50CF (9:16),description:\u5E74\u8F7B\u5973\u5B50\u65F6\u5C1A\u8096\u50CF},{id:6,url:https://app.trickle.so/storage/public/images/usr_1347286f60000001/cd06bcec-2b07-417c-b860-c86fd606c2b7.jpeg,ratio:3:2,aspectClass:aspect-3-2,title:\u52A8\u611F\u6444\u5F71 (3:2),description:\u8FD0\u52A8\u6A21\u7CCA\u827A\u672F\u6548\u679C};React.useEffect(()>{const preloadImagesasync()>{const imagePromisesimages.map((image,index)>{return new Promise((resolve,reject)>{const imgnew Image;img.onload()>{setLoadingProgress(prev>{const newProgress(index+1)/images.length*100;return newProgress});resolve(img)};img.onerrorreject;img.srcimage.url})});try{await Promise.all(imagePromises);setImagesLoaded(true);console.log(\u6240\u6709\u56FE\u7247\u9884\u52A0\u8F7D\u5B8C\u6210)}catch(error){console.error(\u56FE\u7247\u9884\u52A0\u8F7D\u5931\u8D25:,error);setImagesLoaded(true)}};preloadImages()},);React.useEffect(()>{let interval;if(isPlaying&&imagesLoaded){intervalsetInterval(()>{setCurrentIndex(prev>(prev+1)%images.length)},5000)}return()>clearInterval(interval)},isPlaying,imagesLoaded,images.length);const currentImageimagescurrentIndex;const shouldUseKenBurnsImageUtils.shouldUseKenBurns(currentImage.ratio,displayMode,frameOrientation);const insertPhoto(animationTypeslideIn,insertImagenull)>{const originalIndexcurrentIndex;console.log(\u63D2\u64AD\u5F00\u59CB:,{animationType,insertImage:insertImage?.title,originalIndex});setInsertAnimation(animationType);setInsertMode(true);const wasPlayingisPlaying;setIsPlaying(false);if(insertImage){const insertImageIndeximages.findIndex(img>img.idinsertImage.id);if(insertImageIndex!-1){console.log(\u5207\u6362\u5230\u63D2\u64AD\u7167\u7247:,insertImageIndex);setCurrentIndex(insertImageIndex)}}setTimeout(()>{console.log(\u63D2\u64AD\u7ED3\u675F\uFF0C\u6062\u590D\u6B63\u5E38);setInsertMode(false);if(insertImage){const nextIndex(originalIndex+1)%images.length;console.log(\u5207\u6362\u5230\u4E0B\u4E00\u5F20:,nextIndex);setCurrentIndex(nextIndex)}setIsPlaying(wasPlaying)},2000)};const getRandomInsertAnimation()>{const animationsslideIn,zoomBounce,spiralIn,flipReveal,particleBurst;return animationsMath.floor(Math.random()*animations.length)};const handleTouchStarte>{if(insertMode){console.log(\u63D2\u64AD\u6A21\u5F0F\u4E2D\uFF0C\u8DF3\u8FC7\u624B\u52BF);return}const startXe.targetTouches0.clientX;console.log(\u89E6\u6478\u5F00\u59CB:,startX);setTouchStartX(startX);setTouchEndX(startX);setIsGestureActive(true)};const handleTouchMovee>{if(insertMode||!isGestureActive)return;const endXe.targetTouches0.clientX;setTouchEndX(endX);console.log(\u89E6\u6478\u79FB\u52A8:,{start:touchStartX,end:endX,diff:touchStartX-endX})};const handleTouchEnd()>{if(insertMode){console.log(\u63D2\u64AD\u6A21\u5F0F\u4E2D\uFF0C\u8DF3\u8FC7\u624B\u52BF\u7ED3\u675F);return}if(!isGestureActive){console.log(\u624B\u52BF\u672A\u6FC0\u6D3B\uFF0C\u8DF3\u8FC7);return}const touchDifftouchStartX-touchEndX;const minSwipeDistance50;console.log(\u89E6\u6478\u7ED3\u675F:,{touchStartX,touchEndX,touchDiff,absValue:Math.abs(touchDiff),minRequired:minSwipeDistance,isValidSwipe:Math.abs(touchDiff)>minSwipeDistance});if(Math.abs(touchDiff)>minSwipeDistance){let nextIndex;if(touchDiff>0){nextIndex(currentIndex+1)%images.length;console.log(\u5411\u5DE6\u6ED1\u52A8\uFF0C\u4E0B\u4E00\u5F20)}else{nextIndex(currentIndex-1+images.length)%images.length;console.log(\u5411\u53F3\u6ED1\u52A8\uFF0C\u4E0A\u4E00\u5F20)}const newSwipeCountswipeCount+1;setSwipeCount(newSwipeCount);const shouldTriggerInsertnewSwipeCount%70;console.log(\u624B\u52BF\u5207\u6362\u68C0\u6D4B:,{shouldTriggerInsert,swipeCount:newSwipeCount,touchDiff,nextIndex,currentIndex,imagesLength:images.length});if(shouldTriggerInsert){const randomAnimationgetRandomInsertAnimation();const availableImagesimages.filter((_,index)>index!currentIndex);const randomImageavailableImagesMath.floor(Math.random()*availableImages.length);console.log(\u89E6\u53D1\u63D2\u64AD\u7279\u6548 (\u7B2C+newSwipeCount+\u6B21\u6ED1\u52A8):,{randomAnimation,randomImage:randomImage?.title,availableImagesCount:availableImages.length});insertPhoto(randomAnimation,randomImage)}else{console.log(\u6B63\u5E38\u5207\u6362\u7167\u7247\u5230:,nextIndex,(\u6ED1\u52A8\u8BA1\u6570:,newSwipeCount+));setCurrentIndex(nextIndex)}}else{console.log(\u6ED1\u52A8\u8DDD\u79BB\u4E0D\u8DB3\uFF0C\u672A\u89E6\u53D1\u5207\u6362)}setIsGestureActive(false);setTouchStartX(0);setTouchEndX(0)};const handleKeyDownReact.useCallback(e>{if(insertMode)return;if(e.keyArrowLeft){e.preventDefault();const nextIndex(currentIndex-1+images.length)%images.length;const newSwipeCountswipeCount+1;setSwipeCount(newSwipeCount);const shouldTriggerInsertnewSwipeCount%70;console.log(\u952E\u76D8\u5DE6\u952E\u5207\u6362\u68C0\u6D4B:,{shouldTriggerInsert,swipeCount:newSwipeCount,nextIndex,currentIndex});if(shouldTriggerInsert){const randomAnimationgetRandomInsertAnimation();const availableImagesimages.filter((_,index)>index!currentIndex);const randomImageavailableImagesMath.floor(Math.random()*availableImages.length);console.log(\u952E\u76D8\u89E6\u53D1\u63D2\u64AD\u7279\u6548 (\u7B2C+newSwipeCount+\u6B21):,{randomAnimation,randomImage:randomImage?.title});insertPhoto(randomAnimation,randomImage)}else{console.log(\u952E\u76D8\u6B63\u5E38\u5207\u6362\u7167\u7247\u5230:,nextIndex,(\u8BA1\u6570:,newSwipeCount+));setCurrentIndex(nextIndex)}}else if(e.keyArrowRight){e.preventDefault();const nextIndex(currentIndex+1)%images.length;const newSwipeCountswipeCount+1;setSwipeCount(newSwipeCount);const shouldTriggerInsertnewSwipeCount%70;console.log(\u952E\u76D8\u53F3\u952E\u5207\u6362\u68C0\u6D4B:,{shouldTriggerInsert,swipeCount:newSwipeCount,nextIndex,currentIndex});if(shouldTriggerInsert){const randomAnimationgetRandomInsertAnimation();const availableImagesimages.filter((_,index)>index!currentIndex);const randomImageavailableImagesMath.floor(Math.random()*availableImages.length);console.log(\u952E\u76D8\u89E6\u53D1\u63D2\u64AD\u7279\u6548 (\u7B2C+newSwipeCount+\u6B21):,{randomAnimation,randomImage:randomImage?.title});insertPhoto(randomAnimation,randomImage)}else{console.log(\u952E\u76D8\u6B63\u5E38\u5207\u6362\u7167\u7247\u5230:,nextIndex,(\u8BA1\u6570:,newSwipeCount+));setCurrentIndex(nextIndex)}}else if(e.key ||e.codeSpace){e.preventDefault();setIsPlaying(prev>!prev)}},insertMode,images.length,currentIndex,swipeCount);React.useEffect(()>{window.addEventListener(keydown,handleKeyDown);return()>window.removeEventListener(keydown,handleKeyDown)},handleKeyDown);if(!imagesLoaded){return React.createElement(div,{className:min-h-screen bg-var(--background-color) flex items-center justify-center,data-name:loading,data-file:app.js,data-uid:app.js::div0::13053:391:8::14265:413:14},React.createElement(div,{className:text-center space-y-6,data-uid:app.js::div0.div1::13195:392:10::14250:412:16},React.createElement(div,{className:w-16 h-16 mx-auto,data-uid:app.js::div0.div1.div1::13247:393:12::13436:395:18},React.createElement(div,{className:w-full h-full border-4 border-gray-600 border-t-var(--primary-color) rounded-full animate-spin,data-uid:app.js::div0.div1.div1.div1::13297:394:14::13417:394:134})),React.createElement(div,{className:space-y-2,data-uid:app.js::div0.div1.div3::13449:396:12::13637:399:18},React.createElement(h2,{className:text-2xl font-semibold text-white,data-uid:app.js::div0.div1.div3.h21::13491:397:14::13554:397:77},\u52A0\u8F7D\u56FE\u7247\u4E2D...),React.createElement(p,{className:text-gray-400,data-uid:app.js::div0.div1.div3.p3::13569:398:14::13618:398:63},\u6B63\u5728\u9884\u52A0\u8F7D\u6240\u6709\u56FE\u7247\u4EE5\u63D0\u4F9B\u6700\u4F73\u4F53\u9A8C)),React.createElement(div,{className:w-64 mx-auto,data-uid:app.js::div0.div1.div5::13650:400:12::14233:411:18},React.createElement(div,{className:flex justify-between text-sm text-gray-400 mb-2,data-uid:app.js::div0.div1.div5.div1::13695:401:14::13875:404:20},React.createElement(span,{data-uid:app.js::div0.div1.div5.div1.span1::13777:402:16::13794:402:33},\u52A0\u8F7D\u8FDB\u5EA6),React.createElement(span,{data-uid:app.js::div0.div1.div5.div1.span3::13811:403:16::13854:403:59},Math.round(loadingProgress),%)),React.createElement(div,{className:w-full bg-gray-700 rounded-full h-2,data-uid:app.js::div0.div1.div5.div3::13890:405:14::14214:410:20},React.createElement(div,{className:bg-gradient-to-r from-var(--primary-color) to-var(--accent-color) h-2 rounded-full transition-all duration-300,style:{width:`${loadingProgress}%`},data-uid:app.js::div0.div1.div5.div3.div1::13960:406:16::14193:409:23})))))}return React.createElement(div,{className:min-h-screen bg-var(--background-color) p-6,data-name:app,data-file:app.js,data-uid:app.js::div0::14301:418:6::22930:597:12},React.createElement(div,{className:max-w-6xl mx-auto,data-uid:app.js::div0.div1::14408:419:8::22917:596:14},React.createElement(div,{className:text-center mb-8,data-uid:app.js::div0.div1.div3::14477:421:10::14837:428:16},React.createElement(h1,{className:text-4xl font-bold mb-4 bg-gradient-to-r from-blue-400 to-amber-400 bg-clip-text text-transparent,data-uid:app.js::div0.div1.div3.h11::14524:422:12::14679:424:17},\u52A8\u6001\u827A\u672F\u753B\u6846\u6F14\u793A),React.createElement(p,{className:text-lg text-gray-300 max-w-3xl mx-auto,data-uid:app.js::div0.div1.div3.p3::14692:425:12::14820:427:16},\u667A\u80FD\u8BC6\u522B\u7167\u7247\u6BD4\u4F8B\uFF0C\u81EA\u52A8\u9009\u62E9\u6700\u4F73\u663E\u793A\u6548\u679C\uFF1AKen Burns \u52A8\u6001\u586B\u5145\u6216\u827A\u672F\u753B\u6846\u6A21\u5F0F)),React.createElement(div,{className:flex flex-col xl:flex-row gap-8 items-start,data-uid:app.js::div0.div1.div7::14873:431:10::21577:565:16},React.createElement(div,{className:flex-1 max-w-4xl mx-auto,data-uid:app.js::div0.div1.div7.div3::14974:433:12::20773:543:18},React.createElement(div,{className:flex justify-center,onTouchStart:handleTouchStart,onTouchMove:handleTouchMove,onTouchEnd:handleTouchEnd,data-uid:app.js::div0.div1.div7.div3.div1::15031:434:14::15644:449:20},React.createElement(ArtFrame,{image:currentImage,displayMode:displayMode,frameOrientation:frameOrientation,shouldUseKenBurns:shouldUseKenBurns,insertMode:insertMode,insertAnimation:insertAnimation,isGestureActive:isGestureActive,data-uid:app.js::div0.div1.div7.div3.div1.ArtFrame1::15255:440:16::15623:448:18})),React.createElement(div,{className:mt-6 text-center,data-uid:app.js::div0.div1.div7.div3.div5::15689:452:14::16217:461:20},React.createElement(div,{className:text-sm text-gray-400 flex items-center justify-center gap-2,data-uid:app.js::div0.div1.div7.div3.div5.div1::15740:453:16::15944:456:22},React.createElement(div,{className:icon-hand text-sm,data-uid:app.js::div0.div1.div7.div3.div5.div1.div1::15837:454:18::15878:454:59}),\u5DE6\u53F3\u6ED1\u52A8\u5207\u6362\u7167\u7247\uFF0C\u6BCF\u6ED1\u52A87\u6B21\u5FC5\u5B9A\u89E6\u53D11\u6B21\u63D2\u64AD\u7279\u6548),React.createElement(div,{className:text-xs text-gray-500 mt-1 flex items-center justify-center gap-4,data-uid:app.js::div0.div1.div7.div3.div5.div3::15961:457:16::16196:460:22},React.createElement(span,{data-uid:app.js::div0.div1.div7.div3.div5.div3.span1::16063:458:18::16094:458:49},\u952E\u76D8\uFF1A\u2190 \u2192 \u5207\u6362\uFF0C\u7A7A\u683C\u952E\u6682\u505C/\u64AD\u653E),React.createElement(span,{className:text-amber-400,data-uid:app.js::div0.div1.div7.div3.div5.div3.span3::16113:459:18::16173:459:78},\u6ED1\u52A8\u8BA1\u6570: ,swipeCount,/7))),React.createElement(div,{className:mt-8 grid grid-cols-2 md:grid-cols-3 gap-3 max-w-2xl mx-auto,data-uid:app.js::div0.div1.div7.div3.div9::16262:464:14::20754:542:20},React.createElement(button,{onClick:()>{const randomImageimages.filter((_,index)>index!currentIndex)Math.floor(Math.random()*(images.length-1));insertPhoto(slideIn,randomImage)},className:px-4 py-3 bg-gradient-to-r from-purple-500 to-pink-500 text-white rounded-lg hover:from-purple-600 hover:to-pink-600 transition-all transform hover:scale-105 shadow-lg,data-uid:app.js::div0.div1.div7.div3.div9.button1::16357:465:16::17047:476:25},React.createElement(div,{className:flex items-center justify-center gap-2,data-uid:app.js::div0.div1.div7.div3.div9.button1.div1::16854:472:18::17021:475:24},React.createElement(div,{className:icon-zap text-sm,data-uid:app.js::div0.div1.div7.div3.div9.button1.div1.div1::16931:473:20::16971:473:60}),\u6ED1\u5165\u63D2\u64AD)),React.createElement(button,{onClick:()>{const randomImageimages.filter((_,index)>index!currentIndex)Math.floor(Math.random()*(images.length-1));insertPhoto(zoomBounce,randomImage)},className:px-4 py-3 bg-gradient-to-r from-blue-500 to-cyan-500 text-white rounded-lg hover:from-blue-600 hover:to-cyan-600 transition-all transform hover:scale-105 shadow-lg,data-uid:app.js::div0.div1.div7.div3.div9.button3::17081:478:16::17775:489:25},React.createElement(div,{className:flex items-center justify-center gap-2,data-uid:app.js::div0.div1.div7.div3.div9.button3.div1::17577:485:18::17749:488:24},React.createElement(div,{className:icon-maximize text-sm,data-uid:app.js::div0.div1.div7.div3.div9.button3.div1.div1::17654:486:20::17699:486:65}),\u5F39\u8DF3\u63D2\u64AD)),React.createElement(button,{onClick:()>{const randomImageimages.filter((_,index)>index!currentIndex)Math.floor(Math.random()*(images.length-1));insertPhoto(spiralIn,randomImage)},className:px-4 py-3 bg-gradient-to-r from-green-500 to-emerald-500 text-white rounded-lg hover:from-green-600 hover:to-emerald-600 transition-all transform hover:scale-105 shadow-lg,data-uid:app.js::div0.div1.div7.div3.div9.button5::17809:491:16::18510:502:25},React.createElement(div,{className:flex items-center justify-center gap-2,data-uid:app.js::div0.div1.div7.div3.div9.button5.div1::18311:498:18::18484:501:24},React.createElement(div,{className:icon-rotate-cw text-sm,data-uid:app.js::div0.div1.div7.div3.div9.button5.div1.div1::18388:499:20::18434:499:66}),\u87BA\u65CB\u63D2\u64AD)),React.createElement(button,{onClick:()>{const randomImageimages.filter((_,index)>index!currentIndex)Math.floor(Math.random()*(images.length-1));insertPhoto(flipReveal,randomImage)},className:px-4 py-3 bg-gradient-to-r from-orange-500 to-red-500 text-white rounded-lg hover:from-orange-600 hover:to-red-600 transition-all transform hover:scale-105 shadow-lg,data-uid:app.js::div0.div1.div7.div3.div9.button7::18544:504:16::19247:515:25},React.createElement(div,{className:flex items-center justify-center gap-2,data-uid:app.js::div0.div1.div7.div3.div9.button7.div1::19042:511:18::19221:514:24},React.createElement(div,{className:icon-flip-horizontal text-sm,data-uid:app.js::div0.div1.div7.div3.div9.button7.div1.div1::19119:512:20::19171:512:72}),\u7FFB\u8F6C\u63D2\u64AD)),React.createElement(button,{onClick:()>{const randomImageimages.filter((_,index)>index!currentIndex)Math.floor(Math.random()*(images.length-1));insertPhoto(particleBurst,randomImage)},className:px-4 py-3 bg-gradient-to-r from-amber-500 to-yellow-500 text-white rounded-lg hover:from-amber-600 hover:to-yellow-600 transition-all transform hover:scale-105 shadow-lg,data-uid:app.js::div0.div1.div7.div3.div9.button9::19281:517:16::19984:528:25},React.createElement(div,{className:flex items-center justify-center gap-2,data-uid:app.js::div0.div1.div7.div3.div9.button9.div1::19786:524:18::19958:527:24},React.createElement(div,{className:icon-sparkles text-sm,data-uid:app.js::div0.div1.div7.div3.div9.button9.div1.div1::19863:525:20::19908:525:65}),\u7206\u53D1\u63D2\u64AD)),React.createElement(button,{onClick:()>{const randomImageimages.filter((_,index)>index!currentIndex)Math.floor(Math.random()*(images.length-1));insertPhoto(getRandomInsertAnimation(),randomImage)},className:px-4 py-3 bg-gradient-to-r from-indigo-500 to-purple-500 text-white rounded-lg hover:from-indigo-600 hover:to-purple-600 transition-all transform hover:scale-105 shadow-lg,data-uid:app.js::div0.div1.div7.div3.div9.button11::20018:530:16::20733:541:25},React.createElement(div,{className:flex items-center justify-center gap-2,data-uid:app.js::div0.div1.div7.div3.div9.button11.div1::20536:537:18::20707:540:24},React.createElement(div,{className:icon-shuffle text-sm,data-uid:app.js::div0.div1.div7.div3.div9.button11.div1.div1::20613:538:20::20657:538:64}),\u968F\u673A\u63D2\u64AD)))),React.createElement(div,{className:w-full xl:w-80 xl:flex-shrink-0 space-y-6,data-uid:app.js::div0.div1.div7.div7::20814:546:12::21560:564:18},React.createElement(ControlPanel,{displayMode:displayMode,onModeChange:setDisplayMode,frameOrientation:frameOrientation,onFrameOrientationChange:setFrameOrientation,isPlaying:isPlaying,onPlayToggle:setIsPlaying,currentIndex:currentIndex,totalImages:images.length,onImageSelect:setCurrentIndex,data-uid:app.js::div0.div1.div7.div7.ControlPanel1::20888:547:14::21340:557:16}),React.createElement(ImageInfo,{image:currentImage,frameOrientation:frameOrientation,shouldUseKenBurns:shouldUseKenBurns,data-uid:app.js::div0.div1.div7.div7.ImageInfo3::21370:559:14::21541:563:16}))),React.createElement(div,{className:mt-12,data-uid:app.js::div0.div1.div11::21613:568:10::22902:595:16},React.createElement(h3,{className:text-xl font-semibold mb-4 text-center,data-uid:app.js::div0.div1.div11.h31::21649:569:12::21713:569:76},\u56FE\u7247\u5E8F\u5217),React.createElement(div,{className:grid grid-cols-3 md:grid-cols-6 gap-4,data-uid:app.js::div0.div1.div11.div3::21726:570:12::22885:594:18},images.map((image,index)>React.createElement(div,{key:image.id,className:`cursor-pointer rounded-lg overflow-hidden border-2 transition-all duration-300 ${indexcurrentIndex?border-var(--primary-color) shadow-lg shadow-blue-500/25:border-gray-700 hover:border-gray-500}`,onClick:()>setCurrentIndex(index),data-uid:app.js::div0.div1.div11.div3.div0::21844:572:16::22848:592:22},React.createElement(div,{className:`${image.aspectClass} relative overflow-hidden`,data-uid:app.js::div0.div1.div11.div3.div0.div1::22304:581:18::22600:587:24},React.createElement(img,{src:image.url,alt:image.title,className:absolute inset-0 w-full h-full object-cover,data-uid:app.js::div0.div1.div11.div3.div0.div1.img1::22390:582:20::22575:586:22})),React.createElement(div,{className:p-2 bg-gray-800,data-uid:app.js::div0.div1.div11.div3.div0.div3::22619:588:18::22825:591:24},React.createElement(p,{className:text-sm font-medium,data-uid:app.js::div0.div1.div11.div3.div0.div3.p1::22673:589:20::22725:589:72},image.ratio),React.createElement(p,{className:text-xs text-gray-400,data-uid:app.js::div0.div1.div11.div3.div0.div3.p3::22746:590:20::22800:590:74},image.title))))))))}catch(error){console.error(App component error:,error);return null}}const rootReactDOM.createRoot(document.getElementById(root));root.render(React.createElement(ErrorBoundary,{data-uid:app.js::ErrorBoundary0::23114:607:2::23160:609:18},React.createElement(App,{data-uid:app.js::ErrorBoundary0.App1::23134:608:4::23141:608:11})));/script>/body>/html>

Subdomains

Date	Domain	IP
d8mgvujx3fvf.trickle.host	2026-02-09	3.163.24.43
5nr76d0s8jdn.trickle.host	2026-01-30	3.163.24.91
b70hpeyi134r.trickle.host	2026-02-09	3.163.24.44
alggh8vo61az.trickle.host	2026-02-10	3.163.24.43

View on OTX | View on ThreatMiner

Data with thanks to AlienVault OTX, VirusTotal, Malwr and others. [Sitemap]

Domain > alggh8vo61az.trickle.host

Is this malicious?

DNS Resolutions

Port 80

Port 443

Subdomains