summaryrefslogtreecommitdiffstats
path: root/web/react/components/file_preview.jsx
diff options
context:
space:
mode:
Diffstat (limited to 'web/react/components/file_preview.jsx')
-rw-r--r--web/react/components/file_preview.jsx54
1 files changed, 54 insertions, 0 deletions
diff --git a/web/react/components/file_preview.jsx b/web/react/components/file_preview.jsx
new file mode 100644
index 000000000..99327c22f
--- /dev/null
+++ b/web/react/components/file_preview.jsx
@@ -0,0 +1,54 @@
+// Copyright (c) 2015 Spinpunch, Inc. All Rights Reserved.
+// See License.txt for license information.
+
+var UserStore = require('../stores/user_store.jsx');
+var ChannelStore = require('../stores/channel_store.jsx');
+var client = require('../utils/client.jsx');
+var utils = require('../utils/utils.jsx');
+var Constants = require('../utils/constants.jsx');
+
+module.exports = React.createClass({
+ handleRemove: function(e) {
+ var previewDiv = e.target.parentNode.parentNode;
+ this.props.onRemove(previewDiv.dataset.filename);
+ },
+ render: function() {
+ var previews = [];
+ this.props.files.forEach(function(filename) {
+
+ var filenameSplit = filename.split('.');
+ var ext = filenameSplit[filenameSplit.length-1];
+ var type = utils.getFileType(ext);
+
+ if (type === "image") {
+ previews.push(
+ <div key={filename} className="preview-div" data-filename={filename}>
+ <img className="preview-img" src={filename}/>
+ <a className="remove-preview" onClick={this.handleRemove}><i className="glyphicon glyphicon-remove"/></a>
+ </div>
+ );
+ } else {
+ previews.push(
+ <div key={filename} className="preview-div custom-file" data-filename={filename}>
+ <div className={"file-icon "+utils.getIconClassName(type)}/>
+ <a className="remove-preview" onClick={this.handleRemove}><i className="glyphicon glyphicon-remove"/></a>
+ </div>
+ );
+ }
+ }.bind(this));
+
+ for (var i = 0; i < this.props.uploadsInProgress; i++) {
+ previews.push(
+ <div className="preview-div">
+ <img className="spinner" src="/static/images/load.gif"/>
+ </div>
+ );
+ }
+
+ return (
+ <div className="preview-container">
+ {previews}
+ </div>
+ );
+ }
+});