StackExchange Code Vollbildbetrachter
Ein umfassendes Benutzerskript, das das Codeansichtserlebnis auf StackExchange-Websites verbessert, indem Codeblöcken Vollbild- und Kopierfunktionen hinzugefügt werden.
## Eigenschaften
🔍 ** Vollbild-Code-Ansicht**
- Öffnet Codeblöcke in einer dedizierten neuen Registerkarte für eine ablenkungsfreie Anzeige
- Erhält die ursprüngliche Syntax-Highlighting mit verbesserter Farbschema
- Responsive Design, das Vollbild-Immobilien nutzt
- Saubere, minimalistische Schnittstelle für das Lesen von Code optimiert
📋 ** Ein-Klick-Code-Kopieren**
- Kopieren Sie jeden Codeblock auf die Zwischenablage mit einem einzigen Klick
- Visuelles Feedback bestätigt erfolgreiche Kopierung
- Funktioniert nahtlos mit Originalseite und Vollbildansicht
🎨 ** Syntax-Hervorhebung**
- Behält die ursprüngliche StackExchange Syntax hervorheben
- Verbesserte Hervorhebung im Vollbildmodus mit Highlight.js
- Automatische Spracherkennung und -bewahrung
- GitHub-Stil Farbschema für optimale Lesbarkeit
⌨️ ** Tastaturkombinationen**
- Escape: Vollbild-Registerkarte schließen
- Intuitive Steuerung für eine effiziente Navigation
## Installation
- Installieren Sie einen Userscript Manager (Tampermonkey, Greasemonkey, etc.)
- Installieren Sie dieses Skript aus dem Userscript
- Besuchen Sie jede StackExchange-Website mit Codeblöcken
- Bewegen Sie die Maustaste über Codeblöcke, um die neuen Tasten zu sehen
## Verwendung
### grundlegende Operationen
- Hover über jeden Codeblock, um Steuertasten zu offenbaren
- Klicken Sie auf "Vollbild", um den Code in einer neuen dedizierten Registerkarte zu öffnen
- Klicken Sie auf "Kopieren", um den Code in die Zwischenablage zu kopieren
- Drücken Sie Escape im Vollbild-Registerkarte, um zu schließen
### Vollbildansicht Funktionen
- Werkzeugleiste: Feste Position mit Kopieren und Schließen-Tasten
- Syntax Highlighting: Automatisch basierend auf erkannter Sprache angewendet
- Responsive Layout: Code füllt verfügbaren Bildschirmplatz
- Tastaturnavigation: Unterstützung der Escape-Taste für schnellen Ausgang
## Unterstützte Seiten
Das Skript funktioniert im gesamten StackExchange-Netzwerk:
### Hauptseiten
- Stack Overflow - Alle Programmierfragen und Codebeispiele
- Super User - Systemverwaltung und Power User Code
- Server-Fehler - Server- und Netzwerkverwaltungskripte
- Ubuntu fragen - Ubuntu/Linux Befehlszeile und Konfiguration
- Math Overflow - Mathematischer Code und Algorithmen
### Zusätzliche Abdeckung
- Alle StackExchange-Subsites (200+ Communities)
- Meta-Sites für alle unterstützten Plattformen
- Überprüfungsschlangen und Suchergebnisse
- StackApps für API-bezogene Codebeispiele
## Technische Details
### Umsetzung
- Reines JavaScript - Keine externen Abhängigkeiten auf der Hauptseite
- CDN-Integration - Highlight.js in Vollbild-Registerkarten geladen
- Nicht aufdringlich - Erhält das ursprüngliche Seitenstyling und die Funktionalität
- Performance Optimiert - Minimale Auswirkungen auf die Ladezeiten der Seiten
### Browserkompatibilität
- Chrome/Chromium - Vollständige Unterstützung
- Firefox - Vollständige Unterstützung
- Safari - Vollständige Unterstützung
- Edge - Vollständige Unterstützung
- Mobile Browser - Grundfunktionalität
### Sicherheit
- MIT Lizenziert - Open Source und auditierbar
- Keine Datenerfassung - Funktioniert vollständig kundenseitig
- Popup-Kontrollen - Elegante Handhabung von Popup-Blockern
- Sichere Ausführung - Keine externe Skriptinjektion auf den Hauptseiten
## Codestruktur
### Hauptkomponenten
JavaScript
// Kernfunktionen
addStyles() // Injektiert CSS für Buttons und Layouts
addButtons() // Schaltflächen für Codeblöcke erstellen
openCodeInNewTab() // Generiert Vollbild-Betrachtungserfahrung
copyToClipboard() // Handhabt die Funktionalität zum Kopieren von Code
### CSS Architektur
- **Transparente Verpackungen** - Nicht stören Sie das ursprüngliche Styling
- **Responsive Design** - Anpasst sich an verschiedene Bildschirmgrößen
- **Hover-Interaktionen** - Saubere, intuitive Benutzererfahrung
- **Vollbildoptimierung** - Maximale Lesbarkeit in dedizierter Ansicht
### Event Handling
- **Ereignisse laden** - Initialisiert nach dem Laden von Seiteninhalten
- **Hover-Zustände** - Schaltflächen anzeigen/verstecken
- **Klick-Handler** - Verwaltet Vollbild- und Kopiervorgange
- **Tastatur Ereignisse** - Escape Taste Unterstützung im Vollbild
## Anpassung
### Styling Optionen
Das Skript kann durch Änderung von CSS-Variablen angepasst werden:
```CSS
/* Schaltflächenaussehen */
.Knopf {
Hintergrundfarbe: #eee; /* Button Hintergrund */
Schriftgröße: 12px; /* Schaltflächentextgröße */
Polsterung: 4px 8px; /* Knopfabstand */
}
/* Vollbildgestaltung */
.toolbar Schaltfläche {
Hintergrund: #007acc; /* Tastenfarbe der Werkzeugleiste */
Farbe: weiß; /* Textfarbe der Werkzeugleiste */
}
### Sprachunterstützung
Syntax-Highlighting unterstützt über 190 Programmiersprachen, darunter:
- Web: JavaScript, TypeScript, HTML, CSS, SCSS
- Backend: Python, Java, C#, PHP, Ruby, Go, Rust
- Systeme: C, C++, Assembly, Shell/Bash
- Daten: SQL, JSON, XML, YAML, CSV
- Funktional: Haskell, Lisp, Erlang, F#
- Mobile: Swift, Kotlin, Dart
- Und viele mehr. ..**
## Fehlerbehebung
### Häufige Probleme
Buttons erscheinen nicht
Stellen Sie sicher, dass der Userscript Manager aktiviert ist
- Prüfen Sie, ob die Seite in unterstützten Matchmustern ist
- Seite nach der Installation aktualisieren
Popup im Vollbild blockiert
- Popups für StackExchange-Domains zulassen
- Überprüfen Sie die Einstellungen des Popup-Blockers des Browsers
- Versuchen Sie, direkt auf die Schaltfläche zu klicken (nicht während des Übergangs)
** Syntax-Highlighting funktioniert nicht **
- Überprüfen Sie die Internetverbindung (CDN-Abhängigkeit im Vollbild)
- Überprüfen Sie, ob der Codeblock die richtige Sprachklasse hat
- Versuchen Sie, die Vollbild-Registerkarte zu erfrischen
** Kopieren funktioniert nicht **
- HTTPS-Verbindung sicherstellen (Zwischenablage API-Anforderung)
- Überprüfen Sie die Browser-Zwischenablage Berechtigungen
- Versuchen Sie, Ctrl + C als Fallback zu verwenden
### Leistungsoptimierung
- Das Skript wird asynchron geladen, um das Blockieren des Seitenrenders zu vermeiden
Minimale DOM-Modifikationen bewahren die ursprüngliche Funktionalität
- Ereignisdelegation reduziert den Speicherfußabdruck
- CSS-Übergänge optimiert für reibungslose Interaktionen
## Lizenz
MIT Lizenz - Kostenlos für den persönlichen und kommerziellen Gebrauch.
## Unterstützung
Für Probleme, Feature-Anfragen oder Beiträge:
- GitHub-Probleme: Fehler melden und Funktionen anfordern
- StackExchange Meta: Besprechen Sie Verbesserungen mit der Community
- UserScript Kommentare: Teilen Sie Feedback und Tipps
