Twitter 图片查看增强

让推特图片浏览更加人性化

当前为 2020-02-16 提交的版本,查看 最新版本

  1. // ==UserScript==
  2. // @name Twitter image viewing enhancement
  3. // @name:zh-CN Twitter 图片查看增强
  4. // @name:zh-TW Twitter 圖像查看增強
  5. // @icon https://twitter.com/favicon.ico
  6. // @namespace https://moe.best/
  7. // @version 0.4.5
  8. // @description Make Twitter photo viewing more humane
  9. // @description:zh-CN 让推特图片浏览更加人性化
  10. // @description:zh-TW 讓 Twitter 照片瀏覽更人性化
  11. // @author Jindai Kirin
  12. // @include https://twitter.com/*
  13. // @license MIT
  14. // @grant none
  15. // @run-at document-end
  16. // @require https://cdn.bootcss.com/jquery/3.4.1/jquery.slim.min.js
  17. // @require https://cdn.bootcss.com/jquery-mousewheel/3.1.13/jquery.mousewheel.min.js
  18. // ==/UserScript==
  19.  
  20. (function() {
  21. 'use strict';
  22.  
  23. const closeBtn = () => $('div[aria-labelledby="modal-header"] > div[role="presentation"] > div[role="button"]');
  24. const pnBtn = () => {
  25. const result = {};
  26. const btns = Array.from($('div[aria-labelledby="modal-header"] > div div[role="presentation"] > div[role="button"]'));
  27. const centerPos = $(window).width() / 2;
  28. btns.forEach(el => {
  29. const $el = $(el);
  30. const pos = $el.offset().left + $el.width() / 2;
  31. if (pos < centerPos) result.prev = $el;
  32. else result.next = $el;
  33. });
  34. return result;
  35. };
  36. const closeImgView = () => closeBtn().click();
  37. const prevImg = () => {
  38. const $btn = pnBtn().prev;
  39. if ($btn) $btn.click();
  40. };
  41. const nextImg = () => {
  42. const $btn = pnBtn().next;
  43. if ($btn) $btn.click();
  44. };
  45.  
  46. $(window).mousewheel(({ deltaY, target: { tagName, baseURI } }) => {
  47. if (tagName == 'IMG' && /\/photo\//.test(baseURI)) {
  48. switch (deltaY) {
  49. case 1:
  50. prevImg();
  51. break;
  52. case -1:
  53. nextImg();
  54. break;
  55. }
  56. }
  57. });
  58.  
  59. let x = 0;
  60. let y = 0;
  61. $(window).mousedown(({ clientX, clientY }) => {
  62. x = clientX;
  63. y = clientY;
  64. });
  65. $(window).mouseup(({ button, clientX, clientY, target: { tagName, baseURI } }) => {
  66. if (button !== 0 || !(tagName == 'IMG' && /\/photo\//.test(baseURI))) return;
  67. const [sx, sy] = [clientX - x, clientY - y].map(Math.abs);
  68. const mx = clientX - x;
  69. if (sx <= 10 && sy <= 10) closeImgView();
  70. if (sy <= sx) {
  71. if (mx > 0) prevImg();
  72. else if (mx < 0) nextImg();
  73. }
  74. });
  75. })();