From 7032404a798ed87a3b41d1b28854856ae31906a3 Mon Sep 17 00:00:00 2001
From: Dreamacro <305009791@qq.com>
Date: Sun, 3 Mar 2019 19:19:29 +0800
Subject: [PATCH] Feat: manual speed test

---
 .travis.yml                                   |  1 -
 src/components/Header/style.scss              |  5 ++++
 .../Proxies/components/Proxy/index.tsx        | 12 ++++++++--
 src/containers/Proxies/index.tsx              | 12 ++++++++--
 src/containers/Proxies/style.scss             | 11 ++++++++-
 src/lib/event.ts                              | 23 +++++++++++++++++++
 src/styles/iconfont.scss                      |  4 +++-
 7 files changed, 61 insertions(+), 7 deletions(-)
 create mode 100644 src/lib/event.ts

diff --git a/.travis.yml b/.travis.yml
index 93ac321..069b5ca 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -20,4 +20,3 @@ deploy:
     on:
         repo: Dreamacro/clash-dashboard
         branch: master
-        tags: true
diff --git a/src/components/Header/style.scss b/src/components/Header/style.scss
index 4ff9b79..64b502f 100644
--- a/src/components/Header/style.scss
+++ b/src/components/Header/style.scss
@@ -18,3 +18,8 @@
         line-height: 32px;
     }
 }
+
+.operations {
+    display: flex;
+    align-items: center;
+}
diff --git a/src/containers/Proxies/components/Proxy/index.tsx b/src/containers/Proxies/components/Proxy/index.tsx
index 6eaf6ee..3ac1ddb 100644
--- a/src/containers/Proxies/components/Proxy/index.tsx
+++ b/src/containers/Proxies/components/Proxy/index.tsx
@@ -1,8 +1,8 @@
 import * as React from 'react'
 import classnames from 'classnames'
-// import { Icon } from '@components'
 import { BaseComponentProps, TagColors } from '@models'
 import { getProxyDelay, Proxy as IProxy } from '@lib/request'
+import EE, { Action } from '@lib/event'
 import { isClashX, jsBridge } from '@lib/jsBridge'
 import { to, getLocalStorageItem, setLocalStorageItem, sample } from '@lib/helper'
 import './style.scss'
@@ -48,7 +48,15 @@ export class Proxy extends React.Component<ProxyProps , ProxyState> {
         }
     }
 
-    async componentDidMount () {
+    componentDidMount () {
+        EE.subscribe(Action.SPEED_NOTIFY, this.speedTest)
+    }
+
+    componentWillUnmount () {
+        EE.unsubscribe(Action.SPEED_NOTIFY, this.speedTest)
+    }
+
+    speedTest = async () => {
         const { config } = this.props
         if (isClashX()) {
             const delay = await jsBridge.getProxyDelay(config.name)
diff --git a/src/containers/Proxies/index.tsx b/src/containers/Proxies/index.tsx
index d566313..5287760 100644
--- a/src/containers/Proxies/index.tsx
+++ b/src/containers/Proxies/index.tsx
@@ -2,7 +2,8 @@ import * as React from 'react'
 import { translate } from 'react-i18next'
 import { inject, observer } from 'mobx-react'
 import { storeKeys } from '@lib/createStore'
-import { Card, Header } from '@components'
+import EE from '@lib/event'
+import { Card, Header, Icon } from '@components'
 import { I18nProps, BaseRouterProps } from '@models'
 
 import { Proxy, Group } from './components'
@@ -20,6 +21,10 @@ class Proxies extends React.Component<ProxiesProps, ProxiesState> {
         this.props.store.fetchData()
     }
 
+    handleNotitySpeedTest = () => {
+        EE.notifySpeedTest()
+    }
+
     render () {
         const { t, store } = this.props
 
@@ -40,7 +45,10 @@ class Proxies extends React.Component<ProxiesProps, ProxiesState> {
                     </Card>
                 </div>
                 <div className="proxies-container">
-                    <Header title={t('title')} />
+                    <Header title={t('title')}>
+                        <Icon type="speed" size={20} />
+                        <span className="proxies-speed-test" onClick={this.handleNotitySpeedTest}>测速</span>
+                    </Header>
                     <ul className="proxies-list">
                         {
                             store.data.proxy.map(p => (
diff --git a/src/containers/Proxies/style.scss b/src/containers/Proxies/style.scss
index a3b8ac2..0a6361e 100644
--- a/src/containers/Proxies/style.scss
+++ b/src/containers/Proxies/style.scss
@@ -6,6 +6,7 @@
 
     display: flex;
     margin-right: calc(-1 * var(--gap));
+    margin-top: 20px;
     padding-bottom: 100px;
     flex-wrap: wrap;
     align-content: flex-start;
@@ -57,5 +58,13 @@
 }
 
 .proxies-group-card {
-    margin: 15px 0 20px;
+    margin: 20px 0;
+}
+
+.proxies-speed-test {
+    line-height: 32px;
+    margin: 0 2px 0 6px;
+    color: $color-primary-dark;
+    text-shadow: 0 2px 6px rgba($color: $color-primary-dark, $alpha: 0.4);
+    cursor: pointer;
 }
diff --git a/src/lib/event.ts b/src/lib/event.ts
new file mode 100644
index 0000000..421a3e2
--- /dev/null
+++ b/src/lib/event.ts
@@ -0,0 +1,23 @@
+import * as EventEmitter from 'eventemitter3'
+
+export enum Action {
+    SPEED_NOTIFY = 'speed-notify'
+}
+
+class Event {
+    protected EE = new EventEmitter()
+
+    notifySpeedTest () {
+        this.EE.emit(Action.SPEED_NOTIFY)
+    }
+
+    subscribe<T> (event: Action, callback: (data?: T) => void) {
+        this.EE.addListener(event, callback)
+    }
+
+    unsubscribe<T> (event: Action, callback: (data?: T) => void) {
+        this.EE.removeListener(event, callback)
+    }
+}
+
+export default new Event()
diff --git a/src/styles/iconfont.scss b/src/styles/iconfont.scss
index 7f0fee4..9343b3c 100644
--- a/src/styles/iconfont.scss
+++ b/src/styles/iconfont.scss
@@ -6,7 +6,7 @@
 
 @font-face {
     font-family: "clash-iconfont";
-    src: url('//at.alicdn.com/t/font_841708_e9dax11p22i.ttf') format('truetype');
+    src: url('//at.alicdn.com/t/font_841708_6gtmjlak9k2.ttf?t=1551607902712') format('truetype');
 }
 
 .clash-iconfont {
@@ -18,6 +18,8 @@
     color: $color-primary-dark;
 }
 
+.icon-speed::before { content: "\e61b"; }
+
 .icon-close::before { content: "\e602"; }
 
 .icon-drag::before { content: "\e604"; }