add esc alternative for pressure

README.md

@@ -27,7 +27,7 @@ React 版 P大树洞，[pkuhelper.pku.edu.cn/hole](http://pkuhelper.pku.edu.cn/h
 - 突出显示未读树洞
 - 精确显示发帖时间
 - 复制树洞链接和全文
-- 3D Touch 支持
+- 快捷键和 3D Touch 支持
 - 自定义背景图片
 - 检测树洞和回复被删除（默认不开启）
 - 用 Token 登录
@@ -46,5 +46,5 @@ React 版 P大树洞，[pkuhelper.pku.edu.cn/hole](http://pkuhelper.pku.edu.cn/h
 
 - 检测瀑布流中被删除的树洞和树洞被删除的评论（`//setflag DELETION_DETECT=on`）
 - 自定义背景图片（`//setflag REPLACE_ERIRI_WITH_URL=http://...`）
-- 禁用 3D Touch 功能（`//setflag DISABLE_PRESSURE=on`）
+- 禁用重压屏幕（3D Touch）或按住 Esc 键返回（`//setflag DISABLE_PRESSURE=on`）
 - 禁用自动显示引用树洞功能（`//setflag DISABLE_QUOTE=on`）

src/PressureHelper.js

@@ -15,9 +15,14 @@ export class PressureHelper extends  Component {
             fired: false,
         };
         this.callback=props.callback;
+        this.esc_interval=null;
     }
 
     do_fire() {
+        if(this.esc_interval) {
+            clearInterval(this.esc_interval);
+            this.esc_interval=null;
+        }
         this.setState({
             level: 1,
             fired: true,
@@ -36,11 +41,12 @@ export class PressureHelper extends  Component {
             Pressure.set(document.body, {
                 change: (force)=>{
                     if(!this.state.fired) {
+                        if(force>=.999)
+                            this.do_fire();
+                        else
                             this.setState({
                                 level: force,
                             });
-                        if(force===1)
-                            this.do_fire();
                     }
                 },
                 end: ()=>{
@@ -58,11 +64,42 @@ export class PressureHelper extends  Component {
                 if(this.state.level>THRESHOLD)
                     event.preventDefault();
             });
+
+            document.addEventListener('keydown',(e)=>{
+                if(!e.repeat && e.key==='Escape') {
+                    if(this.esc_interval)
+                        clearInterval(this.esc_interval);
+                    this.setState({
+                        level: THRESHOLD,
+                    },()=>{
+                        this.esc_interval=setInterval(()=>{
+                            let new_level=this.state.level+.1;
+                            if(new_level>=.999)
+                                this.do_fire();
+                            else
+                                this.setState({
+                                    level: new_level,
+                                });
+                        },50);
+                    });
+                }
+            });
+            document.addEventListener('keyup',(e)=>{
+                if(e.key==='Escape') {
+                    if(this.esc_interval) {
+                        clearInterval(this.esc_interval);
+                        this.esc_interval=null;
+                    }
+                    this.setState({
+                        level: 0,
+                    });
+                }
+            });
         }
     }
 
     render() {
-        const pad=MULTIPLIER*(this.state.level-THRESHOLD)-BORDER_WIDTH;
+        const pad=this.state.level===0 ? -BORDER_WIDTH-500 : MULTIPLIER*(this.state.level-THRESHOLD)-BORDER_WIDTH;
         return (
             <div className={'pressure-box '+(this.state.fired ? 'pressure-box-fired' : '')} style={{
                 left: pad,

src/Title.js

@@ -14,8 +14,7 @@ const HELP_TEXT=(
             <li>为保证使用体验，请使用 Chrome 或 Mobile Safari 浏览器最新版</li>
             <li>在列表中左右滑动可以预览回复，点击展开侧边栏进行操作</li>
             <li>新出现的帖子会在左上角显示一个圆点</li>
-            <li>点击树洞编号可以复制分享链接和树洞全文（包括回复）</li>
-            <li>本网站支持 3D Touch，重压屏幕可以快速返回 / 刷新树洞</li>
+            <li>本网站支持 3D Touch，重压屏幕或者短暂按住 Esc 键可以快速返回 / 刷新树洞</li>
         </ul>
         <p>
             在&nbsp;