Skip to content

Commit 5ff53fe

Browse files
HFO4HFO4
committed
feat(remote download): unified UI for torrent and URL download, improve path selection experience
1 parent a00408f commit 5ff53fe

File tree

8 files changed

+345
-245
lines changed

8 files changed

+345
-245
lines changed

‎public/locales/en-US/application.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -197,7 +197,7 @@
197197
"newRemoteDownloadTitle": "New remote download task",
198198
"remoteDownloadURL": "Download target URL",
199199
"remoteDownloadURLDescription": "Paste the download URL, one URL per line, support HTTP(s) / FTP / Magnet link",
200-
"remoteDownloadDst": "Select a download destination",
200+
"remoteDownloadDst": "Download to",
201201
"createTask": "Creat task",
202202
"downloadTo": "Download to <0>{{name}}</0>",
203203
"decompressTo": "Decompress to",

‎public/locales/zh-CN/application.json‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -195,9 +195,9 @@
195195
"deleteOneDescription": "确定要删除 <0>{{name}}</0> 吗？",
196196
"deleteMultipleDescription": "确定要删除这 {{num}} 个对象吗？",
197197
"newRemoteDownloadTitle": "新建离线下载任务",
198-
"remoteDownloadURL": "文件地址",
198+
"remoteDownloadURL": "下载链接",
199199
"remoteDownloadURLDescription": "输入文件下载地址，一行一个，支持 HTTP(s) / FTP / 磁力链",
200-
"remoteDownloadDst": "选择存储位置",
200+
"remoteDownloadDst": "下载至",
201201
"createTask": "创建任务",
202202
"downloadTo": "下载至 <0>{{name}}</0>",
203203
"decompressTo": "解压缩至",

‎src/component/FileManager/ContextMenu.js‎

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -34,12 +34,12 @@ import pathHelper from "../../utils/page";
3434
import RefreshIcon from "@material-ui/icons/Refresh";
3535
import {
3636
batchGetSource,
37-
openPreview,
37+
openPreview, openTorrentDownload,
3838
setSelectedTarget,
3939
startBatchDownload,
4040
startDirectoryDownload,
4141
startDownload,
42-
toggleObjectInfoSidebar,
42+
toggleObjectInfoSidebar
4343
} from "../../redux/explorer/action";
4444
import {
4545
changeContextMenu,
@@ -56,7 +56,6 @@ import {
5656
openRemoveDialog,
5757
openRenameDialog,
5858
openShareDialog,
59-
openTorrentDownloadDialog,
6059
refreshFileList,
6160
setNavigatorLoadingStatus,
6261
showImgPreivew,
@@ -142,7 +141,7 @@ const mapDispatchToProps = (dispatch) => {
142141
dispatch(openRemoteDownloadDialog());
143142
},
144143
openTorrentDownloadDialog: () => {
145-
dispatch(openTorrentDownloadDialog());
144+
dispatch(openTorrentDownload());
146145
},
147146
openCopyDialog: () => {
148147
dispatch(openCopyDialog());

‎src/component/FileManager/Modals.js‎

Lines changed: 7 additions & 230 deletions
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,7 @@ import {
3232
import OptionSelector from "../Modals/OptionSelector";
3333
import { getDownloadURL } from "../../services/file";
3434
import { Trans, withTranslation } from "react-i18next";
35+
import RemoteDownload from "../Modals/RemoteDownload";
3536

3637
const styles = (theme) => ({
3738
wrapper: {
@@ -100,8 +101,6 @@ class ModalsCompoment extends Component {
100101
secretShare: false,
101102
sharePwd: "",
102103
shareUrl: "",
103-
downloadURL: "",
104-
remoteDownloadPathSelect: false,
105104
purchaseCallback: null,
106105
};
107106

@@ -413,83 +412,6 @@ class ModalsCompoment extends Component {
413412
//this.props.toggleSnackbar();
414413
};
415414

416-
submitTorrentDownload = (e) => {
417-
e.preventDefault();
418-
this.props.setModalsLoading(true);
419-
API.post("/aria2/torrent/" + this.props.selected[0].id, {
420-
dst:
421-
this.state.selectedPath === "//"
422-
? "/"
423-
: this.state.selectedPath,
424-
})
425-
.then(() => {
426-
this.props.toggleSnackbar(
427-
"top",
428-
"right",
429-
this.props.t("modals.taskCreated"),
430-
"success"
431-
);
432-
this.onClose();
433-
this.props.setModalsLoading(false);
434-
})
435-
.catch((error) => {
436-
this.props.toggleSnackbar(
437-
"top",
438-
"right",
439-
error.message,
440-
"error"
441-
);
442-
this.props.setModalsLoading(false);
443-
});
444-
};
445-
446-
submitDownload = (e) => {
447-
e.preventDefault();
448-
this.props.setModalsLoading(true);
449-
API.post("/aria2/url", {
450-
url: this.state.downloadURL.split("\n"),
451-
dst:
452-
this.state.selectedPath === "//"
453-
? "/"
454-
: this.state.selectedPath,
455-
})
456-
.then((response) => {
457-
const failed = response.data
458-
.filter((r) => r.code !== 0)
459-
.map((r) => new AppError(r.msg, r.code, r.error).message);
460-
if (failed.length > 0) {
461-
this.props.toggleSnackbar(
462-
"top",
463-
"right",
464-
this.props.t("modals.taskCreateFailed", {
465-
failed: failed.length,
466-
details: failed.join(","),
467-
}),
468-
"warning"
469-
);
470-
} else {
471-
this.props.toggleSnackbar(
472-
"top",
473-
"right",
474-
this.props.t("modals.taskCreated"),
475-
"success"
476-
);
477-
}
478-
479-
this.onClose();
480-
this.props.setModalsLoading(false);
481-
})
482-
.catch((error) => {
483-
this.props.toggleSnackbar(
484-
"top",
485-
"right",
486-
error.message,
487-
"error"
488-
);
489-
this.props.setModalsLoading(false);
490-
});
491-
};
492-
493415
setMoveTarget = (folder) => {
494416
const path =
495417
folder.path === "/"
@@ -501,13 +423,6 @@ class ModalsCompoment extends Component {
501423
});
502424
};
503425

504-
remoteDownloadNext = () => {
505-
this.props.closeAllModals();
506-
this.setState({
507-
remoteDownloadPathSelect: true,
508-
});
509-
};
510-
511426
onClose = () => {
512427
this.setState({
513428
newFolderName: "",
@@ -517,9 +432,7 @@ class ModalsCompoment extends Component {
517432
selectedPathName: "",
518433
secretShare: false,
519434
sharePwd: "",
520-
downloadURL: "",
521435
shareUrl: "",
522-
remoteDownloadPathSelect: false,
523436
});
524437
this.newNameSuffix = "";
525438
this.props.closeAllModals();
@@ -848,150 +761,14 @@ class ModalsCompoment extends Component {
848761
setModalsLoading={this.props.setModalsLoading}
849762
selected={this.props.selected}
850763
/>
851-
<Dialog
764+
<RemoteDownload
852765
open={this.props.modalsStatus.remoteDownload}
853766
onClose={this.onClose}
854-
aria-labelledby="form-dialog-title"
855-
fullWidth
856-
>
857-
<DialogTitle id="form-dialog-title">
858-
{t("modals.newRemoteDownloadTitle")}
859-
</DialogTitle>
860-
861-
<DialogContent>
862-
<DialogContentText>
863-
<TextField
864-
label={t("modals.remoteDownloadURL")}
865-
autoFocus
866-
fullWidth
867-
multiline
868-
id="downloadURL"
869-
onChange={this.handleInputChange}
870-
placeholder={t(
871-
"modals.remoteDownloadURLDescription"
872-
)}
873-
/>
874-
</DialogContentText>
875-
</DialogContent>
876-
<DialogActions>
877-
<Button onClick={this.onClose}>
878-
{t("cancel", { ns: "common" })}
879-
</Button>
880-
<Button
881-
onClick={this.remoteDownloadNext}
882-
color="primary"
883-
disabled={
884-
this.props.modalsLoading ||
885-
this.state.downloadURL === ""
886-
}
887-
>
888-
{t("ok", { ns: "common" })}
889-
</Button>
890-
</DialogActions>
891-
</Dialog>
892-
<Dialog
893-
open={this.state.remoteDownloadPathSelect}
894-
onClose={this.onClose}
895-
aria-labelledby="form-dialog-title"
896-
>
897-
<DialogTitle id="form-dialog-title">
898-
{t("modals.remoteDownloadDst")}
899-
</DialogTitle>
900-
<PathSelector
901-
presentPath={this.props.path}
902-
selected={this.props.selected}
903-
onSelect={this.setMoveTarget}
904-
/>
905-
906-
{this.state.selectedPath !== "" && (
907-
<DialogContent className={classes.contentFix}>
908-
<DialogContentText>
909-
<Trans
910-
i18nKey="modals.downloadTo"
911-
values={{
912-
name: this.state.selectedPathName,
913-
}}
914-
components={[<strong key={0} />]}
915-
/>
916-
</DialogContentText>
917-
</DialogContent>
918-
)}
919-
<DialogActions>
920-
<Button onClick={this.onClose}>
921-
{t("cancel", { ns: "common" })}
922-
</Button>
923-
<div className={classes.wrapper}>
924-
<Button
925-
onClick={this.submitDownload}
926-
color="primary"
927-
disabled={
928-
this.state.selectedPath === "" ||
929-
this.props.modalsLoading
930-
}
931-
>
932-
{t("modals.createTask")}
933-
{this.props.modalsLoading && (
934-
<CircularProgress
935-
size={24}
936-
className={classes.buttonProgress}
937-
/>
938-
)}
939-
</Button>
940-
</div>
941-
</DialogActions>
942-
</Dialog>
943-
<Dialog
944-
open={this.props.modalsStatus.torrentDownload}
945-
onClose={this.onClose}
946-
aria-labelledby="form-dialog-title"
947-
>
948-
<DialogTitle id="form-dialog-title">
949-
{t("modals.remoteDownloadDst")}
950-
</DialogTitle>
951-
<PathSelector
952-
presentPath={this.props.path}
953-
selected={this.props.selected}
954-
onSelect={this.setMoveTarget}
955-
/>
956-
957-
{this.state.selectedPath !== "" && (
958-
<DialogContent className={classes.contentFix}>
959-
<DialogContentText>
960-
<Trans
961-
i18nKey="modals.downloadTo"
962-
values={{
963-
name: this.state.selectedPathName,
964-
}}
965-
components={[<strong key={0} />]}
966-
/>
967-
</DialogContentText>
968-
</DialogContent>
969-
)}
970-
<DialogActions>
971-
<Button onClick={this.onClose}>
972-
{t("cancel", { ns: "common" })}
973-
</Button>
974-
<div className={classes.wrapper}>
975-
<Button
976-
onClick={this.submitTorrentDownload}
977-
color="primary"
978-
disabled={
979-
this.state.selectedPath === "" ||
980-
this.props.modalsLoading
981-
}
982-
>
983-
{t("modals.createTask")}
984-
{this.props.modalsLoading && (
985-
<CircularProgress
986-
size={24}
987-
className={classes.buttonProgress}
988-
/>
989-
)}
990-
</Button>
991-
</div>
992-
</DialogActions>
993-
</Dialog>
994-
767+
modalsLoading={this.props.modalsLoading}
768+
setModalsLoading={this.props.setModalsLoading}
769+
presentPath={this.props.path}
770+
torrent={this.props.modalsStatus.remoteDownloadTorrent}
771+
/>
995772
<DecompressDialog
996773
open={this.props.modalsStatus.decompress}
997774
onClose={this.onClose}

0 commit comments

Comments
 (0)