A viewforum page is not always a list of topics — a category page lists forums, and a forum page can carry both. Every row was treated as a topic, so on those pages the only link the row offered was the icon in its last-post column: the forum name was dropped, its description ended up in the muted footer line, and nothing was left to tap. Moving between forums on a phone was impossible. Rows are now classified by their first usable link, which relies on document order: a forum row names the forum before it links the last post. Detection prefers phpBB's own classes and falls back to the shape of the row, because the board runs a custom theme whose markup could not be verified — the page requires a login. That fallback needs a brake. The page scaffolding is itself a table, so a link outside any list row resolves to a row containing the whole document, which passed for a forum row and turned the page header, a stylesheet and inline scripts into a forum description. Rows carrying nested tables, forms or scripts are therefore rejected, and descriptions are read only from the title cell's own text.
8.0 KiB
CLAUDE.md
Ein Userscript, das die phpBB-Seiten von cs.rin.ru fuer Safari auf iOS in eine
mobile Ansicht umbaut. Kein Build, keine Abhaengigkeiten, kein package.json —
die .user.js-Datei ist das Produkt.
| Datei | Greift auf | Zweck |
|---|---|---|
rin-mobile.user.js |
*://cs.rin.ru/forum/* |
Beide Ansichten, Weiche nach Seitentyp |
dev/rin-mobile.dev.user.js |
zusaetzlich localhost:* |
Loader, bindet per @require file:/// das echte Script ein |
dev/viewtopic.php |
— | Fixture: gespeicherter Thread, 1114 Seiten |
Das Fixture ist ueber .gitignore (dev/*.php) ausgeschlossen. Nach einem
frischen Klon ist es nicht da und muss nach der Anleitung in der README neu
gespeichert werden — die Seite verlangt einen Login.
Aufbau
Ein IIFE, streng der Reihe nach:
DEBUG-Flag undlog-Array- Weiche:
viewist'thread','liste'oder''— abgeleitet auslocation.pathname + location.search - Nur bei gesetztem
view: Viewport-Meta (idempotent ueber[data-rm]) und der komplette Style-Block als Template-Literal replaceBody(root)blendet alle bisherigenbody-Kinder aus und haengt die neue Ansicht anbuildList()beziehungsweisebuildThread()lesen das Original-DOM und bauen eindiv.rm-root; beide haengen zum Schluss ueberaddCrumbs()die fixierte Brotkrumenleiste anrun()waehlt die Ansicht und haengt beiDEBUGdas gruene Overlay an- Start ueber
DOMContentLoaded, fallsreadyState === 'loading'
Auf Seiten ausserhalb der Weiche (posting.php, Profile, …) passiert nichts,
insbesondere wird kein Stylesheet injiziert.
Fallen, die nicht aus dem Code hervorgehen
Beide Ansichten teilen sich einen Klassennamensraum. Das war der Grund fuer
die Zusammenlegung: als getrennte Scripts matchte rin-mobile auch
viewtopic.php und injizierte dort sein Stylesheet, obwohl es nichts baute.
Gleich benannte Regeln kollidierten mit identischer Spezifitaet, und die
Ladereihenfolge der Userscripts entschied ueber das Layout.
- Geteilt:
.rm-root,.rm-hidden,.rm-dbg, die globaleimg-Regel - Unterschiede zwischen den Ansichten ueber einen Modifier am Root loesen,
nicht ueber zwei Regeln mit demselben Selektor.
.rm-root.rm-threadhaelt so die 64px hinter der fixierten Leiste frei. - Namen sind ansichtsspezifisch zu halten:
.rm-jump/.rm-pagesgehoeren der Liste,.rm-goto/.rm-griddem Thread-Sheet. .rm-avbraucht!importantauf Breite und Hoehe, sonst gewinnt die globaleimg { height:auto !important }-Regel gegen die Avatarmasse.
Was nach body soll, muss nach replaceBody() angehaengt werden.
Die Funktion markiert alle vorhandenen body-Kinder mit .rm-hidden. Das
Sheet wird deshalb erst beim ersten Antippen gebaut — das loest das Problem
nebenbei mit.
In der Liste entscheidet die Dokumentreihenfolge ueber den Zeilentyp.
buildList() sammelt Links auf viewforum.php und viewtopic.php in einem
Rutsch ein und ordnet jede tr nach ihrem ersten verwertbaren Link zu. Eine
Forenzeile verlinkt in der Spalte „letzter Beitrag" ebenfalls viewtopic.php —
zaehlte man Themenlinks zuerst, faellt die Zeile als Thema an, der Forenname
verschwindet und nur die Beschreibung bleibt als .rm-last uebrig. Genau so
war es vor 3.2. Brotkrumen und „Mark forums read" verlinken ebenfalls Foren,
stehen aber in Zeilen ohne Forenmerkmale und werden verworfen.
Das Seitengeruest ist selbst eine Tabelle. closest('tr') liefert fuer
einen Link ausserhalb einer Listenzeile die Layoutzeile, die die ganze Seite
enthaelt. Ohne Bremse wurde daraus eine Karte mit dem kompletten Seitentext —
Kopfzeile, Stylesheet und Inline-Scripts inklusive — als Forenbeschreibung.
Zeilen mit table, script, style oder form darin sind deshalb keine
Kandidaten, und die Beschreibung wird nur aus den direkten Textknoten der
Titelzelle gebildet, nie aus deren gesamtem Text.
Das Theme ist rinDark, nicht subsilver2. Die Klassennamen aus der
phpBB-Dokumentation (forumlink, forumdesc) sind fuer die Forenliste
deshalb nur eine Vermutung, solange kein dev/viewforum.php vorliegt. Die
Erkennung faellt bewusst auf die Form der Zeile zurueck.
Die Brotkrumenleiste ist fixiert, nicht sticky. .rm-root traegt
overflow:hidden und wuerde damit zum Scrollport einer position:sticky
-Leiste, in dem nie gescrollt wird — sie klebte nie. Fixierte Nachfahren
klammert das overflow dagegen nicht, weil der Root keinen Containing Block
aufspannt. Die Freihaltung oben haengt an body.rm-crumbed, damit ohne
Brotkrumen im Markup kein leerer Streifen bleibt.
Page X of Y steht als Page <strong>1</strong> of <strong>1114</strong>
im Markup. Ein Grep im Roh-HTML nach Page 1 of findet nichts, die Regex auf
txt(document.body) greift trotzdem. Nicht vorschnell fuer kaputt halten.
per_page kommt aus der jumpto()-Funktion der Seite
(var per_page = '15';). Nur damit lassen sich Seiten-URLs als
start = (Seite - 1) * per_page selbst bauen. Die gerenderten Seitenlinks
taugen nicht als Quelle — phpBB zeigt bei 1114 Seiten nur 1, 2, 3, 4, 5 … 1114.
Ohne per_page degradiert die Leiste auf erste Seite plus die
Original-Zurueck/Weiter-Links, das Sheet verschwindet.
postRow() steigt bewusst mehrere tr hoch. Der Beitragstext liegt in
einer verschachtelten Tabelle, closest('tr') trifft die innere Zeile ohne
Autor- und Profilspalte.
DEBUG steht auf true und muss vor dem Ausliefern auf false. Die
Versionsnummer steht doppelt: im @version-Header und im Text des
Debug-Overlays.
Testen
Es gibt keine Testsuite. Bewaehrt hat sich ein Wegwerf-Harness mit jsdom im Scratchpad (nicht im Repo ablegen — das Projekt soll abhaengigkeitsfrei bleiben):
const dom = new JSDOM(html, { url: 'https://cs.rin.ru/forum/viewtopic.php?f=10&t=68689&start=45' });
Drei Stolpersteine dabei:
- JSDOM parst asynchron fertig. Nach
eval(src)rund 60 ms warten, sonst hat das Script noch aufDOMContentLoadedgewartet und nichts gebaut. location.hrefist in JSDOM nicht ueberschreibbar. Fuer Navigationstests im eingelesenen Quelltextlocation.href = u;durch einen Hook ersetzen.requestAnimationFrameundscrollIntoViewfehlen und muessen gestubbt werden.
Sinnvolle Faelle: erste Seite, zweite Seite, Mitte, letzte Seite, dazu die
Degradation ohne per_page und ein Thread ohne Paginierung. Fixture-Eckdaten:
f=10&t=68689, per_page = 15, 1114 Seiten, letzte Seite start=16695.
Fuer die Weiche und die Listenansicht genuegt eine handgeschriebene Tabelle mit
a.topictitle-Zeilen. Zu pruefen ist dabei auch eine Seite ausserhalb der
Weiche wie posting.php: dort darf weder eine Ansicht gebaut noch ein
<style> injiziert werden.
Fuer die Forenliste braucht es eine zweite Tabelle im subsilver2-Schnitt:
td.cat > h4 > a als Kategoriezeile, darunter Zeilen mit a.forumlink, drei
p.forumdesc (Beschreibung, Moderatoren, Unterforen), zwei Zahlenspalten und
einer Spalte „letzter Beitrag" mit Link auf viewtopic.php. Vier Faelle sind
sinnvoll: reine Forenliste, reine Themenliste, beides auf einer Seite, und
dieselbe Forenliste ohne die Klassen forumlink/forumdesc — die muss ueber
die Zahlenspalten dasselbe Ergebnis liefern.
Am Geraet zu pruefen bleibt, was Blink nicht zeigt: env(safe-area-inset-*),
fixierte Leisten gegen Safaris ein- und ausfahrende Toolbar,
-webkit-backdrop-filter, Schriftskalierung. Details und die
Tampermonkey-Einrichtung stehen in der README.
Konventionen
- ES5-Stil im Script-Code:
var,function, keine Arrow Functions, keinlet/const. Template-Literals undSetsind in Gebrauch. Keine Transpilation, kein Linter. - Kommentare deutsch, Umlaute als
ae/oe/uetransliteriert. Echte Umlaute nur in Strings und Regexes, die im UI landen. - Kommentare begruenden, warum etwas so gebaut ist (welche DOM-Eigenheit von phpBB dahintersteckt), nicht was der Code tut.
- CSS-Klassen durchgaengig mit
rm-praefixiert. - Neue nutzersichtbare Funktionen in der README dokumentieren — zweisprachig, siehe globale Anweisung.