Mirrors/theme.park
1
0
Fork 0
mirror of https://github.com/gilbN/theme.park.git synced 2024-10-03 22:17:08 +02:00
Code Issues Releases Wiki Activity

automatic meta color update

Browse Source
This commit is contained in:
GilbN 2022-02-16 21:35:11 +01:00
parent e394a6b8fe
commit b8a6665e72
1 changed files with 20 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
resources/landing-page/js/scripts.js
View File

@ -50,15 +50,16 @@
function injectTheme(theme,container="head") {
let themeLower = theme.toLowerCase()
if (container === "head") {
html_element = document.head;
} else html_element = document.body;
let themeOption = document.getElementById("theme-option")
let link = themeOption ? themeOption : document.createElement("link");
url = "/css/theme-options/"
url = "/css/theme-options"
link.type = "text/css";
link.rel = "stylesheet";
link.href = `${url}/${theme.toLowerCase()}.css`;
link.href = `${url}/${themeLower}.css`;
link.id = `theme-option`
html_element.appendChild(link);
}
@ -85,8 +86,9 @@ function injectTheme(theme,container="head") {
href="https://docs.theme-park.dev/custom/">variables</a>.`
createApps(apps,themeOptions)
smoothScroll()
let randomTheme = Object.keys(themeOptions)[~~(Math.random() * Object.keys(themeOptions).length)]
injectTheme(randomTheme)
currentIndex = ~~(Math.random() * Object.keys(themeOptions).length)
injectTheme(Object.keys(themeOptions)[currentIndex])
updateMetaThemeColor()
})
}
@ -119,7 +121,9 @@ function createApps(apps,themeOptions) {
}
function fadeOutIn(speed) {
let theme = Object.keys(themeOptions)[~~(Math.random() * Object.keys(themeOptions).length)]
currentIndex = (currentIndex+1)%Object.keys(themeOptions).length;
//let theme = Object.keys(themeOptions)[~~(Math.random() * Object.keys(themeOptions).length)]
let theme = Object.keys(themeOptions)[currentIndex]
if (!document.body.style.opacity) {
document.body.style.opacity = 1;
}
@ -129,6 +133,7 @@ function fadeOutIn(speed) {
clearInterval(outInterval);
injectTheme(theme)
document.getElementById("switch-theme").innerText = theme
updateMetaThemeColor()
var inInterval = setInterval(function() {
document.body.style.opacity = Number(document.body.style.opacity)+0.02;
if (document.body.style.opacity >= 1)
@ -139,6 +144,16 @@ function fadeOutIn(speed) {
}
function updateMetaThemeColor() {
fetch(`/css/theme-options/${Object.keys(themeOptions)[currentIndex].toLowerCase()}.css`)
.then(response => response.text())
.then(text => {
let re = text.match("--accent-color:.*;")[0]
rgb = re.split(":")[1].split(";")[0].replace(/\s/g, "")
document.querySelector('meta[name="theme-color"]').setAttribute('content', `rgb(${rgb})`);
})
}
// Smooth scrolling using anime.js
function smoothScroll() {$('a.js-scroll-trigger[href*="#"]:not([href="#"])').on('click', function () {
if (