feat: Add modern React UI with comprehensive feature enhancements

.github/ISSUE_TEMPLATE/issue.yml

@@ -104,8 +104,8 @@ body:
   - type: textarea
     id: logs
     attributes:
-      label: Full Motion log output (at log_level 8)
-      description: Please copy and paste the full log output. This will be automatically formatted into code, so no need for backticks.
+      label: Relevant Motion log output (at log_level 8)
+      description: Please copy and paste the log output. This will be automatically formatted into code, so no need for backticks.
       render: shell
     validations:
       required: true

.github/workflows/ci.yml

@@ -24,7 +24,41 @@ concurrency:
   cancel-in-progress: true
 
 jobs:
-  build:
+  frontend:
+    name: Frontend Build & Lint
+    runs-on: ubuntu-latest
+    defaults:
+      run:
+        working-directory: frontend
+
+    steps:
+      - name: Checkout source
+        uses: actions/checkout@main
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: '20'
+          cache: 'npm'
+          cache-dependency-path: frontend/package-lock.json
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Run ESLint
+        run: npm run lint
+
+      - name: Build frontend
+        run: npm run build
+
+      - name: Verify build artifacts
+        run: |
+          test -f ../data/webui/index.html || { echo "index.html not found"; exit 1; }
+          test -d ../data/webui/assets || { echo "assets directory not found"; exit 1; }
+          echo "✅ Frontend build artifacts verified"
+
+  backend:
+    name: Backend Build (${{ matrix.cxx }}, ${{ matrix.libc }})
     runs-on: ubuntu-latest
     strategy:
       fail-fast: false
@@ -50,7 +84,7 @@ jobs:
         if: matrix.libc == 'glibc'
         run: |
           sudo apt-get update
-          sudo apt-get install -y autopoint pkgconf gettext libcamera-dev libopencv-dev libavcodec-dev libavdevice-dev libavformat-dev libavutil-dev libswscale-dev libwebp-dev libmicrohttpd-dev libmariadb-dev libasound2-dev libpulse-dev libfftw3-dev
+          sudo apt-get install -y autoconf automake libtool autopoint autoconf-archive pkgconf gettext libcamera-dev libopencv-dev libavcodec-dev libavdevice-dev libavformat-dev libavutil-dev libswscale-dev libwebp-dev libmicrohttpd-dev libmariadb-dev libasound2-dev libpulse-dev libfftw3-dev
 
       - name: Set up Alpine
         if: matrix.libc == 'musl'
@@ -62,14 +96,18 @@ jobs:
             clang
             file
             autoconf
+            autoconf-archive
             automake
-            gettext-dev
             libtool
+            bash
+            gettext-dev
             libzip-dev
             jpeg-dev
             v4l-utils-libs
             libcamera-dev
             opencv-dev
+            openexr-dev
+            imath-dev
             ffmpeg-dev
             libmicrohttpd-dev
             sqlite-dev
@@ -84,7 +122,9 @@ jobs:
       - name: Configure build
         run: |
           autoreconf -fiv
-          ./configure CC=${{ matrix.cc }} CXX=${{ matrix.cxx }}
+          # Pass LIBS directly to configure for Alpine OpenEXR/Imath transitive dependency issue
+          # OpenCV's imgcodecs requires OpenEXR (Imf) and Imath but pkg-config doesn't pull them in
+          CONFIG_SHELL=/bin/bash ./configure CC=${{ matrix.cc }} CXX=${{ matrix.cxx }} ${{ matrix.libc == 'musl' && 'LIBS="-lOpenEXR -lImath"' || '' }}
 
       - name: Build target
         run: |

.gitignore

@@ -11,6 +11,7 @@ config.rpath
 config.status
 config.sub
 configure
+configure~
 autom4te.cache
 aclocal.m4
 depcomp
@@ -19,13 +20,38 @@ m4/
 missing
 stamp-h1
 
+#devFiles
+doc/analysis/
+doc/architecture/
+doc/github/
+doc/handoff-prompts/
+doc/installation/
+doc/issues/
+doc/libcamera/
+doc/plans/
+doc/project/
+doc/reviews/
+doc/scratchpads/
+doc/sub-agent-summaries/
+doc/summaries/
+doc/aar/
+doc/Screenshots/
+doc/sub-agent-plans/
+doc/MOTION_PI5_CHANGES.md
+
 #data
 data/motion-dist.service
 data/motion-dist.conf
 data/camera1-dist.conf
 data/camera2-dist.conf
 data/camera3-dist.conf
 data/sound1-dist.conf
+data/webcontrol/samplepage.html
+
+#development scripts (local only)
+scripts/deploy-pi4.sh
+scripts/deploy-pi5.sh
+scripts/pi5-test.conf
 
 #src
 src/*.o
@@ -59,3 +85,15 @@ po/stamp-po
 
 .vscode/
 
+# macOS
+.DS_Store
+
+# Node.js / Testing
+node_modules/
+package.json
+package-lock.json
+test-ui.mjs
+
+# Claude Code local settings
+.claude/
+CLAUDE.md

CONTRIBUTING.md

@@ -2,6 +2,10 @@
 
 Issues on the github site are intended to discuss code problems, crashes and application enhancements.  The discussions is intended for questions after you have read the guide.
 
+  * User guide:  [Motion User Guide](https://motion-project.github.io/motion_guide.html)
+  * User Group List:  Please sign-up and send your issue to the list [Motion User](https://lists.sourceforge.net/lists/listinfo/motion-user)
+  * IRC:  [#motion](ircs://irc.libera.chat:6697/motion) on Libera Chat
+
 ##  Questions submitted as issues
 
 Questions that are submitted as a github issue will be transferred to the discussions section.

Makefile.am

@@ -23,6 +23,9 @@ SUBDIRS = src po
 
 pkgsysconfdir = $(sysconfdir)/@PACKAGE@
 libstatedir = @localstatedir@/lib/@PACKAGE@
+libwebdir = @localstatedir@/lib/@PACKAGE@/webcontrol
+webuiinstalldir = @localstatedir@/lib/@PACKAGE@/webui
+scriptsdir = $(srcdir)/scripts
 
 dist_libstate_DATA = \
 	data/motion-dist.conf \
@@ -31,13 +34,19 @@ dist_libstate_DATA = \
 	data/camera3-dist.conf \
 	data/sound1-dist.conf
 
+dist_libweb_DATA = \
+	data/webcontrol/samplepage.html
+
 dist_man_MANS = man/motion.1
 
 dist_doc_DATA = \
 	doc/motion_guide.html \
 	doc/motion_stylesheet.css \
 	doc/motion_build.html \
-	doc/motion_config.html
+	doc/motion_config.html \
+	doc/motion_examples.html \
+	doc/motion.gif \
+	doc/motion.png
 
 ###################################################################
 ## Clean tilde crumbs and add prefix in config file.
@@ -46,6 +55,73 @@ all-local:
 	@rm -f po/*.po\~
 	@sed -e 's|$${prefix}|$(prefix)|' data/motion-dist.conf > data/motion-dist.conf.tmp && mv -f data/motion-dist.conf.tmp data/motion-dist.conf
 
+###################################################################
+## Install React webui files (handles dynamic asset filenames)
+###################################################################
+install-data-local:
+	@echo "Installing React webui..."
+	$(MKDIR_P) $(DESTDIR)$(webuiinstalldir)/assets
+	$(INSTALL_DATA) data/webui/index.html $(DESTDIR)$(webuiinstalldir)/
+	$(INSTALL_DATA) data/webui/vite.svg $(DESTDIR)$(webuiinstalldir)/ 2>/dev/null || true
+	@for f in data/webui/assets/*; do \
+		if [ -f "$$f" ]; then \
+			$(INSTALL_DATA) "$$f" $(DESTDIR)$(webuiinstalldir)/assets/; \
+		fi; \
+	done
+
+uninstall-local:
+	rm -rf $(DESTDIR)$(webuiinstalldir)
+
+###################################################################
+## Systemd service installation
+###################################################################
+SYSTEMD_UNIT_DIR = $(shell pkg-config --variable=systemdsystemunitdir systemd 2>/dev/null || echo "/etc/systemd/system")
+
+install-service: data/motion-dist.service
+	$(MKDIR_P) $(DESTDIR)$(SYSTEMD_UNIT_DIR)
+	@sed -e 's|$${exec_prefix}|$(exec_prefix)|g' \
+	     -e 's|$${prefix}|$(prefix)|g' \
+	     data/motion-dist.service > $(DESTDIR)$(SYSTEMD_UNIT_DIR)/motion.service.tmp
+	$(INSTALL_DATA) $(DESTDIR)$(SYSTEMD_UNIT_DIR)/motion.service.tmp $(DESTDIR)$(SYSTEMD_UNIT_DIR)/motion.service
+	@rm -f $(DESTDIR)$(SYSTEMD_UNIT_DIR)/motion.service.tmp
+	@echo ""
+	@echo "Service installed to $(DESTDIR)$(SYSTEMD_UNIT_DIR)/motion.service"
+	@if [ -z "$(DESTDIR)" ] && command -v systemctl >/dev/null 2>&1; then \
+		echo "Reloading systemd and enabling service..."; \
+		systemctl daemon-reload; \
+		systemctl enable motion; \
+		echo "Service enabled. Start with: sudo systemctl start motion"; \
+	else \
+		echo ""; \
+		echo "To enable and start:"; \
+		echo "  sudo systemctl daemon-reload"; \
+		echo "  sudo systemctl enable motion"; \
+		echo "  sudo systemctl start motion"; \
+	fi
+	@echo ""
+
+uninstall-service:
+	rm -f $(DESTDIR)$(SYSTEMD_UNIT_DIR)/motion.service
+	@echo "Service removed. Run 'sudo systemctl daemon-reload' to complete uninstall"
+
+setup-service: install-service
+	@echo ""
+	@echo "Running Motion service setup..."
+	@echo ""
+	@if [ ! -x $(scriptsdir)/setup-motion-service.sh ]; then \
+		echo "Error: Setup script not found or not executable"; \
+		echo "Expected: $(scriptsdir)/setup-motion-service.sh"; \
+		exit 1; \
+	fi
+	@if [ `id -u` -ne 0 ]; then \
+		echo "Error: This target must be run with sudo"; \
+		echo "Usage: sudo make setup-service"; \
+		exit 1; \
+	fi
+	@echo "Usage: $(scriptsdir)/setup-motion-service.sh --admin-pass PASSWORD --viewer-pass PASSWORD"
+	@echo ""
+	@echo "Run the setup script manually with your desired passwords."
+
 ###################################################################
 ## Create pristine directories to match exactly distributed files
 ###################################################################
@@ -60,6 +136,7 @@ cleanall: distclean
 	@rm -f data/motion-dist.service data/motion-dist.conf
 	@rm -f data/camera1-dist.conf data/camera2-dist.conf
 	@rm -f data/camera3-dist.conf data/sound1-dist.conf
+	@rm -f data/webcontrol/samplepage.conf
 
 ###################################################################
 ## Testing options for maintainer