Wischen für den Chat

Beitragen Merkmal
1

Hallo :waving_hand:

Kleine Idee zur mobilen Bedienbarkeit des Discourse-Chats: Ist geplant, eine Wischgeste (von links nach rechts) von einem Kanal oder einer DM aus einzuführen, um das Seitenpanel (Kanalliste / Direktnachrichtenliste) schnell anzuzeigen? Das würde die Navigation auf kleinen Bildschirmen deutlich flüssiger machen. Da ihr an einem neuen Composer arbeitet, um die Einhand-Bedienung auf dem Handy zu erleichtern, dachte ich, dass man das Gleiche auch für den Chat machen könnte :sweat_smile:

7 „Gefällt mir“
2

Aktuell gibt es keine Pläne dafür, aber es lohnt sich, genauer zu besprechen, welche Wischgesten die Navigation auf einer Website wie dieser erleichtern könnten.

6 „Gefällt mir“
3

Das Wischen nach links oder rechts ist kompliziert, da es sich bei vielen Geräten um die Zurück-/Weiter-Geste des Browsers handelt.

2 „Gefällt mir“
4

Ich denke, Don hat in Topic Preview Modal einen guten Ansatz gewählt; er greift nicht in das Standardverhalten ein und ich habe ihn als sehr nützlich empfunden.

3 „Gefällt mir“
5

Ich habe ein Skript für das Wischen geschrieben, um die Seitenleiste durch Wischen von links nach rechts einblenden zu lassen, und im Chat die Liste anzuzeigen, wenn man sich in einer Unterhaltung befindet. Das Ziel ist es, die Benutzererfahrung zu verbessern. Das Skript muss in ein Komponente kopiert werden, die deinem Thema in common\\head zugewiesen ist. Danach denke ich, dass es immer noch Möglichkeiten zur Verbesserung gibt

<script>
  (function() {
    if (window.innerWidth > 768) return;

    let startX = 0;
    let startY = 0;

    // Verwendung von 'window', um sicherzustellen, dass die Geste vor dem Chat erfasst wird
    window.addEventListener("touchstart", function(e) {
      if (e.touches.length === 1) {
        startX = e.touches[0].clientX;
        startY = e.touches[0].clientY;
      }
    }, { passive: true, capture: true });

    window.addEventListener("touchend", function(e) {
      if (!startX) return;

      const touch = e.changedTouches[0];
      const deltaX = touch.clientX - startX;
      const deltaY = touch.clientY - startY;

      if (startX >= 10 && startX <= 120 && deltaX > 50 && Math.abs(deltaY) < 50) {
        
        // 1. BEFINDEN WIR UNS IN EINEM CHATKANAL?
        // Wir prüfen, ob die URL die typischen Schlüsselwörter eines Discourse-Chatkanals enthält
        const currentUrl = window.location.pathname;
        const isInChatChannel = currentUrl.includes('/chat/c/') || currentUrl.includes('/chat/channel/');
        
        if (isInChatChannel) {
          // Wir versuchen zuerst, auf den Zurück-Link zu klicken, falls er standardisiert ist
          const chatBackBtn = document.querySelector('.chat-channel-header a, a[href="/chat"]');
          if (chatBackBtn) {
            chatBackBtn.click();
          } else {
            // Fallback: Wir bitten den Browser, eine Seite zurückzugehen
            window.history.back();
          }
          startX = 0;
          return; // Hier beenden wir das Skript
        }

        // 2. WENN WIR ANDERSWO AUF DEM FORUM SIND (Menü öffnen)
        const sidebarSelectors = [
          ".btn-sidebar-toggle",
          ".sidebar-toggle",
          "button.header-dropdown-toggle.hamburger-dropdown",
          "#toggle-hamburger-menu"
        ];

        for (const selector of sidebarSelectors) {
          const btn = document.querySelector(selector);
          if (btn && btn.getBoundingClientRect().width > 0) {
            btn.click();
            break; 
          }
        }
      }

      startX = 0;
      startY = 0;
    }, { passive: true, capture: true });
  })();
</script>