diff options
author | Christopher Speller <crspeller@gmail.com> | 2015-09-24 10:17:58 -0400 |
---|---|---|
committer | Christopher Speller <crspeller@gmail.com> | 2015-09-24 10:58:56 -0400 |
commit | c5d78f828a48ba88b8a89a0564bcb8352e84b396 (patch) | |
tree | d70b911e611dd94f5a0f55944c2c14329e08a3c2 /web/react/components/file_attachment_list.jsx | |
parent | d5343f997d8d239f09a93a05d8affd8387bb46bc (diff) | |
download | chat-c5d78f828a48ba88b8a89a0564bcb8352e84b396.tar.gz chat-c5d78f828a48ba88b8a89a0564bcb8352e84b396.tar.bz2 chat-c5d78f828a48ba88b8a89a0564bcb8352e84b396.zip |
Converting preview image modal to use react-bootstrap. Fixes issue where modal would appear behind background on iOS
Diffstat (limited to 'web/react/components/file_attachment_list.jsx')
-rw-r--r-- | web/react/components/file_attachment_list.jsx | 16 |
1 files changed, 6 insertions, 10 deletions
diff --git a/web/react/components/file_attachment_list.jsx b/web/react/components/file_attachment_list.jsx index abe72089a..212d4a958 100644 --- a/web/react/components/file_attachment_list.jsx +++ b/web/react/components/file_attachment_list.jsx @@ -11,23 +11,21 @@ export default class FileAttachmentList extends React.Component { this.handleImageClick = this.handleImageClick.bind(this); - this.state = {startImgId: 0}; + this.state = {showPreviewModal: false, startImgId: 0}; } - handleImageClick(e) { - this.setState({startImgId: parseInt($(e.target.parentNode).attr('data-img-id'), 10)}); + handleImageClick(indexClicked) { + this.setState({showPreviewModal: true, startImgId: indexClicked}); } render() { var filenames = this.props.filenames; - var modalId = this.props.modalId; var postFiles = []; for (var i = 0; i < filenames.length && i < Constants.MAX_DISPLAY_FILES; i++) { postFiles.push( <FileAttachment - key={i} + key={'file_attachment_' + i} filename={filenames[i]} index={i} - modalId={modalId} handleImageClick={this.handleImageClick} /> ); @@ -39,9 +37,10 @@ export default class FileAttachmentList extends React.Component { {postFiles} </div> <ViewImageModal + show={this.state.showPreviewModal} + onModalDismissed={() => this.setState({showPreviewModal: false})} channelId={this.props.channelId} userId={this.props.userId} - modalId={modalId} startId={this.state.startImgId} filenames={filenames} /> @@ -55,9 +54,6 @@ FileAttachmentList.propTypes = { // a list of file pathes displayed by this filenames: React.PropTypes.arrayOf(React.PropTypes.string).isRequired, - // the identifier of the modal dialog used to preview files - modalId: React.PropTypes.string.isRequired, - // the channel that this is part of channelId: React.PropTypes.string, |