Glashaus Home

Energy now

SMA · 235 Grid-parallel

0Battery

0PV · kW

0House · kW

0Grid · kW

0Self-sufficiency today

0generated today

0fed in

Hot water

Solar

52.4°C top

30 °C70 °C

Circulation · Mode: Sun
Next run: –
Burner: off · reheats at ≤ 41 °C

Scenes

Switches

Tap to toggle

Appliances

All appliances

Washing machine

–

Dryer

–

Dishwasher

–

Notifications

3 open

Leo’s cube: battery 0 %, offlineJan
Wallbox adapter off: no charging data from carport and garage since Feb 2024today
Circulation pump plug: weak Wi-Fi (−81 dBm)yesterday
Heating ESP stable since repeater swapyesterday
BYD cell 69 (module 3 · C 5) still the weakesttoday

Weather

Demo

––

The house drawing above shows the weather too. Live from 0_userdata.0.Wetter.motiv.

Bin collection

Calendar & fee

Use in VIS 2 · Overview, project CSS, sculpture and skyline

Widget → Datapoint

Widget	Datapoint	Note
Kitchen light	`shelly.0.SHSW-25#421DC5EC0DB4#1.Relay0.Switch`	Shelly .118, not the garage door
Kitchen WLED	`shelly.0.SHSW-25#421DC5EC0DB4#1.Relay1.Switch`
Carport WLED	`wled.0.6fe7eba7af9e`	Preset 11 on, Preset 1 off
Leo / Mia	`hue.0.Leo.command` `hue.0.Mia.command`	JSON `{"on":true,"bri":20}`, not .on + .level separately
Garage	`javascript.0.CurrentDoorState`	0 open · 1 closed · 2 opening · 3 closing
Fan	`suedwind-ambientika.0.BDB8947CAB05.*`	fanSpeed, humidity
Circulation	`shelly.0.SHPLG-S#068CC2#1.Relay0.Switch`	Controlled by the script
Appliances	see Appliances view
Weather	`0_userdata.0.Wetter.motiv` · `.nacht` `.temperatur` · `.zustand` · `.tagMin` · `.tagMax` · `.regenHeute` · `.wind`	own script, e.g. DWD data via Bright Sky (no key); artwork: sonne, heiter, wolken, regen, gewitter, schnee, nebel, wind
Bin collection	`0_userdata.0.Muell.termine` `0_userdata.0.Muell.morgen`	JSON of the next 60 days; “morgen” empty = no collection
Battery	`bydhvs.0.State.*`	SOC, Power
Skyline (Energy, Heating)	InfluxDB `192.168.0.76:8086`	Daily values via `aggregateWindow(every: 1d)`

Project CSS

In the VIS 2 editor, paste under Project → CSS and enter in every widget’s CSS class field gh-glass . Sculpture and skyline are separate scripts in the folder vis2-glashaus/src (sculpture.js, skyline.js) and run in an HTML widget.

/* Glashaus – VIS 2 project CSS */
.gh-page{
  background:#ebe9e5;
  color:#151514;
  font-family:"Geist",-apple-system,"Helvetica Neue",sans-serif;
}
.gh-glass{
  background:rgba(255,255,255,.34)!important;
  -webkit-backdrop-filter:blur(26px) saturate(150%);
  backdrop-filter:blur(26px) saturate(150%);
  border-radius:26px!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),
    inset 0 0 0 1px rgba(255,255,255,.55),
    0 30px 60px -34px rgba(60,48,28,.2)!important;
  transition:transform .5s cubic-bezier(.34,1.56,.64,1),
    background .45s,color .45s;
}
.gh-glass:active{transform:scale(.96)}
/* State “on”: ink instead of glass */
.gh-on{background:#151514!important;color:#ebe9e5}

.gh-serif{
  font-family:"Instrument Serif",serif;
  font-style:italic;font-weight:400;
}
.gh-rise{animation:gh-rise 1s cubic-bezier(.2,.7,.2,1) both}
@keyframes gh-rise{from{opacity:0;transform:translateY(18px);filter:blur(6px)}}

.gh-spin svg{animation:gh-spin 1.4s linear infinite}
@keyframes gh-spin{to{transform:rotate(360deg)}}

@media (prefers-reduced-motion:reduce){
  .gh-rise,.gh-spin svg{animation:none!important}
}

Switch state as a class, e.g. in the CSS class field: gh-glass {v:shelly.0.SHSW-25#421DC5EC0DB4#1.Relay0.Switch; v ? 'gh-on' : ''}