client-bs-ss-plugin-2

client-bs-ss-plugin-2.html

<script>
/* Allow keyboard arrow-key based page-turns while lightboxed. 
*  Code: Jeremiah Langner; http://jeremiahlangner.me */

var images = document.getElementsByClassName("thumb-image");

window.onkeyup = function(e) {
   var key = e.keyCode ? e.keyCode : e.which;

   // User presses up key on keyboard.
   if (key == 38 || key == 37) {
    pageUp();
   // User presses down key on keyboard.
   } else if (key == 40 || key == 39) {
    pageDown();
   }
};

function pageUp() {
    var lightBox = document.querySelector('.sqs-lightbox-padder');

    if (lightBox) {
        var currentPageSource = lightBox.getElementsByTagName('img')[0].getAttribute('data-src');
        
        for(i=0; i<images.length; i++) {
            console.log(i);
            if (images[i].getAttribute('data-src') == currentPageSource) {
                console.log('found an image');
                console.log(i);
                if(i !== 0) {
                    var nextPageSource = images[i-1].getAttribute('data-src');
                    lightBox.getElementsByTagName('img')[0].setAttribute('src', nextPageSource);
                    lightBox.getElementsByTagName('img')[0].setAttribute('data-src', nextPageSource);
                }
            }
        }
    }
}

function pageDown() {
    var lightBox = document.querySelector('.sqs-lightbox-padder');

    if (lightBox) {
        var currentPageSource = lightBox.getElementsByTagName('img')[0].getAttribute('data-src');
        
        for(i=0; i<images.length; i++) {
            console.log(i);
            if (images[i].getAttribute('data-src') == currentPageSource) {
                console.log('found an image');
                console.log(i);
                if(i !== images.length-1) {
                    var nextPageSource = images[i+1].getAttribute('data-src');
                    lightBox.getElementsByTagName('img')[0].setAttribute('src', nextPageSource);
                    lightBox.getElementsByTagName('img')[0].setAttribute('data-src', nextPageSource);
                }
            }
        }
    }
}
</script>