OJS 3 Lens Reader needs a back button

Feature Requests
,
4

Greetings @Richard_Pilbery and @asmecher
I have contacted with the developer and he gave me a hint how to do this in simple way (add “back” button).
After some coding I propose this variant:

  1. Download the latest version of Lens viewer from here Releases · elifesciences/lens · GitHub. Needed file is lens-2.0.0.zip. There are fixes that will help to avoid eternal loading problem if xml document.

  2. Create new javascript file in the directory …/lib/lens/lensAdd.js

  3. Add this lines in it:
    $(document).ready(function(){
    $(“body”).prepend("< a class=“back-button” href="./">Back");
    });
    place between “<” and “a class=” was left because this code actually makes this element on forum.

  4. Add this line in /templates/display.tpl:
    <script src="{$pluginLensPath}/lensAdd.js" defer></script>
    it should be placed just above this line: <script type="text/javascript">{literal}

  5. The last thing is modifying …/lib/lens/lens.css. Just add the style for button:
    .back-button {
    display: block;
    position: absolute;
    top: 0px;
    right: 0px;
    z-index: 30000;
    padding: 9.5px;
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    color: black;
    font-size: 13px;
    }

    .back-button:hover {
    background-color: rgba(0, 0, 0, 0.05);
    }

Code example: GitHub - Vitaliy-1/OJSLensPlugin: Lens viewer plugin for OJS3

It should to be noted that back button will load before the main text. This is how it looks on our site: https://e-medjournal.com/index.php/psp/article/view/11/9 (top right corner)

2 Likes