EVOgeek/Vmeda.Online
1
0
Fork 1
Code Issues Pull Requests Packages Projects Releases Wiki Activity

MOBILE-3068 resource: Fix embedded image not displayed

Browse Source
This commit is contained in:
Dani Palou 2019-08-23 16:17:31 +02:00
parent 89a385b08b
commit 087e7ac246
2 changed files with 27 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
src/directives/external-content.ts
View File

@ -45,6 +45,7 @@ export class CoreExternalContentDirective implements AfterViewInit, OnChanges {
@Input() poster?: string;
@Output() onLoad = new EventEmitter(); // Emitted when content is loaded. Only for images.
loaded = false;
protected element: HTMLElement;
protected logger;
protected initialized = false;
@ -192,6 +193,10 @@ export class CoreExternalContentDirective implements AfterViewInit, OnChanges {
this.addSource(url);
}
if (tagName === 'IMG') {
this.waitForLoad();
}
return Promise.reject(null);
}
@ -227,13 +232,8 @@ export class CoreExternalContentDirective implements AfterViewInit, OnChanges {
this.addSource(finalUrl);
} else {
if (tagName === 'IMG') {
const listener = (): void => {
this.element.removeEventListener('load', listener);
this.element.removeEventListener('error', listener);
this.onLoad.emit();
};
this.element.addEventListener('load', listener);
this.element.addEventListener('error', listener);
this.loaded = false;
this.waitForLoad();
}
this.element.setAttribute(targetAttr, finalUrl);
this.element.setAttribute('data-original-' + targetAttr, url);
@ -299,4 +299,19 @@ export class CoreExternalContentDirective implements AfterViewInit, OnChanges {
this.element.setAttribute('style', inlineStyles);
});
}
/**
* Wait for the image to be loaded or error, and emit an event when it happens.
*/
protected waitForLoad(): void {
const listener = (): void => {
this.element.removeEventListener('load', listener);
this.element.removeEventListener('error', listener);
this.onLoad.emit();
this.loaded = true;
};
this.element.addEventListener('load', listener);
this.element.addEventListener('error', listener);
}
}

5
src/directives/format-text.ts
View File

@ -464,6 +464,11 @@ export class CoreFormatTextDirective implements OnChanges {
let promise: Promise<any> = null;
if (externalImages.length) {
promise = Promise.all(externalImages.map((externalImage) => {
if (externalImage.loaded) {
// Image has already been loaded, no need to wait.
return Promise.resolve();
}
return new Promise((resolve): void => {
const subscription = externalImage.onLoad.subscribe(() => {
subscription.unsubscribe();