{"id":40631183,"url":"https://github.com/tstraub89/gallery_wall","last_synced_at":"2026-02-07T22:13:49.381Z","repository":{"id":333718987,"uuid":"1136979916","full_name":"tstraub89/gallery_wall","owner":"tstraub89","description":"A web app for designing and organizing gallery walls","archived":false,"fork":false,"pushed_at":"2026-01-31T17:27:45.000Z","size":31762,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2026-01-31T19:57:27.715Z","etag":null,"topics":["canvas","gallery","gallery-app","gallery-images","javascript","layout-design","photo-management","react","vite"],"latest_commit_sha":null,"homepage":"https://tstraub89.github.io/gallery_wall/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/tstraub89.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null},"funding":{"buy_me_a_coffee":"tstraub89"}},"created_at":"2026-01-18T17:47:06.000Z","updated_at":"2026-01-31T16:29:47.000Z","dependencies_parsed_at":"2026-01-31T08:01:51.510Z","dependency_job_id":null,"html_url":"https://github.com/tstraub89/gallery_wall","commit_stats":null,"previous_names":["tstraub89/gallery_wall"],"tags_count":27,"template":false,"template_full_name":null,"purl":"pkg:github/tstraub89/gallery_wall","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tstraub89%2Fgallery_wall","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tstraub89%2Fgallery_wall/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tstraub89%2Fgallery_wall/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tstraub89%2Fgallery_wall/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/tstraub89","download_url":"https://codeload.github.com/tstraub89/gallery_wall/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tstraub89%2Fgallery_wall/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":29035936,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-02-03T06:39:36.383Z","status":"ssl_error","status_checked_at":"2026-02-03T06:39:32.787Z","response_time":96,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["canvas","gallery","gallery-app","gallery-images","javascript","layout-design","photo-management","react","vite"],"created_at":"2026-01-21T07:36:21.888Z","updated_at":"2026-02-03T06:42:04.129Z","avatar_url":"https://github.com/tstraub89.png","language":"TypeScript","funding_links":["https://buymeacoffee.com/tstraub89","https://www.buymeacoffee.com/tstraub89"],"categories":[],"sub_categories":[],"readme":"# Gallery Wall Planner 🖼️✨\n\n**Visualize your perfect gallery wall before you hang a single nail.**\n\n![Gallery Wall Planner Preview](./example.png)\n\nA powerful, interactive web application designed to help you plan complex gallery layouts with real frames and personal photos. Transition from a pile of frames on the floor to a perfectly aligned wall with confidence.\n\n\u003ca href=\"https://www.buymeacoffee.com/tstraub89\" target=\"_blank\"\u003e\u003cimg src=\"https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png\" alt=\"Buy Me A Coffee\" height=\"60\" width=\"217\"\u003e\u003c/a\u003e\n\n---\n\n## 🚀 Key Highlights\n\n*   **Precision Layout Canvas**: An infinite workspace with pan, zoom, and smart snapping tools (`S`, `#`) for pixel-perfect alignment.\n*   **Instant Visualization**: Drag and drop photos from your computer directly onto frames to see your memories in situ.\n*   **Portable Project Bundles**: Save your entire workspace—including photos—into a single `.gwall` file for easy sharing or backup.\n*   **Print-Ready Photo Export**: preparing your gallery for reality? Export all your cropped photos in a high-resolution ZIP (with smart DPI capping), ready for professional printing.\n*   **Intelligent Search \u0026 Filter**: Instantly find frames by label or size (e.g., \"8x10\") and photos by filename. Filter collections by shape or status.\n*   **Inventory First Workflow**: Keep track of your physical frames. Even if you remove a frame from the wall, it stays in your \"Unplaced\" library for later use.\n\n---\n\n## 🛠️ Detailed Features\n\n### 🖼️ Inventory \u0026 Frame Management\n*   **Adaptive Grid Inventory**: A smart sidebar that shifts between list and grid views, featuring \"Placed\" status overlays on frame previews.\n*   **1:1 Inventory Manifest**: Every frame is accounted for individually with \"Placed\" and \"(Duplicated)\" indicators.\n*   **Smart Parsing \u0026 Import**: Batch import dimensions from plain text (e.g., \"8x10\", \"11 1/4 x 14 matted\"). Handles fractions and keywords automatically.\n*   **Custom Labels \u0026 Scaling**: Name your frames (e.g., \"Light Switch\") directly. Labels automatically scale to fit their container for maximum readability.\n*   **Geometric Variety**: Full support for traditional rectangles and modern round/oval shapes with automatic proportional scaling.\n*   **Aesthetics**: Set frame colors using presets or a color picker; toggle and adjust matting openings on the fly.\n*   **Direct Dimension Control**: Resize frames directly in a tabbed **Properties Panel**; changes update the wall and inventory dynamically.\n*   **Additive Layout Logic**: Adding borders or mats grows the frame *outward*, ensuring your internal photo dimensions remain exactly as intended.\n\n### 📸 Photo Management\n*   **Masonry Library**: A beautiful, efficient grid for managing your uploaded photos.\n*   **Smart Integration**: Drag files directly from your computer onto a canvas frame to place them and auto-save them to your library.\n*   **Photo Fine-Tuning**: Dedicated adjustment tab for scale, position, and 90° rotation within the frame.\n*   **Search**: Find photos by filename instantly as your library grows.\n\n### 🎨 Workspace Interaction\n*   **Modern Glass HUD**: Sleek, translucent on-canvas controls for zoom, grid toggles, and snapping that maximize workspace visibility.\n*   **Marquee Selection**: Bulk-select, nudge, or duplicate clusters of frames by dragging on the background.\n*   **Context Menu**: Right-click for layering (Bring to Front), duplication, and photo removal.\n*   **Advanced Alignment**: Use **Lucide-React** standard icons to align frames by edges or centers.\n*   **Undo / Redo**: Full session history support via `Ctrl+Z` / `Ctrl+Y`.\n*   **Automatic Persistence**: Your progress is instantly saved to local storage—refresh or return later exactly where you left off.\n\n### 💾 Project Controls\n*   **Shopping List**: Export a text manifest of all frames in your design for easy shopping.\n*   **Canvas Snapshot**: Save your layout as a PNG to share or use as a reference.\n*   **Multi-Project Support**: Create and switch between distinct gallery wall designs.\n\n---\n\n## ⌨️ Shortcuts \u0026 Navigation\n\nClick the **\"?\"** button in the header for the in-app **Quick Start Guide**.\n\n| Category | Shortcut | Action |\n| :--- | :--- | :--- |\n| **View** | `Right-Click + Drag` | Pan Workspace |\n| | `Ctrl / Cmd + Scroll` | Zoom In/Out |\n| | `#` | Toggle Background Grid |\n| | `S` | Toggle Snap-to-Grid |\n| **Selection** | `Ctrl / Cmd + A` | Select All (Frames or Photos) |\n| | `Click + Drag` | Marquee selection |\n| **Edit** | `Ctrl / Cmd + D` | Duplicate Selection |\n| | `Ctrl + Drag` | Quick Duplicate and Move |\n| | `Arrows` | Nudge 1px (`Shift` for 10px) |\n| | `Backspace / Del` | Remove Selection |\n| | `Double-Click` | Reset image scale/position in frame |\n| **History** | `Ctrl + Z` | Undo |\n| | `Ctrl + Y` | Redo |\n\n---\n\n## 🏗️ Getting Started\n\n1.  **Install**: `npm install`\n2.  **Dev Server**: `npm run dev`\n3.  **Browse**: Open `http://localhost:5173`.\n\n\u003e [!TIP]\n\u003e You can load [example.gwall](./example.gwall) to try out the tool with a preconfigured gallery wall layout. You can also check [example_frame_template.txt](./example_frame_template.txt) to see how to format your own frame collection for batch importing.\n\n**Tech Stack**: Built with React 19 (Vite), **TypeScript**, CSS Modules, and IndexedDB for persistent local storage.\n\nv2.0.0 Released Jan 2026. 🚀✨\n\n© 2026 Timothy Straub. All Rights Reserved.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftstraub89%2Fgallery_wall","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftstraub89%2Fgallery_wall","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftstraub89%2Fgallery_wall/lists"}