diff options
author | Florian Orben <florian.orben@gmail.com> | 2015-10-20 20:42:02 +0200 |
---|---|---|
committer | Florian Orben <florian.orben@gmail.com> | 2015-10-21 18:13:59 +0200 |
commit | b00697a5009b30eea7e34f340dfdf6b691c4087b (patch) | |
tree | 5566c63566ae09065b107955ba5c8c02cd8e8f12 /web/react | |
parent | 62a32f71875465f045b89486e234eb282975858a (diff) | |
download | chat-b00697a5009b30eea7e34f340dfdf6b691c4087b.tar.gz chat-b00697a5009b30eea7e34f340dfdf6b691c4087b.tar.bz2 chat-b00697a5009b30eea7e34f340dfdf6b691c4087b.zip |
apply portrait/landscape/quadrat format to playing gif to always display it in best possible way
Diffstat (limited to 'web/react')
-rw-r--r-- | web/react/components/file_attachment.jsx | 20 |
1 files changed, 17 insertions, 3 deletions
diff --git a/web/react/components/file_attachment.jsx b/web/react/components/file_attachment.jsx index a88731ca9..a6957b06b 100644 --- a/web/react/components/file_attachment.jsx +++ b/web/react/components/file_attachment.jsx @@ -15,7 +15,7 @@ export default class FileAttachment extends React.Component { this.addBackgroundImage = this.addBackgroundImage.bind(this); this.canSetState = false; - this.state = {fileSize: -1, mime: '', playing: false, loading: false}; + this.state = {fileSize: -1, mime: '', playing: false, loading: false, format: ''}; } componentDidMount() { this.loadFiles(); @@ -93,7 +93,21 @@ export default class FileAttachment extends React.Component { this.setState({loading: true}); img.load(fileUrl); img.onload = () => { - this.setState({playing: true, loading: false}); + var state = {playing: true, loading: false}; + + switch (true) { + case img.width > img.height: + state.format = 'landscape'; + break; + case img.height > img.width: + state.format = 'portrait'; + break; + default: + state.format = 'quadrat'; + break; + } + + this.setState(state); // keep displaying background image for a short moment while browser is // loading gif, to prevent white background flashing through @@ -164,7 +178,7 @@ export default class FileAttachment extends React.Component { if (this.state.playing) { loadedFile = ( <img - className='file__loaded' + className={'file__loaded ' + this.state.format} src={fileUrl} /> ); |