Initial commit for Start9 packaging

2026-02-28 09:27:26 -06:00
commit 1b64c45c52
124 changed files with 15671 additions and 0 deletions
@@ -0,0 +1,113 @@
+# PWA Icon Generator
+
+This script generates PWA (Progressive Web App) icon PNG files for the Workout Planner app using only Node.js built-in modules.
+
+## Features
+
+- **No external dependencies**: Uses only Node.js built-in modules (`fs`, `zlib`, `path`)
+- **PNG format with proper compression**: Generates valid PNG files with zlib compression
+- **Multiple sizes**: Creates icons for all common PWA sizes:
+  - 72x72, 96x96, 128x128, 144x144, 152x152 (small devices)
+  - 192x192, 384x384, 512x512 (larger devices)
+- **Maskable icons**: Creates adaptive icon variants (192x192 and 512x512) for Android
+- **SVG favicon**: Generates a bonus SVG favicon for browsers
+
+## Design
+
+The icons feature:
+- **Dark luxury aesthetic**: #0A0A0A (near-black) background
+- **Stylized "W" letter**: White (#FFFFFF) geometric design representing "Workout"
+- **Clean, bold design**: Perfect for a gym/fitness application
+
+## Usage
+
+```bash
+node scripts/generate-icons.js
+```
+
+This will generate all icon files in `public/icons/` directory:
+- `icon-{size}x{size}.png` - Regular icons for various sizes
+- `icon-{size}x{size}-maskable.png` - Maskable variants for adaptive icons
+- `favicon.svg` - SVG favicon for browsers
+
+## Integration with PWA
+
+The generated icons are automatically referenced in `public/manifest.json`. The manifest includes:
+- All standard icon sizes for different devices
+- Maskable icons for Android adaptive icon support
+- Proper MIME types and purposes
+
+### HTML Integration
+
+Add this to your `<head>`:
+
+```html
+<!-- PWA Manifest -->
+<link rel="manifest" href="/manifest.json">
+
+<!-- Favicon -->
+<link rel="icon" type="image/svg+xml" href="/icons/favicon.svg">
+<link rel="icon" type="image/png" sizes="192x192" href="/icons/icon-192x192.png">
+<link rel="apple-touch-icon" href="/icons/icon-192x192.png">
+
+<!-- Theme color -->
+<meta name="theme-color" content="#FFFFFF">
+<meta name="background-color" content="#0A0A0A">
+```
+
+## Technical Details
+
+### PNG Generation
+
+The script uses raw PNG format generation:
+1. Creates pixel buffer with RGBA color values
+2. Generates PNG header (IHDR chunk) with image dimensions and color info
+3. Prepares image data with filter bytes for each row
+4. Compresses data using zlib deflate algorithm
+5. Generates IDAT chunk with compressed data
+6. Calculates CRC32 checksums for data integrity
+7. Outputs valid PNG file with proper structure
+
+### Custom Drawing
+
+The `drawW()` function:
+- Fills background with #0A0A0A
+- Draws a stylized "W" using vertical bars/rectangles
+- Proportionally scales to any icon size
+- Uses simple, fast rectangle fill operations
+
+## Regenerating Icons
+
+If you modify the design colors or want to regenerate:
+
+1. Edit the color constants in `generate-icons.js`:
+   - `BACKGROUND_COLOR` - Icon background (default: #0A0A0A)
+   - `TEXT_COLOR` - "W" letter color (default: #FFFFFF)
+
+2. Modify the `drawW()` function to change the letter design
+
+3. Run the script again:
+   ```bash
+   node scripts/generate-icons.js
+   ```
+
+All icons will be regenerated with the new design.
+
+## File Sizes
+
+The generated PNG files are highly optimized:
+- Small sizes (72-152px): ~250-1000 bytes
+- Medium size (192px): ~1.3 KB
+- Large size (384px): ~4.2 KB
+- Extra large (512px): ~7.2 KB
+
+The compact file sizes are due to zlib compression of the simple color scheme.
+
+## Browser Support
+
+These icons work on:
+- Chrome/Edge PWA installation
+- Firefox PWA installation
+- Safari iOS add-to-home-screen
+- Android adaptive icons (maskable variants)
+- Desktop browser tabs (favicon)