molily: JavaScript-Erweiterung aktualisiert

Hallo zusammen,

ich habe meine JavaScript-Erweiterung für das Forum rudimentär an das neue HTML angepasst.

Da nun in Folgepostings die Unterscheidung der Themenbereich wegfällt und der Autorname gleichzeitig der Link auf das Posting ist, musste ich das Kontext-Menü, das beim einfachen Klick auf Name bzw. Themenbereich erschien, anders lösen. (Die Screenshots auf obiger Seite zeigen noch die alte Lösung.) Ich habe mich erst einmal für die Rechtsklick-Lösung entschieden. Ein Rechtsklick auf den Namen bzw. Themenbereich öffnet das Kontextmenü.

Script: http://molily.de/selfhtml-forum-js/forum.js
Stylesheet: http://molily.de/selfhtml-forum-js/forum.css

Was haltet ihr davon? Sollte es ein Standardfeature werden? ;)

Grüße
Mathias

  1. Hallo Mathias,

    Ich habe mich erst einmal für die Rechtsklick-Lösung entschieden. Ein Rechtsklick auf den Namen bzw. Themenbereich öffnet das Kontextmenü.

    Was haltet ihr davon? Sollte es ein Standardfeature werden? ;)

    ich verwende dein Skript schon lange und habe mich inzwischen so daran gewöhnt, dass ich mir das Forum ohne gar nicht mehr vorstellen kann ...! ;-)

    Insofern hätte ich nichts dagegen, wenn es ein "Standardfeature" würde.

    Allerdings funktioniert das Kontextmenü (mit Rechtsklick) bei mir aktuell nicht (getestet mit FF und Chrome unter Windows).

    Gruß Gunther

    1. Om nah hoo pez nyeetz, Gunther!

      Allerdings funktioniert das Kontextmenü (mit Rechtsklick) bei mir aktuell nicht (getestet mit FF und Chrome unter Windows).

      Kann ich nicht bestätigen. Hast du auch wirklich den Autorennamen bzw. die Kategorie erwischt?

      Matthias

      --
      Der Unterschied zwischen Java und JavaScript ist größer als der zwischen Vase und Vaseline.

      1. Om nah hoo pez nyeetz, Matthias!

        Allerdings funktioniert das Kontextmenü (mit Rechtsklick) bei mir aktuell nicht (getestet mit FF und Chrome unter Windows).

        Kann ich nicht bestätigen. Hast du auch wirklich den Autorennamen bzw. die Kategorie erwischt?

        Also bitte ..., ja! :-P

        In Chrome spuckt die Konsole folgenden Fehler aus:

        Uncaught TypeError: Cannot read property 'textContent' of null (Zeile 166)  
        
        

        Gruß Gunther

        1. Meine Herren!

          In Chrome spuckt die Konsole folgenden Fehler aus:

          Uncaught TypeError: Cannot read property 'textContent' of null (Zeile 166)

            
          Same here. Bei mir lag es daran, dass ich eine Kategorie (JavaScript) durch die Benutzereinstellungen hervorgehoben habe. In diesem Fall wird ein anderen Klassenname für die Kategorie verwendet:  
            
          Problem müsste wie folgt behoben werden können (ungetestet):  
            
          ~~~javascript
          // In Zeile 166  
          var category = postingSpan.querySelector('.category, .cathigh').textContent;
          
          --
          “All right, then, I'll go to hell.” – Huck Finn
          1. Danke sehr, sollte nun behoben sein.

            Ich habe das Heraussuchen der Elemente auch etwas robuster gestaltet.

            Mathias

            1. Hi!

              Danke sehr, sollte nun behoben sein.

              Besten Dank Mathias - jetzt werkelt es einwandfrei!

              Gruß Gunther

  2. Om nah hoo pez nyeetz, molily!

    Da nun in Folgepostings die Unterscheidung der Themenbereich wegfällt und der Autorname gleichzeitig der Link auf das Posting ist, musste ich das Kontext-Menü, das beim einfachen Klick auf Name bzw. Themenbereich erschien, anders lösen. (Die Screenshots auf obiger Seite zeigen noch die alte Lösung.) Ich habe mich erst einmal für die Rechtsklick-Lösung entschieden. Ein Rechtsklick auf den Namen bzw. Themenbereich öffnet das Kontextmenü.

    Vielen Dank, dass du dir die Mühe gemacht hast. Die Unterscheidung der Themenbereiche fällt nicht weg, ein geänderter Themenbereich ist zu sehen, die Themenbereiche und auch die Themen stehen alle im DOM.

    Stylesheet: http://molily.de/selfhtml-forum-js/forum.css

    Ein bisschen viel display: none; ;-)

    Der Themenfilter per Parameter (&lf=) ist durch dein Script überflüssig und funktioniert auch nicht. Der könnte deshalb ein display: none vertragen.

    Was haltet ihr davon? Sollte es ein Standardfeature werden? ;)

    Wieso werden? Bleiben.

    Matthias

    --
    Der Unterschied zwischen Java und JavaScript ist größer als der zwischen satt und Sattel.

    1. Hallo!

      Die Unterscheidung der Themenbereiche fällt nicht weg, ein geänderter Themenbereich ist zu sehen, die Themenbereiche und auch die Themen stehen alle im DOM.

      Ja, sonst könnte das Script auch gar nicht tun, was es tut.

      Stylesheet: http://molily.de/selfhtml-forum-js/forum.css

      Ein bisschen viel display: none; ;-)

      Sorry, falscher Link. Das ist das Stylesheet, das ich persönlich verwende. Wie man darin sieht, werden die für das JavaScript nötigen Styles per @import aus der Datei http://molily.de/selfhtml-forum-js/javascript.css geladen. Nur diese sind im engeren Sinne für das funktionieren notwendig.

      Mathias

    2. Om nah hoo pez nyeetz, Matthias Apsel!

      Stylesheet: http://molily.de/selfhtml-forum-js/forum.css

      Ein bisschen viel display: none; ;-)

      Das ist offensichtlich dein userstylesheet. Das CSS für die Erweiterung steckt in http://molily.de/selfhtml-forum-js/javascript.css

      .posting.highlighted braucht kein display: block; und das !important kann entfallen.

      Matthias

      --
      Der Unterschied zwischen Java und JavaScript ist größer als der zwischen Mars und Marschflugkörper.

      1. .posting.highlighted braucht kein display: block;

        Braucht nicht, aber hilfreich ist es schon, wenn die ganze Zeile eingefärbt ist.

        und das !important kann entfallen.

        Stimmt!

        Mathias

        1. Om nah hoo pez nyeetz, molily!

          .posting.highlighted braucht kein display: block;

          Braucht nicht, aber hilfreich ist es schon, wenn die ganze Zeile eingefärbt wird.

          Im Falle von .threadstart gibts dann 3 Zeilen.

          Fūr eine nahtlose Integration hat bestimmt Performer noch Änderungsvorschläge. Zur Umsetzung wäre es dann nützlich, wenn dein Script dem body eine Klasse gäbe, etwa molily-js. So kann man dann beispielsweise den sinnlos gewordenen Themenfilter ausblenden.

          Matthias

          --
          Der Unterschied zwischen Java und JavaScript ist größer als der zwischen Geste und Gestein.

          1. Hallo!

            Fūr eine nahtlose Integration hat bestimmt Performer noch Änderungsvorschläge. Zur Umsetzung wäre es dann nützlich, wenn dein Script dem body eine Klasse gäbe, etwa molily-js.

            Gerne.

            So kann man dann beispielsweise den sinnlos gewordenen Themenfilter ausblenden.

            Der Themenfilter ist nicht sinnlos, er wird per Progressive Enhancement mit JavaScript-Logik versehen. Es gibt dann keinen Reload, sondern das aktuelle Dokument wird gefiltert – genau wie bei der Wahl von »Filtere nach Themenbereich« aus dem Kontextmenü.

            Grüße
            Mathias

            1. Om nah hoo pez nyeetz, molily!

              Der Themenfilter ist nicht sinnlos, er wird per Progressive Enhancement mit JavaScript-Logik versehen. Es gibt dann keinen Reload, sondern das aktuelle Dokument wird gefiltert – genau wie bei der Wahl von »Filtere nach Themenbereich« aus dem Kontextmenü.

              Das ist mir gar nicht aufgefallen. Es fehlt also ein Feedback.

              Matthias

              --
              Der Unterschied zwischen Java und JavaScript ist größer als der zwischen Stew und Stewardess.

              1. Testantwort. Damit ich auch mal ungelesene Antworten habe.

            2. Der Themenfilter ist nicht sinnlos, er wird per Progressive Enhancement mit JavaScript-Logik versehen. Es gibt dann keinen Reload, sondern das aktuelle Dokument wird gefiltert – genau wie bei der Wahl von »Filtere nach Themenbereich« aus dem Kontextmenü.

              Das geht jetzt auch ohne zusätzlichen Klick auf den Absendebutton, es reicht ein Wechsel im Select-Feld.

  3. Hej Mathias,

    erstmal ein Lob an deine Fähigkeiten in JavaScript. Die sind unübertrefflich. Merke ich hier immer wieder, wenn ich alle paar Monate reinschneie und schaue was so hier läuft.

    Ich habe mir die Seite angesehen und du hast allein nur der Info wegen sehr viel Arbeit investiert. Normalerweise werden die Sachen sofort eingebaut und nicht so ausführlich dokumentiert. Das gibt es selten. Es ist schön, dass man bei der Entwicklung der Gedanken und deines Skripts in gewisser Hinsicht dabei sein darf. :)

    Diese Idee mit den erweiterten Optionen/Informationen finde ich sehr gut, allerdings würde ich zusätzlich eine Art kleines Bild für das Posting mit geben oder etwas anderes, das als Zusatzfunktion erkannt wird. Ich würde nämlich nicht bzw. ein neuer der davon keine Kenntnis hat, nicht wissen, wo sich dieses Kontextmenü befindet. Auf den Namen klicken ist eher Zufallssache, wenn man jemanden anstupsen möchte.

    Als nicht registrierter Benutzer habe ich zwar keinerlei Zugriff auf diese Funktionen, aber ich sehe auch kein Sinn darin zu sagen, dass es nicht hilfreich wäre. Für die registrierten Benutzer kann es sehr sehr hilfreich sein und aufklärend zugleich - zumals die registrierten Benutzer hauptsächlich auf die Fragen der Hilfesuchenden antworten. Das lässt die vorhandenen Daten besser verwalten und bringt Ordnung in das Ganze. So kann man seinen Blick auf das Wesentliche konzentrieren. Ich bin dafür, dass es eingebaut wird.

    lg,
    Roland

  4. Om nah hoo pez nyeetz, molily!

    Was haltet ihr davon? Sollte es ein Standardfeature werden? ;)

    Unter https://trello.com/c/bmMJgul2 gibt es erste Entwürfe zur Anpassung an das bestehende css.

    Machst du bitte aus deinen beiden h2-Überschriften h3?

    Matthias

    --
    Der Unterschied zwischen Java und JavaScript ist größer als der zwischen Sand und Sandwich.

  5. Om nah hoo pez nyeetz, alle!

    Kann mir mal jemand erklären, warum sich die Statistik-Tabelle für die Nutzer auf die erlaubte Maximalbreite ausdehnt, wohingegen in der Tabelle für die Kategorien horizontale Scrollbalken erscheinen, obwohl Platz wäre?

    beobachtet in FF, Chr, Op12.16. Im IE 11 tritt dieses Verhalten nicht auf, im Safari 5(.1.2) unter Windows arbeitet das Script nicht. Der scheint auch keine automatischen Updates zu haben, es gibt wohl schon 5.1.7.

    Matthias

    --
    Der Unterschied zwischen Java und JavaScript ist größer als der zwischen Baby und Babylon.

    1. Hi!

      Ich habe padding hinzugefügt und die Breiten fest gesetzt, jetzt sollte die horizontale Scrollbar nicht mehr auftauchen.

      Der ganze Spaß ist natürlich auf GitHub:
      https://github.com/molily/selfhtml-forum-js
      (Nichts Neues, dort liegt das Repository schon seit Jahren, ich hatte es nur noch nicht in diesem Thread erwähnt. Falls also jemand die Änderungen verfolgen will…)

      im Safari 5(.1.2) unter Windows arbeitet das Script nicht. Der scheint auch keine automatischen Updates zu haben, es gibt wohl schon 5.1.7.

      Für Mac OS ist Version 7.0.2 aktuell. ;-) Die Windows-Version kann man getrost vergessen.

      Grüße,
      Mathias

      1. Om nah hoo pez nyeetz, molily!

        Der ganze Spaß ist natürlich auf GitHub:
        https://github.com/molily/selfhtml-forum-js

        Ich hab dir auch zwei Pull-Requests geschickt. #2, #3

        Matthias

        --
        Der Unterschied zwischen Java und JavaScript ist größer als der zwischen nord und Norderney.

        1. Danke.

          Das !important bei background-color für .highlighted > .posting ist leider noch nötig. Die Regel wird sonst von dieser hier überschrieben:

          #root ul ul li:only-child > .posting { /* getrennte Regel, sonst beachtet IE8 die oberen nicht */  
          	background: transparent;  
          }
          

          Was dazu führt, dass der Highlight oftmals nicht zu sehen ist.

          Die Benutzung von Shorthand-Eigenschaften ist aus diesem Grund problematisch und ich versuche sie zu vermeiden, wenn eigentlich nur eine Eigenschaft gesetzt werden soll. Was hier besser stehen sollte, ist ein zielgenaues background-image: none. Dann braucht mein background-color kein !important.

          Mathias

          1. Om nah hoo pez nyeetz, molily!

            Was dazu führt, dass der Highlight oftmals nicht zu sehen ist.

            genau dann, wenn :only-child zutrifft.

            Die Benutzung von Shorthand-Eigenschaften ist aus diesem Grund problematisch und ich versuche sie zu vermeiden, wenn eigentlich nur eine Eigenschaft gesetzt werden soll. Was hier besser stehen sollte, ist ein zielgenaues background-image: none. Dann braucht mein background-color kein !important.

            Guter Hinweis. Ist eingearbeitet, wird im nächsten Update hochgeladen.

            Matthias

            --
            Der Unterschied zwischen Java und JavaScript ist größer als der zwischen Schaf und Schaffner.

      2. Om nah hoo pez nyeetz, molily!

        Ergänzung:

        Und wenn du die Anpassungen an das CSS einarbeitest, kannst du auch noch die Statistik-Tabelle ein wenig aufhübschen.

        #stats {  
          border: 2px solid #8A9DA8;  
          border-radius: 0.5em 0 0 0.5em;  
        }
        

        Matthias

        --
        Der Unterschied zwischen Java und JavaScript ist größer als der zwischen Brand und Brandung.

  6. Hallo,

    ich binde das (oder ein) Script über http://forum.de.selfhtml.org/js/forum.js ein. Landet molilys Script irgendwann da? So einige Features wie "Rechtsklick auf Autor" und "Link zu neuen Antworten" vermisse ich seit der letzten Umstellung schon.

    Gruß, Jürgen

    1. Om nah hoo pez nyeetz, JürgenB!

      ich binde das (oder ein) Script über http://forum.de.selfhtml.org/js/forum.js ein. Landet molilys Script irgendwann da?

      So soll es sein. Bis dahin kannst du es von molilys Seite einbinden.
      http://molily.de/selfhtml-forum-js/forum.js
      http://molily.de/selfhtml-forum-js/javascript.css

      Ein kleiner Fehler ist noch drin. Wenn der behoben ist, kann das Script umziehen. Eine eigene CSS-Ressource wird dann nicht notwendig sein, die notwendigen Styles werden in das Forums-CSS integriert.

      Matthias

      --
      Der Unterschied zwischen Java und JavaScript ist größer als der zwischen Nabe und Nabel.

      1. Hi,

        Eine eigene CSS-Ressource wird dann nicht notwendig sein, die notwendigen Styles werden in das Forums-CSS integriert.

        guter Service hier. :-)

        Ciao, Performer

  7. Om nah hoo pez nyeetz, alle!

    Script: http://molily.de/selfhtml-forum-js/forum.js
    Stylesheet: http://molily.de/selfhtml-forum-js/javascript.css [Link korrigiert]

    Es ist kein eigenes Stylesheet mehr notwendig. Die Angaben sind in das Forums-CSS integriert worden.

    Matthias

    --
    Der Unterschied zwischen Java und JavaScript ist größer als der zwischen Penn und Penner.