diff options
Diffstat (limited to 'web/react')
-rw-r--r-- | web/react/components/file_upload.jsx | 33 | ||||
-rw-r--r-- | web/react/components/invite_member_modal.jsx | 2 | ||||
-rw-r--r-- | web/react/components/view_image.jsx | 57 | ||||
-rw-r--r-- | web/react/utils/constants.jsx | 2 |
4 files changed, 56 insertions, 38 deletions
diff --git a/web/react/components/file_upload.jsx b/web/react/components/file_upload.jsx index b90fa4fd3..c1fab669c 100644 --- a/web/react/components/file_upload.jsx +++ b/web/react/components/file_upload.jsx @@ -7,6 +7,13 @@ var ChannelStore = require('../stores/channel_store.jsx'); var utils = require('../utils/utils.jsx'); module.exports = React.createClass({ + displayName: 'FileUpload', + propTypes: { + onUploadError: React.PropTypes.func, + getFileCount: React.PropTypes.func, + onFileUpload: React.PropTypes.func, + onUploadStart: React.PropTypes.func + }, getInitialState: function() { return {requests: {}}; }, @@ -21,7 +28,7 @@ module.exports = React.createClass({ // This looks redundant, but must be done this way due to // setState being an asynchronous call var numFiles = 0; - for(var i = 0; i < files.length; i++) { + for (var i = 0; i < files.length; i++) { if (files[i].size <= Constants.MAX_FILE_SIZE) { numFiles++; } @@ -51,11 +58,11 @@ module.exports = React.createClass({ var request = client.uploadFile(formData, function(data) { var parsedData = $.parseJSON(data); - this.props.onFileUpload(parsedData['filenames'], parsedData['client_ids'], channelId); + this.props.onFileUpload(parsedData.filenames, parsedData.client_ids, channelId); var requests = this.state.requests; - for (var i = 0; i < parsedData['client_ids'].length; i++) { - delete requests[parsedData['client_ids'][i]]; + for (var i = 0; i < parsedData.client_ids.length; i++) { + delete requests[parsedData.client_ids[i]]; } this.setState({requests: requests}); }.bind(this), @@ -100,12 +107,9 @@ module.exports = React.createClass({ if (items) { for (var i = 0; i < items.length; i++) { if (items[i].type.indexOf('image') !== -1) { - var ext = items[i].type.split('/')[1].toLowerCase(); - if (ext === 'jpeg') { - ext = 'jpg'; - } + var testExt = items[i].type.split('/')[1].toLowerCase(); - if (Constants.IMAGE_TYPES.indexOf(ext) < 0) { + if (Constants.IMAGE_TYPES.indexOf(testExt) < 0) { continue; } @@ -113,7 +117,7 @@ module.exports = React.createClass({ } } - var numToUpload = Math.min(Constants.MAX_UPLOAD_FILES - self.props.getFileCount(channelId), numItems); + var numToUpload = Math.min(Constants.MAX_UPLOAD_FILES - self.props.getFileCount(ChannelStore.getCurrentId()), numItems); if (numItems > numToUpload) { self.props.onUploadError('Uploads limited to ' + Constants.MAX_UPLOAD_FILES + ' files maximum. Please use additional posts for more files.'); @@ -124,9 +128,6 @@ module.exports = React.createClass({ var file = items[i].getAsFile(); var ext = items[i].type.split('/')[1].toLowerCase(); - if (ext === 'jpeg') { - ext = 'jpg'; - } if (Constants.IMAGE_TYPES.indexOf(ext) < 0) { continue; @@ -161,11 +162,11 @@ module.exports = React.createClass({ var request = client.uploadFile(formData, function(data) { var parsedData = $.parseJSON(data); - self.props.onFileUpload(parsedData['filenames'], parsedData['client_ids'], channelId); + self.props.onFileUpload(parsedData.filenames, parsedData.client_ids, channelId); var requests = self.state.requests; - for (var i = 0; i < parsedData['client_ids'].length; i++) { - delete requests[parsedData['client_ids'][i]]; + for (var i = 0; i < parsedData.client_ids.length; i++) { + delete requests[parsedData.client_ids[i]]; } self.setState({requests: requests}); }, diff --git a/web/react/components/invite_member_modal.jsx b/web/react/components/invite_member_modal.jsx index 3eca79bae..75538c8fe 100644 --- a/web/react/components/invite_member_modal.jsx +++ b/web/react/components/invite_member_modal.jsx @@ -256,7 +256,7 @@ module.exports = React.createClass({ parent_id='invite_member' title='Discard Invitations?' message='You have unsent invitations, are you sure you want to discard them?' - confirm_button='Yes, Discard/' + confirm_button='Yes, Discard' /> </div> ); diff --git a/web/react/components/view_image.jsx b/web/react/components/view_image.jsx index dc85b53e5..2b7f64030 100644 --- a/web/react/components/view_image.jsx +++ b/web/react/components/view_image.jsx @@ -6,6 +6,13 @@ var utils = require('../utils/utils.jsx'); module.exports = React.createClass({ displayName: 'ViewImageModal', + propTypes: { + filenames: React.PropTypes.array, + modalId: React.PropTypes.string, + channelId: React.PropTypes.string, + userId: React.PropTypes.string, + startId: React.PropTypes.number + }, canSetState: false, handleNext: function() { var id = this.state.imgId + 1; @@ -56,8 +63,8 @@ module.exports = React.createClass({ progress[id] = img.completedPercentage; self.setState({progress: progress}); }); - img.onload = function(imgid) { - return function() { + img.onload = function onload(imgid) { + return function onloadReturn() { var loaded = self.state.loaded; loaded[imgid] = true; self.setState({loaded: loaded}); @@ -83,21 +90,21 @@ module.exports = React.createClass({ }, componentDidMount: function() { var self = this; - $('#' + this.props.modalId).on('shown.bs.modal', function() { + $('#' + this.props.modalId).on('shown.bs.modal', function onModalShow() { self.setState({viewed: true}); self.loadImage(self.state.imgId); }); - $(this.refs.modal.getDOMNode()).click(function(e) { + $(this.refs.modal.getDOMNode()).click(function onModalClick(e) { if (e.target === this || e.target === self.refs.imageBody.getDOMNode()) { $('.image_modal').modal('hide'); } }); $(this.refs.imageWrap.getDOMNode()).hover( - function() { + function onModalHover() { $(self.refs.imageFooter.getDOMNode()).addClass('footer--show'); - }, function() { + }, function offModalHover() { $(self.refs.imageFooter.getDOMNode()).removeClass('footer--show'); } ); @@ -117,10 +124,14 @@ module.exports = React.createClass({ data.user_id = this.props.userId; data.filename = this.props.filenames[this.state.imgId]; Client.getPublicLink(data, - function(serverData) { - window.open(serverData.public_link); + function sucess(serverData) { + if (utils.isMobile()) { + window.location.href = serverData.public_link; + } else { + window.open(serverData.public_link); + } }, - function() { + function error() { } ); }, @@ -145,7 +156,7 @@ module.exports = React.createClass({ getInitialState: function() { var loaded = []; var progress = []; - for (var i = 0; i < this.props.filenames.length; i ++) { + for (var i = 0; i < this.props.filenames.length; i++) { loaded.push(false); progress.push(0); } @@ -198,7 +209,7 @@ module.exports = React.createClass({ if (!(filename in this.state.fileSizes)) { var self = this; - utils.getFileSize(utils.getFileUrl(filename), function(fileSize) { + utils.getFileSize(utils.getFileUrl(filename), function fileSizeOp(fileSize) { if (self.canSetState) { var fileSizes = self.state.fileSizes; fileSizes[filename] = fileSize; @@ -210,14 +221,20 @@ module.exports = React.createClass({ } else { // display a progress indicator when the preview for an image is still loading var percentage = Math.floor(this.state.progress[this.state.imgId]); - content = ( - <div> - <img className='loader-image' src='/static/images/load.gif' /> - { percentage > 0 ? - <span className='loader-percent' >{'Previewing ' + percentage + '%'}</span> - : ''} - </div> - ); + if (percentage) { + content = ( + <div> + <img className='loader-image' src='/static/images/load.gif' /> + <span className='loader-percent' >{'Previewing ' + percentage + '%'}</span> + </div> + ); + } else { + content = ( + <div> + <img className='loader-image' src='/static/images/load.gif' /> + </div> + ); + } bgClass = 'black-bg'; } @@ -256,7 +273,7 @@ module.exports = React.createClass({ <div className='modal-close' data-dismiss='modal'></div> {content} <div ref='imageFooter' className='modal-button-bar'> - <span className='pull-left text'>{'Image ' + (this.state.imgId + 1) + ' of ' + this.props.filenames.length}</span> + <span className='pull-left text'>{'File ' + (this.state.imgId + 1) + ' of ' + this.props.filenames.length}</span> <div className='image-links'> {publicLink} <a href={fileUrl} download={name} className='text'>Download</a> diff --git a/web/react/utils/constants.jsx b/web/react/utils/constants.jsx index 19c92df33..0c714567a 100644 --- a/web/react/utils/constants.jsx +++ b/web/react/utils/constants.jsx @@ -39,7 +39,7 @@ module.exports = { }), SPECIAL_MENTIONS: ['all', 'channel'], CHARACTER_LIMIT: 4000, - IMAGE_TYPES: ['jpg', 'gif', 'bmp', 'png'], + IMAGE_TYPES: ['jpg', 'gif', 'bmp', 'png', 'jpeg'], AUDIO_TYPES: ['mp3', 'wav', 'wma', 'm4a', 'flac', 'aac'], VIDEO_TYPES: ['mp4', 'avi', 'webm', 'mkv', 'wmv', 'mpg', 'mov', 'flv'], SPREADSHEET_TYPES: ['ppt', 'pptx', 'csv'], |