├── BasicPages
├── BasicPage.yaml
└── BasicPopupPage.yaml
├── MainPage.yaml
├── OneClickInstall
├── README.md
├── uicomponents_ui_page.json
└── uicomponents_ui_widget.json
├── README.md
├── Widgets
├── 3D-Print-Mobile_1.yaml
├── 3D-Print_Mobile.yaml
├── Card_Room_Popup+Motion.yaml
├── Card_Weather_Small_1.yaml
├── Cell_Card_1.yaml
├── Cell_Light_Card_1.yaml
├── Cell_Light_Color_Card_2.yaml
├── Cell_Settings_1.yaml
├── Cell_Shutter_Card_1.yaml
├── Cell_Speaker_Card_1.yaml
├── Cell_Temp_Card_1.yaml
├── Cell_Temp_Card_2.yaml
├── Command_Button.yaml
├── Command_Button_Popup.yaml
├── Connection_Card_2.yaml
├── Connection_Card_3.yaml
└── front_cam_mobile.yaml
├── icons
├── README.md
├── bedroom.png
├── bedtemp.png
├── clamp.png
├── desk-lamp.png
├── dining-table.png
├── hallway.png
├── interior-design.png
├── kitchen.png
├── led-strip.png
├── monitor.png
├── moss.png
├── neural.png
├── rgb.png
├── stairs.png
├── tooltemp.png
└── workspace.png
├── items
├── README.md
└── openweathermap.items
└── popupPages
├── 3D Drucker Popup.yaml
├── Alle Batterien.yaml
├── Büro Licht Popup.yaml
├── Büro.yaml
├── Esszimmer.yaml
├── Flur.yaml
├── Küche.yaml
├── Netzwerk Popup.yaml
├── Obergeschoss.yaml
├── Treppe.yaml
├── Werkstatt.yaml
└── Wohnzimmer.yaml
/BasicPages/BasicPage.yaml:
--------------------------------------------------------------------------------
1 | config:
2 | label: Basic Page
3 | sidebar: false
4 | blocks:
5 | - component: oh-block
6 | config: {}
7 | slots:
8 | default:
9 | - component: oh-grid-row
10 | config: {}
11 | slots:
12 | default:
13 | - component: oh-grid-col
14 | config:
15 | large: "20"
16 | medium: "33"
17 | width: "50"
18 | xlarge: "20"
19 | slots:
20 | default:
21 | - component: widget:Cell_Card_1
22 | config:
23 | bgcolor: rgba(233, 196, 106, 0.5)
24 | command: "1"
25 | header: Morgen
26 | icon: sunrise
27 | item: Szene
28 | title: Aktiviere Szene
29 | - component: oh-grid-col
30 | config:
31 | large: "20"
32 | medium: "33"
33 | width: "50"
34 | xlarge: "20"
35 | slots:
36 | default:
37 | - component: widget:Cell_Card_1
38 | config:
39 | bgcolor: rgba(244, 162, 97, 0.5)
40 | command: "2"
41 | header: Tag
42 | icon: sun_max
43 | item: Szene
44 | title: Aktiviere Szene
45 | - component: oh-grid-col
46 | config:
47 | large: "20"
48 | medium: "33"
49 | width: "50"
50 | xlarge: "20"
51 | slots:
52 | default:
53 | - component: widget:Cell_Card_1
54 | config:
55 | bgcolor: rgba(231, 111, 81, 0.5)
56 | command: "3"
57 | header: Abend
58 | icon: sunset
59 | item: Szene
60 | title: Aktiviere Szene
61 | - component: oh-grid-col
62 | config:
63 | large: "20"
64 | medium: "33"
65 | width: "50"
66 | xlarge: "20"
67 | slots:
68 | default:
69 | - component: widget:Cell_Card_1
70 | config:
71 | bgcolor: rgba(38, 70, 83, 0.5)
72 | command: "4"
73 | header: Nacht
74 | icon: moon_zzz
75 | item: Szene
76 | title: Aktiviere Szene
77 | - component: oh-grid-col
78 | config:
79 | large: "20"
80 | medium: "33"
81 | width: "50"
82 | xlarge: "20"
83 | slots:
84 | default:
85 | - component: widget:Cell_Card_1
86 | config:
87 | bgcolor: rgba(2, 48, 71, 0.8)
88 | command: "5"
89 | header: Alles aus
90 | icon: zzz
91 | item: Szene
92 | title: Hauptschalter
93 | - component: oh-block
94 | config: {}
95 | slots:
96 | default:
97 | - component: oh-grid-row
98 | config: {}
99 | slots:
100 | default:
101 | - component: oh-grid-col
102 | config:
103 | large: "40"
104 | medium: "40"
105 | small: "100"
106 | width: "100"
107 | xlarge: "40"
108 | xsmall: "100"
109 | slots:
110 | default:
111 | - component: widget:Cell_Weather_1
112 | config:
113 | command: "5"
114 | header: Alles aus
115 | icon: zzz
116 | item: Szene
117 | title: Wetter
118 | - component: oh-grid-col
119 | config:
120 | large: "30"
121 | medium: "30"
122 | small: "100"
123 | width: "100"
124 | xlarge: "30"
125 | xsmall: "100"
126 | slots:
127 | default:
128 | - component: widget:Cell_Weather_Actual_1
129 | config:
130 | item_hum: Wetterstation_Luftfeuchtigkeit
131 | item_ill: Wetterstation_Helligkeit
132 | item_rain: Wetterstation_Regenheute
133 | item_strike: Wetterstation_LightningStrikeCount
134 | item_temp: Wetterstation_Aussentemperatur
135 | item_wind: Wetterstation_WindDurchschnitt
136 | item_wind_dir: Wetterstation_Windrichtung
137 | page: Test2
138 | title: Aussen
139 | - component: oh-grid-col
140 | config:
141 | large: "10"
142 | medium: "10"
143 | small: "50"
144 | width: "50"
145 | xlarge: "10"
146 | xsmall: "50"
147 | slots:
148 | default:
149 | - component: widget:Cell_Garden_1
150 | config:
151 | item_soil_hum: SensorSensorSoilHumidity
152 | item_zone: WateringAutomatic_CurrentZone
153 | title: Garten
154 | - component: oh-grid-col
155 | config:
156 | large: "10"
157 | medium: "10"
158 | small: "50"
159 | width: "50"
160 | xlarge: "10"
161 | xsmall: "50"
162 | slots:
163 | default:
164 | - component: widget:Cell_Pool_1
165 | config:
166 | item_pump: SHELLY_PoolPump_OnOff
167 | item_temp: SHELLY_Temperatur_Pool
168 | title: Pool
169 | - component: oh-grid-col
170 | config:
171 | large: "10"
172 | medium: "10"
173 | small: "50"
174 | width: "50"
175 | xlarge: "10"
176 | xsmall: "50"
177 | slots:
178 | default:
179 | - component: widget:Cell_Settings_1
180 | config:
181 | item_battery: GroupBatteryLevelCritical
182 | page: page_29fff8448f
183 | - component: oh-block
184 | config: {}
185 | slots:
186 | default:
187 | - component: oh-grid-row
188 | config: {}
189 | slots:
190 | default:
191 | - component: oh-grid-col
192 | config:
193 | large: "25"
194 | medium: "33"
195 | small: "50"
196 | width: "100"
197 | xlarge: "25"
198 | slots:
199 | default:
200 | - component: widget:Card_room_12
201 | config:
202 | blinds_closed: StorenState
203 | heating: SHELLY_Heizung_Wohnung
204 | humidity: SHELLY_Humidity_Wohnung
205 | iconimage: livingroom
206 | illuminance: GroupIlluminanceWohnzimmer
207 | page: page_37d05f1a2b
208 | settemp: SHELLY_Soll_Temperatur_Wohnung
209 | speakers: SonosWohnzimmer_Fernbedienung
210 | status: LichterWohnung
211 | temp: SHELLY_Temperatur_Wohnung_correct
212 | text_header: Wohnzimmer
213 | windows: GroupWindowsWohnzimmerState
214 | windows_numbers: GroupWindowsWohnzimmerNumber
215 | - component: oh-grid-col
216 | config:
217 | large: "25"
218 | medium: "33"
219 | small: "50"
220 | width: "100"
221 | xlarge: "25"
222 | slots:
223 | default:
224 | - component: widget:Card_room_12
225 | config:
226 | heating: SHELLY_Heizung_Zimmer_Eltern
227 | humidity: SHELLY_Humidity_Zimmer_Eltern
228 | iconimage: myparents
229 | page: ZimmerEltern
230 | settemp: SHELLY_Soll_Temperatur_Zimmer_Eltern
231 | speakers: SonosEltern_Fernbedienung
232 | status: Group_Lights_ElternSchlafzimmer
233 | temp: SHELLY_Temperatur_Zimmer_Eltern_correct
234 | text_header: Eltern
235 | - component: oh-grid-col
236 | config:
237 | large: "25"
238 | medium: "33"
239 | small: "50"
240 | width: "100"
241 | xlarge: "25"
242 | slots:
243 | default:
244 | - component: widget:Card_room_12
245 | config:
246 | heating: SHELLY_Heizung_Zimmer_GIRL
247 | humidity: SHELLY_Humidity_Zimmer_GIRL
248 | iconimage: mygirl
249 | illuminance: FensterGIRL1_Lux
250 | page: ZimmerGIRL
251 | settemp: SHELLY_Soll_Temperatur_Zimmer_GIRL
252 | speakers: SonosGIRL_Fernbedienung
253 | status: LichterGIRL
254 | temp: SHELLY_Temperatur_Zimmer_GIRL_correct
255 | text_header: GIRL
256 | windows: FensterGIRL1_Contact
257 | - component: oh-grid-col
258 | config:
259 | large: "25"
260 | medium: "33"
261 | small: "50"
262 | width: "100"
263 | xlarge: "25"
264 | slots:
265 | default:
266 | - component: widget:Card_room_12
267 | config:
268 | heating: SHELLY_Heizung_Zimmer_BOY
269 | humidity: SHELLY_Humidity_Zimmer_BOY
270 | iconimage: myboy
271 | illuminance: FensterBOY_Lux
272 | page: ZimmerBOY
273 | settemp: SHELLY_Soll_Temperatur_Zimmer_BOY
274 | speakers: SonosBOY_Fernbedienung
275 | status: LichterBOY
276 | temp: SHELLY_Temperatur_Zimmer_BOY_correct
277 | text_header: BOY
278 | windows: FensterBOY_Contact
279 | - component: oh-grid-col
280 | config:
281 | large: "25"
282 | medium: "33"
283 | small: "50"
284 | width: "100"
285 | xlarge: "25"
286 | slots:
287 | default:
288 | - component: widget:Card_room_12
289 | config:
290 | boiler_temp: Boiler_Temperatur
291 | door_lock: SmartLock_Action
292 | door_state: SmartLock_DoorSensorState
293 | iconimage: myfrontdoor
294 | page: page_c498bc9132
295 | status: LichterEingang
296 | text_header: Eingangsbereich
297 | - component: oh-grid-col
298 | config:
299 | large: "25"
300 | medium: "33"
301 | small: "50"
302 | width: "100"
303 | xlarge: "25"
304 | slots:
305 | default:
306 | - component: widget:Card_room_12
307 | config:
308 | humidity: ShellyHTSHHT1_Luftfeuchtigkeit
309 | iconimage: bathroom
310 | page: page_b986cb7442
311 | status: LichterBadWC
312 | temp: ShellyHTSHHT1_Temperatur
313 | text_header: Bad/WC
314 | - component: oh-grid-col
315 | config:
316 | large: "25"
317 | medium: "33"
318 | small: "50"
319 | width: "100"
320 | xlarge: "25"
321 | slots:
322 | default:
323 | - component: widget:Card_room_12
324 | config:
325 | heating: SHELLY_Heizung_Hobbyraum
326 | humidity: SHELLY_Humidity_Hobbyraum
327 | iconimage: myhobbyroom
328 | illuminance: LichtsensorUG_Beleuchtungsstarke
329 | page: ZimmerHobby
330 | settemp: SHELLY_Soll_Temperatur_Hobbyraum
331 | status: LichterHobbyraum
332 | temp: SHELLY_Temperatur_Hobbyraum_correct
333 | text_header: Hobbyraum / Keller
334 | - component: oh-grid-col
335 | config:
336 | large: "25"
337 | medium: "33"
338 | small: "50"
339 | width: "100"
340 | xlarge: "25"
341 | slots:
342 | default:
343 | - component: widget:Card_room_12
344 | config:
345 | humidity: SensorWaschkuche_Sensorrelativehumidity
346 | iconimage: mylaundry
347 | page: page_9a9ffe53b4
348 | temp: SensorWaschkuche_Sensortemperature
349 | text_header: Waschküche
350 | masonry: []
351 | grid: null
352 |
--------------------------------------------------------------------------------
/BasicPages/BasicPopupPage.yaml:
--------------------------------------------------------------------------------
1 | config:
2 | label: Basic Popup Page
3 | sidebar: false
4 | blocks:
5 | - component: oh-block
6 | config: {}
7 | slots:
8 | default:
9 | - component: oh-grid-row
10 | config: {}
11 | slots:
12 | default:
13 | - component: oh-grid-col
14 | config:
15 | width: "50"
16 | slots:
17 | default:
18 | - component: widget:Cell_Light_Card_1
19 | config:
20 | header: Wohnen
21 | icon: lightbulb
22 | item_brightness: LichtWohnzimmer_Helligkeit
23 | item_schalter: LichtWohnzimmer_Schalter
24 | title: Licht
25 | - component: oh-grid-col
26 | config:
27 | width: "50"
28 | slots:
29 | default:
30 | - component: widget:Cell_Light_Card_1
31 | config:
32 | header: Essen
33 | icon: lightbulb
34 | item_brightness: LichtEssen_Helligkeit
35 | item_schalter: LichtEssen_Schalter
36 | title: Licht
37 | - component: oh-grid-col
38 | config:
39 | width: "50"
40 | slots:
41 | default:
42 | - component: widget:Cell_Light_Card_1
43 | config:
44 | header: Gang
45 | icon: lightbulb
46 | item_brightness: LichtWohnzimmerGang_Helligkeit
47 | item_schalter: LichtWohnzimmerGang_Schalter
48 | title: Licht
49 | - component: oh-grid-col
50 | config:
51 | width: "50"
52 | slots:
53 | default:
54 | - component: widget:Cell_Light_Card_1
55 | config:
56 | header: Küche
57 | icon: lightbulb
58 | item_brightness: LichtKuche_Helligkeit
59 | item_schalter: LichtKuche_Schalter
60 | title: Licht
61 | - component: oh-block
62 | config: {}
63 | slots:
64 | default:
65 | - component: oh-grid-row
66 | config: {}
67 | slots:
68 | default:
69 | - component: oh-grid-col
70 | config:
71 | large: "50"
72 | width: "100"
73 | xlarge: "50"
74 | slots:
75 | default:
76 | - component: widget:Cell_Temp_Card_1
77 | config:
78 | heating_item: SHELLY_Heizung_Wohnung
79 | humidity_item: SHELLY_Humidity_Wohnung
80 | icon: thermometer
81 | set_temp_item: SHELLY_Soll_Temperatur_Wohnung
82 | temp_item: SHELLY_Temperatur_Wohnung_correct
83 | title: Temperatur
84 | - component: oh-grid-col
85 | config:
86 | large: "50"
87 | medium: "100"
88 | small: "100"
89 | width: "100"
90 | xlarge: "50"
91 | xsmall: "100"
92 | slots:
93 | default:
94 | - component: widget:Cell_Speaker_Card_1
95 | config:
96 | header: Playbar
97 | icon: speaker_3
98 | item: SonosWohnzimmer_Fernbedienung
99 | item_cover: SonosWohnzimmer_Coverbild
100 | item_volume: SonosWohnzimmer_Lautstarke
101 | title: Sonos
102 | - component: oh-grid-col
103 | config:
104 | large: "33"
105 | width: "50"
106 | xlarge: "33"
107 | slots:
108 | default:
109 | - component: widget:Cell_Shutter_Card_1
110 | config:
111 | header: Essen 1
112 | icon: arrow_up_arrow_down
113 | item: StorenEssen1_Steuerung0offen100geschlossen
114 | title: Storen
115 | - component: oh-grid-col
116 | config:
117 | large: "33"
118 | width: "50"
119 | xlarge: "33"
120 | slots:
121 | default:
122 | - component: widget:Cell_Shutter_Card_1
123 | config:
124 | header: Essen 2
125 | icon: arrow_up_arrow_down
126 | item: StorenEssen2_Steuerung0offen100geschlossen
127 | title: Storen
128 | - component: oh-grid-col
129 | config:
130 | large: "33"
131 | width: "50"
132 | xlarge: "33"
133 | slots:
134 | default:
135 | - component: widget:Cell_Shutter_Card_1
136 | config:
137 | header: Wohnen
138 | icon: arrow_up_arrow_down
139 | item: StorenWohnen_Steuerung0offen100geschlossen
140 | title: Storen
141 | masonry: null
142 | grid: null
143 |
--------------------------------------------------------------------------------
/MainPage.yaml:
--------------------------------------------------------------------------------
1 | config:
2 | label: MainPage
3 | sidebar: true
4 | blocks:
5 | - component: oh-block
6 | config: {}
7 | slots:
8 | default:
9 | - component: oh-grid-row
10 | config: {}
11 | slots:
12 | default:
13 | - component: oh-grid-col
14 | config:
15 | large: "40"
16 | medium: "40"
17 | small: "100"
18 | width: "100"
19 | xlarge: "40"
20 | xsmall: "100"
21 | slots:
22 | default:
23 | - component: widget:Card_Weather_Small_1
24 | config:
25 | command: "5"
26 | dateFormat: true
27 | header: Alles aus
28 | icon: zzz
29 | item: Szene
30 | itemPrefix: OneCallAPIweatherandforecast_
31 | locationTitle: Loiching
32 | sunIndicator: true
33 | title: Wetter
34 | - component: oh-grid-col
35 | config:
36 | large: "40"
37 | medium: "40"
38 | small: "100"
39 | width: "100"
40 | xlarge: "40"
41 | xsmall: "100"
42 | slots:
43 | default:
44 | - component: widget:front_cam_mobile
45 | config:
46 | cardheight: 200px
47 | urllivestream: http://192.168.2.193:8080/ipcamera/BulletCamera/ipcamera.mjpeg
48 | - component: oh-block
49 | config: {}
50 | slots:
51 | default:
52 | - component: oh-grid-row
53 | config: {}
54 | slots:
55 | default:
56 | - component: oh-grid-col
57 | config:
58 | large: "20"
59 | medium: "33"
60 | width: "50"
61 | xlarge: "20"
62 | slots:
63 | default:
64 | - component: widget:Cell_Card_1
65 | config:
66 | bgcolor: rgba(0, 143, 170, 0.5)
67 | command: TOGGLE
68 | header: TV Mode
69 | icon: tv
70 | item: TVModeLicht
71 | title: Aktiviere Szene
72 | - component: oh-grid-col
73 | config:
74 | large: "20"
75 | medium: "33"
76 | width: "50"
77 | xlarge: "20"
78 | slots:
79 | default:
80 | - component: widget:Cell_Card_1
81 | config:
82 | bgcolor: rgba(244, 162, 97, 0.5)
83 | command: TOGGLE
84 | header: Ambiente
85 | icon: lightbulb
86 | item: AmbientLight
87 | title: Aktiviere Szene
88 | - component: oh-grid-col
89 | config:
90 | large: "20"
91 | medium: "33"
92 | width: "50"
93 | xlarge: "20"
94 | slots:
95 | default:
96 | - component: widget:Cell_Card_1
97 | config:
98 | bgcolor: rgba(231, 111, 81, 0.5)
99 | command: TOGGLE
100 | header: Büro Studio
101 | icon: camera
102 | item: StudioAll
103 | title: Aktiviere Szene
104 | - component: oh-grid-col
105 | config:
106 | large: "20"
107 | medium: "33"
108 | width: "50"
109 | xlarge: "20"
110 | slots:
111 | default:
112 | - component: widget:Cell_Card_1
113 | config:
114 | bgcolor: rgba(38, 70, 83, 0.5)
115 | command: OFF
116 | header: Alle Lichter aus
117 | icon: moon_zzz
118 | item: AlleLichter1
119 | title: Aktiviere Szene
120 | - component: oh-grid-col
121 | config:
122 | large: "20"
123 | medium: "33"
124 | width: "50"
125 | xlarge: "20"
126 | slots:
127 | default:
128 | - component: widget:Cell_Card_1
129 | config:
130 | bgcolor: rgba(2, 48, 71, 0.8)
131 | command: OFF
132 | header: Alles aus
133 | icon: zzz
134 | item: HauptSchalter
135 | title: Hauptschalter
136 | - component: oh-block
137 | config: {}
138 | slots:
139 | default:
140 | - component: oh-grid-row
141 | config: {}
142 | slots:
143 | default:
144 | - component: oh-grid-col
145 | config:
146 | large: "25"
147 | medium: "33"
148 | small: "50"
149 | width: "100"
150 | xlarge: "25"
151 | slots:
152 | default:
153 | - component: widget:Card_Room_Popup+Motion
154 | config:
155 | iconimage: hallway
156 | illuminance: BewegungsmelderFlur_Illumination
157 | motion: BewegungsmelderFlur_Motion
158 | page: page_065ac3d806
159 | status: FlurLicht_4_STATE
160 | text_header: Flur
161 | - component: oh-grid-col
162 | config:
163 | large: "25"
164 | medium: "33"
165 | small: "50"
166 | width: "100"
167 | xlarge: "25"
168 | slots:
169 | default:
170 | - component: widget:Card_Room_Popup+Motion
171 | config:
172 | blinds_closed: RollladenKuche
173 | heating: HeizungKuche
174 | humidity: SwitchbotMeterTest_SwitchBotMeterTestHum
175 | iconimage: kitchen
176 | page: page_a72c41bde2
177 | settemp: HeizungKuche_SetPointTemperature
178 | status: KucheLicht_4_STATE
179 | temp: SwitchbotMeterTest_SwitchbotMeterTemp
180 | text_header: Küche
181 | - component: oh-grid-col
182 | config:
183 | large: "25"
184 | medium: "33"
185 | small: "50"
186 | width: "100"
187 | xlarge: "25"
188 | slots:
189 | default:
190 | - component: widget:Card_Room_Popup+Motion
191 | config:
192 | blinds_closed: RollladenEsszimmer_4_LEVEL
193 | humidity: SwitchbotMeterTest_SwitchBotMeterTestHum
194 | iconimage: dining-table
195 | page: page_5008381345
196 | status: EsszimmerLicht
197 | temp: BroadlinkRM2_Temperature
198 | text_header: Esszimmer
199 | windows: FensterGIRL1_Contact
200 | - component: oh-grid-col
201 | config:
202 | large: "25"
203 | medium: "33"
204 | small: "50"
205 | width: "100"
206 | xlarge: "25"
207 | slots:
208 | default:
209 | - component: widget:Card_Room_Popup+Motion
210 | config:
211 | blinds_closed: Rollos_Wohnzimmer_4_LEVEL
212 | heating: HeizungWohnzimmer_ActiveProfile
213 | iconimage: interior-design
214 | page: page_ac94a6c079
215 | settemp: HeizungWohnzimmer_SET_POINT_TEMPERATURE
216 | status: AlleLichterWohnzimmer
217 | temp: HeizungWohnzimmer_ACTUAL_TEMPERATURE
218 | text_header: Wohnzimmer
219 | - component: oh-grid-col
220 | config:
221 | large: "25"
222 | medium: "33"
223 | small: "50"
224 | width: "100"
225 | xlarge: "25"
226 | slots:
227 | default:
228 | - component: widget:Card_Room_Popup+Motion
229 | config:
230 | iconimage: stairs
231 | motion: Wemos4TreppeMotion_Wemos4TreppeMotion
232 | page: page_98db93cfca
233 | status: TreppeLicht
234 | text_header: Treppe
235 | - component: oh-grid-col
236 | config:
237 | large: "25"
238 | medium: "33"
239 | small: "50"
240 | width: "100"
241 | xlarge: "25"
242 | slots:
243 | default:
244 | - component: widget:Card_Room_Popup+Motion
245 | config:
246 | heating: SchlafzimmerHeizung_ActiveProfile
247 | iconimage: bedroom
248 | page: page_afef51c38a
249 | settemp: SchlafzimmerHeizung_SetPointTemperature
250 | speakers: Chromecast_Fernbedienung
251 | status: Schlafzimmer_BL
252 | temp: SchlafzimmerHeizung_ActualTemperature
253 | text_header: Obergeschoss
254 | - component: oh-grid-col
255 | config:
256 | large: "25"
257 | medium: "33"
258 | small: "50"
259 | width: "100"
260 | xlarge: "25"
261 | slots:
262 | default:
263 | - component: widget:Card_Room_Popup+Motion
264 | config:
265 | humidity: SwitchbotMeter_hum
266 | iconimage: workspace
267 | page: page_d602ae29f8
268 | status: BuroShelly1pm_Betrieb
269 | temp: GenericMQTTThing_Temp
270 | text_header: Büro
271 | - component: oh-grid-col
272 | config:
273 | large: "25"
274 | medium: "33"
275 | small: "50"
276 | width: "100"
277 | xlarge: "25"
278 | slots:
279 | default:
280 | - component: widget:Card_Room_Popup+Motion
281 | config:
282 | humidity: TuyaTempSensor_TuyaTempSensorLuftfeuchtigkeit
283 | iconimage: clamp
284 | page: page_da9e656284
285 | status: WerkstattLicht
286 | temp: TuyaTempSensor_TuyaTempSensorTemperatur
287 | text_header: Werkstatt
288 | windows: TuyaContact_TuyaContactSwitch
289 | - component: oh-grid-col
290 | config:
291 | large: "25"
292 | medium: "33"
293 | small: "50"
294 | width: "100"
295 | xlarge: "25"
296 | slots:
297 | default:
298 | - component: widget:Connection_Card_2
299 | config:
300 | download: SpeedtestBinding_DownloadBandwidth
301 | iconimage: neural
302 | latency: SpeedtestBinding_Latency
303 | page: page_019befbdfd
304 | text_header: Connection
305 | upload: SpeedtestBinding_UploadBandwidth
306 | - component: oh-block
307 | config: {}
308 | slots:
309 | default:
310 | - component: oh-grid-row
311 | config: {}
312 | slots:
313 | default:
314 | - component: oh-grid-col
315 | config:
316 | large: "10"
317 | medium: "10"
318 | small: "50"
319 | width: "50"
320 | xlarge: "10"
321 | xsmall: "50"
322 | slots:
323 | default:
324 | - component: widget:Cell_Settings_1
325 | config:
326 | item_battery: AlleBatterien
327 | page: page_dbf9a7900f
328 | masonry: []
329 | grid: null
330 |
--------------------------------------------------------------------------------
/OneClickInstall/README.md:
--------------------------------------------------------------------------------
1 | One Click Installation of my Pages and Widgets
2 |
3 | Be !!!careful!!! if you already got some Pages/Widgets setup. This will overwrite your Configuration.
4 |
5 | Copy these two Files to /var/lib/openhab/jsondb/
6 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # openHAB3WebUI
2 |
3 | One of my favorite WebUI Page for openHAB3. It was initially created by Mike P and customized by Me.
4 |
5 |
6 |
7 |
8 |
9 | -Desktop-
10 |
11 |
12 |
13 |
14 |
15 | -Smarphone-
16 |
17 |
18 |
19 |
20 |
21 |
22 | Verknüpfungen:
23 |
24 | MainPage:
25 | - Widgets:
26 | - weatherCard
27 | - front_cam_mobile
28 | - Cell_Card_1
29 | - Card_room_12_motion
30 | - Card_dsl
31 | - Cell_Settings_1
32 | - Pages:
33 | - Flur
34 | - Küche
35 | - Esszimmer
36 | - Wohnzimmer
37 | - Treppe
38 | - Obergeschoss
39 | - Büro
40 | - Werkstatt
41 | - Netzwerk Popup
42 | - Alle Batterien
43 | - icons:
44 | - alle Icons in /etc/openhab/html/icons/ legen
45 |
46 | Flur:
47 | - Widgets:
48 | - command-button-heater
49 |
50 | Küche:
51 | - Widgets:
52 | - command-button-heater
53 | - Cell_Temp_Card_1
54 | - Cell_Shutter_Card_1
55 |
56 | Esszimmer:
57 | - Widgets:
58 | - command-button-heater
59 | - Cell_Shutter_Card_1
60 |
61 | Wohnzimmer:
62 | - Widgest:
63 | - Cell_Temp_Card_1
64 | - Cell_Speaker_Card_1
65 | - Cell_Shutter_Card_1
66 | - Cell_Light_Card_1
67 |
68 | Treppe:
69 | - Widgets:
70 | - command-button-heater
71 |
72 | Obergeschoss:
73 | - Widgets:
74 | - command-button-heater
75 | - Cell_Temp_Card_1
76 | - Cell_Shutter_Card_1
77 |
78 | Büro:
79 | - Wigets:
80 | - Cell_Temp_Card_1
81 | - command-button-heater
82 | - command-button-heater_popup_1
83 | - 3d-druck-mobile_1
84 |
85 | Werkstatt:
86 | - Widgets:
87 | - Cell_Temp_Card_1
88 | - command-button-heater
89 |
90 |
91 | Netzwerk Popup:
92 | - Widgets:
93 | - dsl_popup
94 |
95 | Alle Batterien:
96 | - Widgets:
97 | - oh-gauge-card
98 |
99 |
100 |
101 |
102 |
103 |
--------------------------------------------------------------------------------
/Widgets/3D-Print-Mobile_1.yaml:
--------------------------------------------------------------------------------
1 | uid: 3D-Print-Mobile_1
2 | tags: []
3 | props:
4 | parameters:
5 | - description: icon1 name without ".png", located in static/icons/ folder
6 | label: Icon1
7 | name: iconimage1
8 | required: false
9 | type: TEXT
10 | - description: icon2 name without ".png", located in static/icons/ folder
11 | label: Icon2
12 | name: iconimage2
13 | required: false
14 | type: TEXT
15 | - context: item
16 | description: Set the Power item here
17 | label: Power
18 | name: poweritem
19 | required: false
20 | type: TEXT
21 | - context: item
22 | description: Set the Light item here
23 | label: Light
24 | name: lightitem
25 | required: false
26 | type: TEXT
27 | - description: Set the height of the Widget
28 | label: Widget Height
29 | name: cardheight
30 | required: false
31 | type: TEXT
32 | - description: Name your Printer!
33 | label: Printer Name
34 | name: printername
35 | required: false
36 | type: TEXT
37 | - context: item
38 | description: Set item for Bed Temperature here
39 | label: Bed Temperature
40 | name: bedtempitem
41 | required: false
42 | type: TEXT
43 | - context: item
44 | description: Set item for Hotend Temperature here
45 | label: Hotend Temperature
46 | name: hotendtempitem
47 | required: false
48 | type: TEXT
49 | - context: item
50 | description: Set item for Time Left here
51 | label: Time Left
52 | name: timeleftitem
53 | required: false
54 | type: TEXT
55 | - context: item
56 | description: Set item for Progress here
57 | label: Progress
58 | name: progressitem
59 | required: false
60 | type: TEXT
61 | - description: Set the url of the live stream here
62 | label: Url live stream
63 | name: urllivestream
64 | required: false
65 | type: TEXT
66 | - description: rgba or HEX
67 | label: Background Color
68 | name: bgcolor
69 | required: false
70 | type: TEXT
71 | - description: Page which will be opened as popup
72 | label: Page ID
73 | name: page
74 | required: false
75 | parameterGroups: []
76 | timestamp: Nov 27, 2021, 12:54:56 PM
77 | component: f7-card
78 | config:
79 | style:
80 | --weather-card-border-radius: 20px
81 | --weather-card-color: "=(!props.fontColor) ? '255,255,255' : props.fontColor"
82 | --weather-card-text-color: rgba(var(--weather-card-color),1)
83 | --weather-card-text-shadow-color: "=(!props.textShadowColor) ? '0,0,0' : props.textShadowColor"
84 | --weather-font-size-large: 26px
85 | --weather-font-size-normal: 18px
86 | --weather-font-size-small: 16px
87 | --weather-font-size-xlarge: 60px
88 | --weather-font-size-xsmall: 14px
89 | --weather-font-size-xxlarge: 70px
90 | --weather-font-size-xxsmall: 12px
91 | --weather-text-shadow-light: 2px 2px rgba(var(--weather-card-text-shadow-color),.15)
92 | --weather-text-shadow-strong: 2px 2px rgba(var(--weather-card-text-shadow-color),.35)
93 | --weather-text-transform-time: uppercase
94 | -moz-user-select: none
95 | -ms-user-select: none
96 | -webkit-user-select: none
97 | background: "=props.bgcolor ? props.bgcolor : ''"
98 | border-radius: var(--weather-card-border-radius)
99 | color: var(--weather-card-text-color)
100 | height: '=props.cardheight ? props.cardheight : "180px"'
101 | overflow: hidden
102 | user-select: none
103 | slots:
104 | default:
105 | - component: f7-block
106 | config:
107 | class:
108 | - no-padding
109 | - no-margin
110 | style:
111 | height: 100%
112 | left: 0
113 | position: absolute
114 | top: 0
115 | width: 100%
116 | slots:
117 | default:
118 | - component: f7-row
119 | config:
120 | style:
121 | display: grid
122 | height: 20%
123 | justify-content: center
124 | justify-items: center
125 | margin-top: 15px
126 | slots:
127 | default:
128 | - component: Label
129 | config:
130 | style:
131 | font-size: 18px
132 | grid-column: 1
133 | padding-top: 0px
134 | text: '=props.printername ? props.printername : "Printer Name"'
135 | - component: f7-row
136 | config:
137 | style:
138 | align-items: center
139 | display: grid
140 | grid-template-columns: 30% 70%
141 | height: 13%
142 | slots:
143 | default:
144 | - component: oh-image
145 | config:
146 | height: 14
147 | style:
148 | align-self: center
149 | place-self: end
150 | url: ='/static/icons/' + props.iconimage2 + '.png'
151 | width: 14
152 | - component: Label
153 | config:
154 | style:
155 | font-size: 16px
156 | grid-column: 2
157 | margin-left: 5px
158 | text: '=items[props.bedtempitem].state ? items[props.bedtempitem].state + " ℃" : "Name"'
159 | - component: f7-row
160 | config:
161 | style:
162 | align-items: center
163 | display: grid
164 | grid-template-columns: 30% 70%
165 | height: 13%
166 | slots:
167 | default:
168 | - component: oh-image
169 | config:
170 | height: 14
171 | style:
172 | align-self: center
173 | place-self: end
174 | url: ='/static/icons/' + props.iconimage1 + '.png'
175 | width: 14
176 | - component: Label
177 | config:
178 | style:
179 | font-size: 16px
180 | grid-column: 2
181 | margin-left: 5px
182 | text: '=items[props.hotendtempitem].state ? items[props.hotendtempitem].state + " ℃" : "Name"'
183 | - component: f7-row
184 | config:
185 | style:
186 | align-items: center
187 | display: grid
188 | grid-template-columns: 30% 70%
189 | height: 13%
190 | slots:
191 | default:
192 | - component: oh-image
193 | config:
194 | height: 14
195 | style:
196 | align-self: center
197 | place-self: end
198 | url: https://iconsplace.com/wp-content/uploads/_icons/ffffff/256/png/time-icon-18-256.png
199 | width: 14
200 | - component: Label
201 | config:
202 | style:
203 | font-size: 16px
204 | grid-column: 2
205 | margin-left: 5px
206 | text: '=items[props.timeleftitem].state == "NULL" ? "not printing" : Math.floor(items[props.timeleftitem].state /3600)+":"+ Math.floor(items[props.timeleftitem].state / 60) + " h"'
207 | - component: f7-row
208 | config:
209 | style:
210 | display: grid
211 | grid-template-columns: 50% 50%
212 | height: 10%
213 | justify-items: center
214 | margin-top: 10px
215 | slots:
216 | default:
217 | - component: oh-button
218 | config:
219 | action: toggle
220 | actionCommand: ON
221 | actionCommandAlt: OFF
222 | actionItem: =props.poweritem
223 | color: '=items[props.poweritem].state === "ON" ? "green": "red"'
224 | height: 40px
225 | iconF7: power
226 | iconSize: 25px
227 | - component: oh-button
228 | config:
229 | action: toggle
230 | actionCommand: ON
231 | actionCommandAlt: OFF
232 | actionItem: =props.lightitem
233 | color: '=items[props.lightitem].state === "ON" ? "yellow": "white"'
234 | height: 40px
235 | iconF7: lightbulb
236 | iconSize: 25px
237 | - component: f7-progressbar
238 | config:
239 | color: '=items[props.timeleftitem].state > 0 ? "multi" : "red"'
240 | infinite: "=items[props.timeleftitem].state > 0 ? true : false"
241 | style:
242 | border-top-left-radius: 100px 25px
243 | border-top-right-radius: 100px 25px
244 | height: 5px
245 | left: 0
246 | margin: auto
247 | position: absolute
248 | right: 0
249 | width: 90%
250 | - component: oh-link
251 | config:
252 | action: popup
253 | actionModal: ='page:' + props.page
254 | style:
255 | height: 50px
256 | left: 0px
257 | position: absolute
258 | top: 0px
259 | width: 100%
260 |
--------------------------------------------------------------------------------
/Widgets/3D-Print_Mobile.yaml:
--------------------------------------------------------------------------------
1 | uid: 3D-Print-Mobile
2 | tags: []
3 | props:
4 | parameters:
5 | - description: icon1 name without ".png", located in static/icons/ folder
6 | label: Icon1
7 | name: iconimage1
8 | required: false
9 | type: TEXT
10 | - description: icon2 name without ".png", located in static/icons/ folder
11 | label: Icon2
12 | name: iconimage2
13 | required: false
14 | type: TEXT
15 | - context: item
16 | description: Set the Power item here
17 | label: Power
18 | name: poweritem
19 | required: false
20 | type: TEXT
21 | - context: item
22 | description: Set the Light item here
23 | label: Light
24 | name: lightitem
25 | required: false
26 | type: TEXT
27 | - description: Set the height of the Widget
28 | label: Widget Height
29 | name: cardheight
30 | required: false
31 | type: TEXT
32 | - description: Name your Printer!
33 | label: Printer Name
34 | name: printername
35 | required: false
36 | type: TEXT
37 | - context: item
38 | description: Set item for Bed Temperature here
39 | label: Bed Temperature
40 | name: bedtempitem
41 | required: false
42 | type: TEXT
43 | - context: item
44 | description: Set item for Hotend Temperature here
45 | label: Hotend Temperature
46 | name: hotendtempitem
47 | required: false
48 | type: TEXT
49 | - context: item
50 | description: Set item for Time Left here
51 | label: Time Left
52 | name: timeleftitem
53 | required: false
54 | type: TEXT
55 | - context: item
56 | description: Set item for Progress here
57 | label: Progress
58 | name: progressitem
59 | required: false
60 | type: TEXT
61 | - description: Set the url of the live stream here
62 | label: Url live stream
63 | name: urllivestream
64 | required: false
65 | type: TEXT
66 | - description: rgba or HEX
67 | label: Background Color
68 | name: bgcolor
69 | required: false
70 | type: TEXT
71 | parameterGroups: []
72 | timestamp: Nov 27, 2021, 2:17:17 PM
73 | component: f7-card
74 | config:
75 | style:
76 | --weather-card-border-radius: 20px
77 | --weather-card-color: "=(!props.fontColor) ? '255,255,255' : props.fontColor"
78 | --weather-card-text-color: rgba(var(--weather-card-color),1)
79 | --weather-card-text-shadow-color: "=(!props.textShadowColor) ? '0,0,0' : props.textShadowColor"
80 | --weather-font-size-large: 26px
81 | --weather-font-size-normal: 18px
82 | --weather-font-size-small: 16px
83 | --weather-font-size-xlarge: 60px
84 | --weather-font-size-xsmall: 14px
85 | --weather-font-size-xxlarge: 70px
86 | --weather-font-size-xxsmall: 12px
87 | --weather-text-shadow-light: 2px 2px rgba(var(--weather-card-text-shadow-color),.15)
88 | --weather-text-shadow-strong: 2px 2px rgba(var(--weather-card-text-shadow-color),.35)
89 | --weather-text-transform-time: uppercase
90 | -moz-user-select: none
91 | -ms-user-select: none
92 | -webkit-user-select: none
93 | background: "=props.bgcolor ? props.bgcolor : ''"
94 | border-radius: var(--weather-card-border-radius)
95 | color: var(--weather-card-text-color)
96 | height: '=props.cardheight ? props.cardheight : "410px"'
97 | overflow: hidden
98 | user-select: none
99 | slots:
100 | default:
101 | - component: f7-block
102 | config:
103 | class:
104 | - no-padding
105 | - no-margin
106 | style:
107 | height: 100%
108 | left: 0
109 | position: absolute
110 | top: 0
111 | width: 100%
112 | slots:
113 | default:
114 | - component: f7-row
115 | config:
116 | style:
117 | display: grid
118 | height: 10%
119 | justify-content: center
120 | justify-items: center
121 | margin-top: 15px
122 | slots:
123 | default:
124 | - component: Label
125 | config:
126 | style:
127 | font-size: 22px
128 | grid-column: 1
129 | padding-top: 0px
130 | text: '=props.printername ? props.printername : "Printer Name"'
131 | - component: f7-row
132 | config:
133 | style:
134 | align-items: center
135 | display: grid
136 | grid-template-columns: 40% 60%
137 | height: 5%
138 | slots:
139 | default:
140 | - component: oh-image
141 | config:
142 | height: 14
143 | style:
144 | align-self: center
145 | place-self: end
146 | url: ='/static/icons/' + props.iconimage2 + '.png'
147 | width: 14
148 | - component: Label
149 | config:
150 | style:
151 | font-size: 16px
152 | grid-column: 2
153 | margin-left: 5px
154 | text: '=items[props.bedtempitem].state ? items[props.bedtempitem].state + " ℃" : "Name"'
155 | - component: f7-row
156 | config:
157 | style:
158 | align-items: center
159 | display: grid
160 | grid-template-columns: 40% 60%
161 | height: 5%
162 | slots:
163 | default:
164 | - component: oh-image
165 | config:
166 | height: 14
167 | style:
168 | align-self: center
169 | place-self: end
170 | url: ='/static/icons/' + props.iconimage1 + '.png'
171 | width: 14
172 | - component: Label
173 | config:
174 | style:
175 | font-size: 16px
176 | grid-column: 2
177 | margin-left: 5px
178 | text: '=items[props.hotendtempitem].state ? items[props.hotendtempitem].state + " ℃" : "Name"'
179 | - component: f7-row
180 | config:
181 | style:
182 | align-items: center
183 | display: grid
184 | grid-template-columns: 40% 60%
185 | height: 5%
186 | slots:
187 | default:
188 | - component: oh-image
189 | config:
190 | height: 14
191 | style:
192 | align-self: center
193 | place-self: end
194 | url: https://iconsplace.com/wp-content/uploads/_icons/ffffff/256/png/time-icon-18-256.png
195 | width: 14
196 | - component: Label
197 | config:
198 | style:
199 | font-size: 16px
200 | grid-column: 2
201 | margin-left: 5px
202 | text: '=items[props.timeleftitem].state == "NULL" ? "not printing" : Math.floor(items[props.timeleftitem].state /3600)+":"+ Math.floor(items[props.timeleftitem].state / 60) + " h"'
203 | - component: f7-row
204 | config:
205 | style:
206 | align-items: center
207 | display: grid
208 | grid-template-columns: 30% 30% 30%
209 | height: 20%
210 | justify-items: center
211 | slots:
212 | default:
213 | - component: oh-button
214 | config:
215 | action: toggle
216 | actionCommand: ON
217 | actionCommandAlt: OFF
218 | actionItem: =props.poweritem
219 | color: '=items[props.poweritem].state === "ON" ? "green": "red"'
220 | height: 40px
221 | iconF7: power
222 | iconSize: 25px
223 | - component: f7-gauge
224 | config:
225 | border-color: "#005eff"
226 | style:
227 | width: 110px
228 | type: semicircle
229 | value: '=props.progressitem ? (items[props.progressitem].state == "NULL" ? 0 : Math.floor(items[props.progressitem].state / 100)) : 0'
230 | value-text: '=props.progressitem ? (items[props.progressitem].state == "NULL" ? "0 %" : items[props.progressitem].state + " %") : "0"'
231 | value-text-color: "#005eff"
232 | visible: true
233 | - component: oh-button
234 | config:
235 | action: toggle
236 | actionCommand: ON
237 | actionCommandAlt: OFF
238 | actionItem: =props.lightitem
239 | color: '=items[props.lightitem].state === "ON" ? "yellow": "white"'
240 | height: 40px
241 | iconF7: lightbulb
242 | iconSize: 25px
243 | - component: f7-row
244 | config:
245 | style:
246 | align-items: center
247 | display: grid
248 | grid-template-columns: 100%
249 | height: 40%
250 | justify-items: center
251 | slots:
252 | default:
253 | - component: oh-image
254 | config:
255 | height: 200
256 | url: '=props.urllivestream ? props.urllivestream : "https://www.flaticon.com/svg/vstatic/svg/3964/3964391.svg?token=exp=1614265385~hmac=9a01747702e3f44a515d0d898b3f13fc"'
257 | width: 290
258 | - component: f7-progressbar
259 | config:
260 | color: '=items[props.timeleftitem].state > 0 ? "multi" : "red"'
261 | infinite: "=items[props.timeleftitem].state > 0 ? true : false"
262 | style:
263 | border-top-left-radius: 100px 25px
264 | border-top-right-radius: 100px 25px
265 | height: 5px
266 | left: 0
267 | margin: auto
268 | position: absolute
269 | right: 0
270 | width: 95%
271 |
--------------------------------------------------------------------------------
/Widgets/Card_Room_Popup+Motion.yaml:
--------------------------------------------------------------------------------
1 | uid: Card_Room_Popup+Motion
2 | tags:
3 | - motion
4 | props:
5 | parameters:
6 | - label: Header
7 | name: text_header
8 | required: false
9 | type: TEXT
10 | - description: icon name without ".png", located in static/icons/ folder
11 | label: Icon
12 | name: iconimage
13 | required: false
14 | type: TEXT
15 | - description: HEX or rgba
16 | label: Backgroundcolor
17 | name: bgcolor
18 | required: false
19 | type: TEXT
20 | - description: Page which will be opened as popup
21 | label: Page ID
22 | name: page
23 | required: false
24 | - context: item
25 | description: select group for status lights
26 | label: Item
27 | name: status
28 | required: false
29 | type: TEXT
30 | - context: item
31 | description: select item for heating
32 | label: Item
33 | name: heating
34 | required: false
35 | type: TEXT
36 | - context: item
37 | description: select item for temperature
38 | label: Item
39 | name: temp
40 | required: false
41 | type: TEXT
42 | - context: item
43 | description: select item for set temperature
44 | label: Item
45 | name: settemp
46 | required: false
47 | type: TEXT
48 | - context: item
49 | description: select item for humidity
50 | label: Item
51 | name: humidity
52 | required: false
53 | type: TEXT
54 | - context: item
55 | description: select item for illuminance
56 | label: Item
57 | name: illuminance
58 | required: false
59 | type: TEXT
60 | - context: item
61 | description: select item for motion state(s)
62 | label: Item
63 | name: motion
64 | required: false
65 | type: TEXT
66 | - context: item
67 | description: select item for door lock(s)
68 | label: Item
69 | name: door_lock
70 | required: false
71 | type: TEXT
72 | - context: item
73 | description: select item for blinds group (SUM)
74 | label: Item
75 | name: blinds_closed
76 | required: false
77 | type: TEXT
78 | - context: item
79 | description: select item for speaker(s)
80 | label: Item
81 | name: speakers
82 | required: false
83 | type: TEXT
84 | - context: item
85 | description: select item for windows(s)
86 | label: Item
87 | name: windows
88 | required: false
89 | type: TEXT
90 | - context: item
91 | description: select item for numbers of windows
92 | label: Item
93 | name: windows_numbers
94 | required: false
95 | type: TEXT
96 | - context: item
97 | description: select item for boiler temp
98 | label: Item
99 | name: boiler_temp
100 | required: false
101 | type: TEXT
102 | timestamp: Nov 27, 2021, 4:19:42 PM
103 | component: f7-card
104 | config:
105 | style:
106 | background-color: "=props.bgcolor ? props.bgcolor : ''"
107 | border-radius: var(--f7-card-expandable-border-radius)
108 | box-shadow: '=(items[props.status].state === "ON") ? "3px 3px 10px 0px rgba(255,255,255,255)" : "var(--f7-card-expandable-box-shadow)"'
109 | class:
110 | - padding: 0px
111 | height: 125px
112 | margin-left: 5px
113 | margin-right: 5px
114 | noShadow: false
115 | slots:
116 | content:
117 | - component: f7-block
118 | config:
119 | style:
120 | left: 50px
121 | position: absolute
122 | top: -5px
123 | slots:
124 | default:
125 | - component: Label
126 | config:
127 | style:
128 | font-size: 17px
129 | font-weight: 600
130 | margin-left: 0px
131 | margin-top: 0px
132 | text: "=props.text_header ? props.text_header : 'Set Props'"
133 | - component: f7-block
134 | config:
135 | style:
136 | bottom: -37px
137 | left: 16px
138 | position: absolute
139 | slots:
140 | default:
141 | - component: f7-chip
142 | config:
143 | iconColor: "=themeOptions.dark === 'dark' ? 'white' : 'black'"
144 | iconF7: "=(items[props.status].state === 'ON') ? 'lightbulb' : 'lightbulb_slash'"
145 | iconSize: 18
146 | style:
147 | --f7-chip-bg-color: rgba(255, 255, 255, 0)
148 | text: "=(items[props.status].state === 'ON') ? items[props.status].state : ''"
149 | visible: "=props.status ? true : false"
150 | - component: f7-chip
151 | config:
152 | iconColor: "=themeOptions.dark === 'dark' ? 'white' : 'black'"
153 | iconF7: flame
154 | iconSize: 18
155 | style:
156 | --f7-chip-bg-color: rgba(255, 255, 255, 0)
157 | text: "=items[props.heating].state === 'ON' ? '' : ''"
158 | visible: =items[props.heating].state === 'ON'
159 | - component: f7-chip
160 | config:
161 | style:
162 | --f7-chip-bg-color: rgba(255, 255, 255, 0)
163 | text: "=items[props.motion].state === 'ON' ? '' : ''"
164 | visible: "=props.motion ? true : false"
165 | slots:
166 | media:
167 | - component: oh-icon
168 | config:
169 | icon: "=items[props.motion].state === 'ON' ? 'motion' : ''"
170 | style:
171 | filter: "='brightness(' + (themeOptions.dark === 'dark' ? '1' : '0.4') + ')'"
172 | height: 18px
173 | - component: f7-chip
174 | config:
175 | style:
176 | --f7-chip-bg-color: rgba(255, 255, 255, 0)
177 | text: "=items[props.windows_numbers].state > 0 ? items[props.windows_numbers].state : ''"
178 | visible: "=items[props.windows].state === 'OPEN' ? true : false"
179 | slots:
180 | media:
181 | - component: oh-icon
182 | config:
183 | icon: window-open
184 | style:
185 | filter: "='brightness(' + (themeOptions.dark === 'dark' ? '1' : '0.4') + ')'"
186 | height: 18px
187 | - component: f7-chip
188 | config:
189 | iconColor: "=themeOptions.dark === 'dark' ? 'white' : 'black'"
190 | iconF7: "=items[props.door_lock].state === 'ON' ? 'lock_open' : 'lock'"
191 | iconSize: 18
192 | style:
193 | --f7-chip-bg-color: rgba(255, 255, 255, 0)
194 | text: "=items[props.door_lock].state === 'ON' ? '' : ''"
195 | visible: "=props.door_lock ? true : false"
196 | - component: f7-chip
197 | config:
198 | style:
199 | --f7-chip-bg-color: rgba(255, 255, 255, 0)
200 | text: "=(Number(items[props.blinds_closed].state) === 0) ? '' : Math.floor(items[props.blinds_closed].state) + '%'"
201 | visible: "=(Number(Math.floor(items[props.blinds_closed].state)) > 0) ? true : false"
202 | slots:
203 | media:
204 | - component: oh-icon
205 | config:
206 | icon: "=(Number(items[props.blinds_closed].state) === 0) ? 'cinemascreen-30' : 'cinemascreen-100'"
207 | style:
208 | filter: "='brightness(' + (themeOptions.dark === 'dark' ? '100' : '0.3') + ')'"
209 | height: 18px
210 | - component: f7-chip
211 | config:
212 | iconColor: "=themeOptions.dark === 'dark' ? 'white' : 'black'"
213 | iconF7: "=items[props.speakers].state === 'PLAY' ? 'speaker_2' : 'speaker'"
214 | iconSize: 18
215 | style:
216 | --f7-chip-bg-color: rgba(255, 255, 255, 0)
217 | visible: "=items[props.speakers].state === 'PLAY' ? true : false"
218 | - component: f7-chip
219 | config:
220 | iconColor: "=themeOptions.dark === 'dark' ? 'white' : 'black'"
221 | iconF7: sun_min
222 | iconSize: 18
223 | style:
224 | --f7-chip-bg-color: rgba(255, 255, 255, 0)
225 | text: =items[props.illuminance].displayState
226 | visible: "=props.illuminance ? true : false"
227 | - component: f7-block
228 | config:
229 | style:
230 | bottom: -65px
231 | left: 16px
232 | position: absolute
233 | slots:
234 | default:
235 | - component: f7-chip
236 | config:
237 | iconColor: "=themeOptions.dark === 'dark' ? 'white' : 'black'"
238 | iconF7: thermometer
239 | iconSize: 18
240 | style:
241 | --f7-chip-bg-color: rgba(255, 255, 255, 0)
242 | text: "=(items[props.temp].displayState ? items[props.temp].displayState : items[props.temp].state) + (props.settemp ? ' (' + items[props.settemp].state + ')' : '')"
243 | visible: "=props.temp ? true : false"
244 | - component: f7-chip
245 | config:
246 | iconColor: "=themeOptions.dark === 'dark' ? 'white' : 'black'"
247 | iconF7: drop
248 | iconSize: 18
249 | style:
250 | --f7-chip-bg-color: rgba(255, 255, 255, 0)
251 | text: =items[props.humidity].displayState
252 | visible: "=props.humidity ? true : false"
253 | - component: f7-chip
254 | config:
255 | style:
256 | --f7-chip-bg-color: rgba(255, 255, 255, 0)
257 | text: =items[props.boiler_temp].state
258 | visible: "=props.boiler_temp ? true : false"
259 | slots:
260 | media:
261 | - component: oh-icon
262 | config:
263 | icon: waterheater2
264 | style:
265 | filter: "='invert(' + (themeOptions.dark === 'dark' ? '1' : '0') + ')'"
266 | height: 18px
267 | - component: oh-image
268 | config:
269 | style:
270 | height: 25px
271 | left: 16px
272 | opacity: 0.7
273 | position: absolute
274 | top: 10px
275 | url: ='/static/icons/' + props.iconimage + '.png'
276 | visible: "=props.iconimage ? true : false"
277 | - component: oh-link
278 | config:
279 | action: popup
280 | actionModal: ='page:' + props.page
281 | style:
282 | height: 110px
283 | left: 0px
284 | position: absolute
285 | top: 0px
286 | width: 100%
287 |
--------------------------------------------------------------------------------
/Widgets/Cell_Card_1.yaml:
--------------------------------------------------------------------------------
1 | uid: Cell_Card_1
2 | tags: []
3 | props:
4 | parameters:
5 | - description: Small title on top of the card
6 | label: Title
7 | name: title
8 | required: false
9 | type: TEXT
10 | - description: Header big sized
11 | label: Header
12 | name: header
13 | required: false
14 | type: TEXT
15 | - description: Icon on top of the card (only f7 icons (without f7:))
16 | label: Icon
17 | name: icon
18 | required: false
19 | type: TEXT
20 | - description: rgba or HEX
21 | label: Background Color
22 | name: bgcolor
23 | required: false
24 | type: TEXT
25 | - context: item
26 | description: Item to control
27 | label: Item
28 | name: item
29 | required: false
30 | type: TEXT
31 | - label: Command to send
32 | name: command
33 | required: false
34 | type: TEXT
35 | parameterGroups: []
36 | timestamp: Nov 27, 2021, 4:21:52 PM
37 | component: f7-card
38 | config:
39 | style:
40 | background-color: "=props.bgcolor ? props.bgcolor : ''"
41 | border-radius: var(--f7-card-expandable-border-radius)
42 | box-shadow: '=(items[props.item].state === "ON") ? "3px 3px 10px 0px rgba(255,255,255,255)" : "var(--f7-card-expandable-box-shadow)"'
43 | class:
44 | - padding: 0px
45 | height: 100px
46 | margin-left: 5px
47 | margin-right: 5px
48 | noShadow: false
49 | slots:
50 | content:
51 | - component: f7-block
52 | config:
53 | style:
54 | display: flex
55 | flex-direction: row
56 | left: 16px
57 | position: absolute
58 | top: -5px
59 | slots:
60 | default:
61 | - component: f7-icon
62 | config:
63 | f7: =props.icon
64 | size: 18
65 | style:
66 | margin-right: 10px
67 | visible: "=props.icon ? true : false"
68 | - component: Label
69 | config:
70 | style:
71 | font-size: 12px
72 | margin-top: 0px
73 | text: "=props.title ? props.title : ''"
74 | - component: f7-block
75 | config:
76 | style:
77 | bottom: -15px
78 | flex-direction: row
79 | left: 16px
80 | position: absolute
81 | slots:
82 | default:
83 | - component: Label
84 | config:
85 | style:
86 | font-size: 17px
87 | font-weight: 600
88 | margin-left: 0px
89 | margin-top: 0px
90 | text: "=props.header ? props.header : 'Set Props'"
91 | - component: oh-link
92 | config:
93 | action: command
94 | actionCommand: =props.command
95 | actionFeedback: Done!
96 | actionItem: =props.item
97 | style:
98 | actionPosition: center
99 | height: 100px
100 | left: 0
101 | position: absolute
102 | top: 0
103 | width: 100%
104 |
--------------------------------------------------------------------------------
/Widgets/Cell_Light_Card_1.yaml:
--------------------------------------------------------------------------------
1 | uid: Cell_Light_Card_1
2 | tags:
3 | - Schalter&Schieberegler
4 | props:
5 | parameters:
6 | - description: Small title on top of the card
7 | label: Title
8 | name: title
9 | required: false
10 | type: TEXT
11 | - description: Header big sized
12 | label: Header
13 | name: header
14 | required: false
15 | type: TEXT
16 | - description: Icon on top of the card (only f7 icons (without f7:))
17 | label: Icon
18 | name: icon
19 | required: false
20 | type: TEXT
21 | - description: rgba or HEX
22 | label: Background Color
23 | name: bgcolor
24 | required: false
25 | type: TEXT
26 | - context: item
27 | description: Item to control on/off
28 | label: Item
29 | name: item_schalter
30 | required: false
31 | type: TEXT
32 | - context: item
33 | description: Item to control brightness
34 | label: Item
35 | name: item_brightness
36 | required: false
37 | type: TEXT
38 | parameterGroups: []
39 | timestamp: Nov 25, 2021, 2:17:18 PM
40 | component: f7-card
41 | config:
42 | style:
43 | background-color: "=props.bgcolor ? props.bgcolor : ''"
44 | border-radius: var(--f7-card-expandable-border-radius)
45 | box-shadow: 5px 5px 10px 1px rgba(0,0,0,0.1)
46 | height: 120px
47 | margin-left: 5px
48 | margin-right: 5px
49 | noShadow: false
50 | padding: 0px
51 | slots:
52 | content:
53 | - component: f7-block
54 | config:
55 | style:
56 | display: flex
57 | flex-direction: row
58 | left: 16px
59 | position: absolute
60 | top: -5px
61 | slots:
62 | default:
63 | - component: f7-icon
64 | config:
65 | f7: =props.icon
66 | size: 18
67 | style:
68 | margin-right: 10px
69 | visible: "=props.icon ? true : false"
70 | - component: Label
71 | config:
72 | style:
73 | font-size: 12px
74 | margin-top: 0px
75 | text: "=props.title ? props.title : ''"
76 | - component: f7-block
77 | config:
78 | style:
79 | bottom: -15px
80 | flex-direction: row
81 | left: 16px
82 | position: absolute
83 | slots:
84 | default:
85 | - component: Label
86 | config:
87 | style:
88 | font-size: 17px
89 | font-weight: 600
90 | margin-left: 0px
91 | margin-top: 0px
92 | text: "=props.header ? props.header : 'Set Props'"
93 | - component: oh-slider
94 | config:
95 | item: =props.item_brightness
96 | max: 100
97 | min: 0
98 | style:
99 | --f7-range-bar-border-radius: 8px
100 | --f7-range-bar-size: 8px
101 | --f7-range-knob-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3)
102 | --f7-range-knob-size: 20px
103 | bottom: -75px
104 | left: 20px
105 | position: absolute
106 | width: calc(100% - 40px)
107 | - component: oh-toggle
108 | config:
109 | item: =props.item_schalter
110 | style:
111 | position: absolute
112 | right: 20px
113 | top: 15px
114 |
--------------------------------------------------------------------------------
/Widgets/Cell_Light_Color_Card_2.yaml:
--------------------------------------------------------------------------------
1 | uid: Cell_Light_Color_Card_2
2 | tags:
3 | - Schalter & Farbauswahl
4 | props:
5 | parameters:
6 | - description: Small title on top of the card
7 | label: Title
8 | name: title
9 | required: false
10 | type: TEXT
11 | - description: Header big sized
12 | label: Header
13 | name: header
14 | required: false
15 | type: TEXT
16 | - description: icon name without ".png", located in static/icons/ folder
17 | label: Icon
18 | name: iconimage
19 | required: false
20 | type: TEXT
21 | - description: rgba or HEX
22 | label: Background Color
23 | name: bgcolor
24 | required: false
25 | type: TEXT
26 | - context: item
27 | description: Item to control on/off
28 | label: Item ON OFF
29 | name: item_schalter
30 | required: false
31 | type: TEXT
32 | - context: item
33 | description: Item to control color
34 | label: Item light color
35 | name: item_color
36 | required: false
37 | type: TEXT
38 | parameterGroups: []
39 | timestamp: Nov 26, 2021, 2:02:48 PM
40 | component: f7-card
41 | config:
42 | style:
43 | background-color: "=props.bgcolor ? props.bgcolor : ''"
44 | border-radius: var(--f7-card-expandable-border-radius)
45 | box-shadow: 5px 5px 10px 1px rgba(0,0,0,0.1)
46 | height: 165px
47 | margin-left: 5px
48 | margin-right: 5px
49 | noShadow: false
50 | padding: 0px
51 | slots:
52 | default:
53 | - component: f7-card-content
54 | config:
55 | class:
56 | - display-flex
57 | - flex-direction-column
58 | - justify-content-flex-start
59 | - align-items-left
60 | style:
61 | --f7-color-picker-slider-knob-size: 20px
62 | --f7-color-picker-slider-size: 18px
63 | slots:
64 | default:
65 | - component: f7-row
66 | config:
67 | style:
68 | display: flex
69 | flex-direction: row
70 | left: 40px
71 | position: absolute
72 | top: 10px
73 | slots:
74 | default:
75 | - component: Label
76 | config:
77 | style:
78 | font-size: 12px
79 | margin-top: 0px
80 | text: "=props.title ? props.title : ''"
81 | - component: f7-block
82 | config:
83 | class:
84 | - no-padding
85 | style:
86 | flex-direction: row
87 | left: 10px
88 | position: absolute
89 | top: 40px
90 | slots:
91 | default:
92 | - component: Label
93 | config:
94 | style:
95 | font-size: 17px
96 | font-weight: 600
97 | margin-left: 0px
98 | margin-top: 0px
99 | text: "=props.header ? props.header : 'Set Props'"
100 | - component: f7-block
101 | config:
102 | class:
103 | - no-padding
104 | style:
105 | --f7-color-picker-slider-knob-size: 15px
106 | --f7-color-picker-slider-size: 8px
107 | --f7-range-bar-active-bg-color: transparent
108 | --f7-range-bar-bg-color: linear-gradient(to right, rgba(246,158,81,0.8), rgba(246,158,81,0))
109 | --f7-range-bar-border-radius: 10px
110 | --f7-range-bar-size: 12px
111 | --f7-range-knob-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3)
112 | --f7-range-knob-size: 20px
113 | --f7-range-label-text-color: black
114 | flex-direction: row
115 | left: 10px
116 | margin-top: 0px
117 | position: absolute
118 | top: 70px
119 | width: calc(100% - 100px)
120 | z-index: 99 !important
121 | slots:
122 | default:
123 | - component: oh-colorpicker
124 | config:
125 | color: red
126 | item: =props.item_color
127 | label: true
128 | modules:
129 | - hsb-sliders
130 | - component: oh-toggle
131 | config:
132 | item: =props.item_schalter
133 | style:
134 | position: absolute
135 | right: 90px
136 | top: 15px
137 | - component: oh-button
138 | config:
139 | action: command
140 | actionCommand: 0,100,100
141 | actionItem: =props.item_color
142 | iconColor: red
143 | iconF7: app_fill
144 | iconSize: 34
145 | style:
146 | background: transparent
147 | height: 35px
148 | position: absolute
149 | right: 35px
150 | top: 10px
151 | - component: oh-button
152 | config:
153 | action: command
154 | actionCommand: 15,100,100
155 | actionItem: =props.item_color
156 | iconColor: deeporange
157 | iconF7: app_fill
158 | iconSize: 34
159 | style:
160 | background: transparent
161 | height: 34px
162 | position: absolute
163 | right: 35px
164 | top: 45px
165 | - component: oh-button
166 | config:
167 | action: command
168 | actionCommand: 30,100,100
169 | actionItem: =props.item_color
170 | iconColor: orange
171 | iconF7: app_fill
172 | iconSize: 34
173 | style:
174 | background: transparent
175 | height: 35px
176 | position: absolute
177 | right: 35px
178 | top: 80px
179 | - component: oh-button
180 | config:
181 | action: command
182 | actionCommand: 60,100,100
183 | actionItem: =props.item_color
184 | iconColor: yellow
185 | iconF7: app_fill
186 | iconSize: 34
187 | style:
188 | background: transparent
189 | height: 35px
190 | position: absolute
191 | right: 35px
192 | top: 115px
193 | - component: oh-button
194 | config:
195 | action: command
196 | actionCommand: 300,100,100
197 | actionItem: =props.item_color
198 | iconColor: purple
199 | iconF7: app_fill
200 | iconSize: 34
201 | style:
202 | background: transparent
203 | height: 33px
204 | position: absolute
205 | right: 0px
206 | top: 10px
207 | - component: oh-button
208 | config:
209 | action: command
210 | actionCommand: 240,100,100
211 | actionItem: =props.item_color
212 | iconColor: blue
213 | iconF7: app_fill
214 | iconSize: 34
215 | style:
216 | background: transparent
217 | height: 33px
218 | position: absolute
219 | right: 0px
220 | top: 45px
221 | - component: oh-button
222 | config:
223 | action: command
224 | actionCommand: 180,100,100
225 | actionItem: =props.item_color
226 | iconColor: lightblue
227 | iconF7: app_fill
228 | iconSize: 34
229 | style:
230 | background: transparent
231 | height: 33px
232 | position: absolute
233 | right: 0px
234 | top: 80px
235 | - component: oh-button
236 | config:
237 | action: command
238 | actionCommand: 120,100,100
239 | actionItem: =props.item_color
240 | iconColor: green
241 | iconF7: app_fill
242 | iconSize: 34
243 | style:
244 | background: transparent
245 | height: 33px
246 | position: absolute
247 | right: 0px
248 | top: 115px
249 | - component: oh-image
250 | config:
251 | style:
252 | height: 25px
253 | left: 10px
254 | opacity: 0.7
255 | position: absolute
256 | top: 10px
257 | url: ='/static/icons/' + props.iconimage + '.png'
258 | visible: "=props.iconimage ? true : false"
259 |
--------------------------------------------------------------------------------
/Widgets/Cell_Settings_1.yaml:
--------------------------------------------------------------------------------
1 | uid: Cell_Settings_1
2 | tags: []
3 | props:
4 | parameters:
5 | - description: rgba or HEX
6 | label: Background Color
7 | name: bgcolor
8 | required: false
9 | type: TEXT
10 | - description: page which will be opened as popup
11 | label: Settingspage
12 | name: page
13 | required: false
14 | type: TEXT
15 | - context: item
16 | description: Item Group of Battery Critical
17 | label: Item Group
18 | name: item_battery
19 | required: false
20 | type: TEXT
21 | parameterGroups: []
22 | timestamp: Nov 27, 2021, 10:34:41 AM
23 | component: f7-card
24 | config:
25 | style:
26 | background-color: "=props.bgcolor ? props.bgcolor : ''"
27 | border-radius: var(--f7-card-expandable-border-radius)
28 | box-shadow: 5px 5px 10px 1px rgba(0,0,0,0.1)
29 | class:
30 | - padding: 0px
31 | height: 150px
32 | margin-left: 5px
33 | margin-right: 5px
34 | noShadow: false
35 | slots:
36 | content:
37 | - component: f7-block
38 | config:
39 | style:
40 | display: flex
41 | flex-direction: row
42 | left: 16px
43 | position: absolute
44 | top: -5px
45 | slots:
46 | default:
47 | - component: f7-chip
48 | config:
49 | iconColor: '=items[props.item_battery].state < 30 ? "red": "green"'
50 | iconF7: battery_25
51 | iconSize: 16
52 | style:
53 | --f7-chip-bg-color: rgba(255, 255, 255, 0)
54 | font-weight: 700
55 | text: =items[props.item_battery].state + '%'
56 | textColor: '=items[props.item_battery].state < 30 ? "red": "green"'
57 | visible: "=items[props.item_battery].state > 0 ? true : false"
58 | - component: f7-block
59 | config:
60 | class:
61 | - text-align-center
62 | style:
63 | left: 20px
64 | position: absolute
65 | top: 80px
66 | width: 100%
67 | slots:
68 | default:
69 | - component: f7-icon
70 | config:
71 | f7: battery_100
72 | size: 60
73 | style:
74 | margin-right: 10px
75 | margin-top: -10px
76 | opacity: 0.6
77 | - component: oh-link
78 | config:
79 | action: popup
80 | actionModal: ='page:' + props.page
81 | style:
82 | height: 150px
83 | left: 0px
84 | position: absolute
85 | top: 0px
86 | width: 100%
87 |
--------------------------------------------------------------------------------
/Widgets/Cell_Shutter_Card_1.yaml:
--------------------------------------------------------------------------------
1 | uid: Cell_Shutter_Card_1
2 | tags: []
3 | props:
4 | parameters:
5 | - description: Small title on top of the card
6 | label: Title
7 | name: title
8 | required: false
9 | type: TEXT
10 | - description: Header big sized
11 | label: Header
12 | name: header
13 | required: false
14 | type: TEXT
15 | - description: Icon on top of the card
16 | label: Icon
17 | name: icon
18 | required: false
19 | type: TEXT
20 | - description: HEX or rgba
21 | label: Background Color
22 | name: bgcolor
23 | required: false
24 | type: TEXT
25 | - context: item
26 | description: Shutter item to control
27 | label: Item
28 | name: item
29 | required: false
30 | type: TEXT
31 | parameterGroups: []
32 | timestamp: Nov 26, 2021, 7:58:14 PM
33 | component: f7-card
34 | config:
35 | style:
36 | background-color: "=props.bgcolor ? props.bgcolor : ''"
37 | border-radius: var(--f7-card-expandable-border-radius)
38 | box-shadow: 5px 5px 10px 1px rgba(0,0,0,0.1)
39 | height: 120px
40 | margin-left: 5px
41 | margin-right: 5px
42 | noShadow: false
43 | padding: 0px
44 | slots:
45 | content:
46 | - component: f7-block
47 | config:
48 | style:
49 | display: flex
50 | flex-direction: row
51 | left: 16px
52 | position: absolute
53 | top: -5px
54 | slots:
55 | default:
56 | - component: f7-icon
57 | config:
58 | f7: =props.icon
59 | size: 18
60 | style:
61 | margin-right: 10px
62 | visible: "=props.icon ? true : false"
63 | - component: Label
64 | config:
65 | style:
66 | font-size: 12px
67 | margin-top: 0px
68 | text: "=props.title ? props.title : ''"
69 | - component: f7-block
70 | config:
71 | style:
72 | bottom: -15px
73 | flex-direction: row
74 | left: 16px
75 | position: absolute
76 | slots:
77 | default:
78 | - component: Label
79 | config:
80 | style:
81 | font-size: 17px
82 | font-weight: 600
83 | margin-left: 0px
84 | margin-top: 0px
85 | text: "=props.header ? props.header : 'Set Props'"
86 | - component: f7-block
87 | config:
88 | style:
89 | bottom: -35px
90 | flex-direction: row
91 | left: 16px
92 | position: absolute
93 | slots:
94 | default:
95 | - component: Label
96 | config:
97 | style:
98 | font-size: 12px
99 | margin-left: 0px
100 | margin-top: 0px
101 | text: "=Number(items[props.item].state) === 0 ? 'Geöffnet ' + (items[props.item].state) + '%' : 'Geschlossen ' + (items[props.item].state) + '%'"
102 | - component: oh-button
103 | config:
104 | action: command
105 | actionCommand: UP
106 | actionItem: =props.item
107 | iconColor: red
108 | iconF7: arrow_up_circle
109 | iconSize: 35
110 | style:
111 | background: transparent
112 | height: 35px
113 | position: absolute
114 | right: 10px
115 | top: 12px
116 | - component: oh-button
117 | config:
118 | action: command
119 | actionCommand: STOP
120 | actionItem: =props.item
121 | iconColor: red
122 | iconF7: stop_circle
123 | iconSize: 29
124 | style:
125 | background: transparent
126 | height: 29px
127 | position: absolute
128 | right: 13px
129 | top: 46px
130 | - component: oh-button
131 | config:
132 | action: command
133 | actionCommand: DOWN
134 | actionItem: =props.item
135 | iconColor: red
136 | iconF7: arrow_down_circle
137 | iconSize: 35
138 | style:
139 | background: transparent
140 | height: 35px
141 | position: absolute
142 | right: 10px
143 | top: 74px
144 |
--------------------------------------------------------------------------------
/Widgets/Cell_Speaker_Card_1.yaml:
--------------------------------------------------------------------------------
1 | uid: Cell_Speaker_Card_1
2 | tags: []
3 | props:
4 | parameters:
5 | - description: Small title on top of the card
6 | label: Title
7 | name: title
8 | required: false
9 | type: TEXT
10 | - description: Header big sized
11 | label: Header
12 | name: header
13 | required: false
14 | type: TEXT
15 | - description: HEX or rgba
16 | label: Background Color
17 | name: bgcolor
18 | required: false
19 | type: TEXT
20 | - context: item
21 | description: Item to control
22 | label: Item
23 | name: item
24 | required: false
25 | type: TEXT
26 | - context: item
27 | description: Item for volume
28 | label: Item
29 | name: item_volume
30 | required: false
31 | type: TEXT
32 | - context: item
33 | description: Item for Coverbild
34 | label: Item
35 | name: item_cover
36 | required: false
37 | type: TEXT
38 | parameterGroups: []
39 | timestamp: Nov 24, 2021, 8:50:44 PM
40 | component: f7-card
41 | config:
42 | style:
43 | background-color: "=props.bgcolor ? props.bgcolor : ''"
44 | border-radius: var(--f7-card-expandable-border-radius)
45 | box-shadow: 5px 5px 10px 1px rgba(0,0,0,0.1)
46 | height: 120px
47 | margin-left: 5px
48 | margin-right: 5px
49 | noShadow: false
50 | padding: 0px
51 | slots:
52 | content:
53 | - component: f7-block
54 | config:
55 | style:
56 | display: flex
57 | flex-direction: row
58 | left: 16px
59 | position: absolute
60 | top: -5px
61 | slots:
62 | default:
63 | - component: f7-icon
64 | config:
65 | f7: "=items[props.item].state === 'PLAY' ? 'speaker_3' : 'speaker'"
66 | size: 18
67 | style:
68 | margin-right: 10px
69 | - component: Label
70 | config:
71 | style:
72 | font-size: 12px
73 | margin-top: 0px
74 | text: "=props.title ? props.title : ''"
75 | - component: f7-block
76 | config:
77 | style:
78 | bottom: -15px
79 | flex-direction: row
80 | left: 16px
81 | position: absolute
82 | slots:
83 | default:
84 | - component: Label
85 | config:
86 | style:
87 | font-size: 17px
88 | font-weight: 600
89 | margin-left: 0px
90 | margin-top: 0px
91 | text: "=props.header ? props.header : 'Set Props'"
92 | - null
93 | - component: oh-button
94 | config:
95 | action: command
96 | actionCommand: PLAY
97 | actionItem: =props.item
98 | iconColor: "=items[props.item].state === 'PAUSE' ? themeOptions.dark === 'dark' ? 'white' : 'black' : 'red' "
99 | iconF7: play_circle
100 | iconSize: 35
101 | style:
102 | background: transparent
103 | height: 35px
104 | position: absolute
105 | right: 10px
106 | top: 12px
107 | - component: oh-button
108 | config:
109 | action: command
110 | actionCommand: PAUSE
111 | actionItem: =props.item
112 | iconColor: "=items[props.item].state === 'PLAY' ? themeOptions.dark === 'dark' ? 'white' : 'black' : 'red'"
113 | iconF7: pause_circle
114 | iconSize: 35
115 | style:
116 | background: transparent
117 | height: 35px
118 | position: absolute
119 | right: 10px
120 | top: 74px
121 | - component: oh-slider
122 | config:
123 | item: =props.item_volume
124 | max: 100
125 | min: 0
126 | style:
127 | --f7-range-bar-border-radius: 8px
128 | --f7-range-bar-size: 8px
129 | --f7-range-knob-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3)
130 | --f7-range-knob-size: 20px
131 | bottom: -75px
132 | left: 20px
133 | position: absolute
134 | width: calc(100% - 205px)
135 | - component: oh-image
136 | config:
137 | item: =props.item_cover
138 | style:
139 | bottom: -78px
140 | height: 100px
141 | position: absolute
142 | right: 70px
143 |
--------------------------------------------------------------------------------
/Widgets/Cell_Temp_Card_1.yaml:
--------------------------------------------------------------------------------
1 | uid: Cell_Temp_Card_1
2 | tags:
3 | - heatmode
4 | - humidity
5 | - set temp
6 | - temperature
7 | props:
8 | parameters:
9 | - description: Small title on top of the card
10 | label: Title
11 | name: title
12 | required: false
13 | type: TEXT
14 | - description: Icon on top of the card (only f7 icons (without f7:))
15 | label: Icon
16 | name: icon
17 | required: false
18 | type: TEXT
19 | - description: in rgba() or HEX or empty
20 | label: Background Color
21 | name: bgcolor
22 | required: false
23 | type: TEXT
24 | - context: item
25 | label: Current Temperature
26 | name: temp_item
27 | required: false
28 | type: TEXT
29 | - context: item
30 | label: Set Temperature
31 | name: set_temp_item
32 | required: false
33 | type: TEXT
34 | - context: item
35 | label: Current Humidity
36 | name: humidity_item
37 | required: false
38 | type: TEXT
39 | - context: item
40 | description: on/off item
41 | label: Heating control item
42 | name: heating_item
43 | required: false
44 | type: TEXT
45 | parameterGroups: []
46 | timestamp: Nov 25, 2021, 2:21:35 PM
47 | component: f7-card
48 | config:
49 | style:
50 | background-color: "=props.bgcolor ? props.bgcolor : ''"
51 | border-radius: var(--f7-card-expandable-border-radius)
52 | box-shadow: 5px 5px 10px 1px rgba(0,0,0,0.1)
53 | height: 120px
54 | margin-left: 5px
55 | margin-right: 5px
56 | noShadow: false
57 | padding: 0px
58 | slots:
59 | content:
60 | - component: f7-block
61 | config:
62 | style:
63 | display: flex
64 | flex-direction: row
65 | left: 16px
66 | position: absolute
67 | top: -5px
68 | slots:
69 | default:
70 | - component: f7-icon
71 | config:
72 | f7: =props.icon
73 | size: 18
74 | style:
75 | margin-right: 10px
76 | visible: "=props.icon ? true : false"
77 | - component: Label
78 | config:
79 | style:
80 | font-size: 12px
81 | margin-top: 0px
82 | text: "=props.title ? props.title : ''"
83 | - component: f7-block
84 | config:
85 | style:
86 | bottom: -20px
87 | flex-direction: row
88 | left: 16px
89 | position: absolute
90 | slots:
91 | default:
92 | - component: Label
93 | config:
94 | style:
95 | font-size: 22px
96 | font-weight: 400
97 | margin-left: 0px
98 | margin-top: 0px
99 | text: "=items[props.temp_item].displayState ? items[props.temp_item].displayState : items[props.temp_item].state"
100 | - component: f7-block
101 | config:
102 | style:
103 | bottom: -40px
104 | display: flex
105 | flex-direction: row
106 | left: 12px
107 | position: absolute
108 | slots:
109 | default:
110 | - component: f7-icon
111 | config:
112 | f7: drop
113 | size: 18
114 | visible: "=props.humidity_item ? true : false"
115 | - component: Label
116 | config:
117 | style:
118 | font-size: 12px
119 | margin-left: 5px
120 | margin-top: 0px
121 | text: =items[props.humidity_item].displayState
122 | visible: "=props.humidity_item ? true : false"
123 | - component: f7-block
124 | config:
125 | style:
126 | bottom: -63px
127 | display: flex
128 | flex-direction: row
129 | left: 12px
130 | position: absolute
131 | slots:
132 | default:
133 | - component: f7-icon
134 | config:
135 | f7: flame
136 | size: 18
137 | visible: "=props.heating_item ? true : false"
138 | - component: Label
139 | config:
140 | style:
141 | font-size: 12px
142 | margin-left: 5px
143 | margin-top: 0px
144 | text: =items[props.heating_item].state
145 | visible: "=props.heating_item ? true : false"
146 | - component: oh-button
147 | config:
148 | action: command
149 | actionCommand: =Number(items[props.set_temp_item].state.split(' ')[0]) + 0.5
150 | actionItem: =props.set_temp_item
151 | iconColor: red
152 | iconF7: arrow_up_circle
153 | iconSize: 35
154 | style:
155 | background: transparent
156 | height: 35px
157 | position: absolute
158 | right: 10px
159 | top: 12px
160 | visible: "=props.set_temp_item ? true : false"
161 | - component: oh-button
162 | config:
163 | action: command
164 | actionCommand: =Number(items[props.set_temp_item].state.split(' ')[0]) - 0.5
165 | actionItem: =props.set_temp_item
166 | iconColor: red
167 | iconF7: arrow_down_circle
168 | iconSize: 35
169 | style:
170 | background: transparent
171 | height: 35px
172 | position: absolute
173 | right: 10px
174 | top: 74px
175 | visible: "=props.set_temp_item ? true : false"
176 | - component: Label
177 | config:
178 | style:
179 | font-size: 12px
180 | position: absolute
181 | right: 15px
182 | top: 50px
183 | text: =items[props.set_temp_item].state
184 | visible: "=props.set_temp_item ? true : false"
185 | - component: f7-block
186 | config:
187 | style:
188 | height: 120px
189 | left: 15px
190 | position: absolute
191 | top: 15px
192 | width: "=props.set_temp_item ? 'calc(100% - 55px)' : '100%' "
193 | slots:
194 | default:
195 | - component: oh-trend
196 | config:
197 | style:
198 | --f7-theme-color-bg-color: transparent
199 | background: var(--f7-theme-color-bg-color)
200 | filter: opacity(30%)
201 | height: 100%
202 | left: 0px
203 | position: absolute
204 | top: 0px
205 | width: 100%
206 | z-index: 1
207 | trendGradient:
208 | - "#aa2b1d"
209 | - "#cc561e"
210 | - "#ef8d32"
211 | - "#beca5c"
212 | trendItem: =props.temp_item
213 | - component: oh-link
214 | config:
215 | action: analyzer
216 | actionAnalyzerChartType: day
217 | actionAnalyzerCoordSystem: time
218 | actionAnalyzerItems: "=props.set_temp_item ? [props.temp_item, props.humidity_item, props.set_temp_item, props.heating_item] : (props.humidity_item ? [props.temp_item, props.humidity_item] : [props.temp_item])"
219 | style:
220 | height: 120px
221 | left: 0px
222 | position: absolute
223 | top: 0px
224 | width: "=props.set_temp_item ? 'calc(100% - 55px)' : '100%' "
225 |
--------------------------------------------------------------------------------
/Widgets/Cell_Temp_Card_2.yaml:
--------------------------------------------------------------------------------
1 | uid: Cell_Temp_Card_2
2 | tags:
3 | - co
4 | - humidity
5 | - motion
6 | - temperature
7 | props:
8 | parameters:
9 | - description: Small title on top of the card
10 | label: Title
11 | name: title
12 | required: false
13 | type: TEXT
14 | - description: Icon on top of the card (only f7 icons (without f7:))
15 | label: Icon
16 | name: icon
17 | required: false
18 | type: TEXT
19 | - description: Background image name
20 | label: Background image
21 | name: bg_image_url
22 | required: false
23 | type: TEXT
24 | - description: in rgba() or HEX or empty
25 | label: Background Color
26 | name: bgcolor
27 | required: false
28 | type: TEXT
29 | - context: item
30 | label: Temperature
31 | name: temp_item
32 | required: false
33 | type: TEXT
34 | - context: item
35 | label: Lightlevel
36 | name: lightlevel_item
37 | required: false
38 | type: TEXT
39 | - context: item
40 | label: Humidity
41 | name: humidity_item
42 | required: false
43 | type: TEXT
44 | - context: item
45 | label: CO
46 | name: CO_item
47 | required: false
48 | type: TEXT
49 | - context: item
50 | label: Motion item
51 | name: motion_item
52 | required: false
53 | type: TEXT
54 | parameterGroups: []
55 | timestamp: Nov 24, 2021, 11:09:45 PM
56 | component: f7-card
57 | config:
58 | style:
59 | background-brightness: 60%
60 | background-color: "=props.bgcolor ? props.bgcolor : ''"
61 | background-image: "=props.bg_image_url ? 'url(/static/' + (props.bg_image_url) + ')' : ''"
62 | background-position: down;
63 | background-repeat: no-repeat;
64 | background-size: cover
65 | border-radius: var(--f7-card-expandable-border-radius)
66 | box-shadow: 5px 5px 10px 1px rgba(0,0,0,0.1)
67 | font-size: medium
68 | height: 150px
69 | margin: 5
70 | noShadow: false
71 | padding: 0
72 | text-shadow: -1px -1px 0 black, 1px -1px 0 black, -1px 1px 0 black, 1px 1px 0 black
73 | slots:
74 | content:
75 | - component: f7-card-header
76 | config:
77 | style:
78 | justify-content: flex-start
79 | margin-top: -15px
80 | min-height: 30px
81 | padding: 0
82 | slots:
83 | default:
84 | - component: f7-icon
85 | config:
86 | f7: =props.icon
87 | size: 20
88 | visible: "=props.icon ? true : false"
89 | - component: Label
90 | config:
91 | style:
92 | font-size: 18px
93 | margin-left: 5px
94 | text: "=props.title ? props.title : ''"
95 | - component: f7-card-content
96 | config:
97 | style:
98 | justify-content: flex-start
99 | margin-top: 5px
100 | padding: 0
101 | width: 100%
102 | slots:
103 | default:
104 | - component: f7-row
105 | config:
106 | style:
107 | justify-content: flex-start
108 | visible: "=props.temp_item ? true : false"
109 | slots:
110 | default:
111 | - component: oh-icon
112 | config:
113 | icon: temperature
114 | item: =props.temp_item
115 | width: 23
116 | - component: Label
117 | config:
118 | style:
119 | color: '=(Number.parseFloat(items[props.temp_item].state.split(" ")[0]) > 30) ? "red" : (Number.parseFloat(items[props.temp_item].state.split(" ")[0]) < 10) ? "blue" : "white"'
120 | margin-left: 5px
121 | text: =items[props.temp_item].state
122 | - component: f7-row
123 | config:
124 | style:
125 | justify-content: flex-start
126 | z-index: 2
127 | visible: "=props.humidity_item ? true : false"
128 | slots:
129 | default:
130 | - component: oh-icon
131 | config:
132 | action: analyser
133 | actionAnalyzerItems: =props.humidity_item
134 | icon: humidity
135 | item: =props.humidity_item
136 | width: 23
137 | - component: Label
138 | config:
139 | style:
140 | color: '=(Number.parseFloat(items[props.humidity_item].state.split(" ")[0]) < 35) ? "red" : (Number.parseFloat(items[props.humidity_item].state.split(" ")[0]) > 75) ? "green" : "white"'
141 | margin-left: 5px
142 | text: =items[props.humidity_item].state
143 | - component: f7-row
144 | config:
145 | style:
146 | justify-content: flex-start
147 | z-index: 2
148 | visible: "=props.lightlevel_item ? true : false"
149 | slots:
150 | default:
151 | - component: oh-icon
152 | config:
153 | icon: sun
154 | width: 23
155 | - component: Label
156 | config:
157 | style:
158 | color: "=(items[props.lightlevel_item].state < 5) ? 'gray' : 'white'"
159 | margin-left: 5px
160 | text: =items[props.lightlevel_item].state
161 | - component: f7-row
162 | config:
163 | style:
164 | justify-content: flex-start
165 | z-index: 2
166 | visible: "=props.CO_item ? true : false"
167 | slots:
168 | default:
169 | - component: oh-icon
170 | config:
171 | icon: carbondioxide
172 | width: 23
173 | - component: Label
174 | config:
175 | style:
176 | color: '=(Number.parseFloat(items[props.CO_item].state.split(" ")[0]) > 1500) ? "red" : (Number.parseFloat(items[props.CO_item].state.split(" ")[0]) > 1000) ? "yellow"'
177 | margin-left: 5px
178 | text: =items[props.CO_item].state
179 | - component: f7-col
180 | config:
181 | style:
182 | position: absolute
183 | right: 0px
184 | top: 0px
185 | z-index: 2
186 | visible: "=props.motion_item ? true : false"
187 | slots:
188 | default:
189 | - component: oh-icon
190 | config:
191 | icon: "=(items[props.motion_item].state === 'ON') ? 'mymotion-on' : 'mymotion-off'"
192 | width: 30
193 | - component: Label
194 | config:
195 | text: =items[props.motion_item].state
196 | - component: f7-block
197 | config:
198 | style:
199 | height: 300px
200 | left: 10px
201 | position: absolute
202 | top: 10px
203 | visible: "=props.temp_item ? true : false"
204 | width: 100%
205 | z-index: 1
206 | slots:
207 | default:
208 | - component: oh-trend
209 | config:
210 | style:
211 | --f7-theme-color-bg-color: transparent
212 | background: var(--f7-theme-color-bg-color)
213 | filter: opacity(60%)
214 | trendGradient:
215 | - "#d4220f"
216 | - "#cc561e"
217 | - "#ef8d32"
218 | - "#beca5c"
219 | trendItem: =props.temp_item
220 | - component: oh-link
221 | config:
222 | action: analyzer
223 | actionAnalyzerChartType: day
224 | actionAnalyzerCoordSystem: time
225 | actionAnalyzerItems: "=props.CO_item ? [props.temp_item, props.humidity_item, props.lightlevel_item, props.CO_item] : (props.lightlevel_item ? [props.temp_item, props.humidity_item, props.lightlevel_item] : (props.humidity_item ? [props.temp_item, props.humidity_item] : [props.temp_item]))"
226 | style:
227 | height: 100%
228 | left: 0px
229 | padding: 0
230 | position: absolute
231 | top: 0px
232 | width: 100%
233 | z-index: 3
234 |
--------------------------------------------------------------------------------
/Widgets/Command_Button.yaml:
--------------------------------------------------------------------------------
1 | uid: Command_Button
2 | tags:
3 | - command button
4 | props:
5 | parameters:
6 | - description: Set the Headline for the first state
7 | label: Headline 1
8 | name: headline1
9 | required: false
10 | type: TEXT
11 | groupName: item1
12 | - label: Command 1
13 | name: command1
14 | required: true
15 | type: TEXT
16 | groupName: item1
17 | - label: Icon 1
18 | name: icon1
19 | required: false
20 | type: TEXT
21 | groupName: item1
22 | - label: Icon 1 Color
23 | name: iconcolor1
24 | required: false
25 | type: TEXT
26 | groupName: item1
27 | - description: Set the headline for the second state
28 | label: Headline 2
29 | name: headline2
30 | required: false
31 | type: TEXT
32 | groupName: item2
33 | - label: Command 2
34 | name: command2
35 | required: true
36 | type: TEXT
37 | groupName: item2
38 | - label: Icon 2
39 | name: icon2
40 | required: false
41 | type: TEXT
42 | groupName: item2
43 | - label: Icon 2 Color
44 | name: iconcolor2
45 | required: false
46 | type: TEXT
47 | groupName: item2
48 | - context: item
49 | description: Set the item to control here
50 | label: Item
51 | name: item
52 | required: false
53 | type: TEXT
54 | - label: Headline Color
55 | name: headlinecolor
56 | required: false
57 | type: TEXT
58 | groupName: styling
59 | - label: Headline Weight
60 | name: headlineweight
61 | required: false
62 | type: TEXT
63 | groupName: styling
64 | - label: Headline Size
65 | name: headlinesize
66 | required: false
67 | type: TEXT
68 | groupName: styling
69 | - label: Background
70 | name: background
71 | required: false
72 | type: TEXT
73 | groupName: styling
74 | - label: Card height
75 | name: cardheight
76 | required: false
77 | type: TEXT
78 | groupName: styling
79 | - label: Card width
80 | name: cardwidth
81 | required: false
82 | type: TEXT
83 | groupName: styling
84 | - label: Icon size
85 | name: iconsize
86 | required: false
87 | type: TEXT
88 | groupName: styling
89 | parameterGroups:
90 | - name: item1
91 | label: Status 1
92 | - name: item2
93 | label: Status 2
94 | - name: styling
95 | label: Styling
96 | timestamp: Nov 25, 2021, 2:26:54 PM
97 | component: f7-card
98 | config:
99 | style:
100 | background: '=(props.background) ? props.background : "linear-gradient(to bottom, #003366 0%, #00ffff 100%)"'
101 | border-radius: var(--f7-card-expandable-border-radius)
102 | box-shadow: '=(items[props.item].state === props.command2) ? (props.iconcolor2 ? "8px 8px 28px 1px " + props.iconcolor2 : "10px 10px 28px 1px rgba(255,234,5,0.3)") : "var(--f7-card-expandable-box-shadow)"'
103 | height: '=props.cardheight ? props.cardheight : "8.5em"'
104 | margin-left: auto;
105 | margin-right: auto;
106 | noShadow: false
107 | padding: 0px
108 | width: '=props.cardwidth ? props.cardwidth : "8.5em"'
109 | slots:
110 | default:
111 | - component: f7-block
112 | config:
113 | style:
114 | align-items: center
115 | display: grid
116 | grid-template-rows: 1fr auto auto 1fr
117 | height: 100%
118 | justify-items: center
119 | slots:
120 | default:
121 | - component: Label
122 | - component: Label
123 | config:
124 | style:
125 | color: '=(props.headlinecolor) ? props.headlinecolor : "white"'
126 | font-size: '=(props.headlinesize) ? props.headlinesize: "13px"'
127 | font-weight: '=(props.headlineweight) ? props.headlineweight : "normal"'
128 | padding: 3px
129 | text: '=(items[props.item].state === props.command1) ? ((props.headline1) ? props.headline1 : "Headline") : ((props.headline2) ? props.headline2 : "Headline")'
130 | - component: f7-icon
131 | config:
132 | f7: '=(items[props.item].state === props.command2) ? (props.icon2 ? props.icon2 : "lightbulb_fill") : (props.icon1 ? props.icon1 : "lightbulb")'
133 | size: '=props.iconsize ? props.iconsize: "65px"'
134 | style:
135 | color: '=(items[props.item].state === props.command2) ? (props.iconcolor2 ? props.iconcolor2 : "rgba(255,234,5,1)") : (props.iconcolor1 ? props.iconcolor1 : "")'
136 | padding: 3px
137 | - component: oh-link
138 | config:
139 | action: command
140 | actionCommand: "=(items[props.item].state === props.command1) ? props.command2 : props.command1"
141 | actionItem: =props.item
142 | style:
143 | actionPosition: center
144 | height: 100%
145 | left: 0
146 | position: absolute
147 | top: 0
148 | width: 100%
149 |
--------------------------------------------------------------------------------
/Widgets/Command_Button_Popup.yaml:
--------------------------------------------------------------------------------
1 | uid: Command_Button_Popup
2 | tags:
3 | - Popup
4 | props:
5 | parameters:
6 | - description: Set the Headline for the first state
7 | label: Headline 1
8 | name: headline1
9 | required: false
10 | type: TEXT
11 | groupName: item1
12 | - label: Command 1
13 | name: command1
14 | required: true
15 | type: TEXT
16 | groupName: item1
17 | - label: Icon 1
18 | name: icon1
19 | required: false
20 | type: TEXT
21 | groupName: item1
22 | - label: Icon 1 Color
23 | name: iconcolor1
24 | required: false
25 | type: TEXT
26 | groupName: item1
27 | - description: Set the headline for the second state
28 | label: Headline 2
29 | name: headline2
30 | required: false
31 | type: TEXT
32 | groupName: item2
33 | - label: Command 2
34 | name: command2
35 | required: true
36 | type: TEXT
37 | groupName: item2
38 | - label: Icon 2
39 | name: icon2
40 | required: false
41 | type: TEXT
42 | groupName: item2
43 | - label: Icon 2 Color
44 | name: iconcolor2
45 | required: false
46 | type: TEXT
47 | groupName: item2
48 | - context: item
49 | description: Set the item to control here
50 | label: Item
51 | name: item
52 | required: false
53 | type: TEXT
54 | - label: Headline Color
55 | name: headlinecolor
56 | required: false
57 | type: TEXT
58 | groupName: styling
59 | - label: Headline Weight
60 | name: headlineweight
61 | required: false
62 | type: TEXT
63 | groupName: styling
64 | - label: Headline Size
65 | name: headlinesize
66 | required: false
67 | type: TEXT
68 | groupName: styling
69 | - label: Background
70 | name: background
71 | required: false
72 | type: TEXT
73 | groupName: styling
74 | - label: Card height
75 | name: cardheight
76 | required: false
77 | type: TEXT
78 | groupName: styling
79 | - label: Card width
80 | name: cardwidth
81 | required: false
82 | type: TEXT
83 | groupName: styling
84 | - label: Icon size
85 | name: iconsize
86 | required: false
87 | type: TEXT
88 | groupName: styling
89 | - description: Page which will be opened as popup
90 | label: Page ID
91 | name: page
92 | required: false
93 | parameterGroups:
94 | - name: item1
95 | label: Status 1
96 | - name: item2
97 | label: Status 2
98 | - name: styling
99 | label: Styling
100 | timestamp: Nov 26, 2021, 3:01:02 PM
101 | component: f7-card
102 | config:
103 | style:
104 | background: '=(props.background) ? props.background : "linear-gradient(to bottom, #003366 0%, #00ffff 100%)"'
105 | border-radius: var(--f7-card-expandable-border-radius)
106 | box-shadow: '=(items[props.item].state === props.command2) ? (props.iconcolor2 ? "8px 8px 28px 1px " + props.iconcolor2 : "10px 10px 28px 1px rgba(255,234,5,0.3)") : "var(--f7-card-expandable-box-shadow)"'
107 | height: '=props.cardheight ? props.cardheight : "8.5em"'
108 | margin-left: auto;
109 | margin-right: auto;
110 | noShadow: false
111 | padding: 0px
112 | width: '=props.cardwidth ? props.cardwidth : "8.5em"'
113 | slots:
114 | default:
115 | - component: f7-block
116 | config:
117 | style:
118 | align-items: center
119 | display: grid
120 | grid-template-rows: 1fr auto auto 1fr
121 | height: 100%
122 | justify-items: center
123 | slots:
124 | default:
125 | - component: Label
126 | - component: Label
127 | config:
128 | style:
129 | color: '=(props.headlinecolor) ? props.headlinecolor : "white"'
130 | font-size: '=(props.headlinesize) ? props.headlinesize: "13px"'
131 | font-weight: '=(props.headlineweight) ? props.headlineweight : "normal"'
132 | padding: 3px
133 | text: '=(items[props.item].state === props.command1) ? ((props.headline1) ? props.headline1 : "Headline") : ((props.headline2) ? props.headline2 : "Headline")'
134 | - component: f7-icon
135 | config:
136 | f7: '=(items[props.item].state === props.command2) ? (props.icon2 ? props.icon2 : "lightbulb_fill") : (props.icon1 ? props.icon1 : "lightbulb")'
137 | size: '=props.iconsize ? props.iconsize: "65px"'
138 | style:
139 | color: '=(items[props.item].state === props.command2) ? (props.iconcolor2 ? props.iconcolor2 : "rgba(255,234,5,1)") : (props.iconcolor1 ? props.iconcolor1 : "")'
140 | padding: 3px
141 | - component: oh-link
142 | config:
143 | action: command
144 | actionCommand: "=(items[props.item].state === props.command1) ? props.command2 : props.command1"
145 | actionItem: =props.item
146 | style:
147 | actionPosition: center
148 | height: 100%
149 | left: 0
150 | position: absolute
151 | top: 0
152 | width: 100%
153 | - component: oh-link
154 | config:
155 | action: popup
156 | actionModal: ='page:' + props.page
157 | style:
158 | height: 30px
159 | left: 0px
160 | position: absolute
161 | top: 0px
162 | width: 100%
163 |
--------------------------------------------------------------------------------
/Widgets/Connection_Card_2.yaml:
--------------------------------------------------------------------------------
1 | uid: Connection_Card_2
2 | tags: []
3 | props:
4 | parameters:
5 | - label: Header
6 | name: text_header
7 | required: false
8 | type: TEXT
9 | - description: icon name without ".png", located in static/icons/ folder
10 | label: Icon
11 | name: iconimage
12 | required: false
13 | type: TEXT
14 | - description: HEX or rgba
15 | label: Backgroundcolor
16 | name: bgcolor
17 | required: false
18 | type: TEXT
19 | - description: Page which will be opened as popup
20 | label: Page ID
21 | name: page
22 | required: false
23 | - context: item
24 | description: select item for download
25 | label: Item
26 | name: download
27 | required: false
28 | type: TEXT
29 | - context: item
30 | description: select item for upload
31 | label: Item
32 | name: upload
33 | required: false
34 | type: TEXT
35 | - context: item
36 | description: select item for set latency
37 | label: Item
38 | name: latency
39 | required: false
40 | type: TEXT
41 | timestamp: Nov 27, 2021, 3:12:47 PM
42 | component: f7-card
43 | config:
44 | style:
45 | background-color: "=props.bgcolor ? props.bgcolor : ''"
46 | border-radius: var(--f7-card-expandable-border-radius)
47 | box-shadow: 5px 5px 10px 1px rgba(0,0,0,0.1)
48 | class:
49 | - padding: 0px
50 | height: 125px
51 | margin-left: 5px
52 | margin-right: 5px
53 | noShadow: false
54 | slots:
55 | content:
56 | - component: f7-block
57 | config:
58 | style:
59 | left: 50px
60 | position: absolute
61 | top: -5px
62 | slots:
63 | default:
64 | - component: Label
65 | config:
66 | style:
67 | font-size: 17px
68 | font-weight: 600
69 | margin-left: 0px
70 | margin-top: 0px
71 | text: "=props.text_header ? props.text_header : 'Set Props'"
72 | - component: f7-block
73 | config:
74 | style:
75 | bottom: -37px
76 | left: 16px
77 | position: absolute
78 | slots:
79 | default:
80 | - component: f7-chip
81 | config:
82 | iconColor: "=themeOptions.dark === 'dark' ? 'white' : 'black'"
83 | iconF7: "=(items[props.status].state === 'ON') ? 'lightbulb' : 'lightbulb_slash'"
84 | iconSize: 18
85 | style:
86 | --f7-chip-bg-color: rgba(255, 255, 255, 0)
87 | text: "=(items[props.status].state === 'ON') ? items[props.status].state : ''"
88 | visible: "=props.status ? true : false"
89 | - component: f7-chip
90 | config:
91 | iconColor: "=themeOptions.dark === 'dark' ? 'white' : 'black'"
92 | iconF7: flame
93 | iconSize: 18
94 | style:
95 | --f7-chip-bg-color: rgba(255, 255, 255, 0)
96 | text: "=items[props.heating].state === 'ON' ? '' : ''"
97 | visible: =items[props.heating].state === 'ON'
98 | - component: f7-chip
99 | config:
100 | style:
101 | --f7-chip-bg-color: rgba(255, 255, 255, 0)
102 | text: "=items[props.motion].state === 'ON' ? '' : ''"
103 | visible: "=props.motion ? true : false"
104 | slots:
105 | media:
106 | - component: oh-icon
107 | config:
108 | icon: "=items[props.motion].state === 'ON' ? 'motion' : ''"
109 | style:
110 | filter: "='brightness(' + (themeOptions.dark === 'dark' ? '1' : '0.4') + ')'"
111 | height: 18px
112 | - component: f7-chip
113 | config:
114 | style:
115 | --f7-chip-bg-color: rgba(255, 255, 255, 0)
116 | text: "=items[props.windows_numbers].state > 0 ? items[props.windows_numbers].state : ''"
117 | visible: "=items[props.windows].state === 'OPEN' ? true : false"
118 | slots:
119 | media:
120 | - component: oh-icon
121 | config:
122 | icon: window-open
123 | style:
124 | filter: "='brightness(' + (themeOptions.dark === 'dark' ? '1' : '0.4') + ')'"
125 | height: 18px
126 | - component: f7-chip
127 | config:
128 | iconColor: "=themeOptions.dark === 'dark' ? 'white' : 'black'"
129 | iconF7: "=items[props.door_lock].state === 'ON' ? 'lock_open' : 'lock'"
130 | iconSize: 18
131 | style:
132 | --f7-chip-bg-color: rgba(255, 255, 255, 0)
133 | text: "=items[props.door_lock].state === 'ON' ? '' : ''"
134 | visible: "=props.door_lock ? true : false"
135 | - component: f7-chip
136 | config:
137 | style:
138 | --f7-chip-bg-color: rgba(255, 255, 255, 0)
139 | text: "=(Number(items[props.blinds_closed].state) === 0) ? '' : Math.floor(items[props.blinds_closed].state) + '%'"
140 | visible: "=(Number(Math.floor(items[props.blinds_closed].state)) > 0) ? true : false"
141 | slots:
142 | media:
143 | - component: oh-icon
144 | config:
145 | icon: "=(Number(items[props.blinds_closed].state) === 0) ? 'cinemascreen-30' : 'cinemascreen-100'"
146 | style:
147 | filter: "='brightness(' + (themeOptions.dark === 'dark' ? '100' : '0.3') + ')'"
148 | height: 18px
149 | - component: f7-chip
150 | config:
151 | iconColor: "=themeOptions.dark === 'dark' ? 'white' : 'black'"
152 | iconF7: "=items[props.speakers].state === 'PLAY' ? 'speaker_2' : 'speaker'"
153 | iconSize: 18
154 | style:
155 | --f7-chip-bg-color: rgba(255, 255, 255, 0)
156 | visible: "=items[props.speakers].state === 'PLAY' ? true : false"
157 | - component: f7-chip
158 | config:
159 | iconColor: "=themeOptions.dark === 'dark' ? 'white' : 'black'"
160 | iconF7: sun_min
161 | iconSize: 18
162 | style:
163 | --f7-chip-bg-color: rgba(255, 255, 255, 0)
164 | text: =items[props.illuminance].displayState
165 | visible: "=props.illuminance ? true : false"
166 | - component: f7-block
167 | config:
168 | style:
169 | bottom: -65px
170 | left: 16px
171 | position: absolute
172 | slots:
173 | default:
174 | - component: f7-chip
175 | config:
176 | iconColor: "=themeOptions.dark === 'dark' ? 'white' : 'black'"
177 | iconF7: download_circle_fill
178 | iconSize: 18
179 | style:
180 | --f7-chip-bg-color: rgba(255, 255, 255, 0)
181 | text: "=(items[props.download].displayState ? items[props.download].displayState : items[props.download].state) "
182 | visible: "=props.download ? true : false"
183 | - component: f7-chip
184 | config:
185 | iconColor: "=themeOptions.dark === 'dark' ? 'white' : 'black'"
186 | iconF7: upload_circle_fill
187 | iconSize: 18
188 | style:
189 | --f7-chip-bg-color: rgba(255, 255, 255, 0)
190 | text: "=(items[props.upload].displayState ? items[props.upload].displayState : items[props.upload].state) "
191 | visible: "=props.upload ? true : false"
192 | - component: f7-chip
193 | config:
194 | iconColor: "=themeOptions.dark === 'dark' ? 'white' : 'black'"
195 | iconF7: timer_fill
196 | iconSize: 18
197 | style:
198 | --f7-chip-bg-color: rgba(255, 255, 255, 0)
199 | text: "=(items[props.latency].displayState ? items[props.latency].displayState : items[props.latency].state) "
200 | visible: "=props.latency ? true : false"
201 | - component: oh-image
202 | config:
203 | style:
204 | height: 25px
205 | left: 16px
206 | opacity: 0.7
207 | position: absolute
208 | top: 10px
209 | url: ='/static/icons/' + props.iconimage + '.png'
210 | visible: "=props.iconimage ? true : false"
211 | - component: oh-link
212 | config:
213 | action: popup
214 | actionModal: ='page:' + props.page
215 | style:
216 | height: 110px
217 | left: 0px
218 | position: absolute
219 | top: 0px
220 | width: 100%
221 |
--------------------------------------------------------------------------------
/Widgets/Connection_Card_3.yaml:
--------------------------------------------------------------------------------
1 | uid: Connection_Card_3
2 | tags: []
3 | props:
4 | parameters:
5 | - description: Set the height of the Widget
6 | label: Widget Height
7 | name: cardheight
8 | required: false
9 | type: TEXT
10 | - description: Headline
11 | label: Headline
12 | name: headline
13 | required: false
14 | type: TEXT
15 | groupName: secondpage
16 | - label: Item name 1
17 | name: itemname1
18 | required: false
19 | type: TEXT
20 | groupName: item1
21 | - context: item
22 | label: Item 1
23 | name: item1
24 | required: false
25 | type: TEXT
26 | groupName: item1
27 | - label: Item name 2
28 | name: itemname2
29 | required: false
30 | type: TEXT
31 | groupName: item2
32 | - context: item
33 | label: Item 2
34 | name: item2
35 | required: false
36 | type: TEXT
37 | groupName: item2
38 | - label: Item name 3
39 | name: itemname3
40 | required: false
41 | type: TEXT
42 | groupName: item3
43 | - context: item
44 | label: Item 3
45 | name: item3
46 | required: false
47 | type: TEXT
48 | groupName: item3
49 | - label: Item name 4
50 | name: itemname4
51 | required: false
52 | type: TEXT
53 | groupName: item4
54 | - context: item
55 | label: Item 4
56 | name: item4
57 | required: false
58 | type: TEXT
59 | groupName: item4
60 | - label: Item name 5
61 | name: itemname5
62 | required: false
63 | type: TEXT
64 | groupName: item5
65 | - context: item
66 | label: Item 5
67 | name: item5
68 | required: false
69 | type: TEXT
70 | groupName: item5
71 | - label: Item name 6
72 | name: itemname6
73 | required: false
74 | type: TEXT
75 | groupName: item6
76 | - context: item
77 | label: Item 6
78 | name: item6
79 | required: false
80 | type: TEXT
81 | groupName: item6
82 | - label: Item name 7
83 | name: itemname7
84 | required: false
85 | type: TEXT
86 | groupName: item7
87 | - context: item
88 | label: Item 7
89 | name: item7
90 | required: false
91 | type: TEXT
92 | groupName: item7
93 | - label: Item name 8
94 | name: itemname8
95 | required: false
96 | type: TEXT
97 | groupName: item8
98 | - context: item
99 | label: Item 8
100 | name: item8
101 | required: false
102 | type: TEXT
103 | groupName: item8
104 | - label: Item name 9
105 | name: itemname9
106 | required: false
107 | type: TEXT
108 | groupName: item9
109 | - context: item
110 | label: Item 9
111 | name: item9
112 | required: false
113 | type: TEXT
114 | groupName: item9
115 | parameterGroups:
116 | - name: secondpage
117 | label: Second Page
118 | - name: item1
119 | label: Item 1
120 | - name: item2
121 | label: Item 2
122 | - name: item3
123 | label: Item 3
124 | - name: item4
125 | label: Item 4
126 | - name: item5
127 | label: Item 5
128 | - name: item6
129 | label: Item 6
130 | - name: item7
131 | label: Item 7
132 | - name: item8
133 | label: Item 8
134 | - name: item9
135 | label: Item 9
136 | timestamp: Nov 27, 2021, 3:42:05 PM
137 | component: f7-card
138 | config:
139 | style:
140 | --weather-card-border-radius: 20px
141 | --weather-card-color: "=(!props.fontColor) ? '255,255,255' : props.fontColor"
142 | --weather-card-text-color: rgba(var(--weather-card-color),1)
143 | --weather-card-text-shadow-color: "=(!props.textShadowColor) ? '0,0,0' : props.textShadowColor"
144 | --weather-font-size-large: 26px
145 | --weather-font-size-normal: 18px
146 | --weather-font-size-small: 16px
147 | --weather-font-size-xlarge: 60px
148 | --weather-font-size-xsmall: 14px
149 | --weather-font-size-xxlarge: 70px
150 | --weather-font-size-xxsmall: 12px
151 | --weather-text-shadow-light: 2px 2px rgba(var(--weather-card-text-shadow-color),.15)
152 | --weather-text-shadow-strong: 2px 2px rgba(var(--weather-card-text-shadow-color),.35)
153 | --weather-text-transform-time: uppercase
154 | -moz-user-select: none
155 | -ms-user-select: none
156 | -webkit-user-select: none
157 | background: "#1c1c1d"
158 | border-radius: var(--weather-card-border-radius)
159 | color: var(--weather-card-text-color)
160 | height: =props.cardheight
161 | overflow: hidden
162 | user-select: none
163 | slots:
164 | default:
165 | - component: f7-block
166 | config:
167 | class:
168 | - no-padding
169 | - no-margin
170 | - align-items-space-between
171 | style:
172 | height: 100%
173 | left: 0
174 | position: absolute
175 | top: 0
176 | width: 100%
177 | slots:
178 | default:
179 | - component: f7-list
180 | config:
181 | style:
182 | height: 100%
183 | slots:
184 | default:
185 | - component: Label
186 | config:
187 | style:
188 | font-size: 25px
189 | height: 45px
190 | padding-top: 15px
191 | text-align: center
192 | text: '=props.headline ? props.headline : "Headline"'
193 | - component: f7-row
194 | config:
195 | style:
196 | margin-right: 15px
197 | slots:
198 | default:
199 | - component: f7-col
200 | config:
201 | style:
202 | width: 50%
203 | slots:
204 | default:
205 | - component: f7-list-item
206 | config:
207 | badge: '=props.item1 ? ((items[props.item1].state === "ON") ? "ON" : "OFF") : false'
208 | badgeColor: '=(items[props.item1].state === "ON") ? "green" : "red"'
209 | title: '=props.itemname1 ? props.itemname1 : (props.item1 ? props.item1 : "")'
210 | - component: f7-list-item
211 | config:
212 | badge: '=props.item2 ? ((items[props.item2].state === "ON") ? "ON" : "OFF") : false'
213 | badgeColor: '=(items[props.item2].state === "ON") ? "green" : "red"'
214 | title: '=props.itemname2 ? props.itemname2 : (props.item2 ? props.item2 : "")'
215 | - component: f7-list-item
216 | config:
217 | badge: '=props.itemname3 ? ((items[props.item3].state === "ON") ? "ON" : "OFF") : false'
218 | badgeColor: '=(items[props.item3].state === "ON") ? "green" : "red"'
219 | title: '=props.itemname3 ? props.itemname3 : (props.item3 ? props.item3 : "")'
220 | - component: f7-list-item
221 | config:
222 | badge: '=props.itemname4 ? ((items[props.item4].state === "ON") ? "ON" : "OFF") : false'
223 | badgeColor: '=(items[props.item4].state === "ON") ? "green" : "red"'
224 | title: '=props.itemname4 ? props.itemname4 : (props.item4 ? props.item4 : "")'
225 | - component: f7-col
226 | config:
227 | style:
228 | width: 50%
229 | slots:
230 | default:
231 | - component: f7-list-item
232 | config:
233 | badge: '=props.itemname5 ? ((items[props.item5].state === "ON") ? "ON" : "OFF") : false'
234 | badgeColor: '=(items[props.item5].state === "ON") ? "green" : "red"'
235 | title: '=props.itemname5 ? props.itemname5 : (props.item5 ? props.item5 : "")'
236 | - component: f7-list-item
237 | config:
238 | badge: '=props.itemname6 ? ((items[props.item6].state === "ON") ? "ON" : "OFF") : false'
239 | badgeColor: '=(items[props.item6].state === "ON") ? "green" : "red"'
240 | title: '=props.itemname6 ? props.itemname6 : (props.item6 ? props.item6 : "")'
241 | - component: f7-list-item
242 | config:
243 | badge: '=props.itemname7 ? ((items[props.item7].state === "ON") ? "ON" : "OFF") : false'
244 | badgeColor: '=(items[props.item7].state === "ON") ? "green" : "red"'
245 | title: '=props.itemname7 ? props.itemname7 : (props.item7 ? props.item7 : "")'
246 | - component: f7-list-item
247 | config:
248 | badge: '=props.itemname8 ? ((items[props.item8].state === "ON") ? "ON" : "OFF") : false'
249 | badgeColor: '=(items[props.item8].state === "ON") ? "green" : "red"'
250 | title: '=props.itemname8 ? props.itemname8 : (props.item8 ? props.item8 : "")'
251 |
--------------------------------------------------------------------------------
/Widgets/front_cam_mobile.yaml:
--------------------------------------------------------------------------------
1 | uid: front_cam_mobile
2 | tags: []
3 | props:
4 | parameters:
5 | - description: Set the height of the Widget
6 | label: Widget Height
7 | name: cardheight
8 | required: false
9 | type: TEXT
10 | - description: Set the url of the live stream here
11 | label: Url live stream
12 | name: urllivestream
13 | required: false
14 | type: TEXT
15 | - description: rgba or HEX
16 | label: Background Color
17 | name: bgcolor
18 | required: false
19 | type: TEXT
20 | parameterGroups: []
21 | timestamp: Nov 27, 2021, 4:03:46 PM
22 | component: f7-card
23 | config:
24 | style:
25 | --weather-card-border-radius: 20px
26 | --weather-card-color: "=(!props.fontColor) ? '255,255,255' : props.fontColor"
27 | --weather-card-text-color: rgba(var(--weather-card-color),1)
28 | --weather-card-text-shadow-color: "=(!props.textShadowColor) ? '0,0,0' : props.textShadowColor"
29 | --weather-font-size-large: 26px
30 | --weather-font-size-normal: 18px
31 | --weather-font-size-small: 16px
32 | --weather-font-size-xlarge: 60px
33 | --weather-font-size-xsmall: 14px
34 | --weather-font-size-xxlarge: 70px
35 | --weather-font-size-xxsmall: 12px
36 | --weather-text-shadow-light: 2px 2px rgba(var(--weather-card-text-shadow-color),.15)
37 | --weather-text-shadow-strong: 2px 2px rgba(var(--weather-card-text-shadow-color),.35)
38 | --weather-text-transform-time: uppercase
39 | -moz-user-select: none
40 | -ms-user-select: none
41 | -webkit-user-select: none
42 | background: "=props.bgcolor ? props.bgcolor : ''"
43 | border-radius: var(--weather-card-border-radius)
44 | color: var(--weather-card-text-color)
45 | height: '=props.cardheight ? props.cardheight : "250px"'
46 | overflow: hidden
47 | user-select: none
48 | slots:
49 | default:
50 | - component: f7-block
51 | config:
52 | class:
53 | - no-padding
54 | - no-margin
55 | style:
56 | height: 100%
57 | left: 0
58 | position: absolute
59 | top: 0
60 | width: 100%
61 | slots:
62 | default:
63 | - component: f7-row
64 | config:
65 | style:
66 | align-items: center
67 | display: grid
68 | grid-template-columns: 100%
69 | height: 100%
70 | justify-items: center
71 | padding-left: 10px
72 | padding-right: 10px
73 | slots:
74 | default:
75 | - component: oh-image
76 | config:
77 | url: '=props.urllivestream ? props.urllivestream : "https://www.flaticon.com/svg/vstatic/svg/3964/3964391.svg?token=exp=1614265385~hmac=9a01747702e3f44a515d0d898b3f13fc"'
78 | width: 100%
79 |
--------------------------------------------------------------------------------
/icons/README.md:
--------------------------------------------------------------------------------
1 | Little Icon Set
2 |
3 | copy these Files to /etc/openhab/html/icons/
4 |
--------------------------------------------------------------------------------
/icons/bedroom.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/BangerTech/openHAB3WebUI/abd60d41b982920576b8b16a959a6842dc1f9a3c/icons/bedroom.png
--------------------------------------------------------------------------------
/icons/bedtemp.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/BangerTech/openHAB3WebUI/abd60d41b982920576b8b16a959a6842dc1f9a3c/icons/bedtemp.png
--------------------------------------------------------------------------------
/icons/clamp.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/BangerTech/openHAB3WebUI/abd60d41b982920576b8b16a959a6842dc1f9a3c/icons/clamp.png
--------------------------------------------------------------------------------
/icons/desk-lamp.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/BangerTech/openHAB3WebUI/abd60d41b982920576b8b16a959a6842dc1f9a3c/icons/desk-lamp.png
--------------------------------------------------------------------------------
/icons/dining-table.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/BangerTech/openHAB3WebUI/abd60d41b982920576b8b16a959a6842dc1f9a3c/icons/dining-table.png
--------------------------------------------------------------------------------
/icons/hallway.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/BangerTech/openHAB3WebUI/abd60d41b982920576b8b16a959a6842dc1f9a3c/icons/hallway.png
--------------------------------------------------------------------------------
/icons/interior-design.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/BangerTech/openHAB3WebUI/abd60d41b982920576b8b16a959a6842dc1f9a3c/icons/interior-design.png
--------------------------------------------------------------------------------
/icons/kitchen.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/BangerTech/openHAB3WebUI/abd60d41b982920576b8b16a959a6842dc1f9a3c/icons/kitchen.png
--------------------------------------------------------------------------------
/icons/led-strip.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/BangerTech/openHAB3WebUI/abd60d41b982920576b8b16a959a6842dc1f9a3c/icons/led-strip.png
--------------------------------------------------------------------------------
/icons/monitor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/BangerTech/openHAB3WebUI/abd60d41b982920576b8b16a959a6842dc1f9a3c/icons/monitor.png
--------------------------------------------------------------------------------
/icons/moss.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/BangerTech/openHAB3WebUI/abd60d41b982920576b8b16a959a6842dc1f9a3c/icons/moss.png
--------------------------------------------------------------------------------
/icons/neural.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/BangerTech/openHAB3WebUI/abd60d41b982920576b8b16a959a6842dc1f9a3c/icons/neural.png
--------------------------------------------------------------------------------
/icons/rgb.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/BangerTech/openHAB3WebUI/abd60d41b982920576b8b16a959a6842dc1f9a3c/icons/rgb.png
--------------------------------------------------------------------------------
/icons/stairs.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/BangerTech/openHAB3WebUI/abd60d41b982920576b8b16a959a6842dc1f9a3c/icons/stairs.png
--------------------------------------------------------------------------------
/icons/tooltemp.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/BangerTech/openHAB3WebUI/abd60d41b982920576b8b16a959a6842dc1f9a3c/icons/tooltemp.png
--------------------------------------------------------------------------------
/icons/workspace.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/BangerTech/openHAB3WebUI/abd60d41b982920576b8b16a959a6842dc1f9a3c/icons/workspace.png
--------------------------------------------------------------------------------
/items/README.md:
--------------------------------------------------------------------------------
1 | 1. Create the bridge and a local weather thing manually as shown in the video.
2 | 2. Copy the .item file into /etc/openhab/items
--------------------------------------------------------------------------------
/popupPages/3D Drucker Popup.yaml:
--------------------------------------------------------------------------------
1 | config:
2 | label: 3D Drucker Popup
3 | sidebar: false
4 | blocks:
5 | - component: oh-block
6 | config: {}
7 | slots:
8 | default:
9 | - component: oh-grid-row
10 | config: {}
11 | slots:
12 | default:
13 | - component: oh-grid-col
14 | config:
15 | width: "100"
16 | slots:
17 | default:
18 | - component: widget:3D-Print-Mobile
19 | config:
20 | bedtempitem: OctoprintB1_B1BedTemp
21 | hotendtempitem: OctoprintB1_B1HotendTemp
22 | iconimage1: tooltemp
23 | iconimage2: bedtemp
24 | lightitem: BiquB1LED_Eingeschaltet
25 | poweritem: SonoffBiquB1_SonoffB1
26 | printername: Biqu B1
27 | progressitem: OctoprintB1_B1Progress
28 | timeleftitem: OctoprintB1_B1PrintTimeLeft
29 | urllivestream: http://192.168.2.124/webcam/?action=stream
30 | - component: oh-grid-row
31 | config: {}
32 | slots:
33 | default:
34 | - component: oh-grid-col
35 | config:
36 | width: "100"
37 | slots:
38 | default:
39 | - component: widget:3D-Print-Mobile
40 | config:
41 | bedtempitem: OctoprintChiron_ChironBedTemp
42 | hotendtempitem: OctoprintChiron_ChironHotendTemp
43 | iconimage1: tooltemp
44 | iconimage2: bedtemp
45 | poweritem: SonoffChiron_SonoffChiron
46 | printername: Chiron
47 | progressitem: OctoprintChiron_ChironProgress
48 | timeleftitem: OctoprintChiron_ChironPrinttimeleft
49 | masonry: null
50 | grid: null
51 | canvas: null
52 |
--------------------------------------------------------------------------------
/popupPages/Alle Batterien.yaml:
--------------------------------------------------------------------------------
1 | config:
2 | label: Alle Batterien
3 | sidebar: false
4 | blocks:
5 | - component: oh-block
6 | config:
7 | title: Home
8 | slots:
9 | default:
10 | - component: oh-grid-row
11 | config: {}
12 | slots:
13 | default:
14 | - component: oh-grid-col
15 | config:
16 | width: "50"
17 | slots:
18 | default:
19 | - component: oh-gauge-card
20 | config:
21 | borderBgColor: red
22 | borderColor: green
23 | item: SwitchbotMotionHomeAss_motiononeBattery
24 | labelText: Motion Speise
25 | max: 100
26 | min: 0
27 | type: semicircle
28 | valueTextColor: green
29 | - component: oh-grid-col
30 | config:
31 | width: "50"
32 | slots:
33 | default:
34 | - component: oh-gauge-card
35 | config:
36 | borderBgColor: red
37 | borderColor: green
38 | item: SwitchbotMeterKuche_SwitchbotBattery
39 | labelText: Meter Küche
40 | max: 100
41 | min: 0
42 | type: semicircle
43 | valueTextColor: green
44 | - component: oh-grid-col
45 | config:
46 | width: "50"
47 | slots:
48 | default:
49 | - component: oh-gauge-card
50 | config:
51 | borderBgColor: red
52 | borderColor: green
53 | item: ShellyMotion_Batterieladung
54 | labelText: Motion Bad OG
55 | max: 100
56 | min: 0
57 | type: semicircle
58 | valueTextColor: green
59 | - component: oh-grid-col
60 | config:
61 | width: "50"
62 | slots:
63 | default:
64 | - component: oh-gauge-card
65 | config:
66 | borderBgColor: red
67 | borderColor: green
68 | item: XiaomiButton1_XiaomiBattery
69 | labelText: Button Bad OG
70 | max: 100
71 | min: 0
72 | type: semicircle
73 | valueTextColor: green
74 | - component: oh-grid-col
75 | config:
76 | width: "50"
77 | slots:
78 | default:
79 | - component: oh-gauge-card
80 | config:
81 | borderBgColor: red
82 | borderColor: green
83 | item: BewegungsmelderFlur_NiedrigerBatteriestatus
84 | labelText: Motion Flur
85 | max: 100
86 | min: 0
87 | type: semicircle
88 | valueTextColor: green
89 | - component: oh-grid-col
90 | config:
91 | width: "50"
92 | slots:
93 | default:
94 | - component: oh-gauge-card
95 | config:
96 | borderBgColor: red
97 | borderColor: green
98 | item: HeizungKuche_NiedrigerBatteriestatus
99 | labelText: Heizung Küche
100 | max: 100
101 | min: 0
102 | type: semicircle
103 | valueTextColor: green
104 | - component: oh-grid-col
105 | config:
106 | width: "50"
107 | slots:
108 | default:
109 | - component: oh-gauge-card
110 | config:
111 | borderBgColor: red
112 | borderColor: green
113 | item: HeizungWohnzimmer_NiedrigerBatteriestatus
114 | labelText: Heizung Wohnzimmer
115 | max: 100
116 | min: 0
117 | type: semicircle
118 | valueTextColor: green
119 | - component: oh-grid-col
120 | config:
121 | width: "50"
122 | slots:
123 | default:
124 | - component: oh-gauge-card
125 | config:
126 | borderBgColor: red
127 | borderColor: green
128 | item: SchlafzimmerHeizung_NiedrigerBatteriestatus
129 | labelText: Heizung Schlafzimmer
130 | max: 100
131 | min: 0
132 | type: semicircle
133 | valueTextColor: green
134 | - component: oh-grid-col
135 | config:
136 | width: "50"
137 | slots:
138 | default:
139 | - component: oh-gauge-card
140 | config:
141 | borderBgColor: red
142 | borderColor: green
143 | item: HeizungBadOG_NiedrigerBatteriestatus
144 | labelText: Heizung BadOG
145 | max: 100
146 | min: 0
147 | type: semicircle
148 | valueTextColor: green
149 | - component: oh-block
150 | config:
151 | title: Office
152 | slots:
153 | default:
154 | - component: oh-grid-row
155 | config: {}
156 | slots:
157 | default:
158 | - component: oh-grid-col
159 | config:
160 | width: "50"
161 | slots:
162 | default:
163 | - component: oh-gauge-card
164 | config:
165 | borderBgColor: red
166 | borderColor: green
167 | item: AqaraButton_AqaraButtonBattery
168 | labelText: Button Büro
169 | max: 100
170 | min: 0
171 | type: semicircle
172 | valueTextColor: green
173 | - component: oh-grid-col
174 | config:
175 | width: "50"
176 | slots:
177 | default:
178 | - component: oh-gauge-card
179 | config:
180 | borderBgColor: red
181 | borderColor: green
182 | item: AqaraTempSensor_AqaraTempSensorBattery
183 | labelText: Aqara Temp Büro
184 | max: 100
185 | min: 0
186 | type: semicircle
187 | valueTextColor: green
188 | - component: oh-grid-col
189 | config: {}
190 | slots:
191 | default:
192 | - component: oh-gauge-card
193 | config:
194 | borderBgColor: red
195 | borderColor: green
196 | item: SwitchbotMeter_battery
197 | labelText: Switchbot Meter Büro
198 | max: 100
199 | min: 0
200 | type: semicircle
201 | valueTextColor: green
202 | - component: oh-grid-col
203 | config: {}
204 | slots:
205 | default:
206 | - component: oh-gauge-card
207 | config:
208 | borderBgColor: red
209 | borderColor: green
210 | item: Switchbot_switchbotoneBattery
211 | labelText: Switchbot Drucker
212 | max: 100
213 | min: 0
214 | type: semicircle
215 | valueTextColor: green
216 | - component: oh-block
217 | config:
218 | title: Werkstatt
219 | slots:
220 | default:
221 | - component: oh-grid-row
222 | config: {}
223 | slots:
224 | default:
225 | - component: oh-grid-col
226 | config:
227 | width: "50"
228 | slots:
229 | default:
230 | - component: oh-gauge-card
231 | config:
232 | borderBgColor: red
233 | borderColor: green
234 | item: TuyaContact_TuyaContactBattery
235 | labelText: Türe Werkstatt
236 | max: 100
237 | min: 0
238 | type: semicircle
239 | valueTextColor: green
240 | - component: oh-grid-col
241 | config:
242 | width: "50"
243 | slots:
244 | default:
245 | - component: oh-gauge-card
246 | config:
247 | borderBgColor: red
248 | borderColor: green
249 | item: TuyaTempSensor_TuyaTempSensorBatterie
250 | labelText: Temp Werkstatt
251 | max: 100
252 | min: 0
253 | type: semicircle
254 | valueTextColor: green
255 | - component: oh-grid-col
256 | config: {}
257 | slots:
258 | default:
259 | - component: oh-gauge-card
260 | config:
261 | borderBgColor: red
262 | borderColor: green
263 | item: SwitchbotBotTest_switchbottwoBattery
264 | labelText: Switchbot Bot 2
265 | max: 100
266 | min: 0
267 | type: semicircle
268 | valueTextColor: green
269 | - component: oh-grid-col
270 | config: {}
271 | slots:
272 | default:
273 | - component: oh-gauge-card
274 | config:
275 | borderBgColor: red
276 | borderColor: green
277 | item: TuyaPirSensor_TuyaPirSensorBattery
278 | labelText: Tuya Pir
279 | max: 100
280 | min: 0
281 | type: semicircle
282 | valueTextColor: green
283 | masonry: null
284 | grid: null
285 |
--------------------------------------------------------------------------------
/popupPages/Büro Licht Popup.yaml:
--------------------------------------------------------------------------------
1 | config:
2 | label: Büro Licht Popup
3 | sidebar: false
4 | blocks:
5 | - component: oh-block
6 | config: {}
7 | slots:
8 | default:
9 | - component: oh-grid-row
10 | config: {}
11 | slots:
12 | default:
13 | - component: oh-grid-col
14 | config: {}
15 | slots:
16 | default:
17 | - component: widget:Command-Button
18 | config:
19 | background: "#1c1c1d"
20 | cardwidth: "100"
21 | command1: OFF
22 | command2: ON
23 | headline1: Studio Aus
24 | headline2: Studio An
25 | headlinesize: 20px
26 | item: StudioAll
27 | - component: oh-grid-row
28 | config: {}
29 | slots:
30 | default:
31 | - component: oh-grid-col
32 | config: {}
33 | slots:
34 | default:
35 | - component: widget:Command-Button
36 | config:
37 | background: "#1c1c1d"
38 | cardwidth: "100"
39 | command1: OFF
40 | command2: ON
41 | headline1: Spot L Aus
42 | headline2: Spot L An
43 | headlinesize: 20px
44 | item: SonoffBuroLinks_SonoffBuroLinksPower
45 | - component: oh-grid-col
46 | config: {}
47 | slots:
48 | default:
49 | - component: widget:Command-Button
50 | config:
51 | background: "#1c1c1d"
52 | cardwidth: "100"
53 | command1: OFF
54 | command2: ON
55 | headline1: Spot R Aus
56 | headline2: Spot R An
57 | headlinesize: 20px
58 | item: SonoffBuroRechts_SonoffBueroRechtsPower
59 | - component: oh-grid-row
60 | config: {}
61 | slots:
62 | default:
63 | - component: oh-grid-col
64 | config: {}
65 | slots:
66 | default:
67 | - component: widget:Cell_Light_Color_Card_2
68 | config:
69 | header: " "
70 | iconimage: monitor
71 | item_color: NightKingMonitorLED_Color
72 | item_schalter: NightKingMonitorLED_Eingeschaltet
73 | title: Monitor
74 | - component: oh-grid-row
75 | config: {}
76 | slots:
77 | default:
78 | - component: oh-grid-col
79 | config: {}
80 | slots:
81 | default:
82 | - component: widget:Cell_Light_Color_Card_2
83 | config:
84 | header: " "
85 | iconimage: desk-lamp
86 | item_color: BuroSchreibtischLampe_RGBColor
87 | item_schalter: BuroSchreibtischLampe_Power
88 | title: Desk Lamp
89 | - component: oh-grid-row
90 | config: {}
91 | slots:
92 | default:
93 | - component: oh-grid-col
94 | config: {}
95 | slots:
96 | default:
97 | - component: widget:Cell_Light_Color_Card_2
98 | config:
99 | header: " "
100 | iconimage: led-strip
101 | item_color: LEDStabI_Color
102 | item_schalter: LEDStabI_Eingeschaltet
103 | title: BangerTECH
104 | - component: oh-grid-row
105 | config: {}
106 | slots:
107 | default:
108 | - component: oh-grid-col
109 | config: {}
110 | slots:
111 | default:
112 | - component: widget:Cell_Light_Color_Card_2
113 | config:
114 | header: " "
115 | iconimage: rgb
116 | item_color: WLEDLinks_MasterControls
117 | item_schalter: WLEDLinks_WLEDLinksPower
118 | title: Schreibtisch L
119 | - component: oh-grid-row
120 | config: {}
121 | slots:
122 | default:
123 | - component: oh-grid-col
124 | config: {}
125 | slots:
126 | default:
127 | - component: widget:Cell_Light_Color_Card_2
128 | config:
129 | header: " "
130 | iconimage: rgb
131 | item_color: WLEDRechts_MasterControls
132 | item_schalter: WLEDRechts_WLEDRechtsPower
133 | title: Schreibtisch R
134 | - component: oh-grid-row
135 | config: {}
136 | slots:
137 | default:
138 | - component: oh-grid-col
139 | config: {}
140 | slots:
141 | default:
142 | - component: widget:Cell_Light_Color_Card_2
143 | config:
144 | header: " "
145 | iconimage: moss
146 | item_color: Moosbild_Color
147 | item_schalter: Moosbild_Eingeschaltet
148 | title: Moosbild
149 | masonry: null
150 | grid: null
151 |
--------------------------------------------------------------------------------
/popupPages/Büro.yaml:
--------------------------------------------------------------------------------
1 | config:
2 | label: Büro
3 | sidebar: false
4 | blocks:
5 | - component: oh-block
6 | config: {}
7 | slots:
8 | default:
9 | - component: oh-grid-row
10 | config: {}
11 | slots:
12 | default:
13 | - component: oh-grid-col
14 | config:
15 | width: "100"
16 | slots:
17 | default:
18 | - component: widget:Cell_Temp_Card_1
19 | config:
20 | heating_item: SwitchbotMeter_battery
21 | humidity_item: SwitchbotMeter_hum
22 | icon: thermometer
23 | temp_item: GenericMQTTThing_Temp
24 | title: Temperatur
25 | - component: oh-grid-row
26 | config: {}
27 | slots:
28 | default:
29 | - component: oh-grid-col
30 | config:
31 | width: "50"
32 | slots:
33 | default:
34 | - component: widget:Command_Button
35 | config:
36 | background: "#1c1c1d"
37 | cardwidth: "100"
38 | command1: OFF
39 | command2: ON
40 | headline1: Licht Aus
41 | headline2: Licht An
42 | headlinesize: 20px
43 | item: BuroShelly1pm_Betrieb
44 | - component: oh-grid-col
45 | config:
46 | width: "50"
47 | slots:
48 | default:
49 | - component: widget:Command_Button_Popup
50 | config:
51 | background: "#1c1c1d"
52 | cardwidth: "100"
53 | command1: OFF
54 | command2: ON
55 | headline1: Studio Aus
56 | headline2: Studio An
57 | headlinesize: 20px
58 | item: StudioAll
59 | page: page_4e2bf5b1c4
60 | - component: oh-grid-row
61 | config: {}
62 | slots:
63 | default:
64 | - component: oh-grid-col
65 | config:
66 | width: "50"
67 | slots:
68 | default:
69 | - component: widget:Command_Button
70 | config:
71 | background: "#1c1c1d"
72 | cardwidth: "100"
73 | command1: OFF
74 | command2: ON
75 | headline1: Drucker Aus
76 | headline2: Drucker An
77 | headlinesize: 20px
78 | icon1: power
79 | icon2: power
80 | item: Switchbot_state
81 | - component: oh-grid-col
82 | config:
83 | width: "50"
84 | slots:
85 | default:
86 | - component: widget:Command_Button_Popup
87 | config:
88 | background: "#1c1c1d"
89 | cardwidth: "100"
90 | command1: OFF
91 | command2: ON
92 | headline1: Studio Aus
93 | headline2: Studio An
94 | headlinesize: 20px
95 | item: StudioAll
96 | page: page_58c79216a5
97 | - component: oh-grid-row
98 | config: {}
99 | slots:
100 | default:
101 | - component: oh-grid-col
102 | config:
103 | width: "50"
104 | slots:
105 | default:
106 | - component: widget:3D-Print-Mobile_1
107 | config:
108 | bedtempitem: OctoprintB1_B1BedTemp
109 | cardheight: 160px
110 | hotendtempitem: OctoprintB1_B1HotendTemp
111 | iconimage1: tooltemp
112 | iconimage2: bedtemp
113 | lightitem: BiquB1LED_Eingeschaltet
114 | page: page_6102089844
115 | poweritem: SonoffBiquB1_SonoffB1
116 | printername: Biqu B1
117 | progressitem: OctoprintB1_B1Progress
118 | timeleftitem: OctoprintB1_B1PrintTimeLeft
119 | - component: oh-grid-col
120 | config:
121 | width: "50"
122 | slots:
123 | default:
124 | - component: widget:3D-Print-Mobile_1
125 | config:
126 | bedtempitem: OctoprintChiron_ChironBedTemp
127 | cardheight: 160px
128 | hotendtempitem: OctoprintChiron_ChironHotendTemp
129 | iconimage1: tooltemp
130 | iconimage2: bedtemp
131 | page: page_6102089844
132 | poweritem: SonoffChiron_SonoffChiron
133 | printername: Chiron
134 | progressitem: OctoprintChiron_ChironProgress
135 | timeleftitem: OctoprintChiron_ChironPrinttimeleft
136 | masonry: null
137 | grid: null
138 |
--------------------------------------------------------------------------------
/popupPages/Esszimmer.yaml:
--------------------------------------------------------------------------------
1 | config:
2 | label: Esszimmer
3 | sidebar: false
4 | blocks:
5 | - component: oh-block
6 | config: {}
7 | slots:
8 | default:
9 | - component: oh-grid-row
10 | config: {}
11 | slots:
12 | default:
13 | - component: oh-grid-col
14 | config:
15 | width: "50"
16 | slots:
17 | default:
18 | - component: widget:Command_Button
19 | config:
20 | background: "#1c1c1d"
21 | cardwidth: "100"
22 | command1: OFF
23 | command2: ON
24 | headline1: Licht Aus
25 | headline2: Licht An
26 | item: EsszimmerLicht_4_STATE
27 | - component: oh-grid-col
28 | config:
29 | width: "50"
30 | slots:
31 | default:
32 | - component: widget:Command_Button
33 | config:
34 | background: "#1c1c1d"
35 | cardwidth: "100"
36 | command1: Off
37 | command2: ON
38 | headline1: Laterne Aus
39 | headline2: Laterne An
40 | item: IkeaSteckdose_IkeaSteckdose
41 | - component: oh-block
42 | config: {}
43 | slots:
44 | default:
45 | - component: oh-grid-row
46 | config: {}
47 | slots:
48 | default:
49 | - component: oh-grid-col
50 | config:
51 | large: "50"
52 | width: "100"
53 | xlarge: "50"
54 | slots:
55 | default:
56 | - component: widget:Cell_Shutter_Card_1
57 | config:
58 | item: RollladenEsszimmer_4_LEVEL
59 | title: Rollo
60 | masonry: null
61 | grid: null
62 | canvas: null
63 |
--------------------------------------------------------------------------------
/popupPages/Flur.yaml:
--------------------------------------------------------------------------------
1 | config:
2 | label: Flur
3 | sidebar: false
4 | blocks:
5 | - component: oh-block
6 | config: {}
7 | slots:
8 | default:
9 | - component: oh-grid-row
10 | config: {}
11 | slots:
12 | default:
13 | - component: oh-grid-col
14 | config:
15 | width: "50"
16 | slots:
17 | default:
18 | - component: widget:Command_Button
19 | config:
20 | background: "#1c1c1d"
21 | cardwidth: "100"
22 | command1: OFF
23 | command2: ON
24 | header: Gang
25 | headline1: Flur Licht Aus
26 | headline2: Flur Licht An
27 | icon: lightbulb
28 | item: FlurLicht_4_STATE
29 | item_brightness: LichtWohnzimmerGang_Helligkeit
30 | item_schalter: FlurLicht_4_STATE
31 | title: Licht
32 | - component: oh-grid-col
33 | config:
34 | width: "50"
35 | slots:
36 | default:
37 | - component: widget:Command_Button
38 | config:
39 | background: "#1c1c1d"
40 | cardwidth: "100"
41 | command1: OFF
42 | command2: ON
43 | header: Speise
44 | headline1: Speise Aus
45 | headline2: Speise An
46 | icon: lightbulb
47 | item: SonoffSpeise_SonoffSpeise
48 | item_brightness: LichtKuche_Helligkeit
49 | item_schalter: SonoffSpeise_SonoffSpeise
50 | title: Licht
51 | - component: oh-block
52 | config: {}
53 | slots:
54 | default:
55 | - component: oh-grid-row
56 | config: {}
57 | slots:
58 | default:
59 | - component: oh-grid-col
60 | config:
61 | large: "50"
62 | width: "100"
63 | xlarge: "50"
64 | slots:
65 | default:
66 | - component: widget:Cell_Temp_Card_1
67 | config:
68 | heating_item: SonoffP3Kuhlschrank_SonoffP3Tagesverbr
69 | humidity_item: SonoffP3Kuhlschrank_SonoffP3Aktuell
70 | icon: power
71 | temp_item: KuehlschrankKostenGesamt
72 | title: Kühlschrank
73 | masonry: null
74 | grid: null
75 |
--------------------------------------------------------------------------------
/popupPages/Küche.yaml:
--------------------------------------------------------------------------------
1 | config:
2 | label: Küche
3 | sidebar: false
4 | blocks:
5 | - component: oh-block
6 | config: {}
7 | slots:
8 | default:
9 | - component: oh-grid-row
10 | config: {}
11 | slots:
12 | default:
13 | - component: oh-grid-col
14 | config: {}
15 | slots:
16 | default:
17 | - component: widget:Command_Button
18 | config:
19 | background: "#1c1c1d"
20 | cardwidth: "100"
21 | command1: OFF
22 | command2: ON
23 | headline1: Licht Aus
24 | headline2: Licht An
25 | headlinesize: 20px
26 | item: KucheLicht_4_STATE
27 | - component: oh-grid-col
28 | config: {}
29 | slots:
30 | default:
31 | - component: widget:Command_Button
32 | config:
33 | background: "#1c1c1d"
34 | cardwidth: "100"
35 | command1: OFF
36 | command2: ON
37 | headline1: LED Aus
38 | headline2: LED An
39 | headlinesize: 20px
40 | item: SonoffT1KucheLED_SonoffT1KucheLED
41 | - component: oh-block
42 | config: {}
43 | slots:
44 | default:
45 | - component: oh-grid-row
46 | config: {}
47 | slots:
48 | default:
49 | - component: oh-grid-col
50 | config:
51 | large: "50"
52 | width: "100"
53 | xlarge: "50"
54 | slots:
55 | default:
56 | - component: widget:Cell_Temp_Card_1
57 | config:
58 | humidity_item: SwitchbotMeterTest_SwitchBotMeterTestHum
59 | icon: thermometer
60 | set_temp_item: HeizungKuche_SetPointTemperature
61 | temp_item: SwitchbotMeterTest_SwitchbotMeterTemp
62 | title: Temperatur
63 | - component: oh-grid-col
64 | config:
65 | large: "50"
66 | medium: "100"
67 | small: "100"
68 | width: "100"
69 | xlarge: "50"
70 | xsmall: "100"
71 | slots:
72 | default:
73 | - component: widget:Cell_Shutter_Card_1
74 | config:
75 | item: RollladenKuche_4_LEVEL
76 | title: Rollo
77 | masonry: null
78 | grid: null
79 |
--------------------------------------------------------------------------------
/popupPages/Netzwerk Popup.yaml:
--------------------------------------------------------------------------------
1 | config:
2 | label: Netzwerk Popup
3 | sidebar: false
4 | blocks:
5 | - component: oh-block
6 | config: {}
7 | slots:
8 | default:
9 | - component: oh-grid-row
10 | config: {}
11 | slots:
12 | default:
13 | - component: oh-grid-col
14 | config:
15 | width: "100"
16 | slots:
17 | default:
18 | - component: widget:Connection_Card_3
19 | config:
20 | cardheight: 300px
21 | headline: DSL Devices
22 | item1: iPhoneSentshuas_MACOnline0019999CB6C2
23 | item2: NetworkDevices_MACOnline34EA34B52151
24 | item3: iPhoneSentshuas_MACOnline8ED4E3D1E8F0
25 | item4: iPhoneLena_MACOnline0622A480AD82
26 | itemname1: Server
27 | itemname2: Broadlink
28 | itemname3: iPhone
29 | itemname4: iPhone Lena
30 | masonry: null
31 | grid: null
32 | canvas: null
33 |
--------------------------------------------------------------------------------
/popupPages/Obergeschoss.yaml:
--------------------------------------------------------------------------------
1 | config:
2 | label: Obergeschoss
3 | sidebar: false
4 | blocks:
5 | - component: oh-block
6 | config: {}
7 | slots:
8 | default:
9 | - component: oh-grid-row
10 | config: {}
11 | slots:
12 | default:
13 | - component: oh-grid-col
14 | config: {}
15 | slots:
16 | default:
17 | - component: widget:Command_Button
18 | config:
19 | background: "#1c1c1d"
20 | cardwidth: "100"
21 | command1: OFF
22 | command2: ON
23 | headline1: Schlafzimmer Aus
24 | headline2: Schlafzimmer An
25 | headlinesize: 20px
26 | item: Schlafzimmer_BL
27 | - component: oh-grid-col
28 | config: {}
29 | slots:
30 | default:
31 | - component: widget:Command_Button
32 | config:
33 | background: "#1c1c1d"
34 | cardwidth: "100"
35 | command1: OFF
36 | command2: ON
37 | headline1: Bad Aus
38 | headline2: Bad An
39 | headlinesize: 20px
40 | item: TapoBulb_LightOn
41 | - component: oh-block
42 | config: {}
43 | slots:
44 | default:
45 | - component: oh-grid-row
46 | config: {}
47 | slots:
48 | default:
49 | - component: oh-grid-col
50 | config:
51 | large: "50"
52 | width: "100"
53 | xlarge: "50"
54 | slots:
55 | default:
56 | - component: widget:Cell_Temp_Card_1
57 | config:
58 | humidity_item: SwitchbotMeterTest_SwitchBotMeterTestHum
59 | icon: thermometer
60 | set_temp_item: HeizungKuche_SetPointTemperature
61 | temp_item: SwitchbotMeterTest_SwitchbotMeterTemp
62 | title: Temperatur
63 | - component: oh-grid-col
64 | config:
65 | large: "50"
66 | medium: "100"
67 | small: "100"
68 | width: "100"
69 | xlarge: "50"
70 | xsmall: "100"
71 | slots:
72 | default:
73 | - component: widget:Cell_Shutter_Card_1
74 | config:
75 | item: RollladenKuche_4_LEVEL
76 | title: Rollo
77 | masonry: null
78 | grid: null
79 |
--------------------------------------------------------------------------------
/popupPages/Treppe.yaml:
--------------------------------------------------------------------------------
1 | config:
2 | label: Treppe
3 | sidebar: false
4 | blocks:
5 | - component: oh-block
6 | config: {}
7 | slots:
8 | default:
9 | - component: oh-grid-row
10 | config: {}
11 | slots:
12 | default:
13 | - component: oh-grid-col
14 | config: {}
15 | slots:
16 | default:
17 | - component: widget:Command_Button
18 | config:
19 | background: "#1c1c1d"
20 | cardwidth: "100"
21 | command1: OFF
22 | command2: ON
23 | headline1: Treppe Aus
24 | headline2: Treppe An
25 | headlinesize: 20px
26 | item: SonoffT3TreppeRechts_SonoffT3TreppeRechts
27 | - component: oh-grid-col
28 | config:
29 | width: "50"
30 | slots:
31 | default:
32 | - component: widget:Command_Button
33 | config:
34 | background: "#1c1c1d"
35 | cardwidth: "100"
36 | command1: OFF
37 | command2: ON
38 | headline1: Treppe L Aus
39 | headline2: Treppe L An
40 | headlinesize: 20px
41 | item: SonoffT4TreppeLinks_SonoffT4Links
42 | - component: oh-block
43 | config: {}
44 | slots:
45 | default: []
46 | masonry: null
47 | grid: null
48 | canvas: null
49 |
--------------------------------------------------------------------------------
/popupPages/Werkstatt.yaml:
--------------------------------------------------------------------------------
1 | config:
2 | label: Werkstatt
3 | sidebar: false
4 | blocks:
5 | - component: oh-block
6 | config: {}
7 | slots:
8 | default:
9 | - component: oh-grid-row
10 | config: {}
11 | slots:
12 | default:
13 | - component: oh-grid-col
14 | config:
15 | large: "100"
16 | width: "100"
17 | xlarge: "100"
18 | slots:
19 | default:
20 | - component: widget:Cell_Temp_Card_1
21 | config:
22 | heating_item: TuyaTempSensor_TuyaTempSensorBatterie
23 | humidity_item: TuyaTempSensor_TuyaTempSensorLuftfeuchtigkeit
24 | icon: thermometer
25 | temp_item: TuyaTempSensor_TuyaTempSensorTemperatur
26 | title: Temperatur
27 | - component: oh-block
28 | config: {}
29 | slots:
30 | default:
31 | - component: oh-grid-row
32 | config: {}
33 | slots:
34 | default:
35 | - component: oh-grid-col
36 | config: {}
37 | slots:
38 | default:
39 | - component: widget:Command_Button
40 | config:
41 | background: "#1c1c1d"
42 | cardwidth: "100"
43 | command1: OFF
44 | command2: ON
45 | headline1: Licht Aus
46 | headline2: Licht An
47 | headlinesize: 20px
48 | item: SonoffMiniWerkstatt_SonoffWerkstatt
49 | - component: oh-grid-col
50 | config: {}
51 | slots:
52 | default:
53 | - component: widget:Command_Button
54 | config:
55 | background: "#1c1c1d"
56 | cardwidth: "100"
57 | command1: OFF
58 | command2: ON
59 | headline1: Press Aus
60 | headline2: Press An
61 | headlinesize: 20px
62 | item: SonoffSteckdose_SonoffSteckdose
63 | masonry: null
64 | grid: null
65 | canvas: null
66 |
--------------------------------------------------------------------------------
/popupPages/Wohnzimmer.yaml:
--------------------------------------------------------------------------------
1 | config:
2 | label: Wohnzimmer
3 | sidebar: false
4 | blocks:
5 | - component: oh-block
6 | config: {}
7 | slots:
8 | default:
9 | - component: oh-grid-row
10 | config: {}
11 | slots:
12 | default:
13 | - component: oh-grid-col
14 | config:
15 | large: "50"
16 | width: "100"
17 | xlarge: "50"
18 | slots:
19 | default:
20 | - component: widget:Cell_Temp_Card_1
21 | config:
22 | humidity_item: SwitchbotMeterTest_SwitchBotMeterTestHum
23 | icon: thermometer
24 | set_temp_item: HeizungWohnzimmer_SET_POINT_TEMPERATURE
25 | temp_item: HeizungWohnzimmer_ACTUAL_TEMPERATURE
26 | title: Temperatur
27 | - component: oh-grid-col
28 | config:
29 | large: "50"
30 | medium: "100"
31 | small: "100"
32 | width: "100"
33 | xlarge: "50"
34 | xsmall: "100"
35 | slots:
36 | default:
37 | - component: widget:Cell_Speaker_Card_1
38 | config:
39 | header: Control
40 | icon: speaker_3
41 | item: SonoffP2TV_SonoffP2TVPower
42 | item_cover: SonosWohnzimmer_Coverbild
43 | item_volume: SonosWohnzimmer_Lautstarke
44 | title: TV
45 | - component: oh-grid-col
46 | config:
47 | large: "50"
48 | width: "100"
49 | xlarge: "50"
50 | slots:
51 | default:
52 | - component: widget:Cell_Shutter_Card_1
53 | config:
54 | header: Wohnzimmer
55 | icon: arrow_up_arrow_down
56 | item: Rollos_Wohnzimmer_4_LEVEL
57 | title: Rollo
58 | - component: oh-block
59 | config: {}
60 | slots:
61 | default:
62 | - component: oh-grid-row
63 | config: {}
64 | slots:
65 | default:
66 | - component: oh-grid-col
67 | config:
68 | width: "50"
69 | slots:
70 | default:
71 | - component: widget:Cell_Light_Card_1
72 | config:
73 | header: Decke
74 | icon: lightbulb
75 | item_brightness: DeckenbeleuchtungL_Weiss
76 | item_schalter: DeckenbeleuchtungL_Eingeschaltet
77 | title: Licht
78 | - component: oh-grid-col
79 | config:
80 | width: "50"
81 | slots:
82 | default:
83 | - component: widget:Cell_Light_Card_1
84 | config:
85 | header: TV Bank
86 | icon: lightbulb
87 | item_brightness: TVBankLED_Color
88 | item_schalter: TVBankLED_Eingeschaltet
89 | title: Licht
90 | - component: oh-grid-col
91 | config:
92 | width: "50"
93 | slots:
94 | default:
95 | - component: widget:Cell_Light_Card_1
96 | config:
97 | header: Säule
98 | icon: lightbulb
99 | item_brightness: LEDSaule_Color
100 | item_schalter: LEDSaule_Eingeschaltet
101 | title: Licht
102 | - component: oh-grid-col
103 | config:
104 | width: "50"
105 | slots:
106 | default:
107 | - component: widget:Cell_Light_Card_1
108 | config:
109 | header: Tube
110 | icon: lightbulb
111 | item_brightness: LEDTube_RGBColor
112 | item_schalter: LEDCube_Eingeschaltet
113 | title: Licht
114 | masonry: null
115 | grid: null
116 |
--------------------------------------------------------------------------------