From 7112880ac051e8918162a17bd1fa9a7a1b68a46d Mon Sep 17 00:00:00 2001 From: Torjus Date: Thu, 26 Jul 2018 16:23:42 +0200 Subject: [PATCH] Automatically save file when downloaded --- app/lib/components/Chat/FileChatEntry.jsx | 78 +++++++++++++++++++++++ app/lib/components/Chat/FileSharing.jsx | 1 - app/lib/components/Chat/MessageList.jsx | 5 +- app/package-lock.json | 5 ++ app/package.json | 1 + 5 files changed, 86 insertions(+), 4 deletions(-) create mode 100644 app/lib/components/Chat/FileChatEntry.jsx diff --git a/app/lib/components/Chat/FileChatEntry.jsx b/app/lib/components/Chat/FileChatEntry.jsx new file mode 100644 index 0000000..121caa4 --- /dev/null +++ b/app/lib/components/Chat/FileChatEntry.jsx @@ -0,0 +1,78 @@ +import React, { Component, Fragment } from 'react'; +import WebTorrent from 'webtorrent'; +import { saveAs } from 'file-saver/FileSaver'; + +class FileChatEntry extends Component +{ + constructor(props) + { + super(props); + + this.client = new WebTorrent(); + } + + state = { + active: false, + numPeers: 0, + progress: 0 + }; + + download = () => + { + this.setState({ + active: true + }); + + this.client.add(this.props.message.file.magnet, (torrent) => + { + const onProgress = () => + { + this.setState({ + numPeers: torrent.numPeers, + progress: Math.round(torrent.progress * 100 * 100) / 100 + }); + }; + + setInterval(onProgress, 500); + onProgress(); + + torrent.on('done', () => { + onProgress(); + + torrent.files.forEach((file) => { + file.getBlob((err, blob) => { + if (err) + { + console.error('webtorrent error!!!'); + return; + } + + saveAs(blob); + }); + }); + }); + }); + } + + render() + { + return ( + +
+ + + {this.state.active && ( +
+ peers: {this.state.numPeers} + progress: {this.state.progress} +
+ )} +
+
+ ); + } +} + +export default FileChatEntry; \ No newline at end of file diff --git a/app/lib/components/Chat/FileSharing.jsx b/app/lib/components/Chat/FileSharing.jsx index 08142d7..650dfec 100644 --- a/app/lib/components/Chat/FileSharing.jsx +++ b/app/lib/components/Chat/FileSharing.jsx @@ -49,7 +49,6 @@ const mapDispatchToProps = (dispatch) => ({ notifyPeers: (file, displayName, picture) => { - console.log(file) dispatch(stateActions.addUserFile(file)); dispatch(requestActions.sendChatFile(file, displayName, picture)); } diff --git a/app/lib/components/Chat/MessageList.jsx b/app/lib/components/Chat/MessageList.jsx index 9c1f8d9..ed38979 100644 --- a/app/lib/components/Chat/MessageList.jsx +++ b/app/lib/components/Chat/MessageList.jsx @@ -2,6 +2,7 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import marked from 'marked'; import { connect } from 'react-redux'; +import FileChatEntry from './FileChatEntry'; const scrollToBottom = () => { @@ -73,9 +74,7 @@ class MessageList extends Component )} {message.type === 'file' && ( -
- {message.file.magnet} -
+ )} diff --git a/app/package-lock.json b/app/package-lock.json index 514c844..73e9b4b 100644 --- a/app/package-lock.json +++ b/app/package-lock.json @@ -4344,6 +4344,11 @@ "object-assign": "^4.0.1" } }, + "file-saver": { + "version": "1.3.8", + "resolved": "https://registry.npmjs.org/file-saver/-/file-saver-1.3.8.tgz", + "integrity": "sha512-spKHSBQIxxS81N/O21WmuXA2F6wppUCsutpzenOeZzOCCJ5gEfcbqJP983IrpLXzYmXnMUa6J03SubcNPdKrlg==" + }, "filename-regex": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz", diff --git a/app/package.json b/app/package.json index dfc9b8e..2a2dda2 100644 --- a/app/package.json +++ b/app/package.json @@ -12,6 +12,7 @@ "debug": "^3.1.0", "domready": "^1.0.8", "drag-drop": "^4.2.0", + "file-saver": "^1.3.8", "fscreen": "^1.0.2", "hark": "^1.2.2", "js-cookie": "^2.2.0",