InfernalGames/gallery
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(static): refactor static module

Browse Source
This commit is contained in:
shmyga
2026-07-06 11:52:55 +03:00
parent 72fd148a54
commit 6171ec8a26
14 changed files with 78 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
static/src/language.ts → static/src/app/common/language.ts
View File

@@ -19,7 +19,7 @@
setLanguage(getPreferredLanguage());
const showActiveLanguage = (language: string, focus = false) => {
const languageSwitcher = document.querySelector("#bd-language");
const languageSwitcher = document.querySelector<HTMLElement>("#bd-language");
if (!languageSwitcher) {
return;
@@ -27,24 +27,26 @@
const languageSwitcherText = document.querySelector("#bd-language-text");
const activeLanguageIcon = document.querySelector(".language-icon-active");
const btnToActive = document.querySelector(`[data-bs-language-value="${language}"]`);
const activeLanguageIconClass = btnToActive.querySelector(".fi").className.match(/fi-[\w-]+/)[0];
const btnToActive = document.querySelector<HTMLElement>(`[data-bs-language-value="${language}"]`);
const activeLanguageIconClass = (btnToActive?.querySelector(".fi")?.className.match(/fi-[\w-]+/) || [])[0] || "";
document.querySelectorAll("[data-bs-language-value]").forEach((element) => {
element.classList.remove("active");
element.setAttribute("aria-pressed", "false");
});
btnToActive.classList.add("active");
btnToActive.setAttribute("aria-pressed", "true");
const classesToRemove = Array.from(activeLanguageIcon.classList).filter((className) => className.startsWith("fi-"));
activeLanguageIcon.classList.remove(...classesToRemove);
activeLanguageIcon.classList.add(activeLanguageIconClass);
const languageSwitcherLabel = `${languageSwitcherText.textContent} (${btnToActive.dataset.bsLanguageValue})`;
btnToActive?.classList.add("active");
btnToActive?.setAttribute("aria-pressed", "true");
const classesToRemove = Array.from(activeLanguageIcon?.classList || []).filter((className) =>
className.startsWith("fi-"),
);
activeLanguageIcon?.classList.remove(...classesToRemove);
activeLanguageIcon?.classList.add(activeLanguageIconClass);
const languageSwitcherLabel = `${languageSwitcherText?.textContent} (${btnToActive?.dataset.bsLanguageValue})`;
languageSwitcher.setAttribute("aria-label", languageSwitcherLabel);
if (focus) {
languageSwitcher.focus();
languageSwitcher?.focus();
}
};

24
static/src/theme.ts → static/src/app/common/theme.ts
View File

@@ -25,7 +25,7 @@
setTheme(getPreferredTheme());
const showActiveTheme = (theme: string, focus = false) => {
const themeSwitcher = document.querySelector("#bd-theme");
const themeSwitcher = document.querySelector<HTMLElement>("#bd-theme");
if (!themeSwitcher) {
return;
@@ -33,24 +33,26 @@
const themeSwitcherText = document.querySelector("#bd-theme-text");
const activeThemeIcon = document.querySelector(".theme-icon-active");
const btnToActive = document.querySelector(`[data-bs-theme-value="${theme}"]`);
const activeThemeIconClass = btnToActive.querySelector(".bi").className.match(/bi-[\w-]+/)[0];
const btnToActive = document.querySelector<HTMLElement>(`[data-bs-theme-value="${theme}"]`);
const activeThemeIconClass = (btnToActive?.querySelector(".bi")?.className.match(/bi-[\w-]+/) || [])[0] || "";
document.querySelectorAll("[data-bs-theme-value]").forEach((element) => {
element.classList.remove("active");
element.setAttribute("aria-pressed", "false");
});
btnToActive.classList.add("active");
btnToActive.setAttribute("aria-pressed", "true");
const classesToRemove = Array.from(activeThemeIcon.classList).filter((className) => className.startsWith("bi-"));
activeThemeIcon.classList.remove(...classesToRemove);
activeThemeIcon.classList.add(activeThemeIconClass);
const themeSwitcherLabel = `${themeSwitcherText.textContent} (${btnToActive.dataset.bsThemeValue})`;
btnToActive?.classList.add("active");
btnToActive?.setAttribute("aria-pressed", "true");
const classesToRemove = Array.from(activeThemeIcon?.classList || []).filter((className) =>
className.startsWith("bi-"),
);
activeThemeIcon?.classList.remove(...classesToRemove);
activeThemeIcon?.classList.add(activeThemeIconClass);
const themeSwitcherLabel = `${themeSwitcherText?.textContent} (${btnToActive?.dataset.bsThemeValue})`;
themeSwitcher.setAttribute("aria-label", themeSwitcherLabel);
if (focus) {
themeSwitcher.focus();
themeSwitcher?.focus();
}
};
@@ -66,7 +68,7 @@
document.querySelectorAll("[data-bs-theme-value]").forEach((toggle) => {
toggle.addEventListener("click", () => {
const theme = toggle.getAttribute("data-bs-theme-value") || '';
const theme = toggle.getAttribute("data-bs-theme-value") || "";
setStoredTheme(theme);
setTheme(theme);
showActiveTheme(theme, true);

6
static/src/app/common/tooltips.ts Normal file
View File

@@ -0,0 +1,6 @@
import { Tooltip } from "bootstrap";
document.addEventListener("DOMContentLoaded", (event) => {
const tooltipTriggerList = document.querySelectorAll('[data-bs-toggle="tooltip"]');
const tooltipList = [...tooltipTriggerList].map((tooltipTriggerEl) => new Tooltip(tooltipTriggerEl));
});

0
static/src/components.ts → static/src/app/components/app-link.ts
View File

1
static/src/schedule/schedule.ts → static/src/app/schedule.ts
View File

@@ -108,4 +108,3 @@ declare global {
window.scheduleChannelStorage = new ScheduleChannelStorage();
window.scheduleChannelManager = new ScheduleChannelManager();
console.log("ok");

0
static/src/weather/weather.ts → static/src/app/weather.ts
View File

17
static/src/index.ts
View File

@@ -1,11 +1,6 @@
import * as bootstrap from "bootstrap";
import "./components";
import "./language";
import "./theme";
import "./weather/weather";
import "./schedule/schedule";
document.addEventListener("DOMContentLoaded", (event) => {
const tooltipTriggerList = document.querySelectorAll('[data-bs-toggle="tooltip"]');
const tooltipList = [...tooltipTriggerList].map((tooltipTriggerEl) => new bootstrap.Tooltip(tooltipTriggerEl));
});
import "./app/common/language";
import "./app/common/theme";
import "./app/common/tooltips";
import "./app/components/app-link";
import "./app/schedule";
import "./app/weather";

7
static/src/lib/flag-icons.scss
View File

@@ -1,12 +1,5 @@
@use "flag-icons/sass/flag-icons" with (
$flag-icons-path: "flag-icons/flags",
$flag-icons-included-countries: (
"gb",
"ru",
"by",
"ua",
"kz",
)
);
.fir {

39
static/src/main.scss
View File

@@ -3,38 +3,7 @@
@import "./lib/bootstrap-icons";
@import "./lib/weather-icons";
@import "./widget.scss";
@import "./weather/weather.scss";
.table.table-compact {
td {
padding: 0.1rem 0.4rem;
}
}
.icon-header {
@include font-size($h4-font-size);
}
.app-header {
display: flex;
flex-direction: row;
> .link-list {
display: flex;
flex-direction: row;
gap: 1rem;
app-link {
display: flex;
align-items: center;
&:not(:last-child)::after {
margin-left: 1rem;
content: "|";
}
}
}
}
@import "./mobile";
@import "./styles/weather.scss";
@import "./styles/app";
@import "./styles/widget.scss";
@import "./styles/mobile";

32
static/src/styles/app.scss Normal file
View File

@@ -0,0 +1,32 @@
@import "../lib/bootstrap";
.table.table-compact {
td {
padding: 0.1rem 0.4rem;
}
}
.icon-header {
@include font-size($h4-font-size);
}
.app-header {
display: flex;
flex-direction: row;
> .link-list {
display: flex;
flex-direction: row;
gap: 1rem;
app-link {
display: flex;
align-items: center;
&:not(:last-child)::after {
margin-left: 1rem;
content: "|";
}
}
}
}

2
static/src/mobile.scss → static/src/styles/mobile.scss
View File

@@ -1,4 +1,4 @@
@import "./lib/bootstrap";
@import "../lib/bootstrap";
$default-space: 2;

0
static/src/weather/weather.scss → static/src/styles/weather.scss
View File

0
static/src/widget.scss → static/src/styles/widget.scss
View File

7
static/webpack.config.ts
View File

@@ -17,9 +17,6 @@ const config: webpack.Configuration = {
test: /\.tsx?$/,
use: {
loader: "ts-loader",
options: {
transpileOnly: true, // TODO: fix errors
},
},
exclude: /node_modules/,
},
@@ -63,6 +60,10 @@ const config: webpack.Configuration = {
from: "./node_modules/flag-icons/flags/1x1/*.svg",
to: "flag-icons/flags/1x1/[name][ext]",
},
{
from: "./node_modules/flag-icons/flags/4x3/*.svg",
to: "flag-icons/flags/4x3/[name][ext]",
},
],
}),
],