@tamorgen, it looks like you may have dropped a %} at the end of the if statement when removing the ‘or’ line below. Try:
{% if is_state('sensor.prusalink','Printing') %}
For reference, the end of the parenthesis for the conic-gradient is at the end of the line below, right before the semicolon:
{{ states('sensor.octoprint_print_progress') | round(0) }}% 0%, var(--card-background-color) 0% 100%);
I’m enjoying making this card and kept adding to it. I added some icon animations for printing and paused states. I also embedded the camera and slicer images in the card using swipe-card. It is hidden by default and opens on tap action. I use an input_boolean helper as a toggle for the conditional card. swipe-card may not be supported anymore? I was having trouble setting certain parameters.
Also for the slicer image, I changed to using a camera entity instead of a markdown card because I was having trouble with the image loading on my mobile devices while not connected to my home Wi-Fi. A different option for this image may be to set an automation to save a local, temporary snapshot when a print starts, which could then be displayed in the markdown.
As for the resuming state, I haven’t played around enough to tell how useful it is. On a normal pause, it only flashes for a second, see the gif below. I haven’t played with a cold pause yet to see if it holds that state while reheating. Similarly, I haven’t looked at the cancelling state. I think the pausing, resuming, and cancelling states might be active when the printer is running relevant gcode scripts.
Octoprint MQTT integration in HA doesn’t have a preset filament sensor, but Octoprint MQTT does apparently push events for gcode changes. I was going to search around this afternoon or listen to it to the MQTT events and see if I can tell when specific print errors occur. e.g. look for M600 command, which is a filament change.
type: custom:stack-in-card
cards:
- type: custom:mushroom-template-card
entity: input_boolean.3d_printer_camera_view
primary: Prusa MK3S+
tap_action:
action: toggle
hold_action:
action: navigate
navigation_path: /lovelace/3d-printer
secondary: |-
{% if is_state('sensor.octoprint_print_status','Printing') or
is_state('sensor.octoprint_print_status','Resuming') or
is_state('sensor.octoprint_print_status','Pausing') or
is_state('sensor.octoprint_print_status','Paused') %}
{{ (states('sensor.octoprint_print_progress') | round(0) )}}% {{states('sensor.octoprint_print_status')}}
{% set list = states('sensor.octoprint_print_file').split('_') %}
{{list[list | length-3]}}
{% else %}
{{states('sensor.octoprint_print_status')}}
{% endif %}
icon: >-
{% if is_state('sensor.octoprint_print_status','Operational') %}
mdi:printer-3d
{% elif is_state('sensor.octoprint_print_status','Printing') or
is_state('sensor.octoprint_print_status','Resuming') or
is_state('sensor.octoprint_print_status','Pausing') or
is_state('sensor.octoprint_print_status','Paused') %}
mdi:printer-3d-nozzle
{% elif is_state('sensor.octoprint_print_status','Cancelling') or
is_state('sensor.octoprint_print_status','Error') %}
mdi:close-octagon
{% elif is_state('sensor.octoprint_print_status','Unavailable') or
is_state('sensor.octoprint_print_status','Unknown') %}
mdi:printer-3d-off
{% endif %}
icon_color: >-
{% if is_state('sensor.octoprint_print_status','Paused') or
is_state('sensor.octoprint_print_status','Pausing') %}
#fc6d09
{% elif is_state('sensor.octoprint_print_status','Cancelling') or
is_state('sensor.octoprint_print_status','Error') %}
red
{% endif %}
badge_icon: >-
{% if is_state('sensor.octoprint_print_status','Paused') or
is_state('sensor.octoprint_print_status','Pausing') %}
mdi:pause
{% elif is_state('sensor.octoprint_print_status','Resuming') %}
mdi:play
{% endif %}
badge_color: >-
{% if is_state('sensor.octoprint_print_status','Paused') or
is_state('sensor.octoprint_print_status','Pausing') %}
grey
{% elif is_state('sensor.octoprint_print_status','Resuming') %}
green
{% endif %}
card_mod:
style:
mushroom-shape-icon$: |
.shape {
{% if is_state('sensor.octoprint_print_status','Printing') or
is_state('sensor.octoprint_print_status','Resuming') %}
background: radial-gradient(var(--card-background-color) 60%, transparent 0%), conic-gradient(rgb(252,109,9) {{ states('sensor.octoprint_print_progress') | round(0) }}% 0%, var(--card-background-color) 0% 100%);
{% elif is_state('sensor.octoprint_print_status','Operational') %}
background: radial-gradient(var(--card-background-color) 60%, transparent 0%), conic-gradient(rgb(53,190,37) 100% 0%, var(--card-background-color) 0% 100%);
{% elif is_state('sensor.octoprint_print_status','Cancelling') or
is_state('sensor.octoprint_print_status','Error') or
is_state('sensor.octoprint_print_status','Offline after error')%}
background: radial-gradient(var(--card-background-color) 60%, transparent 0%), conic-gradient(red 100% 0%, var(--card-background-color) 0% 100%);
{% else %}
background: radial-gradient(var(--card-background-color) 60%, transparent 0%), conic-gradient(#9e9e9e {{ states('sensor.octoprint_print_progress') | round(0) }}% 0%, var(--card-background-color) 0% 100%);
{% endif %}
}
.shape:after {
content: "";
height: 100%;
width: 100%;
position: absolute;
border-radius: 50%;
background: rgba(var(--rgb-{{ config.icon_color }}), 0.1);
}
.: |
ha-state-icon {
{% if is_state('sensor.octoprint_print_status','Printing') or
is_state('sensor.octoprint_print_status','Resuming')%}
clip-path: inset(83% 72% 0 0);
{% endif %}
}
ha-card {
border: none;
}
mushroom-badge-icon {
{% if is_state('sensor.octoprint_print_status','Pausing') or
is_state('sensor.octoprint_print_status','Paused')%}
animation: pulse 2s infinite;
{% endif %}
}
- type: custom:mushroom-chips-card
chips:
- type: template
content: >-
{{ (((states('sensor.octoprint_actual_tool0_temp') | float - 32) * 5 /
9) | round(1) )}} °C
icon: mdi:printer-3d-nozzle-heat
entity: sensor.octoprint_actual_tool0_temp
tap_action:
action: more-info
hold_action:
action: navigate
navigation_path: /lovelace/3d-printer
card_mod:
style: |
ha-card {
--chip-background: rgba(var(--rgb-{{ config.icon_color }}), 0.1);
border: none;
}
- type: template
content: >-
{{ (((states('sensor.octoprint_actual_bed_temp') | float - 32) * 5 /
9) | round(1) )}} °C
icon: mdi:heating-coil
entity: sensor.octoprint_actual_bed_temp
tap_action:
action: more-info
hold_action:
action: navigate
navigation_path: /lovelace/3d-printer
card_mod:
style: |
ha-card {
--chip-background: rgba(var(--rgb-{{ config.icon_color }}), 0.1);
border: none;
}
- type: conditional
conditions:
- condition: state
entity: binary_sensor.octoprint_printing
state: 'on'
chip:
type: template
content: >-
{% set time = (states('sensor.octoprint_print_time') | int) | int %}
{% set minutes = ((time % 3600) / 60) | int %} {% set hours = ((time
% 86400) / 3600) | int %} {% set days = (time / 86400) | int %}
{%- if time < 60 -%}
Less than a minute
{%- else -%}
{%- if days > 0 -%}
{{ days }}d
{%- endif -%}
{%- if hours > 0 -%}
{%- if days > 0 -%}
{{ ' ' }}
{%- endif -%}
{{ hours }}h
{%- endif -%}
{%- if minutes > 0 -%}
{%- if days > 0 or hours > 0 -%}
{{ ' ' }}
{%- endif -%}
{{ minutes }}m
{%- endif -%}
{%- endif -%}
icon: mdi:timer-outline
entity: sensor.octoprint_print_time
tap_action:
action: more-info
hold_action:
action: navigate
navigation_path: /lovelace/3d-printer
card_mod:
style: |
ha-card {
--chip-background: --chip-background: rgba(var(--rgb-{{ config.icon_color }}), 0.1);
border: none;
}
- type: conditional
conditions:
- condition: state
entity: binary_sensor.octoprint_printing
state: 'on'
chip:
type: template
content: >-
{% if utcnow().day ==
as_datetime(states('sensor.octoprint_estimated_finish_time')).day%}
Today {{
as_timestamp(states('sensor.octoprint_estimated_finish_time')) |
timestamp_custom ('%H:%M') }} {% elif utcnow().day ==
as_datetime(states('sensor.octoprint_estimated_finish_time')).day -
1 %} Tmrw {{
as_timestamp(states('sensor.octoprint_estimated_finish_time')) |
timestamp_custom ('%H:%M') }} {% elif utcnow().day >
as_datetime(states('sensor.octoprint_estimated_finish_time')).day%}
{% else %} {{
as_timestamp(states('sensor.octoprint_estimated_finish_time')) |
timestamp_custom ('%b %d %H:%M') }} {% endif%}
icon: mdi:clock-check-outline
entity: sensor.octoprint_estimated_finish_time
tap_action:
action: more-info
hold_action:
action: navigate
navigation_path: /lovelace/3d-printer
card_mod:
style: |
ha-card {
--chip-background: --chip-background: rgba(var(--rgb-{{ config.icon_color }}), 0.1);
border: none;
}
- type: custom:mushroom-chips-card
chips:
- type: conditional
conditions:
- condition: or
conditions:
- condition: state
entity: sensor.octoprint_print_status
state: Printing
- condition: state
entity: sensor.octoprint_print_status
state: Resuming
chip:
type: entity
entity: button.octoprint_pause_job
icon_color: white
icon: mdi:pause
content_info: none
tap_action:
action: toggle
card_mod:
style: |
ha-card {
--chip-background: rgba(var({{ '--rgb-grey' }}), 0.7);
--icon-color: rgb(var(--rgb-white));
}
- type: conditional
conditions:
- condition: or
conditions:
- condition: state
entity: sensor.octoprint_print_status
state: Paused
- condition: state
entity: sensor.octoprint_print_status
state: Pausing
chip:
type: entity
entity: button.octoprint_resume_job
icon_color: white
icon: mdi:play
content_info: none
tap_action:
action: toggle
card_mod:
style: |
ha-card {
--chip-background: rgba(var({{ '--rgb-green' }}), 0.7);
--icon-color: rgb(var(--rgb-white));
}
- type: conditional
conditions:
- condition: or
conditions:
- condition: state
entity: sensor.octoprint_print_status
state: Printing
- condition: state
entity: sensor.octoprint_print_status
state: Pausing
- condition: state
entity: sensor.octoprint_print_status
state: Paused
- condition: state
entity: sensor.octoprint_print_status
state: Resuming
chip:
type: entity
entity: button.octoprint_emergency_stop
icon_color: white
icon: mdi:alert-octagon
content_info: none
tap_action:
action: toggle
card_mod:
style: |
ha-card {
--chip-background: rgba(var({{ '--rgb-red' }}), 1);
}
card_mod:
style: |
ha-card {
--chip-box-shadow: none;
top: 16px;
width: -webkit-fill-available;
right: 12px;
position: absolute;
}
.chip-container {
right: 0px;
position: absolute;
}
- type: conditional
conditions:
- condition: or
conditions:
- condition: state
entity: sensor.octoprint_print_status
state: Printing
- condition: state
entity: sensor.octoprint_print_status
state: Resuming
card:
type: custom:mushroom-template-card
icon: mdi:printer-3d-nozzle
icon_color: var(--rgb-{{ config.icon_color }}
entity: input_boolean.3d_printer_camera_view
tap_action:
action: toggle
double_tap_action:
action: call-service
service: input_boolean.toggle
target:
entity_id: input_boolean.3d_printer_stl_preview
hold_action:
action: navigate
navigation_path: /lovelace/3d-printer
card_mod:
style:
mushroom-shape-icon$: |
.shape {
--shape-color: none;
}
.: |
ha-card {
position: absolute;
top: 0px;
border: none;
}
ha-state-icon {
animation: print 1s linear infinite alternate;
}
@keyframes print {
0% { transform: translateX(4px); }
30% { clip-path: polygon(0 0, 100% 0%, 100% 100%, 0 100%, 0 26%); }
100% { transform: translateX(-4px); clip-path: polygon(0 0, 100% 0%, 100% 100%, 40% 100%, 0 26%); }
}
- type: conditional
conditions:
- condition: state
entity: input_boolean.3d_printer_camera_view
state: 'on'
card:
type: custom:swipe-card
reset_after: 5
start_card: 1
parameters:
slidesPerView: 2
preloadImages: true
effect: flip
pagination:
type: bullets
cards:
- type: picture-entity
entity: camera.octoprint_camera
show_name: false
show_state: false
camera_view: live
aspect_ratio: '4:3'
- type: picture-entity
entity: camera.slicer_preview
show_state: false
show_name: false
aspect_ratio: '4:3'
