diff options
author | Harrison Healey <harrisonmhealey@gmail.com> | 2017-08-18 15:03:04 -0400 |
---|---|---|
committer | Christopher Speller <crspeller@gmail.com> | 2017-08-18 12:03:04 -0700 |
commit | 6df51f8617cb1a17dec0c49a6764c2ba1d7968c9 (patch) | |
tree | 7e1f0221e78e9bd79513ad8010f0d75a9ce340d8 /webapp/components/view_image.jsx | |
parent | 26ec8ffc3edc01fde2189f3465112c88fee5435b (diff) | |
download | chat-6df51f8617cb1a17dec0c49a6764c2ba1d7968c9.tar.gz chat-6df51f8617cb1a17dec0c49a6764c2ba1d7968c9.tar.bz2 chat-6df51f8617cb1a17dec0c49a6764c2ba1d7968c9.zip |
PLT-7397 Added loadImage function instead of Image.prototype.load (#7184)
Diffstat (limited to 'webapp/components/view_image.jsx')
-rw-r--r-- | webapp/components/view_image.jsx | 41 |
1 files changed, 26 insertions, 15 deletions
diff --git a/webapp/components/view_image.jsx b/webapp/components/view_image.jsx index 7872867f3..cc0bcee9d 100644 --- a/webapp/components/view_image.jsx +++ b/webapp/components/view_image.jsx @@ -134,28 +134,39 @@ export default class ViewImageModal extends React.Component { previewUrl = getFileUrl(fileInfo.id); } - const img = new Image(); - img.load( + Utils.loadImage( previewUrl, - () => { - const progress = this.state.progress; - progress[index] = img.completedPercentage; - this.setState({progress}); - } + () => this.handleImageLoaded(index), + (completedPercentage) => this.handleImageProgress(index, completedPercentage) ); - img.onload = () => { - const loaded = this.state.loaded; - loaded[index] = true; - this.setState({loaded}); - }; } else { // there's nothing to load for non-image files - var loaded = this.state.loaded; - loaded[index] = true; - this.setState({loaded}); + this.handleImageLoaded(index); } } + handleImageLoaded = (index) => { + this.setState((prevState) => { + return { + loaded: { + ...prevState.loaded, + [index]: true + } + }; + }); + } + + handleImageProgress = (index, completedPercentage) => { + this.setState((prevState) => { + return { + progress: { + ...prevState.progress, + [index]: completedPercentage + } + }; + }); + } + handleGetPublicLink() { this.props.onModalDismissed(); |