# support change resource

package.json

@@ -1,6 +1,6 @@
 {
   "name": "tomatox",
-  "version": "1.2.3",
+  "version": "1.2.4",
   "description": "A free fast beautiful online video player with electron.",
   "main": "./dist/main.js",
   "scripts": {

src/renderer/app.tsx

@@ -1,10 +1,6 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
-import CustomLayout from './components/layout/custom-layout'
-import './app.css'
-import '@/utils/origins'
+import CustomLayout from './components/layout/custom-layout';
+import './app.css';
 
-ReactDOM.render(
-    <CustomLayout />,
-  document.getElementById('root')
-);
+ReactDOM.render(<CustomLayout />, document.getElementById('root'));

src/renderer/components/layout/content/custom-content.tsx

@@ -14,6 +14,7 @@ import cssM from './custom-content.scss';
 import About from '@/views/about/about';
 import Iptv from '@/views/iptv/iptv';
 import IptvPlayer from '@/views/iptv/iptv-player/iptv-player';
+import Setting from '@/views/setting/setting';
 
 function updatePath(cb: Function, props: any) {
     store.setState('CURRENT_PATH', props.path);
@@ -44,6 +45,7 @@ export default function customContent() {
                 <Route path="/collect" component={Collect} enterFilter={updatePath} />
                 <Route path="/play" component={Player} enterFilter={updatePath} />
                 <Route cache path="/search" component={Search} enterFilter={updatePath} />
+                <Route cache path="/setting" component={Setting} enterFilter={updatePath} />
                 <Route cache path="/about" component={About} enterFilter={updatePath} />
             </div>
         </Spin>

src/renderer/components/layout/custom-layout.tsx

@@ -1,33 +1,27 @@
 import { Layout } from 'antd';
 import React, { useState } from 'react';
 import { HashRouter } from 'react-keeper';
-import store from '@/utils/store';
 import Indexed from '@/utils/db/indexed';
 import cssM from './custom-layout.scss';
 import CustomSider from './sider/custom-sider';
 import CustomHeader from './header/custom-header';
 import CustomContent from './content/custom-content';
+import { TABLES } from '@/utils/constants';
+import { getEnabledOrigin } from '@/utils/db/storage';
+import store from '@/utils/store';
 
 const { Header, Sider, Content } = Layout;
-let dbLoaded = false;
-let siteLoaded = false;
 
 export default function CustomLayout() {
-    const site = store.getState('SITE_ADDRESS');
-    const [loaded, setLoaded] = useState(Boolean(site));
+    const [loaded, setLoaded] = useState(false);
     if (!loaded) {
-        const unsubCB = store.subscribe('SITE_ADDRESS', () => {
-            unsubCB();
-            siteLoaded = true;
-            if (dbLoaded) {
-                setLoaded(true);
-            }
-        });
-        Indexed.init().then(() => {
-            dbLoaded = true;
-            if (siteLoaded) {
-                setLoaded(true);
-            }
+        Indexed.init().then(async () => {
+            const origin = await Indexed.instance!.queryById(
+                TABLES.TABLE_ORIGIN,
+                getEnabledOrigin()
+            );
+            store.setState('SITE_ADDRESS', origin);
+            setLoaded(true);
         });
     }
     return (

src/renderer/components/layout/sider/custom-sider.tsx

@@ -7,7 +7,8 @@ import {
     AppstoreOutlined,
     SearchOutlined,
     StarOutlined,
-    PlayCircleOutlined
+    PlayCircleOutlined,
+    SettingOutlined
 } from '@ant-design/icons';
 import { Link } from 'react-keeper';
 import Icon from '@/images/svg/icon.svg';
@@ -57,6 +58,11 @@ export default function CustomSider(props: any) {
                         <span>收藏</span>
                     </Link>
                 </Menu.Item>
+                <Menu.Item key={'/setting'} icon={<SettingOutlined />}>
+                    <Link to={'/setting'}>
+                        <span>设置</span>
+                    </Link>
+                </Menu.Item>
                 <Menu.Item key={'/about'} icon={<StarOutlined />}>
                     <Link to={'/about'}>
                         <span>关于</span>

src/renderer/styles/overwrite.css

@@ -1,6 +1,7 @@
 * {
     font-family: tahoma, 'microsoft yahei', '\5FAE\8F6F\96C5\9ED1', 'sans-serif' !important;
     user-select: none;
+    --antd-wave-shadow-color: #ff5c49;
 }
 
 /*滚动条整体宽度*/
@@ -144,3 +145,64 @@
     background: #484848;
     color: #f39856;
 }
+
+.ant-radio-wrapper {
+    color: #f1f1f1;
+}
+
+.ant-radio-inner::after {
+    background-color: #ff5c49;
+}
+
+.ant-radio-checked .ant-radio-inner {
+    border-color: #ff5c49;
+}
+
+.ant-radio-wrapper:hover .ant-radio,
+.ant-radio:hover .ant-radio-inner,
+.ant-radio-input:focus + .ant-radio-inner {
+    border-color: #ff5c49;
+}
+
+.ant-checkbox-wrapper + .ant-checkbox-wrapper {
+    margin-left: unset;
+}
+
+.ant-checkbox-checked .ant-checkbox-inner {
+    background-color: #ff5c49;
+    border-color: #ff5c49;
+}
+
+.ant-checkbox-checked::after {
+    border: 1px solid #ff5c49;
+}
+
+.ant-checkbox-wrapper:hover .ant-checkbox-inner,
+.ant-checkbox:hover .ant-checkbox-inner,
+.ant-checkbox-input:focus + .ant-checkbox-inner {
+    border-color: #ff5c49;
+}
+
+.ant-input-group-addon {
+    background-color: #ff5c49;
+    color: #f1f1f1;
+    border: 1px solid #ff5c49;
+}
+
+.ant-input {
+    background-color: #696666;
+    border-color: #696666;
+}
+
+.ant-btn {
+    background-color: #ff5c49;
+    color: #f1f1f1;
+    border: 1px solid #ff5c49;
+}
+
+.ant-btn:hover,
+.ant-btn:focus {
+    background-color: #ff5c49;
+    color: #f1f1f1;
+    border: 1px solid #ff5c49;
+}

src/renderer/typing/typings.d.ts

@@ -3,14 +3,7 @@ declare module '*.scss';
 
 declare interface Iorigin {
     id: string;
-    key: string;
-    name: string;
     api: string;
-    download: string;
-    group: string;
-    isActive: boolean;
-    jiexiUrl: string;
-    status: string;
 }
 
 declare interface IplayResource {

src/renderer/utils/constants.ts

@@ -1,4 +1,7 @@
-export const ORIGIN_URL = 'https://gitee.com/yanjiaxuan/tomatox-res/raw/master/resources.json';
+export const DEFAULT_ORIGIN: Iorigin = {
+    id: 'default',
+    api: 'http://www.kuaibozy.com/api.php/provide/vod/from/kbm3u8'
+};
 export const IPTV_ORIGIN_URL = 'https://gitee.com/yanjiaxuan/tomatox-res/raw/master/zhibo.json';
 export const PROD_STATEMENT =
     '版权声明：本人发布的所有资源或软件均来自网络，与本人没有任何关系，只能作为私下交流、学习、研究之用，版权归原作者及原软件公司所有。\n' +
@@ -8,5 +11,6 @@ export const PROD_STATEMENT =
 
 export const TABLES = {
     TABLE_HISTORY: 'tomatox_play_history',
-    TABLE_COLLECT: 'tomatox_collect'
+    TABLE_COLLECT: 'tomatox_collect',
+    TABLE_ORIGIN: 'tomatox_origin'
 };

src/renderer/utils/db/indexed.ts

@@ -1,4 +1,4 @@
-import { TABLES } from '@/utils/constants';
+import { DEFAULT_ORIGIN, TABLES } from '@/utils/constants';
 import { cleanResourceData } from '@/utils/filterResources';
 
 export default class Indexed {
@@ -13,20 +13,22 @@ export default class Indexed {
     public static init(): Promise<Indexed> {
         return new Promise((resolve, reject) => {
             if (!this.instance) {
-                const dbReq = window.indexedDB.open('TOMATOX', 3);
+                const dbReq = window.indexedDB.open('TOMATOX', 4);
                 dbReq.onupgradeneeded = () => {
                     const db = dbReq.result;
                     if (!db.objectStoreNames.contains(TABLES.TABLE_HISTORY)) {
-                        const table = db.createObjectStore(TABLES.TABLE_HISTORY, {
-                            keyPath: 'id'
-                        });
-                        table.createIndex('lastPlayDate', 'lastPlayDate', {
-                            unique: false
-                        });
+                        const table = db.createObjectStore(TABLES.TABLE_HISTORY, { keyPath: 'id' });
+                        table.createIndex('lastPlayDate', 'lastPlayDate', { unique: false });
                     }
                     if (!db.objectStoreNames.contains(TABLES.TABLE_COLLECT)) {
-                        db.createObjectStore(TABLES.TABLE_COLLECT, {
-                            keyPath: 'id'
+                        db.createObjectStore(TABLES.TABLE_COLLECT, { keyPath: 'id' });
+                    }
+                    if (!db.objectStoreNames.contains(TABLES.TABLE_ORIGIN)) {
+                        const table = db.createObjectStore(TABLES.TABLE_ORIGIN, { keyPath: 'id' });
+                        table.put(DEFAULT_ORIGIN);
+                        table.put({
+                            id: '百度云资源',
+                            api: 'https://api.apibdzy.com/api.php/provide/vod/at/'
                         });
                     }
                 };
@@ -35,7 +37,7 @@ export default class Indexed {
                     this.instance = new Indexed();
                     this.instance.removeThreeMonthAgoHistoryData();
                     this.instance.loadCollectedRes();
-                    resolve(this.instance);
+                    resolve(this.instance!);
                 };
             } else {
                 resolve(this.instance);
@@ -56,7 +58,6 @@ export default class Indexed {
 
     public queryAll(tableName: string) {
         return new Promise(resolve => {
-            const res: any[] = [];
             const req = Indexed.db!.transaction(tableName, 'readonly')
                 .objectStore(tableName)
                 .getAll();
@@ -77,7 +78,16 @@ export default class Indexed {
         });
     }
 
-    public insertOrUpdate(tableName: string, data: IplayResource) {
+    public insertOrUpdateOrigin(tableName: string, data: Iorigin) {
+        return new Promise(resolve => {
+            Indexed.db!.transaction(tableName, 'readwrite')
+                .objectStore(tableName)
+                .put(data).onsuccess = () => {
+                resolve(null);
+            };
+        });
+    }
+    public insertOrUpdateResource(tableName: string, data: IplayResource) {
         if (tableName === TABLES.TABLE_COLLECT) {
             Indexed.collectedRes.add(data.id);
         }
@@ -119,7 +129,7 @@ export default class Indexed {
     }
 
     public doCollect(data: IplayResource) {
-        this.insertOrUpdate(TABLES.TABLE_COLLECT, {
+        this.insertOrUpdateResource(TABLES.TABLE_COLLECT, {
             ...data,
             collectOption: { collectDate: Date.now() }
         });

src/renderer/utils/db/storage.ts

@@ -1,8 +1,14 @@
 const configName = 'tomatox_play_config';
+const enabledOriginName = 'tomatox_enabled_origin';
 let playConfig: IplayConfig = {
     voice: 0.7,
     speed: 1
 };
+let enabledOrigin: string | null = localStorage.getItem(enabledOriginName);
+if (!enabledOrigin) {
+    enabledOrigin = 'default';
+    setEnabledOrigin(enabledOrigin);
+}
 
 const localConf = localStorage.getItem(configName);
 if (!localConf) {
@@ -24,3 +30,12 @@ export function setPlayConfig(config: IplayConfig) {
     };
     localStorage.setItem(configName, JSON.stringify(playConfig));
 }
+
+export function getEnabledOrigin() {
+    return enabledOrigin;
+}
+
+export function setEnabledOrigin(id: string) {
+    enabledOrigin = id;
+    localStorage.setItem(enabledOriginName, id);
+}

src/renderer/utils/store.ts

@@ -5,9 +5,8 @@ class Store {
 
     constructor() {
         this.state = {
-            ORIGIN_LIST: '', // 视频源列表
+            SITE_ADDRESS: undefined,
             GLOBAL_LOADING: false, // 全局loading
-            SITE_ADDRESS: undefined, // 当前视频源
             SEARCH_KEYWORDS: '', // 搜索关键字
             CURRENT_PATH: '', // 当前页面路径
             GLOBAL_SEARCH_ENABLE: true // 全局搜索按钮状态