Steps towards a full UI

 * Add /index.html, /index.js, /metadata.json endpoints
 * metadata.json gives each property and its range of values
 * add property2 to set properties on pycam.camera (yes it stinks)

now I can start creating the amateur-hour web UI on top of this

Author: jepler

examples/ipcam2/code.py

@@ -1,17 +1,20 @@
-import espcamera
+import json
 import os
+import struct
 import sys
 import time
-import struct
-import board
+
 import adafruit_pycamera
+import bitmaptools
+import board
 import displayio
+import espcamera
 import gifio
-import ulab.numpy as np
-import bitmaptools
 import socketpool
+import ulab.numpy as np
 import wifi
-from adafruit_httpserver import Server, Request, Response, GET, POST
+from adafruit_httpserver import (BAD_REQUEST_400, GET, NOT_FOUND_404, POST, FileResponse,
+                                 JSONResponse, Request, Response, Server)
 
 pycam = adafruit_pycamera.PyCamera()
 pycam.autofocus_init()
@@ -27,52 +30,77 @@
 print(wifi.radio.ipv4_address)
 
 pool = socketpool.SocketPool(wifi.radio)
-server = Server(pool, debug=True)
+server = Server(pool, debug=True, root_path='/htdocs')
+
+@server.route("/metadata.json", [GET])
+def property(request: Request) -> Response:
+    return FileResponse(request, "/metadata.json")
+
+@server.route("/", [GET])
+def property(request: Request) -> Response:
+    return FileResponse(request, "/index.html")
+
+@server.route("/index.js", [GET])
+def property(request: Request) -> Response:
+    return FileResponse(request, "/index.js")
+
 
 @server.route("/lcd", [GET, POST])
 def property(request: Request) -> Response:
     pycam.blit(pycam.continuous_capture())
     return Response(request, "")
 
+
 @server.route("/jpeg", [GET, POST])
 def property(request: Request) -> Response:
     pycam.camera.reconfigure(
         pixel_format=espcamera.PixelFormat.JPEG,
-        frame_size=pycam.resolution_to_frame_size[pycam._resolution]
+        frame_size=pycam.resolution_to_frame_size[pycam._resolution],
     )
     try:
         jpeg = pycam.camera.take(1)
         if jpeg is not None:
             return Response(request, bytes(jpeg), content_type="image/jpeg")
         else:
-            return Response(request, "", content_type="text/plain", status=INTERNAL_SERVER_ERROR_500)
+            return Response(
+                request, "", content_type="text/plain", status=INTERNAL_SERVER_ERROR_500
+            )
     finally:
         pycam.live_preview_mode()
 
+@server.route("/focus", [GET])
+def focus(request: Request) -> Response:
+    return JSONResponse(request, pycam.autofocus())
+
 @server.route("/property", [GET, POST])
 def property(request: Request) -> Response:
-    enctype = request.query_params.get("enctype", "text/plain")
+    return property_common(pycam, request)
+
+
+@server.route("/property2", [GET, POST])
+def property2(request: Request) -> Response:
+    return property_common(pycam.camera, request)
+
 
-    key = request.form_data.get("k")
-    value = request.form_data.get("v", None)
-        
+def property_common(obj, request):
     try:
-        current_value = getattr(pycam, key, None)
+        params = request.query_params or request.form_data
+        key = params["k"]
+        value = params.get("v", None)
+
+        if value is None:
+            try:
+                current_value = getattr(obj, key, None)
+                return JSONResponse(request, current_value)
+            except Exception as e:
+                return Response(request, {'error': str(e)}, status=BAD_REQUEST_400)
+        else:
+            new_value = json.loads(value)
+            setattr(obj, key, new_value)
+            return JSONResponse(request, {'status': 'OK'})
     except Exception as e:
-        return Response(request, str(e), status=NOT_FOUND_404)
+        return JSONResponse(request, {'error': str(e)}, status=BAD_REQUEST_400)
 
-    if value is None:
-        return Response(request, str(current_value))
-    else:
-        try:
-            current_value_type = type(current_value)
-            if current_value_type is bool:
-                setattr(pycam, key, value not in ('False', '0', 'no', 'n', 'off', ''))
-            else:
-                setattr(pycam, key, current_value_type(value))
-            return Response(request, "")
-        except Exception as e:
-            return Response(request, str(e), status=BAD_REQUEST_400)
 
 server.serve_forever(str(wifi.radio.ipv4_address), port)
 
@@ -82,18 +110,21 @@ def property(request: Request) -> Response:
 last_frame = displayio.Bitmap(pycam.camera.width, pycam.camera.height, 65535)
 onionskin = displayio.Bitmap(pycam.camera.width, pycam.camera.height, 65535)
 while True:
-    if  (pycam.mode_text == "STOP" and pycam.stop_motion_frame != 0):
+    if pycam.mode_text == "STOP" and pycam.stop_motion_frame != 0:
         # alpha blend
         new_frame = pycam.continuous_capture()
-        bitmaptools.alphablend(onionskin, last_frame, new_frame,
-                               displayio.Colorspace.RGB565_SWAPPED)
+        bitmaptools.alphablend(
+            onionskin, last_frame, new_frame, displayio.Colorspace.RGB565_SWAPPED
+        )
         pycam.blit(onionskin)
     else:
         pycam.blit(pycam.continuous_capture())
-    #print("\t\t", capture_time, blit_time)
+    # print("\t\t", capture_time, blit_time)
 
     pycam.keys_debounce()
-    print(f"{pycam.shutter.released=} {pycam.shutter.long_press=} {pycam.shutter.short_count=}")
+    print(
+        f"{pycam.shutter.released=} {pycam.shutter.long_press=} {pycam.shutter.short_count=}"
+    )
     # test shutter button
     if pycam.shutter.long_press:
         print("FOCUS")
@@ -118,26 +149,31 @@ def property(request: Request) -> Response:
 
         if pycam.mode_text == "GIF":
             try:
-               f = pycam.open_next_image("gif")
+                f = pycam.open_next_image("gif")
             except RuntimeError as e:
-               pycam.display_message("Error\nNo SD Card", color=0xFF0000)
-               time.sleep(0.5)
-               continue
+                pycam.display_message("Error\nNo SD Card", color=0xFF0000)
+                time.sleep(0.5)
+                continue
             i = 0
             ft = []
             pycam._mode_label.text = "RECORDING"
 
             pycam.display.refresh()
-            with gifio.GifWriter(f, pycam.camera.width, pycam.camera.height,
-                                 displayio.Colorspace.RGB565_SWAPPED, dither=True) as g:
+            with gifio.GifWriter(
+                f,
+                pycam.camera.width,
+                pycam.camera.height,
+                displayio.Colorspace.RGB565_SWAPPED,
+                dither=True,
+            ) as g:
                 t00 = t0 = time.monotonic()
                 while (i < 15) or (pycam.shutter_button.value == False):
                     i += 1
                     _gifframe = pycam.continuous_capture()
-                    g.add_frame(_gifframe, .12)
+                    g.add_frame(_gifframe, 0.12)
                     pycam.blit(_gifframe)
                     t1 = time.monotonic()
-                    ft.append(1/(t1-t0))
+                    ft.append(1 / (t1 - t0))
                     print(end=".")
                     t0 = t1
             pycam._mode_label.text = "GIF"
@@ -195,18 +231,17 @@ def property(request: Request) -> Response:
         print("LF")
         curr_setting = (curr_setting + 1) % len(settings)
         print(settings[curr_setting])
-        #new_res = min(len(pycam.resolutions)-1, pycam.get_resolution()+1)
-        #pycam.set_resolution(pycam.resolutions[new_res])
+        # new_res = min(len(pycam.resolutions)-1, pycam.get_resolution()+1)
+        # pycam.set_resolution(pycam.resolutions[new_res])
         pycam.select_setting(settings[curr_setting])
     if pycam.right.fell:
         print("RT")
         curr_setting = (curr_setting - 1 + len(settings)) % len(settings)
         print(settings[curr_setting])
         pycam.select_setting(settings[curr_setting])
-        #new_res = max(1, pycam.get_resolution()-1)
-        #pycam.set_resolution(pycam.resolutions[new_res])
+        # new_res = max(1, pycam.get_resolution()-1)
+        # pycam.set_resolution(pycam.resolutions[new_res])
     if pycam.select.fell:
         print("SEL")
     if pycam.ok.fell:
         print("OK")
-

examples/ipcam2/htdocs/metadata.json

@@ -0,0 +1 @@
+{"property": {"effect": ["Normal", "Invert", "B&W", "Reddish", "Greenish", "Bluish", "Sepia", "Solarize"], "resolution": ["240x240", "320x240", "640x480", "800x600", "1024x768", "1280x720", "1280x1024", "1600x1200", "1920x1080", "2048x1536", "2560x1440", "2560x1600", "2560x1920"], "led_level": [0, 1, 2, 3, 4], "led_color": [0, 1, 2, 3, 4, 5, 6, 7]}, "property2": {"sensor_name": null, "contrast": [-2, -1, 0, 1, 2], "brightness": [-2, -1, 0, 1, 2], "saturation": [-2, -1, 0, 1, 2], "sharpness": [-2, -1, 0, 1, 2], "ae_level": [-2, -1, 0, 1, 2], "denoise": [0, 1, 2, 3, 4, 5, 6, 7, 8, 9], "gain_ceiling": [0, 1, 2, 3, 4, 5, 6, 7, 8, 9], "quality": [8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35], "colorbar": [false, true], "whitebal": [false, true], "gain_ctrl": [false, true], "exposure_ctrl": [false, true], "hmirror": [false, true], "vflip": [false, true], "aec2": [false, true], "awb_gain": [false, true], "dcw": [false, true], "bpc": [false, true], "wpc": [false, true], "raw_gma": [false, true], "lenc": [false, true], "aec_gain": [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29], "aec_value": [0, 50, 100, 150, 200, 250, 300, 350, 400, 450, 500, 550, 600, 650, 700, 750, 800, 850, 900, 950, 1000, 1050, 1100, 1150], "wb_mode": [0, 1, 2, 3, 4]}}

examples/ipcam2/make_web_metadata.py

@@ -0,0 +1,65 @@
+import json
+
+def list_range(*args): return list(range(*args))
+
+metadata = {
+    "property": {
+        "effect": (
+            "Normal",
+            "Invert",
+            "B&W",
+            "Reddish",
+            "Greenish",
+            "Bluish",
+            "Sepia",
+            "Solarize",
+        ),
+        "resolution": (
+            "240x240",
+            "320x240",
+            "640x480",
+            "800x600",
+            "1024x768",
+            "1280x720",
+            "1280x1024",
+            "1600x1200",
+            "1920x1080",
+            "2048x1536",
+            "2560x1440",
+            "2560x1600",
+            "2560x1920",
+        ),
+        "led_level": list_range(5),
+        "led_color": list_range(8),
+    },
+    "property2": {
+        "sensor_name": None,
+        "contrast": list_range(-2, 3),
+        "brightness": list_range(-2, 3),
+        "saturation": list_range(-2, 3),
+        "sharpness": list_range(-2, 3),
+        "ae_level": list_range(-2, 3),
+        "denoise": list_range(10),
+        "gain_ceiling": list_range(10),
+        "quality": list_range(8, 36),
+        "colorbar": [False, True],
+        "whitebal": [False, True],
+        "gain_ctrl": [False, True],
+        "exposure_ctrl": [False, True],
+        "hmirror": [False, True],
+        "vflip": [False, True],
+        "aec2": [False, True],
+        "awb_gain": [False, True],
+        "dcw": [False, True],
+        "bpc": [False, True],
+        "wpc": [False, True],
+        "raw_gma": [False, True],
+        "lenc": [False, True],
+        "aec_gain": list_range(30),
+        "aec_value": list_range(0, 1200, 50),
+        "wb_mode": list_range(0, 5),
+    },
+}
+
+with open("metadata.json", "w", encoding="utf-8") as f:
+    json.dump(metadata, f)