Beiträge von Mira_Belle

Mira_Belle

Zitat von Sören Hentzschel

Es soll einfach klar sein, wenn KI involviert war.

Das habe ich, so hoffe ich, zu Deiner Zufriedenheit umgesetzt.

Zitat von Sören Hentzschel

Die Nennung des genutzten Anbieters halte ich für sinnvoll.

Mh, das wiederum ist bei "https://lmarena.ai/de" schwierig, da im Battle immer zwei KI's zum
Einsatz kommen und man nie weiß welche.
Aber z.Z. nutze ich meist "https://www.perplexity.ai/" und "https://chat.mistral.ai/chat"
und auch hier nutze ich beide oft parallel und mixe den Code, je nachdem, was ich für besser halte
und/oder was besser funktioniert!
Also so wirklich kann ich es nicht immer "sagen"!

Ich hoffe, es reicht, wenn ich dazu schreibe, dass KI zum Einsatz kam.

Mira_Belle

Zitat von Horstmann

Nuja.

Oh sorry!
Ich habe Dich total falsch verstanden
Dachte Du meinst es so, wie Mitlesers Leiste funktioniert.

Mira_Belle

Auch Dir ein Danke, lieber Sören.

Und allen anderen, die eventuell noch kommen werden auch.

Mira_Belle

Hehe, Danke, lieber Andreas.

Mira_Belle

Zitat von Horstmann

Oder etwa doch?

Mira_Belle

Zitat von Horstmann

Sorry für das hin und her, aber manchmal braucht's ein paar Schritte mehr bis es passt.

Wem "sagst" Du das? Ist doch bei all meinen JS nicht anders!
Da klappt so manches nicht von Anfang an und es bedarf mehrere Anläufe.

Zitat von Horstmann

So sollte hoffentlich auch die Animation im Anpassenfenster klappen, .....

Das klappte schon vorher sehr gut.
Du hast das CSS arg geändert, jedoch mag mein Auge in der Ausführung des Codes keine Veränderungen wahrnehmen.
Aber sehr wahrscheinlich ist nun der Code robuster und sauberer,
aber was weiß ich schon? Mit solchem komplexen CSS komme ich einfach nicht zurecht.
Mal was per CSS verschieben, ausblenden oder einfach eine Farbe zu weisen, das bekomme ich noch hin,
aber dann hört es auch schon auf.

Mira_Belle

Zitat von Horstmann

... daher würde ich den aktualisierten Code komplett übernehmen ...

OK, wird gemacht. Danke.

Mira_Belle

Zitat von Horstmann

Wenn du in Zeile 113 die outline aktivierst, siehst du was passiert, der Container(?) #flybox_new behält Grösse und Position, da ja der Inhalt #new_flybar nur verschoben wird.

Ich sehe und glaube zu verstehen.

Zitat von Horstmann

Mit display:none - oder in Zeile 141 width aktivieren als Test - wird die Grösse vom Container mit veringert.

Ja, auch gesehen, aber dann (display:none) ist der schöne Effekt weg (sanftes ein- und ausblenden)

Zitat von Horstmann

Bei Benutzung no width würde man dann translate damit ersetzen, wenn man das konsequent umsetzen würde.

Das wiederum kapiere ich nicht! no width ?

Ich werde die Version nutzen, die Du ursprünglich gepostest hat.
Die funktioniert wunderbar und ich bin happy,
also noch einmal vielen lieben Dank dafür.

Mira_Belle

Zitat von Horstmann

Evtl. testen:

Perfekt

Danke.

Mira_Belle

Irgendwie müsste da was mit "#flybox_new" gehen.
Wenn ausgeblendet, "#flybox_new" => display: none;

aus #137?
Äh, das hier:

JavaScript

// New switchable toolbar rechts/links – Version mit gleitendem Slide‑In/Out‑Effekt

(function() {
  if (!window.gBrowser)
    return;

  const
  // ■■ START UserConfiguration ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■    
    id           = 'NewToolbar_fly_button',
    label        = 'Toggle New Toolbar',
    tooltiptext  = 'Toggle New toolbar',
    // Icon-------------------------------------------------------
    icon         = 'Dock Side Right.svg',   // Icon-Dateiname
    iconPath     = '/chrome/icons/',
    tbWidth      = '34px',                  // Sichtbare Leistenbreite
    isPosH       = 0,                       // 0 = rechts, 1 = links
    isPosV       = '30%',                   // vertikale Position der Leiste
  // isPosV      = '0%',       Leiste am oberen Fensterrand;
  // isPosV      = '50%',      Leiste mittig zur Fensterhöhe;
	// isPosV      = '100%',     Leiste am unteren Fensterrand;
     delay       = '0.6s';                  // Dauer (schneller/langsamer)
  // ■■ END UserConfiguration ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■

  const curProfDir = PathUtils.toFileURI(PathUtils.join(PathUtils.profileDir));

  if (Services.prefs.getBoolPref('svg.context-properties.content.enabled') == false) {
    Services.prefs.setBoolPref('svg.context-properties.content.enabled', true);
  }

  const flybox_new = document.createXULElement('toolbox');
  flybox_new.setAttribute('orient','horizontal');
  flybox_new.id = 'flybox_new';

  const toolbar = document.createXULElement('toolbar');
  toolbar.id = 'new_flybar';
  toolbar.setAttribute('orient', 'vertical');
  toolbar.setAttribute('customizable', true);
  toolbar.setAttribute('mode', 'icons');
  toolbar.setAttribute('context', 'toolbar-context-menu');
  toolbar.setAttribute('class','toolbar-primary chromeclass-toolbar browser-toolbar customization-target');
  toolbar.setAttribute('toolboxid', 'navigator-toolbox');
  toolbar.setAttribute('toolbarname', 'New Toolbar');
  toolbar.setAttribute('label', 'New Toolbar');

  let savedState = false;
  try {
    savedState = Services.prefs.getBoolPref("userChrome.newFlybar.off");
  } catch(e) {}

  if (savedState) toolbar.classList.add("fly_off_mode");

  flybox_new.appendChild(toolbar);
  document.getElementById('browser').parentNode.appendChild(flybox_new);

  CustomizableUI.registerArea(toolbar.id, {legacy: true});
  CustomizableUI.registerToolbarNode(toolbar);

  try {
    CustomizableUI.createWidget({
      id,
      defaultArea: CustomizableUI.AREA_NAVBAR,
      label,
      tooltiptext,
      onCreated: (button) => {
        button.style.MozContextProperties = 'fill, stroke, fill-opacity';
        button.style.listStyleImage = 'url("' + curProfDir + iconPath + icon + '")';
        button.style.minWidth = 'fit-content';
      }
    });
  } catch(e) {};

  document.getElementById('NewToolbar_fly_button').addEventListener("click", flybar);
  
  function flybar(event) {
    if (event.button === 0) {
      const new_flybar = document.getElementById('new_flybar');
      new_flybar.classList.toggle("fly_off_mode");
      const state = new_flybar.classList.contains("fly_off_mode");
      Services.prefs.setBoolPref("userChrome.newFlybar.off", state);
    }
  }
  
  if (isPosH === 1)
    flybox_new.classList.add("fly_left");
  else
    flybox_new.classList.remove("fly_left");

  const css = `
    :root {
      --ug-toolbar_width: ${tbWidth};
      --ug-bg_color: #2b2b2b;
      --ug-border_width: 3px;
      --ug-border_radius: 8px;
      --ug-border_color: #f3a200;
    }

    #flybox_new {
      position: fixed !important;
      display: flex !important;
      ${isPosH === 0
        ? `right: 0 !important; margin-right: calc(-1 * var(--ug-border_width));`
        : `left: 0 !important; margin-left: calc(-1 * var(--ug-border_width));`}
      top: ${isPosV} !important;
      transform: translateY(-${isPosV}) !important;
      height: fit-content !important;
      z-index: 2 !important;
    }

    #new_flybar {
      display: flex;
      width: calc(var(--ug-toolbar_width) + 2*var(--ug-border_width));
      min-width: 0 !important;
      overflow: hidden !important;
      justify-content: center !important;
      padding-block: 4px;
      background-color: var(--ug-bg_color) !important;
      border: var(--ug-border_width) solid var(--ug-border_color) !important;
      ${isPosH === 0
        ? `border-radius: var(--ug-border_radius) 0 0 var(--ug-border_radius);`
        : `border-radius: 0 var(--ug-border_radius) var(--ug-border_radius) 0;`}
      transition: transform ${delay} ease-in-out,
                  opacity ${delay} ease-in-out,
                  border-width ${delay} ease-in-out;
      transform: translateX(0);
      opacity: 1;
    }

    #new_flybar.fly_off_mode {
      transform: ${isPosH === 0 ? 'translateX(100%)' : 'translateX(-100%)'};
      opacity: 0;
      border-width: 0 !important;
      pointer-events: none;
    }

    #new_flybar > :is(.toolbarbutton-1, toolbaritem),
    #new_flybar toolbarpaletteitem > :is(.toolbarbutton-1, toolbaritem) {
      margin-inline: 0px !important;
      margin-block: 2px !important;
      padding: 0px !important;
    /*  opacity: 1 !important;  */
      transition: none;
    }

    /*---  customizing  ---*/

    #main-window[customizing]  #flybox_new.fly_left {
      left: unset !important;
      right: 0px !important;
      margin-inline: 0px calc(-1 * var(--ug-fly_border_width)) !important;
    }

    #new_flybar[customizing] {
      align-items: center !important;
      width: calc(var(--ug-toolbar_width) + var(--ug-fly_border_width)) !important;
      min-height: var(--ug-toolbar_width) !important;
      padding-bottom: 48px !important;
      border-radius: var(--ug-border_radius) 0 0 var(--ug-border_radius) !important;
      transition: none !important;
    }

    #main-window:not([customizing]) #new_flybar.fly_off_mode[customizing] {
      transition: none !important;
      opacity: 0 !important;
    }

    #customization-content-container {
      margin-right: var(--ug-toolbar_width) !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);

})();

Alles anzeigen

Mira_Belle

Horstmann Habe ich auch schon gemacht, ändert aber nichts.

Mira_Belle

Zitat von 2002Andreas

Nur bei aktivierter Titelleiste öffnet sich ein neuer Tab nach Doppelklick auf die Tableiste.

Da muss man erst einmal drauf kommen.

Danke.

Mira_Belle

Eine nicht ganz so schöne Sache habe ich aber nun entdeckt!
Der Bereich, der von der Toolbar überdeckt wird, wird auch im ausgeblendeten Zustand "überdeckt"!
Was bedeutet, dass an dieser Stelle der Slider der Scrollbar nicht "angefasst" werden kann.

Ich prüfe mal, ob das mit Mitlesers Toolbar auch so ist.

Nein, ist nicht so.
Es hat ganz sicher etwas mit dem sanften ein und ausblenden zu tun.
Denn Mitlesers Toolbar "ploppt" auf.
Kann ich in meinem Skript nachvollziehen.

Mir fällt das aber z.Z. nichts Passendes ein.

Mira_Belle

Zitat von BrokenHeart

Bei mir (Win10) öffnet sich im Fehlerbehebungsmodus kein neuer Tab, sondern das Firefox-Fenster ändert seinen Status von maximiert auf verkleinert und umgekehrt. Das ist das Standardverhalten...

Merkwürdig, habe ich nun auch gemacht, nur um es nachvollziehen zu können,
und was soll ich sagen? Bei mir, auch Win10, öffnet sich ein neuer Tab.

Mira_Belle

Zitat von BrokenHeart

sucht aber nach der Funktionalität, die einen neuen Tab öffnet, wenn man auf die Tableiste doppelt klickt!

Oh, das kommt davon, wenn man nicht zu 100% bei der Sache ist. Sorry.

Also ich habe soeben ein neues Profil erstellt und, ....
bei "doppelklick" in die Tableiste mit der linken Maustaste öffnet sich ein neuer TAB.
Und nun?

Mira_Belle

Versuch mal dieses Skript.

JavaScript

// 'Doubleclick on tab reloads tab' script for Firefox 126+ by Aris

/* ***************************************************************************************************************** */
/* Github: https://github.com/Aris-t2/CustomJSforFx/blob/master/scripts/tabstoolbar_doubleclickontab_reloadtab.uc.js */
/* ***************************************************************************************************************** */

var DoubleClickOnTabReloadTab = {
	init: function() {
		try {
			gBrowser.tabContainer.addEventListener("dblclick", function abcde(e) {
				if(e.button==0) {
					BrowserCommands.reload();
					e.stopPropagation();
					e.preventDefault();
				}
			}, false);
		} catch(e) {}
	}
}
setTimeout(function() {
  	DoubleClickOnTabReloadTab.init();
},500);

Alles anzeigen

Funktioniert hier mit Firefox 146.0 (64-Bit)

Mira_Belle

Zitat von Horstmann

Und auch wenn ihr kein anständiges Anpassenfenster mögt , hier mal ein Vorschlag:

Doch, doch, danke schön.
Klappt super.
Und auch für den Tipp mit der Leiste und der Rahmenbreite!
Denn das hatte ich ganz vergessen!

Mira_Belle

Lange hat es gedauert, viel Versuche waren nötig, aber jetzt habe ich es!
Die zusätzliche Toolbar ist endlich so, wie sie für mich sein soll.
Ich danke Dir Horstmann und auch Mitleser für Eure Ideen und eigenen Umsetzungen einer solchen Leiste.

Hier nun meine Interpretation der Codeschnipsel, die ich aus Euren Skripten bunt zusammen gewürfelt habe.
Wer es mal testen mag, bitte schön.

JavaScript

// New switchable toolbar rechts/links – Version mit gleitendem Slide‑In/Out‑Effekt

(function() {
  if (!window.gBrowser)
    return;

  const
  // ■■ START UserConfiguration ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■    
    id           = 'NewToolbar_fly_button',
    label        = 'Toggle New Toolbar',
    tooltiptext  = 'Toggle New toolbar',
    // Icon-------------------------------------------------------
    icon         = 'Dock Side Right.svg',   // Icon-Dateiname
    iconPath     = '/chrome/icons/',
    visible      = '34px',                  // Sichtbare Leistenbreite
    isPosH       = 0,                       // 0 = rechts, 1 = links
    isPosV       = '30%',                   // vertikale Position der Leiste
  // isPosV      = '0%',       Leiste am oberen Fensterrand;
  // isPosV      = '50%',      Leiste mittig zur Fensterhöhe;
	// isPosV      = '100%',     Leiste am unteren Fensterrand;
     delay       = '0.6s';                  // Dauer (schneller/langsamer)
  // ■■ END UserConfiguration ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■

  const curProfDir = PathUtils.toFileURI(PathUtils.join(PathUtils.profileDir));

  if (Services.prefs.getBoolPref('svg.context-properties.content.enabled') == false) {
    Services.prefs.setBoolPref('svg.context-properties.content.enabled', true);
  }

  const flybox_new = document.createXULElement('toolbox');
  flybox_new.setAttribute('orient','horizontal');
  flybox_new.id = 'flybox_new';

  const toolbar = document.createXULElement('toolbar');
  toolbar.id = 'new_flybar';
  toolbar.setAttribute('orient', 'vertical');
  toolbar.setAttribute('customizable', true);
  toolbar.setAttribute('mode', 'icons');
  toolbar.setAttribute('context', 'toolbar-context-menu');
  toolbar.setAttribute('class','toolbar-primary chromeclass-toolbar browser-toolbar customization-target');
  toolbar.setAttribute('toolboxid', 'navigator-toolbox');
  toolbar.setAttribute('toolbarname', 'New Toolbar');
  toolbar.setAttribute('label', 'New Toolbar');

  let savedState = false;
  try {
    savedState = Services.prefs.getBoolPref("userChrome.newFlybar.off");
  } catch(e) {}

  if (savedState) toolbar.classList.add("fly_off_mode");

  flybox_new.appendChild(toolbar);
  document.getElementById('browser').parentNode.appendChild(flybox_new);

  CustomizableUI.registerArea(toolbar.id, {legacy: true});
  CustomizableUI.registerToolbarNode(toolbar);

  try {
    CustomizableUI.createWidget({
      id,
      defaultArea: CustomizableUI.AREA_NAVBAR,
      label,
      tooltiptext,
      onCreated: (button) => {
        button.style.MozContextProperties = 'fill, stroke, fill-opacity';
        button.style.listStyleImage = 'url("' + curProfDir + iconPath + icon + '")';
        button.style.minWidth = 'fit-content';
      }
    });
  } catch(e) {};

  document.getElementById('NewToolbar_fly_button').addEventListener("click", flybar);

  function flybar(event) {
    if (event.button === 0) {
      const new_flybar = document.getElementById('new_flybar');
      new_flybar.classList.toggle("fly_off_mode");
      const state = new_flybar.classList.contains("fly_off_mode");
      Services.prefs.setBoolPref("userChrome.newFlybar.off", state);
    }
  }

  if (isPosH === 1)
    flybox_new.classList.add("fly_left");
  else
    flybox_new.classList.remove("fly_left");

  const css = `
    :root {
      --ug-toolbar_width: ${visible};
      --ug-bg_color: #2b2b2b;
      --ug-border_width: 2px;
      --ug-border_radius: 8px;
      --ug-border_color: #f3a200;
    }

    #flybox_new {
      position: fixed !important;
      display: flex !important;
      ${isPosH === 0
        ? `right: 0 !important; margin-right: calc(-1 * var(--ug-border_width));`
        : `left: 0 !important; margin-left: calc(-1 * var(--ug-border_width));`}
      top: ${isPosV} !important;
      transform: translateY(-${isPosV}) !important;
      height: fit-content !important;
      z-index: 4 !important;
    }

    #new_flybar {
      display: flex;
      width: var(--ug-toolbar_width);
      min-width: 0 !important;
      overflow: hidden !important;
      justify-content: center !important;
      padding-block: 4px;
      background-color: var(--ug-bg_color) !important;
      border: var(--ug-border_width) solid var(--ug-border_color) !important;
      ${isPosH === 0
        ? `border-radius: var(--ug-border_radius) 0 0 var(--ug-border_radius);`
        : `border-radius: 0 var(--ug-border_radius) var(--ug-border_radius) 0;`}
      transition: transform ${delay} ease-in-out,
                  opacity ${delay} ease-in-out,
                  border-width ${delay} ease-in-out;
      transform: translateX(0);
      opacity: 1;
    }

    #new_flybar.fly_off_mode {
      transform: ${isPosH === 0 ? 'translateX(100%)' : 'translateX(-100%)'};
      opacity: 0;
      border-width: 0 !important;
      pointer-events: none;
    }

    #new_flybar > :is(.toolbarbutton-1, toolbaritem),
    #new_flybar toolbarpaletteitem > :is(.toolbarbutton-1, toolbaritem) {
      margin-inline: 0px !important;
      margin-block: 2px !important;
      padding: 0px !important;
      opacity: 1 !important;
      transition: none;
    }
  `;

  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);

})();

Alles anzeigen

Skript ist unter Zuhilfenahme von KI entstanden.

PS:
Das mit dem Pfeil war wirklich eine blöde Idee,
aber hinterher ist man immer schlauer, heißt es doch, oder?

Mira_Belle

Sören Hentzschel Danke für Deine nachträgliche Antwort!
Das mit den Quellen konnte ich nun auch nachvollziehen und werde das in Zukunft gar nicht mehr verfolgen noch posten.

Zum Erstellen, bzw. abändern von Skripten werde ich nach wie vor KI nutzen.
Natürlich probiere ich erst selber aus, was ich schon kann und was nicht.

Nur eine Frage! Wie, mit welchem Satz soll ich auf den gebrauch einer KI hinweisen und, soll auch die KI genannt werden?
Ich nutze ja gelegentlich verschiedene und mach daraus einen Wettkampf der KI's.

Mira_Belle

Zitat von Horstmann

Wobei sich bei den Versionen mit Extra Button schon die Frage stellt, warum man nicht einfach den Hauptbutton benutzt, ...

Das frage ich mich auch.
Ich bin noch am Testen und hatte diese Idee.
Ob es nun sinnvoll ist, steht auf einem anderen Blatt.
Und wie und ob ich so eine Leite nutzen werde, steht auch noch nicht zu 100% fest,
aber so habe ich nun ein halbes dutzend Optionen.
Danke.

Beiträge von Mira_Belle

Neue Quicklink-Button

Seitennavigation - Fly Out Menü

Der Glückwunsch-Thread

Der Glückwunsch-Thread

Seitennavigation - Fly Out Menü

Seitennavigation - Fly Out Menü

Seitennavigation - Fly Out Menü

Seitennavigation - Fly Out Menü

Seitennavigation - Fly Out Menü

Seitennavigation - Fly Out Menü

Seitennavigation - Fly Out Menü

[FFX 145.x] Doppelklick (linke Maustaste) auf die Tableiste neuen Tab öffnen?

Seitennavigation - Fly Out Menü

[FFX 145.x] Doppelklick (linke Maustaste) auf die Tableiste neuen Tab öffnen?

[FFX 145.x] Doppelklick (linke Maustaste) auf die Tableiste neuen Tab öffnen?

[FFX 145.x] Doppelklick (linke Maustaste) auf die Tableiste neuen Tab öffnen?

Seitennavigation - Fly Out Menü

Seitennavigation - Fly Out Menü

Neue Quicklink-Button

Seitennavigation - Fly Out Menü