Zweiten Reload-Stop-Button machen

Zitat von BrokenHeart

Hoffe es geht ihm gut

Das hoffe ich auch.

Zitat von BrokenHeart

Nur der Event zum 'Abbrechen' wird nicht weitergeleitet ('X'). Aber ansonsten funktioniert der Reload...

Zitat von 2002Andreas

Normalerweise müsste da das Icon für den Reload sein, und nicht für Stop.

Es müssen also 2 Icons im Skript erstellt werden.

Aber er wollte doch den kombinierten Button (Stop/Reload) dupliziert haben, oder hatte ich es falsch verstanden?

Ich könnte mir vorstellen, dass das Script den Button und die Funktion kreiert, aber nicht alle darunterliegenden Buttons, bzw. deren Darstellung.

Der stop-reload-button hat selber gar kein Icon, lädt aber hier anscheinend das vom ersten child - reload-button - und nur das.

Der stop-reload-button hat ja 2 children - reload-button und stop-button, beide haben dann noch jeweils eine Animation unter sich.

Wenn ich deine Version abändere, bleibt die Funktion erhalten, aber gar keine Buttonicons sind sichtbar.

Der Button an sich ist aber da, funktioniert und der Hintergrund taucht bei hover auch auf.

(function() {

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

  function createButton(str) {
    CustomizableUI.createWidget({
      id: 'stop-reload-button-2',
      type: 'custom',
      defaultArea: CustomizableUI.AREA_NAVBAR,
      onBuild: function() {
            let button = document.getElementById(str).cloneNode(true);
            button.id = 'stop-reload-button-2';
            //button.style.listStyleImage = 'url(chrome://browser/skin/' + str + '.svg)';
            button.style.listStyleImage = 'url("file:///C:/Users/Ramo/AppData/Roaming/Mozilla/Firefox/Profiles/g4mso52s.default-release/chrome/Icons/arfresh.svg")';
            button.setAttribute('onclick',
              'checkForMiddleClick(this, event); if (event.button == 0) event.target.ownerDocument.getElementById("' + str + '-button").click();');
            button.setAttribute('onmousedown', 'if (event.button == 0) event.preventDefault();');
            return button;
      }
    });
  }

  //createButton('stop-reload-button');
  createButton('reload-button');
  createButton('stop-button');

})();

Ich glaube, du hast recht.

Zitat von Horstmann

Der Button an sich ist aber da, funktioniert und der Hintergrund taucht bei hover auch auf.

Sehr interessant: der neue, kombinierte Button wird aus den beiden Stop/Reload-Buttons vom Firefox selber "zusammengesetzt", wenn man sie neu erzeugt und wenn sie die gleiche ID haben. Deswegen sind im Inspektor auch beim geklonten Button ('stop-reload-button-2') keine Kindknoten vorhanden. Er benutzt dann wohl die vorhandenen Kind-Elemente vom Original.

Dass kein Button sichtbar ist, dürfte nur am fehlenden Icon liegen!

Nur die ausgegebenen Fehlermeldungen beim Druck auf den Button machen mir noch etwas Sorgen..

Ich denke aber, auf jeden Fall mal der richtige Ansatz...

Zitat von Horstmann

Ich könnte mir vorstellen, dass das Script den Button und die Funktion kreiert, aber nicht alle darunterliegenden Buttons, bzw. deren Darstellung.

Mit dem Befehl cloneNode(true); werden auch alle Kind-Elemente kopiert. Bei 'false' wäre das nicht der Fall und nur das angesprochene Element würde kopiert werden.

Horstmann Ich glaube, dass das doch nicht der richtige Weg ist. Ich sehe gerade, dass eigentlich nur ein Reload-Button erzeugt wurde, was ja eigentlich auch klar ist, wenn man sich den Code anschaut. Stop und reload haben die gleiche ID und den 'reload'-Button hat er dann wohl einfach als letztes registriert... Oder siehst du das anders?

Zitat von BrokenHeart

Horstmann Ich glaube, dass das doch nicht der richtige Weg ist. Ich sehe gerade, dass eigentlich nur ein Reload-Button erzeugt wurde, was ja eigentlich auch klar ist, wenn man sich den Code anschaut. Stop und reload haben die gleiche ID und den 'reload'-Button hat er dann wohl einfach als letztes registriert... Oder siehst du das anders?

Falls ich in irgeneiner Form den Eindruck erweckt habe, dass ich weiss wovon ich rede - Meine Entschuldigung!

Absolut korrekt, es wird nur der Reload Button erzeugt in meinem groben Beispiel, jeder nachfolgende Eintrag für createButton  wird ignoriert.

Bin mir nichtmal mehr sicher warum ich das überhaupt gepostet habe, hatte wohl zuviel rumprobiert...

Mein Punkt war eher der, dass der Stop-Reload Button eben vielschichtig ist, im Gegensatz zu den einfacheren Back/Forward Buttons, bei denen das ursprüngliche Script problemlos funktioniert.

Bei deiner Version mit createButton('stop-reload-button'); wird der gesamte Button inkl. Unter-Buttons erzeugt; aber wie gesagt, scheinbar wird nur das Reload-Button Icon tatsächlich angezeigt.

Die Funktionen, auch für Stop, sind aber da.

Testen kann man das mit einer langsam ladenden Website, wie zB dieser (offizieller Mozilla Link).

Interessanterweise ist dabei das Verhalten des zusätzlichen Stop-Reload Buttons anders als beim originalen Button.

In den Browsertools sieht man, dass beim neuen Button nur das erste child - der Reload Button - geladen wird, und auch nur der Button, und nicht die untergordnete Animation.

Der Stop Button wird gar nicht geladen.

Wieso - keine Ahnung, kann ich leider nur fassungslos beobachten...

Zitat von Horstmann

Die Funktionen, auch für Stop, sind aber da.

Testen kann man das mit einer langsam ladenden Website, wie zB dieser (offizieller Mozilla Link).

Das kann ich hier nicht bestätigen. Ich hatte es schon vorher getestet und jetzt nochmal mit der Mozilla-Seite, aber bei mir unterbricht er den Ladevorgang nicht, wenn ich den neuen Button betätige.

Zitat von Horstmann

In den Browsertools sieht man, dass beim neuen Button nur das erste child - der Reload Button - geladen wird, und auch nur der Button, und nicht die untergordnete Animation.

Ja wie gesagt, es handelt sich um einen neuen Reload-Button. Der hat auch wie das Original eine 'animatable-box'. Das, was jetzt 'stop-reload-button-2' heißt, ist kein kombinierter Reload/Stop-Button. Im Inspektor wird es deutlicher:

Zitat von BrokenHeart

Das kann ich hier nicht bestätigen. Ich hatte es schon vorher getestet und jetzt nochmal mit der Mozilla-Seite, aber bei mir unterbricht er den Ladevorgang nicht, wenn ich den neuen Button betätige.

Ja wie gesagt, es handelt sich um einen neuen Reload-Button. Der hat auch wie das Original eine 'animatable-box'. Das, was jetzt 'stop-reload-button-2' heißt, ist kein kombinierter Reload/Stop-Button. Im Inspektor wird es deutlicher:

Edit:

Du hast recht, es ist kein Kommbibutton, nur Reload ohne Stop.

Hmm, bei mir wird mit deinem Script das Laden unterbrochen, beim Click auf den neuen Button.

Gelogen - das Laden wird nicht unterbrochen, es wird nur die momentan offene Website neugeladen, wenn sie noch angezeigt ist, und deswegen dann das Laden der nächsten Website abgebrochen.

Im Inspector bleibt der Stop Button "ausgegraut" beim Laden, während er im orginalen Stop-Reload Button beim Ladevorgang auf "aktiv" wechselt, also volle Deckkraft bzw. Farbe.

Allerdings blitzt der der Stop Button #2 ganz kurz farbig auf im Inspector, wird dann aber nicht aktiviert.

Das gleiche mit der animierten Box in beiden Unter-Buttons (reload und stop), die bleibt permanent "ausgegraut" (....) im zusätzlichen Stop-Reload Button, nicht aber im Original.