Widget to Control the Cleaning Robot and see it’s status with configurable color
Changelog
Version 0.1
- initial release
Resources
uid: Cell_Cleaning_Robot
tags: []
props:
parameters:
- description: Header on top of the card
label: Header
name: header
required: false
type: TEXT
- description: in rgba() or HEX or empty
label: Foreground Color
name: fgcolor
required: false
type: TEXT
- context: item
label: State
name: state
required: false
type: TEXT
- context: item
label: Battery state
name: batteryState
required: false
type: TEXT
- context: item
label: Command
name: command
required: false
type: TEXT
- context: item
label: Power Level
name: powerlevel
required: false
type: TEXT
parameterGroups: []
timestamp: Aug 5, 2022, 11:30:34 PM
component: f7-card
config:
style:
border-radius: var(--f7-card-expandable-border-radius)
box-shadow: 5px 5px 10px 1px rgba(0,0,0,0.1)
height: 120px
margin-left: 5px
margin-right: 5px
noShadow: false
padding: 0px
slots:
content:
- component: f7-block
config:
style:
display: flex
flex-direction: row
left: 16px
position: absolute
top: -5px
slots:
default:
- component: f7-icon
config:
f7: smallcircle_circle
size: 18
style:
margin-right: 10px
- component: Label
config:
style:
font-size: 12px
margin-top: 0px
text: "=props.header ? props.header : ''"
- component: f7-block
config:
style:
flex-direction: row
left: 16px
position: absolute
top: 50px
slots:
default:
- component: Label
config:
style:
font-size: 14px
font-weight: 600
margin-left: 0px
margin-top: 0px
text: "=items[props.state].displayState ? items[props.state].displayState : items[props.state].state"
- component: f7-block
config:
style:
bottom: -40px
display: flex
flex-direction: row
left: 12px
position: absolute
slots:
default:
- component: f7-icon
config:
f7: "=(Number.parseFloat(items[props.batteryState].state) >= '80') ? 'battery_100' : 'battery_25' "
size: 18
visible: "=props.batteryState ? true : false"
- component: Label
config:
style:
font-size: 12px
margin-left: 5px
margin-top: 0px
text: =items[props.batteryState].displayState
visible: "=props.batteryState ? true : false"
- component: f7-block
config:
style:
bottom: -63px
display: flex
flex-direction: row
left: 12px
position: absolute
slots:
default:
- component: oh-button
config:
action: options
actionItem: =[props.command]
color: =props.fgcolor
fill: false
style:
margin-top: 5px
right: 10px
top: 2px
text: =items[props.command].displayState || items[props.command].state
- component: f7-block
config:
style:
bottom: -63px
display: flex
flex-direction: row
position: absolute
right: 12px
slots:
default:
- component: oh-button
config:
action: options
actionItem: =[props.powerlevel]
color: =props.fgcolor
fill: false
style:
margin-top: 5px
right: 10px
top: 2px
text: =items[props.powerlevel].displayState || items[props.powerlevel].state