DogFatherGit
bfbe6feafe
Filipe, 21.09.2026: "dan will ich dass die leute auch immer die art
von text aussuchen können, fettgedrückt, unterstrichen und so alles.
das überall sei es im chat jeder für sich oder sei es wenn die modis
oder rechte hand oder dogfather eine aufgabe oder sachen posten."
VORHER GEMESSEN: Es gab genau EINE Auszeichnung im ganzen Haus --
fett, und nur auf den Brettern (`mitFett` in bereich.js). Im Chat
konnte niemand etwas hervorheben.
EINE QUELLE FUER DAS GANZE HAUS: workspace/assets/js/textform.js.
Chat, Bretter und Aufgaben zeichnen ihren Text jetzt durch denselben
Zerleger. Drei Fassungen derselben Regel waeren drei Fassungen, die
verschieden altern.
**fett** _kursiv_ __unterstrichen__ ~~durchgestrichen~~
Dazu eine Leiste ueber jedem Schreibfeld: F K U S, 44 px am Finger,
Strg+B/I/U, und ein zweiter Druck nimmt die Zeichen wieder weg.
DIE WORTGRENZEN SIND DER EIGENTLICHE BAU. Ein Zerleger, der alles
auszeichnet, ist schlimmer als keiner: `datei_name_hier` hiesse
plotzlich anders, als es heisst, und `@max_muster` ebenso. Deshalb
stehen bei den Unterstrichen Wortgrenzen -- bei Sternchen und Tilden
nicht, die kommen in Text nicht versehentlich paarweise vor.
GEBAUT MIT createTextNode, NIE innerHTML. Wer Text zu Auszeichnung
macht, ist einen Tippfehler von einer Luecke entfernt. Das ist heute
sicher; pruef-textform misst es, damit es das morgen auch ist.
EIN ECHTER FEHLER DABEI GEFUNDEN -- in meinem eigenen Einbau von
vorhin: Auf dem Aufgabenbrett stand `$('f-text')` in einem Block, der
`$` gar nicht kennt (die Datei hat drei getrennte Bloecke).
`ReferenceError: $ is not defined`, die Leiste kam dort nie an, und
die Seite sah dabei vollkommen normal aus. Derselbe Block beginnt
ausserdem mit `if (!feld) return;` auf ein Aufwand-Feld, das mit
Textgestaltung nichts zu tun hat -- die Leiste haette an einer
voellig fremden Bedingung gehangen. Jetzt ein eigener Block, ohne
fremden Helfer und ohne fremde Bedingung.
Gefunden hat es die Pruefung, weil sie die Leiste AM FELD sucht,
statt den Aufruf im Quelltext zu zaehlen. Sie sammelt seitdem auch
Skriptfehler ein -- ein ReferenceError ist immer ein Befund, auch
wenn man noch nicht weiss, was er anrichtet.
pruef-textform.mjs, 50 Aussagen:
- welche Seite das Modul braucht, wird ABGELEITET (beide
Richtungen: keine ohne, keine umsonst) -- 3 brauchen, 32 nicht
- 13 Regelfaelle im echten Browser an der echten Datei, davon
sechs, die NICHT gestaltet werden duerfen
- eine echte Nachricht wird zu <strong>/<em>/<u>/<s>
- Sicherheitsprobe: <b> und <img onerror> bleiben Text, nichts
wird ausgefuehrt -- und die echte Auszeichnung daneben wirkt
trotzdem (sonst waere nur bewiesen, dass gar nichts passiert)
- die Leiste legt Zeichen wirklich um und wieder ab
- Gegenproben fuer beide Richtungen
Nachbarn unveraendert gruen: pruef-chat-optik 45/0 (war 39 -- die
Antwortleiste kam dazu), pruef-aufgabenbrett 49/0, pruef-nachfrage
49/0, pruef-css-klassen 30/0, pruef-tippziele 11/0, pruef-meldungen
8/0.
124 lines
5.1 KiB
HTML
124 lines
5.1 KiB
HTML
<!doctype html>
|
||
<html lang="de">
|
||
<head>
|
||
<meta charset="utf-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
|
||
<title>Video übernehmen · Spicy & Dogi</title>
|
||
<meta name="robots" content="noindex, nofollow" />
|
||
<link rel="manifest" href="/workspace/app.webmanifest" />
|
||
<meta name="theme-color" content="#06090f" />
|
||
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png?v=202609211642" />
|
||
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png?v=202609211642" />
|
||
<link rel="stylesheet" href="assets/css/gate.css?v=202609211642" />
|
||
<link rel="stylesheet" href="assets/css/start.css?v=202609211642" />
|
||
<link rel="stylesheet" href="assets/css/bereich.css?v=202609211642" />
|
||
<link rel="stylesheet" href="assets/css/module.css?v=202609211642" />
|
||
<link rel="stylesheet" href="assets/css/haus.css?v=202609211642" />
|
||
</head>
|
||
|
||
<body class="start">
|
||
|
||
<div class="schleier" aria-hidden="true"></div>
|
||
|
||
<header class="kopfleiste">
|
||
<button type="button" class="zurueck-knopf" id="zurueck" hidden>
|
||
<svg class="zurueck-knopf__pfeil" viewBox="0 0 24 24" aria-hidden="true">
|
||
<path d="M14.5 5.5 8 12l6.5 6.5" />
|
||
</svg>
|
||
<span class="zurueck-knopf__text">Zurück</span>
|
||
</button>
|
||
<p class="marke"><span class="marke__text"><a class="zurueck" href="start.html">Team Dogi</a> · Video übernehmen</span></p>
|
||
<div class="kopfleiste__rechts">
|
||
<span class="wer" id="wer">…</span>
|
||
<button type="button" class="abmelden" id="abmelden">Abmelden</button>
|
||
</div>
|
||
</header>
|
||
|
||
<main class="inhalt">
|
||
|
||
<!-- ==================================================================
|
||
AUS „TEILEN" WIRD EIN TIPP (17.09.2026)
|
||
Schritt 4 aus dem Video-Plan.
|
||
|
||
Filipe postet ein Video auf dem Handy. Bisher hätte er den Link
|
||
kopieren, die App öffnen, den richtigen Bereich suchen und das
|
||
Feld finden müssen – fünf Schritte, von denen jeder einzelne der
|
||
Grund sein kann, es später zu machen. Und später heißt nie.
|
||
|
||
Jetzt: in TikTok auf „Teilen", „DogFather" wählen, fertig. Diese
|
||
Seite ist das Ziel dieses Tipps.
|
||
|
||
WARUM SIE NICHT SOFORT EINTRÄGT: Weil sie nicht wissen kann, ob
|
||
der Griff in die Tasche gemeint war. Ein Video, das ungefragt in
|
||
den Highlights landet, muss jemand wieder löschen – und das ist
|
||
mehr Arbeit als ein Tipp auf „Übernehmen". Sie zeigt also, was
|
||
sie verstanden hat, und wartet auf eine Bestätigung.
|
||
|
||
WOHIN, IST EINE FRAGE UND KEINE ANNAHME: Highlights sind
|
||
vorausgewählt, weil dort die Videos hingehören. Aber ein Clip
|
||
kann auch eine Antwort auf einen Wunsch sein.
|
||
============================================================== -->
|
||
|
||
<section class="kopf-zeile">
|
||
<div>
|
||
<p class="marke">Geteilt</p>
|
||
<h1 class="titel">Video übernehmen</h1>
|
||
<p class="unterzeile">
|
||
Titel und Coverbild werden von TikTok geholt – du musst nichts abtippen.
|
||
</p>
|
||
</div>
|
||
</section>
|
||
|
||
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
|
||
|
||
<section class="tl-seite" id="teilen" aria-busy="true">
|
||
<p class="leise" id="ladezeile">einen Moment …</p>
|
||
|
||
<!-- Was angekommen ist. Steht ganz oben, weil es die erste Frage
|
||
beantwortet: „hat er den richtigen Link erwischt?" -->
|
||
<div class="tl-fund" id="fund" hidden>
|
||
<p class="tl-label">Dieser Link ist angekommen:</p>
|
||
<p class="tl-url" id="url-text"></p>
|
||
</div>
|
||
|
||
<!-- Wohin. -->
|
||
<div class="tl-wahl" id="wahl" hidden>
|
||
<p class="tl-label" id="wohin-label">Wohin soll es?</p>
|
||
<div class="tl-bretter" role="group" aria-labelledby="wohin-label" id="bretter"></div>
|
||
</div>
|
||
|
||
<div class="tl-knoepfe" id="knoepfe" hidden>
|
||
<button type="button" class="knopf" id="uebernehmen">Übernehmen</button>
|
||
<a class="schritt" href="start.html" id="abbrechen">Doch nicht</a>
|
||
</div>
|
||
|
||
<!-- Wenn gar kein Link dabei war. Kein Formular als Strafe, sondern
|
||
ein Feld zum Einfügen – man ist ja schon hier. -->
|
||
<div class="tl-haendisch" id="haendisch" hidden>
|
||
<label class="tl-label" for="eingabe">Link zum Video</label>
|
||
<input type="url" id="eingabe" inputmode="url" autocomplete="off"
|
||
placeholder="https://www.tiktok.com/@dogfather0804/video/…" />
|
||
</div>
|
||
|
||
<!-- Das Ergebnis. -->
|
||
<div class="tl-fertig" id="fertig" hidden>
|
||
<p class="tl-fertig-satz" id="fertig-satz"></p>
|
||
<div class="tl-knoepfe">
|
||
<a class="knopf" id="hin" href="start.html">Ansehen</a>
|
||
<a class="schritt" href="start.html">Fertig</a>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
</main>
|
||
|
||
<script src="assets/js/meldung.js?v=202609211642" defer></script>
|
||
<script src="assets/js/nachfrage.js?v=202609211642" defer></script>
|
||
|
||
|
||
<script src="assets/js/wahl.js?v=202609211642" defer></script>
|
||
<script src="assets/js/bereiche.js?v=202609211642" defer></script>
|
||
<script src="assets/js/kopf.js?v=202609211642" defer></script>
|
||
<script src="assets/js/teilen.js?v=202609211642" defer></script>
|
||
</body>
|
||
</html>
|