mick1880
(michael ward)
June 27, 2022, 2:45pm
233
I have an item named ‘Entered_Code’ that passes a code to my alarm rule, a night or away alarm arms based on the code, this all works fine when using the keypad widget on its own.
the issue i have is when i use the keypad as a popup, it doesnt work, HELP please. popup appears and functions but the entered code isnt passed to the ‘Entered_Code’ item after send if hit. also doesnt close on send
main widget
uid: Alarm_status
tags: []
props:
parameters:
- description: Alarm Status
name: label
required: false
type: TEXT
- context: item
description: Full Alarm Status Item
label: Item
name: full_alarm
required: false
type: TEXT
- context: item
description: Night Alarm Status Item
label: Item
name: night_alarm
required: false
type: TEXT
- context: item
description: Item to send the pincode to
label: Item
name: Entered_Code
required: true
type: TEXT
timestamp: Jun 27, 2022, 12:05:06 AM
component: oh-label-cell
config:
action: popup
actionModal: widget:keypad
actionModalConfig:
item: =props.Entered_Code
popoverClose: true
color: '= (items[props.full_alarm].state === "ON") ? "red" : (items[props.night_alarm].state === "ON") ? "orange" : "green"'
expandable: false
header: = props.label
icon: '= (items[props.full_alarm].state === "ON") ? "oh:siren-on" : (items[props.night_alarm].state === "ON") ? "oh:siren-on" : "oh:siren-off"'
label: '= (items[props.full_alarm].state === "ON") ? "Full Alarm is Armed" : (items[props.night_alarm].state === "ON") ? "Night Alarm is Armed" : "The Alarm is Disarmed"'
on: true
Keypad popup
uid: keypad
tags: []
props:
parameters:
- context: item
description: Item to send the pincode to
label: Item
name: item
required: false
type: TEXT
- description: Replace pincode characters with this string, leave blank to show it as-is
label: Mask character
name: mask
required: false
type: TEXT
- description: If this widget is shown in a popup, close it after pressing Send
label: Close Popup on Send
name: closePopup
required: false
type: BOOLEAN
parameterGroups: []
timestamp: Jun 27, 2022, 2:26:16 PM
component: f7-block
config:
class:
- padding
label: Please Input Pin
style:
--f7-button-bg-color: var(--f7-card-bg-color)
--f7-button-text-color: var(--f7-text-color)
--f7-theme-color-rgb: var(--f7-color-blue-rgb)
slots:
default:
- component: oh-label-card
config:
class:
- margin-bottom
label: "=(props.mask && vars.pincode) ? props.mask.repeat(vars.pincode.length || 0) : vars.pincode"
outline: true
- component: f7-row
config:
class:
- margin
slots:
default:
- component: oh-repeater
config:
for: digit
fragment: true
in:
- "1"
- "2"
- "3"
- "4"
- "5"
- "6"
- "7"
- "8"
- "9"
- "*"
- "0"
- "#"
slots:
default:
- component: f7-col
config:
class:
- margin-vertical-half
width: "33"
slots:
default:
- component: oh-button
config:
action: variable
actionVariable: pincode
actionVariableValue: "=(vars.pincode) ? vars.pincode + loop.digit : loop.digit"
large: true
raised: true
text: =loop.digit
- component: f7-row
config:
class:
- margin
style:
--f7-button-bg-color: transparent
--f7-theme-color: var(--f7-color-blue)
slots:
default:
- component: f7-col
slots:
default:
- component: oh-button
config:
action: variable
actionVariable: pincode
actionVariableValue: ""
large: true
text: Clear
- component: f7-col
slots:
default:
- component: oh-button
config:
action: command
actionCommand: =vars.pincode
actionItem: =(props.item) || 'TestString'
class: "=(props.closePopup) ? ['popup-close'] : []"
clearVariable: pincode
popoverClose: true
disabled: =!vars.pincode
fill: true
large: true
style:
--f7-button-hover-bg-color: var(--f7-color-blue-tint)
--f7-button-pressed-bg-color: var(--f7-color-blue-tint)
text: Send
- component: f7-col
slots:
default:
- component: oh-button
config:
action: variable
actionVariable: pincode
actionVariableValue: '=(vars.pincode) ? vars.pincode.substring(0, vars.pincode.length - 1) : ""'
large: true
text: Back
kuczerek
(Boris)
June 30, 2022, 10:19am
234
HI @mick1880 ,
sry, didn’t see this post.
You can find some documentation in this post:
Yes, of course. The documentation at owntracks concerning the installation of mosquitto is a little bit outdated, so I combined my installation out of this three websites:
https://owntracks.org/booklet/guide/broker/
Finally I got owntracks up and running with mosquitto on my linux box, client connections secured by TLS.
Now comes the openHAB part: Install the mqtt binding, create a bridge thing:
UID: mqtt:broker:MQTTBroker
label: MQTT Broker
thingTypeUID: mqtt:broker
configuration:
lwtQos…
kuczerek
(Boris)
June 30, 2022, 10:25am
235
Hey @Christopher_Haas ,
it took a while, but here are the widgets:
Livevisu Linkkarte mit Status Übersicht
uid: Livevisu Linkkarte mit Status Übersicht
tags:
- Live
- MainUI
props:
parameters:
- label: Title
name: title
required: false
type: TEXT
- label: f7 Icon Titel
name: icon_titel
required: false
type: TEXT
- label: f7 Icon normal
name: icon
required: false
type: TEXT
- label: Status Präfix
name: praefix
required: false
type: TEXT
- label: Status Suffix
name: suffix
required: false
type: TEXT
- context: item
label: Statusitem
name: status
required: false
type: TEXT
- description: rgba oder HEX
label: Hintergrundfarbe
name: bgcolor
required: false
type: TEXT
- description: rgba oder HEX
label: Hintergrundfarbe bei Statusitem > 0 oder ON
name: bgcolor_active
required: false
type: TEXT
- description: Popup Seite
label: Page ID
name: page
required: false
parameterGroups: []
timestamp: Dec 13, 2021, 2:27:25 PM
component: f7-card
config:
style:
noShadow: false
padding: 0px
border-radius: var(--f7-card-expandable-border-radius)
box-shadow: 5px 5px 10px 1px rgba(0,0,0,0.1)
background-color: "=items[props.status].state > 0 ? (props.bgcolor_active ? props.bgcolor_active : '') : (items[props.status].state == 'ON' ? (props.bgcolor_active ? props.bgcolor_active : '') : (props.bgcolor ? props.bgcolor : ''))"
height: 150px
margin-left: 5px
margin-right: 5px
slots:
content:
- component: f7-block
config:
style:
position: absolute
top: -5px
left: 16px
flex-direction: row
display: flex
slots:
default:
- component: f7-icon
config:
f7: "=props.icon_titel ? props.icon_titel : ''"
size: 18
style:
margin-right: 10px
- component: Label
config:
text: "=props.title ? props.title : ''"
style:
font-size: 12px
margin-top: 0px
- component: f7-block
config:
style:
position: absolute
bottom: -90px
left: 16px
flex-direction: row
display: flex
slots:
default:
- component: f7-icon
config:
f7: "=props.icon ? props.icon : ''"
size: 100
- component: f7-block
config:
style:
position: absolute
top: 128px
right: 0px
slots:
default:
- component: Label
config:
text: "=props.praefix ? (props.suffix ? props.praefix + items[props.status].displayState + props.suffix : props.praefix + items[props.status].displayState ) : (props.suffix ? items[props.status].displayState + props.suffix : items[props.status].displayState )"
style:
margin-right: 10px
- component: oh-link
config:
action: navigate
actionPageTransition: f7-dive
actionPage: ='page:' + props.page
style:
position: absolute
left: 0px
top: 0px
height: 150px
width: 100%
Livevisu Titel
uid: Livevisu Titel
tags:
- Live
- MainUI
props:
parameters:
- label: Titel
name: header
required: false
type: TEXT
parameterGroups: []
timestamp: Dec 28, 2021, 5:43:20 PM
component: f7-card
config:
content: "=props.header ? props.header : 'Set Props'"
noBorder: true
noShadow: true
outline: false
padding: false
style:
--f7-card-bg-color: var(--f7-page-bg-color)
font-size: 20px
font-weight: 600
text-align: center
Livevisu Trenner
uid: Livevisu Trenner
tags:
- Live
- MainUI
props:
parameters:
- label: Titel
name: header
required: false
type: TEXT
parameterGroups: []
timestamp: Dec 29, 2021, 8:32:55 AM
component: f7-card
config:
content: "=props.header ? props.header : 'Set Props'"
noBorder: true
noShadow: true
outline: false
padding: false
style:
--f7-card-bg-color: var(--f7-page-bg-color)
font-size: 30px
font-weight: 600
hmerk
(Hans-Jörg Merk)
Split this topic
September 10, 2022, 5:18pm
236
UhA
(András Uhrin)
October 23, 2022, 7:46am
391
I would like to share with you the my collection of widgets. I created the first version 1 year ago, and in the last year I added some improvements and a consistent flat look to the widget.
The widgets are existing two different versions for mobile and for tablet grid views
If you would like to use, just take and integrate on your dashboard
Examples
Source Code
2 Likes
Could you share how you achieved this?
1 Like
mick1880
(michael ward)
November 9, 2022, 4:28pm
393
Sorry for the delayed reply, below rule if it helps and still required
rule "Michael Last Seen"
when
Time cron "0 0/1 * * * ?"
then
var DateTimeType prevOnState = (MichaellastSeen.state as DateTimeType).getZonedDateTime()
var DateTimeType newTime = (currentTime.state as DateTimeType).getZonedDateTime()
var execDuration = Duration.between(prevOnState, ZonedDateTime.now()).toSeconds()
var Number lastSeen = execDuration / 60
postUpdate(Michael_update, lastSeen)
end
1 Like
thx - for your reply! love it.
JHC
(Jens)
November 29, 2022, 4:46pm
395
Hi Guys,
that issue with the example Widgets is still existing, if I want to use the topics in the Fixed Grid Layout.
In the widget Editor it looks fine, in the Responsive layout it works fine, only in Fixed Grid layout not.
Has anybody an Idea? Is it not possible to share a widgets between the different layouts?
Regards,
Jens
jelmer1
(jelmer)
December 9, 2022, 8:05am
396
Hi,
I have a question on how to make these buttons bigger.
Here is my yaml code:
uid: keypad
tags: []
props:
parameters:
- context: item
description: Item to send the pincode to
label: Item
name: item
required: false
type: TEXT
- description: Replace pincode characters with this string, leave blank to show it as-is
label: Mask character
name: mask
required: false
type: TEXT
- description: If this widget is shown in a popup, close it after pressing Send
label: Close Popup on Send
name: closePopup
required: false
type: BOOLEAN
parameterGroups: []
timestamp: Dec 8, 2022, 7:21:19 PM
component: f7-block
config:
class:
- padding
label: Please Input Pin
style:
--f7-button-bg-color: var(--f7-card-bg-color)
--f7-button-text-color: var(--f7-text-color)
--f7-theme-color-rgb: var(--f7-color-blue-rgb)
slots:
default:
- component: oh-label-card
config:
class:
- margin-bottom
label: "=(props.mask && vars.pincode) ? props.mask.repeat(vars.pincode.length || 0) : vars.pincode"
outline: true
- component: Label
config:
class:
- margin-bottom
label: "=(props.mask && vars.pincode) ? props.mask.repeat(vars.pincode.length || 0) : vars.pincode"
style:
color: "#777"
font-size: 20px
text-align: center
text: ""
- component: f7-row
config:
class:
- margin
slots:
default:
- component: oh-repeater
config:
for: digit
fragment: true
in:
- "1"
- "2"
- "3"
- "4"
- "5"
- "6"
- "7"
- "8"
- "9"
- "*"
- "0"
- "#"
slots:
default:
- component: f7-col
config:
class:
- margin-vertical-half
width: "33"
slots:
default:
- component: oh-button
config:
action: variable
actionVariable: pincode
actionVariableValue: "=(vars.pincode) ? vars.pincode + loop.digit : loop.digit"
large: true
raised: true
text: =loop.digit
- component: f7-row
config:
class:
- margin
style:
--f7-button-bg-color: transparent
--f7-theme-color: var(--f7-color-blue)
slots:
default:
- component: f7-col
slots:
default:
- component: oh-button
config:
action: variable
actionVariable: pincode
actionVariableValue: ""
large: true
text: Clear
- component: f7-col
slots:
default:
- component: oh-button
config:
action: command
actionCommand: =vars.pincode
actionItem: =(props.item) || 'TestString'
class: "=(props.closePopup) ? ['popup-close'] : []"
clearVariable: pincode
closePopup: =props.closePopup
disabled: =!vars.pincode
fill: true
large: true
style:
--f7-button-hover-bg-color: var(--f7-color-blue-tint)
--f7-button-pressed-bg-color: var(--f7-color-blue-tint)
text: Send
- component: f7-col
slots:
default:
- component: oh-button
config:
action: variable
actionVariable: pincode
actionVariableValue: '=(vars.pincode) ? vars.pincode.substring(0, vars.pincode.length - 1) : ""'
large: true
text: Back
Gufti
(Christoph)
December 18, 2022, 4:21pm
398
I deleted the prev. post. Got it done
1 Like
Gufti
(Christoph)
December 19, 2022, 10:53pm
399
Hi there,
I have a question about the room card. What I did:
I created a “functional” non-semantic light group for each room (to avoid to destroy the semantic model).
I added the lights from the room to this group
Members Base Type = Dimmer
Aggregation Function is AVG
After that the group Item state was displayed with several decimal numbers after the value. I assume this happens because the average is calculated.
Therefore I added some metadata to the item unter “State description”
The decimal points are gone. Nevertheless they are still displayed in the widget:
If I use one Dimmer item directly instead of the group, the decimal numbers are not displayed.
Any Idea how to get rid of it? Has the modification to be done directly in the YAML Code of the Widget?
Thanks.
Integer
(Mike P)
December 20, 2022, 8:29am
400
Hey @Gufti
Try to change this line
text: "=(Number(items[props.status].state) > 0) ? items[props.status].state : ''"
with this one:
text: "=(Number(items[props.status].state) > 0) ? (items[props.status].displayState ? items[props.status].displayState: items[props.status].state) : '' "
let me know, if it is working now.
Gufti
(Christoph)
December 22, 2022, 6:27pm
401
Hi,
works perfectly!
Thanks a lot for your help!
Oliver2
(Oliver)
December 23, 2022, 7:39am
402
With v3.4 there is an @ operator available which shows displayState if available and state if not available.
@(items[props.status])
It helped tidying up my widgets😀
1 Like
mmm i’ve tried different ways but it doesn’t work for me
i’m running OH snapshot 4.0.0
can you tell me why?
thanks a lot!
- component: Label
config:
style:
color: black
margin-left: 2px
z-index: 98
text: @(items[props.opstateItem])
hmerk
(Hans-Jörg Merk)
December 23, 2022, 2:01pm
404
Does it not need to be
text: =@(items[props.opstateItem])
Gufti
(Christoph)
December 23, 2022, 2:42pm
405
I’m currently on stable 3.3.0
i’ve tried but the state is reported as “-”.
that item should have both state and displayState…