diff --git a/groupTasks/groups/shx-product-label/index.html b/groupTasks/groups/shx-product-label/index.html index f67d12b..9ac6e0d 100644 --- a/groupTasks/groups/shx-product-label/index.html +++ b/groupTasks/groups/shx-product-label/index.html @@ -58,9 +58,12 @@ .content { max-width: 180px; + white-space: nowrap; + overflow: hidden; } - .product-color { + .product-variant { + /* display: inline-block; */ font-weight: 300; } @@ -68,7 +71,7 @@ margin-top: 10px; font-size: 14px; color: #464646; - font-weight: 300; + font-weight: 200; } .container { diff --git a/groupTasks/groups/shx-product-label/index.js b/groupTasks/groups/shx-product-label/index.js index dba12c7..36f5cb3 100644 --- a/groupTasks/groups/shx-product-label/index.js +++ b/groupTasks/groups/shx-product-label/index.js @@ -1,5 +1,5 @@ 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_ID = "{{PRODUCT_ID}}", // #32420 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", - PRODUCT_COLOR = "Farbe Grün/Blau/Orange", + PRODUCT_VARIANT = "Farbe Grün/Blau/Orange", PRODUCT_COLOR_CHARACTERISTICS = "(Glänzend)", PRODUCT_ID = "#32420"; */ @@ -30,22 +30,25 @@ window.onload = () => { const content = document.createElement("div"); content.className = "content"; - const productName = PRODUCT_NAME.split(" "); + const productName = PRODUCT_NAME.split("_"); const productNameFirst = document.createElement("h1"); productNameFirst.innerHTML = productName[0]; const productNameRemainingPart = document.createElement("h1"); - productNameRemainingPart.innerHTML = productName.slice(1).join(" "); + productNameRemainingPart.innerHTML = productName[1]; productNameRemainingPart.style = "margin: 0"; - const productColor = document.createElement("p"); - productColor.innerHTML = PRODUCT_COLOR; - productColor.className = "product-color"; + const productVariant = document.createElement("p"); + productVariant.innerHTML = PRODUCT_VARIANT; + productVariant.className = "product-variant"; const productColorCharacteristics = document.createElement("p"); - productColorCharacteristics.innerHTML = PRODUCT_COLOR_CHARACTERISTICS; - productColorCharacteristics.className = "product-color"; + productColorCharacteristics.innerHTML = + 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"); productId.innerHTML = PRODUCT_ID; @@ -53,7 +56,7 @@ window.onload = () => { content.appendChild(productNameFirst); content.appendChild(productNameRemainingPart); - content.appendChild(productColor); + content.appendChild(productVariant); content.appendChild(productColorCharacteristics); content.appendChild(productId); @@ -104,4 +107,21 @@ window.onload = () => { 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; }; diff --git a/groupTasks/groups/shx-product-label/index.json b/groupTasks/groups/shx-product-label/index.json index 448822d..29ebf3b 100644 --- a/groupTasks/groups/shx-product-label/index.json +++ b/groupTasks/groups/shx-product-label/index.json @@ -5,7 +5,7 @@ "tasks": [ { "name": "Produktschilder ausdrucken", - "onFinish": "pause", + "onFinish": "next", "undoPossible": false, "repeatPossible": true, "scriptPath": "script.py", @@ -20,20 +20,20 @@ "type": "select", "displayName": "Produkttyp auswählen", "options": [ - "#32420; Gizmo die Eidechse; Grün, Blau, Orange; (Glänzend)", - "#92784; Gizmo die Eidechse; Glitzer Grün; (Seidenmatt)", - "#36521; Charlie das Häschen; Hellbraun; (Matt)", - "#48273; Charlie das Häschen; Gold; (Glänzend)", - "#71936; Ruby die Schlange; Feuerrot; (Glänzend)", - "#58324; Ruby die Schlange; Rot/Blau; (Glänzend)", - "#21433; Bruno der Dino; Grün/Blau/Orange; (Glänzend)", - "#57953; Bruno der Dino; Rot/Blau; (Glänzend)", - "#90578; Bruno der Dino; Gold; (Glänzend)", - "#51563; Bruno der Dino; Himmelblau; (Fluoreszierend)", - "#23564; Flamara der Drache; Feuerrot; (Glänzend)", - "#51139; Flamara der Drache; Himmelblau; (Fluoreszierend)", - "#77970; Flamara der Drache; Gold; (Glänzend)", - "#32974; Finn der Sad Hamster; Standard; " + "#32420; Gizmo_die Eidechse; Farbe; Grün, Blau, Orange; (Glänzend)", + "#92784; Gizmo_die Eidechse; Farbe; Glitzer Grün; (Seidenmatt)", + "#36521; Charlie_das Häschen; Farbe; Hellbraun; (Matt)", + "#48273; Charlie_das Häschen; Farbe; Gold; (Glänzend)", + "#71936; Ruby_die Schlange; Farbe; Feuerrot; (Glänzend)", + "#58324; Ruby_die Schlange; Farbe; Rot/Blau; (Glänzend)", + "#21433; Bruno_der Dino; Farbe; Grün/Blau/Orange; (Glänzend)", + "#57953; Bruno_der Dino; Farbe; Rot/Blau; (Glänzend)", + "#90578; Bruno_der Dino; Farbe; Gold; (Glänzend)", + "#51563; Bruno_der Dino; Farbe; Himmelblau; (Fluoreszierend)", + "#23564; Flamara_der Drache; Farbe; Feuerrot; (Glänzend)", + "#51139; Flamara_der Drache; Farbe; Himmelblau; (Fluoreszierend)", + "#77970; Flamara_der Drache; Farbe; Gold; (Glänzend)", + "#32974; Finn der_Sad Hamster; Stil; Standard; " ], "global": false } diff --git a/groupTasks/groups/shx-product-label/script.py b/groupTasks/groups/shx-product-label/script.py index deb7770..92488b4 100644 --- a/groupTasks/groups/shx-product-label/script.py +++ b/groupTasks/groups/shx-product-label/script.py @@ -21,11 +21,11 @@ label_paper_position = label_paper_position["value"] 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_id": f"#{product_type_id}", "product_name": product_name, - "product_color": f"Farbe {product_color}", + "product_variant": product_variant, "product_color_characteristics": product_color_characteristics } @@ -38,7 +38,7 @@ for product in products: data = product.split("; ") # 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): command = [ @@ -80,7 +80,7 @@ if __name__ == "__main__": indexjs = indexjs.replace("{{PRODUCT_ID}}", product["product_id"]) 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("{{LABEL_PAPER_POSITION}}", label_paper_position)