Durch Skripte erzeugte Icons - lokal gespeicherte .png-Icons statt base64 verwenden - wie funktioniert es?

  • Firefox-Version
    81.0
    Betriebssystem
    Win10Pro

    Ich möchte bei den von mir verwendeten Skripten die im Skript eingebetteten base64-Icons gegen auf dem Rechner gespeicherte .png-Icons austauschen.

    Leider reichen meine Java-Script-Kenntnisse dafür nicht aus und die bisherigen Versuche ergaben nichts brauchbares.

    Weiß jemand von euch, wie ich das anstellen kann (bzw., ob das überhaupt geht)?

  • Zur hilfreichsten Antwort springen
  • Beispiel:

    In Zeile 33 habe ich versucht, die base64 durch ein im Ordner chrome/Icons gespeichertes .png-Icon zu ersetzen.

    Dazu habe ich ganz naiv versucht, den kompletten Inhalt hinter url( durch ../Icons/Neustart.png) zu ersetzen. :/

    Dadurch verschwand aber nur das Icon und es blieb ein leeres Feld zurück. Das Skript an sich funktioniert aber...

  • %2B hat da nix verloren in base64, entweder das oder Klartext. Ich würde base64 vorziehen, das ist ortsunabhängig.

    Wenn du weinen möchtest, bist du falsch hier. Hier gibt es nur Lösungen!
    Oh Herr, wirf Hirn, oder Steine - Hauptsache, du triffst endlich.
    Zu viele Goofies und Dulleks vom Dienst. Schlabokka!

  • Ob das was darin verloren hat, steht doch gar nicht zur Debatte.

    So, wie oben gepostet, funktioniert das Skript.

    Es war auch nicht die Frage, was du vorziehen würdest. Ich möchte lokal gespeicherte Icons einsetzen und wissen ob, und wenn ja, wie das funktioniert.

    • Hilfreichste Antwort

    Es scheint, dass Sie die URL der lokalen Datei angeben müssen.

    Ich wünschte, ich könnte den Dateipfad verkürzen, aber vorerst wurde das Schaltflächensymbol angezeigt.

    JavaScript
    style: 'list-style-image: url("file:///C:/Users/user/AppData/Roaming/Mozilla/Firefox/Profiles/j8yc1b7b.Default User/chrome/Icons/Restart.png")',
  • wie das funktioniert.

    Funktioniert damit und sieht dann so aus:

  • Ich habe den vorherigen Beitrag gelöscht, weil ich die Daten parallel verifizieren wollte. Also der base64 to image/hex decoder* sagt, dass die Daten ungültig sind, auch wenn vorne PNG steht. base64 enthält hier wohl auch Zeichen, / = +, aber da ist kein % drin. Deswegen ist es mir auch aufgefallen, dennoch zeigt Firefox es an. Das Script interessiert mich nicht. Nix für ungut. Falls du einen guten Encoder benötigst:

    https://www.base64-image.de/

    * https://base64.guru/converter/decode/image

    * https://base64.guru/converter/decode/hex

    Wenn du weinen möchtest, bist du falsch hier. Hier gibt es nur Lösungen!
    Oh Herr, wirf Hirn, oder Steine - Hauptsache, du triffst endlich.
    Zu viele Goofies und Dulleks vom Dienst. Schlabokka!

  • einen relativen Pfad einsetzen?

    Ich habe mit den Pfadangaben auch meistens Probleme;)

    Wenn ich das so in einen .css Code eingebe:

    background: url("..//Icons/Computer_File_061.gif")no-repeat !important;

    funktioniert das einwandfrei, und das Icon wird angezeigt.

    In einem Script funktioniert das so zumindest nicht.

    Da klappt nur die genaue Pfadangabe wie moko2000 auch geschrieben hat.:thumbup:

  • In einem Script funktioniert das so zumindest nicht.

    Könnte es an der Kodierung liegen? Dass du bestimmte Zeichen escapen musst? Der relative Pfad stimmt auch? Siehe auch

    https://stackoverflow.com/questions/2188…n-external-file

    Wenn du weinen möchtest, bist du falsch hier. Hier gibt es nur Lösungen!
    Oh Herr, wirf Hirn, oder Steine - Hauptsache, du triffst endlich.
    Zu viele Goofies und Dulleks vom Dienst. Schlabokka!

  • Wenn ich die CSS-Datei vom Fox 81 ändere und das Ergebnis in der Nightly überprüfen will, kann das auch nicht funktionieren...

    Klar, beide verwenden unterschiedliche Profile.

    Übersetzer für Obersorbisch und Niedersorbisch auf pontoon.mozilla.org u.a. für Firefox, Firefox für Android, Firefox für iOS, Firefox Klar/Focus für iOS und Android, Thunderbird, Pootle, Django, LibreOffice, LibreOffice Onlinehilfe, WordPress

  • JavaScript ist aber nicht CSS, das hab ich selbst mal merken dürfen (länger her). Das hat ja einer im verlinkten Thema dort nochmal betont:

    When in script, paths are relative to displayed page

    Ich vermute immer noch, dass du vom Script selbst ausgehen musst und nicht von der Wurzel des Aufrufes.

    In welchem Ordner liegen die Scripte bei dir nochmal?

    Wenn du weinen möchtest, bist du falsch hier. Hier gibt es nur Lösungen!
    Oh Herr, wirf Hirn, oder Steine - Hauptsache, du triffst endlich.
    Zu viele Goofies und Dulleks vom Dienst. Schlabokka!

  • Demnach müsste es sein: ../Icons/2.png ? (nur einen Schräger, nicht zwei wie oben)

    (aber irgendwie sagtest du, dass nicht)

    Ich weiss jetzt nicht, wie viel Energie du noch reinstecken möchtest, aber man kann feststellen, in welchem Pfad ein Script liegt:

    https://stackoverflow.com/questions/2161159/get-script-path

    Kann man sich per console.log ausgeben lassen

    Wenn du weinen möchtest, bist du falsch hier. Hier gibt es nur Lösungen!
    Oh Herr, wirf Hirn, oder Steine - Hauptsache, du triffst endlich.
    Zu viele Goofies und Dulleks vom Dienst. Schlabokka!