travel_todo

This app is a travel checklist manager implemented as a single-page web application. It is designed to help one person collect and track practical tasks for a trip, from pre-departure preparation to reminders on-the-road. The main structure is destination based: you can create multiple destinations, switch between them, and keep a separate task list for each destination. The current destination appears in the header, and each destination can have an optional cover image uploaded from the device.

Within a destination, tasks are shown as cards. Each task includes a title, a category, a completion state, and optional schedule information. The app supports quick creation of a task from a modal form, and deeper editing in a detail panel. In the detail panel, you can change the task text, set a date and time, update its category, and add free-text notes. You can also attach multiple photos to a task. Photos are displayed in a grid so you can quickly review what has been saved with that item.

The category system is intended for travel planning and includes five predefined groups in the UI: essentials, attractions, food, accommodation, and shopping. A horizontal filter bar lets you view all tasks or only one category at a time. This makes it easier to focus on a specific part of trip preparation without losing the full list. Each card has a check control to mark the task as completed or incomplete, and the header shows live counts for pending and completed items in the active destination.
Data is stored locally using IndexedDB, with one object store for application state and one for image data. In practical terms, destinations, tasks, notes, and uploaded photos remain on the local browser or embedded WebView where the app runs. There is no account system, no cloud synchronization, and no server-side database in this implementation. If local browser data is cleared, saved content can be lost. This design keeps the app lightweight and allows it to function without a network connection after assets are available.

The app includes an export workflow that converts the current destination checklist into a PNG image. It builds a hidden export template, renders task content and attached thumbnails, then captures that template with html2canvas. After export, an image preview layer allows several actions: view the image, enter fullscreen, copy the image or image reference where supported, and save or download it. On Android-style containers, the code attempts common native bridge methods for image saving, then falls back to web-based save flows if those methods are not available.
Destination management is intentionally simple. You can add a destination name, switch the active destination from a modal list, and remove a destination when it is no longer needed. Deleting a destination also deletes its related tasks.
From a technical perspective, the page uses plain JavaScript and DOM updates rather than a frontend framework. Styling is utility-class based through Tailwind loaded from local mirrored assets, with Font Awesome icons and custom CSS for interaction details. The interface is optimized for mobile usage: fixed header and floating action buttons, modal sheets, touch-friendly targets, and hidden scrollbars for compact presentation. The current date is largely shown in the header using locale formatting, and icon fallbacks are included for environments where icon fonts fail to load.
Scope-wise, this is a practical personal organizer for trip-related todos, not a full travel platform. It does not provide booking, maps, navigation, shared collaboration, push reminders, automatic itinerary generation, spending analytics, or cross-device sync. Its value is straightforward: capture trip tasks quickly, organize them by destination and category, attach context such as notes and photos, and export a visual checklist image when needed. The implementation focuses on local persistence and simple task operations rather than advanced planning logic.