Technische Details - BuxarTranslate Dokumentation

Datei: technical.html
Zweck: Technische Informationen über Architektur, API und interne Struktur

📁 Projektstruktur

buxartranslate/ ├── manifest.json # Erweiterungskonfiguration ├── background.js # Hintergrundskript (Hauptlogik) ├── popup.html # Popup-Oberfläche ├── popup.js # Popup-Logik ├── icons/ # Erweiterungssymbole │ ├── icon-16.png │ ├── icon-32.png │ ├── icon-48.png │ ├── icon-64.png │ └── icon-128.png └── _locales/ # Lokalisierung ├── en/ │ └── messages.json ├── ru/ │ └── messages.json ├── de/ │ └── messages.json ├── es/ │ └── messages.json ├── it/ │ └── messages.json └── fr/ └── messages.json

🔑 Wichtige Dateien

manifest.json

Typ: WebExtension für Thunderbird

API-Version: 78.0+

Berechtigungen: storage, menus, notifications, activeTab

background.js

Zweck: Hauptlogik der Erweiterung

Funktionen: Kontextmenü, Übersetzungs-API, Fensterverwaltung

popup.js

Zweck: Einstellungsoberflächenlogik

Funktionen: Einstellungsverwaltung, Sprachsuche, Lokalisierung

🌐 API und Integrationen

Google Translate API

Spracherkennung: https://translate.googleapis.com/translate_a/single?client=gtx&sl=auto&tl=de&dt=ld&q=...

Textübersetzung: https://translate.googleapis.com/translate_a/single?client=gtx&sl=auto&tl=de&dt=t&q=...

// Übersetzungsfunktion über Google API
async function translateWithGoogle(text, sourceLang, targetLang) {
  const url = `https://translate.googleapis.com/translate_a/single?client=gtx&sl=${sourceLang}&tl=${targetLang}&dt=t&q=${encodeURIComponent(text)}`;
  const response = await fetch(url);
  
  if (!response.ok) {
    throw new Error(`Google API error: ${response.status}`);
  }
  
  const data = await response.json();
  let translatedText = "";
  
  if (data && data[0]) {
    data[0].forEach(item => {
      if (item[0]) translatedText += item[0];
    });
  }
  
  return preserveLineBreaks(translatedText || text, text);
}
            

Thunderbird WebExtension API

browser.menus

Kontextmenü-Erstellung und -Verwaltung

browser.menus.create({
  id: "translate",
  title: menuTitle,
  contexts: ["selection"]
});
                    

browser.storage

Einstellungs- und Datenspeicherung

// Einstellungen speichern
await browser.storage.local.set(settings);

// Einstellungen laden  
const settings = await browser.storage.local.get(defaultSettings);
                    

browser.notifications

Systembenachrichtigungsanzeige

browser.notifications.create({
  type: "basic",
  iconUrl: "icon.png",
  title: title,
  message: message
});
                    

browser.windows

Übersetzungsfenster-Verwaltung

const translationWindow = await browser.windows.create({
  url: url,
  type: 'popup',
  width: 550,
  height: 600
});
                    

🔄 Nachrichtensystem

Kommunikation zwischen Erweiterungskomponenten:

// Nachrichtenhandler in background.js
browser.runtime.onMessage.addListener((request, sender, sendResponse) => {
  if (request.action === "getTranslation") {
    browser.storage.local.get("lastTranslation").then(result => {
      sendResponse(result);
    });
    return true;
  }
  
  if (request.action === "getSettings") {
    // ... Einstellungsanfragebehandlung
  }
  
  if (request.action === "saveSettings") {
    // ... Einstellungsspeicherbehandlung
  }
});
            

💾 Datenspeicherung

// Datenstruktur in localStorage
{
  // Benutzereinstellungen
  "translateTo": "de",
  "autoDetectLanguage": true,
  "windowDisplayTime": 30,
  "userLang": "auto",
  
  // Kürzlich verwendete Sprachen
  "recentLanguages": ["de", "en", "ru", "es", "fr"],
  
  // Übersetzungsverlauf
  "lastTranslation": {
    "original": "Hello world",
    "translated": "Hallo Welt",
    "sourceLang": "en", 
    "targetLang": "de",
    "timestamp": 1700000000000,
    "translator": "google"
  },
  
  // Geöffnete Übersetzungsfenster-ID
  "translationWindowId": 12345
}
            

🔧 Erweiterungsarchitektur

Komponentenstruktur

Background Script - Hauptlogik, Kontextmenü, API-Aufrufe
Popup Interface - Benutzeroberfläche für Einstellungen
Translation Window - Separates Fenster für Übersetzungsanzeige
Localization System - Mehrsprachige Oberflächenunterstützung

Datenfluss

Benutzer wählt Text aus → Kontextmenü
Background-Skript erhält Text → erkennt Sprache
Anfrage an Google Translate API → erhält Übersetzung
Speichert Übersetzung → zeigt Benachrichtigung und Fenster
Aktualisiert Popup-Oberfläche mit Übersetzungsverlauf

🛡️ Sicherheit

HTTPS-Verbindungen

Alle Google-API-Anfragen werden über sicheres HTTPS-Protokoll durchgeführt

Lokale Speicherung

Benutzereinstellungen und Daten werden lokal im Browser gespeichert

Minimale Berechtigungen

Erweiterung fordert nur notwendige Berechtigungen für den Betrieb an

Fehlerbehandlung

Umfassendes Fehlerbehandlungs- und Anzeigesystem für Benutzer

← Zurück: Einstellungen Weiter: Lokalisierung →

🔧 BuxarTranslate Technische Details