replaced theme-change with theme cookie
This commit is contained in:
parent
81e95042bd
commit
e4d376d166
|
@ -1,7 +1,7 @@
|
||||||
@using System.Globalization
|
@using System.Globalization
|
||||||
@using Microsoft.AspNetCore.Localization
|
@using Microsoft.AspNetCore.Localization
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="@CultureInfo.CurrentUICulture.ToString()">
|
<html lang="@CultureInfo.CurrentUICulture.ToString()" data-theme="@UserTheme">
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
<meta charset="utf-8" />
|
<meta charset="utf-8" />
|
||||||
|
@ -46,6 +46,8 @@
|
||||||
[CascadingParameter]
|
[CascadingParameter]
|
||||||
public HttpContext? HttpContext { get; set; }
|
public HttpContext? HttpContext { get; set; }
|
||||||
|
|
||||||
|
private string? UserTheme { get; set; }
|
||||||
|
|
||||||
protected override void OnInitialized() {
|
protected override void OnInitialized() {
|
||||||
HttpContext?.Response.Cookies.Append(
|
HttpContext?.Response.Cookies.Append(
|
||||||
CookieRequestCultureProvider.DefaultCookieName,
|
CookieRequestCultureProvider.DefaultCookieName,
|
||||||
|
@ -57,5 +59,10 @@
|
||||||
IsEssential = true,
|
IsEssential = true,
|
||||||
SameSite = SameSiteMode.Strict
|
SameSite = SameSiteMode.Strict
|
||||||
});
|
});
|
||||||
|
|
||||||
|
if (HttpContext?.Request.Cookies.ContainsKey(".Wave.Theme") is true) {
|
||||||
|
HttpContext.Request.Cookies.TryGetValue(".Wave.Theme", out string? theme);
|
||||||
|
UserTheme = theme;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
|
@ -59,11 +59,13 @@
|
||||||
<path d="M10.719 21.75h9.156c1.036 0 1.875-.84 1.875-1.875v-5.25c0-1.036-.84-1.875-1.875-1.875h-.14l-8.742 8.743c-.09.089-.18.175-.274.257ZM12.738 17.625l6.474-6.474a1.875 1.875 0 0 0 0-2.651L15.5 4.787a1.875 1.875 0 0 0-2.651 0l-.1.099V17.25c0 .126-.003.251-.01.375Z" />
|
<path d="M10.719 21.75h9.156c1.036 0 1.875-.84 1.875-1.875v-5.25c0-1.036-.84-1.875-1.875-1.875h-.14l-8.742 8.743c-.09.089-.18.175-.274.257ZM12.738 17.625l6.474-6.474a1.875 1.875 0 0 0 0-2.651L15.5 4.787a1.875 1.875 0 0 0-2.651 0l-.1.099V17.25c0 .126-.003.251-.01.375Z" />
|
||||||
</svg>
|
</svg>
|
||||||
</button>
|
</button>
|
||||||
<select data-choose-theme class="select select-bordered select-sm md:text-center join-item min-w-0 flex-1">
|
<select id="theme-select" class="select select-bordered select-sm md:text-center join-item min-w-0 flex-1"
|
||||||
|
onchange="window.location = `/theme/${this.value}?returnUrl=@WebUtility.UrlEncode("/" + Navigation.ToBaseRelativePath(Navigation.Uri))`">
|
||||||
<option value="">@Localizer["Theme_Default"]</option>
|
<option value="">@Localizer["Theme_Default"]</option>
|
||||||
<option value="wave-light">@Localizer["Theme_WaveLight"]</option>
|
<option value="wave-light">@Localizer["Theme_WaveLight"]</option>
|
||||||
<option value="wave-dark">@Localizer["Theme_WaveDark"]</option>
|
<option value="wave-dark">@Localizer["Theme_WaveDark"]</option>
|
||||||
</select>
|
</select>
|
||||||
|
<script>document.getElementById("theme-select").value = document.documentElement.dataset.theme</script>
|
||||||
</div>
|
</div>
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
|
@ -76,6 +78,3 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Scripts -->
|
|
||||||
<script src="/lib/theme-change/index.min.js"></script>
|
|
23
Wave/Controllers/ThemeController.cs
Normal file
23
Wave/Controllers/ThemeController.cs
Normal file
|
@ -0,0 +1,23 @@
|
||||||
|
using Microsoft.AspNetCore.Mvc;
|
||||||
|
|
||||||
|
namespace Wave.Controllers;
|
||||||
|
|
||||||
|
[ApiController]
|
||||||
|
[Route("/theme")]
|
||||||
|
public class ThemeController : ControllerBase {
|
||||||
|
[HttpGet("{theme}")]
|
||||||
|
public IActionResult SetLanguage(string? theme, string returnUrl = "") {
|
||||||
|
if (theme is null) {
|
||||||
|
Response.Cookies.Delete(".Wave.Theme");
|
||||||
|
} else {
|
||||||
|
Response.Cookies.Append(".Wave.Theme", theme, new CookieOptions {
|
||||||
|
Expires = DateTimeOffset.UtcNow.AddYears(1),
|
||||||
|
IsEssential = true,
|
||||||
|
SameSite = SameSiteMode.Strict
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
return LocalRedirect(string.IsNullOrWhiteSpace(returnUrl) ? "/" : returnUrl);
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
|
@ -1,21 +0,0 @@
|
||||||
MIT License
|
|
||||||
|
|
||||||
Copyright (c) 2022 Pouya Saadeghi
|
|
||||||
|
|
||||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
||||||
of this software and associated documentation files (the "Software"), to deal
|
|
||||||
in the Software without restriction, including without limitation the rights
|
|
||||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
||||||
copies of the Software, and to permit persons to whom the Software is
|
|
||||||
furnished to do so, subject to the following conditions:
|
|
||||||
|
|
||||||
The above copyright notice and this permission notice shall be included in all
|
|
||||||
copies or substantial portions of the Software.
|
|
||||||
|
|
||||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
||||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
||||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
||||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
||||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
||||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
||||||
SOFTWARE.
|
|
1
Wave/wwwroot/lib/theme-change/index.min.js
vendored
1
Wave/wwwroot/lib/theme-change/index.min.js
vendored
|
@ -1 +0,0 @@
|
||||||
function themeToggle(){var toggleEl=document.querySelector("[data-toggle-theme]");(function(theme=localStorage.getItem("theme")){if(localStorage.getItem("theme")){document.documentElement.setAttribute("data-theme",theme);if(toggleEl){[...document.querySelectorAll("[data-toggle-theme]")].forEach(el=>{el.classList.add(toggleEl.getAttribute("data-act-class"))})}}})();if(toggleEl){[...document.querySelectorAll("[data-toggle-theme]")].forEach(el=>{el.addEventListener("click",function(){var themesList=el.getAttribute("data-toggle-theme");if(themesList){var themesArray=themesList.split(",");if(document.documentElement.getAttribute("data-theme")==themesArray[0]){if(themesArray.length==1){document.documentElement.removeAttribute("data-theme");localStorage.removeItem("theme")}else{document.documentElement.setAttribute("data-theme",themesArray[1]);localStorage.setItem("theme",themesArray[1])}}else{document.documentElement.setAttribute("data-theme",themesArray[0]);localStorage.setItem("theme",themesArray[0])}}[...document.querySelectorAll("[data-toggle-theme]")].forEach(el=>{el.classList.toggle(this.getAttribute("data-act-class"))})})})}}function themeBtn(){(function(theme=localStorage.getItem("theme")){if(theme!=undefined&&theme!=""){if(localStorage.getItem("theme")&&localStorage.getItem("theme")!=""){document.documentElement.setAttribute("data-theme",theme);var btnEl=document.querySelector("[data-set-theme='"+theme.toString()+"']");if(btnEl){[...document.querySelectorAll("[data-set-theme]")].forEach(el=>{el.classList.remove(el.getAttribute("data-act-class"))});if(btnEl.getAttribute("data-act-class")){btnEl.classList.add(btnEl.getAttribute("data-act-class"))}}}else{var btnEl=document.querySelector("[data-set-theme='']");if(btnEl.getAttribute("data-act-class")){btnEl.classList.add(btnEl.getAttribute("data-act-class"))}}}})();[...document.querySelectorAll("[data-set-theme]")].forEach(el=>{el.addEventListener("click",function(){document.documentElement.setAttribute("data-theme",this.getAttribute("data-set-theme"));localStorage.setItem("theme",document.documentElement.getAttribute("data-theme"));[...document.querySelectorAll("[data-set-theme]")].forEach(el=>{el.classList.remove(el.getAttribute("data-act-class"))});if(el.getAttribute("data-act-class")){el.classList.add(el.getAttribute("data-act-class"))}})})}function themeSelect(){(function(theme=localStorage.getItem("theme")){if(localStorage.getItem("theme")){document.documentElement.setAttribute("data-theme",theme);var optionToggler=document.querySelector("select[data-choose-theme] [value='"+theme.toString()+"']");if(optionToggler){[...document.querySelectorAll("select[data-choose-theme] [value='"+theme.toString()+"']")].forEach(el=>{el.selected=true})}}})();if(document.querySelector("select[data-choose-theme]")){[...document.querySelectorAll("select[data-choose-theme]")].forEach(el=>{el.addEventListener("change",function(){document.documentElement.setAttribute("data-theme",this.value);localStorage.setItem("theme",document.documentElement.getAttribute("data-theme"));[...document.querySelectorAll("select[data-choose-theme] [value='"+localStorage.getItem("theme")+"']")].forEach(el=>{el.selected=true})})})}}function themeChange(attach=true){if(attach===true){document.addEventListener("DOMContentLoaded",function(event){themeToggle();themeSelect();themeBtn()})}else{themeToggle();themeSelect();themeBtn()}}if(typeof exports!="undefined"){module.exports={themeChange:themeChange}}else{themeChange()}
|
|
Loading…
Reference in a new issue