Skip to content

Commit

Permalink
feat(remote download): unified UI for torrent and URL download, impro…
Browse files Browse the repository at this point in the history 
…ve path selection experience
  • Loading branch information
@HFO4
HFO4 committed Oct 31, 2022
1 parent a00408f commit 5ff53fe
Show file tree
Hide file tree
Showing 8 changed files with 345 additions and 245 deletions.
2 changes: 1 addition & 1 deletion public/locales/en-US/application.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -197,7 +197,7 @@
"newRemoteDownloadTitle": "New remote download task",
"remoteDownloadURL": "Download target URL",
"remoteDownloadURLDescription": "Paste the download URL, one URL per line, support HTTP(s) / FTP / Magnet link",
"remoteDownloadDst": "Select a download destination",
"remoteDownloadDst": "Download to",
"createTask": "Creat task",
"downloadTo": "Download to <0>{{name}}</0>",
"decompressTo": "Decompress to",
Expand Down
4 changes: 2 additions & 2 deletions public/locales/zh-CN/application.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -195,9 +195,9 @@
"deleteOneDescription": "确定要删除 <0>{{name}}</0> 吗？",
"deleteMultipleDescription": "确定要删除这 {{num}} 个对象吗？",
"newRemoteDownloadTitle": "新建离线下载任务",
"remoteDownloadURL": "文件地址",
"remoteDownloadURL": "下载链接",
"remoteDownloadURLDescription": "输入文件下载地址，一行一个，支持 HTTP(s) / FTP / 磁力链",
"remoteDownloadDst": "选择存储位置",
"remoteDownloadDst": "下载至",
"createTask": "创建任务",
"downloadTo": "下载至 <0>{{name}}</0>",
"decompressTo": "解压缩至",
Expand Down
7 changes: 3 additions & 4 deletions src/component/FileManager/ContextMenu.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,12 +34,12 @@ import pathHelper from "../../utils/page";
import RefreshIcon from "@material-ui/icons/Refresh";
import {
batchGetSource,
openPreview,
openPreview, openTorrentDownload,
setSelectedTarget,
startBatchDownload,
startDirectoryDownload,
startDownload,
toggleObjectInfoSidebar,
toggleObjectInfoSidebar
} from "../../redux/explorer/action";
import {
changeContextMenu,
Expand All @@ -56,7 +56,6 @@ import {
openRemoveDialog,
openRenameDialog,
openShareDialog,
openTorrentDownloadDialog,
refreshFileList,
setNavigatorLoadingStatus,
showImgPreivew,
Expand Down Expand Up @@ -142,7 +141,7 @@ const mapDispatchToProps = (dispatch) => {
dispatch(openRemoteDownloadDialog());
},
openTorrentDownloadDialog: () => {
dispatch(openTorrentDownloadDialog());
dispatch(openTorrentDownload());
},
openCopyDialog: () => {
dispatch(openCopyDialog());
Expand Down
237 changes: 7 additions & 230 deletions src/component/FileManager/Modals.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@ import {
import OptionSelector from "../Modals/OptionSelector";
import { getDownloadURL } from "../../services/file";
import { Trans, withTranslation } from "react-i18next";
import RemoteDownload from "../Modals/RemoteDownload";

const styles = (theme) => ({
wrapper: {
Expand Down Expand Up @@ -100,8 +101,6 @@ class ModalsCompoment extends Component {
secretShare: false,
sharePwd: "",
shareUrl: "",
downloadURL: "",
remoteDownloadPathSelect: false,
purchaseCallback: null,
};

Expand Down Expand Up @@ -413,83 +412,6 @@ class ModalsCompoment extends Component {
//this.props.toggleSnackbar();
};

submitTorrentDownload = (e) => {
e.preventDefault();
this.props.setModalsLoading(true);
API.post("/aria2/torrent/" + this.props.selected[0].id, {
dst:
this.state.selectedPath === "//"
? "/"
: this.state.selectedPath,
})
.then(() => {
this.props.toggleSnackbar(
"top",
"right",
this.props.t("modals.taskCreated"),
"success"
);
this.onClose();
this.props.setModalsLoading(false);
})
.catch((error) => {
this.props.toggleSnackbar(
"top",
"right",
error.message,
"error"
);
this.props.setModalsLoading(false);
});
};

submitDownload = (e) => {
e.preventDefault();
this.props.setModalsLoading(true);
API.post("/aria2/url", {
url: this.state.downloadURL.split("\n"),
dst:
this.state.selectedPath === "//"
? "/"
: this.state.selectedPath,
})
.then((response) => {
const failed = response.data
.filter((r) => r.code !== 0)
.map((r) => new AppError(r.msg, r.code, r.error).message);
if (failed.length > 0) {
this.props.toggleSnackbar(
"top",
"right",
this.props.t("modals.taskCreateFailed", {
failed: failed.length,
details: failed.join(","),
}),
"warning"
);
} else {
this.props.toggleSnackbar(
"top",
"right",
this.props.t("modals.taskCreated"),
"success"
);
}

this.onClose();
this.props.setModalsLoading(false);
})
.catch((error) => {
this.props.toggleSnackbar(
"top",
"right",
error.message,
"error"
);
this.props.setModalsLoading(false);
});
};

setMoveTarget = (folder) => {
const path =
folder.path === "/"
Expand All @@ -501,13 +423,6 @@ class ModalsCompoment extends Component {
});
};

remoteDownloadNext = () => {
this.props.closeAllModals();
this.setState({
remoteDownloadPathSelect: true,
});
};

onClose = () => {
this.setState({
newFolderName: "",
Expand All @@ -517,9 +432,7 @@ class ModalsCompoment extends Component {
selectedPathName: "",
secretShare: false,
sharePwd: "",
downloadURL: "",
shareUrl: "",
remoteDownloadPathSelect: false,
});
this.newNameSuffix = "";
this.props.closeAllModals();
Expand Down Expand Up @@ -848,150 +761,14 @@ class ModalsCompoment extends Component {
setModalsLoading={this.props.setModalsLoading}
selected={this.props.selected}
/>
<Dialog
<RemoteDownload
open={this.props.modalsStatus.remoteDownload}
onClose={this.onClose}
aria-labelledby="form-dialog-title"
fullWidth
>
<DialogTitle id="form-dialog-title">
{t("modals.newRemoteDownloadTitle")}
</DialogTitle>

<DialogContent>
<DialogContentText>
<TextField
label={t("modals.remoteDownloadURL")}
autoFocus
fullWidth
multiline
id="downloadURL"
onChange={this.handleInputChange}
placeholder={t(
"modals.remoteDownloadURLDescription"
)}
/>
</DialogContentText>
</DialogContent>
<DialogActions>
<Button onClick={this.onClose}>
{t("cancel", { ns: "common" })}
</Button>
<Button
onClick={this.remoteDownloadNext}
color="primary"
disabled={
this.props.modalsLoading ||
this.state.downloadURL === ""
}
>
{t("ok", { ns: "common" })}
</Button>
</DialogActions>
</Dialog>
<Dialog
open={this.state.remoteDownloadPathSelect}
onClose={this.onClose}
aria-labelledby="form-dialog-title"
>
<DialogTitle id="form-dialog-title">
{t("modals.remoteDownloadDst")}
</DialogTitle>
<PathSelector
presentPath={this.props.path}
selected={this.props.selected}
onSelect={this.setMoveTarget}
/>

{this.state.selectedPath !== "" && (
<DialogContent className={classes.contentFix}>
<DialogContentText>
<Trans
i18nKey="modals.downloadTo"
values={{
name: this.state.selectedPathName,
}}
components={[<strong key={0} />]}
/>
</DialogContentText>
</DialogContent>
)}
<DialogActions>
<Button onClick={this.onClose}>
{t("cancel", { ns: "common" })}
</Button>
<div className={classes.wrapper}>
<Button
onClick={this.submitDownload}
color="primary"
disabled={
this.state.selectedPath === "" ||
this.props.modalsLoading
}
>
{t("modals.createTask")}
{this.props.modalsLoading && (
<CircularProgress
size={24}
className={classes.buttonProgress}
/>
)}
</Button>
</div>
</DialogActions>
</Dialog>
<Dialog
open={this.props.modalsStatus.torrentDownload}
onClose={this.onClose}
aria-labelledby="form-dialog-title"
>
<DialogTitle id="form-dialog-title">
{t("modals.remoteDownloadDst")}
</DialogTitle>
<PathSelector
presentPath={this.props.path}
selected={this.props.selected}
onSelect={this.setMoveTarget}
/>

{this.state.selectedPath !== "" && (
<DialogContent className={classes.contentFix}>
<DialogContentText>
<Trans
i18nKey="modals.downloadTo"
values={{
name: this.state.selectedPathName,
}}
components={[<strong key={0} />]}
/>
</DialogContentText>
</DialogContent>
)}
<DialogActions>
<Button onClick={this.onClose}>
{t("cancel", { ns: "common" })}
</Button>
<div className={classes.wrapper}>
<Button
onClick={this.submitTorrentDownload}
color="primary"
disabled={
this.state.selectedPath === "" ||
this.props.modalsLoading
}
>
{t("modals.createTask")}
{this.props.modalsLoading && (
<CircularProgress
size={24}
className={classes.buttonProgress}
/>
)}
</Button>
</div>
</DialogActions>
</Dialog>

modalsLoading={this.props.modalsLoading}
setModalsLoading={this.props.setModalsLoading}
presentPath={this.props.path}
torrent={this.props.modalsStatus.remoteDownloadTorrent}
/>
<DecompressDialog
open={this.props.modalsStatus.decompress}
onClose={this.onClose}
Expand Down
Loading

0 comments on commit 5ff53fe

Please sign in to comment.