From 75801bf95f6e621512baaa511263c649b9311e92 Mon Sep 17 00:00:00 2001 From: Anthony LC Date: Thu, 18 Apr 2024 16:39:47 +0200 Subject: [PATCH] =?UTF-8?q?=F0=9F=A4=A1(backend)=20add=20template=20editor?= =?UTF-8?q?=20json=20in=20demo?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit For the demo to be compatible with the new template editor, we need to add the json file that setup correctly the editor. We are able to read and use it, but not edit it, because the demo is in is_public mode. --- src/backend/demo/data/template/code.txt | 37 ++ .../demo/data/template/code_editor.json | 442 ++++++++++++++++++ src/backend/demo/data/template/css.txt | 95 ++++ .../demo/management/commands/create_demo.py | 108 +---- 4 files changed, 587 insertions(+), 95 deletions(-) create mode 100644 src/backend/demo/data/template/code.txt create mode 100644 src/backend/demo/data/template/code_editor.json create mode 100644 src/backend/demo/data/template/css.txt diff --git a/src/backend/demo/data/template/code.txt b/src/backend/demo/data/template/code.txt new file mode 100644 index 00000000..3fca627f --- /dev/null +++ b/src/backend/demo/data/template/code.txt @@ -0,0 +1,37 @@ + +
+
+
+
+ +
+
+
+ Direction
Interministérielle
du numérique +
+
+
+
+
+
La directrice
+
Réf: 12000001
+
+
+
Paris, le 28/09/2023
+
+
+
Note
à Monsieur Le Premier Ministre
+
Objet: Generated PDF
+
{{ body }}
+
+
+
+ Footer: Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do + eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim + veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea + commodo consequat +
+ diff --git a/src/backend/demo/data/template/code_editor.json b/src/backend/demo/data/template/code_editor.json new file mode 100644 index 00000000..b6fc8f2e --- /dev/null +++ b/src/backend/demo/data/template/code_editor.json @@ -0,0 +1,442 @@ +{ + "pages": [ + { + "id": "VlXkJzAStsYTLhwJ", + "type": "main", + "frames": [ + { + "id": "FZ0aEvTxwtxsFeIQ", + "component": { + "type": "wrapper", + "stylable": [ + "background", + "background-color", + "background-image", + "background-repeat", + "background-attachment", + "background-position", + "background-size" + ], + "attributes": { "id": "iubr" }, + "components": [ + { + "name": "Row", + "classes": [{ "name": "gjs-row", "private": 1 }], + "droppable": ".gjs-cell", + "resizable": { + "bl": 0, + "br": 0, + "cl": 0, + "cr": 0, + "tc": 0, + "tl": 0, + "tr": 0, + "minDim": 1 + }, + "attributes": { "id": "ix1a" }, + "components": [ + { + "name": "Cell", + "classes": [{ "name": "gjs-cell", "private": 1 }], + "draggable": ".gjs-row", + "resizable": { + "bc": 0, + "bl": 0, + "br": 0, + "cl": 0, + "cr": 1, + "tc": 0, + "tl": 0, + "tr": 0, + "step": 0.2, + "minDim": 1, + "currentUnit": 1 + }, + "attributes": { "id": "iqey" }, + "components": [ + { + "name": "Row", + "classes": [{ "name": "gjs-row", "private": 1 }], + "droppable": ".gjs-cell", + "resizable": { + "bl": 0, + "br": 0, + "cl": 0, + "cr": 0, + "tc": 0, + "tl": 0, + "tr": 0, + "minDim": 1 + }, + "attributes": { "id": "ip2l" }, + "components": [ + { + "name": "Cell", + "classes": [{ "name": "gjs-cell", "private": 1 }], + "draggable": ".gjs-row", + "resizable": { + "bc": 0, + "bl": 0, + "br": 0, + "cl": 0, + "cr": 1, + "tc": 0, + "tl": 0, + "tr": 0, + "step": 0.2, + "minDim": 1, + "currentUnit": 1 + }, + "attributes": { "id": "i9ps" }, + "components": [ + { + "type": "image", + "resizable": { "ratioDefault": 1 }, + "attributes": { + "id": "ioje", + "src": "https://upload.wikimedia.org/wikipedia/fr/7/72/Logo_du_Gouvernement_de_la_R%C3%A9publique_fran%C3%A7aise_%282020%29.svg" + } + } + ] + }, + { + "name": "Cell", + "classes": [{ "name": "gjs-cell", "private": 1 }], + "draggable": ".gjs-row", + "resizable": { + "bc": 0, + "bl": 0, + "br": 0, + "cl": 0, + "cr": 1, + "tc": 0, + "tl": 0, + "tr": 0, + "step": 0.2, + "minDim": 1, + "currentUnit": 1 + }, + "attributes": { "id": "ifn8" }, + "components": [ + { + "type": "text", + "attributes": { "id": "i1v9" }, + "components": [ + { + "type": "textnode", + "content": "Direction\n" + }, + { "void": true, "tagName": "br" }, + { + "type": "textnode", + "content": "Interministérielle\n" + }, + { "void": true, "tagName": "br" }, + { + "type": "textnode", + "content": "du numérique" + } + ] + } + ] + } + ], + "custom-name": "header" + }, + { + "name": "Row", + "classes": [{ "name": "gjs-row", "private": 1 }], + "droppable": ".gjs-cell", + "resizable": { + "bl": 0, + "br": 0, + "cl": 0, + "cr": 0, + "tc": 0, + "tl": 0, + "tr": 0, + "minDim": 1 + }, + "attributes": { "id": "ipfx3" }, + "components": [ + { + "name": "Cell", + "classes": [{ "name": "gjs-cell", "private": 1 }], + "draggable": ".gjs-row", + "resizable": { + "bc": 0, + "bl": 0, + "br": 0, + "cl": 0, + "cr": 1, + "tc": 0, + "tl": 0, + "tr": 0, + "step": 0.2, + "minDim": 1, + "currentUnit": 1 + }, + "attributes": { "id": "isc8e" }, + "components": [ + { + "type": "text", + "attributes": { "id": "ix7wo" }, + "components": [ + { + "type": "textnode", + "content": "La directrice" + } + ] + }, + { + "type": "text", + "attributes": { "id": "ij1wk" }, + "components": [ + { + "type": "textnode", + "content": "Réf: 12000001" + } + ] + } + ] + }, + { + "name": "Cell", + "classes": [{ "name": "gjs-cell", "private": 1 }], + "draggable": ".gjs-row", + "resizable": { + "bc": 0, + "bl": 0, + "br": 0, + "cl": 0, + "cr": 1, + "tc": 0, + "tl": 0, + "tr": 0, + "step": 0.2, + "minDim": 1, + "currentUnit": 1 + }, + "attributes": { "id": "iei3g" }, + "components": [ + { + "type": "text", + "attributes": { "id": "iwp89" }, + "components": [ + { + "type": "textnode", + "content": "Paris, le 28/09/2023" + } + ] + } + ] + } + ], + "custom-name": "sub-header" + }, + { + "type": "text", + "attributes": { "id": "i59gh" }, + "components": [ + { + "type": "text", + "tagName": "b", + "components": [ + { "type": "textnode", "content": "Note" } + ] + }, + { "void": true, "tagName": "br" }, + { + "type": "textnode", + "content": "à Monsieur Le Premier Ministre" + } + ], + "custom-name": "note" + }, + { + "type": "text", + "attributes": { "id": "i2egv" }, + "components": [ + { + "type": "textnode", + "content": "Objet: Generated PDF" + } + ], + "custom-name": "object" + }, + { + "type": "text", + "attributes": { "id": "icpsv" }, + "components": [ + { "type": "textnode", "content": "{{body}}" }, + { "void": true, "tagName": "br" } + ], + "custom-name": "body" + } + ] + } + ] + }, + { + "type": "text", + "attributes": { "id": "iqn81" }, + "components": [ + { + "type": "textnode", + "content": "Footer: Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat" + } + ] + } + ], + "custom-name": "Body" + } + } + ] + } + ], + "assets": [ + { + "src": "https://upload.wikimedia.org/wikipedia/fr/7/72/Logo_du_Gouvernement_de_la_R%C3%A9publique_fran%C3%A7aise_%282020%29.svg", + "type": "image", + "width": 0, + "height": 0, + "unitDim": "px" + } + ], + "styles": [ + { + "style": { + "width": "100%", + "display": "table", + "padding-top": "10px", + "padding-left": "10px", + "padding-right": "10px", + "padding-bottom": "10px" + }, + "selectors": [{ "name": "gjs-row", "private": 1 }] + }, + { + "style": { "width": "100%", "display": "block" }, + "mediaText": "(max-width: 768px)", + "selectors": [{ "name": "gjs-cell", "private": 1 }], + "atRuleType": "media" + }, + { + "style": { "width": "100%", "display": "block" }, + "mediaText": "(max-width: 768px)", + "selectors": ["gjs-cell30"], + "atRuleType": "media" + }, + { + "style": { "width": "100%", "display": "block" }, + "mediaText": "(max-width: 768px)", + "selectors": ["gjs-cell70"], + "atRuleType": "media" + }, + { + "style": { "width": "8%", "height": "75px", "display": "table-cell" }, + "selectors": [{ "name": "gjs-cell", "private": 1 }] + }, + { + "style": { "height": "100%", "padding": "0px 0px 0px 0px" }, + "selectors": ["#ix1a"] + }, + { + "style": { + "color": "black", + "width": "214px", + "height": "128px", + "margin": "0px 0px 0px -12px" + }, + "selectors": ["#ioje"] + }, + { + "style": { + "top": "-5px", + "float": "right", + "margin": "-13px 0px 0px 0px", + "display": "block", + "padding": "0px 10px 0px 0px", + "position": "relative", + "font-size": "19px", + "text-align": "right", + "font-family": "Arial Black, Gadget, sans-serif", + "font-weight": "800", + "line-height": "26px", + "letter-spacing": "0px" + }, + "selectors": ["#i1v9"] + }, + { "style": { "margin": "60px 0px 0px 0px" }, "selectors": ["#ipfx3"] }, + { + "style": { + "padding": "10px 10px 3px 0px", + "font-family": "Georgia, serif" + }, + "selectors": ["#ix7wo"] + }, + { + "style": { + "padding": "0px 10px 10px 0px", + "font-size": "12px", + "font-family": "Georgia, serif" + }, + "selectors": ["#ij1wk"] + }, + { + "style": { + "padding": "10px 0px 3px 10px", + "font-size": "14px", + "text-align": "right", + "font-family": "Georgia, serif" + }, + "selectors": ["#iwp89"] + }, + { + "style": { + "padding": "10px", + "font-size": "15px", + "font-family": "Georgia, serif" + }, + "selectors": ["#i59gh"] + }, + { + "style": { + "padding": "29px 10px 10px 10px", + "font-size": "20px", + "font-family": "Georgia, serif", + "font-weight": "900" + }, + "selectors": ["#i2egv"] + }, + { + "style": { + "padding": "30px 10px 10px 10px", + "font-family": "Georgia, serif" + }, + "selectors": ["#icpsv"] + }, + { "style": { "padding": "0px 0px 0px 0px" }, "selectors": ["#ifn8"] }, + { "style": { "padding": "0px 0px 0px 0px" }, "selectors": ["#ip2l"] }, + { + "style": { + "bottom": "0px", + "padding": "10px 10px 0px 10px", + "position": "fixed", + "font-size": "12px", + "font-family": "Georgia, serif" + }, + "selectors": ["#iqn81"] + }, + { + "style": { + "color": "#000000", + "border": "0px solid #f6f6f6", + "font-size": "15px", + "font-family": "\"Mercury SSm A\", \"Mercury SSm B\", Georgia, Times, \"Times New Roman\", \"Microsoft YaHei New\", \"Microsoft Yahei\", 微软雅黑, 宋体, SimSun, STXihei, 华文细黑, serif", + "background-color": "#fbfbfb" + }, + "selectors": ["#ilke6"] + } + ] +} diff --git a/src/backend/demo/data/template/css.txt b/src/backend/demo/data/template/css.txt new file mode 100644 index 00000000..41f2897e --- /dev/null +++ b/src/backend/demo/data/template/css.txt @@ -0,0 +1,95 @@ +* { + box-sizing: border-box; +} +body { + margin: 0; +} +.gjs-row { + width: 100%; + display: table; + padding-top: 10px; + padding-left: 10px; + padding-right: 10px; + padding-bottom: 10px; +} +.gjs-cell { + width: 8%; + height: 75px; + display: table-cell; +} +#ix1a { + height: 100%; + padding: 0px 0px 0px 0px; +} +#ioje { + color: black; + width: 214px; + height: 128px; + margin: 0px 0px 0px -12px; +} +#i1v9 { + top: -5px; + float: right; + margin: -13px 0px 0px 0px; + display: block; + padding: 0px 10px 0px 0px; + position: relative; + font-size: 19px; + text-align: right; + font-family: Arial Black, Gadget, sans-serif; + font-weight: 800; + line-height: 26px; + letter-spacing: 0px; +} +#ipfx3 { + margin: 60px 0px 0px 0px; +} +#ix7wo { + padding: 10px 10px 3px 0px; + font-family: Georgia, serif; +} +#ij1wk { + padding: 0px 10px 10px 0px; + font-size: 12px; + font-family: Georgia, serif; +} +#iwp89 { + padding: 10px 0px 3px 10px; + font-size: 14px; + text-align: right; + font-family: Georgia, serif; +} +#i59gh { + padding: 10px; + font-size: 15px; + font-family: Georgia, serif; +} +#i2egv { + padding: 29px 10px 10px 10px; + font-size: 20px; + font-family: Georgia, serif; + font-weight: 900; +} +#icpsv { + padding: 30px 10px 10px 10px; + font-family: Georgia, serif; +} +#ifn8 { + padding: 0px 0px 0px 0px; +} +#ip2l { + padding: 0px 0px 0px 0px; +} +#iqn81 { + bottom: 0px; + padding: 10px 10px 0px 10px; + position: fixed; + font-size: 12px; + font-family: Georgia, serif; +} +@media (max-width: 768px) { + .gjs-cell { + width: 100%; + display: block; + } +} diff --git a/src/backend/demo/management/commands/create_demo.py b/src/backend/demo/management/commands/create_demo.py index 0c572ff8..e78b4dcc 100644 --- a/src/backend/demo/management/commands/create_demo.py +++ b/src/backend/demo/management/commands/create_demo.py @@ -1,6 +1,7 @@ # ruff: noqa: S311, S106 """create_demo management command""" +import json import logging import random import time @@ -109,105 +110,22 @@ def create_demo(stdout): queue = BulkQueue(stdout) with Timeit(stdout, "Creating Template"): + with open("demo/data/template/code_editor.json", "r") as file: + json_data = json.load(file) + + with open("demo/data/template/code.txt", "r") as text_file: + code_data = text_file.read() + + with open("demo/data/template/css.txt", "r") as text_file: + css_data = text_file.read() + queue.push( models.Template( - id="472d0633-20b8-4cb1-998a-1134ade092ba", title="Demo Template", description="This is the demo template", - code=""" - -
- -

Direction
Interministérielle
du numérique

-
-
-
-
La directrice
-

Réf: 1200001

-
-
Paris, le 28/09/2023
-
-
-

Note

-
à Monsieur le Premier Ministre
-
- -
-
Objet: Generated PDF
-
{{ body }}
-
- -""", - css=""" -body { - background: white; - font-family: arial -} - -img { - width: 5cm; - margin-left: -0.4cm; -} - -.header { - display: flex; - justify-content: space-between; -} - -.header-title { - text-align: right; - margin-top: 3rem; - font-size: 1.2rem; -} - -.second-row { - display: flex; - justify-content: space-between; - margin-top: 1.2cm; -} - -.ref { - margin-top: 0; -} - -.who { - font-weight: medium; -} - -.date, .ref { - font-size: 12px; -} - -.title, .subtitle { - margin: 0; -} - -.subtitle { - font-weight: normal; -} - -.object { - font-weight: bold; - margin-bottom: 1.2cm; - margin-top: 3rem -} -.body{ - margin-top: 1.5rem -} - -h1 { - font-size: 18px; -} - -h2 { - font-size: 14px; -} - -p { - text-align: justify; - ligne-height: 0.8; -} -""", + code_editor=json_data, + code=code_data, + css=css_data, is_public=True, ) )