Come fa Discourse a rilevare/dedurre le tastiere virtuali?

Ho un progetto non correlato a Discourse in cui mi piacerebbe davvero poter rilevare se la tastiera virtuale di un browser mobile è attiva o meno. Mi sono appena reso conto, dopo giorni di riflessione e ricerca di soluzioni, che il forum Discourse che visito ogni giorno ha un’interfaccia davvero fluida per le tastiere virtuali mobili. È fantastico come rilevi in modo affidabile la tastiera e cambi la casella di risposta per riempire lo spazio rimanente, solo per tornare alla modalità normale se chiudi la tastiera.

Non ho trovato altre soluzioni semplici per rilevare la tastiera virtuale (la maggior parte di Stack Overflow dice di non provarci), ma qualunque cosa faccia Discourse sembra funzionare bene. Il codebase è però ampio e complesso, e non so dove cercarlo per trovare il codice pertinente. Quindi speravo che qualcuno che ha familiarità con l’interfaccia mobile di Discourse potesse indicarmi il codice, o fornire una spiegazione delle euristiche utilizzate da Discourse?

2 Mi Piace

Utilizziamo la Visual Viewport API: Visual Viewport API - Web APIs | MDN.

Puoi cercare nei file JS del nostro repository visualViewport. Ci sono alcune particolarità in iOS dovute al posizionamento del composer, quindi lì utilizziamo alcune override più complesse, il file pertinente è app/assets/javascripts/discourse/app/lib/safari-hacks.js.

5 Mi Piace

Grazie per questi suggerimenti!

2 Mi Piace