(Skript) Anzeige für Version/Datum/Uhrzeit innerhalb der Titelleiste verschieben...

BrokenHeart

Hallo,

ich benutze unter FF68esr/Win10 folgendes Script für die Anzeige der FF-Version + Datum/Uhrzeit:

Code

(function() {
    function doDatClock() {
        var timestr = new Date().toLocaleDateString( locale , options );
        if( count == 1 ) {
            var counter = new Date( 1000 * sec ).toISOString().substr( 11 , 8 ); // .replace(/^[0:]+/, '') // if you want to replace zeroes and colons
            timestr = timestr + ' (' + counter + ')';
            sec++;
        }
        ClockLabel.setAttribute( 'value', timestr );
    }
    
    var count = 0; // if you don't want a counter set this to zero
    var agent = 1; // if you just want the clock set this to zero
    var language = 'de-DE'; // locale, e.g. 'de-DE' , 'en-US' , 'fr-FR'
    var personalText = '  -'; // your personal text here
    var cssColor = '#FFFFFF'; // Font Color

    var css = 'padding-top: 6px; padding-left: 0px; color: ' + cssColor + '; font-family: Arial; font-size: 12px; font-weight: 600; text-shadow: 1px 1px 0px rgba(0,0,0,0.75); width: 0px;';
    var cssA = 'width: auto; ';
    
    
                
    var options = { 
        weekday: 'long', 
        year: 'numeric', 
        month: 'long', 
        day: 'numeric', 
        hour: '2-digit', 
        minute: '2-digit', 
        second: '2-digit' 
    };
    
    var sec = 0;

    var locale = language || window.navigator.languages[0];

    var position = document.getElementById('menubar-items');
        
    var ClockLabel = document.createElement('label');
    ClockLabel.setAttribute('id', 'statusbar-clock-display');
    ClockLabel.setAttribute('class', 'statusbarpanel-text');
    ClockLabel.setAttribute('style', css);    
    position.parentNode.insertBefore(ClockLabel, position.nextSibling);
    

    if( agent == 1 ) {
        var AgentLabel = document.createElement('label');
        AgentLabel.setAttribute('id', 'statusbar-agent-display');
        AgentLabel.setAttribute('class', 'statusbarpanel-text');
        AgentLabel.setAttribute('style', css + cssA);
        var FFstr = AppConstants.MOZ_MACBUNDLE_NAME.split('.');
        var mbName = FFstr[0];
        var text = '' + mbName + ' ' + AppConstants.MOZ_APP_VERSION_DISPLAY + personalText;
        AgentLabel.setAttribute( 'value', text );
        position.parentNode.insertBefore(AgentLabel, position.nextSibling);
    }
    
    if( count == 1 ) {
        ClockLabel.addEventListener('dblclick', function() { sec = 0; });
    }
    
    window.setInterval( doDatClock , 1000 );
})();

Alles anzeigen

In der userchrome.css habe ich noch die Style-Informationen überschrieben (ausgelagert):

CSS

#statusbar-agent-display {
    color: #FFF5CC !important;
    font-family: Century Gothic !important;
    font-style: italic !important;
    font-size: 10px !important;
    font-weight: 100 !important; 
    text-shadow: 1px 1px 0px rgba(0,0,0,0.75) !important; 
    padding-top: 6px !important; 
    padding-left: 0px !important; 
    margin-left: 8px !important;
}
    
#statusbar-clock-display {
    color: #FFF5CC !important;
    font-family: Century Gothic !important;
    font-style: italic !important;
    font-size: 10px !important;
    font-weight: 100 !important; 
    text-shadow: 1px 0px rgba(0,0,0,0.75) !important; 
    padding-top: 6px !important; 
    padding-left: 0px !important; 
    margin-left: 0px !important;
}

Alles anzeigen

Das schaut dann so aus:

Ich schaffe es aber nicht, mit meinen rudimentären css/js-Kentnissen, die Anzeige entweder zentriert innerhalb der Titelleiste oder rechtsbündig neben den Fensterbuttons zu positionieren.

Weiß jemand, was man am Code ändern muss, damit das funktioniert?

PS: was ich nicht haben möchte: Die 'margins' zu den 'menubar-items' zu vergrößern. Das funktioniert dann nicht mehr vernünftig, wenn sich die Fenstergröße verändert.

Für jede Antwort dankbar...

milupo

Ändere im Skript in den Zeilen 39 und 47 createElement in createXULElement

Der Link zu deinem Screenshot funktioniert nicht. Hast du über die Funktion Dateianhänge im Editorfenster hochgeladen?

BrokenHeart

Zitat von milupo

Ändere im Skript in den Zeilen 39 und 47 createElement in createXULElement

Ich benutze doch die 68esr und das Skript funktioniert ja auch. Ist diese Änderung nicht erst ab FF69 notwendig?

Den Link zum Screenshot habe ich berichtigt ( bei mir hatte er das Bild angezeigt?! )

milupo

Zitat von BrokenHeart

Ich benutze doch die 68esr und das Skript funktioniert ja auch. Ist diese Änderung nicht erst ab FF69 notwendig?
Den Link zum Screenshot habe ich berichtigt ( bei mir hatte er das Bild angezeigt?! )

Die Firefox-Version hattest du aber nicht angegeben. Ja, erst ab Firefox 69. Ich bin von Fx 69 ausgegangen und habe angenommen, dass das Skript nicht funktioniert. Der Link hatte ja nicht funktioniert, um da etwas überprüfen zu können.

BrokenHeart

Zitat von milupo

Die Firefox-Version hattest du aber nicht angegeben.

Doch hatte ich...

Zitat von BrokenHeart

Hallo,

ich benutze unter FF68esr/Win10 folgendes Script für die Anzeige der FF-Version + Datum/Uhrzeit:

milupo

Füge mal in Zeile 19 der Variable cssA die Regel margin-left: 15px; hinzu. Das verwende ich hier- Muss also so aussehen:

CSS

var cssA = 'margin-left:15px; width: auto;';

Den Pixelwert kannst du dir ja anpassen.

milupo

Zitat von BrokenHeart

Zitat von milupo

Die Firefox-Version hattest du aber nicht angegeben.

Doch hatte ich...

Nicht schummeln, du hast deinen Beitrag nachträglich bearbeitet und zwar später als ich den Beitrag geschrieben habe. Es ist aber trotzdem gut, dass du das noch nachträglich hingeschrieben hast.

BrokenHeart

Danke für die Hilfe, aber auch hier muss ich mich nochmal selber aus meinem Eingangspost zitieren :

Zitat von BrokenHeart

PS: was ich nicht haben möchte: Die 'margins' zu den 'menubar-items' zu vergrößern. Das funktioniert dann nicht mehr vernünftig, wenn sich die Fenstergröße verändert.

Sören Hentzschel

Zitat von milupo

Nicht schummeln, du hast deinen Beitrag nachträglich bearbeitet und zwar später als ich den Beitrag geschrieben habe.

Das stand von Anfang an im Beitrag (mit der neuen Software werden alle Beitrags-Versionen gespeichert, ich sehe also die erste Version).

BrokenHeart

Zitat von milupo

Nicht schummeln, du hast deinen Beitrag nachträglich bearbeitet und zwar später als ich den Beitrag geschrieben habe. Es ist aber trotzdem gut, dass du das noch nachträglich hingeschrieben hast.

Also das finde ich jetzt absolut daneben, dass du mir unterstellst, dass ich den Hinweis auf die FF-Version nachträglich reineditiert habe. Ich habe den Screenshot-Link bearbeitet sonst nichts! Warum sollte ich lügen (oder schummeln, wie du es nennst). Das habe ich nicht nötig. Wenn ich was vergessen habe, dann schreibe ich das auch hin. Aber in diesem Fall ist das definitiv nicht der Fall, wie man im Versionsvergleich sehen kann:

milupo

Dann entschuldige bitte, ich muss dann die Angabe übersehen haben. Nachgeschaut habe ich, aber wohl anscheinend überlesen.

milupo

Zitat von BrokenHeart

Danke für die Hilfe, aber auch hier muss ich mich nochmal selber aus meinem Eingangspost zitieren :

Du solltest vielleicht Wörtchen wie nicht größer schreiben, damit ich sie nicht überlese. Oh, ist das heute wieder peinlich.

BrokenHeart

Zitat von milupo

Dann entschuldige bitte, ich muss dann die Angabe übersehen haben.

Wie sagt Andreas immer: "Alles ist gut!" . Ich bin nicht nachtragend...

BrokenHeart

Jetzt habe ich mich selber nochmal an das Skript gewagt und mit ein paar Änderungen eine Lösung gefunden, welches die angezeigte Version/Datum/Uhrzeit immer rechtsbündig neben dem Minimieren-Button anzeigt. Außerdem habe ich das Skript etwas 'entschlackt' und die Klassennamen/IDs etwas sinniger benannt. Die optischen CSS-Anpassungen sind vollständig aus dem Skript entfernt und müssen in der 'userchrome.css' eingefügt/angepasst werden. Fand ich übersichtlicher, als alles in dem Skript in einen String zusammen zu pressen. Ob das unter jedem Aspekt bei jedem so funktioniert wie bei mir, kann ich nicht sagen...

Das schaut dann bei mir so aus:

Optische Anpassungen in die 'userchrome.css' kopieren:

CSS

/* VersionClock Display */
#titlebar-agent-display {
    color: #FFF5CC !important;
    font-family: Century Gothic !important;
    font-style: italic !important;
    font-size: 15px !important;
    font-weight: 100 !important; 
    text-shadow: 1px 1px 0px rgba(0,0,0,0.75) !important; 
    padding-top: 3px !important; 
    padding-left: 0px !important; 
    margin-left: 8px !important;
}
    
#titlebar-clock-display {
    color: #FFF5CC !important;
    font-family: Century Gothic !important;
    font-style: italic !important;
    font-size: 15px !important;
    font-weight: 100 !important; 
    text-shadow: 1px 1px 0px rgba(0,0,0,0.75) !important; 
    padding-top: 3px !important; 
    padding-left: 0px !important; 
    margin-left: 0px !important;
}

Alles anzeigen

Geändert habe ich in erster Linie nur die Positionsbestimmung der Anzeige, nämlich nicht über die ID der 'menubar-items' sondern über den Klassennamen der Windows-Minimierenbox in der titlebar:

Code

    var position = document.getElementsByClassName('titlebar-button titlebar-min')[0];

Hier das Skript für FF69 (VersionClockRightPos.uc.js) :

JavaScript

// VersionClockRightPos.uc.js: Rechtsbündige Anzeige der FireFoxVersion/Datum/Uhrzeit in der 'Titlebar'

(function() {
    function doDatClock() {
        var timestr = new Date().toLocaleDateString( locale , options );
        if( count == 1 ) {
            var counter = new Date( 1000 * sec ).toISOString().substr( 11 , 8 ); // .replace(/^[0:]+/, '') // if you want to replace zeroes and colons
            timestr = timestr + ' (' + counter + ')';
            sec++;
        }
        ClockLabel.setAttribute( 'value', timestr );
    }
    
    var count = 0; // if you don't want a counter set this to zero
    var agent = 1; // if you just want the clock set this to zero
    var language = 'de-DE'; // locale, e.g. 'de-DE' , 'en-US' , 'fr-FR'
    var personalText = '  - '; // your personal text here
        
    var options = { 
        weekday: 'long', 
        year: 'numeric', 
        month: 'long', 
        day: 'numeric', 
        hour: '2-digit', 
        minute: '2-digit', 
        second: '2-digit' 
    };

    var sec = 0;

    var locale = language || window.navigator.languages[0];

    var position = document.getElementsByClassName('titlebar-button titlebar-min')[0];
    
    
    var ClockLabel = document.createXULElement('label');
    ClockLabel.setAttribute('id', 'titlebar-clock-display');
    ClockLabel.setAttribute('class', 'titlebarpanel-text');
    position.parentNode.insertBefore(ClockLabel, position );
        

    if( agent == 1 ) {
        var AgentLabel = document.createXULElement('label');
        AgentLabel.setAttribute('id', 'titlebar-agent-display');
        AgentLabel.setAttribute('class', 'titlebarpanel-text');
        var FFstr = AppConstants.MOZ_MACBUNDLE_NAME.split('.');
        var mbName = FFstr[0];
        var text = '' + mbName + ' ' + AppConstants.MOZ_APP_VERSION_DISPLAY + personalText;
        AgentLabel.setAttribute( 'value', text );
        position.parentNode.insertBefore(AgentLabel, position.previousSibling);
    }
    
    if( count == 1 ) {
        ClockLabel.addEventListener('dblclick', function() { sec = 0; });
    }
    
    window.setInterval( doDatClock , 1000 );
})();

Alles anzeigen

herz.AG

BrokenHeart

Guten Tag,

sowas suche ich schon lange, es gab mal so ein AddOn... once upon a time.

Da ich aber so gar nicht in Programmierung drinstecke, würde mich interessieren, wo und wie ich das Script platzieren und einbinden muß, damit das ganze funktioniert?

userchrome.css habe ich schon mal gehört...

Besten Dank und ein entspanntes WE wünschend,

herz.AG

2002Andreas

Zitat von herz.AG

wo und wie ich das Script platzieren und einbinden muß,

Hallo und Willkommen hier im Forum. ?

Dazu bedarf es erst einiger Vorbereitungen.

Siehe bitte dazu hier:

#1

Und dann eine Anleitung mit Bilder dazu hier:

https://github.com/Endor8/userChr…ster/userChrome

Und das alles ganz in Ruhe machen bzw. durchlesen, dann klappt das auch.

herz.AG

2002Andreas

danke für die flotte Antwort: In der Ruhe liegt die Kraft

I

Bedankt,

herz.AG