SPH-GUI --> Anpassung per Chrome-User-Script

      SPH-GUI --> Anpassung per Chrome-User-Script

      Moin Leutz!

      Hatte mir immer mal überlegt, das ein Chrome-User-Script im Zusammenhang mit der SPH-GUI nützlich sein könnte - aber ich mag halt JavaScript nicht wirklich... ;)

      Jetzt schrieb allerdings @xdjbx in einem anderen Thread, er hätte sich per 'Schreibzugriff auf rootfs' das Handbuch in der GUI durch das Engineer-Menü ersetzt...
      Eigentlich eine gute Idee - aber in meinen Augen so nicht unbedingt nötig - und da sind wir wieder bei den User-Scripts ;)

      In Chrome sind diese seit einer Weile eingebaut - für Firefox gibt's Plugins (GreaseMonkey zB.)
      Die Idee ist simple: ein Script wird abhängig von der angezeigten Web-Seite ausgeführt. Nimmt man nun ein Script, welches den Handbuch-Link durch einen Engineer-Link ersetzt - aber nur auf den internen Seiten der GUI - dann hat man die selbe Funktionalität, aber ohne die Frimware verändern zu müssen.
      Beschränkt man das Script auf die internen Seiten der GUI, bleibt auf der Login-Seite und im Engineer-Menu der Link auf das Handbuch erhalten.

      Einziger Nachteil: das Script muß eben installiert sein, damit das klappt - andere Clients sehen die unveränderte GUI.

      Hier aber mal das Script (einfach in eine Datei 'spheng.user.js' kopieren)

      Quellcode

      1. // ==UserScript==
      2. // @name spheng
      3. // @description enable engineer-menu in SPH-GUI
      4. // @match http://speedport.ip/html/content/*
      5. // @version 1.0
      6. // ==/UserScript==
      8. var ml=document.getElementById("mn_07");
      9. ml.href="../../../engineer/html/dsl.html?lang=de";
      10. ml.innerHTML="<img src=\"../../../images/icons/manual_30x30.png\" width=\"30\" height=\"30\" alt=\"Engineer-Menu\"><span>Engineer-Menu</span>";

      solche user.js-Dateien kann man beim Chrome einfach auf die Erweiterungs-Seite ziehen, um sie zu installieren.
      Die match-Zeile bestimmt, wann sie gilt (nutzt ihr eine IP statt speedport.ip müsstet ihr anpassen) - der Rest passt den Link an.

      Ich könnt' mir vorstellen, daß im Zusammenhang mit der SPH-GUI durchaus noch andere Möglichkeiten bestehen. (So gibt es ja scheinbar einen Parameter, welcher bestimmt, ob man die normale oder die Admin-Ansicht der GUI zu sehen bekommt...)

      Ich selbst bin, wenn's um JS geht, leider etwas eingerostet (meine Stärken liegen woanders ;) )

      mfg, emkay

      ich nochmal... ;)

      Hab' nochmal überarbeitet:

      Quellcode

      1. // ==UserScript==
      2. // @name spheng
      3. // @description enable engineer-menu in SPH-GUI
      4. // @match http://speedport.ip/*
      5. // @match http://192.168.2.1/*
      6. // @version 1.0
      7. // ==/UserScript==
      9. var u=window.location.href;
      11. if(u.indexOf("/html/content/")>-1)
      12. {
      13. var ml=document.getElementById("mn_07");
      14. ml.href="../../../engineer/html/dsl.html?lang=de";
      15. ml.innerHTML="<img src=\"../../../images/icons/manual_30x30.png\" width=\"30\" height=\"30\" alt=\"Engineer-Menu\"><span>Engineer-Menu</span>";
      16. }
      18. /*
      19. if(u.indexOf("/engineer/html/routing.html?lang=de")>-1)
      20. {
      21. function ol(){
      22. document.getElementById("setrouting").style.display="initial";
      23. document.getElementById("addTr").style.display="initial";
      24. document.getElementById("stitle").style.display="initial";
      25. document.getElementById("id_remove").style.display="initial";
      26. document.getElementsByName("flush")[0].style.display="initial";
      27. document.getElementsByName("action")[0].style.display="initial";
      28. }
      29. document.body.addEventListener("mousemove",ol);
      30. ol();
      31. }
      32. */

      Habe eine zweite match-Zeile eingefügt, damit das Script auf Name und IP (gegebenenfalls anpassen) des Routers reagiert. Außerdem reagiert es jetzt auf die Basis-Url des Routers - die restliche Url wird erst im Code überprüft.

      Das hat den Vorteil, daß man nun für jede Unterseite der GUI eigene(n) Regeln/Code definieren kann. Im obigen Beispiel ist der erste IF-Block für das Engineer-Menü statt Handbuch zuständig. Der zweite (auskommentierte) Block blendet auf der Routing-Seite die versteckten Einträge ein. (ist auskommentiert, weil er nicht ganz funktioniert - die Remove-Buttons fehlen...) Die Anbindung an das Mouse-Move-Event ist ein Hack um die Ausführung hinter den Router-Code zu verzögern.

      Ich glaub' da geht noch was - zumindest, wenn man besser ist in JS, als ich ;)

      mfg, emkay