label_printer/templates/image.html
2025-11-02 15:56:02 +01:00

70 lines
2.3 KiB
HTML

<!-- SPDX-License-Identifier: GPL-3.0-or-later -->
{% extends "base.html" %}
{% block head %}
<title>LabelPrinter Image upload</title>
{% endblock %}
{% block content %}
<h1>Upload Image</h1>
<form method="POST" action="/image" enctype="multipart/form-data">
{% if label_width == 450 %}
<label for="dropdown">Image:</label>
<select name="dropdown" id="image_preset_dropdown" onchange="handle_dropdown(this.value)">
<option value="file">Upload file</option>
{% if label_width == 450 %}
<option value="Abandoned">Abandoned item</option>
{% endif %}
</select><br>
{%endif%}
<div id="file">
<input type="file" name="image"><br>
</div>
<input type="submit" value="Generate preview"><br>
Recommended image height = {{label_width}}, other sizes will be scaled
</form>
{% if info %}
<p class="info" style="color: {{info_color}}">{{info}}</p>
{% endif %}
{% if filename %}
<img src="user_data/{{filename}}" alt="Uploaded image" style="height: {{label_width * 0.7 }}px; width: auto;">
<form method="POST" action="/image-print">
{% if cut %}
<input type="checkbox" name="cut" value="cut" checked>
{%else %}
<input type="checkbox" name="cut" value="cut">
{%endif%}
<label for="cut"> Cut paper after printing </label><br>
<input type="submit" value="Print" style="font-size: 2em; padding: 20px 40px;">
{% endif %}
<script>
function get_persistent(name, initial_value) {
if (localStorage.getItem(name) == null) {
localStorage.setItem(name, initial_value)
}
return localStorage.getItem(name)
}
dropdown_value = get_persistent("image_preset_dropdown", "file")
document.getElementById("image_preset_dropdown").value = dropdown_value
handle_dropdown(dropdown_value)
function handle_dropdown(value) {
localStorage.setItem("image_preset_dropdown", value)
console.log()
if (value == "file") {
document.getElementById("file").style.display = "inline";
} else {
document.getElementById("file").style.display = "none";
}
}
</script>
{% endblock %}