Prnt.sc: Add 'Next screenshot' and 'Previous screenshot' buttons

Adds 'Next screenshot' and 'Previous screenshot' buttons to screenshots uploaded to https://prnt.sc/ (Lightshot) so the user can cycle through the screenshots uploaded to the website.

// ==UserScript==
// @name         Prnt.sc: Add 'Next screenshot' and 'Previous screenshot' buttons
// @namespace    http://tampermonkey.net/
// @version      0.1.3
// @description  Adds 'Next screenshot' and 'Previous screenshot' buttons to screenshots uploaded to https://prnt.sc/ (Lightshot) so the user can cycle through the screenshots uploaded to the website.
// @author       SUM1
// @icon         https://i.imgur.com/iua3iZq.png
// @match        https://prnt.sc/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';
    if (/^https?:\/\/prnt.sc\/\w{1,9}\/?$/.test(document.URL)) { //                                           Check if we're on a prnt.sc screenshot URL. If we are,
        let style = 'padding:5px 10px;border:1px solid #000;border-radius:5px;margin:3px;cursor:pointer;'; // declare a variable for the style of the buttons;
        let styleHover = style + 'border-color:#545;color:#545;'; //                                          declare a variable for the style of the buttons while hovering over them;
        let styleMouseDown = style + 'background-color:#ccc;'; //                                             declare a variable for the style of the buttons while clicking them.

        let prevButton = document.createElement('button'); //                                                 Create the 'Previous screenshot' button.
        prevButton.innerHTML = '← Previous screenshot'; //                                                    Create its text.
        prevButton.setAttribute('onclick', 'window.location.href = (parseInt(window.location.href.substring(window.location.href.search(/.sc\\//) + 4), 36) - 1).toString(36)'); // Set its function for when clicking it. The function takes the URL's alphanumerical string (which is in base 36; all digits and letters), subtracts 1 from it then takes the user to the new URL.
        prevButton.style = style; //                                                                          Set its style to the previously declared style.
        prevButton.onmouseenter = function(){prevButton.style = styleHover;}; //                              Set its style to change to the previously declared hover style when the mouse hovers over it.
        prevButton.onmouseleave = function(){prevButton.style = style;}; //                                   Set its style to change back when the user moves the mouse away.
        prevButton.onmousedown = function(){prevButton.style = styleMouseDown;}; //                           Set its style to change to the previously declared mousedown style when the user clicks the button.
        prevButton.onmouseup = function(){prevButton.style = style;}; //                                      Set its style to change back when the user releases the mouse button.
        document.body.insertBefore(prevButton, document.querySelector('div.image-constrain')); //             Add the button to the webpage, above the screenshot.

        let nextButton = document.createElement('button'); //                                                 Create the 'Next screenshot' button.
        nextButton.innerHTML = 'Next screenshot →'; //                                                        Create its text.
        nextButton.setAttribute('onclick', 'window.location.href = (parseInt(window.location.href.substring(window.location.href.search(/.sc\\//) + 4), 36) + 1).toString(36)'); // Set its function for when clicking it. The function takes the URL's alphanumerical string (which is in base 36; all digits and letters), adds 1 to it then takes the user to the new URL.
        nextButton.style = style; //                                                                          Set its style to the previously declared style.
        nextButton.onmouseenter = function(){nextButton.style = styleHover;}; //                              Set its style to change to the previously declared hover style when the mouse hovers over it.
        nextButton.onmouseleave = function(){nextButton.style = style;}; //                                   Set its style to change back when the user releases the mouse button.
        nextButton.onmousedown = function(){nextButton.style = styleMouseDown;}; //                           Set its style to change to the previously declared mousedown style when the user clicks the button.
        nextButton.onmouseup = function(){nextButton.style = style;}; //                                      Set its style to change back when the user releases the mouse button.
        document.body.insertBefore(nextButton, document.querySelector('div.image-constrain')); //             Add the button to the webpage, above the screenshot.
    }
})();