kocoded/oqtane.framework
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

inject CSS and JS on static rendering

Browse Source
This commit is contained in:
sbwalker 2024-02-19 15:25:48 -05:00
parent be98f786b3
commit acc562bd7f
2 changed files with 93 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

72
Oqtane.Client/UI/ThemeBuilder.razor
View File

@ -53,6 +53,15 @@
{
headcontent = AddHeadContent(headcontent, PageState.Page.HeadContent);
}
// stylesheets and scripts on static rendering
if (PageState.RenderMode == RenderModes.Static)
{
headcontent = AddHeadContent(headcontent, ManageStyleSheets(PageState.Page.Resources, PageState.Alias));
headcontent = AddHeadContent(headcontent, ManageScripts(PageState.Page.Resources, PageState.Alias));
}
// send to Head component
SiteState.Properties.HeadContent = headcontent;
DynamicComponent = builder =>
@ -193,4 +202,67 @@
await interop.IncludeScripts(scripts.ToArray());
}
}
private string ManageStyleSheets(List<Resource> resources, Alias alias)
{
var stylesheets = "";
if (resources != null)
{
string batch = DateTime.UtcNow.ToString("yyyyMMddHHmmssfff");
int count = 0;
foreach (var resource in resources.Where(item => item.ResourceType == ResourceType.Stylesheet))
{
if (resource.Url.StartsWith("~"))
{
resource.Url = resource.Url.Replace("~", "/Themes/" + Utilities.GetTypeName(resource.Namespace) + "/").Replace("//", "/");
}
if (!resource.Url.Contains("://") && alias.BaseUrl != "" && !resource.Url.StartsWith(alias.BaseUrl))
{
resource.Url = alias.BaseUrl + resource.Url;
}
if (!stylesheets.Contains(resource.Url, StringComparison.OrdinalIgnoreCase))
{
count++;
string id = "id=\"app-stylesheet-" + ResourceLevel.Page.ToString().ToLower() + "-" + batch + "-" + count.ToString("00") + "\" ";
stylesheets += "<link " + id + "rel=\"stylesheet\" href=\"" + resource.Url + "\"" + (!string.IsNullOrEmpty(resource.Integrity) ? " integrity=\"" + resource.Integrity + "\"" : "") + (!string.IsNullOrEmpty(resource.CrossOrigin) ? " crossorigin=\"" + resource.CrossOrigin + "\"" : "") + " type=\"text/css\"/>" + Environment.NewLine;
}
}
}
return stylesheets;
}
private string ManageScripts(List<Resource> resources, Alias alias)
{
var scripts = "";
if (resources != null)
{
foreach (var resource in resources.Where(item => item.ResourceType == ResourceType.Script && item.Location == ResourceLocation.Head))
{
var script = CreateScript(resource, alias);
if (!scripts.Contains(script, StringComparison.OrdinalIgnoreCase))
{
scripts += script + Environment.NewLine;
}
}
}
return scripts;
}
private string CreateScript(Resource resource, Alias alias)
{
if (!string.IsNullOrEmpty(resource.Url))
{
var url = (resource.Url.Contains("://")) ? resource.Url : alias.BaseUrl + resource.Url;
return "<script src=\"" + url + "\"" +
((!string.IsNullOrEmpty(resource.Integrity)) ? " integrity=\"" + resource.Integrity + "\"" : "") +
((!string.IsNullOrEmpty(resource.CrossOrigin)) ? " crossorigin=\"" + resource.CrossOrigin + "\"" : "") +
"></script>";
}
else
{
// inline script
return "<script>" + resource.Content + "</script>";
}
}
}

43
Oqtane.Server/Components/App.razor
View File

@ -168,34 +168,33 @@
CreateJwtToken(alias);
}
// stylesheets
var themes = ThemeRepository.GetThemes().ToList();
var resources = new List<Resource>();
if (string.IsNullOrEmpty(page.ThemeType))
// initial stylesheets (to prevent FOUC in interactive rendering)
if (_renderMode == RenderModes.Interactive)
{
page.ThemeType = site.DefaultThemeType;
}
var theme = themes.FirstOrDefault(item => item.Themes.Any(item => item.TypeName == page.ThemeType));
if (theme?.Resources != null)
{
resources.AddRange(theme.Resources);
}
var type = Type.GetType(page.ThemeType);
if (type != null)
{
var obj = Activator.CreateInstance(type) as IThemeControl;
if (obj?.Resources != null)
var themes = ThemeRepository.GetThemes().ToList();
var resources = new List<Resource>();
if (string.IsNullOrEmpty(page.ThemeType))
{
resources.AddRange(obj.Resources);
page.ThemeType = site.DefaultThemeType;
}
var theme = themes.FirstOrDefault(item => item.Themes.Any(item => item.TypeName == page.ThemeType));
if (theme?.Resources != null)
{
resources.AddRange(theme.Resources);
}
var type = Type.GetType(page.ThemeType);
if (type != null)
{
var obj = Activator.CreateInstance(type) as IThemeControl;
if (obj?.Resources != null)
{
resources.AddRange(obj.Resources);
}
}
ManageStyleSheets(resources, alias, theme.ThemeName);
}
ManageStyleSheets(resources, alias, theme.ThemeName);
// scripts
if (_renderMode == RenderModes.Static)
{
ManageScripts(resources, alias);
}
if (_renderMode == RenderModes.Interactive && _runtime == Runtimes.Server)
{
_reconnectScript = CreateReconnectScript();