整理代码

.eslintrc

@@ -1,3 +1,3 @@
 {
-  "extends": "umi"
+  "extends": "eslint-config-umi"
 }

.gitignore

@@ -1,16 +1,16 @@
 logs/
 dist/
+web_dist/
 npm-debug.log
 yarn-error.log
 node_modules/
 package-lock.json
-yarn.lock
 coverage/
 .idea/
 run/
 .DS_Store
 *.sw*
 *.un~
 cache
-pages/.umi
-src/dist
+.umi
+.umi-production

web/.umirc.js → .umirc.js

@@ -2,20 +2,28 @@
  * @Author: RojerChen
  * @Date: 2020-09-10 12:30:28
  * @LastEditors: RojerChen
- * @LastEditTime: 2020-09-10 13:57:56
- * @FilePath: /fa-forever/web/.umirc.js
+ * @LastEditTime: 2020-09-11 09:56:06
+ * @FilePath: /fa-forever/.umirc.js
  * @Company: freesailing.cn
  */
 // ref: https://umijs.org/config/
 export default {
+  define: {
+    'process.env.VERSION': 'V1.3.0',
+    'process.env.APPNAME': 'FA FOREVER',
+  },
   treeShaking: true,
+  outputPath: './web_dist',
   routes: [
     {
       path: '/',
       component: '../layouts/index',
       routes: [{ path: '/', component: '../pages/index' }],
     },
   ],
+  alias: {
+    '@': require('path').resolve(__dirname, 'src'),
+  },
   hash: true,
   history: 'hash',
   publicPath: 'http://cdn.eqistu.cn/faforever13/',

package.json

@@ -3,22 +3,42 @@
   "description": "chenyifaer",
   "version": "1.3.0",
   "scripts": {
-    "dev": "cross-env FA_NODE_ENV=dev electron .",
-    "preview": "cross-env FA_NODE_ENV=prd electron ."
+    "dev": "concurrently -n=umi,electron -c=blue,green -p=[{name}]  \"umi dev\" \"wait-on http://localhost:8000 && cross-env FA_NODE_ENV=dev electron .\"",
+    "package:win": "electron-builder --win --ia32 --x64",
+    "package:mac": "electron-builder --mac",
+    "package:linux": "electron-builder --linux"
   },
   "main": "./src/main.js",
+  "dependencies": {
+    "antd": "^3.19.5",
+    "axios": "^0.19.1",
+    "mobx": "^5.15.2",
+    "mobx-react": "^6.1.5",
+    "react": "^16.8.6",
+    "react-contexify": "^4.1.1",
+    "react-dom": "^16.8.6"
+  },
   "devDependencies": {
+    "babel-eslint": "^9.0.0",
+    "concurrently": "^5.3.0",
     "electron": "^2.0.6",
     "electron-builder": "^20.27.1",
-    "eslint": "^5.3.0",
-    "jest": "^23.4.2"
+    "eslint": "^5.4.0",
+    "eslint-config-umi": "^1.4.0",
+    "eslint-plugin-flowtype": "^2.50.0",
+    "eslint-plugin-import": "^2.14.0",
+    "eslint-plugin-jsx-a11y": "^5.1.1",
+    "eslint-plugin-react": "^7.11.1",
+    "husky": "^0.14.3",
+    "jest": "^23.4.2",
+    "lint-staged": "^7.2.2",
+    "react-test-renderer": "^16.7.0",
+    "umi": "^2.7.7",
+    "umi-plugin-react": "^1.8.4",
+    "wait-on": "^5.2.0"
   },
   "author": "rojer",
   "license": "MIT",
-  "dependencies": {
-    "electron-store": "^2.0.0",
-    "flyio": "^0.6.0"
-  },
   "build": {
     "nsis": {
       "oneClick": false,

web/src/components/chat.js → src/components/chat.js

@@ -6,8 +6,7 @@ import Name from './name';
 import './chat.less';
 import { Button } from 'antd-mobile';
 
-const host = '148.70.4.54:37373';
-// const host = "127.0.0.1:7001";
+const host = '127.0.0.1:7001';
 
 class Chat extends React.Component {
   socket = null;

web/src/layouts/index.js → src/layouts/index.js

@@ -74,13 +74,13 @@ class Index extends React.Component {
           <div className={sty.container}>
             <div className="header">
               <div className="logo">
-                FA FOREVER <span className="version">V1.3.0</span>
+                {process.env.APPNAME} <span className="version">{process.env.VERSION}</span>
               </div>
               <SearchBar placeholder="搜索歌曲" onSubmit={stores.music.search} />
               <div className="action">
                 <Tooltip
                   placement="topLeft"
-                  title="指定缓存目录，此功能不支持在线升级，需要下载最新客户端"
+                  title="指定缓存目录，此功能不支持在线升级，需要下载最新客户端，点击歌曲列表的“小云标志”可以一键打开文件夹"
                 >
                   <i className="fa-icon" onClick={this.setCachePath}>
                     &#xe643;

src/main.js

@@ -1,6 +1,6 @@
 // Modules to control application life and create native browser window
-const { app, BrowserWindow, Menu, ipcMain, Tray } = require("electron");
-const path = require("path");
+const { app, BrowserWindow, Menu, ipcMain, Tray } = require('electron');
+const path = require('path');
 
 // Keep a global reference of the window object, if you don't, the window will
 // be closed automatically when the JavaScript object is garbage collected.
@@ -11,13 +11,13 @@ let cachePath;
 
 function createWindow() {
   //系统托盘图标目录
-  const trayIcon = path.join(__dirname, "yjtp16.png");
+  const trayIcon = path.join(__dirname, 'yjtp16.png');
   appTray = new Tray(trayIcon);
 
   //设置此托盘图标的悬停提示内容
-  appTray.setToolTip("FA FOREVER");
+  appTray.setToolTip('FA FOREVER');
 
-  appTray.on("click", () => {
+  appTray.on('click', () => {
     //我们这里模拟桌面程序点击通知区图标实现打开关闭应用的功能
     mainWindow.isVisible() ? mainWindow.hide() : mainWindow.show();
   });
@@ -28,63 +28,57 @@ function createWindow() {
     width: 1000,
     height: 900,
     frame: false,
-    titleBarStyle: "customButtonsOnHover",
+    titleBarStyle: 'customButtonsOnHover',
     webPreferences: {
       webSecurity: false,
       allowDisplayingInsecureContent: true,
       allowRunningInsecureContent: true,
     },
   });
 
-  if (process.env.FA_NODE_ENV === "dev") {
+  if (process.env.FA_NODE_ENV === 'dev') {
     mainWindow.loadURL(`http://localhost:8000/`);
     // Open the DevTools.
     mainWindow.webContents.openDevTools();
   } else {
-    mainWindow.loadURL(
-      `http://cdn.eqistu.cn/faforever13/index.html?t=${new Date().valueOf()}`
-    );
-    // mainWindow.webContents.openDevTools()
+    mainWindow.loadURL(`http://cdn.eqistu.cn/faforever13/index.html?t=${new Date().valueOf()}`);
   }
   // and load the index.html of the app.
 
   // Emitted when the window is closed.
-  mainWindow.on("closed", function () {
+  mainWindow.on('closed', function () {
     // Dereference the window object, usually you would store windows
     // in an array if your app supports multi windows, this is the time
     // when you should delete the corresponding element.
     mainWindow = null;
     appTray = null;
   });
 
-  mainWindow.webContents.session.on(
-    "will-download",
-    (event, item, webContents) => {
-      //设置文件存放位置
-      let savepath = path.join(app.getAppPath(), `../cache/${downloadId}.mp3`);
-      if (cachePath) {
-        savepath = path.join(cachePath, `${downloadId}.mp3`);
-      }
-      item.setSavePath(savepath);
+  mainWindow.webContents.session.on('will-download', (event, item, webContents) => {
+    //设置文件存放位置
+    let savepath = path.join(app.getAppPath(), `../cache/${downloadId}.mp3`);
+    if (cachePath) {
+      savepath = path.join(cachePath, `${downloadId}.mp3`);
     }
-  );
+    item.setSavePath(savepath);
+  });
 }
 
 // This method will be called when Electron has finished
 // initialization and is ready to create browser windows.
 // Some APIs can only be used after this event occurs.
-app.on("ready", createWindow);
+app.on('ready', createWindow);
 
 // Quit when all windows are closed.
-app.on("window-all-closed", function () {
+app.on('window-all-closed', function () {
   // On OS X it is common for applications and their menu bar
   // to stay active until the user quits explicitly with Cmd + Q
-  if (process.platform !== "darwin") {
+  if (process.platform !== 'darwin') {
     app.quit();
   }
 });
 
-app.on("activate", function () {
+app.on('activate', function () {
   // On OS X it's common to re-create a window in the app when the
   // dock icon is clicked and there are no other windows open.
   if (mainWindow === null) {
@@ -96,19 +90,19 @@ app.on("activate", function () {
 // code. You can also put them in separate files and require them here.
 
 //登录窗口最小化
-ipcMain.on("window-min", function () {
+ipcMain.on('window-min', function () {
   mainWindow.hide();
 });
 
-ipcMain.on("window-close", function () {
+ipcMain.on('window-close', function () {
   app.quit();
 });
 
-ipcMain.on("cache", (evt, url, id) => {
+ipcMain.on('cache', (evt, url, id) => {
   downloadId = id;
   mainWindow.webContents.downloadURL(url);
 });
 
-ipcMain.on("cache-path", (evt, url) => {
+ipcMain.on('cache-path', (evt, url) => {
   cachePath = url;
 });

web/src/pages/index.js → src/pages/index.js

@@ -2,28 +2,60 @@
  * @Author: RojerChen
  * @Date: 2020-09-10 12:30:28
  * @LastEditors: RojerChen
- * @LastEditTime: 2020-09-10 13:42:45
- * @FilePath: /fa-forever/web/src/pages/index.js
+ * @LastEditTime: 2020-09-11 09:39:10
+ * @FilePath: /fa-forever/src/pages/index.js
  * @Company: freesailing.cn
  */
 import React from 'react';
 import { inject, observer } from 'mobx-react';
 import { List, Icon } from 'antd';
 import { NoticeBar } from 'antd-mobile';
 // import Chat from "../components/chat";
+
 import 'moment/locale/zh-cn';
 
 import * as sty from './index.less';
 
+let remote;
+let cache;
+
+if (window.require) {
+  const electron = window.require('electron');
+  ({ remote } = electron);
+  try {
+    if (remote.require) {
+      cache = remote.require('./cache');
+    }
+  } catch (error) {}
+}
+
 @inject('music')
 @observer
 class Index extends React.Component {
   componentDidMount() {}
 
+  show = song => {
+    const { shell } = remote;
+    const cacheKey = song.path.replace(/\/|.mp3/g, '_');
+    const cachePath = localStorage.getItem('cache-path');
+    const path = cache.path(cacheKey, cachePath);
+    shell.showItemInFolder(path);
+  };
+
+  renderTime(item) {
+    return `${Math.floor(Number(item.additional.song_audio.duration) / 60)}:${
+      item.additional.song_audio.duration % 60 < 10
+        ? '0' + (item.additional.song_audio.duration % 60)
+        : item.additional.song_audio.duration % 60
+    }`;
+  }
+
   render() {
+    const { note, current_songs } = this.props.music;
+
     return (
       <div className={sty.container}>
-        {this.props.music.note && (
+        {note && (
           <NoticeBar
             marqueeProps={{
               loop: true,
@@ -32,14 +64,13 @@ class Index extends React.Component {
               style: { padding: '0 7.5px' },
             }}
           >
-            {this.props.music.note}
+            {note}
           </NoticeBar>
         )}
 
         <List
           size="small"
-          dataSource={this.props.music.current_songs}
-          loading={this.props.music.listloading}
+          dataSource={current_songs}
           header={
             <List.Item className="header-box">
               <div className="playing" />
@@ -67,15 +98,12 @@ class Index extends React.Component {
               <div className="album">{item.additional.song_tag.album}</div>
               <div className="artist">{item.additional.song_tag.artist}</div>
               <div className="duration">
-                {`${Math.floor(Number(item.additional.song_audio.duration) / 60)}:${
-                  item.additional.song_audio.duration % 60 < 10
-                    ? '0' + (item.additional.song_audio.duration % 60)
-                    : item.additional.song_audio.duration % 60
-                }`}
+                {this.renderTime(item)}
                 {item.cached && (
                   <Icon
                     type="cloud-download"
                     style={{ marginLeft: 4, color: '#e04f4c', fontSize: 12 }}
+                    onClick={this.show.bind(this, item)}
                   />
                 )}
               </div>