Userscript und Storage

  • localStorage funktioniert hier nicht, was ich mir fast schon dachte. Gibt es eine andere Möglichkeit, eine Variable dauerhaft zu speichern? Also so, das auch nach einem Neustart noch darauf zurückgegriffen werden kann? :)

    Code
    if ( typeof( Storage ) !== "undefined" ) {
    	localStorage.setItem( 'Key' , 'Value' );
    }

    Windows 10 | FF 62.0 (64-Bit) / FF 61.0 (64-Bit) / FF 63.0 (64-Bit)

  • Wat für'n Userscript meinste denn? Greasemonkey oder userChrome.js? Greasemonkey lässt z.B. das Speichern und Auslesen von Variablen über aboutconfig /prefs.js zu.

  • Ja, das war missverständlich. :)
    Ich meine die userChrome.js. Ich benötige eine Funktion, die es erlaubt eine Variable zu speichern und wieder abzurufen.
    Also so, wie man das von localStorage kennt. localStorage funktioniert aber nicht.

    Windows 10 | FF 62.0 (64-Bit) / FF 61.0 (64-Bit) / FF 63.0 (64-Bit)

  • Öhm, aber sicher doch. :)

    Ich habe mir ja hier diesen CSS-Switcher gebastelt:
    https://www.camp-firefox.de/forum/viewtopic.php?f=16&t=122197

    Und damit ich mich nicht nach jedem Neustart des Browsers immer wieder zu meinem aktuell genutzten Style durchswitchen muss, habe ich den so umgeschrieben, das bei jedem Switch die jeweilige ID der CSS-Datei in eine gewöhnliche Textdatei direkt in chrome gespeichert wird. Der zuletzt genutzte Style wird also bei einem Neustart wieder eingebunden.

    Dazu benutze ich diese Funktion:

    Um die gespeicherte ID beim Browserstart abzurufen, benutze ich das hier:


    Mehr dazu hier bei MDN: https://developer.mozilla.org/en-US/Add-ons/…ippets/File_I_O
    Die Read-Version musste ich allerdings umschreiben, weil die MDN-Version einen Syntax-Fehler produziert.


    Die Switch-Funktion selbst wird durch einen Button ausgelöst und schaut mittlerweile so aus:

    Am Ende meines UserScripts löse ich einmal die click()-Funktion des Buttons aus, damit das zuletzt benutzte CSS-File eingebunden wird:

    Code
    document.getElementById('fp-switch').click();

    Windows 10 | FF 62.0 (64-Bit) / FF 61.0 (64-Bit) / FF 63.0 (64-Bit)

  • Es gibt keine doofen Fragen. :)

    Mit Hilfe des CSS-Switchers kann ich zwischen verschiedenen Farbvariationen für das Styling des Browsers auswählen.
    Gewöhnlich sieht eine Farbangabe so aus:

    Code
    background: red;
    border-color: #ff0000;
    color: rgb(255,0,0);
    usw.

    Das ist okay. Geiler ist es aber, wenn man sämtliche Farbangaben (oder auch andere häufig genutzte Styles) übersichtlich per Variablen definiert.
    Das schaut dann so aus:

    Code
    :root {
    	--var-rot: rgb(255,0,0);
    	--var-gelb: yellow;
    	--var-blau: #0000ff;
    	--what-ever: ...
    }


    Diese Definitionen lassen sich jetzt überall im CSS einsetzen:

    Code
    background: var(--var-rot);
    border-color: var(--var-gelb);

    Der Vorteil dabei ist, das ich bei späteren Änderungswünschen nicht im gesamten CSS die Änderung vornehmen muss, sondern einfach nur die Variable ändere.
    Man kann sämtliche CSS-Definitionen in eine Datei schreiben, also in die userChrome.css. Man kann allerdings sein CSS auch zwecks Überschaubarkeit auf mehrere Dateien aufteilen und dann in der Hauptdatei einbinden. Das mache ich und bei mir schaut die userChrome.css so aus:

    In meiner fp-switch-0.css sind also sämtliche Farbangaben als Variablen definiert. Jetzt habe ich allerdings nicht nur diese eine, sondern mehrere solcher Dateien mit Farbangaben. Jede dieser Dateien präsentiert ein Color Scheme.
    Und mit Hilfe des CSS-Switchers, den ich mir gebastelt habe, kann ich nun diese Dateien dynamisch nachladen, zwischen den Farbschemen wechseln und somit die Farbgebung des Browsers nach Belieben anpassen.
    War das verständlich?... :D

    Windows 10 | FF 62.0 (64-Bit) / FF 61.0 (64-Bit) / FF 63.0 (64-Bit)