Allow ticket QR code colour to be configured (#4726)

* Allow ticket QR code colour to be configured

This commit introduces a feature enabling users to customise the QR
code colour in the ticket editor.

* Remove redundant argument from `Dict.get` call

Co-authored-by: Raphael Michel <mail@raphaelmichel.de>

---------

Co-authored-by: Raphael Michel <mail@raphaelmichel.de>

src/pretix/base/pdf.py

@@ -822,6 +822,10 @@ class Renderer:
         kwargs = {}
         if o.get('nowhitespace', False):
             kwargs['barBorder'] = 0
+
+        if o.get('color'):
+            kwargs['barFillColor'] = Color(o['color'][0] / 255, o['color'][1] / 255, o['color'][2] / 255)
+
         qrw = QrCodeWidget(content, barLevel=level, barHeight=reqs, barWidth=reqs, **kwargs)
         d = Drawing(reqs, reqs)
         d.add(qrw)

src/pretix/control/templates/pretixcontrol/pdf/index.html

@@ -322,6 +322,17 @@
                                     id="toolbox-squaresize">
                         </div>
                     </div>
+                    <div class="row control-group squaresize">
+                        <div class="col-sm-12">
+                            <label for="toolbox-col">{% trans "QR color" %}</label><br>
+                            <div class="input-group">
+                                <input type="text" value="#000000" class="input-block-level form-control colorpickerfield"
+                                       id="toolbox-qrcolor">
+                                <span class="input-group-addon contrast-icon">
+                                </span>
+                            </div>
+                        </div>
+                    </div>
                     <div class="row control-group squaresize">
                         <div class="col-sm-12">
                             <div class="checkbox">

src/pretix/plugins/ticketoutputpdf/models.py

@@ -37,7 +37,13 @@ DEFAULT_TICKET_LAYOUT = '''[
         "content": "secret",
         "text": "",
         "text_i18n": {},
-        "nowhitespace": false
+        "nowhitespace": false,
+        "color": [
+            0,
+            0,
+            0,
+            1
+        ]
     },
     {
         "type": "poweredby",

src/pretix/static/pretixcontrol/js/ui/editor.js

@@ -313,6 +313,7 @@ var editor = {
                     content: o.content,
                 });
             } else  if (o.type === "barcodearea") {
+                col = (new fabric.Color(o.fill))._source;
                 d.push({
                     type: "barcodearea",
                     page: editor.pdf_page_number,
@@ -323,6 +324,7 @@ var editor = {
                     text: o.text,
                     text_i18n: o.text_i18n || {},
                     nowhitespace: o.nowhitespace || false,
+                    color: col,
                 });
             } else  if (o.type === "poweredby") {
                 d.push({
@@ -349,6 +351,10 @@ var editor = {
             o.content = d.content;
             o.scaleToHeight(editor._mm2px(d.size));
             o.nowhitespace = d.nowhitespace || false;
+            if (!d.color) {
+              d.color = [0, 0, 0, 1];
+            }
+            o.set('fill', 'rgb(' + d.color[0] + ',' + d.color[1] + ',' + d.color[2] + ')');
             if (d.content === "other") {
                 o.text = d.text
             } else if (d.content === "other_i18n") {
@@ -640,6 +646,8 @@ var editor = {
                 }));
             });
         } else if (o.type === "barcodearea") {
+            var col = (new fabric.Color(o.fill))._source;
+            $("#toolbox-qrcolor").val("#" + ((1 << 24) + (col[0] << 16) + (col[1] << 8) + col[2]).toString(16).slice(1));
             $("#toolbox-squaresize").val(editor._px2mm(o.height * o.scaleY).toFixed(2));
             $("#toolbox-qrwhitespace").prop("checked", o.nowhitespace || false);
         } else if (o.type === "imagearea") {
@@ -742,6 +750,7 @@ var editor = {
             o.set('scaleX', 1);
             o.set('scaleY', 1);
             o.set('top', new_top)
+            o.set('fill', $("#toolbox-qrcolor").val());
             o.nowhitespace = $("#toolbox-qrwhitespace").prop("checked") || false;
 
             $("#toolbox-content-other").toggle($("#toolbox-content").val() === "other");
@@ -1028,7 +1037,7 @@ var editor = {
             width: 100,
             height: 100,
             lockRotation: true,
-            fill: '#666',
+            fill: '#000',
             content: $(this).attr("data-content"),
             text: '',
             nowhitespace: true,

src/pretix/static/schema/pdf-layout.schema.json

@@ -80,6 +80,17 @@
           "nowhitespace": {
             "description": "Whether a barcode should be rendered without margins. Only used for type 'barcodearea'.",
             "type": "boolean"
+          },
+          "color": {
+            "description": "QR color as a tuple of three integers in the 0-255 range and one float in the 0-1 range. The last value (alpha) is ignored by the current implementation but might be used in the future.",
+            "type": "array",
+            "items": {
+              "type": "number",
+              "minimum": 0,
+              "maximum": 255
+            },
+            "minItems": 3,
+            "maxItems": 4
           }
         },
         "additionalProperties": false