Jannex
/
admin-dashboard-backend
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

dynamic font size

main
alex 2024-05-18 18:59:33 +02:00
parent 490e414732
commit cfc93e5d37
4 changed files with 54 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
groupTasks/groups/shx-product-label/index.html
View File

@ -58,9 +58,12 @@
.content { .content {
max-width: 180px; max-width: 180px;
white-space: nowrap;
overflow: hidden;
} }
.product-color { .product-variant {
/* display: inline-block; */
font-weight: 300; font-weight: 300;
} }
@ -68,7 +71,7 @@
margin-top: 10px; margin-top: 10px;
font-size: 14px; font-size: 14px;
color: #464646; color: #464646;
font-weight: 300; font-weight: 200;
} }
.container { .container {

40
groupTasks/groups/shx-product-label/index.js
View File

@ -1,5 +1,5 @@
const PRODUCT_NAME = "{{PRODUCT_NAME}}", // Gizmo die Eidechse const PRODUCT_NAME = "{{PRODUCT_NAME}}", // Gizmo die Eidechse
PRODUCT_COLOR = "{{PRODUCT_COLOR}}", // Farbe Grün/Blau/Orange PRODUCT_VARIANT = "{{PRODUCT_VARIANT}}", // Farbe Grün/Blau/Orange or Stil Standard
PRODUCT_COLOR_CHARACTERISTICS = "{{PRODUCT_COLOR_CHARACTERISTICS}}", // (Glänzend) PRODUCT_COLOR_CHARACTERISTICS = "{{PRODUCT_COLOR_CHARACTERISTICS}}", // (Glänzend)
PRODUCT_ID = "{{PRODUCT_ID}}", // #32420 PRODUCT_ID = "{{PRODUCT_ID}}", // #32420
LABEL_PAPER_POSITION = "{{LABEL_PAPER_POSITION}}"; // could be a number between 1 and 12 or combination like 1,3,7 LABEL_PAPER_POSITION = "{{LABEL_PAPER_POSITION}}"; // could be a number between 1 and 12 or combination like 1,3,7
@ -8,7 +8,7 @@ const labelPaperPosition = LABEL_PAPER_POSITION.split(",");
/* /*
const PRODUCT_NAME = "Gizmo die Eidechse", const PRODUCT_NAME = "Gizmo die Eidechse",
PRODUCT_COLOR = "Farbe Grün/Blau/Orange", PRODUCT_VARIANT = "Farbe Grün/Blau/Orange",
PRODUCT_COLOR_CHARACTERISTICS = "(Glänzend)", PRODUCT_COLOR_CHARACTERISTICS = "(Glänzend)",
PRODUCT_ID = "#32420"; */ PRODUCT_ID = "#32420"; */
@ -30,22 +30,25 @@ window.onload = () => {
const content = document.createElement("div"); const content = document.createElement("div");
content.className = "content"; content.className = "content";
const productName = PRODUCT_NAME.split(" "); const productName = PRODUCT_NAME.split("_");
const productNameFirst = document.createElement("h1"); const productNameFirst = document.createElement("h1");
productNameFirst.innerHTML = productName[0]; productNameFirst.innerHTML = productName[0];
const productNameRemainingPart = document.createElement("h1"); const productNameRemainingPart = document.createElement("h1");
productNameRemainingPart.innerHTML = productName.slice(1).join(" "); productNameRemainingPart.innerHTML = productName[1];
productNameRemainingPart.style = "margin: 0"; productNameRemainingPart.style = "margin: 0";
const productColor = document.createElement("p"); const productVariant = document.createElement("p");
productColor.innerHTML = PRODUCT_COLOR; productVariant.innerHTML = PRODUCT_VARIANT;
productColor.className = "product-color"; productVariant.className = "product-variant";
const productColorCharacteristics = document.createElement("p"); const productColorCharacteristics = document.createElement("p");
productColorCharacteristics.innerHTML = PRODUCT_COLOR_CHARACTERISTICS; productColorCharacteristics.innerHTML =
productColorCharacteristics.className = "product-color"; PRODUCT_COLOR_CHARACTERISTICS == ""
? "\u200B" // /* Zero-Width Space needed for product variants like Standard which have no color characteristics */
: PRODUCT_COLOR_CHARACTERISTICS;
productColorCharacteristics.className = "product-variant";
const productId = document.createElement("p"); const productId = document.createElement("p");
productId.innerHTML = PRODUCT_ID; productId.innerHTML = PRODUCT_ID;
@ -53,7 +56,7 @@ window.onload = () => {
content.appendChild(productNameFirst); content.appendChild(productNameFirst);
content.appendChild(productNameRemainingPart); content.appendChild(productNameRemainingPart);
content.appendChild(productColor); content.appendChild(productVariant);
content.appendChild(productColorCharacteristics); content.appendChild(productColorCharacteristics);
content.appendChild(productId); content.appendChild(productId);
@ -104,4 +107,21 @@ window.onload = () => {
labels.appendChild(label); labels.appendChild(label);
} }
function adjustFontSize() {
const container = document.getElementsByClassName("product-variant")[0];
const text = document.getElementById("text");
const containerWidth = container.offsetWidth;
let fontSize = 100; // Startgröße in Prozent
text.style.fontSize = fontSize + "%";
// Reduziere die Schriftgröße, bis der Text in den Container passt
while (text.offsetWidth > containerWidth && fontSize > 1) {
fontSize--;
text.style.fontSize = fontSize + "%";
}
}
window.onload = adjustFontSize;
window.onresize = adjustFontSize;
}; };

30
groupTasks/groups/shx-product-label/index.json
View File

@ -5,7 +5,7 @@
"tasks": [ "tasks": [
{ {
"name": "Produktschilder ausdrucken", "name": "Produktschilder ausdrucken",
"onFinish": "pause", "onFinish": "next",
"undoPossible": false, "undoPossible": false,
"repeatPossible": true, "repeatPossible": true,
"scriptPath": "script.py", "scriptPath": "script.py",
@ -20,20 +20,20 @@
"type": "select", "type": "select",
"displayName": "Produkttyp auswählen", "displayName": "Produkttyp auswählen",
"options": [ "options": [
"#32420; Gizmo die Eidechse; Grün, Blau, Orange; (Glänzend)", "#32420; Gizmo_die Eidechse; Farbe; Grün, Blau, Orange; (Glänzend)",
"#92784; Gizmo die Eidechse; Glitzer Grün; (Seidenmatt)", "#92784; Gizmo_die Eidechse; Farbe; Glitzer Grün; (Seidenmatt)",
"#36521; Charlie das Häschen; Hellbraun; (Matt)", "#36521; Charlie_das Häschen; Farbe; Hellbraun; (Matt)",
"#48273; Charlie das Häschen; Gold; (Glänzend)", "#48273; Charlie_das Häschen; Farbe; Gold; (Glänzend)",
"#71936; Ruby die Schlange; Feuerrot; (Glänzend)", "#71936; Ruby_die Schlange; Farbe; Feuerrot; (Glänzend)",
"#58324; Ruby die Schlange; Rot/Blau; (Glänzend)", "#58324; Ruby_die Schlange; Farbe; Rot/Blau; (Glänzend)",
"#21433; Bruno der Dino; Grün/Blau/Orange; (Glänzend)", "#21433; Bruno_der Dino; Farbe; Grün/Blau/Orange; (Glänzend)",
"#57953; Bruno der Dino; Rot/Blau; (Glänzend)", "#57953; Bruno_der Dino; Farbe; Rot/Blau; (Glänzend)",
"#90578; Bruno der Dino; Gold; (Glänzend)", "#90578; Bruno_der Dino; Farbe; Gold; (Glänzend)",
"#51563; Bruno der Dino; Himmelblau; (Fluoreszierend)", "#51563; Bruno_der Dino; Farbe; Himmelblau; (Fluoreszierend)",
"#23564; Flamara der Drache; Feuerrot; (Glänzend)", "#23564; Flamara_der Drache; Farbe; Feuerrot; (Glänzend)",
"#51139; Flamara der Drache; Himmelblau; (Fluoreszierend)", "#51139; Flamara_der Drache; Farbe; Himmelblau; (Fluoreszierend)",
"#77970; Flamara der Drache; Gold; (Glänzend)", "#77970; Flamara_der Drache; Farbe; Gold; (Glänzend)",
"#32974; Finn der Sad Hamster; Standard; " "#32974; Finn der_Sad Hamster; Stil; Standard; "
], ],
"global": false "global": false
} }

8
groupTasks/groups/shx-product-label/script.py
View File

@ -21,11 +21,11 @@ label_paper_position = label_paper_position["value"]
product_type_ids = {} product_type_ids = {}
def add_product_type_id(product_type_id, product_name, product_color, product_color_characteristics): def add_product_type_id(product_type_id, product_name, product_variant, product_color_characteristics):
product_type_ids[product_type_id] = { product_type_ids[product_type_id] = {
"product_id": f"#{product_type_id}", "product_id": f"#{product_type_id}",
"product_name": product_name, "product_name": product_name,
"product_color": f"Farbe {product_color}", "product_variant": product_variant,
"product_color_characteristics": product_color_characteristics "product_color_characteristics": product_color_characteristics
} }
@ -38,7 +38,7 @@ for product in products:
data = product.split("; ") data = product.split("; ")
# remove the # on the start # remove the # on the start
add_product_type_id(data[0][1:], data[1], data[2], data[3]) add_product_type_id(data[0][1:], data[1], data[2] + " " + data[3], data[4])
def createPdf(sourceHtml, outputPdf): def createPdf(sourceHtml, outputPdf):
command = [ command = [
@ -80,7 +80,7 @@ if __name__ == "__main__":
indexjs = indexjs.replace("{{PRODUCT_ID}}", product["product_id"]) indexjs = indexjs.replace("{{PRODUCT_ID}}", product["product_id"])
indexjs = indexjs.replace("{{PRODUCT_NAME}}", product["product_name"]) indexjs = indexjs.replace("{{PRODUCT_NAME}}", product["product_name"])
indexjs = indexjs.replace("{{PRODUCT_COLOR}}", product["product_color"]) indexjs = indexjs.replace("{{PRODUCT_VARIANT}}", product["product_variant"])
indexjs = indexjs.replace("{{PRODUCT_COLOR_CHARACTERISTICS}}", product["product_color_characteristics"]) indexjs = indexjs.replace("{{PRODUCT_COLOR_CHARACTERISTICS}}", product["product_color_characteristics"])
indexjs = indexjs.replace("{{LABEL_PAPER_POSITION}}", label_paper_position) indexjs = indexjs.replace("{{LABEL_PAPER_POSITION}}", label_paper_position)