From f258ebb058fbe444211486c5aecf5eeef516ad15 Mon Sep 17 00:00:00 2001 From: xmcp Date: Sun, 26 Aug 2018 11:25:27 +0800 Subject: [PATCH] refactor api --- src/Common.js | 2 +- src/Flows.css | 2 +- src/Flows.js | 72 ++++----------------------------- src/Sidebar.css | 4 +- src/flows_api.js | 102 +++++++++++++++++++++++++++++++++++++++++++++++ 5 files changed, 114 insertions(+), 68 deletions(-) create mode 100644 src/flows_api.js diff --git a/src/Common.js b/src/Common.js index a282400..a824e61 100644 --- a/src/Common.js +++ b/src/Common.js @@ -46,7 +46,7 @@ export class HighlightedText extends PureComponent { 
                     {parts.map((p,idx)=>(
                         {
-                            PID_RE.test(p) ? {p} :
+                            PID_RE.test(p) ? {this.props.show_pid(p)}}>{p} :
                             NICKNAME_RE.test(p) ? {p} :
                             p
                         }
diff --git a/src/Flows.css b/src/Flows.css
index 11f32fa..09759fd 100644
--- a/src/Flows.css
+++ b/src/Flows.css
@@ -93,7 +93,7 @@
     cursor: default;
 }
 
-.flow-item-row:hover::before {
+.left-container .flow-item-row:hover::before {
     content: '>>';
     position: absolute;
     left: 10px;
diff --git a/src/Flows.js b/src/Flows.js
index d912532..cc12bef 100644
--- a/src/Flows.js
+++ b/src/Flows.js
@@ -6,7 +6,8 @@ import LazyLoad from 'react-lazyload';
 import {AudioWidget} from './AudioWidget';
 import {TokenCtx, ReplyForm} from './UserAction';
 
-import {API_BASE} from './Common';
+import {API} from './flows_api';
+
 const IMAGE_BASE='http://www.pkuhelper.com/services/pkuhole/images/';
 const AUDIO_BASE='/audio_proxy/';
 
@@ -80,16 +81,8 @@ class FlowItemRow extends PureComponent {
         this.setState({
             reply_status: 'loading',
         });
-        const token_param=this.props.token ? '&token='+this.props.token : '';
-        fetch(
-            API_BASE+'/api.php?action=getcomment'+
-            '&pid='+this.state.info.pid+
-            token_param
-        )
-            .then((res)=>res.json())
+        API.load_replies(this.state.info.pid,this.props.token)
             .then((json)=>{
-                if(json.code!==0)
-                    throw new Error(json);
                 const replies=json.data
                     .sort((a,b)=>{
                         return parseInt(a.timestamp,10)-parseInt(b.timestamp,10);
@@ -117,28 +110,9 @@ class FlowItemRow extends PureComponent {
     }
 
     toggle_attention(callback) {
-        let data=new URLSearchParams();
         const next_attention=!this.state.attention;
-        data.append('token', this.props.token);
-        data.append('pid', this.state.info.pid);
-        data.append('switch', next_attention ? '1' : '0');
-        fetch(API_BASE+'/api.php?action=attention', {
-            method: 'POST',
-            headers: {
-                'Content-Type': 'application/x-www-form-urlencoded',
-            },
-            body: data,
-        })
-            .then((res)=>res.json())
+        API.set_attention(this.state.info.pid,next_attention,this.props.token)
             .then((json)=>{
-                if(json.code!==0) {
-                    if(json.msg && json.msg==='已经关注过辣') {}
-                    else {
-                        if(json.msg) alert(json.msg);
-                        throw new Error(json);
-                    }
-                }
-
                 this.setState({
                     attention: next_attention,
                 }, callback);
@@ -252,22 +226,13 @@ export class Flow extends PureComponent {
             }));
         };
 
-        const token_param=this.props.token ? '&token='+this.props.token : '';
-
         if(page>this.state.loaded_pages+1)
             throw new Error('bad page');
         if(page===this.state.loaded_pages+1) {
             console.log('fetching page',page);
             if(this.state.mode==='list') {
-                fetch(
-                    API_BASE+'/api.php?action=getlist'+
-                    '&p='+page+
-                    token_param
-                )
-                    .then((res)=>res.json())
+                API.get_list(page,this.props.token)
                     .then((json)=>{
-                        if(json.code!==0)
-                            throw new Error(json);
                         json.data.forEach((x)=>{
                             if(parseInt(x.pid,10)>(parseInt(localStorage['_LATEST_POST_ID'],10)||0))
                                 localStorage['_LATEST_POST_ID']=x.pid;
@@ -285,16 +250,8 @@ export class Flow extends PureComponent {
                     })
                     .catch(failed);
             } else if(this.state.mode==='search') {
-                fetch(
-                    API_BASE+'/api.php?action=search'+
-                    '&pagesize='+SEARCH_PAGESIZE*page+
-                    '&keywords='+encodeURIComponent(this.state.search_param)+
-                    token_param
-                )
-                    .then((res)=>res.json())
+                API.get_search(SEARCH_PAGESIZE*page,this.state.search_param,this.props.token)
                     .then((json)=>{
-                        if(json.code!==0)
-                            throw new Error(json);
                         const finished=json.data.lengthres.json())
+                API.get_attention(this.props.token)
                     .then((json)=>{
-                        if(json.code!==0)
-                            throw new Error(json);
                         this.setState({
                             chunks: [{
                                 title: 'Attention List',
diff --git a/src/Sidebar.css b/src/Sidebar.css
index d7e0397..68cb33b 100644
--- a/src/Sidebar.css
+++ b/src/Sidebar.css
@@ -2,7 +2,7 @@
     opacity: 0;
     background-color: black;
     pointer-events: none;
-    transition: opacity 200ms ease-out;
+    transition: opacity 150ms ease-out;
     position: fixed;
     left: 0;
     top: 0;
@@ -16,7 +16,7 @@
 }
 
 .sidebar {
-    transition: left 200ms ease-out;
+    transition: left 150ms ease-out;
     position: fixed;
     left: 100%;
     top: 0;
diff --git a/src/flows_api.js b/src/flows_api.js
new file mode 100644
index 0000000..25e772c
--- /dev/null
+++ b/src/flows_api.js
@@ -0,0 +1,102 @@
+import {API_BASE} from './Common';
+
+function token_param(token) {
+    return token ? ('&token='+token) : '';
+}
+
+export const API={
+    load_replies: (pid,token)=>{
+        return fetch(
+            API_BASE+'/api.php?action=getcomment'+
+            '&pid='+pid+
+            token_param(token)
+        )
+            .then((res)=>res.json())
+            .then((json)=>{
+                if(json.code!==0)
+                    throw new Error(json);
+                return json;
+            });
+    },
+
+    set_attention: (pid,attention,token)=>{
+        let data=new URLSearchParams();
+        data.append('token',token);
+        data.append('pid',pid);
+        data.append('switch',attention ? '1' : '0');
+        return fetch(API_BASE+'/api.php?action=attention', {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/x-www-form-urlencoded',
+            },
+            body: data,
+        })
+            .then((res)=>res.json())
+            .then((json)=>{
+                if(json.code!==0) {
+                    if(json.msg && json.msg==='已经关注过辣') {}
+                    else {
+                        if(json.msg) alert(json.msg);
+                        throw new Error(json);
+                    }
+                }
+                return json;
+            });
+    },
+
+    get_list: (page,token)=>{
+        return fetch(
+            API_BASE+'/api.php?action=getlist'+
+            '&p='+page+
+            token_param(token)
+        )
+            .then((res)=>res.json())
+            .then((json)=>{
+                if(json.code!==0)
+                    throw new Error(json);
+                return json;
+            });
+    },
+
+    get_search: (pagesize,keyword,token)=>{
+        return fetch(
+            API_BASE+'/api.php?action=search'+
+            '&pagesize='+pagesize+
+            '&keywords='+encodeURIComponent(keyword)+
+            token_param(token)
+        )
+            .then((res)=>res.json())
+            .then((json)=>{
+                if(json.code!==0)
+                    throw new Error(json);
+                return json;
+            });
+    },
+
+    get_single: (pid,token)=>{
+        return fetch(
+            API_BASE+'/api.php?action=getone'+
+            '&pid='+pid+
+            token_param(token)
+        )
+            .then((res)=>res.json())
+            .then((json)=>{
+                if(json.code!==0)
+                    throw new Error(json);
+                return json;
+            });
+    },
+
+    get_attention: (token)=>{
+        return fetch(
+            API_BASE+'/api.php?action=getattention'+
+            token_param(token)
+        )
+            .then((res)=>res.json())
+            .then((json)=>{
+                if(json.code!==0)
+                    throw new Error(json);
+                return json;
+            });
+    }
+};
\ No newline at end of file