I haven’t tried it, but I believe it should work with in DSL as well. I think it’s supposed to be something like:
when
Time is ItemName
That rule only triggers at the item’s time on the item’s date. If you want the rule to trigger only on the time everyday (that is, ignore the date) then you add timeOnly to it:
when
Time is ItemName timeOnly
Hi Justin,
thank you for the hint and the example.
This works in 3.4.0.M3
With this new time based features can be added.
The goal is to have a widget were the on and off times of a switch item can be configured.
For now I will use the Time Picker from here:
But maybe there are other options available in OH3 now.
This is certainly one perfectly reasonable way to go. There are a couple other widgets in the market place that do something similar, if I recall so have a look around. I know rlkoshak has put a simple DateTime widget in the marketplace. If you want something more involved than that, there’s the fancy timeline widget.
If you have something very particular in mind though, your best chance of getting exactly what you want it to make it yourself. Look at the code of these simple widgets and see how they work to change an item’s time and then see if you can build the exact widget you are dreaming of.
I have a much more basic question regarding expandable f7-cards.
How do I control the height of the expanded card? I have this card which always opens full-screen which especially on the phone doesn’t make sense. Here when it is expanded:
I would like to have it opened only in the centre of the screen and with a height to ‘end’ below the orange and the cyan labels.
Here is the code:
uid: widget_PV_expandable
tags: []
props:
parameters: []
parameterGroups: []
timestamp: Feb 19, 2023, 9:00:41 PM
component: f7-card
config:
backdrop: true
class:
- card-expandable-animate-width
expandable: true
style:
height: 100px
width: auto
swipeToClose: true
slots:
default:
- component: oh-button
config:
class:
- cell-open-button
- card-opened-fade-out
color: black
iconMaterial: solar_power
iconSize: 30px
style:
padding-bottom: 35px
padding-top: 10px
position: absolute
right: 0
top: 0
z-index: 999
- component: f7-card-content
config:
style:
width: 100%
slots:
default:
- component: oh-button
config:
class:
- card-opened-fade-in
- cell-close-button
- card-close
color: black
iconF7: xmark_circle_fill
iconSize: 30px
style:
padding-bottom: 35px
padding-top: 10px
position: absolute
right: 0
top: 0
z-index: 999
- component: f7-block
config:
class:
- no-padding
style:
margin: 0px
height: 220px
slots:
default:
- component: f7-row
config:
style:
flex-wrap: nowrap
height: 50px
white-space: nowrap
slots:
default:
- component: f7-col
slots:
default:
- component: Label
config:
style:
font-size: 20px
font-weight: 600
overflow: hidden
text-overflow: ellipsis
white-space: nowrap
text: PV-Status
- component: f7-row
config:
class:
- justify-content-flex-start
style:
flex-wrap: nowrap
height: 30px
white-space: nowrap
font-size: 14px
slots:
default:
- component: f7-icon
config:
f7: bolt
size: 15
style:
margin-right: 5px
- component: Label
config:
style:
margin-right: 15px
text: =items.PV_Current_Consumption.displayState.replace("-", "")
- component: f7-icon
config:
f7: sun_max
size: 15
style:
margin-right: 5px
- component: Label
config:
style:
margin-right: 5px
color: "=(items.PV_Current_Feed.state > 0) ? 'red' : 'green'"
text: =items.PV_Current_Power.displayState
- component: f7-icon
config:
f7: money_euro
size: 15
style:
margin-right: 5px
- component: Label
config:
style:
margin-right: 5px
text: =items.aWATTar_CurrentPrice.displayState
- component: f7-block
config:
class:
- card-prevent-open
- card-content-padding
style:
height: 50px
slots:
default:
- component: f7-row
slots:
default:
- component: oh-trend
config:
trendItem: PV_Current_Feed
style:
background: "#DEDEDE"
trendGradient: "#000000"
position: absolute
width: 80%
height: 100
top: -120
left: 70
- component: f7-row
slots:
default:
- component: f7-col
config:
style:
border-radius: 10px
padding: 5px
background: "=(items.PV_Current_Feed.state > 0) ? '#FF9B5D' : '#DCFFBE'"
color: "=(items.PV_Current_Feed.state > 0) ? '#DEDEDE' : '#000000'"
slots:
default:
- component: Label
config:
text: "=(items.PV_Current_Feed.state > 0) ? 'Aktueller Verbrauch' : 'Aktuelle Einspeisung'"
- component: Label
config:
margin-top: 0px
text: =items.PV_Current_Feed.displayState.replace("-", "")
- component: f7-col
config:
style:
border-radius: 10px
padding: 5px
background: "#B7FFFA"
color: "#2968D7"
slots:
default:
- component: Label
config:
text: "='niedrigster Tarif heute: ' + items.aWATTar_BestPrice_price.state"
- component: Label
config:
text: "='von: ' + items.aWATTar_BestPrice_start.displayState + ' - ' + items.aWATTar_BestPrice_end.displayState"
The short answer is “not easily”. The change in card size when expanded is accomplished under-the-hood by the f7 library with calculations of what the final size should be and the animations required to make that smooth. You can override the final height using a stylesheet to apply custom css to the opened card, but unless you want the animation to still expand to a full screen and then suddenly shrink back down to your set height at the end, you’d also have to identify all the animation classes and override all the animation settings and recalculate those for every different screen size.
On larger screens, you have access to 2 f7 css variables, --f7-card-expandable-tablet-height and --f7-card-expandable-tablet-width which allow you set the size of the card when it is determined by the library that it should be smaller than full screen, but on phone screens these have no effect.