1. Nachrichten
  2. Forum
    1. Unerledigte Themen
    2. Forenregeln
  3. Spenden
  • Anmelden
  • Registrieren
  • Suche
Alles
  • Alles
  • Artikel
  • Seiten
  • Forum
  • Erweiterte Suche
  1. camp-firefox.de
  2. Horstmann

Beiträge von Horstmann

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

    • Horstmann
    • 7. Juli 2025 um 19:04
    Zitat von BrokenHeart

    Aber ich habe festgestellt, dass diese neue Version von mir das Hauptproblem, nämlich die nachträgliche Verbreiterung des Popups, nicht wie gehofft behebt :(. Was ich nicht verstehe, da ja alle Berechnungen vor der Sichtbarkeit des Popups durchgeführt werden :/.

    Hmm, bei meinem Problem damit geht das als Lösung, mit meinem und deinem Script. :/
    Wobei wir verschiedene Fx Versionen und OS zwischen uns haben.

    Hättest du mal ein gif dazu - und hast du das Ganze in einem Testprofil, bzw. ohne irgendwelches externes CSS probiert?
    Ohne darauf endlos rumreiten zu wollen, nur wenn's passt. ;)

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

    • Horstmann
    • 7. Juli 2025 um 15:47
    Zitat von BrokenHeart

    Den einzigen Unterschied zwischen #1 und #2 sehe ich nur bei einem nachträglichen "Refresh" der unteren Zähler in #2, der ist bei #1 nicht vorhanden und daher sieht es hier etwas besser aus.

    Also dieser "Refresh", das Problem habe ich schon länger in meinen Script Versionen, quer durch alle Popups.
    Die Zähler werden teils, aber nicht alle, "refreshed" beim erneuten Öffnen des gleichen Popups.:/
    Mit deinem Script gibt es das Problem nicht.

    Ich hab mir schon den Wolf gesucht und ewig dagegen angetestet, aber ich befürchte dass mein Code etwas zu grob aufgebaut ist um die ganzen Vorgänge sauber auszuführen.

    Ohne aufwendige Tests von dir zu erwarten, fällt dir evtl. auf die Schnelle etwas auf in meinem Code, das dahingehend optimiert werden könnte?
    Aber das soll keine neue Baustelle werden, nur falls du oder sonst jemand einen schnellen Tip hätte! ;)
    Ich hänge das Gif nochmal an.

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

    • Horstmann
    • 7. Juli 2025 um 11:14
    Zitat von BrokenHeart

    Hier der Block, der sich geändert hat. Geht im Test-Skript von Zeile 30 bis Zeile 50. Alles andere braucht nicht angepasst werden:

    Läuft hier nach erstem Testen tip-top, gefühlt etwas sauberer als meine Version! :thumbup:

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

    • Horstmann
    • 6. Juli 2025 um 22:37

    Update:

    Edit: Anpassung für Menüleiste, etwas Code Optimierung.

    JavaScript
    //bookmark_count.uc.js, RC_5.T Tresterschnaps
    //Anfang Juli 2025
    //Zeigt Anzahl der Lesezeichenordner und Links an in Lesezeichenpopups
    //basiert auf Script von BrokenHeart =>
    //https://www.camp-firefox.de/forum/thema/136572-nur-die-anzeige-der-ordner-lesezeichenanzahl-in-einer-anderen-farbe-darstellen/?postID=1269879#post1269879
    //Release Candidate 5.T: Fix Menueleiste Lesezeichen Popup von BrokenHeart
    //https://www.camp-firefox.de/forum/thema/136572-nur-die-anzeige-der-ordner-lesezeichenanzahl-in-einer-anderen-farbe-darstellen/?postID=1274978#post1274978
    
    (function() {
        if (!window.gBrowser)
            return;
        setTimeout(function() {
            setFunction();
        },50);
    
        //Einstellungen Javascript =>
        //Nach Script Aenderungen Neustart mit Start-Cache loeschen => about:support
    
        //Eigenes Icon erwartet in Profilordner/chrome/icons, icons Ordner falls noetig erstellen
        //Eigene Icons eintragen, falls vorhanden
        let ProfilePath = PathUtils.toFileURI(PathUtils.join(PathUtils.profileDir, 'chrome', 'icons'));
        let bm_icon1 = 'YourFolderIcon.svg';        //  Custom  Folder Icon
        let bm_icon2 = 'YourLinkIcon.svg';          //  Custom  Link Icon
        //Variablen zur Auswahl der Icons; kein Auto Fallback falls eigenes Icon nicht vorhanden
        let bm_icon_folder = 0;      //  Ordner: 0 Firefox Fallback Icon / 1 eigenes Icon
        let bm_icon_link = 0;        //  Links:  0 Firefox Fallback Icon / 1 eigenes Icon
    
        //Variablen zur Auswahl der Klammern
        let bm_bracket = 0;           //  0 keine Klammern / 1 runde Klammern / 2 eckige Klammern
        //Variablen zur Auswahl der Reihenfolge
        let bm_order = 0;             //  0 Icons links Ziffern rechts / 1 Ziffern links Icons rechts
    
        //Variablen zur Auswahl der Farben
        let bm_colors = 0;            //  0 Standardfarben / 1 eigene Farben benutzen
    
        //Verblassen bei Zahl = 0
        let bm_opacity_null = 1;      //  0 kein Verblassen / 1 Verblassen Zahl, Icon, Trennlinie / 2 Verblassen nur Zahl
    
        //Variablen zur Auswahl der Trennlinie
        //  0 ohne Trennlinie
        //  1 ohne Trennlinie / Zaehler #1 = 0 => Zaehler #1 + Icon #2 wird versteckt
        //  2 mit Trennlinie
        //  3 mit Trennlinie nur bei Zaehler #1 > 0 / Zaehler #1 = 0 => Zaehler #1 + Icon #2 wird versteckt
        let trenner = 2;
        //  Trennlinie Inhalt, beliebige Textzeichen
        let trennzeichen = '|';
    
        function setFunction() {
            const css =`
    
           /*
           Einstellungen CSS , OPTIONAL =>
           #A Zaehler (Counter) anpassen,
           #B Feinabstimmung allgemein,
           #C Feinabstimmung Zentrierung Trennlinie,
           #D Eigene Farben, Verblassen,
           #E Allgemeines,
           #F Optionale Extras.
           */
    
           /*** User Einstellungen ***/
    
           /* ------ A ------ */
    
           /** Feste Breite der beiden Counter, abhaengig von Anzahl Ziffern, AUTO Anpassung für mit/ohne Klammern.
              Falls noetig => Werte erhoehen NUR bis Icons untereinander auf gleicher Hoehe sind **/
    
           /* Beispiel: 2 Ziffern plus Klammern, Systemfont Mac */
           #bmContent:is(
           [data-value1^='['],
           [data-value1^='(']) {
              --bm_width_one: 2.1em;
              --bm_width_two: 2.1em;
              }
           /* Beispiel: 2 Ziffern ohne Klammern, Systemfont Mac */
           #bmContent {
              --bm_width_one: 1.3em;
              --bm_width_two: 1.3em;
    
           /* ------ B ------ */
    
           /** Abstaende / Groessen fuer die Counter = Basisanpassungen **/
    
              /* Abstand mittig zwischen Counter #1 <=> Counter #2 / wird x2 benutzt */
              --bm_margin_mid: 8px;
    
              /* Groesse Icons = 16px Firefox Standard */
              --bm_icon_size: 16px;
    
              /* Abstand zwischen Icon und Ziffer */
              --bm_space: 4px;
              }
    
           /* ------ C ------ */
    
           /** Trennlinie , fuer trenner = 2/3 **/
    
           /* Feinabstimmung Zentrierung Mitte / Standard = 0px */
           #bmContent.trennclass {
              --bm_divider: 0px;
              }
           /* Fuer Reihenfolge/ Order = 1 */
           #bmContent.trennclass.order_2 {
              --bm_divider: 0.3em;
              }
           /* Element Trennlinie allgemein */
           #trennID {
              display: flex;
              align-items: center;
              font-size: calc(1em - 1px);        /* Hoehe, optional */
              padding-bottom: 1px;               /* ausrichten vertikal, optional */
              color: var(--trenn_color, currentColor);
              }
    
           /* ------ D ------ */
    
           /* Eigene Farben, fuer bm_colors = 1 */
           /* Farben Text / kompatible svg Icons aendern , anpassen nach Belieben */
           /* Info: HSL Farben: https://www.w3schools.com/css/css_colors_hsl.asp */
           /* Ordner Icon, Zahl / Links Icon, Zahl / Trennlinie */
           #bmContent.bm_my_colors {
              --folder_fill:  hsl(190, 60%, 20%, 1);
              --folder_color: hsl(190, 20%, 30%, 1);
              --link_fill:    hsl(35, 100%, 20%, 1);
              --link_color:   hsl(35, 60%, 30%, 1);
              --trenn_color:  hsl(250, 60%, 30%, 1);
              }
    
           /* Grad des Verblassens bei Zahl = 0, fuer bm_opacity_null = 1/2 */
           #bmContent {
              --bm_opacity: 50%;
              }
    
           /* ------ E ------ */
    
           /** Counter gesamt **/
    
           #bmContent {
              display: flex !important;
              -moz-context-properties: fill, fill-opacity;
              margin-left: auto !important;         /* Gesamt rechtsbuendig */
              /*margin-right: -8px !important;*/    /* Abstand rechts zu Pfeil > ist evtl. OS abhaengig, optional */
              height: var(--bm_icon_size);          /* Layout passt sich Icon Groesse an */
              padding-left: 8px;                    /* min. Abstand links Gesamt für enge Popups */
    
           /* Font Aenderungen , optional */
              /* font-family: Aenderungen nicht empfohlen => einheitlichen Standardfont behalten */
              /*font-size: 12px !important;*/       /* font-size */
              /*font-weight: 200 !important;*/      /* font-weight */
              }
    
           /* ------ F ------ */
    
           /** Optionale Extras **/
    
           /* Text vertikal ausrichten */
           /*
           #bmContent::after,
           #bmContent::before {
              padding-top: 3px;
              }
              */
    
           /* Pfeil rechts > bei Beidem = 0 */
           .bookmark-item.bm_chevron_00 > .menu-right,
           .bookmark-item.bm_chevron_00::after {
              fill: hsl(30, 100%, 50%, 1) !important;
              fill-opacity: 0.7 !important;
              }
    
           /* Hide empty Popup */
           .bookmark-item.bm_chevron_00 > menupopup[emptyplacesresult] {
              display: none !important;
              }
    
           /** Pfeil rechts > allgemein **/
           /*
           menu.bookmark-item .menu-right,
           menu.bookmark-item::after {
               fill: hsl(210, 100%, 50%, 1) !important;
               fill-opacity: 1 !important;
               }
               */
    
           /*** User Einstellungen Ende ***/
    
    
           /*** Feste Werte ***/
    
           /** Reihenfolge Varianten Icons / Ziffern **/
           /* order 0: Icons links / Ziffern rechts */
           #bmContent {
                --bm_padding_inline: calc(var(--bm_icon_size) + var(--bm_space)) 0;
                --bm_bg_position: center left;
                }
           /* order 1: Ziffern links / Icons rechts */
           #bmContent.order_2 {
                --bm_padding_inline: 0 calc(var(--bm_icon_size) + var(--bm_space));
                --bm_bg_position: center right;
                }
    
           /** Icons Varianten **/
           /* Eigene Icons, falls Icons existieren im icons Ordner */
           #bmContent {
                --bm_icon_image_1: url("${ProfilePath}/${bm_icon1}");
                --bm_icon_image_2: url("${ProfilePath}/${bm_icon2}");
                }
           /* Firefox Icons Fallback */
           #bmContent.icon_fallback_folder {
                --bm_icon_image_1: url("chrome://global/skin/icons/folder.svg");
                }
           #bmContent.icon_fallback_link {
                --bm_icon_image_2: url("chrome://browser/skin/bookmark-hollow.svg");
                }
    
           /** Anpassungen bei Zahl = 0 **/
           /* Verstecken #1 automatisch bei Trennlinie 1/3 , beides = 0 */
           #bmContent:is(.trennclass_1, .trennclass_3)::before {
                display: none !important;
                }
           /* Verstecken Icon #2 , Trennlinie 1/3 , beides = 0 */
           #bmContent.Null_1.Null_2:is(.trennclass_1, .trennclass_3)::after {
                /*content: "X";*/             /* eigener Inhalt */
                background-image: linear-gradient(transparent, transparent);
                }
           /* Verblassen Icon + Zahl, fuer #1 , #2 , Alles Zahl = 0 */
           #bmContent.opacity_Null:is(.Null_1:not(.Null_2), .Null_1.Null_2)::before,
           #bmContent.opacity_Null:is(.Null_2:not(.Null_1), .Null_1.Null_2)::after,
           #bmContent.opacity_Null:is(.Null_1, .Null_2) #trennID {
                filter: opacity(var(--bm_opacity));
                }
           /* Verblassen nur Zahl */
           #bmContent.opacity_Null_B:is(.Null_1:not(.Null_2), .Null_1.Null_2)::before {
                -webkit-text-fill-color: color-mix(in srgb, var(--folder_color, currentColor) var(--bm_opacity), transparent) !important;
                }
           #bmContent.opacity_Null_B:is(.Null_2:not(.Null_1), .Null_1.Null_2)::after {
                -webkit-text-fill-color: color-mix(in srgb, var(--link_color, currentColor) var(--bm_opacity), transparent) !important;
                }
    
           /** Counters (Zaehler) **/
           /* Counter #1 Ordner */
           #bmContent::before {
                content: attr(data-value1);
                display: flex;
                min-width: fit-content;
                width: var(--bm_width_one);
                padding-inline: var(--bm_padding_inline);
                align-items: center;
                justify-content: flex-end;
                margin-right: var(--bm_margin_mid);
                background-image: var(--bm_icon_image_1);
                background-position: var(--bm_bg_position);
                background-repeat: no-repeat;
                background-size: var(--bm_icon_size);
                color: var(--folder_color, currentColor) !important;
                fill: var(--folder_fill, currentColor) !important;
                }
           /* Counter #2 Links */
           #bmContent::after {
                content: attr(data-value2);
                display: flex;
                min-width: fit-content;
                width: var(--bm_width_two);
                padding-inline: var(--bm_padding_inline);
                align-items: center;
                justify-content: flex-end;
                margin-left: calc(var(--bm_margin_mid) - var(--bm_divider, 0px));
                background-image: var(--bm_icon_image_2);
                background-position: var(--bm_bg_position);
                background-repeat: no-repeat;
                background-size: var(--bm_icon_size);
                color: var(--link_color, currentColor) !important;
                fill: var(--link_fill, currentColor) !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) {
          		let bmbMenuPopup = document.getElementById('BMB_bookmarksPopup');
          			if(bmbMenuPopup) {
            				bmbMenuPopup.openPopup();
            				bmbMenuPopup.hidePopup();
            				bmbMenuPopup.setAttribute("hasbeenopened","true");
            			}
                bmbMenu.addEventListener('popupshowing', onPopupShowing );
    		    }
            if(bookMenu) {
          		let bookMenuPopup = document.getElementById('bookmarksMenuPopup');
          			if(bookMenuPopup) {
            				bookMenuPopup.openPopup();
            				bookMenuPopup.hidePopup();
                    bookMenuPopup.setAttribute("hasbeenopened","true");
          		   	}
                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;
    
                  //Eigenes Element für Zaehler
                  const bmCounta = item.childNodes[1];
                  bmCounta.innerHTML = '';
                  const bmVario = document.createElement("bmElement");
                  bmVario.id = "bmContent";
                  bmCounta.appendChild(bmVario);
    
                  //Zaehler Design Optionen =>  ohne/ mit: runde, eckige Klammern
                  let strCountOut1, strCountOut2;
                  switch (bm_bracket) {
                    case 0:
                       strCountOut1 = '' + menuCount + '';
                       strCountOut2 = '' + menuitemCount + '';
                      break;
                    case 1:
                       strCountOut1 = '(' + menuCount + ')';
                       strCountOut2 = '(' + menuitemCount + ')';
                      break;
                    case 2:
                       strCountOut1 = '[' + menuCount + ']';
                       strCountOut2 = '[' + menuitemCount + ']';
                      break;
                  }
                  bmVario.setAttribute('data-value1', strCountOut1);
                  bmVario.setAttribute('data-value2', strCountOut2);
    
                  // Anpassungen fuer 00, #1 = 0, #2 = 0
                  if (menuCount === 0) {
                      bmVario.classList.add('Null_1');
                      }
                  if (menuitemCount === 0) {
                      bmVario.classList.add('Null_2');
                      }
                  // Verblassen bei Anzeige = 0
                  if (bm_opacity_null === 1) {
                      bmVario.classList.add('opacity_Null');
                    } else if (bm_opacity_null === 2) {
                         bmVario.classList.add('opacity_Null_B');
                         }
                  // Extra class item / ganzes menu fuer 00
                  if (menuCount === 0 && menuitemCount === 0) {
                      item.classList.add('bm_chevron_00');
                      } else {
                         item.classList.remove('bm_chevron_00');
                         }
    
                  // Trennlinie Element
                  const trennelementVario = document.createElement("trennelement");
                  trennelementVario.id = "trennID";
                  // Trennlinie Varianten
                  if (trenner === 2 || trenner === 3 && menuCount !== 0) {
                      bmVario.appendChild(trennelementVario);
                      trennelementVario.textContent = trennzeichen;
                      bmVario.classList.add('trennclass');
                    } else if (trenner === 3 && menuCount === 0) {
                        bmVario.classList.add('trennclass_3');
                    } else if (trenner === 1 && menuCount === 0) {
                        bmVario.classList.add('trennclass_1');
                        }
    
                  // Reihenfolge Varianten Icons / Ziffern
                  if (bm_order === 1) {
                      bmVario.classList.add('order_2');
                      }
    
                  // Icons Auswahl
                  if (bm_icon_folder === 0) {
                      bmVario.classList.add('icon_fallback_folder');
                      }
                  if (bm_icon_link === 0) {
                      bmVario.classList.add('icon_fallback_link');
                      }
    
                  // Farben Auswahl
                  if (bm_colors === 1) {
                      bmVario.classList.add('bm_my_colors');
                      }
    
                }, 100);
            }
        }
    })();
    Alles anzeigen
  • Nur die Anzeige der Ordner/Lesezeichenanzahl in einer anderen Farbe darstellen

    • Horstmann
    • 6. Juli 2025 um 21:43
    Zitat von Mira_Belle

    Oh, Gott. Ja, das "nachladen" der Counter beim ersten Aufruf, egal welcher Lesezeichen, habe ich auch.
    Nur geht das so schnell, dass es mich gar nicht stört!
    Was die Breite angeht, die habe ich irgendwo festgezurrt, diesen Effekt, "dynamische" Breitenanpassung habe ich gar nicht!

    Danke wieder mal für's Testen! :)

    Übrigens: in meinem eigenen, tatsächlich benutzten Hauptprofil ist die Popupbreite für den Lesezeichenmenü Button auch festgemeisselt, es ist mit zusammen einigen anderen Anpassungen mein Hauptnavigator für Lesezeichen - und ich benutze dieses Script für die Zähler nicht in diesem Popup - der Code den wir gerade diskutieren ist bei mir auskommentiert. ;)

    Eigentlich benutze ich es nur für die Lesezeichenleiste Popups, und die Lesezeichenleiste benutze ich 2x im Monat, die Menüleiste/Lesezeichen Schaltfläche 2x im Jahr (am Mac geht das Script eh nicht an der Stelle).

    Aber es geht um das Prinzip und das Kulturgut, gerade heute ist es wichtig dafür zu kämpfen! ^^

    Apropos, #570? :/

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

    • Horstmann
    • 6. Juli 2025 um 18:46
    Zitat von Dharkness

    Die Breite des Menupopups wird wohl dynamisch der Breite des Inhalts angepasst, deshalb wohl die sichtbare Änderung der Breite, ...

    Hmm, das hat noch niemand erwähnt auf den letzten paar Seiten, und schon gar nicht im Detail beschrieben. ;)

    Zitat von BrokenHeart

    Den einzigen Unterschied zwischen #1 und #2 sehe ich nur bei einem nachträglichen "Refresh" der unteren Zähler in #2, der ist bei #1 nicht vorhanden und daher sieht es hier etwas besser aus.

    Das ist ein anderes Problem - Vorschläge willkommen. ;)
    Glaube mein Script hat Optimierungsbedarf.8)

    In #1 werden die Zähler mit Verspätung geladen und angezeigt, und das Popup deshalb mit Verspätung in der Breite angepasst -> Ende der westlichen Zivilisation. =O

    Übrigens, #570: geht, oder nada? :/

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

    • Horstmann
    • 6. Juli 2025 um 14:09

    Einen hätte ich noch, falls das mal jemand in Windows und/oder Linux testen möchte: :/
    Bin nicht optimistisch, aber falls es geht könnte es den Code verschlanken.

    JavaScript
            //#5
            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) {
               bmbMenu.addEventListener('popupshown', onPopupShowing );
               bookMenu.addEventListener('popupshown', onPopupShowing );
               }
    
            if(persToolBar)
                persToolBar.addEventListener('popupshowing', onPopupShowing );
    Alles anzeigen
  • Suche Lösung per CSS oder JS damit sich die Menüs "soft" öffnen.

    • Horstmann
    • 6. Juli 2025 um 14:01
    Zitat von Mitleser
    Zitat von Mira_Belle

    Kann mir Blondine jemand mit einfachen Sätzen erklären, was dieses Skript tun soll?

    Dann kannst Du diese Frage sicherlich beantworten.....

    Steht doch eigentlich schon alles hier drin, die horizontale Popup Position wird gelesen via JS und angewendet im CSS. :/

  • Suche Lösung per CSS oder JS damit sich die Menüs "soft" öffnen.

    • Horstmann
    • 6. Juli 2025 um 12:56
    Zitat von Mitleser
    Zitat von Horstmann

    Warnung: dieses JS ist modifiziertes AI, konnte sonst nix finden. ;)

    Frag doch einfach mal Deine Französin, auf diese Antwort wäre ich gespannt. Sozusagen Ki fragt AI...

    ich wollte nur darauf hinweisen, den kleinen AI JS Code hatte ich ausführlich gegenrecherchiert, und verwandte Ergebnisse von stackoverflow etc. waren weitgehend identisch im Codeaufbau- ich brauchte va etwas Hilfe für die spezifische Einbindung in Fx. ;)

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

    • Horstmann
    • 6. Juli 2025 um 12:03
    Zitat von BrokenHeart

    Kannst du mal ein GIF von deinem Darstellungsproblem erzeugen? Irgendwie weiß ich im Moment nicht, wie ich mir das vorzustellen habe. :/

    Wer hätte es gedacht, der Mac kann Bildschirmaufnahmen, mit QT Player.

    Hier dann gifs: #1 mit dem Problem, #2 ohne, nur als Info.
    Wie erwähnt, nur dann ein Problem wenn die Breite ohne Zähler kleiner als die max-width (30em ?) des Elements ist, und nur beim ersten Öffnen in einem Fenster.

    #1 wäre dann nur mit:

    JavaScript
            if(bmbMenu)
               bmbMenu.addEventListener('popupshown', onPopupShowing );

    #2 wäre die alte Version mit popupshowing, oder mit gleicher Wirkung diese erweiterte neue Version:

    JavaScript
            if(bmbMenu)
               bmbMenu.addEventListener('popupshown', onPopupShowing );
            if(bmbMenuPop)
               bmbMenuPop.addEventListener('popupshowing', onPopupShowing );

    Hoffe das klappt mit den gifs:

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

    • Horstmann
    • 6. Juli 2025 um 10:29

    Mira_Belle , war nicht ernst gemeint, nur eine kleine Stichelei, sorry! ?(:)

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

    • Horstmann
    • 5. Juli 2025 um 22:03
    Zitat von BrokenHeart

    Die Veränderung der Ausrichtung des Popups bei meinem ersten Test (zuerst links, dann rechts) hängt genau damit zusammen: weil das Popup durch die hinzugefügten Zähler nicht mehr links darstellbar war, wurde halt "on the fly" nach rechts geswitcht.

    Aaaah, das macht Sinn.
    Letztlich wäre es uU sinnvoller, die fehlende Darstellung in Menüleiste/Lesezeichen anzugehen, statt das Lesezeichenmenü insgesamt zu ändern mit popupshowing ==> popupshown.

    Dein ursprünglicher Ansatz funktioniert ja generell anscheinend immer noch prima, hier am Mac sowieso.

    Zitat von Mira_Belle

    Mein komplettes Skript in Kombination mit dem Autopopup-Skript.

    Du kannst extra für Mac erforderlich reinschreiben bis die Kühe bellen, aber da gibt es keinen Zusammenhang.;)

    Wie kommt das Autopopup Ding in dieses Thema, ohne Zusammenhang, haben wir hier etwa eine Sammelthread? =O;)

    Zitat von BrokenHeart

    Damit meinte ich, dass sich das Popup verbreitert, wenn die Zähler hinzugefügt werden. Da die Addition aller Verzeichnisse und Lesezeichen eine gewisse Zeit in Anspruch nimmt, hat man eventuell einen sichtbaren Effekt, ganz in Abhängigkeit von der "bestehenden" Breite des Popups und seiner Position. Wie ich weiter oben geschrieben habe, stört mich persönlich dieser Effekt überhaupt nicht, bloß hatte ich gedacht, dass Horstmann genau das meint, als er von "Darstellungsproblemen" schrieb, was er aber in seiner letzten Antwort verneint hat.

    Horstmann : Kannst du mal ein GIF von deinem Darstellungsproblem erzeugen? Irgendwie weiß ich im Moment nicht, wie ich mir das vorzustellen habe. :/

    Das mit dem Gif aufnehmen müsste ich mir erst noch beibringen. ;)

    Der von dir (und mir) beschriebene Effekt stört mich auch nicht, aber mit popupshowing ist er sanft, mit popupshown ruckartig.
    Eben weil vermutlich die Zähler zu spät dazugerechnet werden zur Breite mit Letzterem, um noch eine bestehende Animation auslösen zu können.:/
    Was aber wie gesagt bei mir dann gelöst wird durch den/die aktuellen Codevorschläge, also auf meiner Seite no problemo.:)

    Ich mach jetzt aber mal meine Version fertig, bin schon ganz verwirrt. :huh:

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

    • Horstmann
    • 5. Juli 2025 um 19:08
    Zitat von BrokenHeart

    Habe es eben noch mal getestet und festgestellt, dass das zusätzliche popupshowing doch nicht den gewünschten Effekt hat. Damit wird eine nachträgliche Verbreiterung nicht verhindert, da hatte ich mich wohl beim ersten Test vertan oder irgendwas anderes falsch gemacht. Da müsste also noch eine andere Lösung her, falls es überhaupt möglich ist.

    Ehrlich gesagt stört mich das Verhalten der "Live"-Verbreiterung des Popups auch nicht sonderlich, aber in Kombination mit der Animation könnte das natürlich optisch störend sein.

    Die nachträgliche Verbreiterung soll auch nicht verhindert werden, das ist ein ganz normales Firefox Feature auch ohne das Script. Nur Animations Probleme wie von dir beschrieben oder wie von mir beschrieben sind scheinbar das letzte Problem.
    In meinem Fall passiert das ohne anderes relevates CSS in einem Testprofil.
    Und ist für mich unerträglich. ;)

    Könnte man mit CSS evtl. gegensteuern, habe aber den Verdacht dass da uU nicht animierbare Faktoren im Spiel sind. =O;)

    Bei der Lesezeichenleiste habe ich das Gleiche beobachtet, popupshowing oder popupshown scheint wumpe zu sein.

    Da deine, meine und Mira's Varianten keinen zusätzlichen Ärger verursachen, aber das Grundproblem mit der Menüleiste lösen zu scheinen, werd ich das wohl so in der Art einpflegen.
    Wenigstens haben wir keinen doppelten addEventListener Dingens (Fachbegriff) mehr für das gleiche Element (#bookmarks-menu-button), das war ja eine deiner Sorgen.

    Vor allem aber danke nochmal dafür die Ursache gefunden zu haben!:thumbup::)

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

    • Horstmann
    • 5. Juli 2025 um 16:38
    Zitat von BrokenHeart
    Zitat von Horstmann

    Aber jetzt gibt es gibt es das Problem plötzlich auch in der Lesezeichenleiste?

    Was meinst du genau damit? Werden gar keine Zähler mehr beim ersten Aufruf angezeigt oder passt sich die Breite nicht richtig an?

    Nah, Mira hat das erwähnt, ich habe keine Probleme damit.

    Ich komm hier so langsam durcheinander, und nicht jede Respons ist nachvollziebar ;); was funktioniert für dich von den aktuellen Vorschlägen?
    Du hast ja Windows, und wie ich vereinzelte Darstellungsprobleme erfahren, hast du einen Vorschlag für generelle Nutzung? :/

    Ich tendiere momentan zu:

    JavaScript
            let bmbMenu = document.getElementById('bookmarks-menu-button');
            let bookMenu = document.getElementById('bookmarksMenu');
            let persToolBar = document.getElementById('PersonalToolbar');
    
            let bmbMenuPop = document.getElementById('BMB_bookmarksPopup');      // neu
            
            if(bmbMenu)
               bmbMenu.addEventListener('popupshown', onPopupShowing );    // popupshowing => popupshown
    
            if(bmbMenuPop)
               bmbMenuPop.addEventListener('popupshowing', onPopupShowing );   //  neu
    
            if(bookMenu)
               bookMenu.addEventListener('popupshown', onPopupShowing );    // popupshowing => popupshown
    
            if(persToolBar)
                persToolBar.addEventListener('popupshowing', onPopupShowing );
    Alles anzeigen
  • Nur die Anzeige der Ordner/Lesezeichenanzahl in einer anderen Farbe darstellen

    • Horstmann
    • 5. Juli 2025 um 15:21
    Zitat von Sören Hentzschel

    Das kann überhaupt nicht sein. In den zwei Code-Blöcken von Beitrag #541 steht am Ende jeweils noch eine geschlossene Klammer, die nirgends dazu gehört. Vielleicht wurde diese mitkopiert, sodass es am Ende zu einem Fehler durch eine Klammer zu viel kam. Aber das Fehlen der Klammern für die if-Statements ist wie gesagt zwar nicht empfohlen, kann technisch allerdings keinen Unterschied machen.

    Danke! :)
    Schande auf mein Haupt; ich korrigiere das mal sofort...


    Zitat von Mira_Belle

    Beide Varianten aus Beitrag #541 funktionieren.
    Nur muss es bei mir anstatt persToolBar.addEventListener('popupshowing', onPopupShowing );
    persToolBar.addEventListener('popupshown', onPopupShowing ); heißen,
    sonst tritt eben genau DAS Problem auf.
    Counter wird erst beim zweiten Mal öffnen des Menüs angezeigt.

    Danke für's erneute Testen, sorry für den Fehler mit der unteren Klammer. :)

    Aber jetzt gibt es gibt es das Problem plötzlich auch in der Lesezeichenleiste?
    Direkt in der Lesezeichenleiste, nicht in der Menüleiste -> Lesezeichenleiste, oder deren Untermenüs? :/

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

    • Horstmann
    • 5. Juli 2025 um 14:33
    Zitat von Mira_Belle


    Horstmann Und Du hast den gleichen Fehler wie ich begangen!
    BrokenHeart hat mich darauf hingewiesen! Klammern, es fehlen Klammern.

    Ahem, der Code funktionierte schon immer ohne diese Klammern {} - es sei denn, man fasst mehrere statements(?) unter einer condition(?) zusammen, das hatte BrokenHeart korrigiert in #531.
    Deine Code Version von #542 sollte auch ohne die zusätzlichen Klammern funktionieren.
    Oder? :/

    Hattest du beide meiner Versionen aus #541 genau so getestet, und ohne eigene Modifikationen in dem Code Block?
    Wir reden vermutlich etwas aneinander vorbei.;)

    Und es ist nicht als extra Code für Mac gedacht, es ist extra Code für schmale Hauptpopups beim Lesezeichen-Menü-Button. ;)


    Zitat von Boersenfeger

    Wo ist der Haken?

    Wir arbeiten gerade daran. ;)

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

    • Horstmann
    • 5. Juli 2025 um 11:57
    Zitat von Mira_Belle

    Mh. :/

    Also, ich habe keine Probleme mehr!

    Es funktioniert super mit Version #2!

    Wir schreiben aber hier ja Code für möglichst alle User und Fälle. ;)
    Für mich klappt #2 nicht sauber, käme also nicht in mein Script.

    So, hier mal was zum Testen für Windozer und alle anderen; löst bei mir am Mac das Animationsproblem beim Lesezeichen-Menü-Button, und schmalem Popup.
    Menüleiste -> Lesezeichen müsstet ihr mal selber testen.

    JavaScript
            let bmbMenu = document.getElementById('bookmarks-menu-button');
            let bookMenu = document.getElementById('bookmarksMenu');
            let persToolBar = document.getElementById('PersonalToolbar');
    
            let bmbMenuPop = document.getElementById('BMB_bookmarksPopup');      // neu
    
            if(bmbMenu){
               bmbMenu.addEventListener('popupshown', onPopupShowing );    // popupshowing => popupshown
               bmbMenuPop.addEventListener('popupshowing', onPopupShowing );  // neu
               }
    
            if(bookMenu)
               bookMenu.addEventListener('popupshown', onPopupShowing );    // popupshowing => popupshown
    
            if(persToolBar)
                persToolBar.addEventListener('popupshowing', onPopupShowing );
    Alles anzeigen

    Oder so:

    JavaScript
            let bmbMenu = document.getElementById('bookmarks-menu-button');
            let bookMenu = document.getElementById('bookmarksMenu');
            let persToolBar = document.getElementById('PersonalToolbar');
    
            let bmbMenuPop = document.getElementById('BMB_bookmarksPopup');      // neu
            
            if(bmbMenu)
               bmbMenu.addEventListener('popupshown', onPopupShowing );    // popupshowing => popupshown
    
            if(bmbMenuPop)
               bmbMenuPop.addEventListener('popupshowing', onPopupShowing );   //  neu
    
            if(bookMenu)
               bookMenu.addEventListener('popupshown', onPopupShowing );    // popupshowing => popupshown
    
            if(persToolBar)
                persToolBar.addEventListener('popupshowing', onPopupShowing );
    Alles anzeigen
  • Nur die Anzeige der Ordner/Lesezeichenanzahl in einer anderen Farbe darstellen

    • Horstmann
    • 5. Juli 2025 um 09:49
    Zitat von BrokenHeart
    Zitat von Mira_Belle

    Dieser komische doppelte Aufruf ist bei mir nicht nötig,
    aber auch so funktioniert es.

    Interessant. Muss mal schauen, ob nur bei mir dieser merkwürdige Effekt auftritt. Vielleicht mal ohne meine 'userChrome.css' testen :/.


    Zitat von Mira_Belle

    Das "Event" auszulösen, bevor und nachdem das Popup-Menü vollständig angezeigt wird,
    macht meiner Meinung keinen Sinn.

    Und BrokenHart hat hier ja recht gut erklärt, warum das "Event" erst nach dem vollständigen Anzeigen
    des Menüs ausgelöst werden sollte.

    Zitat von BrokenHeart

    In beiden FF-Versionen gibt es ein Attribut hasbeenopened des Menü-Popups, welches gesetzt wird, wenn man erstmalig das Popup aufgerufen hat. Deshalb muss hier ein zweites mal der Button betätigt werde, damit das Skript, so wie es jetzt ist, funktioniert.

    Da es hier um Millisekunden geht, so denke ich, sieht man das mit der Verzögerung nicht.
    Man bekommt es einfach nicht mit.

    Hier am Mac, für den #bookmarks-menu-button / Lesezeichen-Menü-Button:

    Die Breite des Haupt-Popups ändert sich jeweils beim ersten Öffnen nach Neustart oder in einem neuen Fenster (falls das Popup noch nicht die erlaubte max-width des Fensters besitzt).

    Edit: hat dieses Popup schon die Maximalbreite bevor die Zählereinträge beim Öffnen dazugefügt werden, etwa durch einen sehr langen Link oder Foldernamen (Anhang), gibt es hier kein Problem wie in #2 (s. unten), weil die Zählereinträge die Breite eh nicht mehr ändern können.

    Danach, und für Submenus bleibt die Grösse, vermutlich weil sie mit hasbeenopened festgelegt bleibt; das Attribut sitzt hier am Hauptpopup, ID: #BMB_bookmarksToolbarPopup.

    ===>

    JavaScript
    let bmbMenu = document.getElementById('bookmarks-menu-button');
    
    //#1 alt: Passt Popup Breite sauber an beim Oeffnen 
    if(bmbMenu)
        bmbMenu.addEventListener('popupshowing', onPopupShowing );
    
    //#2 neu: Passt Popup Breite ruckartig an beim/nach Oeffnen 
    if(bmbMenu)
        bmbMenu.addEventListener('popupshown', onPopupShowing );  // popupshowing => popupshown
    
    //#3 neu, doppelt: Passt Popup Breite sauber an beim Oeffnen 
    if(bmbMenu) {
         bmbMenu.addEventListener('popupshowing', onPopupShowing );   // popupshowing => popupshown
         bmbMenu.addEventListener('popupshown', onPopupShowing );   // popupshowing => popupshown
         }
    Alles anzeigen

    Hat man noch weitere CSS für Positionierung, Grösse etc. für dieses Hauptpopup, könnte das weitere Anzeigeprobleme mit sich bringen, wie von Brokenheart beschrieben.

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

    • Horstmann
    • 4. Juli 2025 um 22:56
    Zitat von BrokenHeart
    Zitat von Horstmann

    Und wenn du beide hinzufügst?

    Ich vermute mal du meinst:

    PS: Ich glaube zwar, dass es nicht sehr effizient ist, das gleiche Prozedere mehrfach aufzurufen, aber dann muss man halt als "Heimwerker und Bastler" mehr Geld für die entsprechende Hardware hinlegen, dann gleicht sich das wieder aus! ;)

    Ooups, sorry, ja, genau das. ;)
    Was Schlaueres fällt mir nicht ein - schon gar nicht ohne es testen zu können, sogar wenn ich JS könnte. :/

    PS; Braucht man die Änderung eigentlich unbedingt für den bookmarks-menu-button, weil sie evtl. in der Lesezeichenleiste mitbenutzt wird?

    Das hier reicht nicht, mit Anpassung nur für bookmarksMenu?

    JavaScript
           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('popupshown', onPopupShowing ); // popupshowing => popupshown
           if(persToolBar)
               persToolBar.addEventListener('popupshowing', onPopupShowing );
       }
    Alles anzeigen
  • Nur die Anzeige der Ordner/Lesezeichenanzahl in einer anderen Farbe darstellen

    • Horstmann
    • 4. Juli 2025 um 21:53
    Zitat von BrokenHeart

    Test-Skript:

    Beim Lesezeichen-Menü über die Menüleiste sieht es erst mal ganz gut aus...

    Beim Öffnen des Popups über den Lesezeichen-Menü-Button funktioniert es zwar auch, aber das Popup wird erst ganz kurz nach links geöffnet und wieder geschlossen, bevor es dann nach rechts wieder geöffnet wird :/.

    Und wenn du beide hinzufügst?

    JavaScript
            if(bmbMenu)
               bmbMenu.addEventListener('popupshowing', onPopupShowing );
               bmbMenu.addEventListener('popupshown', onPopupShowing );

Unterstütze uns!

Jährlich (2025)

101,9 %

101,9% (662,48 von 650 EUR)

Jetzt spenden
  1. Kontakt
  2. Datenschutz
  3. Impressum
Community-Software: WoltLab Suite™
Mastodon