diff --git a/map/README.md b/map/README.md index a924dc0..5808a4a 100644 --- a/map/README.md +++ b/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 +- � Walk Sheet generator for door-to-door canvassing +- 🔗 QR code integration for digital resources +- �🐳 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: - - `Geo-Location` (Text): Format "latitude;longitude" +1. **Main Locations Table** - Create a table with these required columns. The format here is `Column Name - Column Type - Other Settings`: + + - `Geo-Location` (Geo-Data): Format "latitude;longitude" - `latitude` (Decimal): Precision 10, Scale 8 - `longitude` (Decimal): Precision 11, Scale 8 - - `title` (Text): Location name - - `category` (Single Select): Classification + - `First Name` (Single Line Text): Person's first name + - `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 diff --git a/map/app/package-lock.json b/map/app/package-lock.json index 4e2f404..2c9db57 100644 --- a/map/app/package-lock.json +++ b/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" + } } } } diff --git a/map/app/package.json b/map/app/package.json index 7ac5132..606a2a8 100644 --- a/map/app/package.json +++ b/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": { diff --git a/map/app/public/admin.html b/map/app/public/admin.html index b1b5b47..1d66e86 100644 --- a/map/app/public/admin.html +++ b/map/app/public/admin.html @@ -32,7 +32,7 @@

Settings

@@ -76,6 +76,104 @@ + + + @@ -88,6 +186,9 @@ integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo=" crossorigin=""> + + + diff --git a/map/app/public/css/admin.css b/map/app/public/css/admin.css index 4b80991..57e734b 100644 --- a/map/app/public/css/admin.css +++ b/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) */ diff --git a/map/app/public/js/admin.js b/map/app/public/js/admin.js index 37b3095..230c6a3 100644 --- a/map/app/public/js/admin.js +++ b/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 = ` +
+

${escapeHtml(title)}

+

${escapeHtml(subtitle)}

+
+ `; + + // 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(` +
+
+ QR Code ${i} +
+
${escapeHtml(label) || `QR Code ${i}`}
+
+ `); + } else { + // Generate QR code client-side as fallback + qrCodesHTML.push(` +
+
+
${escapeHtml(label) || `QR Code ${i}`}
+
+ `); + } + } + } + + if (qrCodesHTML.length > 0) { + previewHTML += ` +
+ ${qrCodesHTML.join('')} +
+ `; + } + + // Add form fields based on the main map form + previewHTML += ` +
+
+
+ +
+
+
+ +
+
+
+ +
+
+ +
+
+
+ +
+
+
+ +
+
+ +
+
+
+ +
+
+
+ +
+
+ +
+
+
+ +
+
+
+ +
+
+ +
+
+
+ +
+
+
+
+ +
+
Notes & Comments
+
+
+ `; + + // 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); + }; +} diff --git a/map/app/server.js b/map/app/server.js index b94d033..12630d5 100644 --- a/map/app/server.js +++ b/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({ diff --git a/map/app/services/qrcode.js b/map/app/services/qrcode.js new file mode 100644 index 0000000..3bece4f --- /dev/null +++ b/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} 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} 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} 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} 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 +}; diff --git a/map/config.sh b/map/config.sh new file mode 100644 index 0000000..e69de29