Dialog O programu #9

web/static/script.js

@@ -10,6 +10,9 @@ const darkBtn = document.getElementById('dark-btn');
 const splitBtn = document.getElementById('split-btn');
 const pageInfo = document.getElementById('page-info');
 const clearBtn = document.getElementById('clear-btn');
+const aboutBtn = document.getElementById('about-btn');
+const aboutModal = document.getElementById('about-modal');
+const aboutCloseBtn = document.getElementById('about-close-btn');
 const keypadButtons = document.querySelectorAll('.btn-key');
 const keypadWrapper = document.getElementById('keypad-wrapper');
 const toggleKeypadBtn = document.getElementById('toggle-keypad-btn');
@@ -345,6 +348,36 @@ async function saveSongEdit() {
     }
 }
 
+// Odpri About dialog
+async function openAbout() {
+    try {
+        const response = await fetch('/api/app_info');
+        const data = await response.json();
+
+        if (data.error) {
+            alert('Napaka pri pridobivanju informacij o programu.');
+            return;
+        }
+
+        document.getElementById('about-name').textContent = data.name;
+        document.getElementById('about-version').textContent = 'Verzija ' + data.version;
+        document.getElementById('about-description').textContent = data.description;
+
+        const authorsList = document.getElementById('about-authors');
+        authorsList.innerHTML = '';
+        data.authors.forEach(author => {
+            const li = document.createElement('li');
+            li.textContent = author;
+            authorsList.appendChild(li);
+        });
+
+        aboutModal.classList.add('show');
+        menuDropdown.classList.remove('show');
+    } catch (error) {
+        console.error('Napaka pri pridobivanju informacij o programu:', error);
+    }
+}
+
 // skrij/pokaži tipkovnico
 function toggleKeypad() {
     if (!keypadWrapper || !toggleKeypadBtn) return;
@@ -419,6 +452,20 @@ if (toggleKeypadBtn) {
     });
 }
 
+// O programu
+if (aboutBtn) {
+    aboutBtn.addEventListener('click', () => {
+        vibrate();
+        openAbout();
+    });
+}
+
+if (aboutCloseBtn) {
+    aboutCloseBtn.addEventListener('click', () => {
+        aboutModal.classList.remove('show');
+    });
+}
+
 // Uredi besedilo
 if (editSongBtn) {
     editSongBtn.addEventListener('click', () => {
@@ -489,6 +536,10 @@ document.addEventListener('click', (e) => {
     if (menuDropdown && !menuDropdown.contains(e.target) && e.target !== menuToggle) {
         menuDropdown.classList.remove('show');
     }
+    // Zapri About modal ob kliku izven vsebine
+    if (e.target === aboutModal) {
+        aboutModal.classList.remove('show');
+    }
 });
 
 // Iskanje dogodki