☰

Tab viewing timer

Timer for when a tab being focused in HH:MM format. Reset after 24 hours.

  1. // ==UserScript==
  2. // @name        Tab viewing timer 
  3. // @description Timer for when a tab being focused in HH:MM format. Reset after 24 hours.
  4. // @version     1.0
  5. // @author      Jenie
  6. // @namespace   FFW Scripts
  7. // @include     *
  8. // @grant       none
  9. // @noframes
  10. // @license     MIT
  11. // ==/UserScript==
  12.  
  13. document.body.insertAdjacentHTML(
  14. 	'beforeend',
  15. 	`<div id="timer" title="${new Date()}" style="position:fixed;bottom:0;right:0;color:#fff;background-color:#000;padding:10px;z-index:1000000;cursor:pointer;border-radius:2px;margin:10px;"><span>00:00</span></div>`
  16. );
  17.  
  18. const timerSpan = document.querySelector('div#timer > span');
  19. let focused = !0;
  20. let seconds = 0;
  21. window.setInterval(() => {
  22. 	if (!focused) return;
  23. 	seconds++;
  24. 	timerSpan.textContent = new Date(seconds * 1000).toISOString().substr(11, 5);
  25. }, 1000);
  26.  
  27. const timerDiv = document.querySelector('div#timer');
  28. timerDiv.addEventListener('click', () => {
  29. 	focused = !focused;
  30. 	timerDiv.style.color = focused ? '#fff' : 'red';
  31. });
  32.  
  33. window.addEventListener('blur', () => {
  34. 	focused = !1;
  35. 	timerDiv.style.color = 'red';
  36. });
  37. window.addEventListener('focus', () => {
  38. 	focused = !0;
  39. 	timerDiv.style.color = '#fff';
  40. });