CSS aus diesem Script holen ?

[caroorac]

Hallo,
was css betifft kenn ich mich ein wenig aus aber in JavaScript garnicht.

Deshalb bitte um Hilfe.

könnte mir jemand dieses Script so umschreiben das der CSS Code in einer Extra Datei ausgelagert werden kann ?

oder ist es zu aufwendig ?

(function() {
    
    const Cu = Components.utils;
    if (!window.FileUtils) Cu.import('resource://gre/modules/FileUtils.jsm');
    if (!window.Services) Cu.import('resource://gre/modules/Services.jsm');

    setTimeout(function() {
         saveTo()
    }, 200);


    function saveTo() {
        // Config
        var dirArray = [
['G:\\xxx', 'G:\\xxx'],
['G:\\xxx', 'G:\\xxx']
];
        let button = document.getElementById("unknownContentType").getButton("cancel");
        let saveTo = button.parentNode.insertBefore(document.createXULElement("button"), button);
        var saveToMenu = saveTo.appendChild(document.createXULElement("menupopup"));
            
        saveTo.classList.toggle("dialog-button");
        saveTo.label = "Speichern in..";
        saveTo.type = "menu";
        
        var css =`
hbox.dialog-button-box button.dialog-button menupopup {
    background: aqua !important;
}

hbox.dialog-button-box button.dialog-button menupopup menuitem.menuitem-iconic:hover{
    background: red !important;
}

hbox.dialog-button-box button.dialog-button menupopup menuitem.menuitem-iconic hbox.menu-iconic-left {
    padding-left: 5px !important;
}

hbox.dialog-button-box button.dialog-button menupopup menuitem.menuitem-iconic label.menu-iconic-text{
    padding-right: 5px !important;
    padding-left: 4px !important;
}
`;

        var sss = Cc['@mozilla.org/content/style-sheet-service;1'].getService(Ci.nsIStyleSheetService);
        var uri = Services.io.newURI('data:text/css,' + encodeURIComponent(css))
        sss.loadAndRegisterSheet(uri, sss.AGENT_SHEET);
        
        dirArray.forEach(function(dir) {
            var [name, dir] = [dir[1], dir[0]];
            var mi = document.createXULElement("menuitem");
            var item = saveToMenu.appendChild(mi);
            item.setAttribute("label", (name || (dir.match(/[^\\/]+$/) || [dir])[0]));
            item.setAttribute("image", "moz-icon:file:///" + dir + "\\");
            item.setAttribute("class", "menuitem-iconic");
            item.addEventListener("command", function() {
                var file = new FileUtils.File(dir.replace(/\\/g, '\\\\') + '\\\\' + (document.getElementById('locationtext') ? document.getElementById('locationtext').value : document.getElementById('location').value));
                 dialog.mLauncher.saveDestinationAvailable(file);
                dialog.onCancel = function() {};
                close();
            });
        });
        
    
        
    }
}());

 

[mikdoe]

Du meinst dieses var css =`...`? Das soll aus einer externen Datei geladen werden anstatt im Quellcode zu stehen? Wenn das für Browser sein soll und nicht für Node.js etc. wüsste ich nur das Nachladen in Form von JS Code wie z. B. hier: https://stackoverflow.com/questions/14521108/dynamically-load-js-inside-js

Ansonsten wüsste ich nicht, wie man die Sicherheitsbarriere des Browsers in's Dateisystem überwinden könnte.

 

[caroorac]

naja den Teil mit CSS ist kein Problem das der Browser das animmt.

Ich weis nur nicht wie man diesen Abschnitt auslagert so das die Classen erhalten bleiben.

Wenn ich das wüsste könnte alles zusammenfassen was ich noch in CSS habe. Ist aber nicht für dieses Script gedacht.
Das ist das einzige Script wo noch so ein mischmasch ist.

Naja wenn es nicht geht dann erstmal Danke schön.

 

[mikdoe]

Moment. Du möchtest das CSS einfach in einer Standard "statischen" CSS Datei stehen haben, die in einem HTML-Document geladen wird? Dann hatte ich das falsch verstanden. Das geht natürlich. Und Klassen weist man mit JS z. B. mit .className zu. Was genau ist da unklar beim Umschreiben?

 

[kkapsner]

Der Code sieht nach einem legacy Addon aus.
Da müsstest du, soweit ich das noch weiß, das CSS als Resource deklarieren und dann bei var uri = Services.io.newURI('data:text/css,' + encodeURIComponent(css)) statt der data-URL den Resourcenpfad eingeben.

 

[caroorac]

Hallo,
Sorry erstmal das ich mich jetzt erst melde.
Habe ich total vergessen

Das Script ist für den Firefox Browser und ich habe alles was CSS Betrifft in verschiedene dateien gepackt bzw es hat jemand gemacht für mich.

Ich hatte Zoff mit Ihm und jetzt kann er mich mal

Aber das Scrip ist eines womit ich garnicht klar komme weil ich meist mit CSS und HTML zu tun habe aber JS oder Java garnicht.

Naja Danke trotzdem.