▧ Shared momentsSetup helper

Setup & everyday use · Version 1.0

Your holiday photo album

Shared moments is a private album for four people. Everyone can upload and view photos, filter by date, place and contributor, and download sharing copies. Each person can edit and delete their own photos.

Start here: extract the downloaded ZIP first. Open START-HERE.html to read these instructions. The website to upload is the site folder. The app is built, but your Cloudflare and Supabase accounts still need to be connected.

What is included

ItemPurpose
site/Complete website, including its JavaScript libraries. No build step or CDN dependency.
supabase-setup.sqlCreates the photo records, four-member list and private storage rules.
site/setup.htmlGenerates your public connection file and SQL to register the four people.
admin-reset-password.mjsOptional organiser tool for password resets without email delivery.
DEVELOPER.mdMaintenance, security design, test results and known limitations.

One-time setup: create Supabase

  1. Visit Supabase and create an account. Create a new project in a Free organisation. Choose a region near your group if available. Use a new project dedicated to this album.
  2. Save the database password privately. It is not needed in the website. Wait until the project finishes starting.
  3. Open SQL Editor, create a query, paste the entire contents of supabase-setup.sql, and run it. The script creates two tables and the private holiday-photos storage bucket. A successful query may say “Success. No rows returned”.
  4. In Authentication settings, disable new public sign-ups. Leave email/password sign-in enabled. The app does not use invitation emails, magic links, public registration or automatic password-reset emails.
  5. Under Authentication → Users, use Add user / Create new user to create each of the four email/password accounts. Use the administrator-created user option, not Send invitation. Confirm the email during creation if offered. Choose a different temporary password of at least 12 characters for each person.
  6. Open the extracted site/setup.html in your browser. Enter the four names and the same email addresses under “Add your four people”. Generate the member SQL, copy it into Supabase SQL Editor and run it. You should see four names. If the query cannot find an email, correct it or create the missing account, then rerun the whole block.

Menu labels may change slightly. The essential result is four confirmed Authentication users and four matching rows in album_members. The seat numbers 1–4 enforce the four-person limit.

Connect and publish the website

  1. In Supabase’s Connect dialog or Project Settings → API Keys, find the Project URL and publishable key beginning sb_publishable_. An older anon public key also works. Never use a sb_secret_ or service_role key in the website.
  2. In site/setup.html, enter an album name, Project URL and public key. Choose Download config.js.
  3. Replace the package’s site/config.js with the downloaded file. Ensure the browser did not rename it config (1).js or add a .txt extension.
  4. Create a free Cloudflare account. Open Workers & Pages, start a new application, choose Pages, then the Direct Upload / drag-and-drop option. Use Pages, not a Worker script. You do not need a domain, GitHub repository, paid Workers plan or Cloudflare R2 storage.
  5. Give the project a name, then upload the contents of the site folder. Include its vendor folder and _headers file. Alternatively ZIP those contents with index.html at the ZIP root. Do not upload the whole development package or its outer folder.
  6. Deploy and open the supplied https://your-name.pages.dev address. There is no build command. Save the address as your group’s album link.
  7. In Supabase Authentication → URL Configuration, set the Site URL to this HTTPS address. The current password sign-in flow does not require email redirects, but setting the correct URL keeps the project configured consistently.
  8. Sign in with your own account, then give the other three people the album link and their individual account details privately. They need album accounts only; they do not need Cloudflare or Supabase administrator accounts.

Check before adding your holiday collection

  1. Sign in as the first person and upload one test photo with a date, location and caption.
  2. On another device or in a separate browser profile, sign in as the second person. Confirm that the photo appears after Refresh and is tagged with the first person’s name.
  3. Confirm the second person can view and download it but cannot see Edit or Delete for that photo.
  4. Sign out and check the gallery is no longer visible. Confirm the holiday-photos bucket is marked Private in Supabase Storage.
  5. Try one photo from each type of phone your group uses, especially an iPhone HEIC photo, before uploading a large batch.

Add your photos

  1. Open the album link and sign in. Use Account to replace your temporary password with your own.
  2. Tap Add photos → Choose photos. Select up to 50 per batch from your phone, iPad or computer. For large phone images, smaller batches of 10–20 are easier on memory.
  3. Wait while the app prepares the pictures. It reads available photo metadata and creates resized JPEG sharing copies plus thumbnails.
  4. Check each date. If a photo has no recorded date, it stays blank until you enter one; the app does not mistake the upload date for the date taken.
  5. Enter a place such as “Florence” or “Dove Lake”. To label a batch, enter its location and click Apply to photos. A batch location replaces the current location on each pending photo. A batch date only fills missing dates. You can still change individual entries.
  6. Add optional captions, then tap Upload photos. Keep the tab open and your device awake until it finishes. Successfully uploaded photos remain online even if another upload fails.
  7. If an upload needs retry, tap Upload photos again. If you have already closed the page, reselect the original files; exact duplicates are skipped.

GPS coordinates are read when available and give you a View map link after uploading. Place names are entered manually; this version does not call a paid or third-party place-name lookup service. Opening View map sends that photo’s coordinates to OpenStreetMap.

Browse, edit and download

Photo quality and formats

Sharing copies have a longest edge of up to 2,400 pixels, with JPEG compression adjusted to aim below 1 MB. Small originals are not enlarged. Downloads are these sharing copies, not full-resolution originals. Thumbnail files are separate. JPEG, PNG and WebP are supported; HEIC/HEIF conversion is included but unusual encodings can require exporting a JPEG first. Only a still image is retained from a multi-image HEIC or Live Photo; videos, RAW files, animations and Live Photo motion are not included.

The app extracts available date/GPS information before resizing. Sharing JPEGs do not retain the original EXIF metadata; the album stores the date, place, caption and available coordinates separately. Metadata removed by another app cannot be recovered. Duplicate detection recognises identical original file bytes, even if filenames differ; edited, re-encoded or differently exported copies can be uploaded separately.

Keep it free and keep your originals

Supabase’s current Free plan includes 1 GB of file storage, 500 MB of database storage, 5 GB of ordinary outgoing traffic and a separate 5 GB cached allowance. The app stops new batches above an estimated 850 MB of photo data to leave some space. For example, 500 sharing photos averaging 1 MB use approximately 500 MB plus thumbnails. The album’s meter estimates recorded photo files; Supabase’s usage dashboard is authoritative.

Stay on the Free plans and use the supplied pages.dev address. Free quotas and terms can change. If you reach a limit, remove unneeded photos, wait for traffic quotas to reset, or reduce usage rather than enabling a paid plan.

Supabase can pause a free project after about a week of low activity. If the album stops connecting, the organiser should check the Supabase dashboard and restore the paused project. Check it periodically if you want the album to remain available. Keep the original photos independently backed up; this app is a sharing album, not your only archive.

For an additional record, the organiser can export album_photos and album_members as CSV using the dashboard, and download important shared copies. A database export does not include the image files.

Troubleshooting

What you seeWhat to do
“Your app is ready to connect”Replace site/config.js with your generated configuration and redeploy the complete site folder.
Sign-in rejectedCheck the email/password and whether the Authentication user is confirmed. Public registration is intentionally disabled.
“Not on this album’s member list”Run the member SQL after creating all four accounts. Authentication alone does not grant access.
Cannot load album or uploadCheck internet access, Supabase project status and quotas. Check that the database setup ran successfully and the URL and public key belong to that same project.
HEIC conversion failsExport or share a JPEG version from the device’s photo app, then upload it. Try smaller batches.
No date or locationThe photo may not contain this information. Enter the date and place manually. GPS does not automatically create a place name.
Old or missing thumbnailsTap Refresh. Private image links expire after an hour; refreshing obtains new ones.
Cloudflare shows 404Check that index.html is at the deployment root, not inside another site or package folder.
Interrupted upload or deletionRetry from the still-open page. For an upload after reloading, reselect the same files. A failed upload can leave unlisted files; the organiser can review these using the maintenance instructions.

Forgotten passwords

The default setup deliberately avoids email delivery services. A person who can still sign in can change their password under Account. If someone cannot sign in, the organiser can use the supplied admin-reset-password.mjs utility on a computer with Node.js 22 or newer:

npm ci --omit=dev
node admin-reset-password.mjs

Run these commands in the extracted package folder. The utility prompts privately for the project’s secret/service_role key and the new password, keeps them in memory, and resets only the specified existing account. It does not save them to a file. Never put that key in config.js, upload the utility to the website, or share the key with group members. If terminal tools are unfamiliar, ask for help with this step; do not delete and recreate the person’s account, because their photos belong to its existing user ID.

Updating the website

Keep a copy of your configured site/config.js. For a future app update, copy that configuration into the new site folder, then create a new production deployment in the same Cloudflare Pages project. Photos and accounts stay in Supabase. Do not delete the project or rerun unrelated replacement database scripts.

Try it before setup

Open site/index.html in a desktop browser and choose Try practice mode. On some devices, local HTML has limited support; you can instead upload the unconfigured site folder to Cloudflare first, practise there, then add your configuration and redeploy. Practice mode keeps your photos only in that tab. Reloading, closing or exiting practice clears them; they are never uploaded or shared.

Reference links

Prepared 15 September 2026. No Cloudflare or Supabase project has been created or connected by this download. Native phone behaviour and live multi-user uploads should be checked with the short checklist above after setup.