Update gui
This commit is contained in:
parent
c7a330a255
commit
be8d6a5b6c
12 changed files with 74 additions and 52 deletions
3
@types/messageHandler.d.ts
vendored
3
@types/messageHandler.d.ts
vendored
|
|
@ -119,7 +119,8 @@ export type ProgressData = {
|
|||
cur: number,
|
||||
percent: number|string,
|
||||
time: number,
|
||||
downloadSpeed: number
|
||||
downloadSpeed: number,
|
||||
bytes: number
|
||||
};
|
||||
|
||||
export type PossibleMessanges = keyof ServiceHandler;
|
||||
|
|
|
|||
2
dev.js
2
dev.js
|
|
@ -12,7 +12,7 @@ const waitForProcess = async (proc) => {
|
|||
};
|
||||
|
||||
(async () => {
|
||||
await waitForProcess(exec('npm run tsc test false'));
|
||||
await waitForProcess(exec('pnpm run tsc test false'));
|
||||
for (let command of toRun) {
|
||||
await waitForProcess(exec(`node index.js --service crunchy ${command}`, {
|
||||
cwd: path.join(__dirname, 'lib')
|
||||
|
|
|
|||
|
|
@ -67,17 +67,15 @@ export { mainWindow };
|
|||
|
||||
const icon = path.join(__dirname, 'images', `Logo_Inverted.${isWindows ? 'ico' : 'png'}`);
|
||||
|
||||
if (!process.env.TEST) {
|
||||
// eslint-disable-next-line no-global-assign
|
||||
console = (() => {
|
||||
const logFolder = path.join(getDataDirectory(), 'logs');
|
||||
if (!fs.existsSync(logFolder))
|
||||
fs.mkdirSync(logFolder);
|
||||
if (fs.existsSync(path.join(logFolder, 'latest.log')))
|
||||
fs.renameSync(path.join(logFolder, 'latest.log'), path.join(logFolder, `${Date.now()}.log`));
|
||||
return new Console(fs.createWriteStream(path.join(logFolder, 'latest.log')));
|
||||
})();
|
||||
}
|
||||
console = (() => {
|
||||
const logFolder = path.join(getDataDirectory(), 'logs');
|
||||
if (!fs.existsSync(logFolder))
|
||||
fs.mkdirSync(logFolder);
|
||||
if (fs.existsSync(path.join(logFolder, 'latest.log')))
|
||||
fs.renameSync(path.join(logFolder, 'latest.log'), path.join(logFolder, `${Date.now()}.log`));
|
||||
return new Console(fs.createWriteStream(path.join(logFolder, 'latest.log')));
|
||||
})();
|
||||
|
||||
const createWindow = async () => {
|
||||
(await import('../../../modules/module.cfg-loader')).ensureConfig();
|
||||
|
|
|
|||
|
|
@ -2,7 +2,6 @@ import React from "react";
|
|||
import { Container, Box, ThemeProvider, createTheme, Theme } from "@mui/material";
|
||||
|
||||
const makeTheme = (mode: 'dark'|'light') : Partial<Theme> => {
|
||||
console.log(mode);
|
||||
return createTheme({
|
||||
palette: {
|
||||
mode,
|
||||
|
|
|
|||
|
|
@ -74,7 +74,6 @@ const DownloadSelector: React.FC<DownloadSelectorProps> = ({ onFinish }) => {
|
|||
setLoading(true);
|
||||
const res = await messageHandler?.listEpisodes(store.downloadOptions.id);
|
||||
if (!res || !res.isOk) {
|
||||
console.log(res);
|
||||
setLoading(false);
|
||||
return enqueueSnackbar('The request failed. Please check if the ID is correct.', {
|
||||
variant: 'error'
|
||||
|
|
|
|||
|
|
@ -20,7 +20,6 @@ const SearchBox: React.FC = () => {
|
|||
const { enqueueSnackbar } = useSnackbar();
|
||||
|
||||
const selectItem = (id: string) => {
|
||||
console.log(id);
|
||||
dispatch({
|
||||
type: 'downloadOptions',
|
||||
payload: {
|
||||
|
|
|
|||
|
|
@ -1,6 +1,5 @@
|
|||
import { Avatar, Box, Button, CircularProgress, Dialog, DialogActions, DialogContent, DialogContentText, DialogTitle, IconButton, List, ListItem, ListItemAvatar, TextField } from "@mui/material";
|
||||
import { grey } from '@mui/material/colors'
|
||||
import { Check, Close, CloseOutlined, PortraitOutlined } from '@mui/icons-material'
|
||||
import { Button, CircularProgress, Dialog, DialogActions, DialogContent, DialogContentText, DialogTitle, TextField } from "@mui/material";
|
||||
import { Check, Close } from '@mui/icons-material'
|
||||
import React from "react";
|
||||
import { messageChannelContext } from "../provider/MessageChannel";
|
||||
import Require from "./Require";
|
||||
|
|
@ -24,7 +23,6 @@ const AuthButton: React.FC = () => {
|
|||
const [authed, setAuthed] = React.useState(false);
|
||||
|
||||
const checkAuth = async () => {
|
||||
console.log(await messageChannel?.checkToken());
|
||||
setAuthed((await messageChannel?.checkToken())?.isOk ?? false);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -8,8 +8,6 @@ const useDownloadManager = () => {
|
|||
const [ { currentDownload }, dispatch ] = useStore();
|
||||
const messageHandler = React.useContext(messageChannelContext);
|
||||
|
||||
console.log(currentDownload);
|
||||
|
||||
const [progressData, setProgressData] = React.useState<ExtendedProgress|undefined>();
|
||||
|
||||
React.useEffect(() => {
|
||||
|
|
@ -32,15 +30,16 @@ const useDownloadManager = () => {
|
|||
messageHandler?.randomEvents.removeListener('progress', handler);
|
||||
messageHandler?.randomEvents.removeListener('finish', finishHandler)
|
||||
};
|
||||
}, [messageHandler]);
|
||||
}, [messageHandler, dispatch]);
|
||||
|
||||
React.useEffect(() => {
|
||||
if (!currentDownload)
|
||||
return;
|
||||
if (messageHandler?.isDownloading())
|
||||
return;
|
||||
console.log('start download');
|
||||
messageHandler?.downloadItem(currentDownload);
|
||||
}, [currentDownload]);
|
||||
}, [currentDownload, messageHandler]);
|
||||
|
||||
|
||||
return progressData;
|
||||
|
|
|
|||
|
|
@ -6,39 +6,68 @@ import useDownloadManager from "../DownloadManager/DownloadManager";
|
|||
|
||||
const Queue: React.FC = () => {
|
||||
const data = useDownloadManager();
|
||||
console.log("data", data)
|
||||
const [{ queue }, dispatch] = useStore();
|
||||
const [{ queue, currentDownload }, dispatch] = useStore();
|
||||
return data || queue.length > 0 ? <>
|
||||
{data && <Box sx={{ mb: 1, height: 200, display: 'grid', gridTemplateColumns: '20% 1fr', gap: 1 }}>
|
||||
<img src={data.downloadInfo.image} height='200px' width='100%' />
|
||||
<Box sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}>
|
||||
<Box sx={{ display: 'flex', flexDirection: 'column' }}>
|
||||
<Box sx={{ display: 'grid', gridTemplateColumns: '1fr max-content' }}>
|
||||
<Typography variant='h5' color='text.primary'>
|
||||
{data.downloadInfo.title}
|
||||
</Typography>
|
||||
<Typography variant='h5' color='text.primary'>
|
||||
Language: {data.downloadInfo.language.name}
|
||||
{data && <>
|
||||
<Box sx={{ height: 200, display: 'grid', gridTemplateColumns: '20% 1fr', gap: 1, mb: 1, mt: 1 }}>
|
||||
<img src={data.downloadInfo.image} height='200px' width='100%' alt="Thumbnail" />
|
||||
<Box sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}>
|
||||
<Box sx={{ display: 'flex', flexDirection: 'column' }}>
|
||||
<Box sx={{ display: 'grid', gridTemplateColumns: '1fr max-content' }}>
|
||||
<Typography variant='h5' color='text.primary'>
|
||||
{data.downloadInfo.title}
|
||||
</Typography>
|
||||
<Typography variant='h5' color='text.primary'>
|
||||
Language: {data.downloadInfo.language.name}
|
||||
</Typography>
|
||||
</Box>
|
||||
<Typography variant='h6' color='text.primary'>
|
||||
{data.downloadInfo.parent.title}
|
||||
</Typography>
|
||||
</Box>
|
||||
<LinearProgress variant='determinate' sx={{ height: '10px' }} value={(typeof data.progress.percent === 'string' ? parseInt(data.progress.percent) : data.progress.percent)} />
|
||||
<Box>
|
||||
<Typography variant="body1" color='text.primary'>
|
||||
{data.progress.cur} / {(data.progress.total)} parts ({data.progress.percent}% | {formatTime(data.progress.time)} | {(data.progress.downloadSpeed / 1024 / 1024).toFixed(2)} MB/s | {(data.progress.bytes / 1024 / 1024).toFixed(2)}MB)
|
||||
</Typography>
|
||||
</Box>
|
||||
<Typography variant='h6' color='text.primary'>
|
||||
{data.downloadInfo.parent.title}
|
||||
</Typography>
|
||||
</Box>
|
||||
<LinearProgress variant='determinate' sx={{ height: '10px' }} value={(typeof data.progress.percent === 'string' ? parseInt(data.progress.percent) : data.progress.percent)} />
|
||||
<Box>
|
||||
<Typography variant="body1" color='text.primary'>
|
||||
{data.progress.cur}MB / {(data.progress.total)}MB ({data.progress.percent}% | {formatTime(data.progress.time)} | {(data.progress.downloadSpeed / 1024 / 1024).toFixed(2)} MB/s)
|
||||
</Typography>
|
||||
</Box>
|
||||
</Box>
|
||||
</Box>}
|
||||
</>
|
||||
}
|
||||
{
|
||||
!data && currentDownload && <>
|
||||
<Box sx={{ height: 200, display: 'grid', gridTemplateColumns: '20% 1fr', gap: 1, mb: 1, mt: 1 }}>
|
||||
<img src={currentDownload.image} height='200px' width='100%' alt="Thumbnail" />
|
||||
<Box sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}>
|
||||
<Box sx={{ display: 'flex', flexDirection: 'column' }}>
|
||||
<Box sx={{ display: 'grid', gridTemplateColumns: '1fr max-content' }}>
|
||||
<Typography variant='h5' color='text.primary'>
|
||||
{currentDownload.title}
|
||||
</Typography>
|
||||
<Typography variant='h5' color='text.primary'>
|
||||
Languages: {currentDownload.dubLang}
|
||||
</Typography>
|
||||
</Box>
|
||||
<Typography variant='h6' color='text.primary'>
|
||||
{currentDownload.parent.title}
|
||||
</Typography>
|
||||
</Box>
|
||||
<LinearProgress variant='indeterminate' sx={{ height: '10px' }} />
|
||||
<Box>
|
||||
<Typography variant="body1" color='text.primary'>
|
||||
Waiting for download to start
|
||||
</Typography>
|
||||
</Box>
|
||||
</Box>
|
||||
</Box>
|
||||
</>
|
||||
}
|
||||
{queue.length && data && <Divider variant="fullWidth" />}
|
||||
{queue.map((queueItem, index, { length }) => {
|
||||
console.log(queueItem);
|
||||
return <Box key={`queue_item_${index}`}>
|
||||
<Box sx={{ height: 200, display: 'grid', gridTemplateColumns: '20% 1fr', gap: 1, mb: 1, mt: 1 }}>
|
||||
<img src={queueItem.image} height='200px' width='100%' />
|
||||
<img src={queueItem.image} height='200px' width='100%' alt="Thumbnail" />
|
||||
<Box sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}>
|
||||
<Box sx={{ display: 'flex', flexDirection: 'column' }}>
|
||||
<Box sx={{ display: 'grid', gridTemplateColumns: '1fr 200px' }}>
|
||||
|
|
|
|||
|
|
@ -52,7 +52,7 @@ const Reducer = <T extends keyof StoreState,>(state: StoreState, action: StoreAc
|
|||
case 'downloadQueue':
|
||||
state.downloadQueue = action.payload as boolean;
|
||||
if (state.queue.length > 0 && state.downloadQueue && state.currentDownload === undefined) {
|
||||
state.currentDownload = state.queue[1];
|
||||
state.currentDownload = state.queue[0];
|
||||
state.queue = state.queue.slice(1);
|
||||
}
|
||||
return {...state}
|
||||
|
|
|
|||
|
|
@ -87,19 +87,19 @@
|
|||
"start": "pnpm prestart && cd lib && npx electron .",
|
||||
"docs": "ts-node modules/build-docs.ts",
|
||||
"tsc": "ts-node tsc.ts",
|
||||
"prebuild-cli": "npm run tsc false false",
|
||||
"prebuild-cli": "pnpm run tsc false false",
|
||||
"build-windows-cli": "pnpm run prebuild-cli && cd lib && node modules/build windows64",
|
||||
"build-ubuntu-cli": "pnpm run prebuild-cli && cd lib && node modules/build ubuntu64",
|
||||
"build-arm-cli": "pnpm run prebuild-cli && cd lib && node modules/build arm64",
|
||||
"build-macos-cli": "pnpm run prebuild-cli && cd lib && node modules/build macos64",
|
||||
"prebuild-gui": "npm run tsc",
|
||||
"prebuild-gui": "pnpm run tsc",
|
||||
"build-windows-gui": "pnpm run prebuild-gui && cd lib && node modules/build windows64 true",
|
||||
"build-ubuntu-gui": "pnpm run prebuild-gui && cd lib && node modules/build ubuntu64 true",
|
||||
"build-arm-gui": "pnpm run prebuild-gui && cd lib && node modules/build arm64 true",
|
||||
"build-macos-gui": "pnpm run prebuild-gui && cd lib && node modules/build macos64 true",
|
||||
"eslint": "eslint *.js modules",
|
||||
"eslint-fix": "eslint *.js modules --fix",
|
||||
"pretest": "npm run tsc",
|
||||
"pretest": "pnpm run tsc",
|
||||
"test": "pnpm run pretest && cd lib && node modules/build windows64 && node modules/build ubuntu64 && node modules/build macos64"
|
||||
},
|
||||
"build": {
|
||||
|
|
|
|||
2
tsc.ts
2
tsc.ts
|
|
@ -103,7 +103,7 @@ export { ignore };
|
|||
alterJSON();
|
||||
}
|
||||
if (!isTest) {
|
||||
const dependencies = exec(`npm install ${isGUI ? '' : '--production'}`, {
|
||||
const dependencies = exec(`pnpm install ${isGUI ? '' : '-P'}`, {
|
||||
cwd: path.join(__dirname, 'lib')
|
||||
});
|
||||
await waitForProcess(dependencies);
|
||||
|
|
|
|||
Loading…
Reference in a new issue