JustZix-Funktionen

Du definierst ein URL-Muster, schreibst CSS- und/oder JS-Code — die Erweiterung injiziert ihn automatisch bei jedem Laden der Seite. Jede Regel hat ihren eigenen Editor mit Syntaxhervorhebung (CodeMirror).

• CSS wird über ein <style>-Tag im Dokument-Head injiziert — volle Spezifität verfügbar.
• JS wird in der MAIN-World der Seite über chrome.scripting.executeScript ausgeführt — umgeht CSP in 99% der Fälle, hat Zugriff auf window.
• Einzelne Regeln per Klick auf der schwebenden Symbolleiste aktivieren / deaktivieren.
• Der Editor hat ein Dark-/Light-Theme, Zeilennummern, Suche und eine ziehbare Leiste zur Größenänderung.

Mehr erfahren →

Vierstufige Struktur, die von „eine schnelle CSS-Korrektur" bis „100 Regeln in 12 Kundenprojekten" skaliert. Schalter kaskadieren die Hierarchie hinunter.

• Ordner — oberste Ebene, hat ein eigenes URL-Muster und ein 3-Buchstaben-Label für den schwebenden Button.
• Gruppe — Unterorganisation innerhalb eines Ordners. Jeder Ordner hat mindestens eine Gruppe (standardmäßig „Standard").
• Regel — die eigentliche CSS/JS-Einheit. Gehört zu einer Gruppe. Hat optionale URL-Muster zur weiteren Eingrenzung.
• Aktion — anklickbarer Button im Aktionspanel, der bei Bedarf eigenes JS ausführt.

Ordner "kunde-acme"
├── Gruppe "styles"
│   ├── Regel "Werbung ausblenden"
│   └── Regel "Dark Mode"
└── Gruppe "aktionen"
    └── Regel "QA-Toolbar"
        ├── Aktion "FILL"
        ├── Aktion "CLR"
        └── Aktion "COPY"

Mehr erfahren →

Treffer nach exakter URL, ganzer Website, allen Subdomains oder allem, was einer Teilzeichenfolge entspricht. Muster lassen sich über Ordner-, Gruppen- und Regelebene stapeln für feine Kontrolle.

• https://example.com/admin — nur exakte URL
• https://example.com/* — alle Seiten der Website
• https://*.example.com/* — alle Subdomains
• *://localhost:*/* — beliebige lokale App, beliebiger Port, beliebiges Protokoll
• *staging* — beliebige URL, die „staging" enthält

Mehr erfahren →

Ein kleiner runder Button erscheint auf jeder Seite, auf der einer deiner Ordner passt. Ein Klick schaltet alle passenden Ordner ein/aus. Die Farbe zeigt den aktuellen Zustand auf einen Blick.

• Inject Green (oder deine Ordnerfarbe) — alle passenden Ordner aktiviert.
• Syntax Orange — manche aktiviert, manche deaktiviert (gemischter Zustand).
• Muted Gray — alle deaktiviert.
• Halt Red — Erweiterung global aus.
• Rechtsklick öffnet ein Panel mit allen passenden Ordnern/Gruppen/Regeln zum einzelnen Umschalten.
• Ziehen zum Verschieben. Position pro Fenster gespeichert.

Mehr erfahren →

Eine zweite schwebende Leiste mit interaktiven Steuerelementen. Jede Aktion ist einer von sechs Typen — vom einfachen Button bis zum Schieberegler oder Dreizustands-Schalter. Jede hat ein Label, eine Farbe und ein optionales Tastenkürzel; die Leiste merkt sich ihre Position, und ein Rechtsklick blendet sie für den Rest der Sitzung aus.

• BUTTON — ein Fire-and-Forget-Button: ein Klick führt JS-Code aus.
• SELECT — ein Dropdown; statische oder per JS generierte Optionen, eine Auswahl löst die Aktion aus.
• INPUT — ein Textfeld in der Leiste, Command-Bar-Stil — Wert eingeben und bestätigen.
• SLIDER — ein Schieberegler, der eine CSS-Variable live steuert (z. B. Helligkeit, Zoom).
• TEXTAREA — ein mehrzeiliger Notizblock, Inhalt pro Domain gemerkt.
• TOGGLE3 — ein Dreizustands-Segmentschalter (z. B. dev / staging / prod).

Mehr erfahren →

Im JS jeder Regel oder im Code jedes Aktionsbuttons hast du Zugriff auf zwei Globals. window.JZ steuert Aktionsbuttons — rufe sie programmatisch auf, verkette Workflows, integriere Mutation Observers. window.JUSTZIX ist ein Logger, der direkt ins Output-Console-Fenster schreibt — keine DevTools nötig.

• JZ.click('LBL') — den mit „LBL" beschrifteten Aktionsbutton programmatisch klicken.
• JZ.action('LBL') — das DOM-Element des Buttons holen (stylen, Attribute prüfen).
• JZ.actions() — Array aller sichtbaren Aktionsbuttons.
• JZ.labels() — Array der originalen Labels (Groß-/Kleinschreibung erhalten).
• Die Suche ist case-insensitive. JZ.click('btn') = JZ.click('BTN').
• JUSTZIX.log() / .warn() / .error() / .info() / .debug() — Eintrag in die Output Console schreiben (Aliase: __JUSTZIX__, JZ.log usw.).

// Aktion „AUTO" — drei andere Aktionen verketten
JZ.click('LOAD');
setTimeout(() => JZ.click('PROC'), 500);
setTimeout(() => JZ.click('SAVE'), 1500);

Mehr erfahren →

Ein 25-stelliger Sync-Schlüssel verknüpft dein Konto. Alle Regeln, Einstellungen und Änderungen propagieren nahezu in Echtzeit per Entity-bezogenem Last-Write-Wins mit Lamport-Zeitstempeln.

• Schlüssel lokal generiert — das Backend sieht nie die Klarform (nur SHA-256-Hash).
• Konflikt pro Entity gelöst — nie pauschales Überschreiben „all deiner Einstellungen".
• Tombstones propagieren Löschungen korrekt.
• Konfliktlösungs-UI beim Login: Server verwenden / lokale senden / LWW zusammenführen.
• Status-Tab: Synchronisierungsverlauf, Cloud-Bibliotheksansicht und vollständiger Resync mit dem Konto.
• Bereinigung inaktiver Konten nach 12 Monaten (mit Warn-E-Mail 30 Tage vorher).
• Wiederherstellung per E-Mail — ein verlorener Schlüssel wird durch einen neuen ersetzt.

Mehr erfahren →

Zwei Wege, Daten zu verschieben: temporäre öffentliche Links zum Teilen mit anderen (JZS-XXXX-XXXX-XXXX-XXXX, 1–48 h TTL) und automatische stündliche/tägliche/wöchentliche Backups für dich selbst.

• Freigabe-TTL: 1h / 6h / 12h / 24h (Standard) / 48h. Token läuft automatisch ab.
• Der Empfänger sieht vor dem Import eine Vorschau — mit JS-Warnbanner, wenn das Bundle JavaScript enthält.
• Fünf Exportformate: justzix-full, partial, folder, group, rule.
• Backups: 24 stündliche + 30 tägliche + 8 wöchentliche, automatische Bereinigung älterer.
• „Meine Freigaben"-Panel mit Download-Zähler und Widerrufs-Button.

Mehr erfahren →

Fünf Arten von Dev-Fenstern, die direkt auf der Seite rendern — keine DevTools. Du ziehst sie, rastest sie Kante an Kante ein und verbindest sie zu einem Mini-Dashboard. Jedes Fenster kann dauerhaft (an eine Regel gebunden) oder temporär (TEMP, per Tastenkürzel aufgerufen) sein.

• CSS pane — ein Live-CSS-Editor, Änderungen sofort sichtbar, Inhalt pro Tab gespeichert.
• JS pane — ein JS-Editor, bei Bedarf per Run-Button ausgeführt (Ctrl+Enter).
• JS Console — eine REPL auf der Seite: tippen, Enter, Ergebnis; Befehlsverlauf mit Pfeiltasten.
• Output Console — ein Seitenlog-Viewer mit 6 gezählten Tabs: All, JZconsole, console.*, Network, Fehler und dataLayer-Pushes. Der Network-Tab hat Filter für Domains, Größe und Zeit.
• AI Helper — ein integrierter KI-Assistent (OpenAI / Anthropic / Gemini): untersucht die Seite, testet Code in TEMP-Fenstern und erstellt nach deiner Freigabe Regeln.
• Suche in den Editoren — eine Leiste über jedem CSS/JS-Editor: Trefferzähler, Hervorhebung, Ctrl+Alt+←/→-Kürzel.
• TEMP panes — dieselben Fenster unter Ctrl+Alt+G/H/J/K, flüchtig, beim Neuladen weg.
• Drag & snap & connect — Fenster ziehen, an Kanten einrasten, zu Gruppen verbinden.
• Anpassung pro Fenster — Farbe, Schrift und Größe aus dem Rechtsklick-Menü.

Ctrl+Alt+G  →  TEMP CSS pane
Ctrl+Alt+H  →  TEMP JS pane
Ctrl+Alt+J  →  TEMP JS Console
Ctrl+Alt+K  →  TEMP Output Console
Ctrl+Alt+\  →  AI Helper

Mehr erfahren →