Weboberfläche per Greasemonkey manipulieren

[ste101]

Hallo,

mit dem Firefox-Addon Greasemonkey kann man HTML-Seiten client-seitig manipulieren. Sollte auch im Chrome funktionieren.
Damit könnte es möglich sein, fehlende Funktionen der WebGUI einzubauen, ohne jedes mal die Änderungen per Hand erledigen zu müssen.

Viel habe ich noch nicht gemacht.

In dem kleinen Beispiel wird der Link zur DNS-Einstellung aus der Anleitung "SIP einrichten " unterhalb von "MyFritz!" angezeigt.
jQuery ist für dieses Beispiel noch nicht nötig, habe es nur mal eingebaut falls es doch noch benötigt wird.

Code: Alles auswählen

// ==UserScript==
// @name        Fritzbox
// @namespace   URI
// @include     http://fritz.box/*
// @include     http://www.fritz.box/*
// @grant       
// @require     http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js
// @version     1
// ==/UserScript==


jQuery.noConflict();
jQuery(document).ready(function(){
  var logo = document.createElement("div");
  logo.innerHTML = '<a href="/internet/dns_server_enh.lua">DNS</a>';
  var node = document.getElementById('menucontent');
  //var node = document.getElementsByClassName('LMenu');
  node.appendChild(logo);
});	

Grüße

Stephan

[Kunterbunter]

Hast du zufällig die drei Threads gesehen, die hier als HOWTO direkt über deinem Beitrag ganz oben angepinnt sind?

[ste101]

Habe ich zum Teil. Was hat das aber mit Greasemonkey zu tun?

Grüße

Stephan

[Kunterbunter]

Was hat das aber mit Greasemonkey zu tun?

Nichts. Es geht eben auch ohne: http://fritz.box/internet/dns_server_enh.lua

[legolas]

@Kunterbunter:

Du könntest das hier überlesen haben:

Damit könnte es möglich sein, fehlende Funktionen der WebGUI einzubauen, ohne jedes mal die Änderungen per Hand erledigen zu müssen.

Wenn das gelingt, zeigt der Browser automatisch, unter Verwendung von Greasemonkey & dem Script, immer alle Optionen an !

[Kunterbunter]

Ja, das stimmt. Das lohnt sich also, wenn man häufig solche Änderungen macht.

[ste101]

Hiermit wird unter 'Internet' 'DNS-Server' und 'LAN-Bridge' und unter 'Telefonie' 'Wahlregeln' angezeigt.

Code: Alles auswählen

// ==UserScript==
// @name        Fritzbox
// @namespace   URI
// @include     http://fritz.box/*
// @include     http://www.fritz.box/*
// @grant       
// @require     http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js
// @version     1
// ==/UserScript==


jQuery.noConflict();
jQuery(document).ready(function(){

  menuElements = jQuery('#menucontent > div > ul > li');
  
  if ( menuElements[1].className.match('selected') ) { // Internet
    // DNS-Server
    jQuery('#menucontent > div > ul > .selected.submenu ul').append('<li class="LSubitem"><a href="javascript:jslGoTo(\'internet\',\'dns_server_enh\')">DNS-Server</a><span class="PTextOnly">DNS-Server</span></li>');
    // LAN-Bridge
    jQuery('#menucontent > div > ul > .selected.submenu ul').append('<li class="LSubitem"><a href="javascript:jslGoTo(\'internet\',\'cable_bridge\')">LAN-Bridge</a><span class="PTextOnly">LAN-Bridge</span></li>');
  }
  if ( menuElements[2].className.match('selected') ) { // Telefonie
    // Wahlregeln
    jQuery('#menucontent > div > ul > .selected.submenu ul').append('<li class="LSubitem"><a href="javascript:jslGoTo(\'fon\',\'routing\')">Wahlregeln</a><span class="PTextOnly">Wahlregeln</span></li>');
  }
});	

Seltsam ist, dass der Browser den Link 'Eigene Rufnummern' entweder als 'http://fritz.box/fon_num/fon_num_list.lua?sid=' oder als 'javascript:jslGoTo('fon','siplist')' anzeigt. Dadurch wird der Link 'Wahlregeln' nicht immer richtig angezeigt.
Ich habe nur Zugriff auf eine 7170. Daher weis ich nicht, was sonst noch fehlt und wie die HTML-Codes aussehen.
Vielleicht kann hier jemand anderes weiter helfen.

Grüße

Stephan

[ste101]

Link zu 'Wahlregeln' wird jetzt immer richtig angezeigt:

Code: Alles auswählen

// ==UserScript==
// @name        Fritzbox
// @namespace   URI
// @include     http://fritz.box/*
// @include     http://www.fritz.box/*
// @grant       
// @require     http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js
// @version     1
// ==/UserScript==


jQuery.noConflict();
jQuery(document).ready(function(){

  menuElements = jQuery('#menucontent > div > ul > li');
  
  if ( menuElements[1].className.match('selected') ) { // Internet
    // DNS-Server
    jQuery('#menucontent > div > ul > .selected.submenu ul').append('<li class="LSubitem"><a href="javascript:jslGoTo(\'internet\',\'dns_server_enh\')">DNS-Server</a><span class="PTextOnly">DNS-Server</span></li>');
    // LAN-Bridge
    jQuery('#menucontent > div > ul > .selected.submenu ul').append('<li class="LSubitem"><a href="javascript:jslGoTo(\'internet\',\'cable_bridge\')">LAN-Bridge</a><span class="PTextOnly">LAN-Bridge</span></li>');
  }
  if ( menuElements[2].className.match('selected') ) { // Telefonie
    menuElementsTelefonie = jQuery('#menucontent > div > ul > .selected > ul > li');
    var sid = jQuery.getUrlVar('sid');
    var url = window.location.href.substring( 0, window.location.href.indexOf('?'));

    // Wahlregeln
    if ( menuElementsTelefonie[3].className.match('selected') || menuElementsTelefonie[6].className.match('selected') ) {
      jQuery('#menucontent > div > ul > .selected ul').append('<li><a href="http://fritz.box/cgi-bin/webcm?getpage=../html/de/menus/menu2.html&var:menu=fon&var:pagename=routing&sid=' + sid +'">Wahlregeln</a></li>');
    }
    else {
      jQuery('#menucontent > div > ul > .selected ul').append('<li class="LSubitem"><a href="javascript:jslGoTo(\'fon\',\'routing\')">Wahlregeln</a><span class="PTextOnly">Wahlregeln</span></li>');
    }
    
    if (url == 'http://fritz.box/cgi-bin/webcm' && (jQuery.getUrlVar('var%3Apagename') == 'routing' || jQuery.getUrlVar('var:pagename') == 'routing')) {
      jQuery('#menucontent > div > ul > .selected > ul > li').last().attr('class', 'selected' );
    }
  }
});

jQuery.extend({
  getUrlVars: function(){
    var vars = [], hash;
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
    for(var i = 0; i < hashes.length; i++)
    {
      hash = hashes[i].split('=');
      vars.push(hash[0]);
      vars[hash[0]] = hash[1];
    }
    return vars;
  },
  getUrlVar: function(name){
    return jQuery.getUrlVars()[name];
  }
});

[ste101]

Eigene Rufnummern - "Neue Rufnummer" und "Anschlusseinstellungen" nach Reboot automatisch freischalten.
Delete-Buttons werden freigeschaltet

Code: Alles auswählen

// ==UserScript==
// @name        Fritzbox
// @namespace   URI
// @include     http://fritz.box/*
// @include     http://www.fritz.box/*
// @grant       GM_addStyle
// @require     http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js
// @version     1
// ==/UserScript==

GM_addStyle("#uiSipping {display: block !important;}");

jQuery.noConflict();
jQuery(document).ready(function(){

  var javascriptLink = 0;

  // Liste Hauptmenüpunkte
  menuElements = jQuery('#menucontent > div > ul > li');
  
  // Unterscheidung zwischen http-Link und javascript-Link
  if (jQuery('#menucontent > div > ul').hasClass('LMenu')) {
    javascriptLink = 1;
  }

  menuElementsSubmenu = jQuery('#menucontent > div > ul > .selected > ul > li');
  var sid = jQuery.getUrlVar('sid');
  var url = window.location.href.substring( 0, window.location.href.indexOf('?'));
  
  if ( menuElements[1].className.match('selected') ) { // Internet
    // DNS-Server
    jQuery('#menucontent > div > ul > .selected.submenu ul').append('<li class="LSubitem"><a href="javascript:jslGoTo(\'internet\',\'dns_server_enh\')">DNS-Server</a><span class="PTextOnly">DNS-Server</span></li>');
    // LAN-Bridge
    jQuery('#menucontent > div > ul > .selected.submenu ul').append('<li class="LSubitem"><a href="javascript:jslGoTo(\'internet\',\'cable_bridge\')">LAN-Bridge</a><span class="PTextOnly">LAN-Bridge</span></li>');
  }
  if ( menuElements[2].className.match('selected') ) { // Telefonie
    // Wahlregeln anzeigen
    if ( javascriptLink == 0 ) {
      jQuery('#menucontent > div > ul > .selected ul').append('<li><a href="http://fritz.box/cgi-bin/webcm?getpage=../html/de/menus/menu2.html&var:menu=fon&var:pagename=routing&sid=' + sid +'">Wahlregeln</a></li>');
    }
    else {
      jQuery('#menucontent > div > ul > .selected ul').append('<li class="LSubitem"><a href="javascript:jslGoTo(\'fon\',\'routing\')">Wahlregeln</a><span class="PTextOnly">Wahlregeln</span></li>');
    }
    // Wahlregeln aktiv?
    if (url == 'http://fritz.box/cgi-bin/webcm' && (jQuery.getUrlVar('var%3Apagename') == 'routing' || jQuery.getUrlVar('var:pagename') == 'routing')) {
      jQuery('#menucontent > div > ul > .selected > ul > li').last().attr('class', 'selected' );
    }

    // Eigene Rufnummern - "Neue Rufnummer" und "Anschlusseinstellungen" nach Reboot automatisch freischalten
    if ( menuElementsSubmenu[6].className.match('selected') ) { 
      if ( !jQuery("#btnNewNum").length > 0 ) {
        jQuery('#main_form').append('<button style="display: none" id="gui_readonly" class="icon" title="Bearbeiten" value="0" name="sipextra:settings/gui_readonly" type="submit"><img alt="Bearbeiten" src="/css/default/images/bearbeiten.gif"></button>');
        jQuery("#gui_readonly").click();
      }
      //jQuery('#main_form').append('<button id="gui_readonly1" class="icon" title="Bearbeiten" value="1" name="sipextra:settings/gui_readonly" type="submit"><img alt="Bearbeiten" src="/css/default/images/bearbeiten.gif"></button>');
       
      // Delete-Buttons freischalten
      deleteButtons = jQuery('#uiViewFonNumTable button');
      var i;
      for ( i=1; i<deleteButtons.length; i+=2) {
        deleteButtons[i].disabled=false;
      }

    }
    
  }
});

jQuery.extend({
  getUrlVars: function(){
    var vars = [], hash;
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
    for(var i = 0; i < hashes.length; i++)
    {
      hash = hashes[i].split('=');
      vars.push(hash[0]);
      vars[hash[0]] = hash[1];
    }
    return vars;
  },
  getUrlVar: function(name){
    return jQuery.getUrlVars()[name];
  }
});

[legolas]

Vielen Dank für deine Arbeit !