Agent Skillsjasonkneen/tiny-world-builder › tinyworld-settings

tinyworld-settings

GitHub

指导修改 Tiny World Builder 设置模态框的标签页、面板及控件,确保兼容性、无障碍访问及移动端布局正确。

.codex/skills/tinyworld-settings/SKILL.md jasonkneen/tiny-world-builder

Trigger Scenarios

修改设置界面UI结构 调整渲染或世界相关配置控件 优化设置搜索与导航逻辑

Install

npx skills add jasonkneen/tiny-world-builder --skill tinyworld-settings -g -y
More Options

Non-standard path

npx skills add https://github.com/jasonkneen/tiny-world-builder/tree/main/.codex/skills/tinyworld-settings -g -y

Use without installing

npx skills use jasonkneen/tiny-world-builder@tinyworld-settings

指定 Agent (Claude Code)

npx skills add jasonkneen/tiny-world-builder --skill tinyworld-settings -a claude-code -g -y

安装 repo 全部 skill

npx skills add jasonkneen/tiny-world-builder --all -g -y

预览 repo 内 skill

npx skills add jasonkneen/tiny-world-builder --list

SKILL.md

Frontmatter
{
    "name": "tinyworld-settings",
    "description": "Use when changing Tiny World Builder Settings modal tabs, panels, controls, rendering\/world\/material\/crowd\/AI settings, or settings accessibility."
}

Tiny World Settings

Settings live in tiny-world-builder.html inside #render-modal.

Keep settings changes compatible with the existing static single-file app:

  • Preserve data-settings-tab values (app, rendering, world, materials, environment, crowd, ai) unless every command-palette and settings caller is updated in the same change.
  • Preserve existing control IDs. The settings setup code binds controls by getElementById, so moving controls between sections is safe but renaming IDs is not.
  • selectSettingsTab(name) must guard unknown names and update all tab and panel state together: .active, aria-selected, tab tabIndex, panel .active, and panel hidden.
  • Settings tabs should remain real role="tab" buttons inside a role="tablist" and support click plus Arrow/Home/End keyboard navigation.
  • Panels should be role="tabpanel" with stable IDs and aria-labelledby pointing at the matching tab.
  • Settings search should be a thin UI layer over the existing tab/panel wiring: never rename controls for search, keep hidden rows reversible when the query clears, and route automatic tab changes through selectSettingsTab().
  • Search result counts may be shown inside tab buttons, but keep the tab's data-settings-tab value, role, keyboard navigation, and accessible label in sync.

Structure rules:

  • Keep settings grouped by user intent, not implementation variable names.
  • Current top-level tabs are Workspace, Rendering, World, Materials, Environment, Crowd, and AI.
  • Tabs should stay dense and scannable: desktop may show a short hint; mobile should keep a compact horizontal tab strip.
  • Mobile/short-screen scroll: .settings-card is height-capped (max-height: calc(100vh - 100px), dvh on phones) and the panels scroll internally (.settings-panels { overflow-y: auto }, layout flex:1 1 auto; min-height:0). Never let the card grow unbounded again — on a phone that pushes lower controls off-screen and they become unreachable. On phones the layout is grid-template-rows: auto minmax(0,1fr) so the panels row is the scroller.
  • Add data-settings-keywords when a setting or panel should be discoverable by broader user language such as performance, mechanics, textures, weather, or model.
  • Preserve the existing data-settings-tab / data-settings-panel wiring, ARIA roles, keyboard tab navigation, and search-count chips.
  • Search should route broad category terms to the right panel without hiding the controls in that panel.

Organization guidance:

  • App/Workspace owns the UI theme selector (ui-theme-mode). Auto follows live UK/BST time-of-day, Dark forces dark chrome, and Light forces light chrome without auto-darkening after-hours.
  • Rendering: keep image/render-cost controls grouped by intent. Quality covers shadow quality, Resolution, Dynamic resolution, and Target FPS; dynamic resolution treats the Resolution slider as a ceiling and only changes a transient effective scale. Lighting covers lighting and fill controls; Image effects covers brightness, saturation, contrast, pixelation, shader AA, and tilt-shift.
  • World: preview/ghost controls are intentionally removed and forced to zero; do not reintroduce distance/window/opacity controls unless Preview rendering is explicitly brought back. Terrain style covers voxel bevel, landscape/planet toggles, voxel/cottage, and terrain voxel resolution. Voxel gap and Show crowns are also intentionally removed from the UI and forced off for render stability/performance.
  • Time & weather popup: the time-of-day range is editable only in Build mode for local lighting previews. Play/Tinyverse/no-edit modes follow live UK/BST time and disable the range; do not persist manual build-time overrides to localStorage.
  • Environment owns the Planes checkbox (render-planes-enabled) because it controls ambient flyovers and towed banners. It defaults off for the current performance pass and should stay searchable by plane/crop-duster/banner terms.
  • Environment owns the admin-only Watcher controls (watcher-*). The Watcher visual is sourced from engine/world/assets/god-face_15.html, rendered by engine/world/69-watcher-layer.js, and must stay a transient Three scene layer, not saved world data. Keep it world-anchored with X/Y/Z controls so it zooms/pans with the island; do not re-lock it to the camera. Leave depth testing enabled so a distant Watcher sits behind the island instead of painting over it.
  • Material wear defaults to 100% (materialWear: '1' and shipped tinyworld:render:materialWear = 1.00). When changing shipped render defaults that must override older browser localStorage, bump RENDER_SETTINGS_VERSION and update tinyworld-defaults.json together.
  • Materials, Environment, Crowd, and AI can be improved independently, but keep their current control IDs and listener wiring intact.

Validation:

  • Run the inline script syntax check, npm test, and npm run build.
  • Browser-check Settings opens, every tab can be selected, only one panel is visible, search routes to matching sections and clears cleanly, Arrow/Home/End navigation works, command-palette-style tab clicks still work, and the console has no app errors.
  • For responsive settings changes, also check desktop and mobile widths: no horizontal page overflow, tab text does not overflow, search switches to expected panels, and console has no fresh warnings/errors.

Version History

  • 2ffaf91 Current 2026-07-06 00:20

Same Skill Collection

.agents/skills/lightweight-3d-effects/SKILL.md
.agents/skills/threejs-primitive-reconstructor/SKILL.md
.agents/skills/tinyworld-i18n/SKILL.md
.claude/skills/tinyworld-i18n/SKILL.md
.codex/skills/threejs-primitive-reconstructor/SKILL.md
.codex/skills/tinyworld-25d-template-sprites/SKILL.md
.codex/skills/tinyworld-asset-editing/SKILL.md
.codex/skills/tinyworld-auto-batching/SKILL.md
.codex/skills/tinyworld-block-button-style/SKILL.md
.codex/skills/tinyworld-cctv-truman/SKILL.md
.codex/skills/tinyworld-ghost-world-gen/SKILL.md
.codex/skills/tinyworld-integrations/SKILL.md
.codex/skills/tinyworld-island-and-planes/SKILL.md
.codex/skills/tinyworld-island-viewer/SKILL.md
.codex/skills/tinyworld-lowpoly-stylized-3d/SKILL.md
.codex/skills/tinyworld-lowpoly-world-prompt/SKILL.md
.codex/skills/tinyworld-mesh-terrain/SKILL.md
.codex/skills/tinyworld-opacity-torch/SKILL.md
.codex/skills/tinyworld-render-performance/SKILL.md
.codex/skills/tinyworld-runtime-state/SKILL.md
.codex/skills/tinyworld-shader-fx/SKILL.md
.codex/skills/tinyworld-single-file/SKILL.md
.codex/skills/tinyworld-tile-variation/SKILL.md
.codex/skills/tinyworld-tinyverse-collectibles/SKILL.md
.codex/skills/tinyworld-tinyverse-race-track/SKILL.md
.codex/skills/tinyworld-tool-icons-and-modes/SKILL.md
.codex/skills/tinyworld-visual-qa/SKILL.md
.codex/skills/tinyworld-webxr/SKILL.md
.agents/skills/3d-modeling/SKILL.md
.agents/skills/fractal/SKILL.md
.agents/skills/poly-pizza-api/SKILL.md

Metadata

Files
0
Version
8afdf00
Hash
c003ae06
Indexed
2026-07-06 00:20

Главная - Вики-сайт
Copyright © 2011-2026 iteam. Current version is 2.155.2. UTC+08:00, 2026-08-05 00:51
浙ICP备14020137号-1 $Гость$