// ==UserScript== // @name 0531移动端适配完成 // @namespace https://zbai.art/ // @version 0.2.0 // @description 将 zbai.art 首页、模板页与 PC 图片创作工作区适配为手机浏览器可用的纵向布局。 // @author Codex // @match https://zbai.art/* // @match https://www.zbai.art/* // @match https://jew.haistudio.ai/* // @run-at document-start // @grant none // ==/UserScript== (function () { 'use strict'; const STYLE_ID = 'zbai-mobile-adapter-style'; const CLASS_READY = 'zbai-mobile-adapted'; const SHEET_ID = 'zbai-mobile-bottom-sheet'; const BADGE_ID = 'zbai-mobile-adapter-badge'; const MOBILE_QUERY = '(max-width: 768px), (pointer: coarse), (max-device-width: 820px)'; const selectors = { root: '#pictureEditor', header: '.picture-editor-header', headerInner: '#picture-editor-header', headerCenter: '.picture-editor-header .center', headerLeft: '.picture-editor-header .left', headerRight: '.picture-editor-header .right', content: '.picture-editor-content', leftDrawer: '.picture-editor-content-left-drawer', contentBox: '.picture-editor-content-box', render: '.picture-editor-content-render', control: '.picture-editor-content-control', controlInner: '.PictureEditorControl_PictureEditorControl__T6FHN', controlConfig: '.control-config', controlBottom: '.ControlBottom_controlBottom__gooOU', inputWrap: '#multifunctional-input', textArea: 'textarea.textarea-buttons, textarea.ant-input', modelWrap: '.ChooseModelWithDetails_ChooseModelWithDetails__m_Cbs', modelBox: '.ChooseModelWithDetails_selectBox__HoIuc', ratioWrap: '.ChooseSizeBase_chooseSizeBase__KgHNI', numberWrap: '.ChooseNumber_ChooseNumber__J1uo_', generateWrap: '.generate-button-container', loginModal: '.LoginModal_LoginModal__O59AS', modalShell: '.fixed.top-0.left-0.w-screen.h-screen', }; const media = window.matchMedia(MOBILE_QUERY); function isMobile() { const physicalWidth = Math.min(window.screen.width || window.innerWidth, window.screen.height || window.innerHeight); const hasTouch = navigator.maxTouchPoints > 0 || 'ontouchstart' in window; return media.matches || window.innerWidth <= 768 || (hasTouch && physicalWidth <= 820); } function injectStyles() { if (document.getElementById(STYLE_ID)) return; const style = document.createElement('style'); style.id = STYLE_ID; style.textContent = ` @media (max-width: 768px), (pointer: coarse), (max-device-width: 820px) { html[data-zbai-mobile="1"], html[data-zbai-mobile="1"] body#haimeta { width: 100vw !important; min-width: 0 !important; min-height: 100dvh !important; overflow-x: hidden !important; -webkit-text-size-adjust: 100% !important; } html[data-zbai-mobile="1"][data-zbai-page="editor"], html[data-zbai-mobile="1"][data-zbai-page="editor"] body#haimeta { height: 100dvh !important; overflow: hidden !important; overscroll-behavior: none !important; } html[data-zbai-mobile="1"] #haimeta *, html[data-zbai-mobile="1"] #haimeta *::before, html[data-zbai-mobile="1"] #haimeta *::after { box-sizing: border-box !important; } html[data-zbai-mobile="1"][data-zbai-page="editor"] #root, html[data-zbai-mobile="1"][data-zbai-page="editor"] .PageContainer_haimetaApp__qfjGd, html[data-zbai-mobile="1"][data-zbai-page="editor"] .PageContainer_indexContent__5aBHJ, html[data-zbai-mobile="1"][data-zbai-page="editor"] #pictureEditor { width: 100vw !important; min-width: 0 !important; max-width: 100vw !important; height: 100dvh !important; min-height: 100dvh !important; overflow: hidden !important; } html[data-zbai-mobile="1"][data-zbai-page="editor"] #pictureEditor { display: flex !important; flex-direction: column !important; transform: none !important; margin: 0 !important; left: 0 !important; right: auto !important; } html[data-zbai-mobile="1"][data-zbai-page="home"] #root, html[data-zbai-mobile="1"][data-zbai-page="home"] .PageContainer_haimetaApp__qfjGd, html[data-zbai-mobile="1"][data-zbai-page="home"] .PageContainer_indexContent__5aBHJ { width: 100vw !important; min-width: 0 !important; max-width: 100vw !important; min-height: 100dvh !important; height: auto !important; overflow-x: hidden !important; overflow-y: auto !important; transform: none !important; margin: 0 !important; left: 0 !important; right: auto !important; } html[data-zbai-mobile="1"][data-zbai-page="home"] #picture-editor-header.PictureEditorHeader_homepageHeader__j_gnO, html[data-zbai-mobile="1"][data-zbai-page="home"] .picture-editor-header, html[data-zbai-mobile="1"][data-zbai-page="home"] #picture-editor-header { width: 100vw !important; min-width: 0 !important; height: calc(52px + env(safe-area-inset-top, 0px)) !important; min-height: calc(52px + env(safe-area-inset-top, 0px)) !important; padding: env(safe-area-inset-top, 0px) 10px 0 !important; position: sticky !important; top: 0 !important; z-index: 80 !important; display: flex !important; align-items: center !important; justify-content: space-between !important; background: var(--Background-1-Normal, #f4f5fb) !important; } html[data-zbai-mobile="1"][data-zbai-page="home"] .SidebarNavigation_sidebarNavigation__KTG_b { display: none !important; } html[data-zbai-mobile="1"][data-zbai-page="home"] main.index-main, html[data-zbai-mobile="1"][data-zbai-page="home"] .index-main-content, html[data-zbai-mobile="1"][data-zbai-page="home"] #index-main-content--right { width: 100vw !important; min-width: 0 !important; max-width: 100vw !important; height: auto !important; min-height: calc(100dvh - 52px) !important; margin: 0 !important; padding-left: 0 !important; padding-right: 0 !important; transform: none !important; left: 0 !important; right: auto !important; overflow-x: hidden !important; overflow-y: visible !important; } html[data-zbai-mobile="1"][data-zbai-page="home"] #index-main-content--right { padding: 0 10px 24px !important; } html[data-zbai-mobile="1"][data-zbai-page="home"] [class*="waterfall"], html[data-zbai-mobile="1"][data-zbai-page="home"] [class*="Waterfall"], html[data-zbai-mobile="1"][data-zbai-page="home"] [class*="card-list"], html[data-zbai-mobile="1"][data-zbai-page="home"] [class*="CardList"], html[data-zbai-mobile="1"][data-zbai-page="home"] [class*="template-list"], html[data-zbai-mobile="1"][data-zbai-page="home"] [class*="TemplateList"] { width: 100% !important; max-width: 100% !important; min-width: 0 !important; } html[data-zbai-mobile="1"][data-zbai-page="home"] .styles_card-wrapper__H86tW, html[data-zbai-mobile="1"][data-zbai-page="home"] .styles_card-wrapper--waterfall__KJ_E0, html[data-zbai-mobile="1"][data-zbai-page="home"] .AgentPromptCard_agentPromptCard____KEc, html[data-zbai-mobile="1"][data-zbai-page="home"] .HomePopularTools_basic-item__fg43t { width: 100% !important; min-width: 0 !important; max-width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; position: relative !important; left: auto !important; right: auto !important; top: auto !important; transform: none !important; } html[data-zbai-mobile="1"][data-zbai-page="home"] .card-wrapper-content, html[data-zbai-mobile="1"][data-zbai-page="home"] .styles_card-media__sZXbE, html[data-zbai-mobile="1"][data-zbai-page="home"] .styles_card-media__sZXbE img, html[data-zbai-mobile="1"][data-zbai-page="home"] .styles_card-media__sZXbE video { width: 100% !important; max-width: 100% !important; } html[data-zbai-mobile="1"][data-zbai-page="home"] .styles_card-overlay__S7Kx2 { opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; transform: none !important; } html[data-zbai-mobile="1"][data-zbai-page="home"] .styles_card-overlay-title__cwSMT, html[data-zbai-mobile="1"][data-zbai-page="home"] .styles_card-overlay-button__7dxuk { max-width: calc(100vw - 44px) !important; } html[data-zbai-mobile="1"][data-zbai-page="home"] .styles_card-overlay-button__7dxuk { min-height: 34px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; } html[data-zbai-mobile="1"] .picture-editor-header { height: calc(52px + env(safe-area-inset-top, 0px)) !important; min-height: calc(52px + env(safe-area-inset-top, 0px)) !important; padding-top: env(safe-area-inset-top, 0px) !important; position: sticky !important; top: 0 !important; z-index: 80 !important; background: var(--Background-1-Normal, #f4f5fb) !important; } html[data-zbai-mobile="1"] #picture-editor-header { height: 52px !important; min-height: 52px !important; padding: 0 10px !important; display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; align-items: center !important; gap: 8px !important; } html[data-zbai-mobile="1"] .picture-editor-header .center { display: none !important; } html[data-zbai-mobile="1"] .picture-editor-header .left { width: auto !important; min-width: 0 !important; max-width: 100% !important; position: static !important; transform: none !important; overflow: hidden !important; } html[data-zbai-mobile="1"] .picture-editor-header .left img { max-height: 30px !important; width: auto !important; } html[data-zbai-mobile="1"] .picture-editor-header .right { width: auto !important; min-width: 0 !important; max-width: 46vw !important; position: static !important; display: flex !important; align-items: center !important; justify-content: flex-end !important; gap: 8px !important; overflow: hidden !important; } html[data-zbai-mobile="1"] .picture-editor-header .right .login-btn { white-space: nowrap !important; } html[data-zbai-mobile="1"] .picture-editor-header .right button { min-width: 0 !important; height: 32px !important; padding: 0 10px !important; white-space: nowrap !important; } html[data-zbai-mobile="1"] .picture-editor-content { height: calc(100dvh - 52px - env(safe-area-inset-top, 0px)) !important; width: 100vw !important; min-width: 0 !important; display: flex !important; flex-direction: column !important; overflow: hidden !important; position: relative !important; transform: none !important; margin: 0 !important; padding: 0 !important; left: 0 !important; right: auto !important; } html[data-zbai-mobile="1"] .picture-editor-content-left-drawer, html[data-zbai-mobile="1"] .PictureEditorHistoryDrawer_container__fn3Ud, html[data-zbai-mobile="1"] .TaskSide_record__JuEDU { display: none !important; } html[data-zbai-mobile="1"] .picture-editor-content-box { width: 100vw !important; min-width: 0 !important; height: 100% !important; margin: 0 !important; left: auto !important; right: auto !important; transform: none !important; display: flex !important; flex-direction: column !important; overflow: hidden !important; position: relative !important; } html[data-zbai-mobile="1"] .picture-editor-content-render { width: 100vw !important; min-width: 0 !important; flex: 1 1 auto !important; height: auto !important; min-height: 34dvh !important; max-height: 52dvh !important; padding: 8px !important; margin: 0 !important; left: 0 !important; right: auto !important; transform: none !important; display: flex !important; align-items: center !important; justify-content: center !important; overflow: auto !important; -webkit-overflow-scrolling: touch !important; } html[data-zbai-mobile="1"] .picture-editor-content-render > * { max-width: 100% !important; max-height: 100% !important; } html[data-zbai-mobile="1"] .picture-editor-content-control { width: 100vw !important; min-width: 0 !important; max-width: 100vw !important; flex: 0 0 auto !important; height: auto !important; max-height: calc(58dvh - env(safe-area-inset-bottom, 0px)) !important; margin: 0 !important; left: 0 !important; right: auto !important; transform: none !important; padding: 0 10px calc(10px + env(safe-area-inset-bottom, 0px)) !important; overflow-y: auto !important; -webkit-overflow-scrolling: touch !important; border-radius: 18px 18px 0 0 !important; background: var(--Background-2-Normal, #f1f2f8) !important; box-shadow: 0 -10px 30px rgba(20, 24, 38, 0.08) !important; } html[data-zbai-mobile="1"] .PictureEditorControl_PictureEditorControl__T6FHN { width: 100% !important; min-width: 0 !important; height: auto !important; padding: 12px 0 0 !important; } html[data-zbai-mobile="1"] .control-config { width: 100% !important; height: auto !important; display: flex !important; flex-direction: column !important; gap: 12px !important; } html[data-zbai-mobile="1"] .control-config > div, html[data-zbai-mobile="1"] .option-need-margin { width: 100% !important; margin: 0 !important; } html[data-zbai-mobile="1"] .control-config-title { width: 100% !important; height: auto !important; margin: 0 0 8px !important; } html[data-zbai-mobile="1"] .PictureEditorRadioContainer_pictureEditorRadioContainer__rt0hw, html[data-zbai-mobile="1"] .picture-editor-radio-content, html[data-zbai-mobile="1"] .picture-editor-radio-group { width: 100% !important; } html[data-zbai-mobile="1"] #multifunctional-input { width: 100% !important; height: auto !important; } html[data-zbai-mobile="1"] .MultifunctionalInput_multifunctionalInput__NHcuq { width: 100% !important; min-height: 108px !important; height: auto !important; } html[data-zbai-mobile="1"] .MultifunctionalInput_multifunctionalInput__NHcuq .bg-1, html[data-zbai-mobile="1"] .MultifunctionalInput_multifunctionalInput__NHcuq .bg-2 { display: none !important; } html[data-zbai-mobile="1"] .Input_input__A9sVA, html[data-zbai-mobile="1"] .input-box, html[data-zbai-mobile="1"] textarea.textarea-buttons, html[data-zbai-mobile="1"] textarea.ant-input { width: 100% !important; } html[data-zbai-mobile="1"] textarea.textarea-buttons, html[data-zbai-mobile="1"] textarea.ant-input { min-height: 92px !important; max-height: 160px !important; font-size: 16px !important; line-height: 1.45 !important; } html[data-zbai-mobile="1"] .ChooseModelWithDetails_ChooseModelWithDetails__m_Cbs, html[data-zbai-mobile="1"] .ChooseModelWithDetails_selectBox__HoIuc, html[data-zbai-mobile="1"] .ChooseModelWithDetails_selectItem__7NA37 { width: 100% !important; min-height: 56px !important; height: auto !important; } html[data-zbai-mobile="1"] .ChooseModelWithDetails_selectItem__7NA37 { cursor: pointer !important; } html[data-zbai-mobile="1"] .ChooseSizeBase_chooseSizeBase__KgHNI, html[data-zbai-mobile="1"] .choose-size-base-shape { width: 100% !important; overflow-x: auto !important; overflow-y: hidden !important; display: flex !important; gap: 8px !important; -webkit-overflow-scrolling: touch !important; scroll-snap-type: x proximity !important; } html[data-zbai-mobile="1"] .choose-size-base-shape > div, html[data-zbai-mobile="1"] .shape-item, html[data-zbai-mobile="1"] .shape-item .item { flex: 0 0 64px !important; width: 64px !important; height: 60px !important; scroll-snap-align: start !important; } html[data-zbai-mobile="1"] .ControlBottom_controlBottom__gooOU { width: 100% !important; height: auto !important; margin-top: 12px !important; position: sticky !important; bottom: 0 !important; z-index: 5 !important; background: var(--Background-2-Normal, #f1f2f8) !important; padding-bottom: env(safe-area-inset-bottom, 0px) !important; } html[data-zbai-mobile="1"] .ChooseNumber_ChooseNumber__J1uo_, html[data-zbai-mobile="1"] .choose-number-content { width: 100% !important; } html[data-zbai-mobile="1"] .choose-number-content { display: grid !important; grid-template-columns: auto minmax(120px, 1fr) !important; align-items: center !important; gap: 12px !important; } html[data-zbai-mobile="1"] .choose-number-options { justify-self: end !important; width: min(160px, 48vw) !important; } html[data-zbai-mobile="1"] .generate-button-container, html[data-zbai-mobile="1"] .control-buttons { width: 100% !important; height: 50px !important; } html[data-zbai-mobile="1"] .generate-button-container button { min-height: 50px !important; border-radius: 12px !important; font-size: 15px !important; } html[data-zbai-mobile="1"] .fixed.top-0.left-0.w-screen.h-screen { padding: env(safe-area-inset-top, 0px) 12px env(safe-area-inset-bottom, 0px) !important; align-items: center !important; } html[data-zbai-mobile="1"] .LoginModal_LoginModal__O59AS { width: calc(100vw - 24px) !important; max-width: 420px !important; min-width: 0 !important; max-height: calc(100dvh - 48px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important; overflow-y: auto !important; border-radius: 18px !important; } html[data-zbai-mobile="1"] .LoginModal_LoginModal__O59AS .login-sign-box, html[data-zbai-mobile="1"] .LoginModal_LoginModal__O59AS .content-area, html[data-zbai-mobile="1"] .LoginModal_LoginModal__O59AS .animate-box, html[data-zbai-mobile="1"] .LoginModal_LoginModal__O59AS #first-page { width: 100% !important; min-width: 0 !important; } html[data-zbai-mobile="1"] #zbai-mobile-bottom-sheet { position: fixed !important; inset: 0 !important; z-index: 10020 !important; display: flex !important; align-items: flex-end !important; justify-content: center !important; background: rgba(12, 14, 20, 0.42) !important; } html[data-zbai-mobile="1"] #zbai-mobile-bottom-sheet[hidden] { display: none !important; } html[data-zbai-mobile="1"] .zbai-mobile-sheet-panel { width: 100vw !important; max-height: min(72dvh, 560px) !important; overflow-y: auto !important; padding: 12px 14px calc(18px + env(safe-area-inset-bottom, 0px)) !important; border-radius: 18px 18px 0 0 !important; background: var(--Background-Static-Dialog, #fff) !important; color: var(--TextIcon-2-Normal, #2e3241) !important; box-shadow: 0 -14px 38px rgba(20, 24, 38, 0.18) !important; } html[data-zbai-mobile="1"] .zbai-mobile-sheet-title { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; min-height: 40px !important; font-size: 16px !important; font-weight: 700 !important; } html[data-zbai-mobile="1"] .zbai-mobile-sheet-close { width: 36px !important; height: 36px !important; border-radius: 18px !important; background: rgba(166, 172, 225, 0.18) !important; color: inherit !important; } html[data-zbai-mobile="1"] .zbai-mobile-sheet-list { display: grid !important; gap: 8px !important; margin-top: 8px !important; } html[data-zbai-mobile="1"] .zbai-mobile-sheet-option { width: 100% !important; min-height: 48px !important; padding: 10px 12px !important; text-align: left !important; border-radius: 12px !important; background: rgba(166, 172, 225, 0.12) !important; color: inherit !important; } html[data-zbai-mobile="1"] .zbai-mobile-sheet-option strong, html[data-zbai-mobile="1"] .zbai-mobile-sheet-option small { display: block !important; } html[data-zbai-mobile="1"] .zbai-mobile-sheet-option small { margin-top: 2px !important; opacity: 0.68 !important; } html[data-zbai-mobile="1"] .zbai-mobile-back-button { position: fixed !important; left: 10px !important; top: calc(9px + env(safe-area-inset-top, 0px)) !important; z-index: 10040 !important; width: 34px !important; height: 34px !important; border-radius: 17px !important; border: 1px solid rgba(10, 10, 11, 0.08) !important; background: rgba(255, 255, 255, 0.88) !important; color: #222637 !important; box-shadow: 0 4px 16px rgba(20, 24, 38, 0.12) !important; backdrop-filter: blur(10px) !important; -webkit-backdrop-filter: blur(10px) !important; font: 28px/30px -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important; text-align: center !important; padding: 0 0 3px !important; } } `; const target = document.head || document.documentElement; target.appendChild(style); } function enableMobileFlag() { document.documentElement.dataset.zbaiMobile = isMobile() ? '1' : '0'; } function getPageType() { if (document.querySelector(selectors.root)) return 'editor'; if (document.querySelector('main.index-main, #index-main-content--right')) return 'home'; return location.pathname.startsWith('/create/') || /\/create\//.test(location.pathname) ? 'editor' : 'home'; } function updatePageType() { document.documentElement.dataset.zbaiPage = getPageType(); } function getText(node) { return (node && node.textContent ? node.textContent : '').replace(/\s+/g, ' ').trim(); } function getFirst(selector, root = document) { return root.querySelector(selector); } function findClickableAncestor(node) { let current = node; while (current && current !== document.body) { if (current.matches && current.matches('button, [role="button"], a, .ChooseModelWithDetails_selectItem__7NA37, .ChooseModelWithDetails_selectBox__HoIuc')) { return current; } current = current.parentElement; } return node instanceof HTMLElement ? node : null; } function clickOriginal(node) { if (!node) return; const target = findClickableAncestor(node); if (!target) return; if (typeof PointerEvent === 'function') { target.dispatchEvent(new PointerEvent('pointerdown', { bubbles: true, cancelable: true, pointerType: 'touch' })); } target.dispatchEvent(new MouseEvent('mousedown', { bubbles: true, cancelable: true, view: window })); target.click(); } function ensureSheet() { let sheet = document.getElementById(SHEET_ID); if (sheet) return sheet; sheet = document.createElement('div'); sheet.id = SHEET_ID; sheet.hidden = true; sheet.innerHTML = ` `; sheet.addEventListener('click', (event) => { if (event.target === sheet || event.target.closest('.zbai-mobile-sheet-close')) { closeSheet(); } }); document.documentElement.appendChild(sheet); return sheet; } function closeSheet() { const sheet = document.getElementById(SHEET_ID); if (sheet) sheet.hidden = true; } function openSheet(title, options) { const sheet = ensureSheet(); const titleNode = sheet.querySelector('.zbai-mobile-sheet-title span'); const list = sheet.querySelector('.zbai-mobile-sheet-list'); titleNode.textContent = title; list.innerHTML = ''; options.forEach((option) => { const button = document.createElement('button'); button.type = 'button'; button.className = 'zbai-mobile-sheet-option'; button.innerHTML = `${escapeHtml(option.title)}${option.desc ? `${escapeHtml(option.desc)}` : ''}`; button.addEventListener('click', () => { option.onSelect(); closeSheet(); }); list.appendChild(button); }); sheet.hidden = false; } function escapeHtml(value) { return String(value).replace(/[&<>"']/g, (char) => ({ '&': '&', '<': '<', '>': '>', '"': '"', "'": ''', }[char])); } function markReady() { const root = getFirst(selectors.root); if (root) root.classList.add(CLASS_READY); } function shouldShowBackButton() { const path = location.pathname; return isMobile() && path !== '/' && path !== '/zh' && path !== '/tw'; } function ensureBackButton() { const existing = document.querySelector('.zbai-mobile-back-button'); if (!shouldShowBackButton()) { if (existing) existing.remove(); return; } if (existing) return; const button = document.createElement('button'); button.type = 'button'; button.className = 'zbai-mobile-back-button'; button.setAttribute('aria-label', '返回上一级'); button.textContent = '‹'; button.addEventListener('click', () => { if (window.history.length > 1) { window.history.back(); } else { window.location.href = '/'; } }); document.documentElement.appendChild(button); } function ensureRunBadge() { if (!isMobile() || document.getElementById(BADGE_ID)) return; const badge = document.createElement('div'); badge.id = BADGE_ID; badge.textContent = '移动适配已启用'; badge.style.cssText = [ 'position:fixed', 'left:50%', 'top:calc(8px + env(safe-area-inset-top,0px))', 'transform:translateX(-50%)', 'z-index:10050', 'padding:4px 9px', 'border-radius:999px', 'background:rgba(20,24,38,.74)', 'color:#fff', 'font:12px/18px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif', 'pointer-events:none', 'opacity:0', 'transition:opacity .2s ease', ].join(';'); document.documentElement.appendChild(badge); requestAnimationFrame(() => { badge.style.opacity = '1'; window.setTimeout(() => { badge.style.opacity = '0'; window.setTimeout(() => badge.remove(), 260); }, 1400); }); } function collectModelOptions() { const modelRoot = getFirst(selectors.modelWrap); if (!modelRoot) return []; const items = [...modelRoot.querySelectorAll('.ChooseModelWithDetails_selectItem__7NA37')]; const sourceItems = items.length ? items : [modelRoot]; return sourceItems.map((item) => { const title = getText(item.querySelector('.ChooseModelWithDetails_itemText__DoGeU')) || getText(item).split(' ')[0] || '当前模型'; const desc = getText(item.querySelector('.ChooseModelWithDetails_itemDesc__dEYMm')); return { title, desc, onSelect: () => clickOriginal(item), }; }); } function handleModelTap(event) { if (!isMobile()) return; const model = event.target.closest(selectors.modelWrap); if (!model || event.target.closest(`#${SHEET_ID}`)) return; const options = collectModelOptions(); if (options.length <= 1) { return; } event.preventDefault(); event.stopPropagation(); openSheet('选择模型', options); } function installEventBridge() { if (document.documentElement.dataset.zbaiMobileBridge === '1') return; document.documentElement.dataset.zbaiMobileBridge = '1'; document.addEventListener('click', handleModelTap, true); document.addEventListener('touchend', handleModelTap, true); document.addEventListener('keydown', (event) => { if (event.key === 'Escape') closeSheet(); }); } function adapt() { injectStyles(); enableMobileFlag(); updatePageType(); markReady(); ensureRunBadge(); ensureBackButton(); installEventBridge(); } function startObserver() { let scheduled = false; const observer = new MutationObserver(() => { if (scheduled) return; scheduled = true; requestAnimationFrame(() => { scheduled = false; adapt(); }); }); observer.observe(document.documentElement, { childList: true, subtree: true, }); } function boot() { adapt(); startObserver(); media.addEventListener ? media.addEventListener('change', enableMobileFlag) : media.addListener(enableMobileFlag); window.addEventListener('resize', enableMobileFlag, { passive: true }); } if (document.readyState === 'loading') { document.addEventListener('DOMContentLoaded', boot, { once: true }); injectStyles(); enableMobileFlag(); } else { boot(); } })();