diff options
Diffstat (limited to 'web/react/components/file_preview.jsx')
-rw-r--r-- | web/react/components/file_preview.jsx | 54 |
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> + ); + } +}); |