Sloučení testu

This commit is contained in:
2026-05-14 20:18:29 +02:00
parent 79ddfd4f3d
commit e2e498d2e3
22 changed files with 4498 additions and 0 deletions
+8
View File
@@ -0,0 +1,8 @@
# Playwright
node_modules/
/test-results/
/playwright-report/
/blob-report/
/playwright/.cache/
/playwright/.auth/
+18
View File
@@ -0,0 +1,18 @@
MIT License
Copyright (c) 2026 kankys
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.
+2
View File
@@ -0,0 +1,2 @@
# musicTest
+18
View File
@@ -0,0 +1,18 @@
import { test, expect } from '@playwright/test';
test('has title', async ({ page }) => {
await page.goto('https://playwright.dev/');
// Expect a title "to contain" a substring.
await expect(page).toHaveTitle(/Playwright/);
});
test('get started link', async ({ page }) => {
await page.goto('https://playwright.dev/');
// Click the get started link.
await page.getByRole('link', { name: 'Get started' }).click();
// Expects page to have a heading with the name of Installation.
await expect(page.getByRole('heading', { name: 'Installation' })).toBeVisible();
});
+97
View File
@@ -0,0 +1,97 @@
{
"name": "musictest",
"version": "1.0.0",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "musictest",
"version": "1.0.0",
"license": "ISC",
"devDependencies": {
"@playwright/test": "^1.60.0",
"@types/node": "^25.6.0"
}
},
"node_modules/@playwright/test": {
"version": "1.60.0",
"resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.60.0.tgz",
"integrity": "sha512-O71yZIbAh/PxDMNGns37GHBIfrVkEVyn+AXyIa5dOTfb4/xNvRWV+Vv/NMbNCtODB/pO7vLlF2OTmMVLhmr7Ag==",
"dev": true,
"license": "Apache-2.0",
"dependencies": {
"playwright": "1.60.0"
},
"bin": {
"playwright": "cli.js"
},
"engines": {
"node": ">=18"
}
},
"node_modules/@types/node": {
"version": "25.6.0",
"resolved": "https://registry.npmjs.org/@types/node/-/node-25.6.0.tgz",
"integrity": "sha512-+qIYRKdNYJwY3vRCZMdJbPLJAtGjQBudzZzdzwQYkEPQd+PJGixUL5QfvCLDaULoLv+RhT3LDkwEfKaAkgSmNQ==",
"dev": true,
"license": "MIT",
"dependencies": {
"undici-types": "~7.19.0"
}
},
"node_modules/fsevents": {
"version": "2.3.2",
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
"integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
"dev": true,
"hasInstallScript": true,
"license": "MIT",
"optional": true,
"os": [
"darwin"
],
"engines": {
"node": "^8.16.0 || ^10.6.0 || >=11.0.0"
}
},
"node_modules/playwright": {
"version": "1.60.0",
"resolved": "https://registry.npmjs.org/playwright/-/playwright-1.60.0.tgz",
"integrity": "sha512-hheHdokM8cdqCb0lcE3s+zT4t4W+vvjpGxsZlDnikarzx8tSzMebh3UiFtgqwFwnTnjYQcsyMF8ei2mCO/tpeA==",
"dev": true,
"license": "Apache-2.0",
"dependencies": {
"playwright-core": "1.60.0"
},
"bin": {
"playwright": "cli.js"
},
"engines": {
"node": ">=18"
},
"optionalDependencies": {
"fsevents": "2.3.2"
}
},
"node_modules/playwright-core": {
"version": "1.60.0",
"resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.60.0.tgz",
"integrity": "sha512-9bW6zvX/m0lEbgTKJ6YppOKx8H3VOPBMOCFh2irXFOT4BbHgrx5hPjwJYLT40Lu+4qtD36qKc/Hn56StUW57IA==",
"dev": true,
"license": "Apache-2.0",
"bin": {
"playwright-core": "cli.js"
},
"engines": {
"node": ">=18"
}
},
"node_modules/undici-types": {
"version": "7.19.2",
"resolved": "https://registry.npmjs.org/undici-types/-/undici-types-7.19.2.tgz",
"integrity": "sha512-qYVnV5OEm2AW8cJMCpdV20CDyaN3g0AjDlOGf1OW4iaDEx8MwdtChUp4zu4H0VP3nDRF/8RKWH+IPp9uW0YGZg==",
"dev": true,
"license": "MIT"
}
}
}
+19
View File
@@ -0,0 +1,19 @@
{
"name": "musictest",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {},
"repository": {
"type": "git",
"url": "https://git.arch-linux.cz/kankys/musicTest.git"
},
"keywords": [],
"author": "",
"license": "ISC",
"type": "commonjs",
"devDependencies": {
"@playwright/test": "^1.60.0",
"@types/node": "^25.6.0"
}
}
+79
View File
@@ -0,0 +1,79 @@
import { defineConfig, devices } from '@playwright/test';
/**
* Read environment variables from file.
* https://github.com/motdotla/dotenv
*/
// import dotenv from 'dotenv';
// import path from 'path';
// dotenv.config({ path: path.resolve(__dirname, '.env') });
/**
* See https://playwright.dev/docs/test-configuration.
*/
export default defineConfig({
testDir: './e2e',
/* Run tests in files in parallel */
fullyParallel: true,
/* Fail the build on CI if you accidentally left test.only in the source code. */
forbidOnly: !!process.env.CI,
/* Retry on CI only */
retries: process.env.CI ? 2 : 0,
/* Opt out of parallel tests on CI. */
workers: process.env.CI ? 1 : undefined,
/* Reporter to use. See https://playwright.dev/docs/test-reporters */
reporter: 'html',
/* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
use: {
/* Base URL to use in actions like `await page.goto('')`. */
// baseURL: 'http://localhost:3000',
/* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
trace: 'on-first-retry',
},
/* Configure projects for major browsers */
projects: [
{
name: 'chromium',
use: { ...devices['Desktop Chrome'] },
},
{
name: 'firefox',
use: { ...devices['Desktop Firefox'] },
},
{
name: 'webkit',
use: { ...devices['Desktop Safari'] },
},
/* Test against mobile viewports. */
// {
// name: 'Mobile Chrome',
// use: { ...devices['Pixel 5'] },
// },
// {
// name: 'Mobile Safari',
// use: { ...devices['iPhone 12'] },
// },
/* Test against branded browsers. */
// {
// name: 'Microsoft Edge',
// use: { ...devices['Desktop Edge'], channel: 'msedge' },
// },
// {
// name: 'Google Chrome',
// use: { ...devices['Desktop Chrome'], channel: 'chrome' },
// },
],
/* Run your local dev server before starting the tests */
// webServer: {
// command: 'npm run start',
// url: 'http://localhost:3000',
// reuseExistingServer: !process.env.CI,
// },
});
+20
View File
@@ -0,0 +1,20 @@
import { test, expect } from '@playwright/test';
test('has title', async ({ page }) => {
await page.goto('https://music.lukan.cz');
// Expect a title "to contain" a substring.
await expect(page).toHaveTitle(/Zažij numetal a grunge každý den, po celý rok./);
});
test('get started link', async ({ page }) => {
await page.goto('https://music.lukan.cz');
// // Click the get started link.
// await page.getByRole('link', { name: 'O projektu' }).click();
// // Expects page to have a heading with the name of Installation.
// await expect(page.getByRole('heading', { name: 'Installation' })).toBeVisible();
});
+9
View File
@@ -0,0 +1,9 @@
MIT License
Copyright (c) 2025 Kankys
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.
+8
View File
@@ -0,0 +1,8 @@
# 💿 Každý den jedno album. 🎸 Zažíj numetal a grunge každý den.
## 💪 Zvládneš tuto výzvu v roce 2026?
## 🤟 Ukaž že na to máš .
Odkaz na [výzvu](https://music.lukan.cz)
Do konce roku jedeme v testovacím režimu, od 1.1.2026 začínáme na ostro.
+217
View File
@@ -0,0 +1,217 @@
<!DOCTYPE html>
<html lang="cs">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>O projektu a další žvásty</title>
<meta property="og:type" content="website" />
<meta property="og:url" content="https://music.lukan.cz/" />
<meta property="og:title" content="Hudební Výzva 2026: Grunge & Nu-Metal" />
<meta
property="og:description"
content="Každý den jedno zásadní album. Zvládneš to se mnou? 365 dní, 365 desek."
/>
<meta
property="og:image"
content="https://music.lukan.cz/img/vyzva-EDIT.jpg"
/>
<meta name="twitter:card" content="summary_large_image" />
<meta
name="twitter:title"
content="Hudební Výzva 2026: Grunge & Nu-Metal"
/>
<meta
name="twitter:description"
content="Každý den jedno zásadní album. Přidej se!"
/>
<meta
name="twitter:image"
content="https://music.lukan.cz/img/vyzva-EDIT.jpg"
/>
<meta
name="Hudební kalendář"
content="Každý den jedno album. Zažíj numetal a grunge každý den."
/>
<link rel="stylesheet" href="styleabout.css" />
<link rel="shortcut icon" href="img/electric-guitar_12494348.png" />
<link rel="stylesheet" href="style.css" />
<style>
/* Specifické styly pro textovou stránku */
.about-container {
max-width: 800px;
margin: 0 auto;
text-align: left;
background: white;
padding: 40px;
border-radius: 10px;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
line-height: 1.6;
}
.about-container h1 {
text-align: center;
text-transform: uppercase;
color: #d32f2f; /* Trochu agresivní červená */
font-size: 2.5em;
margin-bottom: 10px;
}
.subtitle {
text-align: center;
color: #666;
font-style: italic;
margin-bottom: 40px;
font-size: 1.2em;
}
.about-section {
margin-bottom: 30px;
border-bottom: 1px solid #eee;
padding-bottom: 20px;
}
.about-section:last-child {
border-bottom: none;
}
h3 {
color: #222;
font-weight: 900; /* Extra tučné */
}
.back-btn {
display: block;
width: fit-content;
margin: 40px auto 0;
text-align: center;
}
footer {
text-align: center;
}
</style>
</head>
<body>
<div class="about-container">
<h1>🎸 Zažij numetal a grunge každý den, po celý rok. 💿</h1>
<p class="subtitle">
<strong
>💿 Každý den jedno album. 💪 Zvládneš tuto výzvu v roce 2026? 🤟 Ukaž
že na to máš.</strong
>
</p>
<div class="about-section">
<h3>O projektu</h3>
<p>
Všimli jste si, jak nás algoritmy Spotify a dalších hudebních stream
služeb neustále točí v kruhu? Nabízejí nám pořád to samé, co už známe.
Řekl jsem si to není pro mne. Chtěl jsem se vrátit k poslechu od
první do poslední skladby. A tak vznikl můj projekt: Hudební výzva
2026.
</p>
<br />
<p>
Každý den jedno album. To nejšpinavější a nejupřímnější, co hudba za
posledních 30 let nabídla: Grunge a Nu-Metal.
</p>
<p>
Mnoho lidí tyto dva žánry odděluje. Grunge je pro ně "ta stará hudba v
kostkovaných košilích" a Nu-Metal jsou "ti týpci v kšiltovkách a
širokých kalhotách". Ale když se zaposloucháte pozorně, zjistíte, že
jsou to pokrevní bratři.
</p>
<br />
<p>
Když Seattle zhasnul světla Grunge (Nirvana, Soundgarden, Pearl Jam)
na začátku 90. let smetl nablýskaný rock. Byla to hudba deště, deprese
a reality. Žádná póza, jen syrová emoce a kytary, které zněly jako by
je někdo tahal bahnem.
</p>
<p>
Jenže v polovině 90. let grunge s smrtí Kurta Cobaina a rozpadem scény
utichl. Vzniklo ticho. A v tom tichu se začalo rodit něco nového,
agresivnějšího.
</p>
<br />
<p>
Nástup Nu-Metalu: Vzteklý mladší brácha Zatímco grunge byl o smutku a
apatii, Nu-Metal (Korn, Linkin Park, Limp Bizkit, Slipknot) byl o
čistém vzteku. Vzali ty podladěné, těžké kytary z grunge, ale místo
pomalého tempa přidali rytmiku hip-hopu a elektroniku.
</p>
<p>
Kytarista Alice in Chains Jerry Cantrell nebo soundgardenovský Kim
Thayil položili základy pro zvuk, který později kapely jako Korn
dotáhly do extrému sedmistrunnými kytarami.
</p>
<br />
<p>
Ta energie je nenahraditelná. V dnešní době vyžehleného popu chybí ta
lidská nedokonalost a dravost.
</p>
<br />
<p>
Vytvořil jsem jednoduchou webovou aplikaci, která mi (a teď i vám)
každý den servíruje jedno zásadní album z této éry. Někdy je to
depresivní grungeová balada, jindy agresivní nu-metalová smršť.
</p>
<br />
<p>
Zvu vás, abyste do toho šli se mnou. Nemusíte hledat, co si pustit.
Stačí otevřít aplikaci a nechat se vést.
</p>
<br />
<p>
(PS: Aplikaci jsem si naprogramoval sám, tak buďte shovívaví, jde
hlavně o tu hudbu! 🤘 Budu velmi rád za sdílení 🙏)
</p>
</div>
<div class="back-btn">
<a href="index.html" class="btn-main" style="text-decoration: none"
>🎸 Zpět na hudbu</a
>
</div>
<div class="footer-section>">
<footer>
<p style="padding-top: 30px;">Líbí se ti výběr? Sleduj mě:</p>
<div class="socials">
<a
href="https://bsky.app/profile/kankys.bsky.social"
target="_blank" class="links"
>Bluesky</a
>
<br />
<a href="https://codeberg.org/Kankys" target="_blank" class="links">Codeberg</a>
<br />
<a
href="https://lukaskanka.cz/index/about/index.html"
target="_blank" class="links"
>Pokud chčeš podpořit tento projekt veškeré informace najdeš
zde.</a
>
<p class="hastag">
#GrungeMetalRok #HudebniVyzva #NuMetal #AlbumDne #TipNaHudbu
#DnesPosloucham #Tidal #Spotify #KazdyDenJednoAlbum
</p>
</div>
<p class="copyright">&copy; 2025 - 2026 Tvůj Hudební Kurátor Kankys</p>
<p style="font-size: 0.8em; margin-top: 10px">
<a href="gdpr.html" class="links"
>Ochrana soukromí a jiné žvásty (GDPR)</a
>
</p>
<section class="photo">
<img
id="vyzva"
class="zoom"
src="./img/vyzva-EDIT.jpg"
alt="Výzva"
/>
</section>
<a href="https://www.facebook.com/groups/1802260010492466" target="_blank" style="color: rgb(88, 88, 227);"><h3>FACEBOOK</h3></a>
</footer>
</div>
</div>
<script src="scriptabout.js"></script>
</body>
</html>
+96
View File
@@ -0,0 +1,96 @@
<!DOCTYPE html>
<html lang="cs">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>GDPR | Nikoho nezajímáš</title>
<link rel="stylesheet" href="style.css">
<style>
/* Specifické styly pro textovou stránku */
.gdpr-container {
max-width: 800px;
margin: 0 auto;
text-align: left;
background: white;
padding: 40px;
border-radius: 10px;
box-shadow: 0 4px 15px rgba(0,0,0,0.1);
line-height: 1.6;
}
.gdpr-container h1 {
text-align: center;
text-transform: uppercase;
color: #d32f2f; /* Trochu agresivní červená */
font-size: 2.5em;
margin-bottom: 10px;
}
.subtitle {
text-align: center;
color: #666;
font-style: italic;
margin-bottom: 40px;
font-size: 1.2em;
}
.gdpr-section {
margin-bottom: 30px;
border-bottom: 1px solid #eee;
padding-bottom: 20px;
}
.gdpr-section:last-child {
border-bottom: none;
}
h3 {
color: #222;
font-weight: 900; /* Extra tučné */
}
.back-btn {
display: block;
width: fit-content;
margin: 40px auto 0;
text-align: center;
}
</style>
</head>
<body>
<div class="gdpr-container">
<h1>GDPR & Soukromí</h1>
<p class="subtitle">Aneb: "We don't care about your data, we care about the music."</p>
<div class="gdpr-section">
<h3>1. Kdo jsem?</h3>
<p>Jsem Lukáš. Mám rád hudbu, kódování a klid. Nejsem korporát, nemám právní oddělení a nemám zájem tě špehovat. Mark Zuckerberg o tobě ví všechno, já nevím nic. A tak to zůstane.</p>
</div>
<div class="gdpr-section">
<h3>2. Sbírám Cookies?</h3>
<p><strong>Ne.</strong> Jediné cookies, které mě zajímají, jsou ty čokoládové, co jsem snědl, když jsem tuhle stránku programoval ve tři ráno. Limp Bizkit sice zpívali "Do it all for the Nookie", ale nedělám to pro Cookie.</p>
<p>Tato stránka nepoužívá Google Analytics, Facebook Pixel, ani žádné jiné šmírovací nástroje. </p>
</div>
<div class="gdpr-section">
<h3>3. Co o tobě vím?</h3>
<p>Vlastně nic. Tato aplikace běží ve tvém prohlížeči. </p>
<p><em>Technická vsuvka pro rýpaly:</em> Web běží na běžném hostingu (Lukan.cz). Hostingové servery si ze zákona a z bezpečnostních důvodů mohou ukládat do logů tvoji IP adresu, aby věděly, kam tu stránku poslat. Já ty logy nečtu. Je v nich nuda.</p>
</div>
<div class="gdpr-section">
<h3>4. Spotify, Tidal a ti druzí</h3>
<p>Na webu jsou tlačítka, která vedou na Spotify, Tidal. Jakmile na ně klikneš a odejdeš z mého webu, jsi v jejich teritoriu. </p>
<p>Oni už data sbírají. Vědí, že tajně posloucháš Britney Spears, i když tvrdíš, že jsi drsňák. To už je mezi tebou a jimi. Já za to nemůžu.</p>
</div>
<div class="gdpr-section">
<h3>5. Kontakt</h3>
<p>Pokud máš pocit, že jsem narušil tvou auru nebo máš dotaz:</p>
<p>📧 Napiš mi. <a href="https://lukaskanka.cz/index/about/index.html" target="_blank" class="links">Kontakt</a> najdeš na mém hlavním <a href="https://lukaskanka.cz/index/about/index.html" target="_blank" class="links">webu</a>. Nebo na <a href="https://bsky.app/profile/kankys.bsky.social" target="_blank" class="links">Bluesky</a>. Nebo si prostě pusť Nirvanu a neřeš to.</p>
</div>
<div class="back-btn">
<a href="index.html" class="btn-main" style="text-decoration: none;">🎸 Zpět na hudbu</a>
</div>
</div>
</body>
</html>
Binary file not shown.

After

Width:  |  Height:  |  Size: 313 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 39 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 102 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 458 KiB

+68
View File
@@ -0,0 +1,68 @@
<!DOCTYPE html>
<html lang="cs">
<head>
<meta charset="UTF-8" />
<title>Zažij numetal a grunge každý den, po celý rok.</title>
<meta property="og:type" content="website" />
<meta property="og:url" content="https://music.lukan.cz/" />
<meta property="og:title" content="Hudební Výzva 2026: Grunge & Nu-Metal" />
<meta
property="og:description"
content="Každý den jedno zásadní album. Zvládneš to se mnou? 365 dní, 365 desek."
/>
<meta
property="og:image"
content="https://music.lukan.cz/img/vyzva-EDIT.jpg"
/>
<meta name="twitter:card" content="summary_large_image" />
<meta
name="twitter:title"
content="Hudební Výzva 2026: Grunge & Nu-Metal"
/>
<meta
name="twitter:description"
content="Každý den jedno zásadní album. Přidej se!"
/>
<meta
name="twitter:image"
content="https://music.lukan.cz/img/vyzva-EDIT.jpg"
/>
<meta
name="Hudební kalendář"
content="Každý den jedno album. Zažíj numetal a grunge každý den."
/>
<link rel="stylesheet" href="style.css" />
<link rel="shortcut icon" href="img/electric-guitar_12494348.png" />
<script defer src="https://analytics.lukan.cz/script.js" data-website-id="380320b5-153c-4d12-a6c6-49f28e0daa86"></script>
</head>
<body>
<h1>🎸 Zažij numetal a grunge každý den, po celý rok. 💿</h1>
<p>
<strong
>💿 Každý den jedno album. 💪 Zvládneš tuto výzvu v roce 2026? 🤟 Ukaž
že na to máš.</strong
>
</p>
<div id="zobrazeni-alba"></div>
<div style="margin-top: 30px; margin-bottom: 20px">
<button id="btn-archiv" class="btn-main">
📂 Zobrazit předchozí alba
</button>
</div>
<div id="archiv-container" class="archiv-grid"></div>
<div style="margin-top: 30px; margin-bottom: 20px">
<button id="btn-footer" class="btn-footer"><br/>
<a href="gdpr.html" class="link-footer"
>Ochrana soukromí a jiné žvásty (GDPR)
<p class="copyright">&copy; 2025 - 2026 Tvůj Hudební Kurátor Kankys</p></a
>
</button>
</div>
<section class="photo">
<img id="vyzva" class="zoom" src="./img/vyzva-EDIT.jpg" alt="Výzva" />
</section>
<script src="musicData.js"></script>
<script src="script.js"></script>
</body>
</html>
+3557
View File
File diff suppressed because it is too large Load Diff
+104
View File
@@ -0,0 +1,104 @@
// --- 2. ZJIŠTĚNÍ DNEŠNÍHO DATA ---
// objekt s aktuálním časem
const datum = new Date();
// rok, měsíc a den podle LOKÁLNÍHO času počítače
const rok = datum.getFullYear();
// Leden je v JS 0, proto přičíst 1.
// .padStart(2, '0') zajistí, že před jednociferné číslo se dá nula (např. "05")
const mesic = String(datum.getMonth() + 1).padStart(2, '0');
const den = String(datum.getDate()).padStart(2, '0');
// formát "RRRR-MM-DD"
const dnes = `${rok}-${mesic}-${den}`;
// výpis do konzole
// console.log("Opravené datum (lokální):", dnes);
// Pro testování:
// const dnes = "2026-07-25";
console.log("Dnes je:", dnes);
// --- 3. HLEDÁNÍ V SEZNAMU ---
// Funkce .find() projde pole 'kalendarAlb' a hledá shodu data
const dnesniAlbum = kalendarAlb.find(album => album.datum === dnes);
// --- 4. ZOBRAZENÍ NA STRÁNCE ---
const vystup = document.getElementById('zobrazeni-alba');
if (dnesniAlbum) {
// Dnešní album
vystup.innerHTML = `
<div class="album-card">
<div class="datum">🗓️ ${dnesniAlbum.datum}</div>
<img src="${dnesniAlbum.img}" alt="Obal alba">
<h2>${dnesniAlbum.umelec}</h2>
<h3>${dnesniAlbum.nazev}</h3>
<p><strong>Vyšlo</strong> ${dnesniAlbum.vydano}</p>
<p>${dnesniAlbum.recenze}</p>
<a href="${dnesniAlbum.tidal}" target="_blank" class="btn tidal">Tidal</a> - <a href="${dnesniAlbum.spotify}" target="_blank" class="btn spotify">Spotify</a>
<p><a href="./about.html" class="btn about">👉🏻 O projektu 👈🏻</a></p>
</div>
`;
} else {
// Alert bez alba
vystup.innerHTML = `
<div class="album-card">
<h3>Dnes není v plánu žádné album 🎵</h3>
<p>Zkus se podívat zítra!</p>
</div>
`;
}
// --- 6. LOGIKA PRO ARCHIV (Předchozí alba) ---
const btnArchiv = document.getElementById('btn-archiv');
const divArchiv = document.getElementById('archiv-container');
btnArchiv.addEventListener('click', () => {
// A. Zkontrolujeme, jestli je archiv už otevřený
if (divArchiv.innerHTML !== "") {
divArchiv.innerHTML = ""; // Pokud ano, vymažeme ho (zavřeme)
btnArchiv.textContent = "📂 Zobrazit předchozí alba";
return; // Ukončíme funkci
}
// B. Vyfiltrujeme alba, která jsou starší než dnešek
// (Předpokládá, že proměnná 'dnes' a 'kalendarAlb' existují z předchozího kódu)
const minulaAlba = kalendarAlb.filter(album => album.datum < dnes);
// C. Seřadíme je, aby nahoře bylo to nejnovější z minulosti
minulaAlba.sort((a, b) => b.datum.localeCompare(a.datum));
// D. Pokud žádná minulá alba nejsou
if (minulaAlba.length === 0) {
divArchiv.innerHTML = "<p>Zatím tu žádná historie není. Přijď zítra! ⏳</p>";
return;
}
// E. Vykreslíme kartičky
let htmlObsah = "";
minulaAlba.forEach(album => {
htmlObsah += `
<div class="archiv-item">
<div class="datum">${album.datum}</div>
<img src="${album.img}" alt="${album.nazev}">
</a>
<h3>${album.umelec}</h3>
<div>${album.nazev}</div>
<br>
<div>${album.recenze}</div>
</div>
`;
});
divArchiv.innerHTML = htmlObsah;
btnArchiv.textContent = "❌ Zavřít archiv";
});
+10
View File
@@ -0,0 +1,10 @@
// --- 5. Photo Gallery -> section (zoom)
const img = document.querySelector(".zoom");
img.addEventListener("mouseenter", () => {
img.style.transform = "scale(10.2)";
});
img.addEventListener("mouseleave", () => {
img.style.transform = "scale(1)";
});
+168
View File
@@ -0,0 +1,168 @@
body {
font-family: sans-serif;
text-align: center;
padding: 50px;
background-image: url(./img/4525586.jpg);
/* Tímto zajistíte, že se tapeta při scrollování nehýbe */
background-attachment: fixed;
/* Tímto zakážete opakování obrázku "dokola" */
background-repeat: no-repeat;
/* DOPORUČENÉ: Roztáhne obrázek přes celou obrazovku */
background-size: cover;
/* Vycentruje obrázek, aby byl vždy uprostřed */
background-position: center;
}
.album-card {
background: grey;
padding: 20px;
border-radius: 10px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
display: inline-block;
max-width: 400px;
}
img {
width: 100%;
border-radius: 5px;
margin-bottom: 15px;
}
h1 {
color: black;
}
h2 {
color: black;
}
.smile {
color: black;
}
.datum {
color: red;
font-size: 0.9em;
margin-bottom: 10px;
font-weight: bold;
}
.hastag {
color: black;
}
#vyzva {
width: 7%;
height: auto;
}
/* Styl pro tlačítka streamovacích služeb */
.btn {
display: inline-block; /* Aby měly rozměry */
text-decoration: none; /* Zruší podtržení */
padding: 10px 20px; /* Vnitřní odsazení (prostor kolem textu) */
border-radius: 25px; /* Kulaté rohy */
color: white; /* Bílé písmo */
font-weight: bold;
margin: 5px; /* Mezera mezi tlačítky */
transition: transform 0.2s; /* Animace při najetí */
}
/* Barvy pro konkrétní služby */
.tidal {
background-color: #000000;
} /* Černá pro Tidal */
.spotify {
background-color: #1db954;
} /* Zelená pro Spotify */
.about {
background-color: #333;
} /* Hmědá o projektu */
.btn:hover {
transform: scale(1.05); /* Při najetí myší se tlačítko trochu zvětší */
opacity: 0.9;
}
@media (max-width: 768px) {
body {
padding: 10px;
}
/* .album-card {
width: 90%;
margin: 0 auto;
padding: 20px;
background-color: #f0f0f0;
} */
}
/*Archív alb */
/* Styl pro hlavní tlačítko archivu */
.btn-main {
background-color: #333;
color: white;
padding: 15px 30px;
border: none;
border-radius: 50px;
font-size: 1.1em;
cursor: pointer;
transition: background 0.3s;
font-weight: bold;
}
.btn-main:hover {
background-color: #555;
}
/* Mřížka pro archiv (aby byly kartičky vedle sebe) */
.archiv-grid {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 20px;
max-width: 1000px;
margin: 0 auto;
}
/* Menší kartička pro archiv */
.archiv-item {
background: white;
padding: 15px;
border-radius: 8px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
width: 250px; /* Pevná šířka */
text-align: center;
}
.archiv-item img {
width: 100%;
border-radius: 4px;
margin-bottom: 10px;
}
.archiv-item h3 {
font-size: 1em;
margin: 5px 0;
}
.archiv-item .datum {
font-size: 0.8em;
color: #888;
}
.btn-footer {
/* background-color: #333;
color: white;
padding: 15px 30px; */
border: none;
border-radius: 20px;
/* font-size: 1.1em; */
cursor: pointer;
transition: background 0.3s;
font-weight: bold;
background-color: violet;
}
.link-footer {
text-decoration: none; /* Zruší podtržení */
color: black;
}
/* odkazy */
.links {
color: blueviolet; text-decoration: none;
}