Beiträge von Mira_Belle

Mira_Belle

Dann die Prüfung, ob der Firefox im richtigen Ordner installiert ist.

Code

# 3.Firefox Installationspfad
$firefoxPath = Join-Path $env:ProgramFiles "Mozilla Firefox"

# 4.Prüfen, ob der Ordner existiert
if (!(Test-Path $firefoxPath)) {
    Write-Host "Firefox-Installationsordner wurde nicht gefunden! Vorgang wird abgebrochen." -ForegroundColor Red
    exit
} else {
    Write-Host "Firefox-Installationsordner gefunden unter: $firefoxPath" -ForegroundColor Green
}

Zitat von 2002Andreas

Zitat von Mira_Belle

Mh, damit CSS funktioniert

Nur mal so, dann müsste auch gleich noch der config Eintrag dafür geändert werden.

Weiß ich, dazu komme ich später! Aber Danke für die Erinnerung.
Aber das wird, sofern überhaupt möglich, etwas komplizierter

Mira_Belle

Mh, damit CSS funktioniert, könnte man auch gleich die Erstellung der "userChrome.css"
und eventuell der "userChromeShadow.css".
Und wenn wir schon dabei sind, kann eine "userContent.css" auch gleich mit erstellt werden.

Wäre es möglich, dass Endor diese schon in sein ZIP integriert?

CSS

/* userChrome.css */
/* In dieser Datei werden alle CSS-Regeln eingefügt, die den Firefox verändern */

CSS

/* userChromeShadow.css */
/* In dieser Datei werden alle CSS-Regeln eingefügt, welche einen ::part() Selektor benötigen. */

CSS

/* userChromeShadow.css */
/* In dieser Datei werden alle CSS-Regeln eingefügt, welche eine Hompage verändern */

So in etwa könnte ich mir den Inhalt der einzelnen Dateien vorstellen.

Stand der Dinge.

Herunterladen und entpacken klappt schon mal!

Code

# 1.Zielordner für ZIP-Download und Entpacken
$tempDir = "$env:temp\FF"

# 2. ZIP herunterladen und entpacken
if (!(Test-Path $tempDir)) {
    New-Item -Path $tempDir -ItemType Directory -Force
}
    pause
$zipUrl = "https://raw.githubusercontent.com/Endor8/userChrome.js/master/userChrome/Dateien/firefox-anpassungen.zip"
$zipPath = "$tempDir\firefox-anpassungen.zip"

if (!(Test-Path $tempDir)) {
    New-Item -Path $tempDir -ItemType Directory -Force
}

Invoke-WebRequest -Uri $zipUrl -OutFile $zipPath

Expand-Archive -Path $zipPath -DestinationPath $tempDir -Force

Alles anzeigen

Mira_Belle

Auf Anregung von BrokenHeart versuche ich mich mal an einem PowerShell-Skript,
damit die entsprechenden Dateien in die richtigen Ordner kopiert werden.

Zur Erinnerung:

GitHub - Endor8/userChrome.js: Skripte für die Firefox-Erweiterung userChromeJS

Skripte für die Firefox-Erweiterung userChromeJS. Contribute to Endor8/userChrome.js development by creating an account on GitHub.

github.com

Zur Anleitung ganz nach unten scrollen.

Mira_Belle

Zitat von BrokenHeart

Du beherrscht das doch, wenn ich mich nicht täusche. Na, wie wär's ...

Würde ich ja gerne, aber so wirklich fit bin ich da auch nicht!
UND wäre auf jeden Fall auf Hilfe angewiesen.
Und dann wäre ja noch das Problem mit dem Testen!!
In einer VM sollte das kein Problem sein, aber bisher habe ich auf meinem System
es einfach noch nicht hinbekommen, so ein Ding zu starten. Ums verrecken nicht!
Da steh' ich mir wohl selbst im Weg, warum auch immer.

Nachtrag!

Ich überrasche mich immer mal wieder selber!
ABER ich scheitere am Profilpfad.

Runterladen, ok. Entpacken, ok.
Kopieren der "config.js" ins Programmverzeichnis, auch ok,
Anlegen des Ordners "userChromeJS", auch kein Ding.
Kopieren der Dateien, die da rein sollen, abgehakt.

Und dann kommt das Profilverzeichnis
Ende. Da verließen sie sie! Ich bin in einer Schaffenskrise.

"$env:APPDATA "Mozilla\Firefox\Profiles" bis hier her komme ich, und dann "xxx..default"!?
Ich muss ja in diesen Ordner um darin den "chrome"-Ordner erstellen zu können.

Jemand eine Idee?

Mira_Belle

Zitat von Sören Hentzschel

Es kommt immer darauf an, was man möchte.

So schaut's aus.

Dein Einwand kann ich durchaus verstehen, wenn man große Projekt pflegt,
wie den Onlineauftritt eines Unternehmens würde es auf jeden Fall sehr schnell unübersichtlich und kompliziert werden.

Wir reden hier aber nur von kleinen Anpassungen des Firefox.

Und man muss auch bedenken, dass weniger visierte Anwender solche Anpassungen vornehmen möchten.
Einige sind ja schon fast überfordert, die richtigen Vorbereitungen zu treffen, damit der Firefox überhaupt anpassbar wird.

Nun bin ich gespannt, was BrokenHeart zu dem Thema meint.

Eventuell trenne ich in Zukunft ja doch CSS und JavaScript, aber ich weiß es noch nicht.

Mira_Belle

@Horstmann Stimmt, das sind durchaus Punkte, die für ein ausgelagertes CSS sprechen.

Für CSS im Skript spricht "für" mich, es ist variabler.
Mann hat alles unter "Dach und Fach", und wenn man geschickt die Variablen setzt,
hat man so etwas wie ein Konfigurationsbereich, wie ich schon mit dem Hinweis auf das Scrollbar-Skript beschreiben wollte.
Auch hat man mit JavaScript Möglichkeiten, die einem nur in CSS so nicht so einfach, oder auch gar nicht, zur Verfügung stehen.

Für einen Benutzer ist ein JavaScript, so denke ich, in der Anwendung einfacher, er muss nicht mehrere Dateien in verschiedene
Verzeichnisse ablegen.
Die Konfiguration des Skriptes, wenn geschickt gemacht, sollte auch für einen Laien einfach sein, weil er ja dann,
nichts am eigentlichen Code verändern muss und brauch.

Nachteil, es werden Monster, wenn man alles Mögliche abdecken will.
Kann man ja hier in diesem Thread mit "meinem" Skript nachvollziehen.
Hatte das ursprüngliche Skript ca. 150 Zeilen,
hat die letzte funktionierende Version schon ca. 200 Zeilen.

Ich finde Javascript einfach spannend und in Kombination mit CSS steht einem der Firefox offen.
Ob nun Funktionen und Layout getrennt oder, wie ich es lieber mag, Funktionen und Layout kombiniert in einer Datei,
ist wohl eine Frage der persönlichen Vorlieben. Denke ich.

Was sagt DIhr dazu Sören Hentzschel und BrokenHeart ?
Interessiert mich, bitte einen kleinen Kommentar.

Mira_Belle

Zitat von Horstmann

Was mich angeht, manche Sachen kann ich einfach nicht...

Ok, ich tu mir mit CSS ziemlich schwer, was so "Funktionen angeht.
Da bist Du der Fuchs.

Aber es ist, war eine generelle Frage!

Mira_Belle

Mh, was sind die Vor- bzw. Nachteile, wenn man das meiste davon direkt in JavaScript umsetzt?
Ich frag' nur aus Neugierde!

Mira_Belle

@Horstmann Da Du ja auch nicht zm Ende kommst, könnte ich auch nicht die Finger vom Skript lassen.

Ergebnis:

Und man kann es über "useStyle = "1" umstellen auf:

Und das alles nur, wie ich vermutete, mit einer kleinen Ergänzung am Ende des Skripts.

JavaScript

          let strCountOut1 = String(menuCount).padEnd(2, " ");
          bmContent.setAttribute('data-value1', strCountOut1);

... ersetzen durch ...

JavaScript

          let strCountOut2 = (useStyle === 0) 
            ? String(menuitemCount).padStart(4, "/  ")
            : String(menuitemCount).padEnd(2, " ");
          bmContent.setAttribute('data-value2', strCountOut2);

Nachwort!

Natürlich hätte ich auch ganz einfach den CSS-Block dafür anpassen können,
so aber ergeben sich ganz andere Möglichkeiten.
Z.B. könnte man auch per "Einstellung" ganz einfach die Anzeige ohne diesen Backslash erscheinen lassen..

Mira_Belle

Das Schöne am JavaScript ist ja, wenn man sich wirklich gut auskennt,
dass man ganz zu Anfang nur jene "Schalter" (also bestimmte Variablen) stellt,
die der User sich für seine eigenen Bedürfnisse einstellt.

Weitere Variablen, die irgendetwas berechnen, stellt man hinten an!

So bleibt der restliche Code unangetastet und nichts geht kaputt.

Wie z.B. beim Appmenu-Skript oder beim Scrollbar-Skript.

Mira_Belle

Zitat von Horstmann

Wenn's nach mir ginge, würde ich eh lieber ein Paket mit komplett separaten JS und CSS Dateien plus Icons machen.

So sind die Geschmäcker verschieden. Ich habe "Veränderungen" am Firefox lieben kompakt in einer Datei!

Zitat von Horstmann

Trennstrichcode speziell für grisu2099 ,

Und das mit dem Trennstrich geht auch im Code ganz am Ende recht einfach!
let strCountOut2 = String(menuitemCount).padStart(3, "/ ");

Könnte man auch irgendwie in die "Weiche" (useStyle) mit einbauen.
Da ein solcher Trennstrich je nach gewünschter Anzeige an anderer Stelle sein müsste.

Und ob so ein Trennstrich überhaupt angezeigt werden soll.
Aber da mache ich mich jetzt nicht mehr dran
Ich brauche es nicht und es sprengt dann doch irgendwie den Rahmen,
vom Umfang des ganzen.
Das Skript, "mein" Skript, bietet ja jetzt schon mehr, als ich selbst benötige,
aber es hat mich einfach gejuckt, das mit der "Weiche" (Option der Anzeige).

Mira_Belle

Mh, bitte beachten!

JavaScript

let useStyle1 = true; // <- HIER Weiche setzen: true = Variante 1, false = Variante 2

durch

JavaScript

let useStyle = 1; // <- HIER Weiche setzen:  0 = Symbole hinter den Zählern, 1 = Symbole vor den Zählern

sowie

JavaScript

let cssBeforeBlock1 = `

und

JavaScript

let cssBeforeBlock2 = `

durch

JavaScript

let css_one = `

JavaScript

let css_two = `

und

CSS

      /* Dynamisch gewählter before-Block */
      ${useStyle1 ? cssBeforeBlock1 : cssBeforeBlock2}

durch

CSS

      /* Dynamisch gewählter before-Block */
      ${useStyle ? css_one : css_two}

Find' ich etwas besser.

Mira_Belle

Zitat von Horstmann

Wenn's jetzt noch eine Möglichkeit gäbe, die Reihenfolge von Icon und Zähler einfach umzukehren, ohne neues Script/CSS.

Etwas Woodoo

JavaScript

(function() {

  if (!window.gBrowser)
      return;

  setTimeout(function() {
    setFunction();
  },50);

  //Custom icons in profile/chrome/icons folder
  let ProfilePath = PathUtils.toFileURI(PathUtils.join(PathUtils.profileDir, 'chrome', 'icons'));
  let icon1 = "folder-fat.svg";                     //  Custom  Folder Icon
  let icon2 = "bookmark-hollow.svg";                //  Custom  Link Icon
  //let icon3 = "arrow-right_II.svg";                 //  Custom  Arrow Icon
  let icon3 = "arrow-right.svg";

  // Custom settings
  let bm_font_size = 12; 
  let cs_font_weight = 700;
  //let cs_font_color = "#FFD700";
  //let cs_icon_color = "#C0C0C0";
  let bm_icon_size = 16;

  // NEU: Schriftfarbe getrennt definieren
  //let cs_font_color_1 = "#FFA500";                 // Farbe für Folder-Zähler (links)
  //let cs_font_color_2 = "#00FFFF";                 // Farbe für Link-Zähler (rechts)
  let cs_font_color_1 = "#FFD700";                 // Farbe für Folder-Zähler (links)
  let cs_font_color_2 = "#FFD700";                 // Farbe für Link-Zähler (rechts)

  // NEU: Symbolfarber getrennt definieren 
  //let cs_icon_color_1 = "#5fe575";                 // Farbe für "Ordner", 1.Symbol
  //let cs_icon_color_2 = "#fbf328";                 // Farbe für "Link", 2.Symbol
  //let cs_icon_color_3 = "#bbf700";                 // Farbe für den Pfeil
  let cs_icon_color_1 = "#C0C0C0";                 // Farbe für "Ordner", 1.Symbol
  let cs_icon_color_2 = "#C0C0C0";                 // Farbe für "Link", 2.Symbol
  let cs_icon_color_3 = "#C0C0C0";                 // Farbe für den Pfeil


  // Calculated settings
  let cs_font_size = `${bm_font_size}px`;
  let cs_icon_size = `${bm_icon_size}px`;
  let cs_width_one = `calc(${bm_icon_size}px + 1.4em)`;
  let cs_width_uno = `calc(${bm_icon_size}px)`;
  let cs_width_two = `calc(${bm_icon_size}px + 1.4em)`;
  let cs_width_due = `calc(${bm_icon_size}px)`;

  let useStyle1 = false; // <- HIER Weiche setzen: true = Variante 1, false = Variante 2

  // Symbole hinter den Zählern
  let cssBeforeBlock1 = `

    /* Counter #1 Folder */
    #bmContent::before {
      content: attr(data-value1);
      width: ${cs_width_one};
      align-items: center;
      display: flex;
      justify-content: end;
      margin-inline: 16px 4px;                        /* min. Abstand links für enge Popups, rechts zum 2ten Counter */
      background-image: url("${ProfilePath}/${icon1}")!important;
      background-position: center right calc(${cs_width_one} - ${cs_icon_size});
      background-repeat: no-repeat;
      background-size: ${cs_icon_size} ${cs_icon_size};     
      color: ${cs_font_color_1};                        /* Farbe der 1. Zahl */
      fill: ${cs_icon_color_1};                         /* Farbe des 1. Symbols */
    }

    /* Counter #2 Links */
    #bmContent::after {
      content: attr(data-value2);
      width: ${cs_width_two};
      align-items: center;
      display: flex;
      justify-content: end;
      margin-inline: -2px;
      background-image: url("${ProfilePath}/${icon2}") !important;
      background-position: center right calc(${cs_width_two} - ${cs_icon_size});
      background-repeat: no-repeat;
      background-size: ${cs_icon_size} ${cs_icon_size};            
      color: ${cs_font_color_2};                        /* Farbe der 2. Zahl */
      fill: ${cs_icon_color_2};                         /* Farbe des 2. Symbols */
    }
  `;

  // Symbole vor den Zählern
  let cssBeforeBlock2 = `

    /* Counter #1 Folder */
    #bmContent::before {
      content: attr(data-value1);
      width: ${cs_width_one};
      align-items: center;
      display: flex;
      justify-content: end;
      background-image: url("${ProfilePath}/${icon1}")!important;
      background-position: center right calc(${cs_width_uno} - ${cs_icon_size});
      background-repeat: no-repeat;
      background-size: ${cs_icon_size} ${cs_icon_size};     
      color: ${cs_font_color_1};                        /* Farbe der 1. Zahl */
      fill: ${cs_icon_color_1};                         /* Farbe des 1. Symbols */
      padding: 4px 20px 0px 10px;
      margin-inline: 0px -10px;
    }

  	#bmContent::after {
			content: attr(data-value2);
      width: ${cs_width_two};
      align-items: center;
      display: flex;
      justify-content: end;
      /*justify-content: flex-end; */
      background-image: url("${ProfilePath}/${icon2}")!important;
      background-position: center right calc(${cs_width_due} - ${cs_icon_size});
      background-repeat: no-repeat;
      background-size: ${cs_icon_size} ${cs_icon_size};            
      color: ${cs_font_color_2};                        /* Farbe der 2. Zahl */
      fill: ${cs_icon_color_2};                         /* Farbe des 2. Symbols */
			padding: 4px 22px 0 0;
		}
  `;

  function setFunction() {

    const css =`

      /* Counter rechtsbuendig */
      #bmContent {
        display: flex !important;
        margin-inline: auto 0 !important;
        font-family:  Consolas, "Lucida Console", "Courier New", monospace !important;
        font-size: ${cs_font_size} !important;
        font-weight: ${cs_font_weight} !important;
        height: ${cs_icon_size};
      }

      /* Dynamisch gewählter before-Block */
      ${useStyle1 ? cssBeforeBlock1 : cssBeforeBlock2}

      /* Pfeil */
      menupopup > menu::after {
        content: "";
        background-image: url("${ProfilePath}/${icon3}")!important;
        height: ${cs_icon_size};
        height: ${cs_icon_size};
        fill: ${cs_icon_color_3} !important;
      }

    `;

    const sss = Cc['@mozilla.org/content/style-sheet-service;1'].getService(Ci.nsIStyleSheetService);
    const uri = Services.io.newURI('data:text/css,' + encodeURIComponent(css));
    sss.loadAndRegisterSheet(uri, sss.AGENT_SHEET);

    let bmbMenu = document.getElementById('bookmarks-menu-button');
    let bookMenu = document.getElementById('bookmarksMenu');
    let persToolBar = document.getElementById('PersonalToolbar');

    if(bmbMenu)
        bmbMenu.addEventListener('popupshowing', onPopupShowing );
    if(bookMenu)
        bookMenu.addEventListener('popupshowing', onPopupShowing );
    if(persToolBar)
        persToolBar.addEventListener('popupshowing', onPopupShowing );
  }

  function onPopupShowing(aEvent) {

    let popup = aEvent.originalTarget;

    for (let item of popup.children) {
      if (item.localName != 'menu' || item.id?.startsWith('history'))
        continue;
        setTimeout(() => {
          let itemPopup = item.menupopup;
			    itemPopup.hidden = true;
			    itemPopup.collapsed = true;
          itemPopup.openPopup();
          itemPopup.hidePopup();
          let menuitemCount = 0;
          let menuCount = 0;
          for (let subitem of itemPopup.children) {
            if (subitem.classList.contains('bookmark-item') && !subitem.disabled && !subitem.hidden) {
              if (subitem.localName == 'menuitem') {
                menuitemCount++;
              } else if (subitem.localName == 'menu') {
                  menuCount++;
                }
            }
          }
          itemPopup.hidden = false;
          itemPopup.collapsed = false;

          // Neues Element für Zaehler
          let bmCounta = item.childNodes[1];
            if (!bmCounta) return;                            // Falls undefiniert
          bmCounta.innerHTML = ""
          let bmContent = document.createElement("bmContent");
          bmContent.id = "bmContent";
          bmCounta.appendChild(bmContent);

          //let strCountOut1 = "" + menuCount + "";           //  Has no brackets
          //let strCountOut1 = "(" + menuCount + ")";         //  Has round brackets
          //let strCountOut1 = "[" + menuCount + "]";         //  Has square brackets
          let strCountOut1 = String(menuCount).padEnd(2, " ");
          bmContent.setAttribute('data-value1', strCountOut1);

          //let strCountOut2 = "" + menuitemCount + "";        //  Has no brackets
          //let strCountOut2 = "(" + menuitemCount + ")";      //  Has round brackets
          //let strCountOut2 = "[" + menuitemCount + "]";      //  Has square brackets
          let strCountOut2 = String(menuitemCount).padEnd(2, " ");
          bmContent.setAttribute('data-value2', strCountOut2);

        }, 100);
    }
  }
})();

Alles anzeigen

Mira_Belle

Zitat von grisu2099

Hast du nicht - geht auch ohne
Vergessen hast du dagegen das i in important - und ohne das geht es natürlich nicht...

Noch dümmer!

Nutze nun ein eigenes Symbol und diesen Code:

CSS

menupopup > menu::after {
  content: "";
  background-image: url("${ProfilePath}/${icon3}")!important;
  height: ${cs_icon_size};
  height: ${cs_icon_size};
  fill: ${cs_icon_color_3} !important;
}

Danke an alle.

Zitat von Sören Hentzschel

Ein Hoch auf die Syntax-Hervorhebung in unserem Forum.

Ja, hätte mir auffallen müssen.
Kommt davon, wenn man zwischen kochen und coden hin und her springt.
War aber einfach mal wieder zu ungeduldig.

Mira_Belle

Zitat von 2002Andreas

Teste bitte wenn du magst:

Och komm'.
Kann doch nicht wahr sein!
Habe ich einfach -moz-context-properties: fill !important; vergessen.
Klar geht es dann nicht.

Aber Danke 2002Andreas für den leichten Schlag auf den Hinterkopf.

Mira_Belle

Nebenkriegsschauplatz!

Ich wollte diesen Pfeil direkt beeinflussen.
Farbe ändern.
Den Selektor habe ich gefunden.

CSS

menupopup > menu::after {
  content: "";
  background-image: url("chrome://global/skin/icons/arrow-right.svg");
  background-size: contain;
  width: 1em;
  height: 1em;
  fill: lime !mportant;
}

Trage ich DAS in die Stilbearbeitung ein, ändert sich die Farbe.
Toll.
Trage ich den Code im Skript ein, tut sich nichts

Mira_Belle

Zitat von Horstmann

Was war denn die Fehlerkorrektur, und in welchem Script?

Mh. Ich habe mich da womöglich missverständlich ausgedrückt!
Es war kein Fehler im Skript, sondern ich habe da eine Fehlerkorrektur eingebaut!

JavaScript

if (!bmCounta) return;                            // Falls undefiniert

Nachtrag.

Habe noch etwas gebastelt
Ich wollte die Farben der "Zähler" sowie der Symbole getrennt voneinander einstellen können.
Resultat:

JavaScript

  // Custom settings
  let bm_font_size = 12; 
  let cs_font_weight = 700;
  //let cs_font_color = "#FFD700";
  //let cs_icon_color = "#C0C0C0";
  let bm_icon_size = 16;

  // NEU: Schriftfarbe getrennt definieren
  let cs_font_color_1 = "#FFD700";                 // Farbe für Folder-Zähler (links)
  let cs_font_color_2 = "#00FFFF";                 // Farbe für Link-Zähler (rechts)

  // NEU: Symbolfarber getrennt definieren 
  let cs_icon_color_1 = "#5fe575";                 // Farbe für "Ordner", 1.Symbol
  let cs_icon_color_2 = "#fbf328";                 // Farbe für "Link", 2.Symbol

  // Calculated settings
  let cs_font_size = `${bm_font_size}px`;
  let cs_icon_size = `${bm_icon_size}px`;
  let cs_width_one = `calc(${bm_icon_size}px + 1.4em)`;
  let cs_width_two = `calc(${bm_icon_size}px + 1.4em)`;

  function setFunction() { ...

Alles anzeigen

Natürlich müssen auf die "Aufrufe" der Variablen angepasst werden
Wer es nicht hinbekommt, fragen, dann gibt es das ganze Skript.

Nur um es zu verdeutlichen, extreme Farben!

Mira_Belle

So, lieber Horstmann, habe etwas an Deinem neuen Skript herumgebastelt!
Für mich ist es jetzt perfekt!
Ich danke Dir ganz, ganz lich für Dein gelungenes CSS!
Ich habe mir erlaubt, die Variablen in JavaScript zu realisieren.
Man beachte bitte die kleine Fehlerkorrektur in Zeile 125.

Ganz toll finde ich, dass ich nun wieder SVG nutzen kann, die eben nicht auf 16px*16px fest genagelt sind,
sondern eben auch solche, die viel größer sind!

Hier nun meine finale Abwandlung!

JavaScript

// BookmarkCount.uc.js

/* ******************************************************************************************************************* */
/* Author BrokenHeart               => https://www.camp-firefox.de/forum/thema/136572/?postID=1229536#post1229536 **** */
/* Correction from BrokenHeart      => https://www.camp-firefox.de/forum/thema/136572/?postID=1229696#post1229696 **** */
/* Extension from Sören Henschel    => https://www.camp-firefox.de/forum/thema/136572/?postID=1229555#post1229555 **** */
/* Customized by Mira inspired by grisu2099     ********************************************************************** */
/* Source                           => https://www.camp-firefox.de/forum/thema/136572/?postID=1229875#post1229883 **** */
/* Customized by Mira inspired by Horstmann     ********************************************************************** */
/* Source                           => https://www.camp-firefox.de/forum/thema/136572/?postID=1229993#post1229993 **** */
/* Adjustments for 139 and customized by Mira inspired by Horstmann     ********************************************** */
/* Source                           => https://www.camp-firefox.de/forum/thema/136572/?postID=1270254#post1270254 **** */
/* ******************************************************************************************************************* */
/* Version 1.01                     => https://www.camp-firefox.de/forum/thema/136572/?postID=1230128#post1230128 **** */
/* Version 1.02                     => https://www.camp-firefox.de/forum/thema/136572/?postID=1230334#post1230334 **** */
/* Version 1.03a                    => https://www.camp-firefox.de/forum/thema/136572/?postID=1270258#post1270258 **** */
/* ******************************************************************************************************************* */
/* Custom Counter in the Bookmarks for folders and links ************************************************************* */
/* ******************************************************************************************************************* */

(function() {

  if (!window.gBrowser)
      return;

  setTimeout(function() {
    setFunction();
  },50);

  //Custom icons in profile/chrome/icons folder
  let ProfilePath = PathUtils.toFileURI(PathUtils.join(PathUtils.profileDir, 'chrome', 'icons'));
  let icon1 = "folder-fat.svg";                     //  Custom  Folder Icon
  let icon2 = "bookmark-hollow.svg";                //  Custom  Link Icon

  // Custom settings
  let bm_font_size = 12; 
  let cs_font_weight = 700;
  let cs_font_color = "#FFD700";
  let cs_icon_color = "#C0C0C0";
  let bm_icon_size = 16;

  // Calculated settings
  let cs_font_size = `${bm_font_size}px`;
  let cs_icon_size = `${bm_icon_size}px`;
  let cs_width_one = `calc(${bm_icon_size}px + 1.4em)`;
  let cs_width_two = `calc(${bm_icon_size}px + 1.4em)`;

  function setFunction() {

    const css =`

      /* Counter rechtsbuendig */
      #bmContent {
        display: flex !important;
        margin-inline: auto 0 !important;
        font-family:  Consolas, "Lucida Console", "Courier New", monospace !important;
        font-size: ${cs_font_size} !important;
        font-weight: ${cs_font_weight} !important;
        height: ${cs_icon_size};
      }

      /* Counter #1 Folder */
      #bmContent::before {
        content: attr(data-value1);
        width: ${cs_width_one};
        align-items: center;
        display: flex;
        justify-content: end;
        margin-inline: 16px 4px;                        /* min. Abstand links für enge Popups, rechts zum 2ten Counter */
        background-image: url("${ProfilePath}/${icon1}")!important;
        background-position: center right calc(${cs_width_one} - ${cs_icon_size});
        background-repeat: no-repeat;
        background-size: ${cs_icon_size} ${cs_icon_size};     
        color: ${cs_font_color};                        /* Farbe der 1. Zahl */
        fill: ${cs_icon_color};                         /* Farbe des 1. Symbols */
      }

      /* Counter #2 Links */
      #bmContent::after {
        content: attr(data-value2);
        width: ${cs_width_two};
        align-items: center;
        display: flex;
        justify-content: end;
        margin-inline: -2px;
        background-image: url("${ProfilePath}/${icon2}") !important;
        background-position: center right calc(${cs_width_two} - ${cs_icon_size});
        background-repeat: no-repeat;
        background-size: ${cs_icon_size} ${cs_icon_size};            
        color: ${cs_font_color};                        /* Farbe der 2. Zahl */
        fill: ${cs_icon_color};                         /* Farbe des 2. Symbols */
      }
    `;

    const sss = Cc['@mozilla.org/content/style-sheet-service;1'].getService(Ci.nsIStyleSheetService);
    const uri = Services.io.newURI('data:text/css,' + encodeURIComponent(css));
    sss.loadAndRegisterSheet(uri, sss.AGENT_SHEET);

    let bmbMenu = document.getElementById('bookmarks-menu-button');
    let bookMenu = document.getElementById('bookmarksMenu');
    let persToolBar = document.getElementById('PersonalToolbar');

    if(bmbMenu)
        bmbMenu.addEventListener('popupshowing', onPopupShowing );
    if(bookMenu)
        bookMenu.addEventListener('popupshowing', onPopupShowing );
    if(persToolBar)
        persToolBar.addEventListener('popupshowing', onPopupShowing );
  }

  function onPopupShowing(aEvent) {

    let popup = aEvent.originalTarget;

    for (let item of popup.children) {
      if (item.localName != 'menu' || item.id?.startsWith('history'))
        continue;
        setTimeout(() => {
          let itemPopup = item.menupopup;
			    itemPopup.hidden = true;
			    itemPopup.collapsed = true;
          itemPopup.openPopup();
          itemPopup.hidePopup();
          let menuitemCount = 0;
          let menuCount = 0;
          for (let subitem of itemPopup.children) {
            if (subitem.classList.contains('bookmark-item') && !subitem.disabled && !subitem.hidden) {
              if (subitem.localName == 'menuitem') {
                menuitemCount++;
              } else if (subitem.localName == 'menu') {
                  menuCount++;
                }
            }
          }
          itemPopup.hidden = false;
          itemPopup.collapsed = false;

          // Neues Element für Zaehler
          let bmCounta = item.childNodes[1];
            if (!bmCounta) return;                            // Falls undefiniert
          bmCounta.innerHTML = ""
          let bmContent = document.createElement("bmContent");
          bmContent.id = "bmContent";
          bmCounta.appendChild(bmContent);

          //let strCountOut1 = "" + menuCount + "";           //  Has no brackets
          //let strCountOut1 = "(" + menuCount + ")";         //  Has round brackets
          //let strCountOut1 = "[" + menuCount + "]";         //  Has square brackets
          let strCountOut1 = String(menuCount).padEnd(2, " ");
          bmContent.setAttribute('data-value1', strCountOut1);

          //let strCountOut2 = "" + menuitemCount + "";        //  Has no brackets
          //let strCountOut2 = "(" + menuitemCount + ")";      //  Has round brackets
          //let strCountOut2 = "[" + menuitemCount + "]";      //  Has square brackets
          let strCountOut2 = String(menuitemCount).padEnd(2, " ");
          bmContent.setAttribute('data-value2', strCountOut2);

          // Attribut parent va für 0 + 0
          if (bmContent.parentElement) {
            bmContent.parentElement.classList.add('pfeil');
            bmContent.parentElement.setAttribute('data-value3', strCountOut1 + strCountOut2);
          }
        }, 100);
    }
  }
})();

Alles anzeigen

Funktioniert in der Nightly.

Mira_Belle

Ich habe auch so meine Probleme.
1. Die Grafiken lassen sich nicht mehr einzeln ansprechen, damit man z.B. unterschiedliche Farben wählen kann.

Das andere Problem konnte ich lösen. Die Variablen

JavaScript

(function() {

  if (!window.gBrowser)
      return;

  setTimeout(function() {
    setFunction();
  },50);

  //Custom icons in profile/chrome/icons folder
  let ProfilePath = PathUtils.toFileURI(PathUtils.join(PathUtils.profileDir, 'chrome', 'icons'));
  //let icon1 = "Test_3.svg"                    //  Custom  Folder Icon
  let icon1 = "folder-fat.svg";
  let icon2 = "bookmark-hollow.svg";           //  Custom  Link Icon

  let cs_font_size = 12;
  let cs_font_weight = 700;
  let cs_font_color = "#FFD700";
  let cs_icon_color = "#C0C0C0";

  let bm_icon_size = 16;
  let cm_icon_size = `${bm_icon_size}px`;
  let cm_width_one = `calc(${bm_icon_size}px + 1.4em)`;
  let cm_width_two = `calc(${bm_icon_size}px + 1.4em)`;

  function setFunction() {

    const css =`

      /* Counter rechtsbuendig */
      #bmContent {
        display: flex !important;
        margin-inline: auto 0 !important;
        font-family:  Consolas, "Lucida Console", "Courier New", monospace !important;
        font-size: ${cs_font_size}px !important;
        font-weight: ${cs_font_weight} !important;
      }

      /* Feste Breite der Counter abhaengig von Anzahl/Grösse Ziffern -> Icons untereinander auf gleicher Hoehe */
      /* --bm_width = Icon Grösse 16px Standard + Fontbreite (+ Abstand Icon zu Zahl)  gelöscht "+ 2px" */

      #bmContent {
        background-image: url("${ProfilePath}/${icon1}"), url("${ProfilePath}/${icon2}") !important;
        background-position: center left calc(${cm_icon_size}),
                             center right calc(${cm_width_two} - ${cm_icon_size});                     
        background-repeat: no-repeat;
        background-size: ${cm_icon_size} ${cm_icon_size};
        height: ${cm_icon_size};
        fill: ${cs_icon_color};                         /* Farbe der Icons */
      }      

      /* Counter #1 Folder */
      #bmContent::before {
        content: attr(data-value1);
        width: ${cm_width_one};
        align-items: center;
        display: flex;
        justify-content: end;
        margin-inline: 16px 8px;   /* min. Abstand links für enge Popups, rechts zum 2ten Counter */     
        color: ${cs_font_color};                        /* Farbe der 1. Zahl */
      }

      /* Counter #2 Links */
      #bmContent::after {
        content: attr(data-value2);
        width: ${cm_width_two};
        align-items: center;
        display: flex;
        justify-content: end;
        color: ${cs_font_color};                        /* Farbe der 2. Zahl */
        margin-inline: -2px;
      }
    `;

    const sss = Cc['@mozilla.org/content/style-sheet-service;1'].getService(Ci.nsIStyleSheetService);
    const uri = Services.io.newURI('data:text/css,' + encodeURIComponent(css));
    sss.loadAndRegisterSheet(uri, sss.AGENT_SHEET);

    let bmbMenu = document.getElementById('bookmarks-menu-button');
    let bookMenu = document.getElementById('bookmarksMenu');
    let persToolBar = document.getElementById('PersonalToolbar');

    if(bmbMenu)
        bmbMenu.addEventListener('popupshowing', onPopupShowing );
    if(bookMenu)
        bookMenu.addEventListener('popupshowing', onPopupShowing );
    if(persToolBar)
        persToolBar.addEventListener('popupshowing', onPopupShowing );
  }

  function onPopupShowing(aEvent) {

    let popup = aEvent.originalTarget;

    for (let item of popup.children) {
      if (item.localName != 'menu' || item.id?.startsWith('history'))
        continue;
        setTimeout(() => {
          let itemPopup = item.menupopup;
			    itemPopup.hidden = true;
			    itemPopup.collapsed = true;
          itemPopup.openPopup();
          itemPopup.hidePopup();
          let menuitemCount = 0;
          let menuCount = 0;
          for (let subitem of itemPopup.children) {
            if (subitem.classList.contains('bookmark-item') && !subitem.disabled && !subitem.hidden) {
              if (subitem.localName == 'menuitem') {
                menuitemCount++;
              } else if (subitem.localName == 'menu') {
                  menuCount++;
                }
            }
          }
          itemPopup.hidden = false;
          itemPopup.collapsed = false;

          // Neues Element für Zaehler
          let bmCounta = item.childNodes[1];
            if (!bmCounta) return;                            // Falls undefiniert
          bmCounta.innerHTML = ""
          let bmContent = document.createElement("bmContent");
          bmContent.id = "bmContent";
          bmCounta.appendChild(bmContent);

          //let strCountOut1 = "" + menuCount + "";           //  Has no brackets
          //let strCountOut1 = "(" + menuCount + ")";         //  Has round brackets
          //let strCountOut1 = "[" + menuCount + "]";         //  Has square brackets
          let strCountOut1 = String(menuCount).padEnd(2, " ");
          bmContent.setAttribute('data-value1', strCountOut1);

          //let strCountOut2 = "" + menuitemCount + "";        //  Has no brackets
          //let strCountOut2 = "(" + menuitemCount + ")";      //  Has round brackets
          //let strCountOut2 = "[" + menuitemCount + "]";      //  Has square brackets
          let strCountOut2 = String(menuitemCount).padEnd(2, " ");
          bmContent.setAttribute('data-value2', strCountOut2);

          // Attribut parent va für 0 + 0
          if (bmContent.parentElement) {
            bmContent.parentElement.classList.add('pfeil');
            bmContent.parentElement.setAttribute('data-value3', strCountOut1 + strCountOut2);
          }
        }, 100);
    }
  }
})();

Alles anzeigen

Mira_Belle

Und das laut Aussage von Sören ja auch überhaupt nichts mit BitLocker zu tun.
Nur blöd, wenn man von dem Key gar nichts weiß und MS einem die Daten weggeschlossen hat.

Aber das gibt es ja so gar nicht, schreiben hier so einige!

Beiträge von Mira_Belle

Installations Skript zur Vorbereitung des FF zur Nutzung von JavaScript. [ps1 verfügbar]

Installations Skript zur Vorbereitung des FF zur Nutzung von JavaScript. [ps1 verfügbar]

Installations Skript zur Vorbereitung des FF zur Nutzung von JavaScript. [ps1 verfügbar]

Nur die Anzeige der Ordner/Lesezeichenanzahl in einer anderen Farbe darstellen

Nur die Anzeige der Ordner/Lesezeichenanzahl in einer anderen Farbe darstellen

Nur die Anzeige der Ordner/Lesezeichenanzahl in einer anderen Farbe darstellen

Nur die Anzeige der Ordner/Lesezeichenanzahl in einer anderen Farbe darstellen

Nur die Anzeige der Ordner/Lesezeichenanzahl in einer anderen Farbe darstellen

Nur die Anzeige der Ordner/Lesezeichenanzahl in einer anderen Farbe darstellen

Nur die Anzeige der Ordner/Lesezeichenanzahl in einer anderen Farbe darstellen

Nur die Anzeige der Ordner/Lesezeichenanzahl in einer anderen Farbe darstellen

Nur die Anzeige der Ordner/Lesezeichenanzahl in einer anderen Farbe darstellen

Nur die Anzeige der Ordner/Lesezeichenanzahl in einer anderen Farbe darstellen

Nur die Anzeige der Ordner/Lesezeichenanzahl in einer anderen Farbe darstellen

Nur die Anzeige der Ordner/Lesezeichenanzahl in einer anderen Farbe darstellen

Nur die Anzeige der Ordner/Lesezeichenanzahl in einer anderen Farbe darstellen

Nur die Anzeige der Ordner/Lesezeichenanzahl in einer anderen Farbe darstellen

Nur die Anzeige der Ordner/Lesezeichenanzahl in einer anderen Farbe darstellen

Nur die Anzeige der Ordner/Lesezeichenanzahl in einer anderen Farbe darstellen

Windows 11