Imgur Album Slideshow

Adds a menu to Imgur albums to start a slideshow

目前为 2017-04-05 提交的版本。查看 最新版本

  1. // ==UserScript==
  2. // @name Imgur Album Slideshow
  3. // @version 2017.03.05.02
  4. // @description Adds a menu to Imgur albums to start a slideshow
  5. // @author Withaika
  6. // @match *://imgur.com/a/*
  7. // @grant none
  8. // @require http://code.jquery.com/jquery-1.12.4.min.js
  9. // @require http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js
  10. // @namespace https://gf.qytechs.cn/users/94615
  11. // ==/UserScript==
  12.  
  13. (function() {
  14. $("#right-content").prepend("<div id='ssMenu' style='box-sizing: border-box;width: 300px;padding: 8px;background-color: #2c2f34;border-radius: 4px;height: 135px;'><center><p style='display:inline-block;padding-bottom:10px;'>Delay (s):</p><input value='3' style='display:inline-block;width:30px;margin-bottom:10px;'id='ssSec'></input></center><center><p style='margin-top:-5px;'>Randomize:</p><label class='switch'><input id='randomize' type='checkbox'><div class='slider round'></div></label></center><center style='margin-top:5px;'><button id='ssStart' style='text-align: center;cursor: pointer;padding-left: 8px;height: 36px;box-sizing: border-box;padding-right: 8px;background: #5c69ff;border: none;color: #F2F2F2;text-decoration: none;outline: 0;-webkit-user-select: none;user-select: none;cursor: pointer; display: inline-block;border-radius: 2px;font-size: 14px;border: none;font-family: \"Open Sans\",sans-serif;'>Start Slideshow</button><div id='restart' style='display:none'><p style='display:inline-block'> </p><button id='ssReStart' style='text-align: center;cursor: pointer;padding-left: 8px;height: 36px;box-sizing: border-box;padding-right: 8px;background: #ed6d6d;border: none;color: #F2F2F2;text-decoration: none;outline: 0;-webkit-user-select: none;user-select: none;cursor: pointer; display: inline-block;border-radius: 2px;font-size: 14px;border: none;font-family: \"Open Sans\",sans-serif;'>Restart Slideshow</button></div></center></div>");
  15. $('body').prepend('<style>.switch { position: relative; display: inline-block; width: 45px; height: 20px; }.switch input {display:none;}.slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #ccc; -webkit-transition: .4s; transition: .4s; } .slider:before { position: absolute; content: ""; height: 12px; width: 12px; left: 4px; bottom: 4px; background-color: white; -webkit-transition: .4s; transition: .4s; } input:checked + .slider { background-color: #2196F3; } input:focus + .slider { box-shadow: 0 0 1px #2196F3; } input:checked + .slider:before { -webkit-transform: translateX(26px); -ms-transform: translateX(26px); transform: translateX(26px); } .slider.round { border-radius: 34px; } .slider.round:before { border-radius: 50%; }</style>');
  16. })();
  17.  
  18. var slideIndex = 1;
  19. var Images=[];
  20.  
  21. function plusDivs(n) {
  22. showDivs(slideIndex += n);
  23. }
  24.  
  25. function showDivs(n) {
  26. var i;
  27. var x = Images;
  28. if (n > x.length) {slideIndex = 1;}
  29. if (n < 1) {slideIndex = x.length;}
  30. document.getElementById("FSSI").src=x[slideIndex-1];
  31. }
  32.  
  33. function startSlide(){
  34. document.getElementById("restart").style.display="inline-block";
  35. if (document.getElementById("randomize").checked){undefinedImages = _widgetFactory._.config.gallery.image.album_images.randomize();}else{undefinedImages = _widgetFactory._.config.gallery.image.album_images;}
  36. for (i=0;i<undefinedImages.length;i++){
  37. ext=undefinedImages[i].ext;
  38. hsh=undefinedImages[i].hash;
  39. Images.push("https://i.imgur.com/"+hsh+ext);
  40. }
  41. var delay = parseInt(document.getElementById("ssSec").value);
  42. var isPaused=false;
  43. $("body").append("<div id='ss' style='background:#000;width:100%;height:auto;position:relative;'><button id='manualBack' style='position:absolute;float:right;top:50%;left:0;z-index:3;font-size:40px;background-color:rgba(0, 0, 0, 0.0);;color:#FFF;border:none;-moz-transform: scale(-1, 1);-webkit-transform: scale(-1, 1);-o-transform: scale(-1, 1);-ms-transform: scale(-1, 1);transform: scale(-1, 1);'>&#9658;</button><center><img id='FSSI' style='width:auto;height:100%;' src=''></center><button id='manualForward' style='position:absolute;float:right;top:50%;left:96.5%;z-index:3;font-size:40px;background-color:rgba(0, 0, 0, 0.0);color:#FFF;border:none;'>&#9658;</button></div>");
  44. document.getElementById("manualBack").addEventListener("click", function(){
  45. isPaused=true;
  46. plusDivs(-1);
  47. });
  48. document.getElementById("manualForward").addEventListener("click", function(){
  49. isPaused=true;
  50. plusDivs(1);
  51. });
  52. $(document).keydown(function(e) {
  53. switch(e.which) {
  54. case 37: // left
  55. plusDivs(-1);
  56. break;
  57. case 38: // up
  58. delay--;
  59. break;
  60. case 39: // right
  61. plusDivs(1);
  62. break;
  63. case 40: // down
  64. delay++;
  65. break;
  66. case 32: // space
  67. if (isPaused){isPaused=false;}else{isPaused=true;}
  68. break;
  69. case 27: // escape
  70. FSTog(document.getElementById("ss"));
  71. clearInterval(intID);
  72. break;
  73. default: return;
  74. }
  75. e.preventDefault();
  76. });
  77. showDivs(slideIndex);
  78. FSTog(document.getElementById("ss"));
  79. var intID=window.setInterval(function(){
  80. if(!isPaused) {
  81. plusDivs(1);
  82. }
  83. }, delay*1000);
  84. }
  85.  
  86. function FSTog(element) {
  87. if (!element.fullscreenElement && !element.mozFullScreenElement && !element.webkitFullscreenElement && !element.msFullscreenElement ) {
  88. if (element.requestFullscreen) {
  89. element.requestFullscreen();
  90. } else if (element.msRequestFullscreen) {
  91. element.msRequestFullscreen();
  92. } else if (element.mozRequestFullScreen) {
  93. element.mozRequestFullScreen();
  94. } else if (element.webkitRequestFullscreen) {
  95. element.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
  96. }
  97. } else {
  98. if (element.exitFullscreen) {
  99. element.exitFullscreen();
  100. } else if (element.msExitFullscreen) {
  101. element.msExitFullscreen();
  102. } else if (element.mozCancelFullScreen) {
  103. element.mozCancelFullScreen();
  104. } else if (element.webkitExitFullscreen) {
  105. element.webkitExitFullscreen();
  106. }
  107. }
  108. }
  109.  
  110. Array.prototype.randomize = function() {
  111. array=this;
  112. var currentIndex = array.length, temporaryValue, randomIndex;
  113. while (0 !== currentIndex) {
  114. randomIndex = Math.floor(Math.random() * currentIndex);
  115. currentIndex -= 1;
  116. temporaryValue = array[currentIndex];
  117. array[currentIndex] = array[randomIndex];
  118. array[randomIndex] = temporaryValue;
  119. }
  120. return array;
  121. };
  122.  
  123. document.getElementById("ssStart").addEventListener("click", function(){
  124. startSlide();
  125. });
  126. document.getElementById("ssReStart").addEventListener("click", function(){
  127. startSlide();
  128. slideIndex = 1;
  129. });

QingJ © 2025

镜像随时可能失效,请加Q群300939539或关注我们的公众号极客氢云获取最新地址