xiyangdujin
小狐狸
小狐狸
  • UID27248
  • 注册日期2008-11-30
  • 最后登录2010-04-05
  • 发帖数20
  • 经验10枚
  • 威望0点
  • 贡献值0点
  • 好评度0点
阅读:2902回复:4

请高手帮着写个脚本

楼主#
更多 发布于:2009-01-20 17:19
希望高手能帮忙把reading blinds这个脚本改造成页面的暗夜风格。

在网上看到一个Liqube Night的Stylish脚本,可以让习惯晚上浏览网页的人减轻视觉,同时也可以减少对他人的妨碍。但是还是不够完善,详细情况如下。

在Liqube Night下的暗页效果(不足之处见图片上的说明)。

用reading blinds可以实现更好的效果,但是还是有不足,具体见图片及批注。

希望高手能将reading blinds的油猴脚本进行简化,只留其黑色透明遮罩的功能。
xiyangdujin
小狐狸
小狐狸
  • UID27248
  • 注册日期2008-11-30
  • 最后登录2010-04-05
  • 发帖数20
  • 经验10枚
  • 威望0点
  • 贡献值0点
  • 好评度0点
1楼#
发布于:2009-01-20 17:19
现将reading blinds的脚本代码贴上,以供参考。

1. // ==UserScript==
   2. // @name           Reading Blinds
   3. // @namespace      http://userscripts.org/
   4. // @author         SUCCESS
   5. // @description    护眼聚焦。“盖住”网页中不必要的区域,然后打开一扇适度的“阅读之窗”。
   6. // @include        *
   7. // @version        3
   8. // ==/UserScript==
   9. var showed = false;
  10. var visible = false;
  11. var size = window.innerHeight * 0.2; // 默认阅读区高度是窗口高度的 20%
  12. var top_cover, bottom_cover;
  13. var clientY;
  14. var setShortcutKeysAction = '';
  15. var show_hide_keycode, show_hide_shift, show_hide_ctrl, show_hide_alt; // 显示/隐藏 快捷键
  16. var increase_keycode, increase_shift, increase_ctrl, increase_alt; // 扩大阅读区域 快捷键
  17. var decrease_keycode, decrease_shift, decrease_ctrl, decrease_alt; // 缩小阅读区域 快捷键
  18. var code2keyTable={'65':'A','66':'B','67':'C','68':'D','69':'E','70':'F','71':'G','72':'H','73':'I','74':'J','75':'K','76':'L','77':'M','78':'N','79':'O','80':'P','81':'Q','82':'R','83':'S','84':'T','85':'U','86':'V','87':'W','88':'X','89':'Y','90':'Z','48':'0','49':'1','50':'2','51':'3','52':'4','53':'5','54':'6','55':'7','56':'8','57':'9','96':'Numpad 0','97':'Numpad 1','98':'Numpad 2','99':'Numpad 3','100':'Numpad 4','101':'Numpad 5','102':'Numpad 6','103':'Numpad 7','104':'Numpad 8','105':'Numpad 9','106':'Numpad *','107':'Numpad +','108':'Numpad Enter','109':'Numpad -','110':'Numpad .','111':'Numpad /','112':'F1','113':'F2','114':'F3','115':'F4','116':'F5','117':'F6','118':'F7','119':'F8','120':'F9','121':'F10','122':'F11','123':'F12','8':'BackSpace','9':'Tab','12':'Clear','13':'Enter','16':'Shift','17':'Control','18':'Alt','20':'Cape Lock','27':'Esc','32':'Spacebar','33':'Page Up','34':'Page Down','35':'End','36':'Home','37':'Left Arrow','38':'Up Arrow','39':'Right Arrow','40':'Down Arrow','45':'Insert','46':'Delete','144':'Num Lock','186':';:','187':'=+','188':',<','189':'-_','190':'.>','191':'/?','192':'`~','219':'[{','220':'\|','221':']}','222':'"'};
  19. // 注册 【设置 显示/隐藏 快捷键】 菜单
  20. GM_registerMenuCommand('Reading Blinds - 设置 显示/隐藏 快捷键', function(){
  21. if(visible) hide();
  22.     setShortcutKeysAction = 'show_hide';
  23.     showShortcutKeySettings();
  24. });
  25. // 注册 【设置 扩大阅读区域 快捷键】 菜单
  26. GM_registerMenuCommand('Reading Blinds - 设置 扩大阅读区域 快捷键', function(){
  27. if(visible) hide();
  28.     setShortcutKeysAction = 'increase';
  29.     showShortcutKeySettings();
  30. });
  31. // 注册 【设置 缩小阅读区域 快捷键】 菜单
  32. GM_registerMenuCommand('Reading Blinds - 设置 缩小阅读区域 快捷键', function(){
  33. if(visible) hide();
  34.     setShortcutKeysAction = 'decrease';
  35.     showShortcutKeySettings();
  36. });
  37. // 初始化。读取各快捷键。
  38. function init(){
  39.     var keycodes, array;
  40.

  41. // 读取 显示/隐藏 快捷键
  42.     keycodes = GM_getValue('show_hide', 'alt+116');
  43.     array = keycodes.split('+');
  44.     show_hide_keycode = array[array.length - 1];
  45.     show_hide_shift = keycodes.indexOf('shift') > -1;
  46.     show_hide_ctrl = keycodes.indexOf('ctrl') > -1;
  47.     show_hide_alt = keycodes.indexOf('alt') > -1;
  48.

  49. // 读取 扩大阅读区域 快捷键
  50.     keycodes = GM_getValue('increase', '107');
  51.     array = keycodes.split('+');
  52.     increase_keycode = array[array.length - 1];
  53.     increase_shift = keycodes.indexOf('shift') > -1;
  54.     increase_ctrl = keycodes.indexOf('ctrl') > -1;
  55.     increase_alt = keycodes.indexOf('alt') > -1;
  56.

  57. // 读取 缩小阅读区域 快捷键
  58.     keycodes = GM_getValue('decrease', '109');
  59.     array = keycodes.split('+');
  60.     decrease_keycode = array[array.length - 1];
  61.     decrease_shift = keycodes.indexOf('shift') > -1;
  62.     decrease_ctrl = keycodes.indexOf('ctrl') > -1;
  63.     decrease_alt = keycodes.indexOf('alt') > -1;
  64. }
  65. // 显示设置快捷键的界面
  66. function showShortcutKeySettings(){
  67. var cover = document.getElementById('setShortcutKey');
  68. var message = document.getElementById('message');
  69. if (!cover) {
  70.   var cover = document.createElement('div');
  71.   cover.setAttribute('id', 'setShortcutKey');
  72.   cover.setAttribute('style', 'display: table; background: black; color: white; text-align: center; position: fixed; top:0; left:0; width:100%; height: 100%; opacity: .9; z-index:100;');
  73.   var message = document.createElement('div');
  74.   message.setAttribute('id', 'message');
  75.   message.setAttribute('style', 'font-size: 200%; line-height: 1.5em; text-align: center; display: table-cell; vertical-align: middle; padding: 1em;');
  76. }
  77. switch (setShortcutKeysAction) {
  78.   case 'show_hide':
  79.    message.innerHTML = '功能:显示/隐藏<br />当前快捷键:<font color="red">' + parse2keys(GM_getValue('show_hide','alt+116')) + '</font><br />按 ESC 键保存当前设置并退出';
  80.    break;
  81.   case 'increase':
  82.    message.innerHTML = '功能:扩大阅读区域<br />当前快捷键:<font color="red">' + parse2keys(GM_getValue('increase','107')) + '</font><br />按 ESC 键保存当前设置并退出';
  83.    break;
  84.   case 'decrease':
  85.    message.innerHTML = '功能:缩小阅读区域<br />当前快捷键:<font color="red">' + parse2keys(GM_getValue('decrease','109')) + '</font><br />按 ESC 键保存当前设置并退出';
  86.    break;
  87. }
  88.     cover.appendChild(message);
  89.     document.body.appendChild(cover);
  90. }
  91. // 关闭设置快捷键的界面
  92. function hideShortcutKeySettings(){
  93.     var cover = document.getElementById('setShortcutKey');
  94.     cover.parentNode.removeChild(cover);
  95.     setShortcutKeysAction = '';
  96. }
  97. // 将 keycode 转换成按键名称
  98. function parse2keys(keycodes){
  99. var array = keycodes.split('+');
 100. array[array.length-1]=code2keyTable[array[array.length-1]] || '';
 101. return array.join('+');
 102. }
 103. // 打开 护眼聚焦
 104. function show(){
 105.     if (!showed) {
 106.         top_cover = document.createElement('div');
 107.         top_cover.setAttribute('style', 'background: black; width: 100%; position: fixed; left: 0; top: 0; opacity: .85; overflow: hidden; z-index: 100;');
 108.         bottom_cover = document.createElement('div');
 109.         bottom_cover.setAttribute('style', 'background: black; width: 100%; position: fixed; left: 0; bottom: 0; opacity: .85; overflow: hidden; z-index: 100;');
 110.         var message = document.createElement('div');
 111.         message.setAttribute('id', 'msgtip');
 112.         message.setAttribute('style', 'text-align: right; padding: 1em; color: white;');
 113.         message.innerHTML = '移动鼠标选择阅读区域。 “' + parse2keys(GM_getValue('increase', '107')) + '/' + parse2keys(GM_getValue('decrease', '109')) + '” 扩大/缩小阅读区域。 “' + parse2keys(GM_getValue('show_hide', 'alt+116')) + '” 显示/隐藏。';
 114.         top_cover.appendChild(message);
 115.         document.body.appendChild(top_cover);
 116.         document.body.appendChild(bottom_cover);
 117.         
 118.         // 将阅读区移动到当前鼠标位置
 119.         render(clientY);
 120.         
 121.         showed = true;
 122.     }
 123.     else {
 124.         var message = document.getElementById('msgtip');
 125.         message.innerHTML = '移动鼠标选择阅读区域。 “' + parse2keys(GM_getValue('increase', '107')) + '/' + parse2keys(GM_getValue('decrease', '109')) + '” 扩大/缩小阅读区域。 “' + parse2keys(GM_getValue('show_hide', 'alt+116')) + '” 显示/隐藏。';
 126.         top_cover.style.display = '';
 127.         bottom_cover.style.display = '';
 128.         
 129.         // 将阅读区移动到当前鼠标位置
 130.         render(clientY);
 131.     }
 132.

 133.     // 移动鼠标选择阅读区域
 134.     document.body.addEventListener('mousemove', function(event){
 135.         clientY = event.clientY;
 136.         if (visible)
 137.             render(clientY);
 138.     }, false);
 139.    
 140.     visible = true;
 141. }
 142. // 关闭 护眼聚焦
 143. function hide(){
 144.     top_cover.style.display = 'none';
 145.     bottom_cover.style.display = 'none';
 146.     visible = false;
 147. }
 148. // 绘制阅读区域
 149. function render(clientY){
 150.     top_cover.style.height = clientY - size / 2 + 'px';
 151.     bottom_cover.style.height = window.innerHeight - clientY - size / 2 + 'px';
 152. }
 153. // 设置快捷键
 154. window.addEventListener('keydown', function(event){
 155.     switch (setShortcutKeysAction) {
 156.   // 显示/隐藏
 157.         case 'show_hide':
 158.             // ESC 退出
 159.             if (event.keyCode == 27) {
 160.     hideShortcutKeySettings();
 161.                 break;
 162.             }
 163.             show_hide_keycode = event.keyCode;
 164.    show_hide_shift = event.shiftKey;
 165.    show_hide_ctrl = event.ctrlKey;
 166.    show_hide_alt = event.altKey;
 167.    
 168.             var Keys = '';
 169.             if (show_hide_shift) {
 170.                 Keys += 'shift+';
 171.             }
 172.             if (show_hide_ctrl) {
 173.                 Keys += 'ctrl+';
 174.             }
 175.             if (show_hide_alt) {
 176.                 Keys += 'alt+';
 177.             }
 178.             
 179.    var message = document.getElementById('message');
 180.    message.innerHTML = '功能:显示/隐藏<br />当前快捷键:<font color="red">' + Keys + (code2keyTable[show_hide_keycode] || '') + '</font><br />按 ESC 键保存当前设置并退出';
 181.    Keys += String(event.keyCode);
 182.             GM_setValue('show_hide', Keys);
 183.             break;
 184.   // 扩大阅读区域
 185.         case 'increase':
 186.             // ESC 退出
 187.             if (event.keyCode == 27) {
 188.     hideShortcutKeySettings();
 189.                 break;
 190.             }
 191.             increase_keycode = event.keyCode;
 192.    increase_shift = event.shiftKey;
 193.    increase_ctrl = event.ctrlKey;
 194.    increase_alt = event.altKey;
 195.    
 196.             var Keys = '';
 197.             if (increase_shift) {
 198.                 Keys += 'shift+';
 199.             }
 200.             if (increase_ctrl) {
 201.                 Keys += 'ctrl+';
 202.             }
 203.             if (increase_alt) {
 204.                 Keys += 'alt+';
 205.             }
 206.             
 207.    var message = document.getElementById('message');
 208.    message.innerHTML = '功能:扩大阅读区域<br />当前快捷键:<font color="red">' + Keys + (code2keyTable[increase_keycode] || '') + '</font><br />按 ESC 键保存当前设置并退出';
 209.    Keys += String(event.keyCode);
 210.             GM_setValue('increase', Keys);
 211.             break;
 212.   // 缩小阅读区域
 213.         case 'decrease':
 214.             // ESC 退出
 215.             if (event.keyCode == 27) {
 216.     hideShortcutKeySettings();
 217.                 break;
 218.             }
 219.             decrease_keycode = event.keyCode;
 220.    decrease_shift = event.shiftKey;
 221.    decrease_ctrl = event.ctrlKey;
 222.    decrease_alt = event.altKey;
 223.    
 224.             var Keys = '';
 225.             if (decrease_shift) {
 226.                 Keys += 'shift+';
 227.             }
 228.             if (decrease_ctrl) {
 229.                 Keys += 'ctrl+';
 230.             }
 231.             if (decrease_alt) {
 232.                 Keys += 'alt+';
 233.             }
 234.             
 235.    var message = document.getElementById('message');
 236.    message.innerHTML = '功能:缩小阅读区域<br />当前快捷键:<font color="red">' + Keys + (code2keyTable[decrease_keycode] || '') + '</font><br />按 ESC 键保存当前设置并退出';
 237.    Keys += String(event.keyCode);
 238.             GM_setValue('decrease', Keys);
 239.             break;
 240.     }
 241. }, true);
 242. window.addEventListener('keyup', function(event){
 243.     if (setShortcutKeysAction != '') return;
 244.     // 显示/隐藏
 245.     if ((event.altKey == show_hide_alt) && (event.ctrlKey == show_hide_ctrl) && (event.shiftKey == show_hide_shift) && (event.keyCode == show_hide_keycode)){
 246.         if (!visible) {
 247.             show();
 248.         }
 249.         else {
 250.             hide();
 251.         }
 252. }
 253.    
 254.     // 调整阅读区域大小
 255.     // 放大阅读区域
 256.     else
 257.         if (visible && (event.altKey == increase_alt) && (event.ctrlKey == increase_ctrl) && (event.shiftKey == increase_shift) && (event.keyCode == increase_keycode)) {
 258.             if (size < window.innerHeight / 2) {
 259.                 size += 5;
 260.     render(clientY);
 261.             }
 262.         }
 263.         // 缩小阅读区域
 264.         else
 265.             if (visible && (event.altKey == decrease_alt) && (event.ctrlKey == decrease_ctrl) && (event.shiftKey == decrease_shift) && (event.keyCode == decrease_keycode)) {
 266.                 if (size > 10) {
 267.                     size -= 5;
 268.     render(clientY);
 269.                 }
 270.             }
 271. }, true);
 272. init();
ferret
千年狐狸
千年狐狸
  • UID21816
  • 注册日期2007-11-11
  • 最后登录2013-03-22
  • 发帖数1114
  • 经验10枚
  • 威望0点
  • 贡献值0点
  • 好评度0点
2楼#
发布于:2009-01-20 17:19
reading blinds这种对比度极低的效果好? 你试试看半小时会不会眼睛疼呢。不疼我只能说你是神仙了。。。
xiyangdujin
小狐狸
小狐狸
  • UID27248
  • 注册日期2008-11-30
  • 最后登录2010-04-05
  • 发帖数20
  • 经验10枚
  • 威望0点
  • 贡献值0点
  • 好评度0点
3楼#
发布于:2009-01-20 17:19
在晚上看来reading blinds是很好的,可以适当地把它的透明度再调高些
ferret
千年狐狸
千年狐狸
  • UID21816
  • 注册日期2007-11-11
  • 最后登录2013-03-22
  • 发帖数1114
  • 经验10枚
  • 威望0点
  • 贡献值0点
  • 好评度0点
4楼#
发布于:2009-01-20 17:19
我不太会写脚本,不过看上去把开头那句var size = window.innerHeight * 0.2的0.2改成0应该就可以了。。。
LN那个css也有解决方法,加一句img{opacity:.85}
游客

返回顶部