Lovelace background and changing foreground

Configuration Frontend
1

Hello,

I have linked my washing machine to HAS via the smarthings integration. I would like a lovelace card like samsung has it in its smartthings app.
For this I made a background consisting of circles and an image of the drum with water.
combined they look like this:
small_total and only background: small_background_1

What I’m trying to do is to get the background permanently displayed and depending on the jobstate make the drum rotate.

How do I get the background locked on the lovelace card and project the drum with water on it as soon as the state changes to washing, rinse and spin.

in a buttoncard it is possible to rotate the drum. As a sample i used the switch state insted of job state.
anyone can help me further?

type: custom:button-card
show_entity_picture: true
size: 100%
lock: true
name: machine not running
font: 20px Roboto
entity_picture: /local/samsung/trommel_water.png
state:

  • value: ‘on’
    type: null
    name: machine staat aan
    styles:
    icon:
    - entity_picture: /local/samsung/trommel_water.png
    - animation:
    - rotating 3s ease infinite alternate
    entity: switch.washer_samsung