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

grisu2099

Ich habe gerade mit folgendem Skript, das im Lesezeichen-Menü die Anzahl der Ordner/Lesezeichen je Ordner anzeigt, herumgespielt...

JavaScript

(function() {

  if (!window.gBrowser)
    return;

  function setFunction() {
    PlacesViewBase.prototype._onPopupShowing = function PVB__onPopupShowing(aEvent) {

      let popup = aEvent.originalTarget;
      this._ensureMarkers(popup);
      if ("_delayedRemovals" in popup) {
        while (popup._delayedRemovals.length) {
          popup.removeChild(popup._delayedRemovals.shift());
        }
      }
      if (popup._placesNode && PlacesUIUtils.getViewForNode(popup) == this) {
        if (!popup._placesNode.containerOpen) {
          popup._placesNode.containerOpen = true;
        }
        if (!popup._built) {
          this._rebuildPopup(popup);
        }
        this._mayAddCommandsItems(popup);
      }

      /* original function end */

      for (let item of popup.children) {
        if (item.localName != 'menu' || item.id?.startsWith('history'))
          continue;
        setTimeout(() => {
          let itemPopup = item.menupopup;
          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++;
              }
            }
          }
          if (!item.labelOriginal) {
            item.labelOriginal = item.label;
          }
          item.labelSuffix = '  (' + menuCount + '/' + menuitemCount + ')';
//          item.setAttribute("id", "menu-menuitem-count");
//          item.labelSuffix.setAttribute("color", "red");
//          item.labelSuffix = className("menu-menuitem-count");
//          item.labelSuffix.className = "menu-menuitem-count";
//          menuitemCount.setAttribute("id", "menu-menuitem-count");
          item.label = item.labelOriginal + item.labelSuffix;
        }, 100);
      }

      popup.addEventListener('popuphidden', function onPopuphidden(event) {
        if (event.target != this)
          return;
        popup.removeEventListener('popuphidden', onPopuphidden);
        for (let item of popup.children) {
          if (item.localName == 'menu') {
            if (item.labelOriginal) {
              item.label = item.labelOriginal;
              item.labelOriginal = undefined;
            }
          }
        }
      });

    }

  }

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

Alles anzeigen

Ich suche nach einem Weg, nur die Anzeige der Ordner/Lesezeichenanzahl in einer anderen Farbe darzustellen, wie in dem zusammen gebastelten Screenshot.

Kann mir da jemand auf die Sprünge helfen?

Mira_Belle

Zitat von grisu2099

...

Ich suche nach einem Weg, nur die Anzeige der Ordner/Lesezeichenanzahl in einer anderen Farbe darzustellen, wie in dem zusammen gebastelten Screenshot.
Kann mir da jemand auf die Sprünge helfen?

Um den kompletten Text einzufärben, habe ich den Selektor gefunden, aber ...

... um den Text von der "Anzeige Zähler" zu trennen, wird wohl wirklich nur mit JavaScript gehen, vermute ich mal.

Hier der Selektor für den kompletten Text:

CSS

menu.menu-iconic > label {
  color: red !important;
}

grisu2099

Den Selektor für den kompletten Eintrag zu finden ist kein Problem - das schaffe ich auch...

Zitat von Mira_Belle

wird wohl wirklich nur mit JavaScript gehen

Deswegen ja meine Frage...

Mira_Belle

Zitat von grisu2099

Den Selektor für den kompletten Eintrag zu finden ist kein Problem - das schaffe ich auch...

Zitat von Mira_Belle

wird wohl wirklich nur mit JavaScript gehen

Deswegen ja meine Frage...

Naja, im Grunde war mir das klar, war auch eher ein Selbstgespräch.

Mira_Belle

Zitat von grisu2099

Ich suche nach einem Weg, nur die Anzeige der Ordner/Lesezeichenanzahl in einer anderen Farbe darzustellen, wie in dem zusammen gebastelten Screenshot.
Kann mir da jemand auf die Sprünge helfen?

Leider bekomme ich nur den kompletten Text inkl. Pfeil eingefärbt.

JavaScript

(function() {
    if (!window.gBrowser)
      return;
 
    function setFunction() {
      PlacesViewBase.prototype._onPopupShowing = function PVB__onPopupShowing(aEvent) {
 
        let popup = aEvent.originalTarget;
        this._ensureMarkers(popup);
        if ("_delayedRemovals" in popup) {
          while (popup._delayedRemovals.length) {
            popup.removeChild(popup._delayedRemovals.shift());
          }
        }
        if (popup._placesNode && PlacesUIUtils.getViewForNode(popup) == this) {
          if (!popup._placesNode.containerOpen) {
            popup._placesNode.containerOpen = true;
          }
          if (!popup._built) {
            this._rebuildPopup(popup);
          }
          this._mayAddCommandsItems(popup);
        }
 
        /* original function end */
 
        for (let item of popup.children) {
          if (item.localName != 'menu' || item.id?.startsWith('history'))
            continue;
          setTimeout(() => {
            let itemPopup = item.menupopup;
            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++;
                }
              }
            }
            if (!item.labelOriginal) {
              item.labelOriginal = item.label;
            }
            item.labelSuffix = '  (' + menuCount + '/' + menuitemCount + ')';
            item.label = item.labelOriginal + item.labelSuffix;
 
            // Set the text color to red
            item.style.color = 'red';
          }, 100);
        }
 
        popup.addEventListener('popuphidden', function onPopuphidden(event) {
          if (event.target != this)
            return;
          popup.removeEventListener('popuphidden', onPopuphidden);
          for (let item of popup.children) {
            if (item.localName == 'menu') {
              if (item.labelOriginal) {
                item.label = item.labelOriginal;
                item.labelOriginal = undefined;
              }
            }
          }
        });
      }
    }
 
    setTimeout(function() {
      setFunction();
    }, 50);
 
  })();

Alles anzeigen

Wenn ich das richtig verstehe, hat das etwas damit zu tun, dass erst der Text gelöscht wird und danach

durch den neu erzeugten Text inkl. der Anzeige "Ordner/Lesezeichen je Ordner" ersetzt wird.

Glaube ich jedenfalls.

Mira_Belle

Zitat von grisu2099

Kann mir da jemand auf die Sprünge helfen?

Auf die Sprünge helfen.

Da ja im Skript das komplette Lable "ersetzt" wird,

wie wäre es, es so zu ändern, dass es nur die zusätzliche Anzeige hinter das Lable setzt?

Habe mich schon daran versucht, auch versucht irgendwas mit "unterschieden" zu machen,

komme aber auf keinen grünen Zweig.

Da merke ich halt, dass ich von JavaScript wenig bis gar keine Ahnung habe.

grisu2099

Zitat von Mira_Belle

dass ich von JavaScript wenig bis gar keine Ahnung habe.

Was meinst du, warum ich gefragt habe...

ich habe von JavaSkript auch (fast) keinen Schimmer.

Vielleicht hat ja einer der Skriptkundigen eine Idee.

Mira_Belle

Zitat von grisu2099

Was meinst du, warum ich gefragt habe...
ich habe von JavaSkript auch (fast) keinen Schimmer.
Vielleicht hat ja einer der Skriptkundigen eine Idee.

Ich habe mir da echt schwergetan, das Skript zu verstehen, und glaube verstehe es immer noch nicht so richtig.

Wahrscheinlich muss es komplett neu und ganz anders geschrieben werden.

So wie ich es verstanden habe, wird der Ordnername ausgelesen, dann die "Berechnungen" für die Unterordner

und Links gemacht, dies dann in eine Variable gepackt und dann aus dem ursprünglichen Namen und

den "Berechnungen" den neuen Ordnernamen generiert und den alten ersetzt.

Deshalb kommen wir auch nur an das neue Element als ganzes, da es sich ja aus originalem Ordnernamen und

den "Berechnungen" zusammen setzt.

Was ein Kauderwelsch, hoffe, es ist dennoch verständlich.

grisu2099

Schade, daß hier niemand eine Lösung anbieten kann...

BrokenHeart

Zitat von grisu2099

Schade, daß hier niemand eine Lösung anbieten kann...

Geduld... . Dafür muss, wie Mira_Belle schon richtig bemerkt hat, dass ganze Skript umgeschrieben werden.

Zitat von Mira_Belle

Wenn ich das richtig verstehe, hat das etwas damit zu tun, dass erst der Text gelöscht wird und danach
durch den neu erzeugten Text inkl. der Anzeige "Ordner/Lesezeichen je Ordner" ersetzt wird.

Genau richtig. Das ist der Grund, weswegen der Eintrag('Label') nur als Ganzes angepasst werden kann. Man muss also zwei getrennte Einträge machen: normales Label + Anzahl der Ordner/Items. Ich hatte mir das so vorgestellt, dass man über ::after und content die "ZusatzInfos" eben nur temporär (ohne DOM-Eintrag) anzeigen lässt. Ist aber nicht ganz einfach, dass alles in JavaScript einzubinden, da es dafür keine Befehle gibt. Hab aber eine mögliche Lösung gefunden, die ich noch ausprobieren muss. Mal schauen, ob das was wird...

grisu2099

Ich wußte ja nicht, daß du in dieser Causa am werkeln bist...

Dann harre ich mal der Dinge, die da (hoffentlich) bei rauskommen. Könnte mir vorstellen, das sich auch andere dann darauf stürzen.

Danke auf jeden Fall schon mal für den Versuch!

BrokenHeart

Wäre es sehr schlimm, wenn die Anzeige hinter dem Pfeil erscheint? Geht sicher auch direkt hinter dem Item-Label, aber dann müsste ich noch weiter herumexperimentieren...("X/Y" sind nur vorläufige Platzhalter).

Eigentlich finde ich es dort fast sinniger, da sich die Anzahl der Ordner/Items ja auf das noch zu öffnende Popup bezieht.

grisu2099

Ich persönlich fände es hinter dem Ordnernamen schöner - aber wenn es nicht anders geht, müßte ich damit anfreunden.

BrokenHeart

Zitat von grisu2099

Ich persönlich fände es hinter dem Ordnernamen schöner - aber wenn es nicht anders geht, müßte ich damit anfreunden.

OK. Muss ich dann später noch etwas rumschrauben, wird sicher gehen...

Jetzt habe ich mal eine erste Version zum Testen (Anzeige hinter dem Pfeil-Icon). Die CSS-Einstellungen können ab Zeile 13 vorgenommen werden und in Zeile 47 kann die textuelle Ausgabe beeinflusst werden.

Den Patch über die Prototype-Funktion in dem Original-Skript habe ich entfernt (auch aus Sicherheitsgründen) und das Löschen der Änderung beim Schließen des Popups ist jetzt auch nicht mehr nötig.

JavaScript

(function() {

    if (!window.gBrowser)
        return;

    

    function setFunction() {

        const css =`
            .countClass::after {
                content: attr(data-value); 
                color: red;
                font-size: 14px;
                font-weight: 800;
            }
        `;

        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 persToolBar = document.getElementById('PersonalToolbar');
        
        persToolBar.addEventListener('popupshowing', 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.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++;
                      }
                    }
                  }
                  item.classList.add('countClass');
                  let strCountOut = "[" + menuCount + "/" + menuitemCount + "]"
                  item.setAttribute('data-value', strCountOut);

                }, 100);
            }
        });
    }

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

Alles anzeigen

grisu2099

Funktioniert leider weder in Version 115 noch in der Nightly - auch nicht, wenn ich den kompletten CSS-Vodoo abschalte.

2002Andreas

Zitat von grisu2099

Funktioniert leider weder in Version 115 noch in der Nightly

Fx 115:

Fx 117:

grisu2099

Bei mir nicht...

Gerade auf einem zweiten Rechner getestet.

Beide aktuelles Win11 und jeweils Firefox 115 und 117.0a1

Auf beiden Rechnern mit und ohne CSS getestet.

BrokenHeart

Zitat von grisu2099

Funktioniert leider weder in Version 115 noch in der Nightly

Starte bitte einmal im Fehlerbehebungsmodus und dann wieder normal. Liegt wahrscheinlich wieder am SkriptCache.

Zitat von grisu2099

Beide aktuelles Win11

Dass es daran liegt, kann ich mir zwar nicht vorstellen, wäre aber gut, wenn jemand anderes das auf Win11 nochmal testen würde...ich habe nur Win10.

2002Andreas

Zitat von grisu2099

Bei mir nicht.

Extra mal in der Beta 116:

Auch da keine Probleme.

Zitat von BrokenHeart

ich habe nur Win10.

Dto.

grisu2099

Ändert auch nix...