Claudeandclaude[bot] b998b0b34a feat(moon): the moon with any background, and its status in General settings (#718)
The owner decided on 30.09 that the moon is not part of the "Follow the Sun"
environment but a switch of its own: with a static background (global or a
space's own) the card showed no moon even with the switch on, and the switch
said nothing about why the moon was missing right now.

With a static background there is no environment, so the moon stands in its
own layer, `.hp-moon-sky`: the first child of `.stage` / `.hp-static-stage`,
the whole scene, no z-index, filter or will-change, under the plan by DOM
order, fading with the #101 View weight. Inside is the very #661 element, so
place, size, art and fades are unchanged, and a background switch moves it to
its new parent in the same render without a flicker. The phase comes from the
same `resolveDayCycle`, computed only while the moon is on and on View; without
`sun.sun` both cards keep their 30 s clock ticker and re-render only when the
phase changes (the environment is still compared by its whole fingerprint).

General settings get a second caption line under the moon switch
(`data-moon-status`): one snapshot per opening, judged by the lazy chunk as if
the switch were on, first reason wins (no home, day, below 3°, under 3 %),
numbers rounded and clamped below the threshold they missed. `moonStatus`
decides "shown" with the same `moonShownAt` as the element. It lives in a
WeakMap beside the draft, so it never makes the dialog dirty; a closed
opening's result is dropped. The dialog loads the chunk through the gate's
loader (`withMoon`), now shared by every caller while a load is in flight, so
there is still one fingerprint check and one retry token.

Bundle (same build, against origin/dev): initial View 300 072 -> 300 248 B gzip
(+176 B, under the 500 B of the spec; budget and ceiling not raised); lazy
editor 238 558 -> 238 991 B (+433 B, the line and English strings); lazy moon
11 385 -> 11 712 B (+327 B, layer CSS and status). `src/moon.ts` stays out of
the initial and the editor graph; bundle-budget now refuses an editor/moon
overlap. Monolith metrics: hostRefs 4 885 -> 4 888 — the three `host.` reads of
`src/editors/moon-status.ts` (hass, `_settingsDialog`, requestUpdate) through
its own three-member interface, not the editor port; the other five metrics
are unchanged. houseplan-editor-runtime.ts grows by two lines (import, call).

Tests: AC9/AC10/AC15 and the sky layer in test/moon.test.mjs (the #661
"static -> nothing" check inverted), AC14 and the opening lifecycle in
test/moon-settings.test.mjs, smokes demo/smoke_moon_static.mjs (AC1-AC6; AC1
and AC3 were red on dev) and demo/smoke_moon_status.mjs (AC11/AC12), AC7 in
smoke_daycycle_layer_budget. Golden: two new scenes
(static-bg-moon-gibbous-white-light, static-bg-moon-crescent-south-dark,
matrix v70), the harness checks the moon's parent by background and waits for
the status line in the General settings frames. Four new mutants; the clock
ticker one is a browser guard (201 at the guideline of 200).

Issue: #718
User-Visible: yes
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018qZfe7YS4rqEMKoVeS3GKd
2026-10-01 05:25:21 +00:00
2026-09-30 18:38:57 +03:00
2026-09-30 18:38:57 +03:00

🏠 House Plan — a live home map for Home Assistant

HACS Default GitHub release CI Live demo Telegram chat

📘 Full user guide · 🇷🇺 Русский · 🗂 Project issues

Your whole home at a glance

House Plan turns Home Assistant into a live map of your home. Open the dedicated House Plan item in the Home Assistant sidebar, upload a plan or draw rooms, bind them to Home Assistant areas, and the area's devices appear automatically. You can immediately see where a light is on, a door is open, a room is too cold, Zigbee signal is weak, or a leak sensor has fired.

Synthetic home in View mode with rooms, devices, light and climate

Setup is entirely graphical: no floor-plan YAML, Inkscape, or external editor. Plan data and device positions live on the Home Assistant server and stay in sync across screens.

Edit on a desktop computer. View and kiosk are fully supported on phones and tablets. The editors are designed primarily for a mouse and keyboard; individual touch editing operations may be awkward or unavailable. See the exact touch support contract.

What House Plan provides

  • Live state and safe actions. Lights and other safe devices can toggle from the plan; a lock cannot be opened by an accidental plan tap.
  • Three built-in editors. Plan creates rooms, walls and openings; Device places and configures markers; Background adds lines, labels and furniture.
  • Area-aware rooms. New devices appear automatically, while room cards can show temperature, humidity, light state and average LQI.
  • Light and environment. Room fills, lamp Glow, wall shadows, a day-cycle backdrop and sunlight through windows.
  • Flat or 2.5D. One switch in General settings › Display shows the plan with depth everywhere: raised device tiles with soft floor shadows and a soft wash of sunlight; decor and wall colours stay as you set them.
  • Doors, windows, gates and vacuums. Openings follow real contacts and locks; a robot can show its position, dock and travelled path.
  • Several floors and screens. Space tabs, swipe navigation, local viewport, and a separate initial floor for each card.
  • Wall-display kiosk. A plan-only view with fullscreen navigation and icon sizes saved for that display.

The same synthetic home in touch View mode

Your first working room

  1. Install the integration and open House Plan in the Home Assistant sidebar.
  2. Create the first space: upload SVG/PNG/JPG/WebP, reuse an uploaded image, or choose no image and draw the plan by hand.
  3. In Plan, select Walls and draw one continuous chain around the room: when it closes an area, the room dialog opens.
  4. Name the room and bind it to a Home Assistant area. Use “No area” for a room that has no devices.
  5. Open Device: devices from the bound area are already placed; drag their markers to the correct positions.
  6. Optionally use Background for lines, text and furniture.
  7. Return to View. The plan now displays live state and accepts safe actions.

Creating the first space

Closing a room outline on its first point

A selected partition and the Plan context tray

Device settings with binding provenance and the exact action result

Live presentation preview for the same device

Every workflow and edge case is in the full user guide. The Background editor contract and vacuum guide are the authorities for those subsystems.

Installation

HACS

Open the repository in HACS

House Plan is in the HACS default catalog — no custom repository needed.

  1. In HACS search for House Plan and install it.
  2. Restart Home Assistant.
  3. Open Settings → Devices & services → Add integration → House Plan.

The sidebar page and optional dashboard cards are registered automatically. After installing or updating House Plan, restart Home Assistant and fully reload the page: Ctrl+F5 on Windows/Linux or Cmd+Shift+R on macOS.

Storage mode (Home Assistant default)

No YAML is normally needed. If automatic registration did not make the card available, open Settings → Dashboards → menu ⋮ → Resources → Add resource, enter /houseplan_files/houseplan-card.js, and select JavaScript module.

YAML resources mode (Home Assistant 2026.2+)

To manage resources in configuration.yaml independently of the dashboard mode, use:

lovelace:
  resource_mode: yaml
  resources:
    - url: /houseplan_files/houseplan-card.js
      type: module

Legacy Home Assistant 2024.6–2026.1

Only for a full-YAML dashboard that is already managed in YAML, use:

lovelace:
  mode: yaml
  resources:
    - url: /houseplan_files/houseplan-card.js
      type: module

mode: yaml changes the dashboard itself to YAML mode. Do not switch a storage dashboard to legacy YAML just for House Plan; use the Storage mode instructions above instead. Do not use the on-disk path inside custom_components; Home Assistant does not serve that path as a JavaScript module.

Manual installation

Copy the complete custom_components/houseplan release folder to config/custom_components, restart Home Assistant, and add the House Plan integration. Do not copy only houseplan-card.js: the card also uses an internal manifest and content-hashed modules from the same release.

Open House Plan

After the integration is added, open House Plan in the Home Assistant sidebar. This full-page view is the primary entry point and needs no dashboard or YAML setup. It remembers the last space but always returns from another HA page in View rather than reopening an editor. Users without editing permission see the same live plan without editor controls.

If the sidebar entry cannot be registered, the integration and existing dashboard cards continue to work; check Settings → System → Repairs → System information → House Plan after restarting and hard-refreshing HA.

Optional dashboard card

Add the card only when House Plan must be embedded in a dashboard. In a Sections view it requests full width by default, while a manual size chosen in HA remains authoritative. Add it in the UI or as:

type: custom:houseplan-card
title: House plan

Different screens may start on different spaces:

type: custom:houseplan-card
default_floor: ground

All cards share server-side rooms and coordinates. Current mode, viewport and selected space remain local to the screen. Revision checks and live sync cover concurrent clients, but avoid editing the same object in two browsers at once.

Detailed documentation

Support and feedback

  • Questions and plan examples: Telegram @ha_houseplan.
  • Bugs and proposals: GitHub Issues.
  • Before reporting, update House Plan, restart HA and hard-refresh the page. Include the version, browser, logs and reproduction steps; private entity IDs may be replaced with fictional ones.

License: MIT.

S
Description
Интерактивный план дома для Home Assistant — Lovelace card + custom component
Readme MIT
565 MiB
Languages
JavaScript 51%
TypeScript 35.8%
Python 12.9%
Shell 0.2%