SharePoint publishing pages: Prompting the user when they might lose changes

Yes, so first of all apologies for the slightly wordy and not particularly "on point" title for this post - I can't quite how to name it, hence the above...

The problem

Anyway, what this post is about is how to give users creating and editing publishing pages in SharePoint a better experience when leaving a page that is in edit mode. This arose from a customer complaining that if they accidentally (or even purposely) click on the back button, or hit F5 or even click on a link somewhere whilst editing a page they get whisked away without a shadow of a warning meaning that there will be a high chance of losing any unsaved work.

I wanted a quick a dirty solution for this scenario that works in SharePoint Online, which means JavaScript. I'm not claiming that what I'm about to show you is the best possible way to manage this, but it works and the customer was really happy that I was able to throw a solution together for them so quickly.

SharePoint Online Variations in an existing site and redirecting from the root site

I've had occasion to refresh my knowledge of the variations features in SharePoint Online recently and ran into an 'issue' that I thought I'd (a) share and (b) record for future reference.

There are plenty of decent guides to the basic setup approach for variation labels, etc. out in the ether of the internet already (this is my reference article), so I won't go over that again here, but I had to work through a scenario where an existing site collection, already used as a publishing site, needs to have variation sites created beneath it.