125 lines
3.4 KiB
JavaScript
125 lines
3.4 KiB
JavaScript
import { routes } from './routes.js';
|
|
|
|
let DEBUG = false;
|
|
window.DEBUG = DEBUG;
|
|
|
|
let SERVER_HOST;
|
|
if (DEBUG) SERVER_HOST = 'http://localhost:50009';
|
|
else SERVER_HOST = 'https://a2s.su';
|
|
window.SERVER_HOST = SERVER_HOST;
|
|
|
|
/* main */
|
|
window.onload = function () {
|
|
let app = document.documentElement;
|
|
|
|
if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
|
switch_theme('dark');
|
|
} else {
|
|
switch_theme('light');
|
|
}
|
|
|
|
// theme switcher
|
|
document.getElementById('app_theme_switcher').addEventListener('click', switch_theme, false);
|
|
|
|
// routes handler
|
|
document.addEventListener('click', (e) => {
|
|
const { target } = e;
|
|
if (!target.matches('nav a')) {
|
|
return;
|
|
}
|
|
e.preventDefault();
|
|
route();
|
|
});
|
|
|
|
window.onpopstate = location_handler;
|
|
window.route = route;
|
|
location_handler();
|
|
};
|
|
|
|
/* Изменяет тему приложения */
|
|
function switch_theme() {
|
|
let app = document.documentElement;
|
|
let theme = app.getAttribute('data-bs-theme');
|
|
let theme_switcher = document.getElementById('app_theme_switcher');
|
|
|
|
let theme_icon = {
|
|
dark: '☀️',
|
|
light: '🌙',
|
|
};
|
|
|
|
if (theme == 'auto' || theme == 'light') {
|
|
theme_switcher.innerText = theme_icon['dark'];
|
|
app.setAttribute('data-bs-theme', 'dark');
|
|
} else {
|
|
theme_switcher.innerText = theme_icon['light'];
|
|
app.setAttribute('data-bs-theme', 'light');
|
|
}
|
|
}
|
|
|
|
const route = (event) => {
|
|
event = event || window.event; // get window.event if event argument not provided
|
|
event.preventDefault();
|
|
// window.history.pushState(state, unused, target link);
|
|
window.history.pushState({}, '', event.target.href);
|
|
location_handler();
|
|
};
|
|
|
|
const location_handler = async () => {
|
|
const url = window.location.pathname;
|
|
let location;
|
|
|
|
if (url == 0 || url == '/') {
|
|
location = '/';
|
|
} else {
|
|
location = url.slice(1);
|
|
}
|
|
|
|
const route = routes[location] || routes['404'];
|
|
const html = await fetch(route.template).then((response) => response.text());
|
|
document.getElementById('content').innerHTML = html;
|
|
document.title = route.title;
|
|
document.querySelector('meta[name="description"]').setAttribute('content', route.description);
|
|
|
|
if (route.script) {
|
|
const route_script = document.getElementById('content').querySelector('script');
|
|
let autorun_script = document.querySelector('#autorun');
|
|
|
|
// инициализирует новый блок кода
|
|
autorun_script.remove();
|
|
autorun_script = document.createElement('script');
|
|
autorun_script.setAttribute('type', 'module');
|
|
autorun_script.setAttribute('id', 'autorun');
|
|
autorun_script.innerHTML = route_script.innerHTML;
|
|
|
|
// удаляет скрипт из загруженной страницы и запускает новый
|
|
route_script.remove();
|
|
document.body.append(autorun_script);
|
|
} else {
|
|
document.querySelector('#autorun').innerHTML = '';
|
|
}
|
|
};
|
|
|
|
function get_from_api(callback, api_method = '', params = {}) {
|
|
if (api_method == '') {
|
|
console.log('wrong method');
|
|
} else {
|
|
let url = `${SERVER_HOST}/api/v1.0/${api_method}`;
|
|
let opts = {
|
|
method: 'get',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
},
|
|
};
|
|
|
|
fetch(url, opts)
|
|
.then((response) => {
|
|
return response.json();
|
|
})
|
|
.then((data) => {
|
|
callback(data);
|
|
})
|
|
.catch((err) => console.warn('Something went wrong.', err));
|
|
}
|
|
}
|
|
window.get_from_api = get_from_api;
|