DogFatherGit/dogfather-universe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Teilen gibt einen fertigen Discord-Beitrag -- und die zwei Seiten bekommen ein Gesicht

Browse Source 
Filipe: "beim teilen wird auch nur der link geteilt, und ich will dass
wenn ich es teile im discord der agentur, dass ein banner und ein
kompletter fertiger text fuer die creator entsteht und nicht einfach
der link kopiert wird damit die leute drauf gehen. das ist kake."
Und: "perfektionier die zwei events kategorien. ich will es noch viel
krasser und spezieller."

EIN LINK IN EINEM DISCORD-KANAL IST EINE AUFFORDERUNG. Wer ihn nicht
anklickt -- und das sind die meisten -- weiss nicht, dass es die
Kampagne gibt. Was in Discord steht, muss die Kampagne SEIN. Der
Teilen-Knopf legt deshalb einen fertigen Beitrag in die Zwischenablage:
Titel als Ueberschrift, Zeitraum, Einleitung, die Aufgaben als Liste,
die Geschenke mit Coinpreis, "Gut zu wissen" aus Rangliste, Zeitplan
und Teilnahme. Er steht zusaetzlich sichtbar unter der Kachel, mit
Zeichenzaehler und zweitem Kopierknopf -- was man nicht gesehen hat,
fuegt man blind ein.

ZWEI DINGE SIND DABEI NICHT BELIEBIG:
  - Der Link steht GANZ AM ENDE. Discord setzt die Bannervorschau
    UNTER die Nachricht; steht er oben, schiebt das Banner den Text
    aus dem Blick.
  - Der Link steht NACKT da. Spitze Klammern unterdruecken die
    Vorschau -- und damit genau das Banner, um das es geht.

2000 ZEICHEN, UND NICHT EINS MEHR. Gekuerzt wird auf dem Server, in
fester Reihenfolge und an Abschnittsgrenzen: erst "Gut zu wissen",
dann die Einleitung auf zwei Saetze, dann die Geschenke. Titel,
Zeitraum, Aufgaben und Link bleiben IMMER. Gemessen gegen sieben
Laengen und einen 1500-Zeichen-Titel als Haertefall.

Gebaut wird der Beitrag aus `teilenDaten()` -- derselben Funktion, aus
der auch die offene Seite entsteht. Zwei Aufbauten fuer dasselbe Event
wuerden irgendwann Verschiedenes sagen, und niemand koennte entscheiden,
welcher recht hat.

DIE ZWEI SEITEN: ein gezeichnetes Wappen in der Farbe der Spalte, ein
Kopf mit Lichtkante und Verlauf, der beim Scrollen oben stehen bleibt,
und eine Lagezeile ("2 laufen - 1 kommt - 3 vorbei"). Gezaehlt mit
derselben Regel, die die Gruppen darunter bildet; was null ist,
erscheint nicht. Augenschonend bleibt es ueber Form und Tiefe, nicht
ueber Leuchtkraft.

NEBENBEFUND, BEHOBEN: Der Einlesekasten war durch Seitenwahl und
Bildweg auf 521 px gewachsen -- auf 412 px mehr als ein halber
Telefonbildschirm, bevor man die erste Kachel sieht. Er klappt jetzt zu
(82 px) und merkt sich die Wahl; ein Druck, und er bleibt offen.

BERICHTIGT, WEIL GEMESSEN:
  - Der Bindestrich wurde entwertet: "4\-woechige", "Ahorn\-Welt". In
    Discord ist "-" nur am Zeilenanfang eine Aufzaehlung.
  - Das Klappschild hatte nur eine Handy-Regel und sonst kein
    Aussehen -- auf 1400 px ein nackter Knopf mit 27 px statt 48.
  - bild-kampagne mass elementFromPoint ausserhalb des
    Sichtfensters und meldete "etwas liegt auf dem Knopf", wo nichts
    lag; und r(null) liess den ganzen Lauf abstuerzen, statt die
    Zusicherung rot zu machen.
  - EINE GEGENPROBE WAR BLIND: DISCORD_MAX von 2000 auf 99999 zu
    setzen liess die Pruefung gruen -- der Testbeitrag ist 1230
    Zeichen lang, die Grenze wurde also nie geprueft. Jetzt mit einem
    Beitrag, der ohne Kuerzung sicher zu lang waere.

GEPRUEFT: 190 (Route und Teilen, +8), 183 (Kachel, +13), 69 Messungen
(Bild, +2), 67 (Agentur), 43 (Bildleser), struktur, css-klassen,
zeichen, deutsche-texte, tippziele. Sechs Gegenproben: Link nur noch
Link, Link oben statt unten, Grenze weg, Lagezeile weg, Kopf klebt
nicht, Kasten wieder offen -- alle sechs werden bemerkt, alle Dateien
byte-gleich wiederhergestellt.

Co-Authored-By: Claude Opus 5 <[email protected]>
This commit is contained in:
DogFatherGit
2026-10-08 11:20:51 +02:00
co-authored by Claude Opus 5
parent 807d7d4a1c
commit fdadd5d573
54 changed files with 1752 additions and 729 deletions
Download Patch File Download Diff File Expand all files Collapse all files
server/bild-kampagne.mjs
+94 -3
View File
@@ -155,6 +155,30 @@ const browser = await pw.chromium.launch();
const fehlerAufSeite = [];
/** Den Einlesekasten aufmachen, falls er zu ist.
*
* Seit dem 08.10.2026 steht er von sich aus zu -- er war auf
* 412 px auf 521 px gewachsen, mehr als ein halber
* Telefonbildschirm vor der ersten Kachel. Jede Stelle, die
* seinen INHALT braucht, muss ihn also erst oeffnen.
*
* AN EINER STELLE, NICHT DREIMAL ABGESCHRIEBEN: Beim ersten
* Versuch stand das Oeffnen nur oben bei der Messung, und die
* zwei `fill()` weiter unten liefen in eine 30-Sekunden-Frist --
* mit einer Meldung ueber ein Textfeld, das es laut Fehlertext
* sehr wohl gab. Das ist die unangenehme Sorte Fehlschlag: Er
* sagt die Wahrheit und fuehrt trotzdem in die Irre. */
const kastenAufmachen = async (seite) => {
const schild = await seite.$("#kampagne-schild");
if (!schild) return false;
const zu = await seite.evaluate(() =>
document.getElementById("kampagne-form")?.hidden === true);
if (!zu) return true;
await schild.click();
await seite.waitForTimeout(250);
return true;
};
const anmelden = async (seite, rolle, code) => {
await seite.goto(BASIS + "/workspace/", { waitUntil: "networkidle" });
await seite.click(`.rolle[data-rolle="${rolle}"]`);
@@ -214,16 +238,47 @@ async function messen(breite, hoehe, name) {
return { rolle: j.rolle, darf: j.darf_kampagne_einlesen, wirt: location.host };
});
console.log(" /api/ich: " + JSON.stringify(ichSagt));
/* ERST AUFKLAPPEN (08.10.2026).
Der Kasten steht seit heute zu -- er war auf 412 px auf 521 px
gewachsen, mehr als ein halber Telefonbildschirm vor der ersten
Kachel. Gemessen werden soll trotzdem der INHALT: Textfeld,
Knopf, Kontrast, Tippziele. Zugeklappt haben die alle die Hoehe
null, und die Messung meldete einen Schaden, wo keiner ist.
DASS ER ZUGEHT, MISST pruef-eventkarte (Abschnitt 4c) -- dort
gehoert es hin, zusammen mit dem Rest der Bedienung. Hier geht
es um das Aussehen des offenen Kastens. */
await kastenAufmachen(seite);
const mass = await seite.evaluate(() => {
const k = document.getElementById("kampagneholen");
if (!k || k.hidden) return { da: false };
const r = (e) => { const b = e.getBoundingClientRect();
/* EIN FEHLENDES ELEMENT GIBT NULLEN, KEINEN ABSTURZ
(berichtigt 08.10.2026). Vorher warf `r(null)` mitten in der
Messung, und der ganze Lauf endete mit „unbehandelter
Fehler" -- ohne zu sagen, WELCHES Element fehlte. Nullen
machen die Zusicherung darunter rot und nennen dabei den
Namen. Ein Fehlschlag ist rot und steht da; ein Absturz
sieht aus wie ein kaputtes Werkzeug. */
const r = (e) => {
if (!e) return { x: 0, y: 0, b: 0, h: 0, fehlt: true };
const b = e.getBoundingClientRect();
return { x: Math.round(b.x), y: Math.round(b.y),
b: Math.round(b.width), h: Math.round(b.height) }; };
b: Math.round(b.width), h: Math.round(b.height) };
};
const feld = document.getElementById("kampagne-text");
const knopf = document.getElementById("kampagne-holen");
const sagt = document.getElementById("kampagne-sagt");
const titel = k.querySelector(".kampagneholen__titel");
/* DIE UEBERSCHRIFT IST SEIT DEM 08.10.2026 DAS KLAPPSCHILD.
`.kampagneholen__titel` gibt es nicht mehr -- der `<h2>` ist
ein `<button>` geworden, weil man ihn jetzt druecken kann.
Die Messung sucht deshalb das Schild; faellt auch das weg,
gibt `r()` keinen Fehler mehr, sondern Nullen, und die
Zusicherungen unten werden rot statt den Lauf abzubrechen. */
const titel = k.querySelector(".kampagneholen__schildwort")
|| k.querySelector(".kampagneholen__schild");
const st = getComputedStyle(sagt);
return {
da: true,
@@ -237,6 +292,19 @@ async function messen(breite, hoehe, name) {
/* Ueberdeckt etwas den Knopf? Nicht gerechnet, sondern gefragt:
Was liegt an seinem Mittelpunkt wirklich obenauf? */
obenAufKnopf: (() => {
/* ERST IN DEN BLICK HOLEN (berichtigt 08.10.2026).
`elementFromPoint` fragt das SICHTFENSTER, nicht die
Seite: Was darunter liegt, gibt `null`. Seit der Kasten
die Seitenwahl und den Bildweg traegt, ist er auf 412 px
hoeher als das Fenster -- und die Pruefung meldete
„nichts liegt auf dem Knopf“ als Schaden, obwohl der
Knopf nur weiter unten stand.
Die Frage bleibt dieselbe und bleibt wichtig: Am
06.09.2026 lag der Sicht-Umschalter quer ueber dem
Chat-Knopf. Nur muss man dafuer hinsehen, wo er ist. */
knopf.scrollIntoView({ block: "center" });
const b = knopf.getBoundingClientRect();
const e = document.elementFromPoint(b.x + b.width / 2, b.y + b.height / 2);
return e ? (e.id || e.className || e.tagName) : null;
@@ -259,6 +327,27 @@ async function messen(breite, hoehe, name) {
diesem Haus bei 40 und wurden genau deshalb gezogen. */
ok(mass.knopf.h >= 44, `der Knopf ist ${mass.knopf.h} px hoch (mindestens 44)`);
ok(mass.feld.b > 120, `das Textfeld ist ${mass.feld.b} px breit -- kein Schlitz`);
/* WIE VIEL PLATZ FRISST DER KASTEN? (08.10.2026)
Er ist seit dem 07.10. um die Seitenwahl und seit dem 08.10.
um den Bildweg gewachsen -- auf 412 px gemessen 539 px, also
mehr als ein halber Telefonbildschirm, bevor man die erste
Kachel sieht. Die Grenze steht hier, damit das naechste
Stueck nicht unbemerkt dazukommt: Eine feste Zahl, die
mitwaechst, ist keine Grenze (CLAUDE.md, 06.09.2026). */
/* WIE VIEL PLATZ FRISST DER OFFENE KASTEN?
Er ist seit dem 07.10. um die Seitenwahl und seit dem 08.10. um
den Bildweg gewachsen -- auf 412 px gemessen 521 px. Seitdem
steht er zu (siehe oben); AUFGEKLAPPT darf er trotzdem nicht
beliebig wachsen, sonst ist das Aufklappen ein Sprung ins
Nichts. Die Grenze steht hier, damit das naechste Stueck nicht
unbemerkt dazukommt: Eine feste Zahl, die mitwaechst, ist keine
Grenze (CLAUDE.md, 06.09.2026). */
const grenze = breite <= 560 ? 560 : 420;
ok(mass.kasten.h <= grenze,
`der offene Kasten bleibt bei ${mass.kasten.h} px `
+ `(hoechstens ${grenze} auf ${breite} px)`);
ok(mass.feld.h >= 72, `und ${mass.feld.h} px hoch, also mehrzeilig`);
/* NICHTS LIEGT AUF DEM KNOPF. Am 06.09.2026 lag der Sicht-Umschalter
@@ -348,6 +437,7 @@ await messen(412, 915, "Auf dem Handy, haeufigste Android-Breite");
await seite.goto(BASIS + "/workspace/bereich.html?b=agentur", { waitUntil: "networkidle" });
await seite.waitForTimeout(1400);
await kastenAufmachen(seite);
await seite.fill("#kampagne-text",
"Dein Creator Network lädt dich ein: https://www.tiktok.com/t/ZSbqPsFa8/");
await seite.$eval("#kampagne-holen", (b) => b.click());
@@ -395,6 +485,7 @@ await messen(412, 915, "Auf dem Handy, haeufigste Android-Breite");
}), { status: 502, headers: { "Content-Type": "application/json" } });
};
});
await kastenAufmachen(seite);
await seite.fill("#kampagne-text", "https://www.tiktok.com/t/ZSbqPsFa8/");
await seite.$eval("#kampagne-holen", (b) => b.click());
await seite.waitForFunction(