valentin/Projekcija
1
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases 7 Wiki Activity

predelava web vmesnika - zaslonska tipkovnica + drugi gumbi

Browse Source
This commit is contained in:
Valentin Korenjak
2026-03-16 21:52:38 +01:00
parent 4dd06bb7f0
commit 8c5fa82b2e
3 changed files with 488 additions and 269 deletions
Download Patch File Download Diff File Expand all files Collapse all files

74
web/templates/index.html
View File

@@ -3,41 +3,53 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, viewport-fit=cover">
<title>Projektor pesmi - Web vmesnik</title>
<title>Projektor pesmi</title>
<link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}">
</head>
<body>
<div class="container">
<!-- Gornja vrstica -->
<div class="top-bar">
<!-- <label for="song-number">Pesem:</label> -->
<input type="number" id="song-number" placeholder="Vpiši številko" min="0">
<button id="load-btn">▷</button>
<!-- <label for="search-query">Iskanje:</label>
<input type="text" id="search-query" placeholder="Naslovna beseda...">
<button id="search-btn">Išči</button> -->
<button id="caps-btn" class="btn-dark">A/a</button>
</div>
<!-- Sredenska vrstica - Prikaz -->
<div class="content">
<div id="display-area" class="lyrics-display">
<span class="status-message">Pripravljeno. Vpiši številko pesmi.</span>
</div>
</div>
<!-- Spodnja vrstica - Navigacija -->
<div class="bottom-bar">
<button id="prev-btn" class="btn◁-nav">◄</button>
<span id="page-info" class="page-info"></span>
<button id="dark-btn" class="btn-dark">■</button>
<span id="page-info-right" class="page-info"></span>
<button id="next-btn" class="btn-nav">►</button>
<div class="container">
<input type="text" id="song-number">
<div class="status-bar">
<span id="page-info" class="page-info"></span>
<button id="toggle-keypad-btn" class="toggle-keypad-btn" type="button">Skrij tipkovnico</button>
</div>
<div class="content">
<div id="display-area" class="lyrics-display">
<span class="status-message">Pripravljeno. Vpiši številko pesmi.</span>
</div>
</div>
<script src="{{ url_for('static', filename='script.js') }}"></script>
<div id="keypad-wrapper" class="keypad-wrapper">
<div class="keypad">
<button class="btn-key" data-key="7">7</button>
<button class="btn-key" data-key="8">8</button>
<button class="btn-key" data-key="9">9</button>
<button id="next-btn" class="btn-action">Zastri</button>
<button class="btn-key" data-key="4">4</button>
<button class="btn-key" data-key="5">5</button>
<button class="btn-key" data-key="6">6</button>
<button id="prev-btn" class="btn-action">Nazaj</button>
<button class="btn-key" data-key="1">1</button>
<button class="btn-key" data-key="2">2</button>
<button class="btn-key" data-key="3">3</button>
<button id="load-btn" class="btn-enter">Enter</button>
<button id="dark-btn" class="btn-dark">AAaa</button>
<button class="btn-key" data-key="0">0</button>
<button id="clear-btn" class="btn-clear">C</button>
</div>
</div>
</div>
<script src="{{ url_for('static', filename='script.js') }}"></script>
</body>
</html>