Spaces:
Paused
Paused
| """ | |
| Native Gradio UI layout. | |
| Sequential media phases: Demo Video -> Action+Point -> Execute Video. | |
| Two-column layout: Point Selection | Right Panel. | |
| """ | |
| import ast | |
| import json | |
| import gradio as gr | |
| from config import ( | |
| CONTROL_PANEL_SCALE, | |
| LIVE_OBS_BASE_CLASS, | |
| LIVE_OBS_POINT_WAIT_CLASS, | |
| SESSION_CONCURRENCY_ID, | |
| SESSION_CONCURRENCY_LIMIT, | |
| SESSION_TIMEOUT, | |
| POINT_SELECTION_SCALE, | |
| RIGHT_TOP_ACTION_SCALE, | |
| RIGHT_TOP_LOG_SCALE, | |
| UI_TEXT, | |
| UI_GLOBAL_FONT_SIZE, | |
| get_live_obs_elem_classes, | |
| ) | |
| from gradio_callbacks import ( | |
| cleanup_current_request_session, | |
| cleanup_user_session, | |
| execute_step, | |
| init_app, | |
| load_next_task_wrapper, | |
| on_map_click, | |
| on_demo_video_play, | |
| on_demo_video_end_transition, | |
| on_execute_video_end_transition, | |
| on_option_select, | |
| on_reference_action, | |
| precheck_execute_inputs, | |
| restart_episode_wrapper, | |
| switch_env_wrapper, | |
| switch_to_execute_phase, | |
| touch_session, | |
| ) | |
| from user_manager import user_manager | |
| PHASE_INIT = "init" | |
| PHASE_DEMO_VIDEO = "demo_video" | |
| PHASE_ACTION_POINT = "action_point" | |
| PHASE_EXECUTION_VIDEO = "execution_video" | |
| LOAD_STATUS_MODE_IDLE = "idle" | |
| LOAD_STATUS_MODE_EPISODE_LOAD = "episode_load" | |
| APP_THEME = gr.themes.Default() | |
| # Deprecated: no legacy runtime JS logic in native Gradio mode. | |
| SYNC_JS = "" | |
| DEMO_VIDEO_PLAY_BINDING_JS = r""" | |
| () => { | |
| const bindPlayButton = () => { | |
| const button = | |
| document.querySelector("#watch_demo_video_btn button") || | |
| document.querySelector("button#watch_demo_video_btn"); | |
| if (!button || button.dataset.robommeDemoPlayBound === "1") { | |
| return; | |
| } | |
| button.dataset.robommeDemoPlayBound = "1"; | |
| button.addEventListener("click", () => { | |
| const videoEl = document.querySelector("#demo_video video"); | |
| if (!videoEl) { | |
| return; | |
| } | |
| const playPromise = videoEl.play(); | |
| if (playPromise && typeof playPromise.catch === "function") { | |
| playPromise.catch(() => {}); | |
| } | |
| }); | |
| }; | |
| if (!window.__robommeDemoPlayBindingInstalled) { | |
| const observer = new MutationObserver(() => bindPlayButton()); | |
| observer.observe(document.body, { | |
| childList: true, | |
| subtree: true, | |
| }); | |
| window.__robommeDemoPlayBindingInstalled = true; | |
| } | |
| bindPlayButton(); | |
| } | |
| """ | |
| LIVE_OBS_CLIENT_RESIZE_JS = r""" | |
| () => { | |
| if (window.__robommeLiveObsResizerInstalled) { | |
| if (typeof window.__robommeLiveObsSchedule === "function") { | |
| window.__robommeLiveObsSchedule(); | |
| } | |
| return; | |
| } | |
| const state = { | |
| rafId: null, | |
| intervalId: null, | |
| lastAppliedWidth: null, | |
| lastWrapperNode: null, | |
| lastFrameNode: null, | |
| lastImageNode: null, | |
| rootObserver: null, | |
| layoutObserver: null, | |
| phaseObserver: null, | |
| bodyObserver: null, | |
| }; | |
| const getTargets = () => { | |
| const root = document.getElementById("live_obs"); | |
| if (!root) { | |
| return null; | |
| } | |
| return { | |
| root, | |
| container: root.querySelector(".image-container"), | |
| frame: root.querySelector(".image-frame"), | |
| image: root.querySelector("img"), | |
| mediaCard: document.getElementById("media_card"), | |
| actionPhaseGroup: document.getElementById("action_phase_group"), | |
| }; | |
| }; | |
| const applyResize = () => { | |
| state.rafId = null; | |
| const targets = getTargets(); | |
| const wrapper = targets?.root?.querySelector(".upload-container") || targets?.frame?.parentElement; | |
| if (!targets || !targets.container || !wrapper || !targets.frame || !targets.image) { | |
| return; | |
| } | |
| const containerWidth = Math.floor(targets.container.getBoundingClientRect().width); | |
| if (!Number.isFinite(containerWidth) || containerWidth < 2) { | |
| return; | |
| } | |
| if ( | |
| state.lastAppliedWidth === containerWidth && | |
| state.lastWrapperNode === wrapper && | |
| state.lastFrameNode === targets.frame && | |
| state.lastImageNode === targets.image | |
| ) { | |
| return; | |
| } | |
| wrapper.style.width = `${containerWidth}px`; | |
| wrapper.style.maxWidth = "none"; | |
| wrapper.style.display = "block"; | |
| targets.frame.style.width = `${containerWidth}px`; | |
| targets.frame.style.maxWidth = "none"; | |
| targets.frame.style.display = "block"; | |
| targets.image.style.width = `${containerWidth}px`; | |
| targets.image.style.maxWidth = "none"; | |
| targets.image.style.height = "auto"; | |
| targets.image.style.display = "block"; | |
| targets.image.style.objectFit = "contain"; | |
| targets.image.style.objectPosition = "center center"; | |
| state.lastAppliedWidth = containerWidth; | |
| state.lastWrapperNode = wrapper; | |
| state.lastFrameNode = targets.frame; | |
| state.lastImageNode = targets.image; | |
| }; | |
| const scheduleResize = () => { | |
| if (state.rafId !== null) { | |
| return; | |
| } | |
| state.rafId = window.requestAnimationFrame(applyResize); | |
| }; | |
| const observeLiveObs = () => { | |
| const targets = getTargets(); | |
| if (!targets) { | |
| return false; | |
| } | |
| state.rootObserver?.disconnect(); | |
| state.rootObserver = new MutationObserver(scheduleResize); | |
| state.rootObserver.observe(targets.root, { | |
| childList: true, | |
| subtree: true, | |
| attributes: true, | |
| }); | |
| state.layoutObserver?.disconnect(); | |
| if (window.ResizeObserver) { | |
| state.layoutObserver = new ResizeObserver(scheduleResize); | |
| [targets.root, targets.container, targets.mediaCard, targets.actionPhaseGroup] | |
| .filter(Boolean) | |
| .forEach((node) => state.layoutObserver.observe(node)); | |
| } | |
| state.phaseObserver?.disconnect(); | |
| state.phaseObserver = new MutationObserver(scheduleResize); | |
| [targets.root, targets.actionPhaseGroup, targets.root.parentElement, targets.root.parentElement?.parentElement] | |
| .filter(Boolean) | |
| .forEach((node) => | |
| state.phaseObserver.observe(node, { | |
| attributes: true, | |
| attributeFilter: ["class", "style", "hidden"], | |
| }) | |
| ); | |
| scheduleResize(); | |
| return true; | |
| }; | |
| window.__robommeLiveObsSchedule = scheduleResize; | |
| window.addEventListener("resize", scheduleResize, { passive: true }); | |
| document.addEventListener("visibilitychange", scheduleResize); | |
| if (!observeLiveObs()) { | |
| state.bodyObserver = new MutationObserver(() => { | |
| if (observeLiveObs()) { | |
| state.bodyObserver?.disconnect(); | |
| state.bodyObserver = null; | |
| } | |
| scheduleResize(); | |
| }); | |
| state.bodyObserver.observe(document.body, { | |
| childList: true, | |
| subtree: true, | |
| }); | |
| } | |
| state.intervalId = window.setInterval(scheduleResize, 250); | |
| window.__robommeLiveObsResizerInstalled = true; | |
| } | |
| """ | |
| THEME_LOCK_HEAD = r""" | |
| <script> | |
| (() => { | |
| const applyLightTheme = () => { | |
| const normalizeThemeState = (store) => { | |
| try { | |
| store.setItem("theme", "light"); | |
| store.setItem("color-scheme", "light"); | |
| store.setItem("gradio-theme", "light"); | |
| for (const key of Object.keys(store)) { | |
| if (!/theme|color-scheme/i.test(key)) { | |
| continue; | |
| } | |
| const value = store.getItem(key); | |
| if (typeof value === "string" && /dark/i.test(value)) { | |
| store.setItem(key, value.replace(/dark/gi, "light")); | |
| } | |
| } | |
| } catch (error) { | |
| console.debug("Failed to normalize theme state", error); | |
| } | |
| }; | |
| const normalizeNode = (node) => { | |
| if (!node) { | |
| return; | |
| } | |
| if (node.classList.contains("dark")) { | |
| node.classList.remove("dark"); | |
| } | |
| if (node.dataset.theme !== "light") { | |
| node.dataset.theme = "light"; | |
| } | |
| if (node.getAttribute("data-color-scheme") !== "light") { | |
| node.setAttribute("data-color-scheme", "light"); | |
| } | |
| if (node.style.colorScheme !== "light") { | |
| node.style.colorScheme = "light"; | |
| } | |
| }; | |
| normalizeThemeState(window.localStorage); | |
| normalizeThemeState(window.sessionStorage); | |
| normalizeNode(document.documentElement); | |
| normalizeNode(document.body); | |
| }; | |
| applyLightTheme(); | |
| window.__robommeForceLightTheme = applyLightTheme; | |
| if (window.__robommeThemeLockInstalled) { | |
| return; | |
| } | |
| const observer = new MutationObserver(() => applyLightTheme()); | |
| observer.observe(document.documentElement, { | |
| attributes: true, | |
| attributeFilter: ["class", "data-theme", "style"], | |
| }); | |
| const attachBodyObserver = () => { | |
| if (!document.body || document.body.dataset.robommeThemeObserved === "1") { | |
| return; | |
| } | |
| document.body.dataset.robommeThemeObserved = "1"; | |
| observer.observe(document.body, { | |
| attributes: true, | |
| attributeFilter: ["class", "data-theme", "style"], | |
| }); | |
| }; | |
| attachBodyObserver(); | |
| document.addEventListener("DOMContentLoaded", attachBodyObserver, { once: true }); | |
| window.addEventListener("load", applyLightTheme, { once: true }); | |
| window.setTimeout(applyLightTheme, 0); | |
| window.setTimeout(applyLightTheme, 100); | |
| window.__robommeThemeLockInstalled = true; | |
| })(); | |
| </script> | |
| """ | |
| THEME_LOCK_JS = r""" | |
| () => { | |
| if (typeof window.__robommeForceLightTheme === "function") { | |
| window.__robommeForceLightTheme(); | |
| window.setTimeout(window.__robommeForceLightTheme, 0); | |
| } | |
| } | |
| """ | |
| SET_EPISODE_LOAD_MODE_JS = f""" | |
| () => {{ | |
| window.__robommeLoadStatusMode = {json.dumps(LOAD_STATUS_MODE_EPISODE_LOAD)}; | |
| }} | |
| """ | |
| # Gradio js preprocessors with inputs must return the original args, or Python receives None. | |
| SET_EPISODE_LOAD_MODE_IF_SWITCH_JS = f""" | |
| (uid, selectedEnv, currentTaskEnv) => {{ | |
| const normalize = (value) => (value == null ? "" : String(value).trim().toLowerCase()); | |
| const nextEnv = normalize(selectedEnv); | |
| const currentEnv = normalize(currentTaskEnv); | |
| window.__robommeLoadStatusMode = | |
| nextEnv && nextEnv !== currentEnv | |
| ? {json.dumps(LOAD_STATUS_MODE_EPISODE_LOAD)} | |
| : {json.dumps(LOAD_STATUS_MODE_IDLE)}; | |
| return [uid, selectedEnv, currentTaskEnv]; | |
| }} | |
| """ | |
| RESET_EPISODE_LOAD_MODE_JS = f""" | |
| () => {{ | |
| window.__robommeLoadStatusMode = {json.dumps(LOAD_STATUS_MODE_IDLE)}; | |
| }} | |
| """ | |
| PROGRESS_TEXT_REWRITE_JS = f""" | |
| () => {{ | |
| const modeEpisodeLoad = {json.dumps(LOAD_STATUS_MODE_EPISODE_LOAD)}; | |
| const modeIdle = {json.dumps(LOAD_STATUS_MODE_IDLE)}; | |
| const overlayStateIdle = "idle"; | |
| const overlayStateEpisodeLoad = "episode-load"; | |
| const overlayStateQueue = "queue"; | |
| const episodeLoadingText = {json.dumps(UI_TEXT["progress"]["episode_loading"])}; | |
| const queueWaitText = {json.dumps(UI_TEXT["progress"]["queue_wait"])}; | |
| const elapsedOnlyPattern = /^\\d+(?:\\.\\d+)?s$/i; | |
| const progressStyleKeys = [ | |
| "position", | |
| "top", | |
| "right", | |
| "bottom", | |
| "left", | |
| "transform", | |
| "width", | |
| "max-width", | |
| "display", | |
| "margin", | |
| "text-align", | |
| "color", | |
| "font-size", | |
| "font-weight", | |
| "line-height", | |
| "white-space", | |
| "z-index", | |
| "order", | |
| ]; | |
| const wrapStyleKeys = ["flex-direction", "gap"]; | |
| const spinnerStyleKeys = ["order"]; | |
| window.__robommeLoadStatusMode = window.__robommeLoadStatusMode || modeIdle; | |
| const getMode = () => window.__robommeLoadStatusMode || modeIdle; | |
| const isEpisodeLoadRaw = (raw) => | |
| elapsedOnlyPattern.test(raw) || /^processing/i.test(raw); | |
| const isQueueRaw = (raw) => /^queue:/i.test(raw); | |
| const clearInlineStyles = (node, keys) => {{ | |
| if (!(node instanceof HTMLElement)) {{ | |
| return; | |
| }} | |
| keys.forEach((key) => node.style.removeProperty(key)); | |
| }}; | |
| const ensureOverlayStyles = () => {{ | |
| const host = document.getElementById("native_progress_host"); | |
| if (!(host instanceof HTMLElement)) {{ | |
| return null; | |
| }} | |
| host.style.setProperty("position", "fixed", "important"); | |
| host.style.setProperty("inset", "0", "important"); | |
| host.style.setProperty("z-index", "9999", "important"); | |
| host.style.setProperty("pointer-events", "none", "important"); | |
| host.style.setProperty("width", "100vw", "important"); | |
| host.style.setProperty("height", "100vh", "important"); | |
| host.style.setProperty("min-height", "100vh", "important"); | |
| host.style.setProperty("overflow", "visible", "important"); | |
| const wrap = host.querySelector(".wrap"); | |
| if (wrap instanceof HTMLElement) {{ | |
| wrap.style.setProperty("position", "fixed", "important"); | |
| wrap.style.setProperty("inset", "0", "important"); | |
| wrap.style.setProperty("width", "100vw", "important"); | |
| wrap.style.setProperty("height", "100vh", "important"); | |
| wrap.style.setProperty("min-height", "100vh", "important"); | |
| wrap.style.setProperty("padding", "0", "important"); | |
| wrap.style.setProperty("display", "flex", "important"); | |
| wrap.style.setProperty("align-items", "center", "important"); | |
| wrap.style.setProperty("justify-content", "center", "important"); | |
| wrap.style.setProperty("background", "rgba(255, 255, 255, 0.92)", "important"); | |
| wrap.style.setProperty("backdrop-filter", "blur(2px)", "important"); | |
| }} | |
| const markdown = host.querySelector('[data-testid="markdown"]'); | |
| const prose = | |
| markdown instanceof HTMLElement | |
| ? markdown.querySelector(".prose, .md") || markdown | |
| : null; | |
| const markdownWrapper = | |
| markdown instanceof HTMLElement && markdown.parentElement instanceof HTMLElement | |
| ? markdown.parentElement | |
| : null; | |
| const spinner = | |
| host.querySelector("svg") instanceof SVGElement | |
| ? host.querySelector("svg").closest("div") | |
| : null; | |
| if (markdown instanceof HTMLElement) {{ | |
| markdown.style.setProperty("position", "fixed", "important"); | |
| markdown.style.setProperty("inset", "0", "important"); | |
| markdown.style.setProperty("display", "flex", "important"); | |
| markdown.style.setProperty("align-items", "center", "important"); | |
| markdown.style.setProperty("justify-content", "center", "important"); | |
| markdown.style.setProperty("padding", "24px", "important"); | |
| }} | |
| if (prose instanceof HTMLElement) {{ | |
| prose.style.setProperty("width", "min(720px, calc(100vw - 48px))", "important"); | |
| prose.style.setProperty("max-width", "calc(100vw - 48px)", "important"); | |
| prose.style.setProperty("margin", "0", "important"); | |
| prose.style.setProperty("padding", "0", "important"); | |
| prose.style.setProperty("text-align", "center", "important"); | |
| prose.style.setProperty("color", "#0f172a", "important"); | |
| prose.style.setProperty("font-size", "var(--text-lg)", "important"); | |
| prose.style.setProperty("font-weight", "600", "important"); | |
| prose.style.setProperty("line-height", "1.5", "important"); | |
| prose.style.setProperty("white-space", "pre-line", "important"); | |
| }} | |
| return {{ | |
| wrap, | |
| markdown, | |
| prose, | |
| markdownWrapper, | |
| spinner, | |
| }}; | |
| }}; | |
| const resolveRawText = (node) => {{ | |
| const displayed = (node.innerText || node.textContent || "").trim(); | |
| return node.dataset.robommeProgressRaw || displayed; | |
| }}; | |
| const setProgressNodeVisible = (node, visible) => {{ | |
| node.style.setProperty("visibility", visible ? "visible" : "hidden", "important"); | |
| node.style.setProperty("opacity", visible ? "1" : "0", "important"); | |
| }}; | |
| const resetProgressNode = (node) => {{ | |
| const raw = node.dataset.robommeProgressRaw || (node.innerText || node.textContent || "").trim(); | |
| if (raw) {{ | |
| node.textContent = raw; | |
| }} | |
| delete node.dataset.robommeProgressCustomized; | |
| delete node.dataset.robommeProgressRaw; | |
| delete node.dataset.robommeProgressCustom; | |
| clearInlineStyles(node, progressStyleKeys); | |
| setProgressNodeVisible(node, true); | |
| }}; | |
| const applyEpisodeLoadLayout = (entry, overlayRefs) => {{ | |
| const node = entry.node; | |
| const {{ | |
| wrap, | |
| spinner, | |
| }} = overlayRefs || {{}}; | |
| if (wrap instanceof HTMLElement) {{ | |
| wrap.style.setProperty("flex-direction", "column", "important"); | |
| wrap.style.setProperty("gap", "24px", "important"); | |
| }} | |
| if (spinner instanceof HTMLElement) {{ | |
| spinner.style.setProperty("order", "1", "important"); | |
| }} | |
| node.dataset.robommeProgressCustomized = "1"; | |
| node.dataset.robommeProgressCustom = episodeLoadingText; | |
| node.textContent = episodeLoadingText; | |
| setProgressNodeVisible(node, true); | |
| node.style.setProperty("position", "static", "important"); | |
| node.style.setProperty("top", "auto", "important"); | |
| node.style.setProperty("right", "auto", "important"); | |
| node.style.setProperty("bottom", "auto", "important"); | |
| node.style.setProperty("left", "auto", "important"); | |
| node.style.setProperty("transform", "none", "important"); | |
| node.style.setProperty("width", "min(720px, calc(100vw - 48px))", "important"); | |
| node.style.setProperty("max-width", "calc(100vw - 48px)", "important"); | |
| node.style.setProperty("display", "block", "important"); | |
| node.style.setProperty("margin", "0", "important"); | |
| node.style.setProperty("text-align", "center", "important"); | |
| node.style.setProperty("color", "#0f172a", "important"); | |
| node.style.setProperty("font-size", "var(--text-lg)", "important"); | |
| node.style.setProperty("font-weight", "600", "important"); | |
| node.style.setProperty("line-height", "1.5", "important"); | |
| node.style.setProperty("white-space", "pre-line", "important"); | |
| node.style.setProperty("z-index", "20", "important"); | |
| node.style.setProperty("order", "2", "important"); | |
| }}; | |
| const rewriteNode = (entry, overlayState) => {{ | |
| const node = entry.node; | |
| if (!(node instanceof HTMLElement)) {{ | |
| return; | |
| }} | |
| const raw = entry.raw; | |
| if (getMode() !== modeEpisodeLoad) {{ | |
| resetProgressNode(node); | |
| if (isEpisodeLoadRaw(raw) || isQueueRaw(raw)) {{ | |
| node.textContent = ""; | |
| }} | |
| return; | |
| }} | |
| node.dataset.robommeProgressRaw = raw; | |
| if (overlayState === overlayStateEpisodeLoad && isEpisodeLoadRaw(raw)) {{ | |
| applyEpisodeLoadLayout(entry, window.__robommeOverlayRefs || null); | |
| return; | |
| }} | |
| if (overlayState === overlayStateQueue && isQueueRaw(raw)) {{ | |
| const custom = `${{queueWaitText}} | ${{raw}}`; | |
| node.dataset.robommeProgressCustomized = "1"; | |
| node.dataset.robommeProgressCustom = custom; | |
| if ((node.innerText || node.textContent || "").trim() !== custom) {{ | |
| node.textContent = custom; | |
| }} | |
| setProgressNodeVisible(node, true); | |
| return; | |
| }} | |
| resetProgressNode(node); | |
| }}; | |
| const syncOverlayContent = (overlayRefs, overlayState) => {{ | |
| if (!overlayRefs) {{ | |
| return; | |
| }} | |
| const {{ | |
| wrap, | |
| markdown, | |
| prose, | |
| markdownWrapper, | |
| spinner, | |
| }} = overlayRefs; | |
| const markdownText = | |
| prose instanceof HTMLElement ? ((prose.innerText || prose.textContent || "").trim()) : ""; | |
| const showMarkdown = overlayState === overlayStateIdle && markdownText.length > 0; | |
| if (wrap instanceof HTMLElement && overlayState !== overlayStateEpisodeLoad) {{ | |
| clearInlineStyles(wrap, wrapStyleKeys); | |
| }} | |
| if (spinner instanceof HTMLElement && overlayState !== overlayStateEpisodeLoad) {{ | |
| clearInlineStyles(spinner, spinnerStyleKeys); | |
| }} | |
| if (markdownWrapper instanceof HTMLElement) {{ | |
| markdownWrapper.style.setProperty("display", showMarkdown ? "block" : "none", "important"); | |
| markdownWrapper.style.setProperty("visibility", showMarkdown ? "visible" : "hidden", "important"); | |
| }} | |
| if (markdown instanceof HTMLElement) {{ | |
| markdown.style.setProperty("display", showMarkdown ? "flex" : "none", "important"); | |
| markdown.style.setProperty("visibility", showMarkdown ? "visible" : "hidden", "important"); | |
| }} | |
| }}; | |
| const rewriteAll = () => {{ | |
| const overlayRefs = ensureOverlayStyles(); | |
| window.__robommeOverlayRefs = overlayRefs; | |
| const progressEntries = Array.from(document.querySelectorAll(".progress-text")) | |
| .filter((node) => node instanceof HTMLElement) | |
| .map((node) => {{ | |
| const raw = resolveRawText(node); | |
| return {{ | |
| node, | |
| raw, | |
| }}; | |
| }}); | |
| let overlayState = overlayStateIdle; | |
| if (getMode() === modeEpisodeLoad) {{ | |
| const hasEpisodeLoad = progressEntries.some((entry) => isEpisodeLoadRaw(entry.raw)); | |
| const hasQueue = progressEntries.some((entry) => isQueueRaw(entry.raw)); | |
| if (hasEpisodeLoad) {{ | |
| overlayState = overlayStateEpisodeLoad; | |
| }} else if (hasQueue) {{ | |
| overlayState = overlayStateQueue; | |
| }} | |
| }} | |
| progressEntries.forEach((entry) => rewriteNode(entry, overlayState)); | |
| syncOverlayContent(overlayRefs, overlayState); | |
| }}; | |
| const scheduleRewrite = () => {{ | |
| if (window.__robommeProgressRewriteRaf) {{ | |
| return; | |
| }} | |
| window.__robommeProgressRewriteRaf = window.requestAnimationFrame(() => {{ | |
| window.__robommeProgressRewriteRaf = null; | |
| rewriteAll(); | |
| }}); | |
| }}; | |
| if (!window.__robommeProgressRewriteInstalled) {{ | |
| const observer = new MutationObserver(scheduleRewrite); | |
| observer.observe(document.body, {{ | |
| childList: true, | |
| subtree: true, | |
| characterData: true, | |
| }}); | |
| window.setInterval(scheduleRewrite, 200); | |
| window.__robommeProgressRewriteInstalled = true; | |
| }} | |
| scheduleRewrite(); | |
| }} | |
| """ | |
| CSS = f""" | |
| :root {{ | |
| --body-text-size: {UI_GLOBAL_FONT_SIZE} !important; | |
| --prose-text-size: {UI_GLOBAL_FONT_SIZE} !important; | |
| --input-text-size: {UI_GLOBAL_FONT_SIZE} !important; | |
| --block-label-text-size: {UI_GLOBAL_FONT_SIZE} !important; | |
| --block-title-text-size: {UI_GLOBAL_FONT_SIZE} !important; | |
| --block-info-text-size: {UI_GLOBAL_FONT_SIZE} !important; | |
| --checkbox-label-text-size: {UI_GLOBAL_FONT_SIZE} !important; | |
| --button-large-text-size: {UI_GLOBAL_FONT_SIZE} !important; | |
| --button-medium-text-size: {UI_GLOBAL_FONT_SIZE} !important; | |
| --button-small-text-size: {UI_GLOBAL_FONT_SIZE} !important; | |
| --section-header-text-size: {UI_GLOBAL_FONT_SIZE} !important; | |
| --text-md: {UI_GLOBAL_FONT_SIZE} !important; | |
| color-scheme: light !important; | |
| }} | |
| .native-card {{ | |
| }} | |
| #header_title h2 {{ | |
| font-size: var(--text-xxl) !important; | |
| }} | |
| #native_progress_host {{ | |
| position: fixed !important; | |
| inset: 0 !important; | |
| z-index: 9999 !important; | |
| pointer-events: none !important; | |
| }} | |
| #native_progress_host .wrap {{ | |
| width: 100vw !important; | |
| min-height: 100vh !important; | |
| }} | |
| #native_progress_host .wrap.translucent {{ | |
| background: rgba(255, 255, 255, 0.92) !important; | |
| backdrop-filter: blur(2px); | |
| }} | |
| #native_progress_host .pending {{ | |
| min-height: 100vh !important; | |
| }} | |
| #reference_action_btn button:not(:disabled), | |
| button#reference_action_btn:not(:disabled) {{ | |
| background: #1f8b4c !important; | |
| border-color: #1f8b4c !important; | |
| color: #ffffff !important; | |
| }} | |
| #reference_action_btn button:not(:disabled):hover, | |
| button#reference_action_btn:not(:disabled):hover {{ | |
| background: #19713d !important; | |
| border-color: #19713d !important; | |
| }} | |
| #live_obs.live-obs-resizable .image-container {{ | |
| width: 100%; | |
| }} | |
| #live_obs.live-obs-resizable .upload-container {{ | |
| width: 100%; | |
| }} | |
| #watch_demo_video_btn, | |
| #watch_demo_video_btn button, | |
| button#watch_demo_video_btn {{ | |
| width: 100%; | |
| }} | |
| #media_card {{ | |
| --media-card-radius: 8px; | |
| position: relative; | |
| border-radius: var(--media-card-radius); | |
| overflow: visible; | |
| }} | |
| #media_card > div, | |
| #media_card #action_phase_group, | |
| #media_card #video_phase_group, | |
| #media_card #execution_video_group, | |
| #media_card #live_obs, | |
| #media_card #live_obs button, | |
| #media_card #live_obs .image-frame, | |
| #media_card #live_obs img, | |
| #media_card #demo_video, | |
| #media_card #demo_video video, | |
| #media_card #execute_video, | |
| #media_card #execute_video video {{ | |
| border-radius: var(--media-card-radius); | |
| }} | |
| #media_card::after {{ | |
| content: ""; | |
| position: absolute; | |
| inset: 0; | |
| border-radius: inherit; | |
| border: 3px solid rgba(225, 29, 72, 0.00); | |
| box-sizing: border-box; | |
| box-shadow: 0 0 0 0 rgba(225, 29, 72, 0.00); | |
| opacity: 0; | |
| pointer-events: none; | |
| transition: opacity 180ms ease, border-color 180ms ease, box-shadow 180ms ease; | |
| z-index: 0; | |
| }} | |
| @keyframes media-card-point-ring {{ | |
| 0% {{ | |
| box-shadow: 0 0 0 0 rgba(225, 29, 72, 0.00); | |
| border-color: rgba(225, 29, 72, 0.72); | |
| opacity: 0.72; | |
| }} | |
| 18% {{ | |
| box-shadow: 0 0 0 4px rgba(225, 29, 72, 0.28); | |
| border-color: rgba(225, 29, 72, 0.94); | |
| opacity: 1; | |
| }} | |
| 36% {{ | |
| box-shadow: 0 0 0 10px rgba(225, 29, 72, 0.12); | |
| border-color: rgba(225, 29, 72, 0.88); | |
| opacity: 0.94; | |
| }} | |
| 62% {{ | |
| box-shadow: 0 0 0 2px rgba(225, 29, 72, 0.18); | |
| border-color: rgba(225, 29, 72, 0.96); | |
| opacity: 1; | |
| }} | |
| 100% {{ | |
| box-shadow: 0 0 0 0 rgba(225, 29, 72, 0.00); | |
| border-color: rgba(225, 29, 72, 0.72); | |
| opacity: 0.72; | |
| }} | |
| }} | |
| #media_card:has(#live_obs.{LIVE_OBS_POINT_WAIT_CLASS})::after {{ | |
| border-color: rgba(225, 29, 72, 0.94); | |
| box-shadow: 0 0 0 0 rgba(225, 29, 72, 0.00); | |
| opacity: 1; | |
| animation: media-card-point-ring 1.2s ease-in-out infinite; | |
| }} | |
| """ | |
| def extract_last_goal(goal_text): | |
| """Extract last goal from goal text that may be a list representation.""" | |
| if not goal_text: | |
| return "" | |
| text = goal_text.strip() | |
| if text.startswith("[") and text.endswith("]"): | |
| try: | |
| goals = ast.literal_eval(text) | |
| if isinstance(goals, list) and goals: | |
| for goal in reversed(goals): | |
| goal_text = str(goal).strip() | |
| if goal_text: | |
| return goal_text | |
| except Exception: | |
| pass | |
| return text.split("\n")[0].strip() | |
| def capitalize_first_letter(text): | |
| """Uppercase only the first character for display.""" | |
| if not text: | |
| return text | |
| if len(text) == 1: | |
| return text.upper() | |
| return text[0].upper() + text[1:] | |
| def render_header_goal(goal_text): | |
| """Render header goal from raw goal text using display-only normalization.""" | |
| last_goal = extract_last_goal(goal_text or "") | |
| if not last_goal: | |
| return "—" | |
| return capitalize_first_letter(last_goal) | |
| def _phase_from_updates(main_interface_update, demo_video_phase_update): | |
| if isinstance(main_interface_update, dict) and main_interface_update.get("visible") is False: | |
| return PHASE_INIT | |
| if isinstance(demo_video_phase_update, dict) and demo_video_phase_update.get("visible") is True: | |
| return PHASE_DEMO_VIDEO | |
| return PHASE_ACTION_POINT | |
| def _with_phase_from_load(load_result): | |
| load_result = _normalize_load_result(load_result) | |
| phase = _phase_from_updates(load_result[1], load_result[15]) | |
| return ( | |
| *load_result, | |
| phase, | |
| gr.update(value=""), | |
| ) | |
| def _with_rejected_init(load_result, message): | |
| load_result = _normalize_load_result(load_result) | |
| return ( | |
| *load_result, | |
| PHASE_INIT, | |
| gr.update(value=message), | |
| ) | |
| def _normalize_load_result(load_result): | |
| if not isinstance(load_result, (tuple, list)): | |
| return load_result | |
| normalized = list(load_result) | |
| if len(normalized) in {19, 20}: | |
| normalized.insert(8, gr.update(value=None, visible=False, playback_position=0)) | |
| normalized.insert(16, gr.update(visible=False)) | |
| if len(normalized) == 21: | |
| normalized.append( | |
| { | |
| "preserve_terminal_log": False, | |
| "terminal_log_value": None, | |
| } | |
| ) | |
| return tuple(normalized) | |
| def _phase_visibility_updates(phase): | |
| if phase == PHASE_DEMO_VIDEO: | |
| return ( | |
| gr.update(visible=True), | |
| gr.update(visible=False), | |
| gr.update(visible=False), | |
| gr.update(visible=False), | |
| ) | |
| if phase == PHASE_EXECUTION_VIDEO: | |
| return ( | |
| gr.update(visible=False), | |
| gr.update(visible=True), | |
| gr.update(visible=False), | |
| gr.update(visible=True), | |
| ) | |
| if phase == PHASE_ACTION_POINT: | |
| return ( | |
| gr.update(visible=False), | |
| gr.update(visible=False), | |
| gr.update(visible=True), | |
| gr.update(visible=True), | |
| ) | |
| return ( | |
| gr.update(visible=False), | |
| gr.update(visible=False), | |
| gr.update(visible=False), | |
| gr.update(visible=False), | |
| ) | |
| def create_ui_blocks(): | |
| """构建 Gradio Blocks，并完成页面阶段状态（phase）的联动绑定。""" | |
| def render_header_task(task_text): | |
| clean_task = str(task_text or "").strip() | |
| if not clean_task: | |
| return None | |
| if clean_task.lower().startswith("current task:"): | |
| clean_task = clean_task.split(":", 1)[1].strip() | |
| marker = " (Episode " | |
| if marker in clean_task: | |
| clean_task = clean_task.split(marker, 1)[0].strip() | |
| return " ".join(clean_task.splitlines()).strip() or None | |
| with gr.Blocks(title="Oracle Planner Interface") as demo: | |
| demo.css = CSS | |
| demo.theme = APP_THEME | |
| demo.head = THEME_LOCK_HEAD | |
| gr.Markdown("## 🔥 RoboMME Interactive Demo 🚀🚀🚀", elem_id="header_title") | |
| gr.Markdown("### Curious about memory-based robotic tasks? 🤖 Try it yourself 👇") | |
| with gr.Row(): | |
| with gr.Column(scale=1): | |
| header_task_box = gr.Dropdown( | |
| choices=list(user_manager.env_choices), | |
| value=render_header_task(""), | |
| label="Current Task 📚", | |
| show_label=True, | |
| interactive=True, | |
| elem_id="header_task", | |
| ) | |
| with gr.Column(scale=2): | |
| header_goal_box = gr.Textbox( | |
| value=render_header_goal(""), | |
| label="Task Goal 🏆", | |
| show_label=True, | |
| interactive=False, | |
| lines=1, | |
| elem_id="header_goal", | |
| ) | |
| uid_state = gr.State( | |
| value=None, | |
| time_to_live=SESSION_TIMEOUT, | |
| delete_callback=cleanup_user_session, | |
| ) | |
| ui_phase_state = gr.State(value=PHASE_INIT) | |
| post_execute_controls_state = gr.State( | |
| value={ | |
| "exec_btn_interactive": True, | |
| "reference_action_interactive": True, | |
| } | |
| ) | |
| post_execute_log_state = gr.State( | |
| value={ | |
| "preserve_terminal_log": False, | |
| "terminal_log_value": None, | |
| "preserve_execute_video_log": False, | |
| "execute_video_log_value": None, | |
| } | |
| ) | |
| current_task_env_state = gr.State(value=None) | |
| suppress_next_option_change_state = gr.State(value=False) | |
| task_info_box = gr.Textbox(visible=False, elem_id="task_info_box") | |
| progress_info_box = gr.Textbox(visible=False) | |
| goal_box = gr.Textbox(visible=False) | |
| with gr.Column(visible=True, elem_id="main_interface_root") as main_interface: | |
| native_progress_host = gr.Markdown( | |
| value="", | |
| visible=True, | |
| container=False, | |
| elem_id="native_progress_host", | |
| ) | |
| with gr.Row(elem_id="main_layout_row"): | |
| with gr.Column(scale=POINT_SELECTION_SCALE): | |
| with gr.Column(elem_classes=["native-card"], elem_id="media_card"): | |
| with gr.Column(visible=False, elem_id="video_phase_group") as video_phase_group: | |
| video_display = gr.Video( | |
| label="Video Playback 🎬", | |
| interactive=False, | |
| elem_id="demo_video", | |
| autoplay=False, | |
| show_label=True, | |
| visible=True, | |
| ) | |
| watch_demo_video_btn = gr.Button( | |
| "Watch Video Input 🎬", | |
| variant="primary", | |
| size="lg", | |
| interactive=False, | |
| visible=False, | |
| elem_id="watch_demo_video_btn", | |
| ) | |
| with gr.Column(visible=False, elem_id="execution_video_group") as execution_video_group: | |
| execute_video_display = gr.Video( | |
| label="Execution Playback 🎬", | |
| interactive=False, | |
| elem_id="execute_video", | |
| autoplay=True, | |
| show_label=True, | |
| visible=True, | |
| ) | |
| with gr.Column(visible=False, elem_id="action_phase_group") as action_phase_group: | |
| img_display = gr.Image( | |
| label="Point Selection", | |
| interactive=False, | |
| type="pil", | |
| elem_id="live_obs", | |
| elem_classes=get_live_obs_elem_classes(), | |
| show_label=True, | |
| buttons=[], | |
| sources=[], | |
| ) | |
| with gr.Column(scale=CONTROL_PANEL_SCALE): | |
| with gr.Column(visible=False, elem_id="control_panel_group") as control_panel_group: | |
| with gr.Row(elem_id="right_top_row", equal_height=False): | |
| with gr.Column(scale=RIGHT_TOP_ACTION_SCALE, elem_id="right_action_col"): | |
| with gr.Column(elem_classes=["native-card"], elem_id="action_selection_card"): | |
| options_radio = gr.Radio( | |
| choices=[], | |
| label="Action Selection 🦾", | |
| type="value", | |
| show_label=True, | |
| elem_id="action_radio", | |
| ) | |
| coords_box = gr.Textbox( | |
| label="Coords", | |
| value="", | |
| interactive=False, | |
| show_label=False, | |
| visible=False, | |
| elem_id="coords_box", | |
| ) | |
| with gr.Column(scale=RIGHT_TOP_LOG_SCALE, elem_id="right_log_col"): | |
| with gr.Column(elem_classes=["native-card"], elem_id="log_card"): | |
| log_output = gr.Textbox( | |
| value="", | |
| lines=4, | |
| max_lines=None, | |
| show_label=True, | |
| interactive=False, | |
| elem_id="log_output", | |
| label="System Log 📝", | |
| ) | |
| with gr.Row(elem_id="action_buttons_row"): | |
| with gr.Column(elem_classes=["native-card", "native-button-card"], elem_id="exec_btn_card"): | |
| exec_btn = gr.Button("EXECUTE 🤖", variant="stop", size="lg", elem_id="exec_btn") | |
| with gr.Column( | |
| elem_classes=["native-card", "native-button-card"], | |
| elem_id="reference_btn_card", | |
| ): | |
| reference_action_btn = gr.Button( | |
| "Ground Truth Action 🙋♀️", | |
| variant="secondary", | |
| interactive=False, | |
| elem_id="reference_action_btn", | |
| ) | |
| with gr.Column( | |
| elem_classes=["native-card", "native-button-card"], | |
| elem_id="restart_episode_btn_card", | |
| ): | |
| restart_episode_btn = gr.Button( | |
| "Restart Episode 🔄", | |
| variant="secondary", | |
| interactive=False, | |
| elem_id="restart_episode_btn", | |
| ) | |
| with gr.Column( | |
| elem_classes=["native-card", "native-button-card"], | |
| elem_id="next_task_btn_card", | |
| ): | |
| next_task_btn = gr.Button( | |
| "Change Episode ⏩️", | |
| variant="primary", | |
| interactive=False, | |
| elem_id="next_task_btn", | |
| ) | |
| with gr.Accordion( | |
| "Task Hint💡", | |
| open=False, | |
| visible=True, | |
| elem_classes=["native-card"], | |
| elem_id="task_hint_card", | |
| ): | |
| task_hint_display = gr.Textbox( | |
| value="", | |
| lines=8, | |
| max_lines=16, | |
| show_label=False, | |
| interactive=True, | |
| elem_id="task_hint_display", | |
| ) | |
| load_flow_outputs = [ | |
| uid_state, | |
| main_interface, | |
| img_display, | |
| log_output, | |
| options_radio, | |
| goal_box, | |
| coords_box, | |
| video_display, | |
| execute_video_display, | |
| watch_demo_video_btn, | |
| task_info_box, | |
| progress_info_box, | |
| restart_episode_btn, | |
| next_task_btn, | |
| exec_btn, | |
| video_phase_group, | |
| execution_video_group, | |
| action_phase_group, | |
| control_panel_group, | |
| task_hint_display, | |
| reference_action_btn, | |
| post_execute_log_state, | |
| ui_phase_state, | |
| native_progress_host, | |
| ] | |
| phase_visibility_outputs = [ | |
| video_phase_group, | |
| execution_video_group, | |
| action_phase_group, | |
| control_panel_group, | |
| ] | |
| action_queue_kwargs = { | |
| "concurrency_id": SESSION_CONCURRENCY_ID, | |
| "concurrency_limit": SESSION_CONCURRENCY_LIMIT, | |
| } | |
| def _skip_load_flow(): | |
| return tuple(gr.skip() for _ in range(len(load_flow_outputs))) | |
| def _coerce_init_load_result(result): | |
| if isinstance(result, dict): | |
| status = result.get("status") | |
| if status == "ready": | |
| return _with_phase_from_load(result.get("load_result")) | |
| if status == "rejected": | |
| return _with_rejected_init( | |
| result.get("load_result"), | |
| result.get("message", UI_TEXT["progress"]["entry_rejected"]), | |
| ) | |
| return _with_phase_from_load(result) | |
| def _normalize_env_choice(env_value, choices): | |
| if env_value is None: | |
| return None | |
| env_text = str(env_value).strip() | |
| if not env_text: | |
| return None | |
| lower_map = {} | |
| for choice in choices: | |
| choice_text = str(choice).strip() | |
| if choice_text: | |
| lower_map.setdefault(choice_text.lower(), choice_text) | |
| return lower_map.get(env_text.lower(), env_text) | |
| def _resolve_header_task_state(task_text, fallback_env=None): | |
| base_choices = list(user_manager.env_choices) | |
| parsed_env = render_header_task(task_text) | |
| selected_env = _normalize_env_choice(parsed_env, base_choices) | |
| if selected_env is None: | |
| selected_env = _normalize_env_choice(fallback_env, base_choices) | |
| choices = list(base_choices) | |
| if selected_env and selected_env not in choices: | |
| choices.append(selected_env) | |
| return choices, selected_env | |
| def _build_header_task_update(task_text, fallback_env=None): | |
| choices, selected_env = _resolve_header_task_state(task_text, fallback_env=fallback_env) | |
| return gr.update(choices=choices, value=selected_env) | |
| def sync_header_from_task(task_text, goal_text): | |
| _, selected_env = _resolve_header_task_state(task_text) | |
| return _build_header_task_update(task_text), render_header_goal(goal_text), selected_env | |
| def sync_header_from_goal(goal_text, task_text, current_header_task): | |
| _, selected_env = _resolve_header_task_state(task_text, fallback_env=current_header_task) | |
| return ( | |
| _build_header_task_update(task_text, fallback_env=current_header_task), | |
| render_header_goal(goal_text), | |
| selected_env, | |
| ) | |
| def init_app_with_phase(request: gr.Request): | |
| return _coerce_init_load_result(init_app(request)) | |
| def load_next_task_with_phase(uid): | |
| return _with_phase_from_load(load_next_task_wrapper(uid)) | |
| def restart_episode_with_phase(uid): | |
| return _with_phase_from_load(restart_episode_wrapper(uid)) | |
| def switch_env_with_phase(uid, selected_env): | |
| return _with_phase_from_load(switch_env_wrapper(uid, selected_env)) | |
| def _normalize_selected_env(selected_env, current_task_env): | |
| base_choices = list(user_manager.env_choices) | |
| normalized_selected_env = _normalize_env_choice(selected_env, base_choices) | |
| normalized_current_env = _normalize_env_choice(current_task_env, base_choices) | |
| return normalized_selected_env, normalized_current_env | |
| def maybe_switch_env_with_phase(uid, selected_env, current_task_env): | |
| normalized_selected_env, normalized_current_env = _normalize_selected_env( | |
| selected_env, | |
| current_task_env, | |
| ) | |
| if not normalized_selected_env or normalized_selected_env == normalized_current_env: | |
| return _skip_load_flow() | |
| return switch_env_with_phase(uid, normalized_selected_env) | |
| task_info_box.change( | |
| fn=sync_header_from_task, | |
| inputs=[task_info_box, goal_box], | |
| outputs=[header_task_box, header_goal_box, current_task_env_state], | |
| queue=False, | |
| show_progress="hidden", | |
| ) | |
| goal_box.change( | |
| fn=sync_header_from_goal, | |
| inputs=[goal_box, task_info_box, header_task_box], | |
| outputs=[header_task_box, header_goal_box, current_task_env_state], | |
| queue=False, | |
| show_progress="hidden", | |
| ) | |
| header_task_switch = header_task_box.select( | |
| fn=maybe_switch_env_with_phase, | |
| inputs=[uid_state, header_task_box, current_task_env_state], | |
| outputs=load_flow_outputs, | |
| show_progress="full", | |
| js=SET_EPISODE_LOAD_MODE_IF_SWITCH_JS, | |
| show_progress_on=[native_progress_host], | |
| **action_queue_kwargs, | |
| ).then( | |
| fn=_phase_visibility_updates, | |
| inputs=[ui_phase_state], | |
| outputs=phase_visibility_outputs, | |
| queue=False, | |
| show_progress="hidden", | |
| ).then( | |
| fn=sync_header_from_task, | |
| inputs=[task_info_box, goal_box], | |
| outputs=[header_task_box, header_goal_box, current_task_env_state], | |
| queue=False, | |
| show_progress="hidden", | |
| ).then( | |
| fn=touch_session, | |
| inputs=[uid_state], | |
| outputs=[uid_state], | |
| queue=False, | |
| show_progress="hidden", | |
| ) | |
| header_task_switch.success( | |
| fn=None, | |
| js=RESET_EPISODE_LOAD_MODE_JS, | |
| queue=False, | |
| show_progress="hidden", | |
| ) | |
| header_task_switch.failure( | |
| fn=None, | |
| js=RESET_EPISODE_LOAD_MODE_JS, | |
| queue=False, | |
| show_progress="hidden", | |
| ) | |
| next_task_click = next_task_btn.click( | |
| fn=load_next_task_with_phase, | |
| inputs=[uid_state], | |
| outputs=load_flow_outputs, | |
| show_progress="full", | |
| js=SET_EPISODE_LOAD_MODE_JS, | |
| show_progress_on=[native_progress_host], | |
| **action_queue_kwargs, | |
| ).then( | |
| fn=_phase_visibility_updates, | |
| inputs=[ui_phase_state], | |
| outputs=phase_visibility_outputs, | |
| queue=False, | |
| show_progress="hidden", | |
| ).then( | |
| fn=sync_header_from_task, | |
| inputs=[task_info_box, goal_box], | |
| outputs=[header_task_box, header_goal_box, current_task_env_state], | |
| queue=False, | |
| show_progress="hidden", | |
| ).then( | |
| fn=touch_session, | |
| inputs=[uid_state], | |
| outputs=[uid_state], | |
| queue=False, | |
| show_progress="hidden", | |
| ) | |
| next_task_click.success( | |
| fn=None, | |
| js=RESET_EPISODE_LOAD_MODE_JS, | |
| queue=False, | |
| show_progress="hidden", | |
| ) | |
| next_task_click.failure( | |
| fn=None, | |
| js=RESET_EPISODE_LOAD_MODE_JS, | |
| queue=False, | |
| show_progress="hidden", | |
| ) | |
| restart_episode_click = restart_episode_btn.click( | |
| fn=restart_episode_with_phase, | |
| inputs=[uid_state], | |
| outputs=load_flow_outputs, | |
| show_progress="full", | |
| js=SET_EPISODE_LOAD_MODE_JS, | |
| show_progress_on=[native_progress_host], | |
| **action_queue_kwargs, | |
| ).then( | |
| fn=_phase_visibility_updates, | |
| inputs=[ui_phase_state], | |
| outputs=phase_visibility_outputs, | |
| queue=False, | |
| show_progress="hidden", | |
| ).then( | |
| fn=sync_header_from_task, | |
| inputs=[task_info_box, goal_box], | |
| outputs=[header_task_box, header_goal_box, current_task_env_state], | |
| queue=False, | |
| show_progress="hidden", | |
| ).then( | |
| fn=touch_session, | |
| inputs=[uid_state], | |
| outputs=[uid_state], | |
| queue=False, | |
| show_progress="hidden", | |
| ) | |
| restart_episode_click.success( | |
| fn=None, | |
| js=RESET_EPISODE_LOAD_MODE_JS, | |
| queue=False, | |
| show_progress="hidden", | |
| ) | |
| restart_episode_click.failure( | |
| fn=None, | |
| js=RESET_EPISODE_LOAD_MODE_JS, | |
| queue=False, | |
| show_progress="hidden", | |
| ) | |
| video_display.end( | |
| fn=on_demo_video_end_transition, | |
| inputs=[uid_state, ui_phase_state], | |
| outputs=[ | |
| video_phase_group, | |
| action_phase_group, | |
| control_panel_group, | |
| log_output, | |
| watch_demo_video_btn, | |
| ui_phase_state, | |
| ], | |
| queue=False, | |
| show_progress="hidden", | |
| ).then( | |
| fn=touch_session, | |
| inputs=[uid_state], | |
| outputs=[uid_state], | |
| queue=False, | |
| show_progress="hidden", | |
| ) | |
| video_display.stop( | |
| fn=on_demo_video_end_transition, | |
| inputs=[uid_state, ui_phase_state], | |
| outputs=[ | |
| video_phase_group, | |
| action_phase_group, | |
| control_panel_group, | |
| log_output, | |
| watch_demo_video_btn, | |
| ui_phase_state, | |
| ], | |
| queue=False, | |
| show_progress="hidden", | |
| ).then( | |
| fn=touch_session, | |
| inputs=[uid_state], | |
| outputs=[uid_state], | |
| queue=False, | |
| show_progress="hidden", | |
| ) | |
| execute_video_display.end( | |
| fn=on_execute_video_end_transition, | |
| inputs=[uid_state, post_execute_controls_state, post_execute_log_state], | |
| outputs=[ | |
| execution_video_group, | |
| action_phase_group, | |
| control_panel_group, | |
| options_radio, | |
| exec_btn, | |
| restart_episode_btn, | |
| next_task_btn, | |
| img_display, | |
| log_output, | |
| reference_action_btn, | |
| task_hint_display, | |
| post_execute_log_state, | |
| ui_phase_state, | |
| ], | |
| queue=False, | |
| show_progress="hidden", | |
| ).then( | |
| fn=touch_session, | |
| inputs=[uid_state], | |
| outputs=[uid_state], | |
| queue=False, | |
| show_progress="hidden", | |
| ) | |
| execute_video_display.stop( | |
| fn=on_execute_video_end_transition, | |
| inputs=[uid_state, post_execute_controls_state, post_execute_log_state], | |
| outputs=[ | |
| execution_video_group, | |
| action_phase_group, | |
| control_panel_group, | |
| options_radio, | |
| exec_btn, | |
| restart_episode_btn, | |
| next_task_btn, | |
| img_display, | |
| log_output, | |
| reference_action_btn, | |
| task_hint_display, | |
| post_execute_log_state, | |
| ui_phase_state, | |
| ], | |
| queue=False, | |
| show_progress="hidden", | |
| ).then( | |
| fn=touch_session, | |
| inputs=[uid_state], | |
| outputs=[uid_state], | |
| queue=False, | |
| show_progress="hidden", | |
| ) | |
| img_display.select( | |
| fn=on_map_click, | |
| inputs=[uid_state, options_radio], | |
| outputs=[img_display, coords_box, log_output], | |
| queue=False, | |
| show_progress="hidden", | |
| ).then( | |
| fn=touch_session, | |
| inputs=[uid_state], | |
| outputs=[uid_state], | |
| queue=False, | |
| show_progress="hidden", | |
| ) | |
| options_radio.change( | |
| fn=on_option_select, | |
| inputs=[uid_state, options_radio, coords_box, suppress_next_option_change_state, post_execute_log_state], | |
| outputs=[coords_box, img_display, log_output, suppress_next_option_change_state, post_execute_log_state], | |
| queue=False, | |
| show_progress="hidden", | |
| ).then( | |
| fn=touch_session, | |
| inputs=[uid_state], | |
| outputs=[uid_state], | |
| queue=False, | |
| show_progress="hidden", | |
| ) | |
| watch_demo_video_btn.click( | |
| fn=on_demo_video_play, | |
| inputs=[uid_state], | |
| outputs=[watch_demo_video_btn], | |
| queue=False, | |
| show_progress="hidden", | |
| ).then( | |
| fn=touch_session, | |
| inputs=[uid_state], | |
| outputs=[uid_state], | |
| queue=False, | |
| show_progress="hidden", | |
| ) | |
| reference_action_btn.click( | |
| fn=on_reference_action, | |
| inputs=[uid_state, options_radio], | |
| outputs=[img_display, options_radio, coords_box, log_output, suppress_next_option_change_state], | |
| **action_queue_kwargs, | |
| ).then( | |
| fn=touch_session, | |
| inputs=[uid_state], | |
| outputs=[uid_state], | |
| queue=False, | |
| show_progress="hidden", | |
| ) | |
| exec_btn.click( | |
| fn=precheck_execute_inputs, | |
| inputs=[uid_state, options_radio, coords_box], | |
| outputs=[], | |
| queue=False, | |
| show_progress="hidden", | |
| ).then( | |
| fn=switch_to_execute_phase, | |
| inputs=[uid_state], | |
| outputs=[ | |
| options_radio, | |
| exec_btn, | |
| restart_episode_btn, | |
| next_task_btn, | |
| img_display, | |
| reference_action_btn, | |
| task_hint_display, | |
| ], | |
| queue=False, | |
| show_progress="hidden", | |
| ).then( | |
| fn=touch_session, | |
| inputs=[uid_state], | |
| outputs=[uid_state], | |
| queue=False, | |
| show_progress="hidden", | |
| ).then( | |
| fn=execute_step, | |
| inputs=[uid_state, options_radio, coords_box], | |
| outputs=[ | |
| img_display, | |
| log_output, | |
| task_info_box, | |
| progress_info_box, | |
| restart_episode_btn, | |
| next_task_btn, | |
| exec_btn, | |
| execute_video_display, | |
| action_phase_group, | |
| control_panel_group, | |
| execution_video_group, | |
| options_radio, | |
| coords_box, | |
| reference_action_btn, | |
| task_hint_display, | |
| post_execute_controls_state, | |
| post_execute_log_state, | |
| ui_phase_state, | |
| ], | |
| show_progress="hidden", | |
| **action_queue_kwargs, | |
| ).then( | |
| fn=_phase_visibility_updates, | |
| inputs=[ui_phase_state], | |
| outputs=phase_visibility_outputs, | |
| queue=False, | |
| show_progress="hidden", | |
| ) | |
| demo.load( | |
| fn=None, | |
| js=THEME_LOCK_JS, | |
| queue=False, | |
| ) | |
| demo.load( | |
| fn=None, | |
| js=LIVE_OBS_CLIENT_RESIZE_JS, | |
| queue=False, | |
| ) | |
| demo.load( | |
| fn=None, | |
| js=DEMO_VIDEO_PLAY_BINDING_JS, | |
| queue=False, | |
| ) | |
| demo.load( | |
| fn=None, | |
| js=PROGRESS_TEXT_REWRITE_JS, | |
| queue=False, | |
| ) | |
| init_load = demo.load( | |
| fn=init_app_with_phase, | |
| inputs=[], | |
| outputs=load_flow_outputs, | |
| show_progress="full", | |
| js=SET_EPISODE_LOAD_MODE_JS, | |
| show_progress_on=[native_progress_host], | |
| queue=False, | |
| ).then( | |
| fn=_phase_visibility_updates, | |
| inputs=[ui_phase_state], | |
| outputs=phase_visibility_outputs, | |
| queue=False, | |
| show_progress="hidden", | |
| ).then( | |
| fn=sync_header_from_task, | |
| inputs=[task_info_box, goal_box], | |
| outputs=[header_task_box, header_goal_box, current_task_env_state], | |
| queue=False, | |
| show_progress="hidden", | |
| ).then( | |
| fn=touch_session, | |
| inputs=[uid_state], | |
| outputs=[uid_state], | |
| queue=False, | |
| show_progress="hidden", | |
| ) | |
| init_load.success( | |
| fn=None, | |
| js=RESET_EPISODE_LOAD_MODE_JS, | |
| queue=False, | |
| show_progress="hidden", | |
| ) | |
| init_load.failure( | |
| fn=None, | |
| js=RESET_EPISODE_LOAD_MODE_JS, | |
| queue=False, | |
| show_progress="hidden", | |
| ) | |
| demo.unload(fn=cleanup_current_request_session) | |
| demo.queue(max_size=None, default_concurrency_limit=None) | |
| return demo | |