Greasy Fork 支持简体中文。

scrolly <3

Scrolling by dragging the mouse.

目前為 2014-12-05 提交的版本,檢視 最新版本

  1. // ==UserScript==
  2. // @id scrollyId
  3. // @name scrolly <3
  4. // @version 1.0
  5. // @namespace azeirah
  6. // @author Martijn Brekelmans
  7. // @description Scrolling by dragging the mouse.
  8. // @locale English
  9. // @include *
  10. // @run-at document-end
  11.  
  12. // ==/UserScript==
  13.  
  14. "use strict";
  15. var az = {};
  16.  
  17. az.toType = function(obj) {
  18. return ({}).toString.call(obj).match(/\s([a-zA-Z]+)/)[1].toLowerCase();
  19. };
  20.  
  21. az.format = function(str, args) {
  22. var re = /\{([^}]+)\}/g;
  23. return str.replace(re, function(_, match) {
  24. return args[match];
  25. });
  26. };
  27.  
  28. az.$ = function(queryString) {
  29. return document.querySelector(queryString);
  30. };
  31.  
  32. az.createElement = function(element, cls, attributes) {
  33. var attr;
  34. cls = cls || "";
  35. attributes = attributes || {};
  36. element = document.createElement(element);
  37. element.className = cls;
  38. for (attr in attributes) {
  39. if (attributes.hasOwnProperty(attr)) {
  40. element.setAttribute(attr, attributes[attr]);
  41. }
  42. }
  43. return element;
  44. };
  45.  
  46. az.magicMousey = (function() {
  47. var lastPosition;
  48. var body = document.body;
  49. var keys = {};
  50. var lastTimes = {};
  51.  
  52. var keyCodes = {
  53. "leftMouse": 1,
  54. "middleMouse": 2,
  55. "rightMouse": 3,
  56. "backspace": 8,
  57. "tab": 9,
  58. "enter": 13,
  59. "shift": 16,
  60. "ctrl": 17,
  61. "alt": 18,
  62. "pause": 19,
  63. "break": 19,
  64. "caps": 20,
  65. "caps lock": 20,
  66. "capsLock": 20,
  67. "escape": 27,
  68. "pageup": 33,
  69. "page up": 33,
  70. "pagedown": 34,
  71. "page down": 34,
  72. "end": 35,
  73. "home": 36,
  74. "left": 37,
  75. "up": 38,
  76. "right": 39,
  77. "down": 40,
  78. "insert": 45,
  79. "delete": 46,
  80. "leftWindows": 91,
  81. "rightWindows": 92,
  82. "select": 93,
  83. "numLock": 144,
  84. "scrollLock": 145,
  85. "semiColon": 186,
  86. "equals": 187,
  87. "comma": 188,
  88. "period": 190,
  89. "forwardSlash": 191,
  90. "graveAccent": 192,
  91. "openBracket": 219,
  92. "backSlash": 220,
  93. "closeBracket": 221,
  94. "singleQuote": 222
  95. };
  96.  
  97. function collectKeycodes(offset) {
  98. return function(value, index) {
  99. keyCodes[value] = index + offset;
  100. };
  101. }
  102.  
  103. function aggregateKeycodes(offset, prefix) {
  104. return function(value, index) {
  105. keyCodes[prefix + value] = index + offset;
  106. };
  107. }
  108.  
  109. "abcdefghijklmnopqrstuvwxyz".split("").forEach(collectKeycodes(65));
  110. "0123456789".split("").forEach(collectKeycodes(48));
  111. "0123456789".split("").forEach(aggregateKeycodes("num", 96));
  112. ["multiply", "add", "subtract", "point", "divide"].forEach(collectKeycodes(106));
  113. [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12].forEach(aggregateKeycodes(112, "f"));
  114.  
  115. keys.leftMouse = false;
  116. keys.middleMouse = false;
  117. keys.rightMouse = false;
  118.  
  119. function generateKeydown(key, keyCode) {
  120. if (key && keyCode) {
  121. keys[key] = false;
  122. }
  123. window.addEventListener('keydown', function(event) {
  124. if (event.keyCode === keyCode) {
  125. keys[key] = true;
  126. }
  127. });
  128. window.addEventListener('keyup', function(event) {
  129. if (event.keyCode === keyCode) {
  130. keys[key] = false;
  131. }
  132. });
  133. }
  134.  
  135. (function() {
  136. var key;
  137. var keyCode;
  138. for (key in keyCodes) {
  139. if (keyCodes.hasOwnProperty(key)) {
  140. keyCode = keyCodes[key];
  141. generateKeydown(key, keyCode);
  142. }
  143. }
  144. }());
  145.  
  146. window.addEventListener('mousedown', function(event) {
  147. var returnVal = true;
  148. lastPosition = {
  149. x: event.clientX,
  150. y: event.clientY
  151. };
  152. if (event.which === 1) {
  153. keys.leftMouse = true;
  154. } else if (event.which === 3) {
  155. keys.rightMouse = true;
  156. } else if (event.which === 2) {
  157. keys.middleMouse = true;
  158. returnVal = false;
  159. }
  160. return returnVal;
  161. });
  162.  
  163. window.addEventListener('mouseup', function(event) {
  164. if (event.which === 1) {
  165. keys.leftMouse = false;
  166. } else if (event.which === 3) {
  167. keys.rightMouse = false;
  168. } else if (event.which === 2) {
  169. keys.middleMouse = false;
  170. }
  171. });
  172.  
  173. function mouseDelta(func) {
  174. window.addEventListener("mousemove", function(event) {
  175. var deltaX;
  176. var deltaY;
  177. var deltaTime;
  178. var newTime;
  179. event.preventDefault();
  180. if (keys.leftMouse || keys.rightMouse || keys.middleMouse) {
  181. if (lastTimes.mousemove !== "undefined") {
  182. newTime = +new Date();
  183. deltaTime = newTime - lastTimes.mousemove;
  184. }
  185. var newPosition = {
  186. x: event.clientX,
  187. y: event.clientY
  188. };
  189. if (!lastPosition) {
  190. lastPosition = newPosition;
  191. return;
  192. }
  193. deltaX = newPosition.x - lastPosition.x;
  194. deltaY = newPosition.y - lastPosition.y;
  195. func(deltaX, deltaY, deltaTime, keys);
  196. lastPosition = newPosition;
  197. lastTimes.mousemove = newTime;
  198. event.returnValue = false;
  199. }
  200. });
  201. }
  202.  
  203. return {
  204. mouseDelta: mouseDelta
  205. };
  206. }(window));
  207.  
  208. (function () {
  209. var text;
  210. var lastTime = +new Date();
  211.  
  212. function getText(e) {
  213. text = (document.all) ? document.selection.createRange().text : document.getSelection();
  214. text += "";
  215. }
  216.  
  217. az.magicMousey.mouseDelta(function (dx, dy, dt, keys) {
  218. getText();
  219. if (keys.leftMouse && (!text)) {
  220. window.scrollBy(-dx, -dy);
  221. }
  222. });
  223. }());
  224.  
  225. // anarchist-state-free scrolling
  226. az.$("html").style.margin = "1000px";
  227. az.$("html").style.width = window.innerWidth + "px";
  228. az.$("html").style.height = window.innerHeight + "px";
  229. // az.$("html").style.height = "1px";
  230. az.$("body").style.width = window.innerWidth + "px";
  231. az.$("body").style.position = "relative";
  232. az.$("body").style.top = "-500px";
  233. az.$("body").style.left = "-500px";
  234. window.scrollTo(500, 500);
  235.  
  236. // text-selection with the scrollwheel
  237. // (function () {
  238. // var text = "";
  239. // var textRange;
  240. // var lastTime = +new Date();
  241.  
  242. // function getText(e) {
  243. // textRange = (document.all) ? document.selection.createRange().text : document.getSelection();
  244. // }
  245.  
  246. // function deltaWheel(dt) {
  247. // var tRange;
  248. // var offsetDelta = Math.floor(dt / 500);
  249. // if (textRange) {
  250. // console.log(textRange.focusOffset + offsetDelta);
  251. // tRange = document.createRange();
  252. // tRange.setStart(textRange.anchorNode, textRange.anchorOffset);
  253. // tRange.setEnd(textRange.anchorNode, textRange.focusOffset + offsetDelta);
  254. // window.getSelection().addRange(tRange);
  255. // textRange = window.getSelection();
  256. // }
  257. // }
  258.  
  259. // document.addEventListener("wheel", function (e) {
  260. // var newTime = +new Date();
  261. // e.preventDefault();
  262. // deltaWheel(lastTime - newTime);
  263. // lastTime = newTime;
  264. // });
  265.  
  266. // document.addEventListener("mouseup", getText);
  267. // }());
  268.  
  269. az.translate = function(value, leftMin, leftMax, rightMin, rightMax) {
  270. var leftSpan = leftMax - leftMin;
  271. var rightSpan = rightMax - rightMin;
  272.  
  273. var scaled = (value - leftMin) / leftSpan;
  274. return rightMin + scaled * rightSpan;
  275. };
  276.  
  277. az.constrainValue = function(value, min, max) {
  278. if (value < min) {
  279. return min;
  280. } else if (value > max) {
  281. return max;
  282. }
  283. return value;
  284. };