How to display the value of an item in the oh-slider-cell?

[Bernd_Ritter]

I use an oh-slider-cell to change the value of an item. This works fine and you see the value of the item, once you have clicked on the cell.
But is there a way to have the card display the current value of the item in the title or subtitle?

My cell looks like this:

              - component: oh-slider-cell
                config:
                  item: LightSensorEastThreshold
                  min: 0
                  max: 100000
                  step: 1000
                  title: Lichtsensor Osten
                  subtitle: Grenzwert
                  label: true
                  scale: true
                  unit: lux

Regards
Bernd

[JustinG]

Yes. You can access the state of any item using the widget’s built in items dictionary object. To get the state of an item you just use the name (not the label) of that item as the key in the dictionary and get the state property of that value:

items["LightSensorEastThreshold"].state

That returns a string version of the item’s state so you can incorporate that into any expression that concatenates strings. You just have to start the widget property with a = to let the parser know that you want the expression to be evaluated and not just displayed directly:

subtitle: ="Grenzwert - " + items["LightSensorEastThreshold"].state

[Bernd_Ritter]

Awesome! Thank you very much

One more thing, if someone has the same problem.
Don’t forget the “=” when you set this via the UI, like I did

[ceedee]

Actually it feels a little awkward to repeat the item name as a string in the subtitle. Isn’t there a better way?

Related to that: Consider the case that the state you want to display is no simple number value, but a value you’d like to pass through a map transformation (e.g. for translation). How would you handle this case?

[JustinG]

@ceedee

Actually it feels a little awkward to repeat the item name as a string in the subtitle. Isn’t there a better way?

Only if you want to make one. The standard available widgets are created with maximum flexibility and user base in mind. That means leaving each property isolated from the others in case someone wants, for example, the cell’s subtitle separate from the item that is linked to the slider. If you have a usecase where you’d find it more convenient for everything to be automatically populated then that’s where user-built, custom widgets come in.

@ceedee

Related to that: Consider the case that the state you want to display is no simple number value, but a value you’d like to pass through a map transformation (e.g. for translation). How would you handle this case?

Most widget properties accept javascript-like expressions so quite a lot of transformation/computation is available. In your specific example, however, that would be best handled at the level of the item where the transformation is applied via the item’s stateDescription metadata. In that case, the state would still be the same value but there would also be a displayState property returned by the items object that would be the transformed (mapped ) state.

[ceedee]

Ok, makes sense to encapsulate that into a custom widget. I’ve not yet created one, but it looks like I should try

How can I access a transformation from these javascript-like expressions? From rule javascript I’ve to use something like:

var Transformation = Java.type("org.openhab.core.transform.actions.Transformation")
var transformedState = Transformation.transform("MAP", "mapfile.map", item.state.toString())

So, couId I use (as single line)

Java.type("org.openhab.core.transform.actions.Transformation").transform("MAP", "mapfile.map", items["itemname"].state.toString())

? I’m getting a undefined using this in the UI.

Using displayState works well for simple items like SwitchItems, thank you for the tip!

There would be some room for optimization though

1. It does not work for GroupItems, for some reason I cannot access displayState there. But the MainUI shows the mapped state.
2. I have several items where I need to apply the same transform. Is there a way to do that?

[JustinG]

@ceedee

From rule javascript

There’s a reason I said javascript-like. The widgets do not have a full js interpreter. What’s available in in widgets is jsep just an expression parser. There’s a lot you cannot do, which I why I guessed that it might be better to apply the maps to the items themselves. I don’t know what your map file contains, but if your map is a fairly simple 2 or 3 element map then, you could just replicate that in the widget parser with a nested ternary expression. Any more complicated than that and you’re almost guaranteed to be better off applying the transformation at the item level.

@ceedee

It does not work for GroupItems, for some reason I cannot access displayState there. But the MainUI shows the mapped state.

Try just for the state of the group item. I’m not sure how the group item’s state is impacted by transformations of the member items. However, in the widgets if a displayState and the State are the same, the displayState is not passed to the items dictionary (an optimization decision). So, it a displayState comes up as null then just use the state.

@ceedee

I have several items where I need to apply the same transform. Is there a way to do that?

Just apply it at the item level.

[ceedee]

I’m using a widget now, works well. Thanks for the widget hint!

Only two things where I’m not totally happy with:

1. I’m using an oh-button for the lower three controls with the icons – is there a replacement which suits better?
2. I’m checking the availability of an item using

text: '=(items[props.measuredRadiatorTempItem].state !== "-") ? (items[props.measuredRadiatorTempItem].state + " Radiator") : " Radiatorsensor nicht installiert"'

I tried checking the item for null, NULL, undefined – but nothing worked. Is there a better way?

[JustinG]

@ceedee

I’m using an oh-button for the lower three controls with the icons – is there a replacement which suits better?

That depends on what you’d like to do. Many of the oh components have the actions available. The oh-link will give you all the same abilities and has a built-in badge setup, but not the button stylings. The oh-icon has the actions and but allows for easier linking of the icon to a dynamic item state. etc. Just look through the component reference and see if there’s something that fits suits better if the button is missing something you need.

@ceedee

I tried checking the item for null, NULL, undefined – but nothing worked. Is there a better way?

Nope. The items dictionary returns "-" for all those values so this a perfectly good method.

Note that other objects that you have access to in the widgets (e.g., vars and props) do return undefined if you try to call a property that doesn’t exist.

[ceedee]

Thanks for the reference! If got it working now – not 100% percent, but it’s sufficient for now, I think.