Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/apursley2012/PunctuOwlity/llms.txt

Use this file to discover all available pages before exploring further.

PunctuOwlity can alert you on the day an event is scheduled using the browser’s built-in Web Notifications API. On first use, the app redirects you to an SMS preference screen to decide whether to allow browser notification prompts. From there, you enable a per-event alert toggle each time you add or edit an event. When the browser has been granted notification permission and an event’s alert is on, a desktop notification fires automatically the first time the events screen is loaded on the event’s day.

​
Enabling a Reminder on an Event

Every event has an alert boolean that defaults to false. To turn on the reminder for a specific event, check the toggle labelled “Would you like to be reminded of this event?” on the add or edit form before saving.
1

Open the Add/Edit form

Tap the floating ＋ button to create a new event, or tap the edit icon on an existing card to modify it.
2

Fill in the required fields

Enter the event title, date, and time. The reminder fires on the matching calendar date, so an accurate date is required for the notification to trigger.
3

Enable the alert toggle

Switch on “Would you like to be reminded of this event?” The eventAlert checkbox maps directly to the alert field stored in the event object.
4

Save the event

Tap Save Event. The alert: true value is persisted with the event in localStorage.

​
SMS Preference Screen

The first time you reach the events screen after logging in, PunctuOwlity checks whether the punctuowlity-sms key exists in localStorage. If the key is absent, the app redirects you to a one-time preference screen (sms.html) before you can proceed. The screen asks: “Thanks for joining PunctuOwlity. Before you continue on to the app, PunctuOwlity would like to send you SMS alerts for upcoming events. Do you want to receive sms alerts?” Two buttons are available:
ButtonStored value
Allow SMS NotificationslocalStorage.setItem('punctuowlity-sms', 'allowed')
No, thankslocalStorage.setItem('punctuowlity-sms', 'denied')
Either choice writes the preference and immediately redirects to events.html. Because the key now exists, this screen is never shown again on the same device. 
// Redirect logic on protected pages (app.js)
if (localStorage.getItem('punctuowlity-sms') === null) {
  location.replace('sms.html');
}

​
Browser Notification Flow

When the events screen loads, the web app evaluates three conditions before firing a notification. All three must be true simultaneously:
  1. Notification.permission === 'granted'
  2. event.alert === true
  3. event.fullDate === today (compared as ISO YYYY-MM-DD strings)
The punctuowlity-sms preference controls only whether the browser permission prompt is requested — it does not gate notification delivery. If sms is 'allowed' and notification permission is still at the default prompt state, the app requests permission immediately on page load: 
if (
  localStorage.getItem('punctuowlity-sms') === 'allowed' &&
  'Notification' in window &&
  Notification.permission === 'default'
) {
  Notification.requestPermission();
}
Once permission is 'granted', the app iterates over all events with alert: true and a matching date, firing a new Notification() for each: 
const today = new Date().toISOString().slice(0, 10);

getEvents()
  .filter(event => event.alert && event.fullDate === today)
  .forEach(event => {
    const key = `punctuowlity-notified-${event.id}-${today}`;
    if (!sessionStorage.getItem(key)) {
      new Notification(event.title, { body: `Scheduled for ${event.time}` });
      sessionStorage.setItem(key, 'true');
    }
  });

​
Notification Content

Each notification displays:
  • Title: the event’s title (e.g. "Dentist")
  • Body: Scheduled for followed by the formatted 12-hour time (e.g. "Scheduled for 01:30PM")

​
De-duplication Within a Session

To prevent the same notification from appearing multiple times when you reload the events page, PunctuOwlity writes a flag to sessionStorage immediately after firing each notification. The key follows the pattern: 
punctuowlity-notified-{eventId}-{YYYY-MM-DD}
Before showing any notification, the app checks for this key. If the flag is already set, the notification is skipped for the remainder of the browser session. The flag is cleared automatically when the tab or window is closed, so the notification can fire once per day per event in a fresh session.

​
Alarm Icon on Event Cards

The alert state of each event is also visible directly on the event card via a colour-coded alarm icon:
StateIconColour
alert: truealarm-on (bell)Teal — #03b0a3
alert: falsealarm-off (bell with slash)Red — #900
// Icon in event card template (app.js)
`<span class="alarm ${e.alert ? 'on' : 'off'}"
       title="${e.alert ? 'Alert on' : 'Alert off'}">
  ${icon(e.alert ? 'alarm-on' : 'alarm-off')}
</span>`

​
Android — SMS Permission

The Android app handles reminders through SmsPermissionActivity, which requests the SEND_SMS Android permission at runtime using the standard permission model. MainActivity checks for the permission on startup and launches SmsPermissionActivity if it has not yet been granted: 
// MainActivity.java
if (ContextCompat.checkSelfPermission(this, Manifest.permission.SEND_SMS)
        != PackageManager.PERMISSION_GRANTED) {
    Intent smsIntent = new Intent(MainActivity.this, SmsPermissionActivity.class);
    startActivity(smsIntent);
}
Browser notifications require the user to explicitly Allow the browser permission prompt. If you dismissed or blocked the prompt previously, you will need to re-enable notifications for the site in your browser’s site settings before the app can show them.
Browser notification support varies by environment. Notifications are not supported on iOS Safari (including all browsers on iPhone and iPad). They may also be suppressed by operating system Focus/Do Not Disturb modes, browser privacy settings, or corporate device policies. The Web Notifications API is intended for desktop browsers; mobile web delivery is unreliable.

Build docs developers (and LLMs) love

Get started for freeTalk to us