Wie erkennt/schließt Discourse virtuelle Tastaturen?

Ich habe ein Projekt, das nichts mit Discourse zu tun hat, bei dem ich gerne erkennen würde, ob die virtuelle Tastatur eines mobilen Browsers aktiv ist oder nicht. Mir ist gerade aufgefallen, dass das Discourse-Forum, das ich täglich besuche, eine wirklich reibungslose Benutzeroberfläche für virtuelle Tastaturen auf Mobilgeräten hat. Es ist großartig, wie zuverlässig es die Tastatur erkennt und die Antwortbox so anpasst, dass sie den verbleibenden Platz ausfüllt, nur um dann wieder in den Normalmodus zu wechseln, wenn Sie die Tastatur schließen.

Ich habe keine anderen einfachen Lösungen zum Erkennen der virtuellen Tastatur gefunden (die meisten auf Stack Overflow raten davon ab), aber was auch immer Discourse tut, scheint gut zu funktionieren. Der Code ist jedoch groß und komplex, und ich weiß nicht, wo ich im Code nach dem relevanten Code suchen soll. Daher hoffte ich, dass jemand, der mit der mobilen Benutzeroberfläche von Discourse vertraut ist, mir entweder den Code zeigen oder eine Erklärung geben könnte, welche Heuristiken Discourse verwendet?

2 „Gefällt mir“

Wir verwenden die Visual Viewport API: Visual Viewport API - Web APIs | MDN.

Sie können die JS-Dateien in unserem Repository-Code nach visualViewport durchsuchen. Es gibt einige Eigenheiten unter iOS aufgrund der Platzierung des Komponisten, daher verwenden wir dort einige komplexere Überschreibungen. Die relevante Datei ist app/assets/javascripts/discourse/app/lib/safari-hacks.js.

5 „Gefällt mir“

Vielen Dank für diese Hinweise!

2 „Gefällt mir“