105 lines
4.6 KiB
HTML
105 lines
4.6 KiB
HTML
<div id="status-{{ printer.id }}"
|
|
hx-post="/status/{{ printer.id }}"
|
|
hx-trigger="every 1s"
|
|
hx-swap="outerHTML"
|
|
hx-target="#status-{{ printer.id }}"
|
|
hx-select="#status-{{ printer.id }}">
|
|
{% if status.error %}
|
|
<div class="text-red-400">Error: {{ status.error }}</div>
|
|
{% if status.debug_info %}
|
|
<div class="mt-2 text-sm text-slate-400">
|
|
<div>Printer ID: {{ status.debug_info.id }}</div>
|
|
<div>Name: {{ status.debug_info.name }}</div>
|
|
<div>Connected: {{ status.debug_info.connected }}</div>
|
|
</div>
|
|
{% endif %}
|
|
{% else %}
|
|
<div class="w-full space-y-2">
|
|
<!-- Current File -->
|
|
<div class="flex justify-between items-center">
|
|
<span class="text-sm text-slate-400">Current File</span>
|
|
<span class="font-medium">{{ status.current_file }}</span>
|
|
</div>
|
|
|
|
<!-- Status Items -->
|
|
<style>
|
|
/* Remove arrows/spinners from number inputs */
|
|
input[type=number]::-webkit-inner-spin-button,
|
|
input[type=number]::-webkit-outer-spin-button {
|
|
-webkit-appearance: none;
|
|
margin: 0;
|
|
}
|
|
input[type=number] {
|
|
-moz-appearance: textfield;
|
|
appearance: textfield;
|
|
}
|
|
</style>
|
|
|
|
<div class="flex justify-between items-center">
|
|
<span class="text-sm text-slate-400">Nozzle Temp</span>
|
|
<div class="flex items-center gap-1">
|
|
<span class="font-medium">{{ status.nozzle_temp|int }}</span>
|
|
<span class="text-slate-400">/</span>
|
|
<form class="flex items-center"
|
|
hx-post="/set-temperature/{{ printer.id }}"
|
|
hx-trigger="blur from:input, keyup[key=='Enter'] from:input"
|
|
hx-swap="none"
|
|
onsubmit="event.preventDefault();">
|
|
<input type="hidden" name="type" value="nozzle">
|
|
<input type="number"
|
|
name="value"
|
|
class="w-[3ch] font-medium bg-transparent focus:outline-none focus:ring-1 focus:ring-blue-500 focus:rounded"
|
|
value="{{ status.nozzle_target|default(status.nozzle_temp|int) }}"
|
|
step="1"
|
|
onblur="if(!this.value) { this.value = '0'; this.form.requestSubmit(); }"
|
|
maxlength="3">
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex justify-between items-center">
|
|
<span class="text-sm text-slate-400">Bed Temp</span>
|
|
<div class="flex items-center gap-1">
|
|
<span class="font-medium">{{ status.bed_temp|int }}</span>
|
|
<span class="text-slate-400">/</span>
|
|
<form class="flex items-center"
|
|
hx-post="/set-temperature/{{ printer.id }}"
|
|
hx-trigger="blur from:input, keyup[key=='Enter'] from:input"
|
|
hx-swap="none"
|
|
onsubmit="event.preventDefault();">
|
|
<input type="hidden" name="type" value="bed">
|
|
<input type="number"
|
|
name="value"
|
|
class="w-[3ch] font-medium bg-transparent focus:outline-none focus:ring-1 focus:ring-blue-500 focus:rounded"
|
|
value="{{ status.bed_target|default(status.bed_temp|int) }}"
|
|
step="1"
|
|
onblur="if(!this.value) { this.value = '0'; this.form.requestSubmit(); }"
|
|
maxlength="3">
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex justify-between items-center">
|
|
<span class="text-sm text-slate-400">Chamber Temp</span>
|
|
<span class="font-medium">{{ status.chamber_temp }}</span>
|
|
</div>
|
|
|
|
<div class="flex justify-between items-center">
|
|
<span class="text-sm text-slate-400">Progress</span>
|
|
<span class="font-medium">{{ status.percentage }}</span>
|
|
</div>
|
|
|
|
<div class="flex justify-between items-center">
|
|
<span class="text-sm text-slate-400">Time Left</span>
|
|
<span class="font-medium">{{ status.remaining_time }}</span>
|
|
</div>
|
|
|
|
<div class="flex justify-between items-center">
|
|
<span class="text-sm text-slate-400">Est. Done</span>
|
|
<span class="font-medium">{{ status.finish_time }}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|