Replacing irccloud with open web technologies

I’ve been a very happy irccloud user for the last 3 years, I think they offer a great service, but my passion for open web technologies and self-hosting solutions made this service the first candidate to be part of my revolution.

For me, the most important use cases for irccloud are to be always online, keep the logs of all channels I’m in and being notified when someone ping me or an interesting topic arises.

The search for self-hosting starts

With those as primary needs, I started searching for different open source projects but quickly I realised that hosting weechat is the best option for me:

  • It’s open source and well maintained.
  • Super extensible with several scripting languages.
  • Really well documented.
  • Has several opens source clients.

From those clients, I’m specially interested in the web ones, don’t need another app in my phone.

Glowing Bear is for me the best of the web clients:

  • Again well maintained and supported by the community.
  • Works well in desktop and mobile.
  • On the way to be a progressive web app, with manifest and serviceworker support!

What’s missing?

The only part missing in my setup is the ability to this combination of weechat + glowing-bear to use web push to perform notifications. Right now it uses normal desktop notifications to notify about private messages, but that’s not a push from the server running weechat. When we are not running glowing-bear we won’t know. And that part is important!

So what do we need to build? Spoiler alert, I already did, as a proof of concept, so I end up building the following:

  • A weechat plugin that uses web push when you receive a private message to send the notification to your browser.
  • Modify Glowing Bear to use web push and display notifications. Also reopen the client when user clicks on the notifcation.

A webpush Weechat plugin

Based on notifo plugin by Alex Poirot, modified the original python script to use webpush libraries and variables coming from the client.

You can find the weechat script in this github repo.

When you load the script via:
/python load webpush.py


You will be ask to provide a set of variables to make the script work. Some of those variables you will find them in the Glowing Bear client (scroll down for more details), other variables as the VAPID information needed for performing push can be generated by your own or via a curl request doing:
$bash> curl https://webpushproxy.progressiveweb.pw/generatevapid

While setting the variables needed you will see something like:

/set plugins.var.python.webpush.endpoint "https://updates.push.services.mozilla.com/wpush/v1/gAAAAABZC3AKX33Pwsof7y0Q2zppDCJliANyTZIe_UqkYPAKnFmz1dqO-j7YlBpFJOdqMFHwfnJ0gWHDB7bGH1EZ-7MhVHa6lflC82dffJGVXL_vv-5vpWL8AZ0g14ee_kRvWCFof1cA"

Variables settings for webpush plugin

Modifications to the Glowing Bear client

You can find all the modifications done to the client in this github fork (in the branch push_notifications).

Just two modifications. Once you accept to receive notifications from the glowing bear client, you will have in the settings screen the extra variables needed to configure the weechat plugin variables, see the image below:

push settings

The other modification happens directly in the file serviceworker.js where I only had to add the logic to process push notifications, open a new tab is there is no tab already open.

Demo

So I recorded a little video showing how you can receive the notifications even if your tab is closed, hope you enjoy (better to make the video bigger to check the text :O)

 

Playing around with The Physical Web

It’s been a while since I heard the first time from The Physical Web Project, but was not until last Over the Air where I had the chance with @wilsonpage and others to try out my self a beacon, and be surrounded by multiple of this tiny URL emitters.

The concept is quite simple, but at the same time adds so many new paths, questions and possibilities that after some time, that is after restarting my work at Mozilla decided to give it a spin.

My first approach was pretty simple, I spend a lot of time in front of a browser. Firefox for Android and Firefox OS are my choices, when I’m in a mobile device. They take care of my privacy, synchronize tabs with my desktop, also sync passwords, bookmarks, history and are damn fast. So, with all the love that I have for the browser, what could be a better place than the browser to interact with the Physical Web?

I started coding on my spare time, first with the android version, since it’s been a while that I don’t contribute to that project and wanted to refresh my skills.

And just a couple of weeks ago I finished my hack, at the same time that Google Ubiquity conference was happening. I didn’t have the opportunity to attend but while watching it offline came to the Physical Web introduction video that you can watch below:

Scott Jenson talk was stunning and pretty inspirational. So many possibilities! But the thing that make me open my eyes the most was the announcement of Opera and Chrome considering to add the concept of the Physical Web to their browsers! \o/

Seems I was not that crazy! So after another couple of nights finally I managed to polish the hack. Integration of the Physical Web into Firefox for Android, still a lot to do, but it does work beautifully.

No better place to find physical urls than your browser ?

After talking with some people from the Firefox for Android team they commented that will be amazing to have it as an add-on, for that we still need to wait until Gecko catch up with the implementation of the W3C Web Bluethooth api, but that will be really soon!