Skip to content

Widget-Typ: Rollladen

Rollladen-Widgets sind für Aktoren gedacht, die sowohl absolute Positionen als auch direkte Hoch-, Stop- und Runter-Kommandos kennen.

Dialogaufbau

Ein Tap auf das Widget öffnet einen Dialog mit:

  1. optional Slider für Zielposition
  2. Button-Zeile mit Runter, optional Stop und Hoch

Die Interaktionen können unterschiedliche Endpoints nutzen und jeweils optional einen Bestätigungsdialog zeigen.

Konfigurationsstruktur

{
  "content": {
    "mode": "shutter",
    "icon": {
      "name": "window",
      "defaultColor": "#4B5563"
    },
    "title": {
      "mode": "static",
      "value": "Rollladen"
    },
    "value": {
      "mode": "template",
      "value": "{{position}} %"
    },
    "shutter": {
      "min": 0,
      "max": 100,
      "step": 5,
      "valuePath": "position",
      "sliderAction": {
        "request": {
          "url": "http://192.168.1.20/api/shutters/living-room/position",
          "method": "post",
          "jsonBody": {
            "position": 0
          }
        },
        "valueBindings": [
          {
            "target": "json_body",
            "path": "position"
          }
        ],
        "refreshAfterAction": true
      },
      "upAction": {
        "request": {
          "url": "http://192.168.1.20/api/shutters/living-room/up"
        },
        "refreshAfterAction": true
      },
      "stopAction": {
        "request": {
          "url": "http://192.168.1.20/api/shutters/living-room/stop"
        },
        "refreshAfterAction": true
      },
      "downAction": {
        "request": {
          "url": "http://192.168.1.20/api/shutters/living-room/down"
        },
        "refreshAfterAction": true
      }
    }
  },
  "status": {
    "request": {
      "url": "http://192.168.1.20/api/shutters/living-room/status"
    }
  }
}

Anzeige im Dashboard

Das Widget selbst zeigt:

  • Icon
  • Titel
  • optional content.value

Wenn sliderAction gesetzt ist, zeigt die Kachel zusätzlich:

  • Fortschrittsbalken
  • Min- und Max-Werte

Ohne sliderAction wird die Kachel wie ein kompaktes Icon/Text-Widget gerendert. Damit kann ein Statuswert weiterhin als Text angezeigt werden, ohne einen Fortschrittsbalken einzublenden.

Besonderheiten

  • upAction und downAction sind normale WidgetActionConfig
  • stopAction ist optional; wenn gesetzt, erscheint ein zusätzlicher Button im Dialog
  • sliderAction ist optional; wenn gesetzt, erscheint der Slider mit OK-Button im Dialog
  • sliderAction besitzt eine eigene Binding-Liste für den Zielwert
  • der Slider im Dialog wird aus valuePath vorinitialisiert
  • upAction, stopAction, downAction und sliderAction können jeweils unabhängig prompt: true setzen
  • wenn sliderAction.refreshAfterAction = false gesetzt ist, kann die Position optimistisch aktualisiert werden
  • status darf bei reinen Kommandowidgets fehlen; valuePath bleibt im aktuellen Schema trotzdem Pflichtfeld

Beispiel: Kommandowidget mit Bestätigung

{
  "content": {
    "mode": "shutter",
    "title": {
      "mode": "static",
      "value": "Tor"
    },
    "shutter": {
      "min": 0,
      "max": 100,
      "step": 5,
      "valuePath": "position",
      "upAction": {
        "request": {
          "url": "http://192.168.1.20/api/gate/open"
        },
        "prompt": true
      },
      "downAction": {
        "request": {
          "url": "http://192.168.1.20/api/gate/close"
        },
        "prompt": true
      }
    }
  }
}

Typische Modellierung

  • 0 = ganz offen
  • 100 = ganz geschlossen

oder umgekehrt, je nach API. Wichtig ist nur, dass min, max, valuePath und die Serversemantik zusammenpassen.

Empfehlung für Benennung

Sinnvoll ist ein konsistentes Datenmodell wie:

{
  "position": 40,
  "moving": false
}

Dann kann position direkt in:

  • valuePath
  • content.value
  • sliderAction.valueBindings

wiederverwendet werden.

Siehe auch