Изменён тип роутеров с # на /
This commit is contained in:
parent
d44badb89e
commit
34aee6e4cb
|
@ -1,6 +1,11 @@
|
|||
.parcel-cache/
|
||||
.parcel-app/
|
||||
ec*.exe
|
||||
public/
|
||||
|
||||
content/
|
||||
app/bootstrap*
|
||||
|
||||
# new env
|
||||
dev/
|
||||
dist/
|
||||
|
||||
# for windows
|
||||
ec*.exe
|
||||
|
|
|
@ -1,8 +1,5 @@
|
|||
public/
|
||||
static/
|
||||
app/assets/css/bootstrap*
|
||||
app/assets/js/bootstrap*
|
||||
package.json
|
||||
package-lock.json
|
||||
server/
|
||||
*.md
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
## Используемые технологии
|
||||
|
||||
- **Языки:** **JavaScript** для фрота, **Crystal** для бэка и **Bash** для скриптов.
|
||||
- **Инструменты:** Parcel, Prettier, EditorConfig
|
||||
- **Инструменты:** Parcel, Prettier, EditorConfig, nginx
|
||||
|
||||
## Сборка
|
||||
|
||||
|
|
45
app/app.js
45
app/app.js
|
@ -22,7 +22,17 @@ window.onload = function () {
|
|||
document.getElementById('app_theme_switcher').addEventListener('click', switch_theme, false);
|
||||
|
||||
// routes handler
|
||||
window.addEventListener('hashchange', location_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();
|
||||
};
|
||||
|
||||
|
@ -46,11 +56,24 @@ function switch_theme() {
|
|||
}
|
||||
}
|
||||
|
||||
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 () => {
|
||||
let location = window.location.hash.replace('#', '');
|
||||
if (location.length == 0) {
|
||||
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;
|
||||
|
@ -58,11 +81,19 @@ const location_handler = async () => {
|
|||
document.querySelector('meta[name="description"]').setAttribute('content', route.description);
|
||||
|
||||
if (route.script) {
|
||||
let script = document.getElementById('content').querySelector('script');
|
||||
document.querySelector('#autorun').innerHTML = script.innerHTML;
|
||||
script.remove();
|
||||
const route_script = document.getElementById('content').querySelector('script');
|
||||
let autorun_script = document.querySelector('#autorun');
|
||||
|
||||
eval(document.querySelector('#autorun').innerHTML);
|
||||
// инициализирует новый блок кода
|
||||
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 = '';
|
||||
}
|
||||
|
|
|
@ -1,9 +1,9 @@
|
|||
/* SITE */
|
||||
Last update: Sun Aug 06 04:57 AM MSK 2023
|
||||
Last update: Sun Aug 19 02:47 AM MSK 2023
|
||||
Language: Russian
|
||||
Doctype: HTML5
|
||||
IDE: Sublime Text 4
|
||||
Tools: Parcel, Prettier, EditorConfig
|
||||
Tools: Parcel, Prettier, EditorConfig, nginx
|
||||
Components: Bootstrap 5.3.1
|
||||
Server: 1Gb RAM 1CPU KVM by FirstVDS
|
||||
Server OS: ArchLinux rolling
|
||||
|
|
|
@ -23,7 +23,7 @@
|
|||
</svg>
|
||||
Home
|
||||
</a>
|
||||
<a class="nav-link fw-bold py-1 px-0 icon-link" href="#about">
|
||||
<a class="nav-link fw-bold py-1 px-0 icon-link" href="/about">
|
||||
<svg
|
||||
class="svg-icon"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
|
|
|
@ -1,106 +1,135 @@
|
|||
<ul class="dropdown-menu d-block position-static shadow mb-3 mb-md-0">
|
||||
<li>
|
||||
<a class="dropdown-item d-flex gap-2 align-items-center" href="#games">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="16"
|
||||
height="16"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
class="feather feather-activity">
|
||||
<polyline points="22 12 18 12 15 21 9 3 6 12 2 12"></polyline>
|
||||
</svg>
|
||||
Games
|
||||
</a>
|
||||
</li>
|
||||
<li><hr class="dropdown-divider" /></li>
|
||||
<li>
|
||||
<a
|
||||
class="dropdown-item d-flex gap-2 align-items-center"
|
||||
href="https://ё.a2s.su/"
|
||||
target="_blank">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="16"
|
||||
height="16"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
class="feather feather-book">
|
||||
<path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20"></path>
|
||||
<path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"></path>
|
||||
</svg>
|
||||
Буква <span class="font-monospace">ё</span>
|
||||
</a>
|
||||
</li>
|
||||
<li><hr class="dropdown-divider" /></li>
|
||||
<li>
|
||||
<a class="dropdown-item d-flex gap-2 align-items-center" href="#git">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="16"
|
||||
height="16"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round">
|
||||
<path
|
||||
d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z" />
|
||||
<polyline points="3.27 6.96 12 12.01 20.73 6.96" />
|
||||
<line x1="12" y1="22.08" x2="12" y2="12" />
|
||||
</svg>
|
||||
Git инстанс
|
||||
</a>
|
||||
</li>
|
||||
<li><hr class="dropdown-divider" /></li>
|
||||
<li>
|
||||
<a class="dropdown-item d-flex gap-2 align-items-center" href="#personal">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="16"
|
||||
height="16"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
class="feather feather-user">
|
||||
<path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"></path>
|
||||
<circle cx="12" cy="7" r="4"></circle>
|
||||
</svg>
|
||||
Personal
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="dropdown-item d-flex gap-2 align-items-center" href="#trash">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="16"
|
||||
height="16"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
class="feather feather-trash-2">
|
||||
<polyline points="3 6 5 6 21 6"></polyline>
|
||||
<path
|
||||
d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
|
||||
<line x1="10" y1="11" x2="10" y2="17"></line>
|
||||
<line x1="14" y1="11" x2="14" y2="17"></line>
|
||||
</svg>
|
||||
Trash
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<nav>
|
||||
<ul class="dropdown-menu d-block position-static shadow mb-3 mb-md-0">
|
||||
<li>
|
||||
<a class="dropdown-item d-flex gap-2 align-items-center" href="/games">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="16"
|
||||
height="16"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
class="feather feather-activity">
|
||||
<polyline points="22 12 18 12 15 21 9 3 6 12 2 12"></polyline>
|
||||
</svg>
|
||||
Games
|
||||
</a>
|
||||
</li>
|
||||
<li><hr class="dropdown-divider" /></li>
|
||||
<li>
|
||||
<a class="dropdown-item d-flex gap-2 align-items-center" href="/old_pc">
|
||||
Старые компьютеры
|
||||
</a>
|
||||
</li>
|
||||
<li><hr class="dropdown-divider" /></li>
|
||||
<li>
|
||||
<a
|
||||
class="dropdown-item d-flex gap-2 align-items-center"
|
||||
href="https://ё.a2s.su/"
|
||||
target="_blank">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="16"
|
||||
height="16"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
class="feather feather-book">
|
||||
<path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20"></path>
|
||||
<path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"></path>
|
||||
</svg>
|
||||
Буква <span class="font-monospace">ё</span>
|
||||
</a>
|
||||
</li>
|
||||
<li><hr class="dropdown-divider" /></li>
|
||||
<li>
|
||||
<a class="dropdown-item d-flex gap-2 align-items-center" href="/irc">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="16"
|
||||
height="16"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round">
|
||||
<line x1="4" y1="9" x2="20" y2="9" />
|
||||
<line x1="4" y1="15" x2="20" y2="15" />
|
||||
<line x1="10" y1="3" x2="8" y2="21" />
|
||||
<line x1="16" y1="3" x2="14" y2="21" />
|
||||
</svg>
|
||||
|
||||
IRC сервер
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="dropdown-item d-flex gap-2 align-items-center" href="/git">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="16"
|
||||
height="16"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round">
|
||||
<path
|
||||
d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z" />
|
||||
<polyline points="3.27 6.96 12 12.01 20.73 6.96" />
|
||||
<line x1="12" y1="22.08" x2="12" y2="12" />
|
||||
</svg>
|
||||
Git инстанс
|
||||
</a>
|
||||
</li>
|
||||
<li><hr class="dropdown-divider" /></li>
|
||||
<li>
|
||||
<a class="dropdown-item d-flex gap-2 align-items-center" href="/personal">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="16"
|
||||
height="16"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
class="feather feather-user">
|
||||
<path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"></path>
|
||||
<circle cx="12" cy="7" r="4"></circle>
|
||||
</svg>
|
||||
Personal
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="dropdown-item d-flex gap-2 align-items-center" href="/trash">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="16"
|
||||
height="16"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
class="feather feather-trash-2">
|
||||
<polyline points="3 6 5 6 21 6"></polyline>
|
||||
<path
|
||||
d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
|
||||
<line x1="10" y1="11" x2="10" y2="17"></line>
|
||||
<line x1="14" y1="11" x2="14" y2="17"></line>
|
||||
</svg>
|
||||
Trash
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
|
14
package.json
14
package.json
|
@ -1,18 +1,16 @@
|
|||
{
|
||||
"private": true,
|
||||
"name": "a2s",
|
||||
"version": "1.0.0",
|
||||
"version": "0.0.0",
|
||||
"description": "ololo",
|
||||
"scripts": {
|
||||
"serve": "npx parcel serve --dist-dir .parcel-app app/index.html icons/*.png pages/*.html content/*/*/*",
|
||||
"serve-https": "npx parcel serve --https --dist-dir public app/index.html pages/*.html content/*/*/*",
|
||||
"build": "npm run clean; npm run build-pages; npm run build-app; npm run git-hash",
|
||||
"build-app": "npx parcel build --no-cache --no-source-maps --no-optimize --no-content-hash --dist-dir public app/index.html",
|
||||
"build-pages": "npx parcel build --no-cache --no-source-maps --no-optimize --no-content-hash --dist-dir public/ content/*/*/* pages/*.html",
|
||||
"develop": "npm run clean; ln -s pages/ dev/pages/; npm run watch-app",
|
||||
"watch-app": "npx parcel watch --dist-dir dev/ app/index.html",
|
||||
"build": "npm run clean; npm run build-app; npm run git-hash",
|
||||
"build-app": "npx parcel build --no-cache --no-source-maps --no-optimize --no-content-hash --dist-dir dist/ app/index.html",
|
||||
"prettier": "npx prettier --write .",
|
||||
"git-hash": "./update_commit.sh",
|
||||
"clean": "rm -rf ./public/ &> /dev/null",
|
||||
"test": "echo \"Error: no test specified\" && exit 1"
|
||||
"clean": "rm -rf ./dev/* ./dist/* &> /dev/null"
|
||||
},
|
||||
"author": "Alexander Popov <iiiypuk@fastmail.fm>",
|
||||
"license": "WTFPL",
|
||||
|
|
|
@ -23,7 +23,7 @@
|
|||
</div>
|
||||
|
||||
<script type="module">
|
||||
import { update_lastfm_nowplay } from './js/lastfm-nowplay.js';
|
||||
import { update_lastfm_nowplay } from '/pages/js/lastfm-nowplay.js';
|
||||
|
||||
function autorun() {
|
||||
if (!window.DEBUG) {
|
||||
|
|
|
@ -94,7 +94,7 @@
|
|||
</p>
|
||||
|
||||
<script type="module">
|
||||
import { update_rev2 } from './js/rev2.js';
|
||||
import { update_rev2 } from '/pages/js/rev2.js';
|
||||
|
||||
function autorun() {
|
||||
if (!window.DEBUG) {
|
||||
|
|
|
@ -1,10 +1,10 @@
|
|||
#!/bin/sh
|
||||
|
||||
if [ -f "./public/index.html" ]; then
|
||||
if [ -f "./dist/index.html" ]; then
|
||||
GIT_COMMIT_HASH=$(git rev-parse --short HEAD)
|
||||
|
||||
echo -n "Update git commit hash in 'index.html' "
|
||||
sed -i -- "s/{GIT_COMMIT_HASH}/$GIT_COMMIT_HASH/g" ./public/index.html
|
||||
sed -i -- "s/{GIT_COMMIT_HASH}/$GIT_COMMIT_HASH/g" ./dist/index.html
|
||||
echo " Complete!"
|
||||
else
|
||||
echo "Run 'npm run build'"
|
||||
|
|
Loading…
Reference in New Issue