☰

Webpages slideshow

Loop display a serial of webpages. Display time for each page can be set.

  1. // ==UserScript==
  2. // @name         Webpages slideshow
  3. // @namespace    https://github.com/aleung/
  4. // @version      1.1.0
  5. // @description  Loop display a serial of webpages. Display time for each page can be set.
  6. // @author       Leo Liang
  7. // @license      MIT License
  8. // @include      *
  9. // @noframes
  10. // @require      https://openuserjs.org/src/libs/sizzle/GM_config.js
  11. // @grant        GM_setValue
  12. // @grant        GM_getValue
  13. // @grant        GM_addStyle
  14. // @grant        GM_addValueChangeListener
  15. // ==/UserScript==
  16.  
  17.  
  18. (function(){
  19.   'use strict';
  20.  
  21.   let redirectTimer;
  22.  
  23.   function enableRedirect(delay, url) {
  24.     redirectTimer = window.setTimeout( () => window.location.replace(url), delay * 1000 );
  25.   }
  26.  
  27.   function disableRedirect() {
  28.     if (redirectTimer) {
  29.       window.clearTimeout(redirectTimer);
  30.     }
  31.   }
  32.  
  33.   function currentStatus() {
  34.     return GM_getValue('enable', false);
  35.   }
  36.  
  37.   function getPagesConfig() {
  38.     const pagesConfig = GM_config.get('pages');
  39.     return pagesConfig.split('\n')
  40.       .map(line => line.split(/,(.*)/).map(s => s.trim()))
  41.       .filter(arr=> arr.length >= 2 );
  42.   }
  43.  
  44.   function showStatus() {
  45.     document.getElementById('web-slideshow-status').textContent = currentStatus() ? '\u2759 \u2759' : '\u25B6';
  46.   }
  47.  
  48.   function play() {
  49.     showStatus();
  50.     if (currentStatus()) {
  51.       const pages = getPagesConfig();
  52.       const validPageId = (page) => (page >= pages.length) ? 0 : ((page < 0) ? pages.length - 1 : page);
  53.       const pageId = validPageId(GM_getValue('page', 0));
  54.       const url = pages[pageId][1];
  55.       const delay = pages[validPageId(pageId - 1)][0];
  56.       GM_setValue('page', pageId + 1);
  57.       enableRedirect(delay, url);
  58.     } else {
  59.       disableRedirect();
  60.     }
  61.   }
  62.  
  63.   function setupControl() {
  64.     GM_config.init({
  65.       id: 'WebpageSlideshowConfig',
  66.       title: 'Webpages Slideshow Settings',
  67.       fields: {
  68.         pages: {
  69.           label: 'Pages to show. One page per line, in format of: seconds, url',
  70.           type: 'textarea',
  71.           default: `5, http://www.funcage.com/
  72. 2, http://www.currenttimestamp.com/`
  73.         }
  74.       },
  75.       css: '#WebpageSlideshowConfig textarea { width: 100%; height: 20em }',
  76.       events: {
  77.         close: () => play()
  78.       }
  79.     });
  80.  
  81.     GM_addStyle(`
  82. #web-slideshow-control {
  83. padding: 4px;
  84. background-color: dimgrey;
  85. opacity: 0.66;
  86. position: fixed;
  87. right: 12px;
  88. bottom: 12px;
  89. }
  90. #web-slideshow-control button {
  91. color: white;
  92. background:none;
  93. border:none;
  94. margin:0;
  95. padding:4px;
  96. }
  97. #web-slideshow-control button:focus {
  98.   outline: none;
  99. }`);
  100.  
  101.     const control = document.createElement('div');
  102.     control.id = 'web-slideshow-control';
  103.     control.innerHTML = `
  104. <button id="web-slideshow-status">?</button>
  105. <button id="web-slideshow-config">\u2699</button>`;
  106.     document.body.appendChild (control);
  107.     document.getElementById('web-slideshow-config').addEventListener (
  108.       'click', () => {
  109.         GM_setValue('enable', false);
  110.         GM_config.open();
  111.       }, false
  112.     );
  113.     document.getElementById('web-slideshow-status').addEventListener (
  114.       'click', () => {
  115.         GM_setValue('enable', !currentStatus());
  116.       }, false
  117.     );
  118.     GM_addValueChangeListener('enable', () => {
  119.       play();
  120.     });
  121.   }
  122.  
  123.   setupControl();
  124.   play();
  125. })();