☰

我的鼠标手势

一个简单的鼠标手势脚本

当前为 2014-11-21 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name               My Mouse Gestures
  3. // @name:zh-CN         我的鼠标手势
  4. // @name:zh-TW         我的滑鼠手勢
  5. // @description        A simple mouse gesture script
  6. // @description:zh-CN  一个简单的鼠标手势脚本
  7. // @description:zh-TW  一個簡單的滑鼠手勢腳本
  8. // @version            0.1.2
  9. // @include            *
  10. // @run-at             document-start
  11. // @grant              GM_openInTab
  12. // @noframes
  13. // @namespace          https://greasyfork.org/users/4968
  14. // ==/UserScript==
  15.  
  16.  
  17. // --- Settings ---
  18. var SENSITIVITY = 3; // 1 ~ 5
  19. var TOLERANCE = 3; // 1 ~ 5
  20. var funcs = {
  21. 	'DR': function() {
  22. 		window.top.close();
  23. 	},
  24. 	'U': function() {
  25. 		window.scrollTo(0, 0);
  26. 	},
  27. 	'D': function() {
  28. 		window.scrollTo(0, 1073741824);
  29. 	},
  30. 	'L': function() {
  31. 		window.history.back();
  32. 	},
  33. 	'R': function() {
  34. 		window.history.forward();
  35. 	},
  36. 	'RU': function() {
  37. 		GM_openInTab('about:newtab', false);
  38. 	},
  39. 	'UD': function() {
  40. 		window.location.reload();
  41. 	}
  42. };
  43. // ----------------
  44.  
  45. var s = 1 << ((7 - SENSITIVITY) << 1);
  46. var t1 = Math.tan(0.15708 * TOLERANCE), t2 = 1 / t1;
  47.  
  48. var x, y, path;
  49. var canvas, g;
  50.  
  51. function createCanvas() {
  52. 	canvas = document.createElement('canvas');
  53. 	canvas.style.position = 'fixed';
  54. 	canvas.style.zIndex = 255;
  55. 	canvas.style.top = 0;
  56. 	canvas.style.left = 0;
  57. 	document.body.appendChild(canvas);
  58. 	canvas.width = document.body.clientWidth;
  59. 	canvas.height = document.body.clientHeight;
  60. 	g = canvas.getContext('2d');
  61. 	g.lineWidth = 3;
  62. 	g.moveTo(x, y);
  63. }
  64.  
  65. function tracer(e) {
  66. 	var cx = e.clientX,
  67. 		cy = e.clientY,
  68. 		deltaX = cx - x,
  69. 		deltaY = cy - y,
  70. 		slope = Math.abs(deltaY / deltaX),
  71. 		distance = deltaX * deltaX + deltaY * deltaY,
  72. 		direction = '';
  73. 	if (distance > s) {
  74. 		if (slope > t1) {
  75. 			if (deltaY > 0) {
  76. 				direction = 'D';
  77. 			} else {
  78. 				direction = 'U';
  79. 			}
  80. 		} else if (slope <= t2) {
  81. 			if (deltaX > 0) {
  82. 				direction = 'R';
  83. 			} else {
  84. 				direction = 'L';
  85. 			}
  86. 		}
  87. 		if (path.slice(-1) != direction) {
  88. 			path += direction;
  89. 		}
  90. 		x = cx;
  91. 		y = cy;
  92. 		g.lineTo(x, y);
  93. 		g.stroke();
  94. 	}
  95. }
  96.  
  97. window.addEventListener('mousedown', function(e) {
  98. 	if (e.which == 3) {
  99. 		x = e.clientX;
  100. 		y = e.clientY;
  101. 		path = '';
  102. 		createCanvas();
  103. 		window.addEventListener('mousemove', tracer, false);
  104. 	}
  105. }, false);
  106.  
  107. window.addEventListener('contextmenu', function(e) {
  108. 	window.removeEventListener('mousemove', tracer, false);
  109. 	if (path != '') {
  110. 		e.preventDefault();
  111. 		if (funcs.hasOwnProperty(path)) {
  112. 			funcs[path]();
  113. 		}
  114. 	}
  115. }, false);
  116.  
  117. window.addEventListener('mouseup', function(e) {
  118. 	if (e.which == 3) {
  119. 		canvas.remove();
  120. 	}
  121. }, false);