feat(mobile): Zurück-Geste schließt die Ansicht, zwei Finger zoomen das PDF
Zwei Dinge, die am Telefon fehlten – beide in der installierten App besonders schmerzhaft, weil es dort keine Adresszeile als Rückweg gibt. 1. Zurück schloss bisher die Anwendung, nicht die Vorschau. Vorschau, Office-Editor und die aufgeschobene Seitenleiste kamen im Verlauf des Browsers gar nicht vor: Der einzige Eintrag war die Dateiliste. Jetzt legt jede bildschirmfüllende Ansicht beim Öffnen einen leeren Eintrag an (die Adresse bleibt gleich – eine Vorschau ist kein Ort für ein Lesezeichen) und verbraucht ihn beim Schließen wieder, egal ob über die Geste, Escape oder den Knopf. Ein Stapel sorgt dafür, dass bei übereinanderliegenden Ansichten nur die oberste reagiert. Collabora blendet auf kleinen Schirmen seinen eigenen Schließen-Knopf aus (closeButtonEnabled && !isSmallScreenDevice) – ohne diesen Weg käme man aus einem Dokument am Telefon nur über die Kopfzeile heraus. 2. Die Zusammenziehgeste vergrößerte die ganze Seite statt des PDFs: Leiste und Knöpfe wuchsen mit, das Dokument blieb grob. touch-action nimmt dem Browser die Geste, ein eigener Zuhörer setzt unsere Zoomstufen an ihre Stelle, verankert an der Mitte zwischen den Fingern – dieselbe Regel wie bei Strg+Mausrad. Gemessen in Chromium mit Touch-Emulation, 412x900: Vorschau offen -> Verlauf 2->3, Zurück -> Vorschau zu, Anwendung bleibt Esc -> Eintrag wieder weg (ein weiteres Zurück verlässt die App) Aufziehen 65% -> 125%, Zuziehen -> 50%, visualViewport.scale bleibt 1 Ein Befund aus dieser Messung steckt im Code: Zuerst kam pro Geste nur eine Stufe, weil sich der Zuhörer bei jeder Zoomänderung neu anmeldete und der gemerkte Fingerabstand dabei verlorenging. Abstand und Maßstab liegen deshalb in Referenzen, der Zuhörer meldet sich einmal an. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
1 parent
face318131
commit
574ba3e6c5
5 files changed
+207
-2
No files matched your search
@@ -1,6 +1,7 @@
|
||||
import { lazy, Suspense, useEffect, useState, useSyncExternalStore } from 'react'
|
||||
import { filesApi, APIError, type FileItem } from '../api/client'
|
||||
import { fileKind } from './filetypes'
|
||||
import { useBackClose } from '../hooks/useBackClose'
|
||||
|
||||
/**
|
||||
* Nachgeladen, nicht mitgeliefert: PDF.js wiegt rund eine halbe Megabyte im
|
||||
@@ -163,11 +164,17 @@ export default function FilePreview({ file, onPrev, onNext, onClose, onSaved, se
|
||||
}
|
||||
}
|
||||
|
||||
function tryClose() {
|
||||
if (dirty && !confirm('Discard your changes?')) return
|
||||
function tryClose(): boolean {
|
||||
if (dirty && !confirm('Discard your changes?')) return false
|
||||
onClose()
|
||||
return true
|
||||
}
|
||||
|
||||
// Zurück-Geste und Zurück-Taste schließen die Vorschau, statt die Anwendung
|
||||
// zu verlassen. Wichtig in der installierten App: Dort gibt es keinen
|
||||
// anderen Weg zurück.
|
||||
useBackClose({ active: true, onClose: tryClose })
|
||||
|
||||
return (
|
||||
<div
|
||||
onClick={tryClose}
|
||||
|
||||
Reference in new issue
Block a user