duzo zmian i funkcji

static/js/list_guest.js

@@ -0,0 +1,56 @@
+let currentItemId = null;
+
+function openNoteModal(event, itemId) {
+  event.stopPropagation();
+  currentItemId = itemId;
+  // Pobierz notatkę z HTML-a, jeśli chcesz pokazywać aktualną (opcjonalnie)
+  const noteEl = document.querySelector(`#item-${itemId} small`);
+  document.getElementById('noteText').value = noteEl ? noteEl.innerText : "";
+  const modal = new bootstrap.Modal(document.getElementById('noteModal'));
+  modal.show();
+}
+
+function submitNote(e) {
+  e.preventDefault();
+  const text = document.getElementById('noteText').value;
+
+  if (currentItemId !== null) {
+    socket.emit('update_note', { item_id: currentItemId, note: text });
+
+    const modal = bootstrap.Modal.getInstance(document.getElementById('noteModal'));
+    modal.hide();
+  }
+}
+
+document.addEventListener("DOMContentLoaded", () => {
+  document.querySelectorAll('.clickable-item').forEach(item => {
+    item.addEventListener('click', function(e) {
+      // Jeśli klik w button (np. Notatka), nie zaznaczaj
+      if (!e.target.closest('button') && e.target.tagName.toLowerCase() !== 'input') {
+        const checkbox = this.querySelector('input[type="checkbox"]');
+
+        if (checkbox.disabled) {
+          return;
+        }
+
+        if (checkbox.checked) {
+          socket.emit('uncheck_item', { item_id: parseInt(this.id.replace('item-', ''), 10) });
+        } else {
+          socket.emit('check_item', { item_id: parseInt(this.id.replace('item-', ''), 10) });
+        }
+
+        checkbox.disabled = true;
+        this.classList.add('opacity-50');
+
+        let existingSpinner = this.querySelector('.spinner-border');
+        if (!existingSpinner) {
+          const spinner = document.createElement('span');
+          spinner.className = 'spinner-border spinner-border-sm ms-2';
+          spinner.setAttribute('role', 'status');
+          spinner.setAttribute('aria-hidden', 'true');
+          checkbox.parentElement.appendChild(spinner);
+        }
+      }
+    });
+  });
+});

static/js/live.js

@@ -36,7 +36,7 @@ function setupList(listId, username) {
       item.onclick = () => {
         newItemInput.value = s;
         suggestionsBox.innerHTML = '';
-        newItemInput.focus();
+        //newItemInput.focus();
       };
       suggestionsBox.appendChild(item);
     });
@@ -119,6 +119,31 @@ function setupList(listId, username) {
     updateProgressBar();
   });
 
+  socket.on('note_updated', data => {
+    const itemEl = document.getElementById(`item-${data.item_id}`);
+    if (itemEl) {
+      // Szukamy <small> w całym elemencie
+      let noteEl = itemEl.querySelector('small');
+      if (noteEl) {
+        noteEl.innerHTML = `[ Notatka: <b>${data.note}</b> ]`;
+      } else {
+        const newNote = document.createElement('small');
+        newNote.className = 'text-danger ms-4';
+        newNote.innerHTML = `[ Notatka: <b>${data.note}</b> ]`;
+
+        // Znajdź wrapper flex-column
+        const flexColumn = itemEl.querySelector('.d-flex.flex-column');
+        if (flexColumn) {
+          flexColumn.appendChild(newNote);
+        } else {
+          // fallback: dodaj do elementu
+          itemEl.appendChild(newNote);
+        }
+      }
+    }
+    showToast('Notatka zaktualizowana!');
+  });
+
   socket.on('item_edited', data => {
     const nameSpan = document.getElementById(`name-${data.item_id}`);
     if (nameSpan) {
@@ -208,3 +233,4 @@ function showToast(message) {
   toastContainer.appendChild(toast);
   setTimeout(() => { toast.remove(); }, 1750);
 }
+