From 426f312bfea41d06280e15614d64480710a3fdf0 Mon Sep 17 00:00:00 2001
From: Botond Hende <contact@wazul.moe>
Date: Wed, 6 May 2026 21:30:21 +0200
Subject: wallpaper on root domain

---
 main/assets/css/main.css         |  6 +++
 main/assets/js/main.js           | 80 ++++++++++++++++++++++++++++++++++++++++
 main/templates/main_base.html.j2 |  9 ++++-
 3 files changed, 93 insertions(+), 2 deletions(-)
 create mode 100644 main/assets/css/main.css
 create mode 100644 main/assets/js/main.js

(limited to 'main')

diff --git a/main/assets/css/main.css b/main/assets/css/main.css
new file mode 100644
index 0000000..856b5ab
--- /dev/null
+++ b/main/assets/css/main.css
@@ -0,0 +1,6 @@
+canvas.canvas_bg {
+    position: fixed;
+    top: 0;
+    left: 0;
+    z-index: -1;
+}
\ No newline at end of file
diff --git a/main/assets/js/main.js b/main/assets/js/main.js
new file mode 100644
index 0000000..de090d1
--- /dev/null
+++ b/main/assets/js/main.js
@@ -0,0 +1,80 @@
+"use strict"
+const canvas_bg = document.getElementById("canvas_bg");
+const ctx = canvas_bg.getContext("2d");
+const ORANGE_COLOR = "#fe8b00ff";
+const WHITE_COLOR = "#ffffffff";
+const CELL_WIDTH = 256;
+
+const WALLPAPER_FONT = "30px Arial";
+const WALLPAPER_COL = 30;
+const WALLPAPER_ROW = 50;
+
+const UNDERLINE_COL_START = 25;
+const UNDERLINE_COL_END = CELL_WIDTH - UNDERLINE_COL_START;
+const UNDERLINE_ROW = 60;
+
+const SIZE_TEXT_FONT = "36px Arial";
+const SIZE_TEXT_COL = 25;
+const SIZE_TEXT_ROW = 96;
+
+function drawCanvasBg() {
+    ctx.clearRect(0, 0, canvas_bg.width, canvas_bg.height);
+    ctx.fillStyle = ORANGE_COLOR;
+    ctx.fillRect(0, 0, canvas_bg.width, canvas_bg.height);
+
+    var largerSize = Math.max(canvas_bg.width, canvas_bg.height);
+    var width = Math.max(3, Math.ceil(largerSize / 1000) + 1);
+
+    ctx.fillStyle = WHITE_COLOR;
+    ctx.fillRect(0, 0, width, canvas_bg.height);
+    ctx.fillRect(0, 0, canvas_bg.width, width);
+    ctx.fillRect(canvas_bg.width - width, 0, canvas_bg.width, canvas_bg.height);
+    ctx.fillRect(0, canvas_bg.height - width, canvas_bg.width, canvas_bg.height);
+
+    var lineWidth = 1;
+    var lineOffset = 0.5;
+    if (largerSize > 5000) {
+        lineWidth = 2;
+        lineOffset = 0;
+    }
+
+    ctx.strokeStyle = WHITE_COLOR;
+    ctx.lineWidth = lineWidth;
+
+    var currentColPos = CELL_WIDTH + lineOffset;
+
+    while (currentColPos < canvas_bg.width) {
+        ctx.moveTo(currentColPos, 0);
+        ctx.lineTo(currentColPos, canvas_bg.height);
+        ctx.stroke();
+        currentColPos += CELL_WIDTH;
+    }
+
+    var currentRowPos = CELL_WIDTH + lineOffset;
+
+    while (currentRowPos < canvas_bg.height) {
+        ctx.moveTo(0, currentRowPos);
+        ctx.lineTo(canvas_bg.width, currentRowPos);
+        ctx.stroke();
+        currentRowPos += CELL_WIDTH;
+    }
+
+    ctx.font = WALLPAPER_FONT;
+    ctx.fillText("WALLPAPER", WALLPAPER_COL, WALLPAPER_ROW);
+
+    ctx.moveTo(UNDERLINE_COL_START + lineOffset, UNDERLINE_ROW);
+    ctx.lineTo(UNDERLINE_COL_END + lineOffset, UNDERLINE_ROW);
+    ctx.stroke();
+
+    ctx.font = SIZE_TEXT_FONT;
+    ctx.fillText(canvas_bg.width + "x" + canvas_bg.height, SIZE_TEXT_COL, SIZE_TEXT_ROW);
+}
+
+function onResize() {
+    canvas_bg.width = window.innerWidth;
+    canvas_bg.height = window.innerHeight;
+    drawCanvasBg();
+}
+
+onResize();
+window.addEventListener("resize", onResize);
\ No newline at end of file
diff --git a/main/templates/main_base.html.j2 b/main/templates/main_base.html.j2
index 6eb6f91..6bac9c3 100644
--- a/main/templates/main_base.html.j2
+++ b/main/templates/main_base.html.j2
@@ -1,5 +1,10 @@
 {% extends "base.html.j2" %}
 {% block page_title %}{{ main.main_name }}{% endblock %}
 {% block og_page_title %}{{ main.main_name }}{% endblock %}
-{% block body %}{{ super() }}
-<p>Hello world.</p>{% endblock %}
+{% block head_extra %}{{ super() }}
+    <link rel="stylesheet" href="{{ site.assets_path }}/css/main.css" />{% endblock %}
+{% block body %}<canvas id="canvas_bg" class="canvas_bg"></canvas>
+{{ super() }}
+<footer>
+    <script src="/assets/js/main.js"></script>
+</footer>{% endblock %}
-- 
cgit v1.3