☰

Pocket Web Reader Width

Change the width of the article view in the Pocket.com Web Reader

  1. // ==UserScript==
  2. // @name         Pocket Web Reader Width
  3. // @version      2016-08-29
  4. // @description  Change the width of the article view in the Pocket.com Web Reader
  5. // @author       abartonkc
  6. // @match        https://getpocket.com/a/*
  7. // @grant        none
  8. // @namespace https://greasyfork.org/users/63029
  9. // ==/UserScript==
  10.  
  11. (function() {
  12.     'use strict';
  13.  
  14. //  Create column_width_array of options to be added
  15.     var column_width_array = ["600px","800px","1000px","1200px"];
  16.  
  17.     function changeWidth(newWidth) {
  18.         var reader_content = document.getElementsByClassName('reader_content');
  19.         reader_content[0].style.maxWidth = newWidth;
  20.     }
  21.  
  22.     function addWidthControl() {
  23.         var rightIconDiv = document.getElementById("pagenav_more").parentNode;
  24.         //    var rightIcons = document.getElementsByClassName('icons rightItem');
  25.         //    var rightIconDiv = rightIcons[0];
  26.  
  27.  
  28.         //  Create the list item that will be added the rightIcon menu
  29.         var listItem = document.createElement("li");
  30.         listItem.id = "pagenav_width";
  31.  
  32.         //  Create the selectList for the reading column width options
  33.         var selectList = document.createElement("select");
  34.         selectList.id = "myWidth";
  35.         selectList.name = "myWidth";
  36.         selectList.title = "Reading Column Width";
  37.         selectList.className = "hint-item";
  38.         selectList.setAttribute("data-intro", "Reading Width");
  39.         selectList.style.position = "relative";
  40.         selectList.style.left = "15px";
  41.         selectList.onchange = function(){changeWidth(myWidth.value);};
  42.  
  43.         //  Create and append the options for each width size
  44.         for (var i = 0; i < column_width_array.length; i++) {
  45.             var option = document.createElement("option");
  46.             option.value = column_width_array[i];
  47.             option.text = column_width_array[i];
  48.             selectList.appendChild(option);
  49.         }
  50.  
  51.         //  Append the select list and list item to the rightIcon menu
  52.         listItem.appendChild(selectList);
  53.         rightIconDiv.appendChild(listItem);
  54.     }
  55.  
  56.     function checkForPageReader() {
  57.         if (document.getElementById("page_reader") == null) {
  58.             setTimeout(checkForPageReader, 2000);
  59.         }
  60.         else {
  61.             addWidthControl();
  62.         }
  63.     }
  64.  
  65.     checkForPageReader();
  66. })();