emilevs/label_printer
1
0
Fork 1
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Create some javascript to make the front end have n lines

Browse source
This commit is contained in:
TT-392 2025-10-31 15:27:40 +01:00
parent 9de5ba5524
commit c7b5ac9f5f
2 changed files with 123 additions and 65 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

81
app.py
View file

@ -180,55 +180,56 @@ def text_form():
check_for_new_user(session) check_for_new_user(session)
if request.method == 'POST': if request.method == 'POST':
session["text1"] = { print(request.form)
"string": request.form["string1"], #session["text1"] = {
"size": int(request.form["size1"]), # "string": request.form["string1"],
"pos": int(request.form["pos1"]), # "size": int(request.form["size1"]),
"bold": "bold1" in request.form, # "pos": int(request.form["pos1"]),
} # "bold": "bold1" in request.form,
session["text2"] = { #}
"string": request.form["string2"], #session["text2"] = {
"size": int(request.form["size2"]), # "string": request.form["string2"],
"pos": int(request.form["pos2"]), # "size": int(request.form["size2"]),
"bold": "bold2" in request.form, # "pos": int(request.form["pos2"]),
} # "bold": "bold2" in request.form,
#}
# Clear previously saved font ## Clear previously saved font
for font in session["fonts"]: #for font in session["fonts"]:
session["fonts"][font]["selected"] = False # session["fonts"][font]["selected"] = False
# If an invalid font has been submitted, just default to the first one ## If an invalid font has been submitted, just default to the first one
chosen_font = request.form["font"] #chosen_font = request.form["font"]
if chosen_font in session["fonts"]: #if chosen_font in session["fonts"]:
session["fonts"][chosen_font]["selected"] = True # session["fonts"][chosen_font]["selected"] = True
else: #else:
first_font = next(iter(session["fonts"])) # first_font = next(iter(session["fonts"]))
session["fonts"][first_font]["selected"] = True # session["fonts"][first_font]["selected"] = True
# Select the first font that has been marked as selected ## Select the first font that has been marked as selected
chosen_font = None #chosen_font = None
for font in session["fonts"]: #for font in session["fonts"]:
f = session["fonts"][font] # f = session["fonts"][font]
if f["selected"]: # if f["selected"]:
chosen_font = f # chosen_font = f
# If the font is still None, something has gone wrong ## If the font is still None, something has gone wrong
if chosen_font is None: #if chosen_font is None:
return # return
message, status, img = gen_image(label_width, session["text1"], session["text2"], chosen_font) #message, status, img = gen_image(label_width, session["text1"], session["text2"], chosen_font)
if status == "Error": #if status == "Error":
session["text image path"] = None # session["text image path"] = None
return render_text_template(message, "red") # return render_text_template(message, "red")
get_folder_path(session) #get_folder_path(session)
session["text image path"] = text_image_filename #session["text image path"] = text_image_filename
img.save(get_file_path(session, session["text image path"])) #img.save(get_file_path(session, session["text image path"]))
print() #print()
print(session["text image path"]) #print(session["text image path"])
return render_text_template(scrollDown = True) return render_text_template(scrollDown = True)

107
templates/text.html
View file

@ -3,6 +3,7 @@
{% block head %} {% block head %}
<title>LabelPrinter Label generator</title> <title>LabelPrinter Label generator</title>
{% endblock %} {% endblock %}
{% block content %} {% block content %}
@ -17,32 +18,9 @@
</form> </form>
<form method="POST" action="/text-form"> <form method="POST" action="/text-form", id="text_form">
<h2>Top text</h2> <div id="input"> </div>
Text:<br>
<textarea name="string1">{{text1["string"]}}</textarea><br>
Size: <input type="number" value="{{text1["size"]}}" name="size1" min="0" required
style="width: 40px"><br>
Y position: <input type="number" value="{{text1["pos"]}}" name="pos1" required
style="width: 40px"><br>
{% if text1["bold"]%}
Bold: <input type="checkbox" name="bold1" value="bold1" checked>
{% else %}
Bold: <input type="checkbox" name="bold1" value="bold1">
{% endif %}
<h2>Bottom text</h2>
Text:<br>
<textarea name="string2">{{text2["string"]}}</textarea><br>
Size: <input type="number" value="{{text2["size"]}}" name="size2" min="0" required
style="width: 40px"><br>
Y position: <input type="number" value="{{text2["pos"]}}" name="pos2" required
style="width: 40px"><br>
{% if text2["bold"]%}
Bold: <input type="checkbox" name="bold2" value="bold2" checked>
{% else %}
Bold: <input type="checkbox" name="bold2" value="bold2">
{% endif %}
<h2>Font</h2> <h2>Font</h2>
<label for="font">Font:</label> <label for="font">Font:</label>
@ -75,6 +53,85 @@
</form> </form>
{% endif %} {% endif %}
<script>
const line_form = `<h2>[title]</h2>
Text:<br>
<textarea name="[text]">(text)</textarea><br>
Size: <input type="number" value="(size)" name="[size]" min="0" required
style="width: 40px"><br>
Y position: <input type="number" value="(y_pos)" name="[y_pos]" required
style="width: 40px"><br>`
const min_button = `<button type="button" onClick="remove_line()">-</button>`
const plus_button = `<button type="button" onClick="add_line()">+</button>`
function get_persistent(name, initial_value) {
if (localStorage.getItem(name) == null) {
localStorage.setItem(name, initial_value)
}
return localStorage.getItem(name)
}
function init_field(local_name, initial_value, i, html) {
html = html.replace("[" + local_name + "]", local_name + i);
html = html.replace("(" + local_name + ")", get_persistent(local_name + i, initial_value));
return html;
}
function generate_fields() {
let html = ""
let lineCnt = get_persistent("lineCount", 2);
for (let i = 0; i < lineCnt; i++) {
let modified_line_form = line_form;
modified_line_form
modified_line_form = modified_line_form.replace("[title]", "Line " + i);
modified_line_form = init_field("text", "Text", i, modified_line_form);
modified_line_form = init_field("size", 130, i, modified_line_form);
modified_line_form = init_field("y_pos", i*130, i, modified_line_form);
html += modified_line_form;
console.log(i);
}
if (lineCnt == 1) {
html += plus_button;
} else {
html += min_button + plus_button;
}
document.getElementById("input").innerHTML = html;
}
generate_fields()
const text_form = document.getElementById("text_form")
text_form.addEventListener('submit', function(e) {
e.preventDefault();
for (const element of text_form.elements) {
localStorage.setItem(element.name, element.value);
}
const lineCount = document.createElement('input');
lineCount.type = 'hidden';
lineCount.name = 'lineCount';
lineCount.value = localStorage.getItem("lineCount");
text_form.appendChild(lineCount);
text_form.submit();
});
function add_line() {
localStorage.setItem("lineCount", Number(localStorage.getItem("lineCount")) + 1);
generate_fields();
}
function remove_line() {
localStorage.setItem("lineCount", Number(localStorage.getItem("lineCount")) - 1);
generate_fields();
}
</script>
{% endblock %} {% endblock %}