155 lines
6.6 KiB
HTML
155 lines
6.6 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<meta name="description" content="Logopedická hra pre najmenších">
|
|
<meta name="author" content="Adam Reňak">
|
|
<meta name="keywords" content="Adam Reňak, Joj_Dobre, Diplomová práca, Logopedická hra, TUKE">
|
|
<title>Baník Jožino: Logopedická hra - Diplomová práca</title>
|
|
<link rel="stylesheet" type="text/css" href="css/style.css" />
|
|
|
|
<!-- Načítanie fontu Luckiest Guy z Google Fonts -->
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link href="https://fonts.googleapis.com/css2?family=Luckiest+Guy&display=swap" rel="stylesheet">
|
|
|
|
<link rel="stylesheet" type="text/css" href="css/pexeso-menu.css" />
|
|
|
|
<link rel="icon" type="image/png" href="images/banik.ico">
|
|
<link rel="shortcut icon" href="images/icons/banik.ico">
|
|
</head>
|
|
|
|
<body>
|
|
<!-- LOADING -->
|
|
<div id="loading-screen" class="loading-screen">
|
|
<div class="loading-content">
|
|
<div class="loading-logo">
|
|
<div class="loading-text-jozino">JOŽINO</div>
|
|
<div class="loading-text-banik">BANÍK</div>
|
|
</div>
|
|
<div class="loading-spinner"></div>
|
|
<div class="loading-message">Načítavam...</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="container">
|
|
<!-- ľavá sekcia -->
|
|
<div class="left-section">
|
|
<!-- Logo sekcia -->
|
|
<div class="logo-container">
|
|
<div class="logo-text">
|
|
<div class="text-jozino">JOŽINO</div>
|
|
<div class="text-banik">BANÍK</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Menu sekcia -->
|
|
<div class="menu-container">
|
|
<nav class="main-menu">
|
|
<ul>
|
|
<li><a href="worldsmenu.html" alt="Spustiť hru" class="menu-button primary"><span>ŠTART</span></a></li>
|
|
<li><a href="#pravidla" alt="Pravidlá" class="menu-button show-rules">PRAVIDLÁ</a></li>
|
|
<li><a href="#projekt" alt="O projekte" class="menu-button show-about">O PROJEKTE</a></li>
|
|
<!--<li><a href="game.html" alt="Banik" class="menu-button"><span>TEST Bana</span></a></li>-->
|
|
<!--<li><a href="pexeso.html" alt="Jozino" class="menu-button"><span>Test PEXESO</span></a></li>-->
|
|
<li><a href="superjozino.html" alt="Jozino" class="menu-button"><span>TEST JOZINO</span></a></li>
|
|
</ul>
|
|
</nav>
|
|
</div>
|
|
|
|
<!-- Radiálny gradient pozadí objekt pod menu -->
|
|
<div class="radial-background"></div>
|
|
</div>
|
|
|
|
|
|
<!-- pravá sekcia -->
|
|
<div class="right-section">
|
|
<div class="character-container">
|
|
<!-- Obrázok postavičky baníka -->
|
|
<img src="images/banik.png" alt="Jožino Baník" class="character-image">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
<!-- Modálne okno pre pravidlá -->
|
|
<div id="rules-modal" class="modal">
|
|
<div class="close">X</div>
|
|
<div class="modal-content">
|
|
<h2>Pravidlá hry</h2>
|
|
<div class="modal-arrow-up"></div>
|
|
<div class="modal-text-content">
|
|
<p>
|
|
Vitaj v hre Baník Jožino! Tvojou úlohou je preberať rolu odvážneho baníka a
|
|
hľadať vzácne poklady ukryté v hlbokách podzemnej jaskyne.
|
|
<br><br>
|
|
<span>Ovládanie postavy:</span><br>
|
|
Použi šípky na klávesnici alebo klávesy WASD na pohyb postavy po svete.
|
|
Na vykopanie pokladu stlač medzerník.
|
|
<br><br>
|
|
<span>Drahokamy:</span><br>
|
|
V hre sa vyskytujú 3 druhy drahokamov: Zlato, Diamant a Fialový Kryštál.
|
|
Na vykopanie diamantu musíš splniť rečové cvičenie. Na vykopanie kryštálu
|
|
zase posluchové cvičenie.
|
|
<br><br>
|
|
<span>Ciele hry:</span><br>
|
|
Pokús sa nazbierať čo najviac pokladov v stanovenom čase. Každý typ
|
|
drahokamu ti prinesie iný počet bodov. Buď opatrný a užívaj si dobrodružstvo!
|
|
<br><br>
|
|
<span>Ovládanie postavy:</span><br>
|
|
Použi šípky na klávesnici alebo klávesy WASD na pohyb postavy po svete.
|
|
Na vykopanie pokladu stlač medzerník.
|
|
<br><br>
|
|
<span>Drahokamy:</span><br>
|
|
V hre sa vyskytujú 3 druhy drahokamov: Zlato, Diamant a Fialový Kryštál.
|
|
Na vykopanie diamantu musíš splniť rečové cvičenie. Na vykopanie kryštálu
|
|
zase posluchové cvičenie.
|
|
<br><br>
|
|
<span>Ciele hry:</span><br>
|
|
Pokús sa nazbierať čo najviac pokladov v stanovenom čase. Každý typ
|
|
drahokamu ti prinesie iný počet bodov. Buď opatrný a užívaj si dobrodružstvo!
|
|
</p>
|
|
</div>
|
|
<div class="modal-arrow-down"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Modálne okno pre informacie -->
|
|
<div id="about-modal" class="modal">
|
|
<div class="close">X</div>
|
|
<div class="modal-content">
|
|
<h2>O Projekte</h2>
|
|
<div class="modal-arrow-up"></div>
|
|
<div class="modal-text-content">
|
|
<p>
|
|
Baník Jožino je interaktívna logopedická hra vytvorená v rámci diplomovej práce.
|
|
<br><br>
|
|
<span>Cieľ:</span><br>
|
|
Pomôcť deťom s rozvojom správnej výslovnosti a artikulácie pomocou hravých cvičení.
|
|
<br><br>
|
|
<span>Technológie:</span><br>
|
|
HTML5, CSS, JavaScript
|
|
<br><br>
|
|
<span>Autor:</span><br>
|
|
Adam Reňak<br>
|
|
Technická univerzita v Košiciach<br>
|
|
Fakulta elektrotechniky a informatiky
|
|
<br><br>
|
|
<span>Rok:</span><br>
|
|
2025
|
|
</p>
|
|
</div>
|
|
<div class="modal-arrow-down"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- JavaScript pre interaktivitu -->
|
|
<script src="js/basics/menu.js"></script>
|
|
<script src="js/pexeso/menu-pexeso.js"></script>
|
|
|
|
</body>
|
|
</html>
|
|
|