diff options
Diffstat (limited to 'web/react/components')
-rw-r--r-- | web/react/components/channel_invite_modal.jsx | 31 | ||||
-rw-r--r-- | web/react/components/channel_members_modal.jsx | 49 | ||||
-rw-r--r-- | web/react/components/create_comment.jsx | 7 | ||||
-rw-r--r-- | web/react/components/create_post.jsx | 7 | ||||
-rw-r--r-- | web/react/components/file_upload.jsx | 46 |
5 files changed, 96 insertions, 44 deletions
diff --git a/web/react/components/channel_invite_modal.jsx b/web/react/components/channel_invite_modal.jsx index 7dac39942..8b7485e5f 100644 --- a/web/react/components/channel_invite_modal.jsx +++ b/web/react/components/channel_invite_modal.jsx @@ -20,9 +20,14 @@ export default class ChannelInviteModal extends React.Component { this.onListenerChange = this.onListenerChange.bind(this); this.handleInvite = this.handleInvite.bind(this); - this.state = this.getStateFromStores(); + // the state gets populated when the modal is shown + this.state = {}; } shouldComponentUpdate(nextProps, nextState) { + if (!this.props.show && !nextProps.show) { + return false; + } + if (!Utils.areObjectsEqual(this.props, nextProps)) { return true; } @@ -34,13 +39,25 @@ export default class ChannelInviteModal extends React.Component { return false; } getStateFromStores() { - function getId(user) { - return user.id; + const users = UserStore.getActiveOnlyProfiles(); + + if ($.isEmptyObject(users)) { + return { + loading: true + }; + } + + // make sure we have all members of this channel before rendering + const extraInfo = ChannelStore.getCurrentExtraInfo(); + if (extraInfo.member_count !== extraInfo.members.length) { + AsyncClient.getChannelExtraInfo(this.props.channel.id, -1); + + return { + loading: true + }; } - var users = UserStore.getActiveOnlyProfiles(); - var memberIds = ChannelStore.getCurrentExtraInfo().members.map(getId); - var loading = $.isEmptyObject(users); + const memberIds = extraInfo.members.map((user) => user.id); var nonmembers = []; for (var id in users) { @@ -55,7 +72,7 @@ export default class ChannelInviteModal extends React.Component { return { nonmembers, - loading + loading: false }; } onShow() { diff --git a/web/react/components/channel_members_modal.jsx b/web/react/components/channel_members_modal.jsx index d1b9df988..513a720e7 100644 --- a/web/react/components/channel_members_modal.jsx +++ b/web/react/components/channel_members_modal.jsx @@ -1,6 +1,7 @@ // Copyright (c) 2015 Mattermost, Inc. All Rights Reserved. // See License.txt for license information. +import LoadingScreen from './loading_screen.jsx'; import MemberList from './member_list.jsx'; import ChannelInviteModal from './channel_invite_modal.jsx'; @@ -21,9 +22,10 @@ export default class ChannelMembersModal extends React.Component { this.onChange = this.onChange.bind(this); this.handleRemove = this.handleRemove.bind(this); - const state = this.getStateFromStores(); - state.showInviteModal = false; - this.state = state; + // the rest of the state gets populated when the modal is shown + this.state = { + showInviteModal: false + }; } shouldComponentUpdate(nextProps, nextState) { if (!Utils.areObjectsEqual(this.props, nextProps)) { @@ -37,8 +39,18 @@ export default class ChannelMembersModal extends React.Component { return false; } getStateFromStores() { + const extraInfo = ChannelStore.getCurrentExtraInfo(); + + if (extraInfo.member_count !== extraInfo.members.length) { + AsyncClient.getChannelExtraInfo(this.props.channel.id, -1); + + return { + loading: true + }; + } + const users = UserStore.getActiveOnlyProfiles(); - const memberList = ChannelStore.getCurrentExtraInfo().members; + const memberList = extraInfo.members; const nonmemberList = []; for (const id in users) { @@ -71,14 +83,14 @@ export default class ChannelMembersModal extends React.Component { return { nonmemberList, - memberList + memberList, + loading: false }; } onShow() { if ($(window).width() > 768) { $(ReactDOM.findDOMNode(this.refs.modalBody)).perfectScrollbar(); } - this.onChange(); } componentDidUpdate(prevProps) { if (this.props.show && !prevProps.show) { @@ -89,6 +101,8 @@ export default class ChannelMembersModal extends React.Component { if (!this.props.show && nextProps.show) { ChannelStore.addExtraInfoChangeListener(this.onChange); ChannelStore.addChangeListener(this.onChange); + + this.onChange(); } else if (this.props.show && !nextProps.show) { ChannelStore.removeExtraInfoChangeListener(this.onChange); ChannelStore.removeChangeListener(this.onChange); @@ -154,6 +168,21 @@ export default class ChannelMembersModal extends React.Component { isAdmin = Utils.isAdmin(currentMember.roles) || Utils.isAdmin(UserStore.getCurrentUser().roles); } + let content; + if (this.state.loading) { + content = (<LoadingScreen />); + } else { + content = ( + <div className='team-member-list'> + <MemberList + memberList={this.state.memberList} + isAdmin={isAdmin} + handleRemove={this.handleRemove} + /> + </div> + ); + } + return ( <div> <Modal @@ -178,13 +207,7 @@ export default class ChannelMembersModal extends React.Component { ref='modalBody' style={{maxHeight}} > - <div className='team-member-list'> - <MemberList - memberList={this.state.memberList} - isAdmin={isAdmin} - handleRemove={this.handleRemove} - /> - </div> + {content} </Modal.Body> <Modal.Footer> <button diff --git a/web/react/components/create_comment.jsx b/web/react/components/create_comment.jsx index c190b4dd8..cae94429c 100644 --- a/web/react/components/create_comment.jsx +++ b/web/react/components/create_comment.jsx @@ -32,7 +32,6 @@ export default class CreateComment extends React.Component { this.handleUploadStart = this.handleUploadStart.bind(this); this.handleFileUploadComplete = this.handleFileUploadComplete.bind(this); this.handleUploadError = this.handleUploadError.bind(this); - this.handleTextDrop = this.handleTextDrop.bind(this); this.removePreview = this.removePreview.bind(this); this.getFileCount = this.getFileCount.bind(this); this.handleResize = this.handleResize.bind(this); @@ -239,11 +238,6 @@ export default class CreateComment extends React.Component { this.setState({uploadsInProgress: draft.uploadsInProgress, serverError: err}); } } - handleTextDrop(text) { - const newText = this.state.messageText + text; - this.handleUserInput(newText); - Utils.setCaretPosition(ReactDOM.findDOMNode(this.refs.textbox.refs.message), newText.length); - } removePreview(id) { let previews = this.state.previews; let uploadsInProgress = this.state.uploadsInProgress; @@ -344,7 +338,6 @@ export default class CreateComment extends React.Component { onUploadStart={this.handleUploadStart} onFileUpload={this.handleFileUploadComplete} onUploadError={this.handleUploadError} - onTextDrop={this.handleTextDrop} postType='comment' channelId={this.props.channelId} /> diff --git a/web/react/components/create_post.jsx b/web/react/components/create_post.jsx index e901b272a..a476863a3 100644 --- a/web/react/components/create_post.jsx +++ b/web/react/components/create_post.jsx @@ -40,7 +40,6 @@ export default class CreatePost extends React.Component { this.handleUploadStart = this.handleUploadStart.bind(this); this.handleFileUploadComplete = this.handleFileUploadComplete.bind(this); this.handleUploadError = this.handleUploadError.bind(this); - this.handleTextDrop = this.handleTextDrop.bind(this); this.removePreview = this.removePreview.bind(this); this.onChange = this.onChange.bind(this); this.onPreferenceChange = this.onPreferenceChange.bind(this); @@ -281,11 +280,6 @@ export default class CreatePost extends React.Component { this.setState({uploadsInProgress: draft.uploadsInProgress, serverError: message}); } } - handleTextDrop(text) { - const newText = this.state.messageText + text; - this.handleUserInput(newText); - Utils.setCaretPosition(ReactDOM.findDOMNode(this.refs.textbox.refs.message), newText.length); - } removePreview(id) { const previews = Object.assign([], this.state.previews); const uploadsInProgress = this.state.uploadsInProgress; @@ -462,7 +456,6 @@ export default class CreatePost extends React.Component { onUploadStart={this.handleUploadStart} onFileUpload={this.handleFileUploadComplete} onUploadError={this.handleUploadError} - onTextDrop={this.handleTextDrop} postType='post' channelId='' /> diff --git a/web/react/components/file_upload.jsx b/web/react/components/file_upload.jsx index 9316ca9a5..a0c930ffb 100644 --- a/web/react/components/file_upload.jsx +++ b/web/react/components/file_upload.jsx @@ -109,8 +109,6 @@ export default class FileUpload extends React.Component { if (typeof files !== 'string' && files.length) { this.uploadFiles(files); - } else { - this.props.onTextDrop(e.originalEvent.dataTransfer.getData('Text')); } } @@ -120,11 +118,19 @@ export default class FileUpload extends React.Component { if (this.props.postType === 'post') { $('.row.main').dragster({ - enter() { - $('.center-file-overlay').removeClass('hidden'); + enter(dragsterEvent, e) { + var files = e.originalEvent.dataTransfer; + + if (utils.isFileTransfer(files)) { + $('.center-file-overlay').removeClass('hidden'); + } }, - leave() { - $('.center-file-overlay').addClass('hidden'); + leave(dragsterEvent, e) { + var files = e.originalEvent.dataTransfer; + + if (utils.isFileTransfer(files)) { + $('.center-file-overlay').addClass('hidden'); + } }, drop(dragsterEvent, e) { $('.center-file-overlay').addClass('hidden'); @@ -133,11 +139,19 @@ export default class FileUpload extends React.Component { }); } else if (this.props.postType === 'comment') { $('.post-right__container').dragster({ - enter() { - $('.right-file-overlay').removeClass('hidden'); + enter(dragsterEvent, e) { + var files = e.originalEvent.dataTransfer; + + if (utils.isFileTransfer(files)) { + $('.right-file-overlay').removeClass('hidden'); + } }, - leave() { - $('.right-file-overlay').addClass('hidden'); + leave(dragsterEvent, e) { + var files = e.originalEvent.dataTransfer; + + if (utils.isFileTransfer(files)) { + $('.right-file-overlay').addClass('hidden'); + } }, drop(dragsterEvent, e) { $('.right-file-overlay').addClass('hidden'); @@ -229,6 +243,18 @@ export default class FileUpload extends React.Component { }); } + componentWillUnmount() { + let target; + if (this.props.postType === 'post') { + target = $('.row.main'); + } else { + target = $('.post-right__container'); + } + + // jquery-dragster doesn't provide a function to unregister itself so do it manually + target.off('dragenter dragleave dragover drop dragster:enter dragster:leave dragster:over dragster:drop'); + } + cancelUpload(clientId) { var requests = this.state.requests; var request = requests[clientId]; |