sovonegr/TorrServerJellyfin
1
0
Fork 0
mirror of https://github.com/Ernous/TorrServerJellyfin.git synced 2025-12-19 21:46:11 +05:00
Code Issues Packages Projects Releases Wiki Activity

refactor

Browse Source
This commit is contained in:
Daniel Shleifman
2021-06-09 00:24:30 +03:00
parent 44b2f7f1bd
commit 5724485fa3
6 changed files with 137 additions and 213 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
web/src/App/Sidebar.jsx
View File

@@ -7,7 +7,6 @@ import AddDialogButton from 'components/Add'
import RemoveAll from 'components/RemoveAll' import RemoveAll from 'components/RemoveAll'
import SettingsDialog from 'components/Settings' import SettingsDialog from 'components/Settings'
import AboutDialog from 'components/About' import AboutDialog from 'components/About'
import UploadDialog from 'components/Upload'
import { CreditCard as CreditCardIcon, List as ListIcon, Language as LanguageIcon } from '@material-ui/icons' import { CreditCard as CreditCardIcon, List as ListIcon, Language as LanguageIcon } from '@material-ui/icons'
import List from '@material-ui/core/List' import List from '@material-ui/core/List'
import CloseServer from 'components/CloseServer' import CloseServer from 'components/CloseServer'
@@ -24,7 +23,6 @@ export default function Sidebar({ isDrawerOpen, setIsDonationDialogOpen }) {
<AppSidebarStyle isDrawerOpen={isDrawerOpen}> <AppSidebarStyle isDrawerOpen={isDrawerOpen}>
<List> <List>
<AddDialogButton /> <AddDialogButton />
<UploadDialog />
<RemoveAll /> <RemoveAll />
<ListItem button component='a' target='_blank' href={playlistAllHost()}> <ListItem button component='a' target='_blank' href={playlistAllHost()}>
<ListItemIcon> <ListItemIcon>

269
web/src/components/Add/AddDialog.jsx
View File

@@ -1,14 +1,10 @@
import { useCallback, useMemo, useState } from 'react' import { useMemo, useState } from 'react'
import Button from '@material-ui/core/Button' import Button from '@material-ui/core/Button'
import TextField from '@material-ui/core/TextField' import TextField from '@material-ui/core/TextField'
import Dialog from '@material-ui/core/Dialog' import Dialog from '@material-ui/core/Dialog'
import DialogActions from '@material-ui/core/DialogActions'
import DialogContent from '@material-ui/core/DialogContent'
import DialogTitle from '@material-ui/core/DialogTitle'
import { torrentsHost, torrentUploadHost } from 'utils/Hosts' import { torrentsHost, torrentUploadHost } from 'utils/Hosts'
import axios from 'axios' import axios from 'axios'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
import { Input, ListItem, ListItemIcon, ListItemText } from '@material-ui/core'
import styled, { css } from 'styled-components' import styled, { css } from 'styled-components'
import { NoImageIcon, AddItemIcon, TorrentIcon } from 'icons' import { NoImageIcon, AddItemIcon, TorrentIcon } from 'icons'
import debounce from 'lodash/debounce' import debounce from 'lodash/debounce'
@@ -16,8 +12,7 @@ import { v4 as uuidv4 } from 'uuid'
import useChangeLanguage from 'utils/useChangeLanguage' import useChangeLanguage from 'utils/useChangeLanguage'
import { Cancel as CancelIcon } from '@material-ui/icons' import { Cancel as CancelIcon } from '@material-ui/icons'
const AddDialogStyle = styled.div`` const Header = styled.div`
const TitleSection = styled.div`
background: #00a572; background: #00a572;
color: rgba(0, 0, 0, 0.87); color: rgba(0, 0, 0, 0.87);
font-size: 20px; font-size: 20px;
@@ -27,14 +22,14 @@ const TitleSection = styled.div`
padding: 15px 24px; padding: 15px 24px;
position: relative; position: relative;
` `
const MainSection = styled.div` const ContentWrapper = styled.div`
background: linear-gradient(145deg, #e4f6ed, #b5dec9); background: linear-gradient(145deg, #e4f6ed, #b5dec9);
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: space-between;
` `
const MainSectionContentWrapper = styled.div` const Content = styled.div`
flex: 1; flex: 1;
display: grid; display: grid;
grid-template-columns: repeat(2, 1fr); grid-template-columns: repeat(2, 1fr);
@@ -110,6 +105,7 @@ const IconWrapper = styled.div`
const FileUploadLabel = styled.label` const FileUploadLabel = styled.label`
transition: all 0.3s; transition: all 0.3s;
flex: 1;
` `
const RightSideTopSection = styled.div` const RightSideTopSection = styled.div`
@@ -290,6 +286,7 @@ export default function AddDialog({ handleClose }) {
const data = new FormData() const data = new FormData()
data.append('save', 'true') data.append('save', 'true')
data.append('file', selectedFile) data.append('file', selectedFile)
title && data.append('title', title)
posterUrl && data.append('poster', posterUrl) posterUrl && data.append('poster', posterUrl)
axios.post(torrentUploadHost(), data).finally(() => handleClose()) axios.post(torrentUploadHost(), data).finally(() => handleClose())
} else { } else {
@@ -307,8 +304,7 @@ export default function AddDialog({ handleClose }) {
setTorrentSource(file.name) setTorrentSource(file.name)
} }
const clearSelectedFile = e => { const clearSelectedFile = () => {
e.stopPropagation()
setSelectedFile() setSelectedFile()
setTorrentSource('') setTorrentSource('')
} }
@@ -320,163 +316,118 @@ export default function AddDialog({ handleClose }) {
} }
return ( return (
<> <Dialog open onClose={handleClose} aria-labelledby='form-dialog-title' fullWidth maxWidth='md'>
<Dialog open onClose={handleClose} aria-labelledby='form-dialog-title' fullWidth maxWidth='md'> <Header>{t('AddNewTorrent')}</Header>
<AddDialogStyle>
<TitleSection>Add new torrent</TitleSection> <ContentWrapper>
<MainSection> <Content>
<MainSectionContentWrapper> <LeftSide>
<LeftSide> <TextField
<TextField onChange={handleTitleChange}
onChange={handleTitleChange} value={title}
value={title} margin='dense'
margin='dense' label={t('Title')}
label={t('Title')} type='text'
type='text' fullWidth
fullWidth />
/> <TextField
<TextField onChange={handlePosterUrlChange}
onChange={handlePosterUrlChange} value={posterUrl}
value={posterUrl} margin='dense'
margin='dense' label={t('AddPosterLinkInput')}
label={t('AddPosterLinkInput')} type='url'
type='url' fullWidth
fullWidth />
<PosterWrapper>
<Poster poster={+isPosterUrlCorrect}>
{isPosterUrlCorrect ? <img src={posterUrl} alt='poster' /> : <NoImageIcon />}
</Poster>
<PosterSuggestions>
{posterList
?.filter(url => url !== posterUrl)
.slice(0, 12)
.map(url => (
<PosterSuggestionsItem onClick={() => userChangesPosterUrl(url)} key={uuidv4()}>
<img src={url} alt='poster' />
</PosterSuggestionsItem>
))}
</PosterSuggestions>
<Button
style={{ justifySelf: 'center' }}
onClick={removePoster}
color='primary'
variant='outlined'
size='small'
disabled={!posterUrl}
>
{t('Clear')}
</Button>
</PosterWrapper>
</LeftSide>
<RightSide>
<RightSideTopSection active={torrentSourceSelected}>
<TextField
onChange={handleTorrentSourceChange}
value={torrentSource}
margin='dense'
label={t('TorrentSourceLink')}
helperText={t('TorrentSourceOptions')}
type='text'
fullWidth
onFocus={() => setTorrentSourceSelected(true)}
onBlur={() => setTorrentSourceSelected(false)}
inputProps={{ autoComplete: 'off' }}
disabled={!!selectedFile}
/>
</RightSideTopSection>
{selectedFile ? (
<RightSideBottomSectionFileSelected>
<TorrentIconWrapper>
<TorrentIcon />
<CancelIconWrapper onClick={clearSelectedFile}>
<CancelIcon />
</CancelIconWrapper>
</TorrentIconWrapper>
</RightSideBottomSectionFileSelected>
) : (
<FileUploadLabel htmlFor='upload-file'>
<input
onChange={handleCapture}
accept='.torrent'
type='file'
style={{ display: 'none' }}
id='upload-file'
/> />
<PosterWrapper> <RightSideBottomSectionNoFile selectedFile={selectedFile} type='submit'>
<Poster poster={+isPosterUrlCorrect}> <div>{t('AppendFile.Or')}</div>
{isPosterUrlCorrect ? <img src={posterUrl} alt='poster' /> : <NoImageIcon />}
</Poster>
<PosterSuggestions> <IconWrapper>
{posterList <AddItemIcon color='primary' />
?.filter(url => url !== posterUrl) <div>{t('AppendFile.ClickOrDrag')}</div>
.slice(0, 12) </IconWrapper>
.map(url => ( </RightSideBottomSectionNoFile>
<PosterSuggestionsItem onClick={() => userChangesPosterUrl(url)} key={uuidv4()}> </FileUploadLabel>
<img src={url} alt='poster' /> )}
</PosterSuggestionsItem> </RightSide>
))} </Content>
</PosterSuggestions>
<Button <ButtonWrapper>
style={{ justifySelf: 'center' }}
onClick={removePoster}
color='primary'
variant='outlined'
size='small'
disabled={!posterUrl}
>
Clear
</Button>
</PosterWrapper>
</LeftSide>
<RightSide>
<RightSideTopSection active={torrentSourceSelected}>
<TextField
onChange={handleTorrentSourceChange}
value={torrentSource}
margin='dense'
label={t('TorrentSourceLink')}
helperText='magnet / hash / .torrent file link'
type='text'
fullWidth
onFocus={() => setTorrentSourceSelected(true)}
onBlur={() => setTorrentSourceSelected(false)}
inputProps={{ autoComplete: 'off' }}
disabled={selectedFile}
/>
</RightSideTopSection>
{selectedFile ? (
<RightSideBottomSectionFileSelected>
<TorrentIconWrapper>
<TorrentIcon />
<CancelIconWrapper onClick={clearSelectedFile}>
<CancelIcon />
</CancelIconWrapper>
</TorrentIconWrapper>
</RightSideBottomSectionFileSelected>
) : (
<FileUploadLabel htmlFor='upload-file' style={{ flex: 1 }}>
<input
onChange={handleCapture}
accept='.torrent'
type='file'
style={{ display: 'none' }}
id='upload-file'
/>
<RightSideBottomSectionNoFile selectedFile={selectedFile} type='submit'>
<div>OR</div>
<IconWrapper>
<AddItemIcon color='primary' />
<div>CLICK / DRAG & DROP</div>
</IconWrapper>
</RightSideBottomSectionNoFile>
</FileUploadLabel>
)}
</RightSide>
</MainSectionContentWrapper>
<ButtonWrapper>
<Button onClick={handleClose} color='primary' variant='outlined'>
{t('Cancel')}
</Button>
<Button variant='contained' disabled={!torrentSource} onClick={handleSave} color='primary'>
{t('Add')}
</Button>
</ButtonWrapper>
</MainSection>
</AddDialogStyle>
{/* <DialogTitle id='form-dialog-title'>{t('AddMagnetOrLink')}</DialogTitle>
<DialogContent>
<TextField onChange={inputTitle} margin='dense' id='title' label={t('Title')} type='text' fullWidth />
<TextField onChange={inputPoster} margin='dense' id='poster' label={t('Poster')} type='url' fullWidth />
<TextField
onChange={inputMagnet}
autoFocus
margin='dense'
id='magnet'
label={t('MagnetOrTorrentFileLink')}
type='text'
fullWidth
/>
<Button color='primary' variant='outlined' component='label'>
{t('UploadFile')}
<input onChange={handleCapture} type='file' accept='.torrent' hidden />
</Button> */}
{/* <label htmlFor='upload-file'>
<Input onChange={handleCapture} accept='.torrent' type='file' id='upload-file' />
<Button htmlFor='upload-file' type='submit' color='primary' variant='outlined'>
{t('UploadFile')}
</Button>
<ListItem button variant='raised' type='submit' component='span' key={t('UploadFile')}>
<ListItemIcon>
<PublishIcon />
</ListItemIcon>
<ListItemText primary={t('UploadFile')} />
</ListItem>
</label> */}
{/* </DialogContent>
<DialogActions>
<Button onClick={handleClose} color='primary' variant='outlined'> <Button onClick={handleClose} color='primary' variant='outlined'>
{t('Cancel')} {t('Cancel')}
</Button> </Button>
<Button variant='contained' disabled={!link} onClick={handleSave} color='primary'> <Button variant='contained' disabled={!torrentSource} onClick={handleSave} color='primary'>
{t('Add')} {t('Add')}
</Button> </Button>
</DialogActions> */} </ButtonWrapper>
</Dialog> </ContentWrapper>
</> </Dialog>
) )
} }

22
web/src/components/DialogTorrentDetailsContent/widgets.jsx
View File

@@ -72,19 +72,15 @@ export const PiecesLengthWidget = ({ data }) => {
export const StatusWidget = ({ data }) => { export const StatusWidget = ({ data }) => {
const { t } = useTranslation() const { t } = useTranslation()
let i18nd = data let i18nd = data
if (data.toLowerCase() === 'torrent added') if (data.toLowerCase() === 'torrent added') i18nd = t('TorrentAdded')
i18nd = t('TorrentAdded') else if (data.toLowerCase() === 'torrent getting info') i18nd = t('TorrentGettingInfo')
else if (data.toLowerCase() === 'torrent getting info') else if (data.toLowerCase() === 'torrent preload') i18nd = t('TorrentPreload')
i18nd = t('TorrentGettingInfo') else if (data.toLowerCase() === 'torrent working') i18nd = t('TorrentWorking')
else if (data.toLowerCase() === 'torrent preload') else if (data.toLowerCase() === 'torrent closed') i18nd = t('TorrentClosed')
i18nd = t('TorrentPreload') else if (data.toLowerCase() === 'torrent in db') i18nd = t('TorrentInDb')
else if (data.toLowerCase() === 'torrent working') return (
i18nd = t('TorrentWorking') <StatisticsField title={t('TorrentStatus')} value={i18nd} iconBg='#aea25b' valueBg='#b4aa6e' icon={BuildIcon} />
else if (data.toLowerCase() === 'torrent closed') )
i18nd = t('TorrentClosed')
else if (data.toLowerCase() === 'torrent in db')
i18nd = t('TorrentInDb')
return <StatisticsField title={t('TorrentStatus')} value={i18nd} iconBg='#aea25b' valueBg='#b4aa6e' icon={BuildIcon} />
} }
export const SizeWidget = ({ data }) => { export const SizeWidget = ({ data }) => {

33
web/src/components/Upload.jsx
View File

@@ -1,33 +0,0 @@
import ListItemIcon from '@material-ui/core/ListItemIcon'
import ListItemText from '@material-ui/core/ListItemText'
import ListItem from '@material-ui/core/ListItem'
import PublishIcon from '@material-ui/icons/Publish'
import { torrentUploadHost } from 'utils/Hosts'
import axios from 'axios'
import { useTranslation } from 'react-i18next'
export default function UploadDialog() {
const { t } = useTranslation()
const handleCapture = ({ target: { files } }) => {
const [file] = files
const data = new FormData()
data.append('save', 'true')
data.append('file', file)
axios.post(torrentUploadHost(), data)
}
return (
<div>
{/* <label htmlFor='upload-file'>
<input onChange={handleCapture} accept='.torrent' type='file' style={{ display: 'none' }} id='upload-file' />
<ListItem button variant='raised' type='submit' component='span' key={t('UploadFile')}>
<ListItemIcon>
<PublishIcon />
</ListItemIcon>
<ListItemText primary={t('UploadFile')} />
</ListItem>
</label> */}
</div>
)
}

10
web/src/locales/en/translation.json
View File

@@ -3,7 +3,7 @@
"Actions": "Actions", "Actions": "Actions",
"Add": "Add", "Add": "Add",
"AddFromLink": "Add from Link", "AddFromLink": "Add from Link",
"AddMagnetOrLink": "Add magnet or link to torrent file", "AddNewTorrent": "Add new torrent",
"AddRetrackers": "Add retrackers", "AddRetrackers": "Add retrackers",
"Buffer": "Preload Buffer / Cache", "Buffer": "Preload Buffer / Cache",
"BufferNote": "Enable “Preload Buffer” in settings to see cache loading progress", "BufferNote": "Enable “Preload Buffer” in settings to see cache loading progress",
@@ -96,5 +96,11 @@
"UseDisk": "Use Disk for Cache", "UseDisk": "Use Disk for Cache",
"UseDiskDesc": "Better use external media on flash-based devices", "UseDiskDesc": "Better use external media on flash-based devices",
"UTP": "μTP (Micro Transport Protocol)", "UTP": "μTP (Micro Transport Protocol)",
"Viewed": "Viewed" "Viewed": "Viewed",
"AppendFile": {
"Or": "OR",
"ClickOrDrag": "CLICK / DRAG & DROP"
},
"TorrentSourceOptions": "magnet / hash / .torrent file link",
"Clear": "Clear"
} }

10
web/src/locales/ru/translation.json
View File

@@ -3,7 +3,7 @@
"Actions": "Действия", "Actions": "Действия",
"Add": "Добавить", "Add": "Добавить",
"AddFromLink": "Добавить", "AddFromLink": "Добавить",
"AddMagnetOrLink": "Добавьте magnet или ссылку на торрент", "AddNewTorrent": "Добавить новый торрент",
"AddRetrackers": "Добавлять", "AddRetrackers": "Добавлять",
"Buffer": "Предзагрузка / Кеш", "Buffer": "Предзагрузка / Кеш",
"BufferNote": "Включите «Наполнять кеш перед началом воспроизведения» в настройках для показа заполнения кеша", "BufferNote": "Включите «Наполнять кеш перед началом воспроизведения» в настройках для показа заполнения кеша",
@@ -96,5 +96,11 @@
"UseDisk": "Использовать диск для кеша", "UseDisk": "Использовать диск для кеша",
"UseDiskDesc": "Рекомендуется использовать внешние носители на устройствах с flash-памятью", "UseDiskDesc": "Рекомендуется использовать внешние носители на устройствах с flash-памятью",
"UTP": "μTP (Micro Transport Protocol)", "UTP": "μTP (Micro Transport Protocol)",
"Viewed": "Просм." "Viewed": "Просм.",
"AppendFile": {
"Or": "ИЛИ",
"ClickOrDrag": "НАЖМИТЕ / ПЕРЕТАЩИТЕ ФАЙЛ"
},
"TorrentSourceOptions": "магнитная ссылка / хэш / ссылка на .torrent файл",
"Clear": "Очистить"
} }