feat: more watermark settings

api.py

@@ -1,12 +1,18 @@
+import logging
 from io import BytesIO
-from random import randint
 
-from PIL import Image, ImageDraw, ImageFont
+from PIL import Image
 from flask import Flask, request, send_file, abort
 from flask_cors import CORS
 from flask_limiter import Limiter
 
 from recipe import parse_ingredients, run_action
+from watermark import parse_watermark
+
+logging.basicConfig(
+    format='%(asctime)s %(levelname)-8s %(message)s',
+    level=logging.INFO,
+    datefmt='%Y-%m-%d %H:%M:%S')
 
 app = Flask(__name__)
 CORS(app)
@@ -28,11 +34,13 @@ def get_remote_address():
 def upload():
     try:
         quality = int(request.form.get('quality', '10'))
-        watermark_size = int(request.form.get('watermark_size', '18'))
     except ValueError:
         return abort(400, "Cannot parse parameter/s")
-    randomize_position = request.form.get('randomize', 'off') == "on"
-    watermark = request.form.get('watermark', 'off') == "on"
+
+    try:
+        watermark = parse_watermark(request.form.get('watermark', ''))
+    except Exception as e:
+        return abort(400, "Cannot parse watermark", e)
 
     try:
         ingredients = parse_ingredients(request.form.get('ingredients', '[]'))
@@ -48,38 +56,19 @@ def upload():
     except Exception:
         return abort(400, "The file you uploaded does not appear to be a valid image.")
 
-    print("[Info]", get_remote_address(), "requested to enhance '",
-          body_image.name, "' to quality =", quality, "with watermark/randomize =", watermark, randomize_position)
+    logging.info(f"{get_remote_address()} requested to enhance to " +
+                 f"quality = {quality} with watermark = {str(watermark)}")
 
     # discard alpha channel (since JPEG can't handle alpha)
     if img.mode != "RGB":
-        print("  [Debug] The uploaded image is not RGB. trying to convert.")
+        logging.info("  >> The uploaded image is not RGB. trying to convert.")
         try:
             img = img.convert("RGB")
         except Exception:
             return abort(400, "cannot convert image to RGB")
 
     # add watermark
-    if watermark:
-        draw = ImageDraw.Draw(img)
-        text = "jpeg.qwer.tz"
-        font = ImageFont.truetype("arial.ttf", watermark_size)
-
-        text_width, text_height = draw.textsize(text, font)
-
-        if randomize_position:
-            text_position = (randint(20, img.width - text_width - 20), randint(10, img.height - text_height - 10))
-        else:
-            text_position = ((img.width - text_width) - 20, (img.height - text_height) - 10)
-        print("  [Debug] Watermark position:", text_position)
-
-        background_position = (text_position[0] - 10, text_position[1] - 5)
-        background_dimensions = (text_width + 20, text_height + 10)
-
-        draw.rectangle([background_position, (
-            background_position[0] + background_dimensions[0], background_position[1] + background_dimensions[1])],
-                       fill="red")
-        draw.text(text_position, text, font=font, fill="yellow")
+    img = watermark.paint(img)
 
     # run ingredients
     for ingredient in ingredients:
@@ -92,7 +81,7 @@ def upload():
     out = BytesIO()
     img.save(out, 'JPEG', quality=quality)
     out.seek(0)
-    print("  [Debug] Image enhanced to", out.getbuffer().nbytes, "bytes")
+    logging.info(f"  >> Image enhanced to {out.getbuffer().nbytes} bytes")
 
     return send_file(out, mimetype="image/jpeg")
 

frontend/package.json

@@ -14,13 +14,15 @@
     "framer-motion": "^10.16.4",
     "next": "14.0.1",
     "react": "^18",
+    "react-color": "^2.19.3",
     "react-compare-slider": "^3.0.1",
     "react-dom": "^18",
     "react-icons": "^4.11.0"
   },
   "devDependencies": {
     "@types/node": "^20",
     "@types/react": "^18",
+    "@types/react-color": "^3.0.9",
     "@types/react-dom": "^18",
     "autoprefixer": "^10.0.1",
     "eslint": "^8",