fix: image width not being set properly (#143)
* Fix image width not being set properly Sometimes it got set to 0 because the original image wasn't loaded yet. * fix: eslint Co-authored-by: dicedtomato <35403473+diced@users.noreply.github.com>
This commit is contained in:
parent
181833d768
commit
74f3b3f13d
1 changed files with 8 additions and 8 deletions
|
@ -32,16 +32,16 @@ export default function EmbeddedImage({ image, user, pass }) {
|
|||
const updateImage = async (url?: string) => {
|
||||
const imageEl = document.getElementById('image_content') as HTMLImageElement;
|
||||
|
||||
const original = new Image;
|
||||
original.src = url || dataURL('/r');
|
||||
|
||||
const img = new Image();
|
||||
img.addEventListener('load', function() {
|
||||
if (this.naturalWidth > innerWidth) imageEl.width = Math.floor(this.naturalWidth * Math.min((innerHeight / this.naturalHeight), (innerWidth / this.naturalWidth)));
|
||||
else imageEl.width = this.naturalWidth;
|
||||
});
|
||||
|
||||
img.src = url || dataURL('/r');
|
||||
if (url) {
|
||||
imageEl.src = url;
|
||||
}
|
||||
|
||||
// Sometimes gives blank image on first load
|
||||
if (original.width > innerWidth) imageEl.width = Math.floor(original.width * Math.min((innerHeight / original.height), (innerWidth / original.width)));
|
||||
else imageEl.width = original.width;
|
||||
};
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
|
|
Loading…
Reference in a new issue