Lautsprechersymbol auf Tabs / Ton aktivieren

camel-joe

Hallo,

ich verwende diesen Code (HideTabbarWithOneTab.uc).

Dabei ergibt sich aber das Problem, dass ich den Ton nicht mehr aktivieren kann, wenn ich andere Tabs schließe, aber vorher der Ton stumm war. Ich muss erst einen neuen Tab öffnen, dann kann ich wieder den Ton aktivieren. Geht das irgendwie auch anders, vielleicht per Button?

Code

(function() {

  if (!window.gBrowser)
    return;

  let tabbar = document.getElementById("TabsToolbar"); 
  let titlebar = document.getElementById("titlebar");
  let navToolbox = document.getElementById("navigator-toolbox");

  function showHideTabbar() {
    let oneTab = (gBrowser.visibleTabs.length == 1);
    tabbar.style.visibility = oneTab ? 'collapse' : 'visible';    
    if (oneTab && Services.prefs.getBoolPref('browser.tabs.drawInTitlebar')) {
      titlebar.style.visibility = 'collapse';
      navToolbox.style.paddingBottom = '0';
    } else {
      titlebar.style.visibility = 'visible';
      navToolbox.style.paddingBottom = 'calc(1px + var(--tab-min-height_tnot))';
    };
  };

  showHideTabbar();

  let observer = new MutationObserver(showHideTabbar);
  observer.observe(gBrowser.tabContainer, {childList: true});

})();

Alles anzeigen

aborix

Geht mit Button, Tastenkombination, (Kontext-)Menü-Eintrag,...

Die JavaScript-Anweisung zum Ein- und Ausschalten des Tons im ersten Tab ist

gBrowser.tabs[0].toggleMuteAudio();

oder

gBrowser.tabs[0].querySelector('.tab-icon-sound').click();

camel-joe

Ich kann Dir da nicht ganz folgen, wie genau setze ich diese JavaScript-Anweisung nun um?

aborix

Ich meinte, z.B. ein Skript für einen anderen Button als Vorlage nehmen und entsprechend ändern.

Teste folgendes Skript. Der Button hat noch keine Grafik und ist vorerst ein farbiges Rechteck.

JavaScript

(function() {

  if (window.__SSi != 'window0')
    return;

  CustomizableUI.createWidget({
    id: 'tab0-sound-button',
    label: 'Ton im ersten Tab',
    tooltiptext: 'Ton im ersten Tab',
    defaultArea: CustomizableUI.AREA_NAVBAR,
    onCommand: function(event) {
      event.target.ownerGlobal.gBrowser.tabs[0].toggleMuteAudio();
    },
    onCreated: function(button) {
      button.style.backgroundColor = 'hotpink';
      //button.style.listStyleImage = ...
    }
  });

})();

Alles anzeigen

camel-joe

Danke, es funktioniert wie gewünscht. Kann ich hier auch eine Grafik auf meiner Festplatte als Button verwenden?

Code

//button.style.listStyleImage = ...

aborix

Ja, zum Beispiel:

button.style.listStyleImage = 'url(file:///C:/Users/BenutzerA/Grafiken/Grafik1.png)';

camel-joe

Vielen Dank, auch das funktioniert. Kannst Du mir noch die richtigen Vorgaben (Größe, Auflösung, Farbtiefe und Format) für die Grafik nennen? Und ist es auch möglich, dass das Icon nach dem Klick anders aussieht?

Ach ja, warum wird das \ eigentlich "falsch" geschrieben?

Avatare\ton.png

Avatare/ton.png

Sören Hentzschel

Wird es ja nicht. Im Gegenteil ist Windows das einzige System, bei dem \ anstelle von / in Pfadangaben geschrieben wird. Hier geht es aber um eine URL, zu erkennen am file:// am Beginn. Das ist das Protokoll, vergleichbar mit https:// oder http://. Die URL dieses Themas beispielsweise ist ja auch https://www.camp-firefox.de/forum/thema/131427-lautsprechersymbol-auf-tabs-ton-aktivieren/ und nicht https:\\www.camp-firefox.de\forum\thema\131427-lautsprechersymbol-auf-tabs-ton-aktivieren\.

camel-joe

Zuerst ging "Als Pfad kopieren" im Explorer in die Hose, weil da das \ im Pfad nicht stimmt.

Ich habe erst gar nicht darauf geachtet. Aber jetzt ist es auch logisch nachvollziehbar.

aborix

Zitat von camel-joe

Kannst Du mir noch die richtigen Vorgaben (Größe, Auflösung, Farbtiefe und Format) für die Grafik nennen?

Ich habe keine Ahnung, ob es da Beschränkungen gibt. Eine Größe von 16 x 16 px passt jedenfalls gut. Unpassende Größen kann man mit CSS (height, width usw.) verändern.

Zitat von camel-joe

Und ist es auch möglich, dass das Icon nach dem Klick anders aussieht?

Ja. Das Skript wird etwas komplizierter. In den Zeilen 18 und 21 sind noch die Grafiken einzutragen.

JavaScript

(function() {

  if (!window.gBrowser)
    return;

  if (window.__SSi == 'window0') {

    CustomizableUI.createWidget({
      id: 'tab0-sound-button',
      label: 'Ton im ersten Tab',
      tooltiptext: 'Ton im ersten Tab',
      defaultArea: CustomizableUI.AREA_NAVBAR
    });

    let css = '\
      @-moz-document url("chrome://browser/content/browser.xhtml") { \
        #tab0-sound-button[muted="false"] { \
          list-style-image: url(...) \
        } \
        #tab0-sound-button[muted="true"] { \
          list-style-image: url(...) \
        } \
      }';
    let cssUri = makeURI('data:text/css,' + encodeURIComponent(css));
    let SSS = Cc['@mozilla.org/content/style-sheet-service;1'].getService(Ci.nsIStyleSheetService);
    SSS.loadAndRegisterSheet(cssUri, SSS.AGENT_SHEET);

  };

  let button = document.getElementById('tab0-sound-button');

  function setAttr() {
    setTimeout(function() {
      button.setAttribute('muted', gBrowser.tabs[0].muted);
    }, 200);
  };

  button.addEventListener('command', function() {
    gBrowser.tabs[0].toggleMuteAudio();
    setAttr();
  });

  addEventListener('TabOpen', setAttr);
  addEventListener('TabClose', setAttr);
  addEventListener('TabMove', setAttr);

  setAttr();

})();

Alles anzeigen

camel-joe

Danke, aber es gibt ein Problem. Jede Grafik funktioniert einzeln mit dem alten Code, es liegt also nicht an der Grafik.

Jetzt ist es so, dass "Ton An / Aus" zwar funktioniert, aber ich sehe keinen Button. Wenn ich mit der Maus über den Button fahre, dann erscheint auch nur ein unsichtbarer Button.

Habe ich etwas falsch eingefügt?

Code

        #tab0-sound-button[muted="false"] { \
          list-style-image: url(file:///D:/Grafiken/Avatare/ringtones.ico) \
        } \
        #tab0-sound-button[muted="true"] { \
          list-style-image: url(file:///D:/Grafiken/Avatare/Brainy.ico) \

2002Andreas

Teste bitte mal:

JavaScript

        #tab0-sound-button[muted="false"] { \
          list-style-image: url("file:///D:/Grafiken/Avatare/ringtones.ico") \
        } \
        #tab0-sound-button[muted="true"] { \
          list-style-image: url("file:///D:/Grafiken/Avatare/Brainy.ico") \

camel-joe

Leider keine Änderung.

milupo

Du hast beim Neustart von Firefox den Skript-Cache mit geleert?

camel-joe

Ja, das mache ich per Grundsatz immer mit dem Mittelklick.

milupo

Zitat von camel-joe

Wenn ich mit der Maus über den Button fahre, dann erscheint auch nur ein unsichtbarer Button.

Nur da? Die Grafik ringtones.ico erscheint also, nur die Brainy.ico nicht? Dann könnte es eventuell an der Großschreibung von Brainy.ico liegen, wenn die Datei eigentlich brainy.ico heißt.

camel-joe

Es erscheint auch die ringtones.ico nicht. Und Brainy.ico ist der richtige Name.

Meine Aussage "Wenn ich mit der Maus über den Button fahre, dann erscheint auch nur ein unsichtbarer Button.." soll nur bedeuten, dass ich nur dann dieses Symbol (Quadrat) sehe. Bin ich mit der Maus nicht über dem Button, dann sehe ich gar kein Symbol.

grisu2099

Die Ursache hierfür liegt womöglich tiefer.

Den gleichen Effekt habe ich bei mir z.B. beim Button für die Browser-Werkzeuge.

Mal ist er da, mal nicht. Das Skript an sich funktioniert aber.

2002Andreas

Zitat von camel-joe

dann sehe ich gar kein Symbol.

Das Script funktioniert hier einwandfrei mit 2 verschiedenen Icons. Die Pfadangabe wie ich sie ober schon angegeben hatte mit den beiden "....."

milupo

camel-joe Gib mal deinen Code beginnend mit der Zeile let css bis zur Zeile vor let cssUri an. Vielleicht ist da an anderer Stelle ein syntaktischer Fehler.

Lautsprechersymbol auf Tabs / Ton aktivieren

Ähnliche Themen

Stummschaltung für Tab beenden hat keine Funktion