Kontakt-Modul

frontend/js/mobile.js

@@ -318,16 +318,19 @@ class MobileManager {
     // Don't swipe if modal is open
     if ($('.modal-overlay:not(.hidden)')) return;
 
-    // Don't swipe on scrollable elements
+    // Don't swipe on specific interactive elements, but allow swipe in column-body
     const target = e.target;
-    if (target.closest('.column-body') ||
-        target.closest('.modal') ||
+    if (target.closest('.modal') ||
         target.closest('.calendar-grid') ||
         target.closest('.knowledge-entry-list') ||
         target.closest('.list-table') ||
         target.closest('input') ||
         target.closest('textarea') ||
-        target.closest('select')) {
+        target.closest('select') ||
+        target.closest('button') ||
+        target.closest('a[href]') ||
+        target.closest('.task-card .priority-stars') ||
+        target.closest('.task-card .task-counts')) {
       return;
     }
 
@@ -372,18 +375,36 @@ class MobileManager {
     // Prevent scroll
     e.preventDefault();
 
-    // Show indicators
-    const currentIndex = this.viewOrder.indexOf(this.currentView);
-
-    if (deltaX > this.SWIPE_THRESHOLD && currentIndex > 0) {
-      this.swipeIndicatorLeft?.classList.add('visible');
-      this.swipeIndicatorRight?.classList.remove('visible');
-    } else if (deltaX < -this.SWIPE_THRESHOLD && currentIndex < this.viewOrder.length - 1) {
-      this.swipeIndicatorRight?.classList.add('visible');
-      this.swipeIndicatorLeft?.classList.remove('visible');
+    // Show indicators based on current view
+    if (this.currentView === 'board') {
+      // In board view: show column navigation indicators
+      const columns = $$('.column');
+      const currentColumnIndex = this.getCurrentColumnIndex();
+      
+      if (deltaX > this.SWIPE_THRESHOLD && currentColumnIndex > 0) {
+        this.swipeIndicatorLeft?.classList.add('visible');
+        this.swipeIndicatorRight?.classList.remove('visible');
+      } else if (deltaX < -this.SWIPE_THRESHOLD && currentColumnIndex < columns.length - 1) {
+        this.swipeIndicatorRight?.classList.add('visible');
+        this.swipeIndicatorLeft?.classList.remove('visible');
+      } else {
+        this.swipeIndicatorLeft?.classList.remove('visible');
+        this.swipeIndicatorRight?.classList.remove('visible');
+      }
     } else {
-      this.swipeIndicatorLeft?.classList.remove('visible');
-      this.swipeIndicatorRight?.classList.remove('visible');
+      // In other views: show view navigation indicators
+      const currentIndex = this.viewOrder.indexOf(this.currentView);
+
+      if (deltaX > this.SWIPE_THRESHOLD && currentIndex > 0) {
+        this.swipeIndicatorLeft?.classList.add('visible');
+        this.swipeIndicatorRight?.classList.remove('visible');
+      } else if (deltaX < -this.SWIPE_THRESHOLD && currentIndex < this.viewOrder.length - 1) {
+        this.swipeIndicatorRight?.classList.add('visible');
+        this.swipeIndicatorLeft?.classList.remove('visible');
+      } else {
+        this.swipeIndicatorLeft?.classList.remove('visible');
+        this.swipeIndicatorRight?.classList.remove('visible');
+      }
     }
   }
 
@@ -404,14 +425,29 @@ class MobileManager {
     const isValidSwipe = Math.abs(deltaX) > this.SWIPE_THRESHOLD || velocity > this.SWIPE_VELOCITY_THRESHOLD;
 
     if (isValidSwipe) {
-      const currentIndex = this.viewOrder.indexOf(this.currentView);
+      if (this.currentView === 'board') {
+        // In board view: navigate between columns
+        const columns = $$('.column');
+        const currentColumnIndex = this.getCurrentColumnIndex();
 
-      if (deltaX > 0 && currentIndex > 0) {
-        // Swipe right - previous view
-        this.switchView(this.viewOrder[currentIndex - 1]);
-      } else if (deltaX < 0 && currentIndex < this.viewOrder.length - 1) {
-        // Swipe left - next view
-        this.switchView(this.viewOrder[currentIndex + 1]);
+        if (deltaX > 0 && currentColumnIndex > 0) {
+          // Swipe right - previous column
+          this.scrollToColumn(currentColumnIndex - 1);
+        } else if (deltaX < 0 && currentColumnIndex < columns.length - 1) {
+          // Swipe left - next column
+          this.scrollToColumn(currentColumnIndex + 1);
+        }
+      } else {
+        // In other views: navigate between views
+        const currentIndex = this.viewOrder.indexOf(this.currentView);
+
+        if (deltaX > 0 && currentIndex > 0) {
+          // Swipe right - previous view
+          this.switchView(this.viewOrder[currentIndex - 1]);
+        } else if (deltaX < 0 && currentIndex < this.viewOrder.length - 1) {
+          // Swipe left - next view
+          this.switchView(this.viewOrder[currentIndex + 1]);
+        }
       }
     }
 
@@ -434,6 +470,36 @@ class MobileManager {
     this.swipeIndicatorRight?.classList.remove('visible');
   }
 
+  /**
+   * Get current visible column index in mobile board view
+   */
+  getCurrentColumnIndex() {
+    const boardContainer = $('.board-container');
+    if (!boardContainer) return 0;
+
+    const containerWidth = boardContainer.offsetWidth;
+    const scrollLeft = boardContainer.scrollLeft;
+    const columnWidth = 300; // Approximate column width in mobile
+
+    return Math.round(scrollLeft / columnWidth);
+  }
+
+  /**
+   * Scroll to specific column in mobile board view
+   */
+  scrollToColumn(columnIndex) {
+    const boardContainer = $('.board-container');
+    if (!boardContainer) return;
+
+    const columnWidth = 300; // Approximate column width in mobile
+    const targetScrollLeft = columnIndex * columnWidth;
+
+    boardContainer.scrollTo({
+      left: targetScrollLeft,
+      behavior: 'smooth'
+    });
+  }
+
   // =====================
   // TOUCH DRAG & DROP
   // =====================