Greasy Fork is available in English.

Rotate images

17.06.2020, 22:52:27

  1. // ==UserScript==
  2. // @name Rotate images
  3. // @namespace BladeMight Scripts
  4. // @include /^https?.*/
  5. // @grant none
  6. // @version 1.0009
  7. // @author BladeMight
  8. // @description 17.06.2020, 22:52:27
  9. // ==/UserScript==
  10. var mx, my;
  11. var img_b64 = "url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAIAAACQkWg2AAAABGdBTUEAALGPC/xhBQAAABp0RVh0U29mdHdhcmUAUGl4QnVpbGRlciBTdHVkaW/FWXY7AAABwklEQVQ4T2NwIBGANJw5w0Akgmo4f4T13HGWsyeZzp5mRFOBhqAaLu/hvrSPiwEvQNFwbbPgta0CQNErO3kv7+a5tJfr4n7OCwfZLxxmO3+U5dxxZnQNt1aJ31wjChS9sUH4+ibBa1sErm7jv7KD9/IunksgyzmBUhcOsQFdDtVwb6Hs3cUyd5ZK3V4ueWul+M3VYjfWidxYL3x9oxBQKVAz2HIeIAnV8HCG8sNZSkD+/Xny9xaANS+Rvr0MqFni1moxoDgEAF0O1fC0XxMqxsAA0jxT6cFsRbBmubuLgPqlgeK3V0gAXQ7VAOS/6NADks96tYHkkwkajyerPZ6q+mi6ClTzXIX78+WALodqeFtn+qbBBKj0VYvhyzYDoObnXbrPerSf9mk9naDxZJI6UOrRNBWg5VANH0qt35dbAUXfVZu/rTV7U2/yutH4VbPhy1aDF+36zzt1wZZrAV0O1fAlx/FzHshheMCrVoOXbfpQDT+SPb6nun1Ld/2a6fwlx+lLrsPnfPtPhXYfS2wglr+rsnhbYw50OVTDn2i/3zE+v+K8fyZ6gjSnuAM1f8t0+ZoN1OwI1VxsC9QM1UACcHAAAII+JPmc2jrCAAAAAElFTkSuQmCC')";
  12. var img_b64_push = "url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAIAAACQkWg2AAAABGdBTUEAALGPC/xhBQAAABp0RVh0U29mdHdhcmUAUGl4QnVpbGRlciBTdHVkaW/FWXY7AAABpUlEQVQ4T2NwIBGANJxh4CMSQTWcZ5U9xyJ+jkngLCM/mgo0BNVwmVvnEpf2f7wARcN1QYdrAnZA0cu8Rld4jICaL3KqXmRXucAmd4FF5iyzGLqGm+JBN0V9gKI3hd2uC9oDNV/lt4RovsitfZlTCygF1Ax0OVTDfdm0OzIJd6TibktGAjXfEgu6IeIN1HxNyBWoFKgZSAI1A0mohofKFQ+VS4D8+/I5EM13pROAmm9JBAM1A8UhAOhyqIanml1Qsf//wZorHigUAjXfk0u7K5sK1AwUvyMBshyqAch/oTcdSD7VngAkH2u2PlatA6JHKpVQzYq59+SygZZDNbwxW/fadCVQ6SujxS8M5gA1P9edBtT8VLv7iUbnE41WoBREM1TDB5v97y33AUXfmm8Gotema18br4BqNpgD1AyUeqY1AehyqIYvDlc+O54HiuIBrwwWATVDNfzwePrd9clX9/tfnW9+cbryxeHCZ/vzn+xOfbQ+ArH8ncUOoM1Al0M1/Pb/+dv36y+v9z+8XoE0u4M1u9766nwVZDlEsy1IM1QDCcDBAQBG/oKAP6AiGQAAAABJRU5ErkJggg==')";
  13. var flip_b64 = "url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAIAAACQkWg2AAAABGdBTUEAALGPC/xhBQAAABp0RVh0U29mdHdhcmUAUGl4QnVpbGRlciBTdHVkaW/FWXY7AAABXElEQVQ4T2NwIBGANPwPDoajf6FBf6L8fsV7fU9x/5rl/Dnf/mOJzbtKizf1Jq9aDNE1/I3w/x3r8yPZ41uGy5dcx49Ftu8rLN/Wmr5qMnrRrvesVwuh4W94wO8Y35+Jnt/T3L5kO30qtPtQZvWu2vx1g/HLNv3n3TpPJmg8mqYC1QB1QyoWNzzv1H3ar/l4iurDWUr358tBNSDcUGzLwMCA7AYg9+EM5ftzFe4ulrm9QgKq4UsO1A1AaTQ3PJitCBS8s0zq5mqx6xuFoBqAbgCKEgSXd/FANcDdABR9Mkkd2Q0314oCBa/s4L20j+vCYTaoBmQ3AKXvLZSFuwFk8B7uiwfZzx1nOXMGpBiEkcPhzhLpW6vEb6wXvrZFAOiGiwc4zh9lPXuKEagaoQHsBnm4G65tFoS74dwJZohSFA3Ibri6jR/ZDWgIqgGPG9AQVAMeN6AhqAYSgIMDAOGUSM3NHQEIAAAAAElFTkSuQmCC')";
  14. var flip_b64_push = "url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAIAAACQkWg2AAAABGdBTUEAALGPC/xhBQAAABp0RVh0U29mdHdhcmUAUGl4QnVpbGRlciBTdHVkaW/FWXY7AAABVElEQVQ4T2NwIBGANLwN/g9HH4L+ffX//cvr+3f3N1+dH322v/7R+sw7i4OvTbe9MlqNruGT/9+fvr9/eLz96vr4i8Odj7Zn31seemO2/ZXR+hd6S55pzURoACr94ffrh9en764vvjjd/WR36YPV8bfme14bb3hhsPS57qzHmn2PVJqgGvC44bnu/Keakx+rtj9UrrknVwLVgOyG////I7sByH2o3HhfseyOTOYdiSSoBrgbgNJobnigUAUUvCOVfEss+pqQH1QD0A1AUYLgCo81VAPcDUDRJxp9yG64KRoGFLzMa32Jy+QCmzpUA7IbgNL3ZfPhbgCp5ja9yK57jkXxDIMEVANyONyVzrwpHn1TOOCagAfQDRc49M6zqp1llASqRmgAuUG+FO6G64KecDecZZaHKEXRgOyGq/xOyG5AQ1ANeNyAhqAa8LgBDUE1kAAcHADuzG/GyEfMIwAAAABJRU5ErkJggg==')";
  15. var last, last_img, last_fl, last_flv, lock_timeout = 0;
  16. const bst = "z-index: 2000 !important; min-height: 16px !important; \
  17. padding: 0 !important; width: 16px !important; height: 16px !important; \
  18. border: 0px !important; color: red !important; position: absolute !important;";
  19. window.onmousemove = (event) => {
  20. mx = event.clientX;
  21. my = event.clientY;
  22. var elms = document.elementsFromPoint(mx, my);
  23. var img = elms[0];
  24. if (img) {
  25. var p = img.parentNode;
  26. // console.log(img);
  27. if (img.tagName !== "IMG" && img.className.includes("lshowprev")) {
  28. if (img.firstChild.tagName === "IMG")
  29. img = img.firstChild;
  30. else
  31. img = p.querySelector("img");
  32. }
  33. if (img.tagName === "IMG" || img == last || img == last_fl || img == last_flv) {
  34. if (img.width >= 48 && img.height >= 18) {
  35. var bc = img.getBoundingClientRect();
  36. // console.log("OFFL: ", bc);
  37. var BMRI_BASE = document.createElement("div");
  38. BMRI_BASE.className = "BMRI_BASE_DIV";
  39. BMRI_BASE.style.cssText = "position: fixed !important; left: " + bc.left + "px; top: " + bc.top + "px;";
  40. var br = img.getBoundingClientRect();
  41. if (!p.querySelector(".BMRI_rotate_right")) {
  42. var ch = document.createElement("button");
  43. ch.style.cssText = bst + "background: "+img_b64+" !important;";
  44. ch.className = "BMRI_rotate_right";
  45. var rotation = 0;
  46. ch.onclick = (e) => {
  47. e.stopPropagation();
  48. e.preventDefault()
  49. img.style.transition = "transform 0.3s ease-in";
  50. rotation += 90;
  51. if (!/rotate/.exec(img.style.transform))
  52. img.style.transform += "rotate("+rotation+"deg)";
  53. else
  54. img.style.transform = img.style.transform.replace(/rotate\(\d+deg\)/, "rotate("+rotation+"deg)");
  55. img.style["pointer-events"] = "none";
  56. if (rotation > 270) rotation = -90;
  57. // console.log("rotate: " + rotation, img)
  58. }
  59. // ch.innerText = "→";
  60. last = ch;
  61. last_img = img;
  62. BMRI_BASE.appendChild(ch);
  63. ch.onmousedown = (e) => { ch.style.background = img_b64_push; };
  64. ch.onmouseup = (e) => { ch.style.background = img_b64; };
  65. }
  66. if (!p.querySelector(".BMRI_flip_img")) {
  67. var fl = document.createElement("button");
  68. fl.style.cssText = bst + "background: "+flip_b64+" !important; left: 16px !important;";
  69. fl.className = "BMRI_flip_img";
  70. var x = 1;
  71. fl.onclick = (e) => {
  72. e.stopPropagation();
  73. e.preventDefault()
  74. img.style.transition = "transform 0.3s ease-in";
  75. if (x == 1) { x = -1; } else { x = 1; }
  76. if (!/scaleX/.exec(img.style.transform))
  77. img.style.transform += "scaleX("+x+")";
  78. else
  79. img.style.transform = img.style.transform.replace(/scaleX\([\d-]+\)/, "scaleX("+x+")");
  80. }
  81. BMRI_BASE.appendChild(fl);
  82. fl.onmousedown = (e) => { fl.style.background = flip_b64_push; };
  83. fl.onmouseup = (e) => { fl.style.background = flip_b64; };
  84. last_fl = fl;
  85. }
  86. if (!p.querySelector('.BMRI_flip_ver_img')) {
  87. var flv = document.createElement("button");
  88. flv.style.cssText = bst + "background: "+flip_b64+" !important; left: 31px !important; transform: rotate(90deg) !important;";
  89. flv.className = "BMRI_flip_ver_img";
  90. var y = 1;
  91. flv.onclick = (e) => {
  92. e.stopPropagation();
  93. e.preventDefault()
  94. img.style.transition = "transform 0.3s ease-in";
  95. if (y == 1) { y = -1; } else { y = 1; }
  96. if (!/scaleY/.exec(img.style.transform))
  97. img.style.transform += "scaleY("+y+")";
  98. else
  99. img.style.transform = img.style.transform.replace(/scaleY\([\d-]+\)/, "scaleY("+y+")");
  100. }
  101. BMRI_BASE.appendChild(flv);
  102. flv.onmousedown = (e) => { flv.style.background = flip_b64_push; };
  103. flv.onmouseup = (e) => { flv.style.background = flip_b64; };
  104. last_flv = flv;
  105. }
  106. if (!document.querySelector(".BMRI_BASE_DIV"))
  107. p.appendChild(BMRI_BASE);
  108. } // else if (img.tagName === "IMG") { console.log("Too small img: " + img.width + "x" + img.height); }
  109. } else {
  110. if (last_img) {
  111. last_img.style.transform = "rotate(0deg)";
  112. last_img.style.transform = "";
  113. if (lock_timeout === 0)
  114. setTimeout(() => { clock_timeout = 0; last_img.style.transition = "";}, 300);
  115. lock_timeout = 1;
  116. last_img.style["pointer-events"] = "";
  117. }
  118. var BB = document.querySelector(".BMRI_BASE_DIV");
  119. if (BB) BB.remove();
  120. if (last) last.remove();
  121. if (last_fl) last_fl.remove();
  122. if (last_flv) last_flv.remove();
  123. }
  124. }
  125. // console.log(mx, my);
  126. }