From 4e6b4a20ef6685ae74c08737f47f152d1adc5073 Mon Sep 17 00:00:00 2001 From: Shaun Walker Date: Sun, 14 Jun 2020 12:07:16 -0400 Subject: [PATCH] refactoring of #518 to simplify registration of scripts in modules and themes --- Oqtane.Client/Modules/Admin/Login/Index.razor | 3 +- .../Modules/Admin/ModuleDefinitions/Add.razor | 3 +- .../Admin/ModuleDefinitions/Index.razor | 5 +- Oqtane.Client/Modules/Admin/Themes/Add.razor | 3 +- .../Modules/Admin/Themes/Index.razor | 5 +- .../Modules/Admin/Upgrade/Index.razor | 5 +- .../Modules/Controls/FileManager.razor | 3 +- .../Modules/Controls/RichTextEditor.razor | 27 ++++----- Oqtane.Client/Modules/HtmlText/Edit.razor | 1 - Oqtane.Client/Modules/ModuleBase.cs | 22 +++++++- Oqtane.Client/Themes/ContainerBase.cs | 55 +------------------ Oqtane.Client/Themes/LayoutBase.cs | 18 +----- Oqtane.Client/Themes/ThemeBase.cs | 23 ++++++++ Oqtane.Client/Themes/ThemeControlBase.cs | 44 +-------------- Oqtane.Client/UI/Interop.cs | 55 +++++++------------ Oqtane.Client/UI/ThemeBuilder.razor | 15 +---- Oqtane.Server/wwwroot/js/interop.js | 26 ++++----- 17 files changed, 106 insertions(+), 207 deletions(-) diff --git a/Oqtane.Client/Modules/Admin/Login/Index.razor b/Oqtane.Client/Modules/Admin/Login/Index.razor index 106ee57fe..91248ec78 100644 --- a/Oqtane.Client/Modules/Admin/Login/Index.razor +++ b/Oqtane.Client/Modules/Admin/Login/Index.razor @@ -1,7 +1,6 @@ @namespace Oqtane.Modules.Admin.Login @inherits ModuleBase @inject NavigationManager NavigationManager -@inject IJSRuntime JsRuntime @inject IUserService UserService @inject IServiceProvider ServiceProvider @@ -96,7 +95,7 @@ { await logger.LogInformation("Login Successful For Username {Username}", _username); // complete the login on the server so that the cookies are set correctly on SignalR - var interop = new Interop(JsRuntime); + var interop = new Interop(JSRuntime); string antiforgerytoken = await interop.GetElementByName("__RequestVerificationToken"); var fields = new { __RequestVerificationToken = antiforgerytoken, username = _username, password = _password, remember = _remember, returnurl = _returnUrl }; await interop.SubmitForm($"/{PageState.Alias.AliasId}/pages/login/", fields); diff --git a/Oqtane.Client/Modules/Admin/ModuleDefinitions/Add.razor b/Oqtane.Client/Modules/Admin/ModuleDefinitions/Add.razor index 49ea702d7..4d13338e9 100644 --- a/Oqtane.Client/Modules/Admin/ModuleDefinitions/Add.razor +++ b/Oqtane.Client/Modules/Admin/ModuleDefinitions/Add.razor @@ -4,7 +4,6 @@ @inject IFileService FileService @inject IModuleDefinitionService ModuleDefinitionService @inject IPackageService PackageService -@inject IJSRuntime JsRuntime @if (_packages != null) { @@ -79,7 +78,7 @@ try { ShowProgressIndicator(); - var interop = new Interop(JsRuntime); + var interop = new Interop(JSRuntime); await interop.RedirectBrowser(NavigateUrl(), 3); await ModuleDefinitionService.InstallModuleDefinitionsAsync(); } diff --git a/Oqtane.Client/Modules/Admin/ModuleDefinitions/Index.razor b/Oqtane.Client/Modules/Admin/ModuleDefinitions/Index.razor index 3354ce5a0..88590d5e4 100644 --- a/Oqtane.Client/Modules/Admin/ModuleDefinitions/Index.razor +++ b/Oqtane.Client/Modules/Admin/ModuleDefinitions/Index.razor @@ -3,7 +3,6 @@ @inject NavigationManager NavigationManager @inject IModuleDefinitionService ModuleDefinitionService @inject IPackageService PackageService -@inject IJSRuntime JsRuntime @if (_moduleDefinitions == null) { @@ -86,7 +85,7 @@ else await PackageService.DownloadPackageAsync(moduledefinitionname, version, "Modules"); await logger.LogInformation("Module Downloaded {ModuleDefinitionName} {Version}", moduledefinitionname, version); ShowProgressIndicator(); - var interop = new Interop(JsRuntime); + var interop = new Interop(JSRuntime); await interop.RedirectBrowser(NavigateUrl(), 3); await ModuleDefinitionService.InstallModuleDefinitionsAsync(); } @@ -102,7 +101,7 @@ else try { ShowProgressIndicator(); - var interop = new Interop(JsRuntime); + var interop = new Interop(JSRuntime); await interop.RedirectBrowser(NavigateUrl(), 3); await ModuleDefinitionService.DeleteModuleDefinitionAsync(moduleDefinition.ModuleDefinitionId, moduleDefinition.SiteId); } diff --git a/Oqtane.Client/Modules/Admin/Themes/Add.razor b/Oqtane.Client/Modules/Admin/Themes/Add.razor index 4fc6b1556..327a7d3a1 100644 --- a/Oqtane.Client/Modules/Admin/Themes/Add.razor +++ b/Oqtane.Client/Modules/Admin/Themes/Add.razor @@ -4,7 +4,6 @@ @inject IFileService FileService @inject IThemeService ThemeService @inject IPackageService PackageService -@inject IJSRuntime JsRuntime @if (_packages != null) { @@ -79,7 +78,7 @@ try { ShowProgressIndicator(); - var interop = new Interop(JsRuntime); + var interop = new Interop(JSRuntime); await interop.RedirectBrowser(NavigateUrl(), 3); await ThemeService.InstallThemesAsync(); } diff --git a/Oqtane.Client/Modules/Admin/Themes/Index.razor b/Oqtane.Client/Modules/Admin/Themes/Index.razor index fcb8b7794..d2e6b2e98 100644 --- a/Oqtane.Client/Modules/Admin/Themes/Index.razor +++ b/Oqtane.Client/Modules/Admin/Themes/Index.razor @@ -4,7 +4,6 @@ @inject NavigationManager NavigationManager @inject IThemeService ThemeService @inject IPackageService PackageService -@inject IJSRuntime JsRuntime @if (_themes == null) { @@ -86,7 +85,7 @@ else await PackageService.DownloadPackageAsync(themename, version, "Themes"); await logger.LogInformation("Theme Downloaded {ThemeName} {Version}", themename, version); ShowProgressIndicator(); - var interop = new Interop(JsRuntime); + var interop = new Interop(JSRuntime); await interop.RedirectBrowser(NavigateUrl(), 3); await ThemeService.InstallThemesAsync(); } @@ -102,7 +101,7 @@ else try { ShowProgressIndicator(); - var interop = new Interop(JsRuntime); + var interop = new Interop(JSRuntime); await interop.RedirectBrowser(NavigateUrl(), 3); await ThemeService.DeleteThemeAsync(Theme.ThemeName); } diff --git a/Oqtane.Client/Modules/Admin/Upgrade/Index.razor b/Oqtane.Client/Modules/Admin/Upgrade/Index.razor index f26d21d79..5eba7cbdf 100644 --- a/Oqtane.Client/Modules/Admin/Upgrade/Index.razor +++ b/Oqtane.Client/Modules/Admin/Upgrade/Index.razor @@ -4,7 +4,6 @@ @inject IFileService FileService @inject IPackageService PackageService @inject IInstallationService InstallationService -@inject IJSRuntime JsRuntime @if (_package != null) { @@ -71,7 +70,7 @@ try { ShowProgressIndicator(); - var interop = new Interop(JsRuntime); + var interop = new Interop(JSRuntime); await interop.RedirectBrowser(NavigateUrl(), 3); await InstallationService.Upgrade(); } @@ -88,7 +87,7 @@ { await PackageService.DownloadPackageAsync(packageid, version, "Framework"); ShowProgressIndicator(); - var interop = new Interop(JsRuntime); + var interop = new Interop(JSRuntime); await interop.RedirectBrowser(NavigateUrl(), 3); await InstallationService.Upgrade(); } diff --git a/Oqtane.Client/Modules/Controls/FileManager.razor b/Oqtane.Client/Modules/Controls/FileManager.razor index 96196b062..bfeb0d571 100644 --- a/Oqtane.Client/Modules/Controls/FileManager.razor +++ b/Oqtane.Client/Modules/Controls/FileManager.razor @@ -4,7 +4,6 @@ @attribute [OqtaneIgnore] @inject IFolderService FolderService @inject IFileService FileService -@inject IJSRuntime JsRuntime @if (_folders != null) { @@ -258,7 +257,7 @@ private async Task UploadFile() { - var interop = new Interop(JsRuntime); + var interop = new Interop(JSRuntime); var upload = await interop.GetFiles(_fileinputid); if (upload.Length > 0) { diff --git a/Oqtane.Client/Modules/Controls/RichTextEditor.razor b/Oqtane.Client/Modules/Controls/RichTextEditor.razor index 6b15441c5..6a34e0f6c 100644 --- a/Oqtane.Client/Modules/Controls/RichTextEditor.razor +++ b/Oqtane.Client/Modules/Controls/RichTextEditor.razor @@ -1,7 +1,6 @@ @namespace Oqtane.Modules.Controls @inherits ModuleBase @attribute [OqtaneIgnore] -@inject IJSRuntime JsRuntime
@@ -108,6 +107,11 @@ [Parameter] public string DebugLevel { get; set; } = "info"; + public override List Resources => new List() + { + new Resource { ResourceType = ResourceType.Script, Url = "js/quill-interop.js" } + }; + protected override void OnInitialized() { _content = Content; // raw HTML @@ -117,12 +121,9 @@ { if (firstRender) { - var oqtaneInterop = new Interop(JsRuntime); - - await oqtaneInterop.LoadInteropScript("js/quill-interop.js"); - + await base.OnAfterRenderAsync(firstRender); - var interop = new RichTextEditorInterop(JsRuntime); + var interop = new RichTextEditorInterop(JSRuntime); await interop.CreateEditor( _editorElement, @@ -148,13 +149,13 @@ public async Task RefreshRichText() { - var interop = new RichTextEditorInterop(JsRuntime); + var interop = new RichTextEditorInterop(JSRuntime); await interop.LoadEditorContent(_editorElement, _content); } public async Task RefreshRawHtml() { - var interop = new RichTextEditorInterop(JsRuntime); + var interop = new RichTextEditorInterop(JSRuntime); _content = await interop.GetHtml(_editorElement); StateHasChanged(); } @@ -162,7 +163,7 @@ public async Task GetHtml() { // get rich text content - var interop = new RichTextEditorInterop(JsRuntime); + var interop = new RichTextEditorInterop(JSRuntime); string content = await interop.GetHtml(_editorElement); if (_original != content) @@ -184,7 +185,7 @@ var fileid = _fileManager.GetFileId(); if (fileid != -1) { - var interop = new RichTextEditorInterop(JsRuntime); + var interop = new RichTextEditorInterop(JSRuntime); await interop.InsertImage(_editorElement, ContentUrl(fileid)); _filemanagervisible = false; _message = string.Empty; @@ -205,19 +206,19 @@ // other rich text editor methods which can be used by developers public async Task GetText() { - var interop = new RichTextEditorInterop(JsRuntime); + var interop = new RichTextEditorInterop(JSRuntime); return await interop.GetText(_editorElement); } public async Task GetContent() { - var interop = new RichTextEditorInterop(JsRuntime); + var interop = new RichTextEditorInterop(JSRuntime); return await interop.GetContent(_editorElement); } public async Task EnableEditor(bool mode) { - var interop = new RichTextEditorInterop(JsRuntime); + var interop = new RichTextEditorInterop(JSRuntime); await interop.EnableEditor(_editorElement, mode); } } diff --git a/Oqtane.Client/Modules/HtmlText/Edit.razor b/Oqtane.Client/Modules/HtmlText/Edit.razor index f901d693e..0e15706ff 100644 --- a/Oqtane.Client/Modules/HtmlText/Edit.razor +++ b/Oqtane.Client/Modules/HtmlText/Edit.razor @@ -27,7 +27,6 @@ public override List Resources => new List() { new Resource { ResourceType = ResourceType.Stylesheet, Url = ModulePath() + "Module.css" }, - // the following resources should be declared in the RichTextEditor component however the framework currently only supports resource management for modules and themes new Resource { ResourceType = ResourceType.Stylesheet, Url = "css/quill/quill1.3.6.bubble.css" }, new Resource { ResourceType = ResourceType.Stylesheet, Url = "css/quill/quill1.3.6.snow.css" } }; diff --git a/Oqtane.Client/Modules/ModuleBase.cs b/Oqtane.Client/Modules/ModuleBase.cs index 9da4a090c..b4d8eb7ec 100644 --- a/Oqtane.Client/Modules/ModuleBase.cs +++ b/Oqtane.Client/Modules/ModuleBase.cs @@ -7,6 +7,8 @@ using Oqtane.Enums; using Oqtane.UI; using System.Collections.Generic; +using Microsoft.JSInterop; +using System.Linq; namespace Oqtane.Modules { @@ -19,6 +21,9 @@ public abstract class ModuleBase : ComponentBase, IModuleControl [Inject] protected ILogService LoggingService { get; set; } + [Inject] + protected IJSRuntime JSRuntime { get; set; } + [CascadingParameter] protected PageState PageState { get; set; } @@ -28,7 +33,6 @@ public abstract class ModuleBase : ComponentBase, IModuleControl [CascadingParameter] protected ModuleInstance ModuleInstance { get; set; } - // optional interface properties public virtual SecurityAccessLevel SecurityAccessLevel { get { return SecurityAccessLevel.View; } set { } } // default security @@ -40,7 +44,23 @@ public abstract class ModuleBase : ComponentBase, IModuleControl public virtual List Resources { get; set; } + // base lifecycle method for handling JSInterop script registration + protected override async Task OnAfterRenderAsync(bool firstRender) + { + if (firstRender) + { + if (Resources != null && Resources.Exists(item => item.ResourceType == ResourceType.Script)) + { + var interop = new Interop(JSRuntime); + foreach (var resource in Resources.Where(item => item.ResourceType == ResourceType.Script)) + { + await interop.LoadScript(resource.Url); + } + } + } + } + // path method public string ModulePath() diff --git a/Oqtane.Client/Themes/ContainerBase.cs b/Oqtane.Client/Themes/ContainerBase.cs index 527ff0e17..86cf85bd0 100644 --- a/Oqtane.Client/Themes/ContainerBase.cs +++ b/Oqtane.Client/Themes/ContainerBase.cs @@ -1,64 +1,11 @@ using Microsoft.AspNetCore.Components; -using Microsoft.JSInterop; -using Oqtane.Shared; using Oqtane.Models; -using Oqtane.UI; namespace Oqtane.Themes { - public abstract class ContainerBase : ComponentBase, IContainerControl + public abstract class ContainerBase : ThemeBase, IContainerControl { - [Inject] - protected IJSRuntime JSRuntime { get; set; } - - [CascadingParameter] - protected PageState PageState { get; set; } - [CascadingParameter] protected Module ModuleState { get; set; } - - public virtual string Name { get; set; } - public virtual string Thumbnail { get; set; } - - public string ThemePath() - { - return "Themes/" + GetType().Namespace + "/"; - } - - public string NavigateUrl() - { - return NavigateUrl(PageState.Page.Path); - } - - public string NavigateUrl(string path) - { - return NavigateUrl(path, ""); - } - - public string NavigateUrl(string path, string parameters) - { - return Utilities.NavigateUrl(PageState.Alias.Path, path, parameters); - } - - public string EditUrl(string action, string parameters) - { - return EditUrl(ModuleState.ModuleId, action, parameters); - } - - public string EditUrl(int moduleid, string action) - { - return EditUrl(moduleid, action, ""); - } - - public string EditUrl(int moduleid, string action, string parameters) - { - return EditUrl(PageState.Page.Path, moduleid, action, parameters); - } - - public string EditUrl(string path, int moduleid, string action, string parameters) - { - return Utilities.EditUrl(PageState.Alias.Path, path, moduleid, action, parameters); - } - } } diff --git a/Oqtane.Client/Themes/LayoutBase.cs b/Oqtane.Client/Themes/LayoutBase.cs index 294123389..5d3aadfab 100644 --- a/Oqtane.Client/Themes/LayoutBase.cs +++ b/Oqtane.Client/Themes/LayoutBase.cs @@ -1,21 +1,7 @@ -using Microsoft.AspNetCore.Components; -using Oqtane.Shared; -using Oqtane.UI; - -namespace Oqtane.Themes +namespace Oqtane.Themes { - public abstract class LayoutBase : ComponentBase, ILayoutControl + public abstract class LayoutBase : ThemeBase, ILayoutControl { - [CascadingParameter] - protected PageState PageState { get; set; } - public virtual string Name { get; set; } - public virtual string Thumbnail { get; set; } - public virtual string Panes { get; set; } - - public string LayoutPath() - { - return "Themes/" + GetType().Namespace + "/"; - } } } diff --git a/Oqtane.Client/Themes/ThemeBase.cs b/Oqtane.Client/Themes/ThemeBase.cs index 4083b796e..d2289a8b8 100644 --- a/Oqtane.Client/Themes/ThemeBase.cs +++ b/Oqtane.Client/Themes/ThemeBase.cs @@ -4,6 +4,7 @@ using Oqtane.Shared; using Oqtane.UI; using System.Collections.Generic; +using System.Linq; using System.Threading.Tasks; namespace Oqtane.Themes @@ -22,6 +23,23 @@ public abstract class ThemeBase : ComponentBase, IThemeControl public virtual string Panes { get; set; } public virtual List Resources { get; set; } + // base lifecycle method for handling JSInterop script registration + + protected override async Task OnAfterRenderAsync(bool firstRender) + { + if (firstRender) + { + if (Resources != null && Resources.Exists(item => item.ResourceType == ResourceType.Script)) + { + var interop = new Interop(JSRuntime); + foreach (var resource in Resources.Where(item => item.ResourceType == ResourceType.Script)) + { + await interop.LoadScript(resource.Url); + } + } + } + } + // path method public string ThemePath() @@ -60,5 +78,10 @@ public string EditUrl(string path, int moduleid, string action, string parameter { return Utilities.EditUrl(PageState.Alias.Path, path, moduleid, action, parameters); } + + public string ContentUrl(int fileid) + { + return Utilities.ContentUrl(PageState.Alias, fileid); + } } } diff --git a/Oqtane.Client/Themes/ThemeControlBase.cs b/Oqtane.Client/Themes/ThemeControlBase.cs index 62d3ef132..8cb6e7637 100644 --- a/Oqtane.Client/Themes/ThemeControlBase.cs +++ b/Oqtane.Client/Themes/ThemeControlBase.cs @@ -1,47 +1,7 @@ -using Microsoft.AspNetCore.Components; -using Oqtane.Shared; -using Oqtane.UI; - -namespace Oqtane.Themes +namespace Oqtane.Themes { - public abstract class ThemeControlBase : ComponentBase + public abstract class ThemeControlBase : ThemeBase { - [CascadingParameter] - protected PageState PageState { get; set; } - - public string NavigateUrl() - { - return NavigateUrl(PageState.Page.Path); - } - - public string NavigateUrl(string path) - { - return NavigateUrl(path, ""); - } - - public string NavigateUrl(string path, string parameters) - { - return Utilities.NavigateUrl(PageState.Alias.Path, path, parameters); - } - - public string EditUrl(int moduleid, string action) - { - return EditUrl(moduleid, action, ""); - } - - public string EditUrl(int moduleid, string action, string parameters) - { - return EditUrl(PageState.Page.Path, moduleid, action, parameters); - } - - public string EditUrl(string path, int moduleid, string action, string parameters) - { - return Utilities.EditUrl(PageState.Alias.Path, path, moduleid, action, parameters); - } - public string ContentUrl(int fileid) - { - return Utilities.ContentUrl(PageState.Alias, fileid); - } } } diff --git a/Oqtane.Client/UI/Interop.cs b/Oqtane.Client/UI/Interop.cs index c6981b9e3..54f9ab220 100644 --- a/Oqtane.Client/UI/Interop.cs +++ b/Oqtane.Client/UI/Interop.cs @@ -17,9 +17,9 @@ public Task SetCookie(string name, string value, int days) { try { - _jsRuntime.InvokeAsync( - "Oqtane.Interop.setCookie", - name, value, days); + _jsRuntime.InvokeVoidAsync( + "Oqtane.Interop.setCookie", + name, value, days); return Task.CompletedTask; } catch @@ -46,7 +46,7 @@ public Task UpdateTitle(string title) { try { - _jsRuntime.InvokeAsync( + _jsRuntime.InvokeVoidAsync( "Oqtane.Interop.updateTitle", title); return Task.CompletedTask; @@ -61,7 +61,7 @@ public Task IncludeMeta(string id, string attribute, string name, string content { try { - _jsRuntime.InvokeAsync( + _jsRuntime.InvokeVoidAsync( "Oqtane.Interop.includeMeta", id, attribute, name, content, key); return Task.CompletedTask; @@ -76,7 +76,7 @@ public Task IncludeLink(string id, string rel, string href, string type, string { try { - _jsRuntime.InvokeAsync( + _jsRuntime.InvokeVoidAsync( "Oqtane.Interop.includeLink", id, rel, href, type, integrity, crossorigin, key); return Task.CompletedTask; @@ -91,7 +91,7 @@ public Task IncludeLinks(object[] links) { try { - _jsRuntime.InvokeAsync( + _jsRuntime.InvokeVoidAsync( "Oqtane.Interop.includeLinks", (object) links); return Task.CompletedTask; @@ -106,7 +106,7 @@ public Task IncludeScript(string id, string src, string integrity, string crosso { try { - _jsRuntime.InvokeAsync( + _jsRuntime.InvokeVoidAsync( "Oqtane.Interop.includeScript", id, src, integrity, crossorigin, content, location, key); return Task.CompletedTask; @@ -117,18 +117,15 @@ public Task IncludeScript(string id, string src, string integrity, string crosso } } - public Task IncludeScripts(object[] scripts) + public async Task LoadScript(string path) { try { - _jsRuntime.InvokeAsync( - "Oqtane.Interop.includeScripts", - (object)scripts); - return Task.CompletedTask; + await _jsRuntime.InvokeVoidAsync("Oqtane.Interop.loadScript", path); } catch { - return Task.CompletedTask; + // ignore exception } } @@ -136,7 +133,7 @@ public Task RemoveElementsById(string prefix, string first, string last) { try { - _jsRuntime.InvokeAsync( + _jsRuntime.InvokeVoidAsync( "Oqtane.Interop.removeElementsById", prefix, first, last); return Task.CompletedTask; @@ -165,9 +162,9 @@ public Task SubmitForm(string path, object fields) { try { - _jsRuntime.InvokeAsync( - "Oqtane.Interop.submitForm", - path, fields); + _jsRuntime.InvokeVoidAsync( + "Oqtane.Interop.submitForm", + path, fields); return Task.CompletedTask; } catch @@ -194,9 +191,9 @@ public Task UploadFiles(string posturl, string folder, string id) { try { - _jsRuntime.InvokeAsync( - "Oqtane.Interop.uploadFiles", - posturl, folder, id); + _jsRuntime.InvokeVoidAsync( + "Oqtane.Interop.uploadFiles", + posturl, folder, id); return Task.CompletedTask; } catch @@ -209,7 +206,7 @@ public Task RefreshBrowser(bool force, int wait) { try { - _jsRuntime.InvokeAsync( + _jsRuntime.InvokeVoidAsync( "Oqtane.Interop.refreshBrowser", force, wait); return Task.CompletedTask; @@ -224,7 +221,7 @@ public Task RedirectBrowser(string url, int wait) { try { - _jsRuntime.InvokeAsync( + _jsRuntime.InvokeVoidAsync( "Oqtane.Interop.redirectBrowser", url, wait); return Task.CompletedTask; @@ -235,17 +232,5 @@ public Task RedirectBrowser(string url, int wait) } } - public async Task LoadInteropScript(string filePath) - { - try - { - await _jsRuntime.InvokeAsync("Oqtane.Interop.loadInteropScript", filePath); - } - catch - { - // handle exception - } - - } } } diff --git a/Oqtane.Client/UI/ThemeBuilder.razor b/Oqtane.Client/UI/ThemeBuilder.razor index 300523420..35a9f331c 100644 --- a/Oqtane.Client/UI/ThemeBuilder.razor +++ b/Oqtane.Client/UI/ThemeBuilder.razor @@ -30,27 +30,18 @@ await interop.UpdateTitle(PageState.Site.Name + " - " + PageState.Page.Name); } - // include page resources + // manage stylesheets for this page string batch = DateTime.Now.ToString("yyyyMMddHHmmssfff"); var links = new List(); - var scripts = new List(); foreach (Resource resource in PageState.Page.Resources) { - switch (resource.ResourceType) + if (resource.ResourceType == ResourceType.Stylesheet) { - case ResourceType.Stylesheet: - links.Add(new { id = "app-stylesheet-" + batch + "-" + (links.Count + 1).ToString("00"), rel = "stylesheet", href = resource.Url, type = "text/css", integrity = resource.Integrity ?? "", crossorigin = resource.CrossOrigin ?? "", key = "" }); - break; - case ResourceType.Script: - scripts.Add(new { id = "app-script-" + batch + "-" + (scripts.Count + 1).ToString("00"), src = resource.Url, integrity = resource.Integrity ?? "", crossorigin = resource.CrossOrigin ?? "", content = "", location = "body", key = "" }); - break; + links.Add(new { id = "app-stylesheet-" + batch + "-" + (links.Count + 1).ToString("00"), rel = "stylesheet", href = resource.Url, type = "text/css", integrity = resource.Integrity ?? "", crossorigin = resource.CrossOrigin ?? "", key = "" }); } } await interop.IncludeLinks(links.ToArray()); - await interop.IncludeScripts(scripts.ToArray()); - // remove any page resource references which are no longer required for this page await interop.RemoveElementsById("app-stylesheet", "", "app-stylesheet-" + batch + "-00"); - await interop.RemoveElementsById("app-script", "", "app-script-" + batch + "-00"); // add favicon if (PageState.Site.FaviconFileId != null) diff --git a/Oqtane.Server/wwwroot/js/interop.js b/Oqtane.Server/wwwroot/js/interop.js index e978c591d..b5c866ec1 100644 --- a/Oqtane.Server/wwwroot/js/interop.js +++ b/Oqtane.Server/wwwroot/js/interop.js @@ -145,7 +145,7 @@ Oqtane.Interop = { script.innerHTML = content; } script.async = false; - this.loadScript(script, location) + this.addScript(script, location) .then(() => { console.log(src + ' loaded'); }) @@ -185,7 +185,7 @@ Oqtane.Interop = { } } }, - loadScript: function (script, location) { + addScript: function (script, location) { if (location === 'head') { document.head.appendChild(script); } @@ -198,10 +198,14 @@ Oqtane.Interop = { script.onerror = rej(); }); }, - includeScripts: function (scripts) { - for (let i = 0; i < scripts.length; i++) { - this.includeScript(scripts[i].id, scripts[i].src, scripts[i].integrity, scripts[i].crossorigin, scripts[i].content, scripts[i].location, scripts[i].key); - } + loadScript: async function (path) { + const promise = new Promise((resolve, reject) => { + loadjs(path, { returnPromise: true }) + .then(function () { resolve(true) }) + .catch(function (pathsNotFound) { reject(false) }); + }); + const result = await promise; + return; }, getAbsoluteUrl: function (url) { var a = document.createElement('a'); @@ -321,15 +325,5 @@ Oqtane.Interop = { setInterval(function () { window.location.href = url; }, wait * 1000); - }, - loadInteropScript: async function (filePath) { - const promise = new Promise((resolve, reject) => { - loadjs(filePath, { returnPromise: true }) - .then(function () { resolve(true) }) - .catch(function (pathsNotFound) { reject(false) }); - }); - - const result = await promise; - return; } };