I see a few things going on here:
In the javascript-like expressions in the widget you rarely have to explicitly test if a variable is empty or undefined because both of these states are interpreted as false values and any existing state is interpreted as a true value. Just in case you ever do come across one of the situations where it is better to explicitly test if something exists, in these expressions it would be
vars.rewind === undefined
Also, instead of duplicating all the url, you can put the ternary expression right in the middle where you need the change. So this line can work better and be simplified to:
url: = "http://192.168.2.9:8080/static/doorphone/Domofon" + ((vars.rewind)?(vars.rewind):(items[props.history].state -1)) + ".mp4"
But I would take it even one step further. Because of the way or expressions are evaluated, you can use an even more convenient shortcut for using a default value if a variable doesn’t exist. The or expression will fully evaluate the first condition and if that condition is true it will return that value, only if the first condition is false does it both to evaluate the second condition. If the second condition is true it returns the second conditions value. That gives us:
url: = "http://192.168.2.9:8080/static/doorphone/Domofon" + (vars.rewind || items[props.history].state -1) + ".mp4"
Some of the same issue here (plus you forgot the vars in front of the rewind in the second condition):
But, more than that, 1) you don’t want to change the variable to the item state minus 1, you want to decrement the variable itself and 2) while it is probably best practice to test if vars.rewind exists before checking if it is greater than one, it’s not really necessary; ( vars.rewind > 1) will still be false if vars.rewind doesn’t exist . So formally this could look like:
actionVariableValue: =( vars.rewind && vars.rewind > 1 )?(vars.rewind - 1):1
But you could also reduce it to this:
actionVariableValue: =( vars.rewind > 1 )?(vars.rewind - 1):1
The main problem here:
appears to be that you have the same value for both the true result and the false result. This stems from the same issue as above (most of the time you want the new variable value to be based old variable value).
actionVariableValue: =( vars.rewind < (items[props.history].state -1))?(vars.rewind + 1):(items[props.history].state - 1)
The popoverClose property comes directly from the f7 base component, not the OH features overlaid on top. This means that this property doesn’t understand OH specific things such as widget or page IDs. If you are going to use this property then you have to set the value to a css selector that uniquely identifies your popver. Most of the time I do this just by adding a non-standard class name to the widget:
component: f7-card
config:
class:
- no-margin
- video_history_popup
Then the appropriate css selector would look like this:
popoverClose: .popover.video_history_popup
I have to agree that this is probably not feasible at the moment (well…sufficiently non-trivial to probably not be worth it).
