Merge pull request #4150 from crazyserver/MOBILE-4616

Mobile 4616

Author: dpalou

.github/workflows/testing.yml

@@ -69,7 +69,7 @@ jobs:
         cat circular-dependencies
         lines=$(cat circular-dependencies | wc -l)
         echo "Total circular dependencies: $lines"
-        test $lines -eq 131
+        test $lines -eq 130
     - name: JavaScript code compatibility
       run: |
         npx check-es-compat www/*.js --polyfills="\{Array,String,TypedArray\}.prototype.at,Object.hasOwn"

src/addons/block/myoverview/components/myoverview/myoverview.ts

@@ -29,7 +29,7 @@ import { CoreBlockBaseComponent } from '@features/block/classes/base-block-compo
 import { CoreSite } from '@classes/sites/site';
 import { CoreUtils } from '@services/utils/utils';
 import { CoreDomUtils } from '@services/utils/dom';
-import { CoreTextUtils } from '@services/utils/text';
+import { CoreText } from '@singletons/text';
 import { AddonCourseCompletion } from '@addons/coursecompletion/services/coursecompletion';
 import { IonSearchbar } from '@ionic/angular';
 import { CoreNavigator } from '@services/navigator';
@@ -375,7 +375,7 @@ export class AddonBlockMyOverviewComponent extends CoreBlockBaseComponent implem
         this.filters.show.custom = config?.displaygroupingcustomfield?.value == '1' && !!config?.customfieldsexport?.value;
 
         this.filters.customFilters = this.filters.show.custom
-            ? CoreTextUtils.parseJSON(config?.customfieldsexport?.value || '[]', [])
+            ? CoreText.parseJSON(config?.customfieldsexport?.value || '[]', [])
             : [];
 
         // Check if any selector is shown and not disabled.

src/addons/block/recentlyaccesseditems/components/recentlyaccesseditems/recentlyaccesseditems.ts

@@ -19,7 +19,7 @@ import {
     AddonBlockRecentlyAccessedItems,
     AddonBlockRecentlyAccessedItemsItemCalculatedData,
 } from '../../services/recentlyaccesseditems';
-import { CoreTextUtils } from '@services/utils/text';
+import { CoreText } from '@singletons/text';
 import { CoreLoadings } from '@services/loadings';
 import { CoreUtils } from '@services/utils/utils';
 import { CoreSharedModule } from '@/core/shared.module';
@@ -92,7 +92,7 @@ export class AddonBlockRecentlyAccessedItemsComponent extends CoreBlockBaseCompo
         e.preventDefault();
         e.stopPropagation();
 
-        const url = CoreTextUtils.decodeHTMLEntities(item.viewurl);
+        const url = CoreText.decodeHTMLEntities(item.viewurl);
         const modal = await CoreLoadings.show();
 
         try {

src/addons/block/timeline/components/events/events.ts

@@ -15,7 +15,7 @@
 import { Component, Input, Output, EventEmitter, OnInit } from '@angular/core';
 import { CoreSites } from '@services/sites';
 import { CoreLoadings } from '@services/loadings';
-import { CoreTextUtils } from '@services/utils/text';
+import { CoreText } from '@singletons/text';
 import { CoreEnrolledCourseDataWithOptions } from '@features/courses/services/courses-helper';
 import { AddonBlockTimelineDayEvents } from '@addons/block/timeline/classes/section';
 import { CoreSharedModule } from '@/core/shared.module';
@@ -64,7 +64,7 @@ export class AddonBlockTimelineEventsComponent implements OnInit {
         event.stopPropagation();
 
         // Fix URL format.
-        url = CoreTextUtils.decodeHTMLEntities(url);
+        url = CoreText.decodeHTMLEntities(url);
 
         const modal = await CoreLoadings.show();
 

src/addons/blog/pages/index/index.ts

@@ -24,7 +24,7 @@ import { CoreAnalytics, CoreAnalyticsEventType } from '@services/analytics';
 import { CoreNavigator } from '@services/navigator';
 import { CoreSites, CoreSitesReadingStrategy } from '@services/sites';
 import { CoreDomUtils } from '@services/utils/dom';
-import { CoreTextUtils } from '@services/utils/text';
+import { CoreFileHelper } from '@services/file-helper';
 import { CoreUrl } from '@singletons/url';
 import { CoreUtils } from '@services/utils/utils';
 import { CoreArray } from '@singletons/array';
@@ -212,7 +212,7 @@ export class AddonBlogIndexPage implements OnInit, OnDestroy {
                     entry.contextInstanceId = entry.userid;
                 }
 
-                entry.summary = CoreTextUtils.replacePluginfileUrls(entry.summary, entry.summaryfiles || []);
+                entry.summary = CoreFileHelper.replacePluginfileUrls(entry.summary, entry.summaryfiles || []);
 
                 entry.user = await CoreUtils.ignoreErrors(CoreUser.getProfile(entry.userid, entry.courseid, true));
             });

src/addons/calendar/pages/event/event.ts

@@ -25,7 +25,7 @@ import { AddonCalendarSync, AddonCalendarSyncEvents, AddonCalendarSyncProvider }
 import { CoreNetwork } from '@services/network';
 import { CoreEventObserver, CoreEvents } from '@singletons/events';
 import { CoreDomUtils } from '@services/utils/dom';
-import { CoreTextUtils } from '@services/utils/text';
+import { CoreText } from '@singletons/text';
 import { CoreSites } from '@services/sites';
 import { CoreCourse } from '@features/course/services/course';
 import { CoreTimeUtils } from '@services/utils/time';
@@ -45,6 +45,7 @@ import { CoreConfig } from '@services/config';
 import { CoreToasts, ToastDuration } from '@services/toasts';
 import { CorePopovers } from '@services/popovers';
 import { CoreLoadings } from '@services/loadings';
+import { CoreUrl } from '@singletons/url';
 
 /**
  * Page that displays a single calendar event.
@@ -288,8 +289,8 @@ export class AddonCalendarEventPage implements OnInit, OnDestroy {
 
             if (this.event.location) {
                 // Build a link to open the address in maps.
-                this.event.location = CoreTextUtils.decodeHTML(this.event.location);
-                this.event.encodedLocation = CoreTextUtils.buildAddressURL(this.event.location);
+                this.event.location = CoreText.decodeHTML(this.event.location);
+                this.event.encodedLocation = CoreUrl.buildAddressURL(this.event.location);
             }
 
             // Check if event was deleted in offine.

src/addons/calendar/services/calendar.ts

@@ -16,7 +16,7 @@ import { Injectable } from '@angular/core';
 import { CoreSites } from '@services/sites';
 import { CoreSite } from '@classes/sites/site';
 import { CoreNetwork } from '@services/network';
-import { CoreTextUtils } from '@services/utils/text';
+import { CoreText } from '@singletons/text';
 import { CoreTimeUtils } from '@services/utils/time';
 import { CoreUrl } from '@singletons/url';
 import { CoreUtils } from '@services/utils/utils';
@@ -330,7 +330,7 @@ export class AddonCalendarProvider {
     ): Promise<string> {
 
         const getTimeHtml = (time: string, a11yLangKey: string): string =>
-            `<span aria-label="${Translate.instant(a11yLangKey, { $a: CoreTextUtils.cleanTags(time) })}">${time}</span>`;
+            `<span aria-label="${Translate.instant(a11yLangKey, { $a: CoreText.cleanTags(time) })}">${time}</span>`;
         const getStartTimeHtml = (time: string): string => getTimeHtml(time, 'core.startingtime');
         const getEndTimeHtml = (time: string): string => getTimeHtml(time, 'core.endingtime');
 
@@ -666,18 +666,18 @@ export class AddonCalendarProvider {
         eventConverted.iscategoryevent = originalEvent.eventtype == AddonCalendarEventType.CATEGORY;
         eventConverted.normalisedeventtype = this.getEventType(recordAsRecord);
         try {
-            eventConverted.category = CoreTextUtils.parseJSON(recordAsRecord.category || '');
+            eventConverted.category = CoreText.parseJSON(recordAsRecord.category || '');
         } catch {
             // Ignore errors.
         }
 
         try {
-            eventConverted.course = CoreTextUtils.parseJSON(recordAsRecord.course || '');
+            eventConverted.course = CoreText.parseJSON(recordAsRecord.course || '');
         } catch {
             // Ignore errors.
         }
         try {
-            eventConverted.subscription = CoreTextUtils.parseJSON(recordAsRecord.subscription || '');
+            eventConverted.subscription = CoreText.parseJSON(recordAsRecord.subscription || '');
         } catch {
             // Ignore errors.
         }

src/addons/filter/displayh5p/services/handlers/displayh5p.ts

@@ -20,6 +20,7 @@ import { makeSingleton } from '@singletons';
 import { CoreH5PPlayerComponent } from '@features/h5p/components/h5p-player/h5p-player';
 import { CoreUrl } from '@singletons/url';
 import { CoreH5PHelper } from '@features/h5p/classes/helper';
+import { CoreText } from '@singletons/text';
 
 /**
  * Handler to support the Display H5P filter.
@@ -30,47 +31,45 @@ export class AddonFilterDisplayH5PHandlerService extends CoreFilterDefaultHandle
     name = 'AddonFilterDisplayH5PHandler';
     filterName = 'displayh5p';
 
-    protected template = document.createElement('template'); // A template element to convert HTML to element.
-
     /**
      * @inheritdoc
      */
     filter(
         text: string,
     ): string | Promise<string> {
-        this.template.innerHTML = text;
-
-        const h5pIframes = <HTMLIFrameElement[]> Array.from(this.template.content.querySelectorAll('iframe.h5p-iframe'));
-
-        // Replace all iframes with an empty div that will be treated in handleHtml.
-        h5pIframes.forEach((iframe) => {
-            const placeholder = document.createElement('div');
-
-            placeholder.classList.add('core-h5p-tmp-placeholder');
-            placeholder.setAttribute('data-player-src', iframe.src);
-
-            iframe.parentElement?.replaceChild(placeholder, iframe);
+        return CoreText.processHTML(text, (element) => {
+            const h5pIframes = <HTMLIFrameElement[]> Array.from(element.querySelectorAll('iframe.h5p-iframe'));
+
+            // Replace all iframes with an empty div that will be treated in handleHtml.
+            h5pIframes.forEach((iframe) => {
+                const placeholder = document.createElement('div');
+
+                placeholder.classList.add('core-h5p-tmp-placeholder');
+                placeholder.setAttribute('data-player-src', iframe.src);
+
+                iframe.parentElement?.replaceChild(placeholder, iframe);
+            });
+
+            // Handle H5P iframes embedded using the embed HTML code.
+            const embeddedH5PIframes = <HTMLIFrameElement[]> Array.from(
+                element.querySelectorAll('iframe.h5p-player'),
+            );
+
+            embeddedH5PIframes.forEach((iframe) => {
+                // Add the preventredirect param to allow authenticating if auto-login fails.
+                iframe.src = CoreUrl.addParamsToUrl(iframe.src, { preventredirect: false });
+
+                // Add resizer script so the H5P has the right height.
+                CoreH5PHelper.addResizerScript();
+
+                // If the iframe has a small height, add some minimum initial height so it's seen if auto-login fails.
+                const styleHeight = Number(iframe.style.height);
+                const height = Number(iframe.getAttribute('height'));
+                if ((!height || height < 400) && (!styleHeight || styleHeight < 400)) {
+                    iframe.style.height = '400px';
+                }
+            });
         });
-
-        // Handle H5P iframes embedded using the embed HTML code.
-        const embeddedH5PIframes = <HTMLIFrameElement[]> Array.from(this.template.content.querySelectorAll('iframe.h5p-player'));
-
-        embeddedH5PIframes.forEach((iframe) => {
-            // Add the preventredirect param to allow authenticating if auto-login fails.
-            iframe.src = CoreUrl.addParamsToUrl(iframe.src, { preventredirect: false });
-
-            // Add resizer script so the H5P has the right height.
-            CoreH5PHelper.addResizerScript();
-
-            // If the iframe has a small height, add some minimum initial height so it's seen if auto-login fails.
-            const styleHeight = Number(iframe.style.height);
-            const height = Number(iframe.getAttribute('height'));
-            if ((!height || height < 400) && (!styleHeight || styleHeight < 400)) {
-                iframe.style.height = '400px';
-            }
-        });
-
-        return this.template.innerHTML;
     }
 
     /**

src/addons/filter/mathjaxloader/services/handlers/mathjaxloader.ts

@@ -18,7 +18,7 @@ import { CoreFilterDefaultHandler } from '@features/filter/services/handlers/def
 import { CoreFilterFilter, CoreFilterFormatTextOptions } from '@features/filter/services/filter';
 import { CoreLang } from '@services/lang';
 import { CoreSites } from '@services/sites';
-import { CoreTextUtils } from '@services/utils/text';
+import { CoreText } from '@singletons/text';
 import { CoreUtils } from '@services/utils/utils';
 import { CoreEvents } from '@singletons/events';
 import { CoreSite } from '@classes/sites/site';
@@ -189,7 +189,7 @@ export class AddonFilterMathJaxLoaderHandlerService extends CoreFilterDefaultHan
      * @returns The whole text with the span inserted around the defined substring.
      */
     protected insertSpan(text: string, start: number, end: number): string {
-        return CoreTextUtils.substrReplace(
+        return CoreText.substrReplace(
             text,
             '<span class="nolink">' + text.substring(start, end + 1) + '</span>',
             start,

src/addons/filter/mediaplugin/services/handlers/mediaplugin.ts

@@ -12,6 +12,7 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
+import { CoreText } from '@singletons/text';
 import { AddonFilterMediaPluginVideoJS } from '@addons/filter/mediaplugin/services/videojs';
 import { Injectable } from '@angular/core';
 
@@ -28,21 +29,17 @@ export class AddonFilterMediaPluginHandlerService extends CoreFilterDefaultHandl
     name = 'AddonFilterMediaPluginHandler';
     filterName = 'mediaplugin';
 
-    protected template = document.createElement('template'); // A template element to convert HTML to element.
-
     /**
      * @inheritdoc
      */
     filter(text: string): string | Promise<string> {
-        this.template.innerHTML = text;
-
-        const videos = Array.from(this.template.content.querySelectorAll('video'));
+        return CoreText.processHTML(text, (element) => {
+            const videos = Array.from(element.querySelectorAll('video'));
 
-        videos.forEach((video) => {
-            AddonFilterMediaPluginVideoJS.treatYoutubeVideos(video);
+            videos.forEach((video) => {
+                AddonFilterMediaPluginVideoJS.treatYoutubeVideos(video);
+            });
         });
-
-        return this.template.innerHTML;
     }
 
     /**