# DeskHub für Chrome (Erweiterung) DeskHub in der Browserleiste: **Tickets lesen und beantworten**, Aufgaben, eigener Status, Zähler und Benachrichtigungen. Sie läuft in Chrome, Edge und Brave (Manifest V3) auf Windows, Mac und Linux. Version 2 ist komplett neu gebaut (Oberfläche, Anmeldung, Funktionen). ## Funktionen - **Start:** Begrüßung, **eigener Status** (Verfügbar, Beschäftigt, Pause, Offline), Kennzahlen (meine offenen, überfällige, nicht zugewiesene, unbeantwortete, heute gelöste, SLA-Quote) und die als Nächstes fälligen Tickets. Ein Klick auf eine Kennzahl öffnet die passende Ticketliste. - **Tickets:** Filter *Meine*, *Nicht zugewiesen*, *Überfällig*, *Unbeantwortet*, *Beobachtet*, *Wiedervorlage*, *Alle offenen*, *Gelöst/Geschlossen*; Suche in Betreff, Nummer, Name und Text; „Mehr laden“. - **Ticket-Ansicht direkt in der Erweiterung:** Verlauf als Chat (Kunde, Mitarbeiter, interne Notizen, Kommentare, Anhänge), **Antworten** (mit Textbausteinen, Signatur-Auswahl und Status nach dem Senden), **interne Notiz**, **Status ändern** (mit Abschlussgrund), **zuweisen** (auch „Mir zuweisen“), **Wiedervorlage**, **Beobachten**, Ticket im Browser öffnen. Strg+Enter sendet. Ein angefangener Text bleibt als Entwurf erhalten, auch wenn sich das Popup schließt. - **Aufgaben:** meine, alle offenen, erledigte; abhaken, neue Aufgabe mit Fälligkeit, Bearbeiter und Ticket, löschen. - **Neu:** Ticket anlegen (Anfrager, Betreff, Beschreibung, Abteilung, Priorität, Bearbeiter, Kunden benachrichtigen). - **Update-Hinweis:** Alle 6 Stunden fragt die Erweiterung den Server, ob in der Plugin-Webseite eine neuere Version liegt, und zeigt dann eine Benachrichtigung und auf der Startseite einen Hinweis mit Weg zur Download-Seite. - **Mehr:** Konto, Meldungen einzeln ein-/ausschalten, Darstellung (automatisch, hell, dunkel), Team-Übersicht mit Status, Weboberfläche öffnen, Abmelden. - **Seitenleiste:** Das Symbol oben rechts im Popup öffnet DeskHub in der Seitenleiste von Chrome (bleibt offen, volle Höhe). Alternativ als eigenes Fenster. - **Zähler und Benachrichtigungen:** Jede Minute fragt die Erweiterung den Server nach Neuem; die Zahl am Symbol zählt, was seit dem letzten Öffnen dazugekommen ist. - **Rechtsklick auf Text oder Seite → „Als DeskHub-Ticket anlegen“:** öffnet das Formular mit markiertem Text und Adresse der Seite. - **Tastenkürzel:** Alt+Shift+N neues Ticket, Alt+Shift+D Seitenleiste (unter `chrome://extensions/shortcuts` änderbar). - **Adressleiste:** „dh“, Leertaste, dann Ticketnummer (öffnet das Ticket) oder Suchbegriff (sucht Tickets). ## Installieren 1. In Chrome `chrome://extensions` öffnen und **Entwicklermodus** einschalten. 2. **Entpackte Erweiterung laden** und den Ordner `chrome-erweiterung` wählen (oder das ZIP aus `release/` vorher entpacken). Eine ältere Version vorher entfernen. 3. Das DeskHub-Symbol in der Leiste anheften, anklicken und anmelden: Server-Adresse (zum Beispiel `support.example.de`), E-Mail und Passwort. Ist dein Konto mit einem Authenticator geschützt, fragt die Erweiterung danach den 6-stelligen Code. Es gibt **keine Rückfrage** und keinen zweiten Anmeldeschritt: Der Zugriff auf den Server ist im Manifest erlaubt (`host_permissions`). Die Erweiterung spricht trotzdem nur mit dem Server, bei dem du dich anmeldest. ## Sicherheit und Datenschutz - Verbindung nur über **HTTPS** (`http` nur für `localhost` zum Testen). Die Erweiterung folgt keinen Weiterleitungen und sendet keine Cookies. - Das Anmelde-Token liegt nur in `chrome.storage.local` dieser Erweiterung (nicht in `sync`, nicht im Seitencode). **Abmelden** sperrt das Token auf dem Server und löscht lokale Daten samt Entwürfen. - Der Manifest-Zugriff gilt für alle HTTPS-Adressen, damit keine Berechtigungsabfrage nötig ist; der Code verbindet sich ausschließlich mit der angemeldeten Server-Adresse. Chrome zeigt bei einer Installation aus dem Web Store dafür eine einmalige Warnung (bei „Entpackte Erweiterung laden“ nicht). - Die Oberfläche baut alles mit DOM-Aufrufen auf (kein `innerHTML` mit Serverdaten); die Inhaltsrichtlinie erlaubt nur eigene Skripte und Verbindungen über HTTPS. - Texte, die du sendest, werden als Text übertragen (Sonderzeichen maskiert); der Server bereinigt sie zusätzlich. ## Hinweise - **Ein Ticket zu öffnen sperrt es für andere** (wie in der Weboberfläche) und weist ein nicht zugewiesenes Ticket dir zu. Beim Verlassen der Ansicht wird die Sperre wieder freigegeben. - Die Erweiterung fragt **jede Minute** ab (Chrome erlaubt für Erweiterungen nicht öfter). Ist Chrome geschlossen, gibt es keine Meldungen. Dafür gibt es die Android-App und das Windows-Programm. - Anhänge werden angezeigt, aber nicht heruntergeladen: Dafür das Ticket im Browser öffnen. - Die Oberfläche ist deutsch. ## Entwickeln und testen ```bash node --test test/core.test.mjs # Kern, Hintergrunddienst, Zeitangaben mit nachgebautem Browser und Server ``` Gegen einen **echten** DeskHub-Server (Testinstallation, nicht Produktion): ```bash DESKHUB_URL=http://127.0.0.1:8181 DESKHUB_EMAIL=… DESKHUB_PASSWORD=… node --test test/integration.test.mjs ``` Der Integrationstest meldet an, ruft Stammdaten, Übersicht und Suche ab, legt ein Ticket an, prüft die Aktivitätszählung, antwortet, schreibt Notizen, setzt Wiedervorlage, Beobachten und Status, legt Aufgaben an und meldet ab (danach muss das alte Token abgelehnt werden). Ohne `DESKHUB_URL` wird er übersprungen. Der Suchtest erwartet das Ticket `T-TEST-0001` der Testinstallation. Packen für die Weitergabe: `node pack.mjs` erzeugt `../release/deskhub-chrome-erweiterung-.zip` mit nur den Laufzeitdateien. ## Aufbau | Datei | Aufgabe | |---|---| | `manifest.json` | Rechte, Hintergrunddienst, Seitenleiste, Tastenkürzel, Adressleiste, Inhaltsrichtlinie | | `background.js` | Abfrage jede Minute, Zähler, Benachrichtigungen, Rechtsklick-Menü, Kürzel, Adressleiste | | `app.html/css/js` | Gerüst der Oberfläche (Popup, Seitenleiste, Fenster) | | `views/` | Ansichten: Anmeldung, Start, Tickets, Ticket, Aufgaben, Neu, Mehr | | `lib/core.js` | Serveradresse, Anmeldung, API-Aufrufe, Zeitangaben | | `lib/dom.js`, `lib/ui.js` | DOM-Baukasten, Symbole, gemeinsame Bausteine | | `test/` | Tests |