New Add-on: Remind Me Of That Page

Posted Saturday, December 14th, 2019 

development

I just made a new add-on that I believe you people might like. It is an add-on to help remember to check back on a page at a different date. Have you ever been in one of those situations reading a web page and thought that you needed to check back there in 15 days or next year, and totally forgot to do it? Well, this add-on is for you.

It works by generating a calendar file in the iCalendar format with the date, url and reason for checking back the page. Then, you can add this event to your calendaring application. An image is worth a thousand badly written words:

The add-on is available from addons.mozilla.org. It is a very simple and useful add-on. Anyway, the source is available from sourcehut in case you want to check it out. This is a vanilla add-on, no library, framework or build system was used.

Creating it was fairly easy. All the code is inside the pageAction popup. It picks the data from the fields used to set the date, time, url and description (aka a short text to help you remember why you need to check back on that page) and generates the iCalendar file. My iCalendar generation was a bit sloppy but I decided to do it by hand instead of adding a library an a build system to this add-on. It works and works well but it is a bit ugly. I’m just replacing strings on a template as can be seen this file:

...
let description = `Page To Check: ${url}\\n\\n${document.getElementById('description').value}`

date = date
    .replace(/-/gi, '')
    .replace(/:/gi, '')
    .slice(0, 15)

let event = template
    .replace(/\%URL\%/gi, fold(url))
    .replace(/\%DATETIME\%/gi, date)
    .replace('%DESCRIPTION%', fold(description))

console.log(event);
...

The code would be even simpler if we didn’t need to fold the iCalendar file into lines of maximum 75 characters.

I think this was the most useful add-on I’ve built in less than 3 hours rsrsrs.