JSFiddle - React, Tailwind, and code Playground

by konijn_gmail_com

HTML

<div id="leftcontainer"><a href="#" id="lastlink"><div id="lastbutton">Last</div></a></div>
<div id="rightcontainer"><a href="#" id="nextlink"><div id="nextbutton">Next</div></a></div>

CSS

#lastbutton {
display: inline-block;
width: 80px;
height: 20px;
background-color: #0a72c2;
color: #ffffff;
text-decoration: none;
text-align: center;
padding: 8px;
font-size: 16px;
}

#nextbutton {
display: inline-block;
width: 80px;
height: 20px;
background-color: #0a72c2;
color: #ffffff;
text-decoration: none;
text-align: center;
padding: 8px;
font-size: 16px;
}

#leftcontainer {
margin-top: 30px;
float: left;
text-align: center;
width: 50%;
}

#rightcontainer {
margin-top: 30px;
text-align: center;
float: right;
width: 50%;
}

JavaScript

function linkSet() {
    var currentURL = location.href;
    var lastURL = "";
    var nextURL = "";
    var lastChar = currentURL.charAt(currentURL.length - 2);
    var secondLastChar = currentURL.charAt(currentURL.length - 3);

    if(isNaN(lastChar) === true) {
        //Hide left button, hard code right button to go to ../2
        var leftContain = document.getElementById('leftcontainer');
        var rightContain = document.getElementById('rightcontainer');
        leftContain.style.display = "none";
        rightContain.style.width = "100%";
        rightContain.style.float = "none";
        lastURL = currentURL;
        nextURL = currentURL + "2/";
    } else if(isNaN(secondLastChar) === false) {
        //The page number is a double digit, simply derive last/next
        var twoRoot = currentURL.slice(0, -3);
        var twoSlash = currentURL.substr(currentURL.length - 3);
        var twoDigit = twoSlash.substr(0, 2) * 1;
        lastURL = twoRoot + (twoDigit - 1) + "/";
        nextURL = twoRoot + (twoDigit + 1) + "/";
   } else {
       //The page number is single digit, with a special case for page 2
        var oneRoot = currentURL.slice(0, -2);
        var oneDigit = +lastChar;
        if(onedigit == 2) {
            lastURL = oneRoot;
            nextURL = oneRoot + "3/";
        } else {
            lastURL = oneRoot + (oneDigit - 1) + "/";
            nextURL = oneRoot + (oneDigit + 1) + "/";
        }
    }
    document.getElementById("lastlink").href = lastURL;
    document.getElementById("nextlink").href = nextURL;
}
linkSet();