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

MOBILE-4470 icon: Fix problem when changing the icon to be loaded

main
Pau Ferrer Ocaña 2024-05-07 10:33:17 +02:00
parent a8b250b6e0
commit c5482863b0
2 changed files with 18 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/core/components/mod-icon/mod-icon.html
View File

@ -1,5 +1,6 @@
<ng-container *ngIf="loaded">
<ng-container *ngIf="loaded && !svgLoaded">
<img *ngIf="!isLocalUrl" [src]="iconUrl" core-external-content alt="" [component]="linkIconWithComponent ? modname : null"
[componentId]="linkIconWithComponent ? componentId : null" (error)="loadFallbackIcon()">
<img *ngIf="isLocalUrl" [src]="iconUrl" (error)="loadFallbackIcon()" alt="">
</ng-container>
<div [hidden]="!svgLoaded" #svg></div>

19
src/core/components/mod-icon/mod-icon.ts
View File

@ -13,7 +13,7 @@
// limitations under the License.
import { CoreConstants, ModPurpose } from '@/core/constants';
import { Component, ElementRef, HostBinding, Input, OnChanges, OnInit, SimpleChange } from '@angular/core';
import { Component, ElementRef, HostBinding, Input, OnChanges, OnInit, SimpleChange, ViewChild } from '@angular/core';
import { CoreCourse } from '@features/course/services/course';
import { CoreCourseModuleDelegate } from '@features/course/services/module-delegate';
import { CoreFile } from '@services/file';
@ -63,10 +63,13 @@ export class CoreModIconComponent implements OnInit, OnChanges {
return this.showAlt ? this.modNameTranslated : '';
}
@ViewChild('svg') svgElement!: ElementRef<HTMLElement>;
iconUrl = '';
modNameTranslated = '';
isLocalUrl = false;
svgLoaded = false;
linkIconWithComponent = false;
loaded = false;
@ -141,6 +144,10 @@ export class CoreModIconComponent implements OnInit, OnChanges {
this.iconUrl = CoreTextUtils.decodeHTMLEntities(this.iconUrl);
if (this.isBranded !== undefined) {
return;
}
// If it's an Moodle Theme icon, check if filtericon is set and use it.
if (this.iconUrl && CoreUrlUtils.isThemeImageUrl(this.iconUrl)) {
const filter = CoreUrlUtils.getThemeImageUrlParam(this.iconUrl, 'filtericon');
@ -296,6 +303,7 @@ export class CoreModIconComponent implements OnInit, OnChanges {
protected async setSVGIcon(): Promise<void> {
if (this.iconVersion === IconVersion.LEGACY_VERSION) {
this.loaded = true;
this.svgLoaded = false;
return;
}
@ -338,6 +346,8 @@ export class CoreModIconComponent implements OnInit, OnChanges {
}
if (mimetype !== 'image/svg+xml' || !fileContents) {
this.svgLoaded = false;
return;
}
@ -347,6 +357,8 @@ export class CoreModIconComponent implements OnInit, OnChanges {
// Safety check.
if (doc.documentElement.nodeName !== 'svg') {
this.svgLoaded = false;
return;
}
@ -384,9 +396,10 @@ export class CoreModIconComponent implements OnInit, OnChanges {
}
}
this.element.replaceChildren(doc.documentElement);
this.svgElement.nativeElement.replaceChildren(doc.documentElement);
this.svgLoaded = true;
} catch {
// Ignore errors.
this.svgLoaded = false;
} finally {
this.loaded = true;
}