GreaseMonkey zum Individualisieren des Forums



  • Hi,

    ich habe heute ein wenig experimentiert, und nun benutze ich folgendes Skript:

    // ==UserScript==
    // @name           c-plusplus.net-Seitenpedikuere
    // @namespace      Sonemagic
    // @version        1.0
    // @description    Macht die Seite minimalistischer.
    // @include        http://www.c-plusplus.net/forum/*
    // ==/UserScript==
    
    function remove(x)
    {
      x.parentNode.removeChild(x);
    }
    
    function xCall(xpath, foo)
    {
    	xpathResult = document.evaluate
    	(
    		xpath,
    		document, 
    		null, 
    		XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, 
    		null
    	);
    
    	for(var i=0; i < xpathResult.snapshotLength ; i++)
    		foo( xpathResult.snapshotItem(i) );
    }
    
    function xDelete(xpath)
    {
    	xCall(xpath, remove);
    }
    
    function xHilight(username, colour_str)
    {
    	function set_style(obj)
    	{
    		obj.setAttribute('style', obj.getAttribute('style') + "background-color:" + colour_str + ";" );
    	}
    
    	xCall( '//td[strong[text()="' + username + '"]]', set_style );
    	xCall( '//td[span[text()="' + username + '"]]', set_style );
    }
    
    xHilight('camper', 'red');
    xHilight('volkard', 'red');
    xHilight('Sone', 'Blue');
    
    xDelete('//a[img[@src="templates/fisubtext/images/c-plusplusde.gif"]]'); // Das Titelbanner
    xDelete('//a[@href="http://meetingcpp.com"]'); // Das Meeting-C++ Banner
    xDelete('//p[a[@href="http://m.c-plusplus.net"]]'); // Dieser Hinweis auf die neuen mobilen Seiten
    xDelete('//td[span/a[text()="Hypercell aus"]]'); // Die beiden "Verstecke Navigation" und "Hypercell aus" Trigger
    xDelete('//td[input[@value="Go"]]'); // Der "Go"-Button der Dropdown-Liste
    
    xDelete('//span[a[text()="Benutzerprofil"]]'); // Die Details des Posters (Anmelde-Datum & co.)
    
    xDelete('//div[a[text()="Logout [ Sone ]"]]'); // Der Logout-Knopf. xPath für seinen eigenen Account entsprechend bearbeiten.
    
    xDelete('//table[tbody/tr/td/div[@class="gensmall if_print_hide"]]'); // Dieser Text unten, den wir alle nicht mögen
    
    // *** Die ganzen Tags oben ***
    var tag_xpaths = [ "Startseite", 
    				   "FAQs",
    				   "Compiler",
    				   "Bücher",
    				   "Magazin",
    				   "Tutorials",
    				   "Impressum & AGB",
    				   "Kontakt",
    				   "Facebook",
    				   "Anleitung" ];
    
    for( var i = 0; i < tag_xpaths.length; ++i )
    	xDelete('//a[text()="' + tag_xpaths[i] + '"]');
    
    // Twitter und Facebook
    xDelete('//a[@href="http://twitter.com/cplusplusde" and img]');
    xDelete('//a[@href="http://facebook.com/cpp-de" and img]');
    
    //__________________________________________________________________________________________________________________________________
    
    xCall( '//td[@class="nav"]', 
    function(obj)
    {
    	var firstOccurence = obj.innerHTML.search('<a');
    
    	obj.innerHTML = '[ ' +
    	obj.innerHTML.substr( firstOccurence, obj.innerHTML.length - firstOccurence );
    } );
    
    //__________________________________________________________________________________________________________________________________
    
    xCall( '//td[form[@name="jumpbox"]]', 
    function(obj)
    {
    	obj.setAttribute('align', 'center');
    } );
    
    //__________________________________________________________________________________________________________________________________
    
    xCall( '//span[@class="postdetails"]', 
    function(obj)
    {
    	obj.innerHTML = obj.innerHTML.replace("Mitglied", "<b>Mitglied</b>");
    	obj.innerHTML = obj.innerHTML.replace("Moderator", "<b>Moderator</b>");
    	obj.innerHTML = obj.innerHTML.replace("Autor", "<b>Autor</b>");
    } );
    
    //__________________________________________________________________________________________________________________________________
    
    xCall( '//strong[@class="name"]', 
    function(obj)
    {
    	obj.setAttribute('style', 'font-size:12px;');
    } );
    

    Das macht das Forum sehr minimalistisch. Ich brauche tatsächlich nicht mehr als nur das...

    Natürlich kann man einzelne Sachen auskommentieren/löschen, die man weiterhin nutzen will.

    Edit^x: Habe die XPaths etwas spezieller gemacht, damit sie nicht zufällig auf unschuldige Links usw. zutreffen.



  • Oh, Stop! Bug gefunden. Fixe ich mal.
    Edit: Gefixt und editiert.



  • Hier noch eine nette Funktion, die bestimmte User hilighted:

    function xHilight(username, colour_str)
    {
    	function set_style(obj)
    	{
    		obj.setAttribute('style', obj.getAttribute('style') + "background-color:" + colour_str + ";" );
    	}
    
    	xCall( '//td[strong[text()="' + username + '"]]', set_style );
    	xCall( '//td[span[text()="' + username + '"]]', set_style );
    }
    
    xHilight('camper', 'red');
    

    Damit das funktioniert, muss aber das <span> -Tag bereits existieren. Das fixe ich gleich mal und editiere alles.

    Edit: Gut, gefixt. Jetzt wird kein <span> -Tag mehr eingefügt.



  • Und hier noch eine, die die Such-Box für Google direkt in die obere Leiste einblendet:

    var xresult = document.evaluate
    (
    	'//tr[td/form[@name="jumpbox"]]',
    	document, 
    	null, 
    	XPathResult.FIRST_ORDERED_NODE_TYPE, 
    	null
    );
    
    var GoogleSearchBoxHTML = 
    '<center><div><form action="http://www.google.de/cse" id="cse-search-box">'
    + '<input name="cx" value="partner-pub-3727475938645712:xq6206-4diq" type="hidden"><input name="q" size="41" type="text">'
    + '<input name="sa" value="Suche" type="submit"></form></div></center>';
    
    xresult.singleNodeValue.innerHTML = GoogleSearchBoxHTML + xresult.singleNodeValue.innerHTML;
    


  • Ist ja ganz nett, aber imo unnötig, man klickt einfach auf Verstecke Navigation und schon hat man den Header nicht mehr.
    (btw, da ist irgendwie ein Bug bei mir, dass der am Anfang sowohl die Links fürs Zeigen als auch fürs Verstecken der Navigation hat).



  • Nathan schrieb:

    Ist ja ganz nett, aber imo unnötig, man klickt einfach auf Verstecke Navigation und schon hat man den Header nicht mehr.

    Ja, aber dann hat man auch nicht mehr die Jumpbox oder den "Eigene Beiträge"-Button. Ich hätte gerne Beide, aber ohne den "Rest".

    Das Meeting-C++ Banner sowie der Text unten nerven mich auch. Und die Google-Suchbox finde ich ehrlich geil.

    da ist irgendwie ein Bug bei mir, dass der am Anfang sowohl die Links fürs Zeigen als auch fürs Verstecken der Navigation hat

    Das Forum wird von solchen Kleinigkeiten durchzogen.



  • Sone schrieb:

    Nathan schrieb:

    Ist ja ganz nett, aber imo unnötig, man klickt einfach auf Verstecke Navigation und schon hat man den Header nicht mehr.

    Ja, aber dann hat man auch nicht mehr die Jumpbox oder den "Eigene Beiträge"-Button. Ich hätte gerne Beide, aber ohne den "Rest".

    Jumpbox nutze ich nie und eigene Beiträge kommt man übers Benutzerprofil unterm Namen dran, also kein Verlust.

    Und die Google-Suchbox finde ich ehrlich geil.

    Jup, die muss ich mal testen. 👍



  • Nathan schrieb:

    Jup, die muss ich mal testen. 👍

    Lol, die funktioniert wieder nicht. Muss ich fixen. Merkwürdig. Alles erfordert wohl zweimal schreiben.



  • Das ist ja der Wahnsinn! Genau dasselbe HTML... nichts. Es klappt sogar, wenn ich das HTML bei Chrome manuell reinpaste.... oO



  • Aha. Bei Chrome funktioniert das Skript - bei Firefox nicht. Woran könnte das liegen? Ich werde vielleicht mal ins Webforum schreiben.



  • Sone schrieb:

    Ich werde vielleicht mal ins Webforum schreiben.

    Lieber nicht, der CODE ist grottig!



  • Ist auch nicht besser und vllt. gehen auch die Regex nicht in anderen Browsern?

    Aber, für mein erstes Greasemonkey-Skript find ich es nicht schlecht...

    // ==UserScript==
    // @name        junta-cpp
    // @namespace   junta-cpp
    // @include     http://www.c-plusplus.net/forum/*
    // @version     1
    // ==/UserScript==
    
    var style =
         '.inlineadtitle'
        +',.inlinead'
        +',.catbutton'
        +',.bodyline table tr'
        +',iframe'
        +',body table'
        +',.postdetails .if_print_hide'
        +',.topnav td p'
        +',.topnav img'    
            +'{display:none}'
        +'.bodyline'
        +',.bodyline table'
            +'{display:table !important}'
        +'.bodyline table table tr'
        +',.bodyline table tr:first-child'
            +'{display:table-row}'
    
        +'.topnav table{margin-left:auto;margin-right:auto;}'
        +'.topnav form{display:block}'
    
        +'.bodyline table table[class=if_print_hide]'
            +'{display:none !important}'
    ;
    
    if((/\/forum\/?$/).test(window.location.pathname)){
        style +=
             '.genmed'
            +',.forumline td:first-child img:last-child'
            +',.row1 br'
                +'{display:none}'
            +'.forumline td{padding: 0 7px}'
        ;
    }
    
    var el = document.createElement('style');
    el.innerHTML = style;
    document.getElementsByTagName('head')[0].appendChild(el);
    
    document.getElementsByName('jumpbox')[0].parentNode.innerHTML +=
         '<center><div><form action="http://www.google.de/cse" id="cse-search-box">'
        +'<input name="cx" value="partner-pub-3727475938645712:xq6206-4diq" type="hidden">'
        +'<input name="q" size="41" type="text">'
        +'<input name="sa" value="Suche" type="submit"></form></div></center>'
    ;
    
    document.getElementsByClassName('nav')[0].innerHTML = 
    document.getElementsByClassName('nav')[0].innerHTML.replace(
            /(\r\n|\n|\r)/gm,''
        ).replace(
            /^.*?<hr>.+?]/gi,''    
        ).replace(
            /[&nbsp;/gi,''    
        ).replace(
            /&nbsp;]/gi,''    
        ).replace(
            /<div[^>]*>(.*?)<\/div>/gi,'$1'
        ).replace(
            /<\/a>[^<]*<a/gi,'</a> | <a'
        ).replace(
            />Logout.*?</gi,'>Logout<'
        )
    ;
    


  • junta schrieb:

    Sone schrieb:

    Ich werde vielleicht mal ins Webforum schreiben.

    Lieber nicht, der CODE ist grottig!

    Meinst du meinen Code, oder das HTML von Forum? Bei letzterem trifft das AFAIK gut zu.
    Auch bei meinem... 🤡

    getElementsByClassName('nav')

    Oh, solche Funktionen kannte ich gar nicht. Ich habe mir JavaScript vor ein paar Tagen beigebracht...



  • Nimm jQuery - ist viel einfacher als xPath.

    Unsere Greasemonkey Scripte die wir bauen sind alle mit jQuery. xPath ist einfach ne katastrophe von der Syntax her, da sind die CSS Selectoren die jQuery verwendet einfach besser. Und jQuery hat halt auch sonst noch einige netten Features.



  • @Shade bezahlen die dich dafür?



  • Ich hätte übrigens ein wenig Kritik an dem Code gern. Ich will doch lernen :p



  • Sone schrieb:

    Ich hätte übrigens ein wenig Kritik an dem Code gern.

    Kritik: Das ist Javascript. Kritik Ende



  • Nathan schrieb:

    Sone schrieb:

    Ich hätte übrigens ein wenig Kritik an dem Code gern.

    Kritik: Das ist Javascript. Kritik Ende

    Ernst gemeinte, sollte man noch hinzufügen.

    Denn GreaseMonkey akzeptiert AFAICS nur JavaScript.



  • Shade Of Mine schrieb:

    Nimm jQuery - ist viel einfacher als xPath.

    Das löst nicht das Problem, dass die Google-Suchbox auf Firefox nicht funkt.



  • Sone schrieb:

    Nathan schrieb:

    Sone schrieb:

    Ich hätte übrigens ein wenig Kritik an dem Code gern.

    Kritik: Das ist Javascript. Kritik Ende

    Ernst gemeinte, sollte man noch hinzufügen.

    War ernst gemeint.



  • Sone schrieb:

    Shade Of Mine schrieb:

    Nimm jQuery - ist viel einfacher als xPath.

    Das löst nicht das Problem, dass die Google-Suchbox auf Firefox nicht funkt.

    Moeglicherweise schon 😉

    deshalb verwendet man Libraries damit man diese Probleme nicht hat. Es ist wie in C++, wenn du immer dein memcpy selber schreibst, dann beisst es sich irgendwann irgendwo - wenn du aber immer schoen brav copy() verwendest, dann beisst es sich nirgends.

    Browser sind da noch schlimmer. innerHTML hat zB einige Probleme mit unterschiedlichen Browsern. Da gibt es viel zu beachten. Frueher musste man das alles wissen. Heute zum Glueck nicht mehr - aber alle grossen JavaScript Frameworks haben unglaublich viele Zeilen Code workarounds fuer unterschiedliche JavaScript Implementationen drin.

    Deshalb lachen hier einige schon wenn ich mir den Mund fusslig rede - aber heute benutzt man jQuery - das loest diese ganzen Probleme. Es gibt nur einen Grund warum man jQuery nicht verwendet: wenn man ein komplexes MVC-System wie zB angular, backbone, etc verwendet (und selbst dann verwenden noch genug Leute jQuery).

    Seriously, es lohnt sich nichtmal den Code anzusehen. Es kann natuerlich auch nicht an innerHTML liegen, es kann eine million Sachen sein - aber stell dir das ganze mal in C++ vor:

    Jemand hat sein eigenes printf() geschrieben und dann funktioniert bei einem bestimmten Compiler etwas bei der evaluierung der format specifier nicht. Dann ist die erste antwort: benutze printf und baue nix nach wenn du dich nicht auskennst.

    Und das ist die selbe Aussage die ich hier taetige.

    PS:
    ein weiterer Grund warum ich bei diesen Themen immer jQuery erwaehne ist, dass ich noch keinen aktzeptablen JavaScript Code hier im Forum gesehen habe. Nicht ein einziges mal. Das JavaScript dass hier gepostet wird sieht aus wie von vor 10 Jahren.

    Und wir alle wissen wie C++ von vor 20 Jahren ausgesehen hat - und das war zum gruseln. Und so geht es mir mit dem JS hier 😉


Anmelden zum Antworten