new maps admin feature

map/README.md

@@ -13,7 +13,9 @@ A containerized web application that visualizes geographic data from NocoDB on a
 - 👤 User authentication with login system
 - ⚙️ Admin panel for system configuration
 - 🎯 Configurable map start location
-- 🐳 Docker containerization for easy deployment
+- <20> Walk Sheet generator for door-to-door canvassing
+- 🔗 QR code integration for digital resources
+- <20>🐳 Docker containerization for easy deployment
 - 🆓 100% open source (no proprietary dependencies)
 
 ## Quick Start
@@ -26,28 +28,45 @@ A containerized web application that visualizes geographic data from NocoDB on a
 
 ### NocoDB Table Setup
 
-1. **Main Locations Table** - Create a table with these required columns:
+1. **Main Locations Table** - Create a table with these required columns. The format here is `Column Name - Column Type - Other Settings`:
-   - `Geo-Location` (Text): Format "latitude;longitude" 
+
+   - `Geo-Location` (Geo-Data): Format "latitude;longitude" 
    - `latitude` (Decimal): Precision 10, Scale 8
    - `longitude` (Decimal): Precision 11, Scale 8
-   - `title` (Text): Location name
+   - `First Name` (Single Line Text): Person's first name
-   - `category` (Single Select): Classification
+   - `Last Name` (Single Line Text): Person's last name
+   - `Email` (Email): Email address
+   - `Phone` (Single Line Text): Phone number
+   - `Unit Number` (Single Line Text): Unit or apartment number
+   - `Support Level` (Single Select): Options: "1", "2", "3", "4" (1=Strong Support/Green, 2=Moderate Support/Yellow, 3=Low Support/Orange, 4=No Support/Red)
+   - `Address` (Single Line Text): Street address
+   - `Sign` (Checkbox): Has campaign sign
+   - `Sign Size` (Single Select): Options: "Small", "Medium", "Large"
+   - `Notes` (Long Text): Additional details and comments
+   - `title` (Text): Location name (legacy field)
+   - `category` (Single Select): Classification (legacy field)
 
 2. **Login Table** - Create a table for user authentication:
+
    - `Email` (Email): User email address
    - `Name` (Single Line Text): User display name  
    - `Admin` (Checkbox): Admin privileges
 
 3. **Settings Table** - Create a table for admin configuration:
+
    - `key` (Single Line Text): Setting identifier
    - `title` (Single Line Text): Display name
+   - `value` (Long Text): Setting value
    - `Geo-Location` (Text): Format "latitude;longitude"
    - `latitude` (Decimal): Precision 10, Scale 8
    - `longitude` (Decimal): Precision 11, Scale 8
    - `zoom` (Number): Map zoom level
-   - `category` (Single Select): "system_setting"
+   - `category` (Single Select): Setting category
    - `updated_by` (Single Line Text): Last updater email
    - `updated_at` (DateTime): Last update time
+   - `qr_code_1_image` (Attachment): QR code 1 image
+   - `qr_code_2_image` (Attachment): QR code 2 image
+   - `qr_code_3_image` (Attachment): QR code 3 image
 
 ### Installation
 
@@ -77,17 +96,20 @@ A containerized web application that visualizes geographic data from NocoDB on a
 ## Finding NocoDB IDs
 
 ### API Token
+
 1. Click user icon → Account Settings
 2. Go to "API Tokens" tab
 3. Create new token with read/write permissions
 
 ### Project and Table IDs
+
 - Simply provide the full NocoDB view URL in `NOCODB_VIEW_URL`
 - The system will automatically extract the project and table IDs
 
 ## API Endpoints
 
 ### Public Endpoints
+
 - `GET /api/locations` - Fetch all locations (requires auth)
 - `POST /api/locations` - Create new location (requires auth)
 - `GET /api/locations/:id` - Get single location (requires auth)
@@ -97,30 +119,49 @@ A containerized web application that visualizes geographic data from NocoDB on a
 - `GET /health` - Health check
 
 ### Authentication Endpoints
+
 - `POST /api/auth/login` - User login
 - `GET /api/auth/check` - Check authentication status
 - `POST /api/auth/logout` - User logout
 
 ### Admin Endpoints (requires admin privileges)
+
 - `GET /api/admin/start-location` - Get start location with source info
 - `POST /api/admin/start-location` - Update map start location
+- `GET /api/admin/walk-sheet-config` - Get walk sheet configuration
+- `POST /api/admin/walk-sheet-config` - Save walk sheet configuration
 
 ## Admin Panel
 
 Users with admin privileges can access the admin panel at `/admin.html` to configure system settings.
 
 ### Features
-- **Start Location Configuration**: Set the default map center and zoom level for all users
+
+#### Start Location Configuration
+
 - **Interactive Map**: Visual interface for selecting coordinates
 - **Real-time Preview**: See changes immediately on the admin map
 - **Validation**: Built-in coordinate and zoom level validation
 
+#### Walk Sheet Generator
+
+- **Printable Forms**: Generate 8.5x11 walk sheets for door-to-door canvassing
+- **QR Code Integration**: Add up to 3 QR codes with custom URLs and labels
+- **Form Field Matching**: Automatically matches fields from the main location form
+- **Live Preview**: See changes as you type
+- **Print Optimization**: Proper formatting for printing or PDF export
+- **Persistent Storage**: All QR codes and settings saved to NocoDB
+- **Real-time Preview**: See changes immediately on the admin map
+- **Validation**: Built-in coordinate and zoom level validation
+
 ### Access Control
+
 - Admin access is controlled via the `Admin` checkbox in the Login table
 - Only authenticated users with admin privileges can access `/admin.html`
 - Admin status is checked on every request to admin endpoints
 
 ### Start Location Priority
+
 The system uses a cascading fallback system for map start location:
 1. **Database**: Admin-configured location stored in Settings table (highest priority)
 2. **Environment**: Default values from .env file (medium priority)  
@@ -168,16 +209,19 @@ To run in development mode:
 ## Troubleshooting
 
 ### Locations not showing
+
 - Verify table has `geodata`, `latitude`, and `longitude` columns
 - Check that coordinates are valid numbers
 - Ensure API token has read permissions
 
 ### Cannot add locations
+
 - Verify API token has write permissions
 - Check browser console for errors
 - Ensure coordinates are within valid ranges
 
 ### Connection errors
+
 - Verify NocoDB instance is accessible
 - Check API URL format
 - Confirm network connectivity

map/app/package-lock.json

@@ -16,7 +16,10 @@
         "express": "^4.18.2",
         "express-rate-limit": "^7.1.4",
         "express-session": "^1.18.1",
+        "form-data": "^4.0.0",
         "helmet": "^7.1.0",
+        "multer": "^1.4.5-lts.1",
+        "qrcode": "^1.5.3",
         "winston": "^3.11.0"
       },
       "devDependencies": {
@@ -65,6 +68,44 @@
         "node": ">= 0.6"
       }
     },
+    "node_modules/ansi-regex": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+      "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/ansi-styles": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+      "dependencies": {
+        "color-convert": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/ansi-styles/node_modules/color-convert": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+      "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+      "dependencies": {
+        "color-name": "~1.1.4"
+      },
+      "engines": {
+        "node": ">=7.0.0"
+      }
+    },
+    "node_modules/ansi-styles/node_modules/color-name": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
+    },
     "node_modules/anymatch": {
       "version": "3.1.3",
       "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz",
@@ -79,6 +120,11 @@
         "node": ">= 8"
       }
     },
+    "node_modules/append-field": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/append-field/-/append-field-1.0.0.tgz",
+      "integrity": "sha512-klpgFSWLW1ZEs8svjfb7g4qWY0YS5imI82dTg+QahUvJ8YqAY0P10Uk8tTyh9ZGuYEZEMaeJYCF5BFuX552hsw=="
+    },
     "node_modules/array-flatten": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
@@ -176,6 +222,22 @@
         "node": ">=8"
       }
     },
+    "node_modules/buffer-from": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-1.1.2.tgz",
+      "integrity": "sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ=="
+    },
+    "node_modules/busboy": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/busboy/-/busboy-1.6.0.tgz",
+      "integrity": "sha512-8SFQbg/0hQ9xy3UNTB0YEnsNBbWfhf7RtnzpL7TkBiTBRfrQ9Fxcnz7VJsleJpyp6rVLvXiuORqjlHi5q+PYuA==",
+      "dependencies": {
+        "streamsearch": "^1.1.0"
+      },
+      "engines": {
+        "node": ">=10.16.0"
+      }
+    },
     "node_modules/bytes": {
       "version": "3.1.2",
       "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.1.2.tgz",
@@ -214,6 +276,14 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/camelcase": {
+      "version": "5.3.1",
+      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-5.3.1.tgz",
+      "integrity": "sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==",
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/chokidar": {
       "version": "3.6.0",
       "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.6.0.tgz",
@@ -239,6 +309,16 @@
         "fsevents": "~2.3.2"
       }
     },
+    "node_modules/cliui": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-6.0.0.tgz",
+      "integrity": "sha512-t6wbgtoCXvAzst7QgXxJYqPt0usEfbgQdftEPbLL/cvv6HPE5VgvqCuAIDR0NgU52ds6rFwqrgakNLrHEjCbrQ==",
+      "dependencies": {
+        "string-width": "^4.2.0",
+        "strip-ansi": "^6.0.0",
+        "wrap-ansi": "^6.2.0"
+      }
+    },
     "node_modules/color": {
       "version": "3.2.1",
       "resolved": "https://registry.npmjs.org/color/-/color-3.2.1.tgz",
@@ -303,6 +383,47 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/concat-stream": {
+      "version": "1.6.2",
+      "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.6.2.tgz",
+      "integrity": "sha512-27HBghJxjiZtIk3Ycvn/4kbJk/1uZuJFfuPEns6LaEvpvG1f0hTea8lilrouyo9mVc2GWdcEZ8OLoGmSADlrCw==",
+      "engines": [
+        "node >= 0.8"
+      ],
+      "dependencies": {
+        "buffer-from": "^1.0.0",
+        "inherits": "^2.0.3",
+        "readable-stream": "^2.2.2",
+        "typedarray": "^0.0.6"
+      }
+    },
+    "node_modules/concat-stream/node_modules/readable-stream": {
+      "version": "2.3.8",
+      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.8.tgz",
+      "integrity": "sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA==",
+      "dependencies": {
+        "core-util-is": "~1.0.0",
+        "inherits": "~2.0.3",
+        "isarray": "~1.0.0",
+        "process-nextick-args": "~2.0.0",
+        "safe-buffer": "~5.1.1",
+        "string_decoder": "~1.1.1",
+        "util-deprecate": "~1.0.1"
+      }
+    },
+    "node_modules/concat-stream/node_modules/safe-buffer": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
+      "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g=="
+    },
+    "node_modules/concat-stream/node_modules/string_decoder": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
+      "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
+      "dependencies": {
+        "safe-buffer": "~5.1.0"
+      }
+    },
     "node_modules/content-disposition": {
       "version": "0.5.4",
       "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.4.tgz",
@@ -361,6 +482,11 @@
       "integrity": "sha512-QADzlaHc8icV8I7vbaJXJwod9HWYp8uCqf1xa4OfNu1T7JVxQIrUgOWtHdNDtPiywmFbiS12VjotIXLrKM3orQ==",
       "license": "MIT"
     },
+    "node_modules/core-util-is": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.3.tgz",
+      "integrity": "sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ=="
+    },
     "node_modules/cors": {
       "version": "2.8.5",
       "resolved": "https://registry.npmjs.org/cors/-/cors-2.8.5.tgz",
@@ -383,6 +509,14 @@
         "ms": "2.0.0"
       }
     },
+    "node_modules/decamelize": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz",
+      "integrity": "sha512-z2S+W9X73hAUUki+N+9Za2lBlun89zigOyGrsax+KUQ6wKW4ZoWpEYBkGhQjwAjjDCkWxhY0VKEhk8wzY7F5cA==",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/delayed-stream": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
@@ -411,6 +545,11 @@
         "npm": "1.2.8000 || >= 1.4.16"
       }
     },
+    "node_modules/dijkstrajs": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/dijkstrajs/-/dijkstrajs-1.0.3.tgz",
+      "integrity": "sha512-qiSlmBq9+BCdCA/L46dw8Uy93mloxsPSbwnm5yrKn2vMPiy8KyAskTF6zuV/j5BMsmOGZDPs7KjU+mjb670kfA=="
+    },
     "node_modules/dotenv": {
       "version": "16.5.0",
       "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-16.5.0.tgz",
@@ -443,6 +582,11 @@
       "integrity": "sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow==",
       "license": "MIT"
     },
+    "node_modules/emoji-regex": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
+      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A=="
+    },
     "node_modules/enabled": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/enabled/-/enabled-2.0.0.tgz",
@@ -650,6 +794,18 @@
         "node": ">= 0.8"
       }
     },
+    "node_modules/find-up": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/find-up/-/find-up-4.1.0.tgz",
+      "integrity": "sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==",
+      "dependencies": {
+        "locate-path": "^5.0.0",
+        "path-exists": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/fn.name": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/fn.name/-/fn.name-1.1.0.tgz",
@@ -734,6 +890,14 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/get-caller-file": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz",
+      "integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==",
+      "engines": {
+        "node": "6.* || 8.* || >= 10.*"
+      }
+    },
     "node_modules/get-intrinsic": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.3.0.tgz",
@@ -933,6 +1097,14 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/is-fullwidth-code-point": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
+      "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/is-glob": {
       "version": "4.0.3",
       "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
@@ -968,12 +1140,28 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/isarray": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+      "integrity": "sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ=="
+    },
     "node_modules/kuler": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/kuler/-/kuler-2.0.0.tgz",
       "integrity": "sha512-Xq9nH7KlWZmXAtodXDDRE7vs6DU1gTU8zYDHDiWLSip45Egwq3plLHzPn27NgvzL2r1LMPC1vdqh98sQxtqj4A==",
       "license": "MIT"
     },
+    "node_modules/locate-path": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-5.0.0.tgz",
+      "integrity": "sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g==",
+      "dependencies": {
+        "p-locate": "^4.1.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/logform": {
       "version": "2.7.0",
       "resolved": "https://registry.npmjs.org/logform/-/logform-2.7.0.tgz",
@@ -1079,12 +1267,49 @@
         "node": "*"
       }
     },
+    "node_modules/minimist": {
+      "version": "1.2.8",
+      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.8.tgz",
+      "integrity": "sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==",
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/mkdirp": {
+      "version": "0.5.6",
+      "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.6.tgz",
+      "integrity": "sha512-FP+p8RB8OWpF3YZBCrP5gtADmtXApB5AMLn+vdyA+PyxCjrCs00mjyUozssO33cwDeT3wNGdLxJ5M//YqtHAJw==",
+      "dependencies": {
+        "minimist": "^1.2.6"
+      },
+      "bin": {
+        "mkdirp": "bin/cmd.js"
+      }
+    },
     "node_modules/ms": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
       "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==",
       "license": "MIT"
     },
+    "node_modules/multer": {
+      "version": "1.4.5-lts.2",
+      "resolved": "https://registry.npmjs.org/multer/-/multer-1.4.5-lts.2.tgz",
+      "integrity": "sha512-VzGiVigcG9zUAoCNU+xShztrlr1auZOlurXynNvO9GiWD1/mTBbUljOKY+qMeazBqXgRnjzeEgJI/wyjJUHg9A==",
+      "deprecated": "Multer 1.x is impacted by a number of vulnerabilities, which have been patched in 2.x. You should upgrade to the latest 2.x version.",
+      "dependencies": {
+        "append-field": "^1.0.0",
+        "busboy": "^1.0.0",
+        "concat-stream": "^1.5.2",
+        "mkdirp": "^0.5.4",
+        "object-assign": "^4.1.1",
+        "type-is": "^1.6.4",
+        "xtend": "^4.0.0"
+      },
+      "engines": {
+        "node": ">= 6.0.0"
+      }
+    },
     "node_modules/negotiator": {
       "version": "0.6.3",
       "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.3.tgz",
@@ -1209,6 +1434,39 @@
         "fn.name": "1.x.x"
       }
     },
+    "node_modules/p-limit": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-2.3.0.tgz",
+      "integrity": "sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w==",
+      "dependencies": {
+        "p-try": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/p-locate": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-4.1.0.tgz",
+      "integrity": "sha512-R79ZZ/0wAxKGu3oYMlz8jy/kbhsNrS7SKZ7PxEHBgJ5+F2mtFW2fK2cOtBh1cHYkQsbzFV7I+EoRKe6Yt0oK7A==",
+      "dependencies": {
+        "p-limit": "^2.2.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/p-try": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/p-try/-/p-try-2.2.0.tgz",
+      "integrity": "sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==",
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/parseurl": {
       "version": "1.3.3",
       "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.3.tgz",
@@ -1218,6 +1476,14 @@
         "node": ">= 0.8"
       }
     },
+    "node_modules/path-exists": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
+      "integrity": "sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==",
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/path-to-regexp": {
       "version": "0.1.12",
       "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.12.tgz",
@@ -1237,6 +1503,19 @@
         "url": "https://github.com/sponsors/jonschlinkert"
       }
     },
+    "node_modules/pngjs": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/pngjs/-/pngjs-5.0.0.tgz",
+      "integrity": "sha512-40QW5YalBNfQo5yRYmiw7Yz6TKKVr3h6970B2YE+3fQpsWcrbj1PzJgxeJ19DRQjhMbKPIuMY8rFaXc8moolVw==",
+      "engines": {
+        "node": ">=10.13.0"
+      }
+    },
+    "node_modules/process-nextick-args": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.1.tgz",
+      "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag=="
+    },
     "node_modules/proxy-addr": {
       "version": "2.0.7",
       "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.7.tgz",
@@ -1263,6 +1542,22 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/qrcode": {
+      "version": "1.5.4",
+      "resolved": "https://registry.npmjs.org/qrcode/-/qrcode-1.5.4.tgz",
+      "integrity": "sha512-1ca71Zgiu6ORjHqFBDpnSMTR2ReToX4l1Au1VFLyVeBTFavzQnv5JxMFr3ukHVKpSrSA2MCk0lNJSykjUfz7Zg==",
+      "dependencies": {
+        "dijkstrajs": "^1.0.1",
+        "pngjs": "^5.0.0",
+        "yargs": "^15.3.1"
+      },
+      "bin": {
+        "qrcode": "bin/qrcode"
+      },
+      "engines": {
+        "node": ">=10.13.0"
+      }
+    },
     "node_modules/qs": {
       "version": "6.13.0",
       "resolved": "https://registry.npmjs.org/qs/-/qs-6.13.0.tgz",
@@ -1338,6 +1633,19 @@
         "node": ">=8.10.0"
       }
     },
+    "node_modules/require-directory": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
+      "integrity": "sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/require-main-filename": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-2.0.0.tgz",
+      "integrity": "sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg=="
+    },
     "node_modules/safe-buffer": {
       "version": "5.2.1",
       "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
@@ -1440,6 +1748,11 @@
         "node": ">= 0.8.0"
       }
     },
+    "node_modules/set-blocking": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz",
+      "integrity": "sha512-KiKBS8AnWGEyLzofFfmvKwpdPzqiy16LvQfK3yv/fVH7Bj13/wl3JSR1J+rfgRE9q7xUJK4qvgS8raSOeLUehw=="
+    },
     "node_modules/setprototypeof": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.2.0.tgz",
@@ -1558,6 +1871,14 @@
         "node": ">= 0.8"
       }
     },
+    "node_modules/streamsearch": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/streamsearch/-/streamsearch-1.1.0.tgz",
+      "integrity": "sha512-Mcc5wHehp9aXz1ax6bZUyY5afg9u2rv5cqQI3mRrYkGC8rW2hM02jWuwjtL++LS5qinSyhj2QfLyNsuc+VsExg==",
+      "engines": {
+        "node": ">=10.0.0"
+      }
+    },
     "node_modules/string_decoder": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.3.0.tgz",
@@ -1567,6 +1888,30 @@
         "safe-buffer": "~5.2.0"
       }
     },
+    "node_modules/string-width": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "dependencies": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/strip-ansi": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+      "dependencies": {
+        "ansi-regex": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/supports-color": {
       "version": "5.5.0",
       "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
@@ -1640,6 +1985,11 @@
         "node": ">= 0.6"
       }
     },
+    "node_modules/typedarray": {
+      "version": "0.0.6",
+      "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",
+      "integrity": "sha512-/aCDEGatGvZ2BIk+HmLf4ifCJFwvKFNb9/JeZPMulfgFracn9QFcAf5GO8B/mweUjSoblS5In0cWhqpfs/5PQA=="
+    },
     "node_modules/uid-safe": {
       "version": "2.1.5",
       "resolved": "https://registry.npmjs.org/uid-safe/-/uid-safe-2.1.5.tgz",
@@ -1692,6 +2042,11 @@
         "node": ">= 0.8"
       }
     },
+    "node_modules/which-module": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/which-module/-/which-module-2.0.1.tgz",
+      "integrity": "sha512-iBdZ57RDvnOR9AGBhML2vFZf7h8vmBjhoaZqODJBFWHVtKkDmKuHai3cx5PgVMrX5YDNp27AofYbAwctSS+vhQ=="
+    },
     "node_modules/winston": {
       "version": "3.17.0",
       "resolved": "https://registry.npmjs.org/winston/-/winston-3.17.0.tgz",
@@ -1727,6 +2082,65 @@
       "engines": {
         "node": ">= 12.0.0"
       }
+    },
+    "node_modules/wrap-ansi": {
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-6.2.0.tgz",
+      "integrity": "sha512-r6lPcBGxZXlIcymEu7InxDMhdW0KDxpLgoFLcguasxCaJ/SOIZwINatK9KY/tf+ZrlywOKU0UDj3ATXUBfxJXA==",
+      "dependencies": {
+        "ansi-styles": "^4.0.0",
+        "string-width": "^4.1.0",
+        "strip-ansi": "^6.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/xtend": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.2.tgz",
+      "integrity": "sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==",
+      "engines": {
+        "node": ">=0.4"
+      }
+    },
+    "node_modules/y18n": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/y18n/-/y18n-4.0.3.tgz",
+      "integrity": "sha512-JKhqTOwSrqNA1NY5lSztJ1GrBiUodLMmIZuLiDaMRJ+itFd+ABVE8XBjOvIWL+rSqNDC74LCSFmlb/U4UZ4hJQ=="
+    },
+    "node_modules/yargs": {
+      "version": "15.4.1",
+      "resolved": "https://registry.npmjs.org/yargs/-/yargs-15.4.1.tgz",
+      "integrity": "sha512-aePbxDmcYW++PaqBsJ+HYUFwCdv4LVvdnhBy78E57PIor8/OVvhMrADFFEDh8DHDFRv/O9i3lPhsENjO7QX0+A==",
+      "dependencies": {
+        "cliui": "^6.0.0",
+        "decamelize": "^1.2.0",
+        "find-up": "^4.1.0",
+        "get-caller-file": "^2.0.1",
+        "require-directory": "^2.1.1",
+        "require-main-filename": "^2.0.0",
+        "set-blocking": "^2.0.0",
+        "string-width": "^4.2.0",
+        "which-module": "^2.0.0",
+        "y18n": "^4.0.0",
+        "yargs-parser": "^18.1.2"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/yargs-parser": {
+      "version": "18.1.3",
+      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-18.1.3.tgz",
+      "integrity": "sha512-o50j0JeToy/4K6OZcaQmW6lyXXKhq7csREXcDwk2omFPJEwUNOVtJKvmDr9EI1fAJZUyZcRF7kxGBWmRXudrCQ==",
+      "dependencies": {
+        "camelcase": "^5.0.0",
+        "decamelize": "^1.2.0"
+      },
+      "engines": {
+        "node": ">=6"
+      }
     }
   }
 }

map/app/package.json

@@ -25,7 +25,10 @@
     "express": "^4.18.2",
     "express-rate-limit": "^7.1.4",
     "express-session": "^1.18.1",
+    "form-data": "^4.0.0",
     "helmet": "^7.1.0",
+    "multer": "^1.4.5-lts.1",
+    "qrcode": "^1.5.3",
     "winston": "^3.11.0"
   },
   "devDependencies": {

map/app/public/admin.html

@@ -32,7 +32,7 @@
                 <h2>Settings</h2>
                 <nav class="admin-nav">
                     <a href="#start-location" class="active">Start Location</a>
-                    <!-- Future menu items can go here -->
+                    <a href="#walk-sheet">Walk Sheet</a>
                 </nav>
             </div>
 
@@ -76,6 +76,104 @@
                         </div>
                     </div>
                 </section>
+
+                <!-- Walk Sheet Section -->
+                <section id="walk-sheet" class="admin-section" style="display: none;">
+                    <h2>Walk Sheet Configuration</h2>
+                    <p>Design and configure printable walk sheets for door-to-door canvassing.</p>
+                    
+                    <div class="walk-sheet-container">
+                        <div class="walk-sheet-config">
+                            <h3>Sheet Information</h3>
+                            
+                            <div class="form-group">
+                                <label for="walk-sheet-title">Sheet Title</label>
+                                <input type="text" id="walk-sheet-title" placeholder="Campaign Walk Sheet">
+                            </div>
+                            
+                            <div class="form-group">
+                                <label for="walk-sheet-subtitle">Subtitle</label>
+                                <input type="text" id="walk-sheet-subtitle" placeholder="Door-to-Door Canvassing Form">
+                            </div>
+                            
+                            <div class="form-group">
+                                <label for="walk-sheet-footer">Footer Text</label>
+                                <textarea id="walk-sheet-footer" rows="3" placeholder="Contact info, legal text, etc."></textarea>
+                            </div>
+                            
+                            <h3>QR Codes</h3>
+                            <p class="help-text-inline">Add up to 3 QR codes for quick access to digital resources.</p>
+                            
+                            <!-- QR Code 1 -->
+                            <div class="qr-code-group">
+                                <h4>QR Code 1</h4>
+                                <div class="form-row">
+                                    <div class="form-group">
+                                        <label for="qr-code-1-url">URL</label>
+                                        <input type="url" id="qr-code-1-url" placeholder="https://example.com/signup">
+                                    </div>
+                                    <div class="form-group">
+                                        <label for="qr-code-1-label">Label</label>
+                                        <input type="text" id="qr-code-1-label" placeholder="Sign Up">
+                                    </div>
+                                </div>
+                            </div>
+                            
+                            <!-- QR Code 2 -->
+                            <div class="qr-code-group">
+                                <h4>QR Code 2</h4>
+                                <div class="form-row">
+                                    <div class="form-group">
+                                        <label for="qr-code-2-url">URL</label>
+                                        <input type="url" id="qr-code-2-url" placeholder="https://example.com/donate">
+                                    </div>
+                                    <div class="form-group">
+                                        <label for="qr-code-2-label">Label</label>
+                                        <input type="text" id="qr-code-2-label" placeholder="Donate">
+                                    </div>
+                                </div>
+                            </div>
+                            
+                            <!-- QR Code 3 -->
+                            <div class="qr-code-group">
+                                <h4>QR Code 3</h4>
+                                <div class="form-row">
+                                    <div class="form-group">
+                                        <label for="qr-code-3-url">URL</label>
+                                        <input type="url" id="qr-code-3-url" placeholder="https://example.com/volunteer">
+                                    </div>
+                                    <div class="form-group">
+                                        <label for="qr-code-3-label">Label</label>
+                                        <input type="text" id="qr-code-3-label" placeholder="Volunteer">
+                                    </div>
+                                </div>
+                            </div>
+                            
+                            <div class="form-actions">
+                                <button id="save-walk-sheet" class="btn btn-primary">
+                                    Save Configuration
+                                </button>
+                                <button id="preview-walk-sheet" class="btn btn-secondary">
+                                    Preview Sheet
+                                </button>
+                                <button id="print-walk-sheet" class="btn btn-secondary">
+                                    🖨️ Print Sheet
+                                </button>
+                            </div>
+                        </div>
+                        
+                        <div class="walk-sheet-preview">
+                            <h3>Preview</h3>
+                            <div class="preview-controls">
+                                <button id="refresh-preview" class="btn btn-sm btn-secondary">Refresh</button>
+                                <span class="preview-info">8.5" x 11" format</span>
+                            </div>
+                            <div id="walk-sheet-preview-content" class="walk-sheet-page">
+                                <!-- Preview content will be generated here -->
+                            </div>
+                        </div>
+                    </div>
+                </section>
             </div>
         </div>
 
@@ -88,6 +186,9 @@
             integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo=" 
             crossorigin=""></script>
     
+    <!-- QR Code Library -->
+    <script src="https://cdn.jsdelivr.net/npm/qrcode@1.5.3/build/qrcode.min.js"></script>
+    
     <!-- Admin JavaScript -->
     <script src="js/admin.js"></script>
 </body>

map/app/public/css/admin.css

@@ -228,7 +228,271 @@
     }
 }
 
+/* Walk Sheet Styles */
+.walk-sheet-container {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: 30px;
+    margin-top: 20px;
+}
+
+.walk-sheet-config {
+    background-color: #f9f9f9;
+    padding: 20px;
+    border-radius: var(--border-radius);
+}
+
+.walk-sheet-config h3 {
+    font-size: 16px;
+    margin-bottom: 15px;
+    color: var(--dark-color);
+}
+
+.qr-code-group {
+    background-color: white;
+    padding: 15px;
+    border-radius: var(--border-radius);
+    margin-bottom: 15px;
+    border: 1px solid #e0e0e0;
+    position: relative;
+}
+
+.qr-code-group h4 {
+    font-size: 14px;
+    margin-bottom: 10px;
+    color: #666;
+}
+
+.form-row {
+    display: grid;
+    grid-template-columns: 2fr 1fr;
+    gap: 10px;
+}
+
+.help-text-inline {
+    font-size: 14px;
+    color: #666;
+    margin-bottom: 15px;
+}
+
+/* Walk Sheet Preview */
+.walk-sheet-preview {
+    background-color: #f5f5f5;
+    padding: 20px;
+    border-radius: var(--border-radius);
+}
+
+.walk-sheet-preview h3 {
+    font-size: 16px;
+    margin-bottom: 10px;
+    color: var(--dark-color);
+}
+
+.preview-controls {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 15px;
+}
+
+.preview-info {
+    font-size: 12px;
+    color: #666;
+}
+
+/* Walk Sheet Page (8.5 x 11 preview) */
+.walk-sheet-page {
+    width: 100%;
+    max-width: 425px; /* Half of 8.5 inches at 100dpi */
+    aspect-ratio: 8.5 / 11;
+    background: white;
+    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
+    padding: 20px;
+    margin: 0 auto;
+    overflow: auto;
+    font-size: 10px;
+    line-height: 1.4;
+    position: relative;
+}
+
+/* Walk Sheet Print Styles */
+@media print {
+    body * {
+        visibility: hidden;
+    }
+    
+    .walk-sheet-page, .walk-sheet-page * {
+        visibility: visible;
+    }
+    
+    .walk-sheet-page {
+        position: absolute;
+        left: 0;
+        top: 0;
+        width: 8.5in;
+        height: 11in;
+        max-width: none;
+        padding: 0.5in;
+        margin: 0;
+        box-shadow: none;
+        font-size: 12pt;
+    }
+}
+
+/* Walk Sheet Content Styles */
+.ws-header {
+    text-align: center;
+    margin-bottom: 20px;
+    border-bottom: 2px solid #333;
+    padding-bottom: 10px;
+}
+
+.ws-title {
+    font-size: 18px;
+    font-weight: bold;
+    margin: 0;
+}
+
+.ws-subtitle {
+    font-size: 14px;
+    color: #666;
+    margin: 5px 0 0 0;
+}
+
+.ws-qr-section {
+    display: flex;
+    justify-content: space-around;
+    margin: 20px 0;
+    padding: 15px;
+    background-color: #f9f9f9;
+    border-radius: 5px;
+}
+
+.ws-qr-item {
+    text-align: center;
+}
+
+.ws-qr-code {
+    margin-bottom: 5px;
+}
+
+.ws-qr-code img {
+    display: block;
+    margin: 0 auto;
+    image-rendering: crisp-edges;
+    image-rendering: -webkit-crisp-edges;
+    image-rendering: pixelated;
+    image-rendering: -moz-crisp-edges;
+}
+
+.ws-qr-label {
+    font-size: 10px;
+    font-weight: bold;
+}
+
+.ws-form-section {
+    margin-top: 20px;
+}
+
+.ws-form-row {
+    display: grid;
+    grid-template-columns: repeat(2, 1fr);
+    gap: 10px;
+    margin-bottom: 10px;
+}
+
+.ws-form-group {
+    border-bottom: 1px solid #ccc;
+    padding-bottom: 5px;
+}
+
+.ws-form-label {
+    font-size: 9px;
+    color: #666;
+    display: block;
+    margin-bottom: 2px;
+}
+
+.ws-form-field {
+    height: 20px;
+    background-color: #f9f9f9;
+}
+
+.ws-notes-section {
+    margin-top: 20px;
+}
+
+.ws-notes-label {
+    font-size: 10px;
+    font-weight: bold;
+    margin-bottom: 5px;
+}
+
+.ws-notes-area {
+    width: 100%;
+    height: 60px;
+    border: 1px solid #ccc;
+    background-color: #f9f9f9;
+}
+
+.ws-footer {
+    position: absolute;
+    bottom: 20px;
+    left: 20px;
+    right: 20px;
+    text-align: center;
+    font-size: 9px;
+    color: #666;
+    padding-top: 10px;
+    border-top: 1px solid #ccc;
+}
+
+/* QR Code Generation Status */
+.qr-code-group.generating::after {
+    content: 'Generating QR Code...';
+    position: absolute;
+    top: 0;
+    right: 0;
+    font-size: 12px;
+    color: var(--primary-color);
+    background: white;
+    padding: 2px 8px;
+    border-radius: 3px;
+    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
+}
+
+/* Loading state for save button */
+.btn:disabled {
+    opacity: 0.6;
+    cursor: not-allowed;
+}
+
+/* QR code stored indicator */
+.qr-status {
+    font-size: 12px;
+    color: var(--success-color);
+    margin-top: 5px;
+}
+
+.qr-status.stored {
+    color: var(--success-color);
+}
+
+.qr-status.pending {
+    color: var(--warning-color);
+}
+
 /* Responsive */
+@media (max-width: 1200px) {
+    .walk-sheet-container {
+        grid-template-columns: 1fr;
+    }
+    
+    .walk-sheet-preview {
+        order: -1;
+    }
+}
+
 @media (max-width: 768px) {
     .admin-container {
         flex-direction: column;
@@ -255,6 +519,15 @@
     .admin-section {
         padding: 20px;
     }
+    
+    .form-row {
+        grid-template-columns: 1fr;
+    }
+    
+    .walk-sheet-page {
+        font-size: 8px;
+        padding: 15px;
+    }
 }
 
 /* CSS Variables (define these in style.css if not already defined) */

map/app/public/js/admin.js

@@ -1,6 +1,7 @@
 // Admin panel JavaScript
 let adminMap = null;
 let startMarker = null;
+let storedQRCodes = {};
 
 // Initialize when DOM is loaded
 document.addEventListener('DOMContentLoaded', () => {
@@ -8,6 +9,8 @@ document.addEventListener('DOMContentLoaded', () => {
     initializeAdminMap();
     loadCurrentStartLocation();
     setupEventListeners();
+    setupNavigation();
+    loadWalkSheetConfig();
 });
 
 // Check if user is authenticated as admin
@@ -144,6 +147,38 @@ function setupEventListeners() {
     document.getElementById('start-lat').addEventListener('change', updateMapFromInputs);
     document.getElementById('start-lng').addEventListener('change', updateMapFromInputs);
     document.getElementById('start-zoom').addEventListener('change', updateMapFromInputs);
+    
+    // Walk Sheet buttons
+    document.getElementById('save-walk-sheet').addEventListener('click', saveWalkSheetConfig);
+    document.getElementById('preview-walk-sheet').addEventListener('click', generateWalkSheetPreview);
+    document.getElementById('print-walk-sheet').addEventListener('click', printWalkSheet);
+    document.getElementById('refresh-preview').addEventListener('click', generateWalkSheetPreview);
+    
+    // Auto-update preview on input change
+    const walkSheetInputs = document.querySelectorAll(
+        '#walk-sheet-title, #walk-sheet-subtitle, #walk-sheet-footer, ' +
+        '[id^="qr-code-"][id$="-url"], [id^="qr-code-"][id$="-label"]'
+    );
+    
+    walkSheetInputs.forEach(input => {
+        input.addEventListener('input', debounce(() => {
+            generateWalkSheetPreview();
+        }, 500));
+    });
+    
+    // Add URL change listeners to detect when QR codes need regeneration
+    for (let i = 1; i <= 3; i++) {
+        const urlInput = document.getElementById(`qr-code-${i}-url`);
+        let previousUrl = urlInput.value;
+        
+        urlInput.addEventListener('change', () => {
+            if (urlInput.value !== previousUrl) {
+                // URL changed, clear stored QR code
+                delete storedQRCodes[i];
+                previousUrl = urlInput.value;
+            }
+        });
+    }
 }
 
 // Update map from input fields
@@ -207,6 +242,276 @@ async function saveStartLocation() {
     }
 }
 
+// Save walk sheet configuration
+async function saveWalkSheetConfig() {
+    const config = {
+        walk_sheet_title: document.getElementById('walk-sheet-title').value,
+        walk_sheet_subtitle: document.getElementById('walk-sheet-subtitle').value,
+        walk_sheet_footer: document.getElementById('walk-sheet-footer').value,
+        qr_code_1_url: document.getElementById('qr-code-1-url').value,
+        qr_code_1_label: document.getElementById('qr-code-1-label').value,
+        qr_code_2_url: document.getElementById('qr-code-2-url').value,
+        qr_code_2_label: document.getElementById('qr-code-2-label').value,
+        qr_code_3_url: document.getElementById('qr-code-3-url').value,
+        qr_code_3_label: document.getElementById('qr-code-3-label').value
+    };
+    
+    // Show loading state
+    const saveButton = document.getElementById('save-walk-sheet');
+    const originalText = saveButton.textContent;
+    saveButton.textContent = 'Saving...';
+    saveButton.disabled = true;
+    
+    try {
+        const response = await fetch('/api/admin/walk-sheet-config', {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json'
+            },
+            body: JSON.stringify(config)
+        });
+        
+        const data = await response.json();
+        
+        if (data.success) {
+            showStatus('Walk sheet configuration saved successfully!', 'success');
+            
+            // Update stored QR codes if new ones were generated
+            if (data.qrCodes) {
+                for (let i = 1; i <= 3; i++) {
+                    if (data.qrCodes[`qr_code_${i}_image`]) {
+                        storedQRCodes[i] = data.qrCodes[`qr_code_${i}_image`];
+                    }
+                }
+            }
+            
+            // Refresh preview with new QR codes
+            generateWalkSheetPreview();
+        } else {
+            throw new Error(data.error || 'Failed to save');
+        }
+        
+    } catch (error) {
+        console.error('Save error:', error);
+        showStatus(error.message || 'Failed to save walk sheet configuration', 'error');
+    } finally {
+        saveButton.textContent = originalText;
+        saveButton.disabled = false;
+    }
+}
+
+// Generate walk sheet preview
+function generateWalkSheetPreview() {
+    const title = document.getElementById('walk-sheet-title').value || 'Campaign Walk Sheet';
+    const subtitle = document.getElementById('walk-sheet-subtitle').value || 'Door-to-Door Canvassing Form';
+    const footer = document.getElementById('walk-sheet-footer').value || 'Thank you for your support!';
+    
+    let previewHTML = `
+        <div class="ws-header">
+            <h1 class="ws-title">${escapeHtml(title)}</h1>
+            <p class="ws-subtitle">${escapeHtml(subtitle)}</p>
+        </div>
+    `;
+    
+    // Add QR codes section
+    const qrCodesHTML = [];
+    for (let i = 1; i <= 3; i++) {
+        const url = document.getElementById(`qr-code-${i}-url`).value;
+        const label = document.getElementById(`qr-code-${i}-label`).value;
+        
+        if (url) {
+            // Check if we have a stored QR code image
+            if (storedQRCodes[i] && storedQRCodes[i].url) {
+                // Use stored QR code image
+                qrCodesHTML.push(`
+                    <div class="ws-qr-item">
+                        <div class="ws-qr-code">
+                            <img src="${storedQRCodes[i].url}" alt="QR Code ${i}" style="width: 80px; height: 80px;">
+                        </div>
+                        <div class="ws-qr-label">${escapeHtml(label) || `QR Code ${i}`}</div>
+                    </div>
+                `);
+            } else {
+                // Generate QR code client-side as fallback
+                qrCodesHTML.push(`
+                    <div class="ws-qr-item">
+                        <div class="ws-qr-code" id="preview-qr-${i}"></div>
+                        <div class="ws-qr-label">${escapeHtml(label) || `QR Code ${i}`}</div>
+                    </div>
+                `);
+            }
+        }
+    }
+    
+    if (qrCodesHTML.length > 0) {
+        previewHTML += `
+            <div class="ws-qr-section">
+                ${qrCodesHTML.join('')}
+            </div>
+        `;
+    }
+    
+    // Add form fields based on the main map form
+    previewHTML += `
+        <div class="ws-form-section">
+            <div class="ws-form-row">
+                <div class="ws-form-group">
+                    <label class="ws-form-label">First Name</label>
+                    <div class="ws-form-field"></div>
+                </div>
+                <div class="ws-form-group">
+                    <label class="ws-form-label">Last Name</label>
+                    <div class="ws-form-field"></div>
+                </div>
+            </div>
+            
+            <div class="ws-form-row">
+                <div class="ws-form-group">
+                    <label class="ws-form-label">Email</label>
+                    <div class="ws-form-field"></div>
+                </div>
+                <div class="ws-form-group">
+                    <label class="ws-form-label">Phone</label>
+                    <div class="ws-form-field"></div>
+                </div>
+            </div>
+            
+            <div class="ws-form-row">
+                <div class="ws-form-group">
+                    <label class="ws-form-label">Address</label>
+                    <div class="ws-form-field"></div>
+                </div>
+                <div class="ws-form-group">
+                    <label class="ws-form-label">Unit Number</label>
+                    <div class="ws-form-field"></div>
+                </div>
+            </div>
+            
+            <div class="ws-form-row">
+                <div class="ws-form-group">
+                    <label class="ws-form-label">Support Level (1-4)</label>
+                    <div class="ws-form-field"></div>
+                </div>
+                <div class="ws-form-group">
+                    <label class="ws-form-label">Sign Request ☐ Yes ☐ No</label>
+                    <div class="ws-form-field"></div>
+                </div>
+            </div>
+            
+            <div class="ws-form-row">
+                <div class="ws-form-group">
+                    <label class="ws-form-label">Category</label>
+                    <div class="ws-form-field"></div>
+                </div>
+                <div class="ws-form-group">
+                    <label class="ws-form-label">Visited Date</label>
+                    <div class="ws-form-field"></div>
+                </div>
+            </div>
+        </div>
+        
+        <div class="ws-notes-section">
+            <div class="ws-notes-label">Notes & Comments</div>
+            <div class="ws-notes-area"></div>
+        </div>
+    `;
+    
+    // Update preview
+    const previewContent = document.getElementById('walk-sheet-preview-content');
+    previewContent.innerHTML = previewHTML;
+    
+    // Add footer (positioned absolutely in CSS)
+    if (footer) {
+        const footerDiv = document.createElement('div');
+        footerDiv.className = 'ws-footer';
+        footerDiv.innerHTML = escapeHtml(footer);
+        previewContent.appendChild(footerDiv);
+    }
+    
+    // Generate client-side QR codes for items without stored images
+    setTimeout(() => {
+        for (let i = 1; i <= 3; i++) {
+            const url = document.getElementById(`qr-code-${i}-url`).value;
+            if (url && !storedQRCodes[i]) {
+                const qrContainer = document.getElementById(`preview-qr-${i}`);
+                if (qrContainer && typeof QRCode !== 'undefined') {
+                    qrContainer.innerHTML = '';
+                    new QRCode(qrContainer, {
+                        text: url,
+                        width: 80,
+                        height: 80,
+                        correctLevel: QRCode.CorrectLevel.M
+                    });
+                }
+            }
+        }
+    }, 100);
+}
+
+// Print walk sheet
+function printWalkSheet() {
+    // First generate fresh preview
+    generateWalkSheetPreview();
+    
+    // Wait for QR codes to generate
+    setTimeout(() => {
+        window.print();
+    }, 500);
+}
+
+// Setup navigation between sections
+function setupNavigation() {
+    const navLinks = document.querySelectorAll('.admin-nav a');
+    const sections = document.querySelectorAll('.admin-section');
+    
+    navLinks.forEach(link => {
+        link.addEventListener('click', (e) => {
+            e.preventDefault();
+            const targetId = link.getAttribute('href').substring(1);
+            
+            // Update active states
+            navLinks.forEach(l => l.classList.remove('active'));
+            link.classList.add('active');
+            
+            // Show/hide sections
+            sections.forEach(section => {
+                section.style.display = section.id === targetId ? 'block' : 'none';
+            });
+        });
+    });
+}
+
+// Load walk sheet configuration
+async function loadWalkSheetConfig() {
+    try {
+        const response = await fetch('/api/admin/walk-sheet-config');
+        const data = await response.json();
+        
+        if (data.success && data.config) {
+            // Populate form fields
+            document.getElementById('walk-sheet-title').value = data.config.walk_sheet_title || '';
+            document.getElementById('walk-sheet-subtitle').value = data.config.walk_sheet_subtitle || '';
+            document.getElementById('walk-sheet-footer').value = data.config.walk_sheet_footer || '';
+            
+            // QR codes
+            for (let i = 1; i <= 3; i++) {
+                document.getElementById(`qr-code-${i}-url`).value = data.config[`qr_code_${i}_url`] || '';
+                document.getElementById(`qr-code-${i}-label`).value = data.config[`qr_code_${i}_label`] || '';
+                
+                // Store QR code image data if available
+                if (data.config[`qr_code_${i}_image`]) {
+                    storedQRCodes[i] = data.config[`qr_code_${i}_image`];
+                }
+            }
+            
+            // Generate preview
+            generateWalkSheetPreview();
+        }
+    } catch (error) {
+        console.error('Failed to load walk sheet config:', error);
+    }
+}
+
 // Handle logout
 async function handleLogout() {
     if (!confirm('Are you sure you want to logout?')) {
@@ -257,3 +562,16 @@ function escapeHtml(text) {
     div.textContent = String(text);
     return div.innerHTML;
 }
+
+// Debounce function for input events
+function debounce(func, wait) {
+    let timeout;
+    return function executedFunction(...args) {
+        const later = () => {
+            clearTimeout(timeout);
+            func(...args);
+        };
+        clearTimeout(timeout);
+        timeout = setTimeout(later, wait);
+    };
+}

map/app/server.js

@@ -12,6 +12,9 @@ require('dotenv').config();
 // Import geocoding routes
 const geocodingRoutes = require('./routes/geocoding');
 
+// Import QR code service
+const { generateAndUploadQRCode, deleteQRCodeFromNocoDB } = require('./services/qrcode');
+
 // Parse project and table IDs from view URL
 function parseNocoDBUrl(url) {
     if (!url) return { projectId: null, tableId: null };
@@ -674,6 +677,216 @@ app.get('/api/config/start-location', async (req, res) => {
     });
 });
 
+// Get walk sheet configuration
+app.get('/api/admin/walk-sheet-config', requireAdmin, async (req, res) => {
+    try {
+        if (!SETTINGS_SHEET_ID) {
+            return res.json({
+                success: true,
+                config: null,
+                source: 'defaults'
+            });
+        }
+        
+        // Get all settings
+        const response = await axios.get(
+            `${process.env.NOCODB_API_URL}/api/v1/base/${process.env.NOCODB_PROJECT_ID}/tables/${SETTINGS_SHEET_ID}/rows`,
+            {
+                headers: {
+                    'xc-auth': process.env.NOCODB_API_TOKEN
+                }
+            }
+        );
+        
+        if (!response.data?.list || response.data.list.length === 0) {
+            return res.json({
+                success: true,
+                config: null,
+                source: 'defaults'
+            });
+        }
+        
+        // Find walk sheet settings
+        const walkSheetSettings = {};
+        const settingKeys = [
+            'walk_sheet_title', 'walk_sheet_subtitle', 'walk_sheet_footer',
+            'qr_code_1_url', 'qr_code_1_label', 'qr_code_1_image',
+            'qr_code_2_url', 'qr_code_2_label', 'qr_code_2_image',
+            'qr_code_3_url', 'qr_code_3_label', 'qr_code_3_image'
+        ];
+        
+        for (const setting of response.data.list) {
+            if (settingKeys.includes(setting.key)) {
+                if (setting.key.includes('_image') && setting.value) {
+                    // Parse image data if stored as JSON string
+                    try {
+                        walkSheetSettings[setting.key] = JSON.parse(setting.value);
+                    } catch {
+                        walkSheetSettings[setting.key] = setting.value;
+                    }
+                } else {
+                    walkSheetSettings[setting.key] = setting.value || setting.title || '';
+                }
+            }
+        }
+        
+        res.json({
+            success: true,
+            config: walkSheetSettings,
+            source: 'database'
+        });
+        
+    } catch (error) {
+        logger.error('Failed to get walk sheet config:', error);
+        res.status(500).json({
+            success: false,
+            error: 'Failed to retrieve walk sheet configuration'
+        });
+    }
+});
+
+// Save walk sheet configuration
+app.post('/api/admin/walk-sheet-config', requireAdmin, async (req, res) => {
+    try {
+        if (!SETTINGS_SHEET_ID) {
+            return res.status(400).json({
+                success: false,
+                error: 'Settings sheet not configured'
+            });
+        }
+        
+        const config = req.body;
+        const userEmail = req.session.userEmail;
+        const timestamp = new Date().toISOString();
+        
+        // NocoDB configuration
+        const nocodbConfig = {
+            apiUrl: process.env.NOCODB_API_URL,
+            apiToken: process.env.NOCODB_API_TOKEN,
+            projectId: process.env.NOCODB_PROJECT_ID,
+            tableId: SETTINGS_SHEET_ID
+        };
+        
+        // Get existing settings
+        const getResponse = await axios.get(
+            `${process.env.NOCODB_API_URL}/api/v1/base/${process.env.NOCODB_PROJECT_ID}/tables/${SETTINGS_SHEET_ID}/rows`,
+            {
+                headers: {
+                    'xc-auth': process.env.NOCODB_API_TOKEN
+                }
+            }
+        );
+        
+        const existingSettings = getResponse.data?.list || [];
+        
+        // Process QR codes
+        const qrCodeUploads = {};
+        for (let i = 1; i <= 3; i++) {
+            const url = config[`qr_code_${i}_url`];
+            const label = config[`qr_code_${i}_label`] || `QR Code ${i}`;
+            
+            if (url) {
+                try {
+                    // Check if URL has changed
+                    const existingUrlSetting = existingSettings.find(s => s.key === `qr_code_${i}_url`);
+                    const urlChanged = !existingUrlSetting || existingUrlSetting.value !== url;
+                    
+                    if (urlChanged) {
+                        // Generate and upload new QR code
+                        const uploadResult = await generateAndUploadQRCode(url, label, nocodbConfig);
+                        if (uploadResult) {
+                            qrCodeUploads[`qr_code_${i}_image`] = uploadResult;
+                            
+                            // Delete old QR code if exists
+                            const existingImageSetting = existingSettings.find(s => s.key === `qr_code_${i}_image`);
+                            if (existingImageSetting?.value) {
+                                await deleteQRCodeFromNocoDB(existingImageSetting.value, nocodbConfig);
+                            }
+                        }
+                    }
+                } catch (error) {
+                    logger.error(`Failed to process QR code ${i}:`, error);
+                }
+            } else {
+                // If URL is empty, delete existing QR code
+                const existingImageSetting = existingSettings.find(s => s.key === `qr_code_${i}_image`);
+                if (existingImageSetting?.value) {
+                    await deleteQRCodeFromNocoDB(existingImageSetting.value, nocodbConfig);
+                }
+                qrCodeUploads[`qr_code_${i}_image`] = null;
+            }
+        }
+        
+        // Update or create each setting
+        const allSettings = { ...config, ...qrCodeUploads };
+        
+        for (const [key, value] of Object.entries(allSettings)) {
+            const existingSetting = existingSettings.find(s => s.key === key);
+            
+            let settingData = {
+                key: key,
+                title: typeof value === 'string' ? value : '',
+                category: 'walk_sheet_setting',
+                updated_by: userEmail,
+                updated_at: timestamp
+            };
+            
+            // Handle different value types
+            if (key.includes('_image') && value) {
+                // For image attachments
+                settingData.value = JSON.stringify(value);
+                settingData[key] = value; // Also set the attachment field directly
+            } else {
+                settingData.value = value || '';
+            }
+            
+            if (existingSetting) {
+                // Update existing
+                await axios.put(
+                    `${process.env.NOCODB_API_URL}/api/v1/base/${process.env.NOCODB_PROJECT_ID}/tables/${SETTINGS_SHEET_ID}/rows/${existingSetting.Id}`,
+                    settingData,
+                    {
+                        headers: {
+                            'xc-auth': process.env.NOCODB_API_TOKEN,
+                            'Content-Type': 'application/json'
+                        }
+                    }
+                );
+            } else {
+                // Create new
+                await axios.post(
+                    `${process.env.NOCODB_API_URL}/api/v1/base/${process.env.NOCODB_PROJECT_ID}/tables/${SETTINGS_SHEET_ID}/rows`,
+                    settingData,
+                    {
+                        headers: {
+                            'xc-auth': process.env.NOCODB_API_TOKEN,
+                            'Content-Type': 'application/json'
+                        }
+                    }
+                );
+            }
+        }
+        
+        res.json({
+            success: true,
+            message: 'Walk sheet configuration saved successfully',
+            qrCodes: Object.keys(qrCodeUploads).reduce((acc, key) => {
+                if (qrCodeUploads[key]) {
+                    acc[key] = qrCodeUploads[key];
+                }
+                return acc;
+            }, {})
+        });
+        
+    } catch (error) {
+        logger.error('Failed to save walk sheet config:', error);
+        res.status(500).json({
+            success: false,
+            error: 'Failed to save walk sheet configuration'
+        });
+    }
+});
+
 // Debug session endpoint
 app.get('/api/debug/session', (req, res) => {
     res.json({

map/app/services/qrcode.js

@@ -0,0 +1,155 @@
+const QRCode = require('qrcode');
+const axios = require('axios');
+const FormData = require('form-data');
+const winston = require('winston');
+
+// Configure logger
+const logger = winston.createLogger({
+    level: process.env.NODE_ENV === 'production' ? 'info' : 'debug',
+    format: winston.format.combine(
+        winston.format.timestamp(),
+        winston.format.json()
+    ),
+    transports: [
+        new winston.transports.Console({
+            format: winston.format.simple()
+        })
+    ]
+});
+
+/**
+ * Generate QR code as PNG buffer
+ * @param {string} text - Text/URL to encode
+ * @param {Object} options - QR code options
+ * @returns {Promise<Buffer>} PNG buffer
+ */
+async function generateQRCode(text, options = {}) {
+    const defaultOptions = {
+        type: 'png',
+        width: 256,
+        margin: 1,
+        color: {
+            dark: '#000000',
+            light: '#FFFFFF'
+        },
+        errorCorrectionLevel: 'M'
+    };
+    
+    const qrOptions = { ...defaultOptions, ...options };
+    
+    try {
+        const buffer = await QRCode.toBuffer(text, qrOptions);
+        return buffer;
+    } catch (error) {
+        logger.error('Failed to generate QR code:', error);
+        throw new Error('Failed to generate QR code');
+    }
+}
+
+/**
+ * Upload QR code to NocoDB storage
+ * @param {Buffer} buffer - PNG buffer
+ * @param {string} filename - Filename for the upload
+ * @param {Object} config - NocoDB configuration
+ * @returns {Promise<Object>} Upload response
+ */
+async function uploadQRCodeToNocoDB(buffer, filename, config) {
+    const formData = new FormData();
+    formData.append('file', buffer, {
+        filename: filename,
+        contentType: 'image/png'
+    });
+    
+    try {
+        const response = await axios({
+            url: `${config.apiUrl}/api/v2/storage/upload`,
+            method: 'post',
+            data: formData,
+            headers: {
+                ...formData.getHeaders(),
+                'xc-token': config.apiToken
+            },
+            params: {
+                path: 'qrcodes'
+            }
+        });
+        
+        return response.data;
+    } catch (error) {
+        logger.error('Failed to upload QR code to NocoDB:', error);
+        throw new Error('Failed to upload QR code');
+    }
+}
+
+/**
+ * Generate and upload QR code
+ * @param {string} url - URL to encode
+ * @param {string} label - Label for the QR code
+ * @param {Object} config - NocoDB configuration
+ * @returns {Promise<Object>} Upload result
+ */
+async function generateAndUploadQRCode(url, label, config) {
+    if (!url) {
+        return null;
+    }
+    
+    try {
+        // Generate QR code
+        const buffer = await generateQRCode(url);
+        
+        // Create filename
+        const timestamp = Date.now();
+        const safeLabel = label.replace(/[^a-z0-9]/gi, '_').toLowerCase();
+        const filename = `qr_${safeLabel}_${timestamp}.png`;
+        
+        // Upload to NocoDB
+        const uploadResult = await uploadQRCodeToNocoDB(buffer, filename, config);
+        
+        return uploadResult;
+    } catch (error) {
+        logger.error('Failed to generate and upload QR code:', error);
+        throw error;
+    }
+}
+
+/**
+ * Delete QR code from NocoDB storage
+ * @param {string} fileUrl - File URL to delete
+ * @param {Object} config - NocoDB configuration
+ * @returns {Promise<boolean>} Success status
+ */
+async function deleteQRCodeFromNocoDB(fileUrl, config) {
+    if (!fileUrl) {
+        return true;
+    }
+    
+    try {
+        // Extract file path from URL
+        const urlParts = fileUrl.split('/');
+        const filePath = urlParts.slice(-2).join('/');
+        
+        await axios({
+            url: `${config.apiUrl}/api/v2/storage/upload`,
+            method: 'delete',
+            headers: {
+                'xc-token': config.apiToken
+            },
+            params: {
+                path: filePath
+            }
+        });
+        
+        return true;
+    } catch (error) {
+        logger.error('Failed to delete QR code from NocoDB:', error);
+        // Don't throw error for deletion failures
+        return false;
+    }
+}
+
+module.exports = {
+    generateQRCode,
+    uploadQRCodeToNocoDB,
+    generateAndUploadQRCode,
+    deleteQRCodeFromNocoDB
+};