Anpassung der Oberfläche an eigene Bedürfnisse

FaeRhan

Neuer User
Mitglied seit
26 Feb 2007
Beiträge
25
Punkte für Reaktionen
0
Punkte
0
Hallo,

Ich will hier einfach mal einige kleine kosmetischen Änderungen an der Oberfläche der Speedbox W 900V von mir aufschreiben. Ich wollte das schon viel früher machen (siehe hier), bin aber leider nicht dazu gekommen. Jetzt wo ich mich aber von der Firmware auf den neusten Stand gebracht habe, habe ich das gleich dazu genutzt um meine Änderungen mitzuloggen.

Erstellt habe ich mir zuerst ein Image mit der Freetz-Trunk-Version 2369 und dem Fritzbox 7170 Labor-Gaming-Image 29.04.93-11435. Dieses Image habe ich dann als erste Source-Datei für SP2Fritz vom 16.06.08 genutzt. Als zweite Source habe ich das DSL-Labor-Image 29.04.99-11500 und das neuste 34.04.57-Image als T-Com-Source genommen. In den Einstellungen habe ich dann noch ausgewählt, dass der DSL-Treiber aus der DSL-Labor genommen werden soll. Alle folgenden Änderungen habe im folgenden Ordner gemacht:

Code:
FBDIR/squashfs-root/usr/www/--oem--/html/de

Ich mache die Änderungen, sobald das Skript das erste mal stehen bleibt und auf ein Enter wartet.



Gemacht habe ich folgende Änderungen:

- Umbiegen des Einstellungen-Links von den Assistenten auf die Erweiterten Einstellungen
- Einfügen des versteckten Support-Links ins Menü
- Einsetzen eines funktionierenden Download-Links für den USB-Fernanschluss
- Den Punkt Programme auf die Downloads für die Fritzbox 7170 gesetzt
- Einfügen der DSL-Seiten aus der DSL-Labor mit einem Bugfix auf der Statistikseite
- Einen eigenen Header und Mod-Info-Button erstellt

Für andere Speedports und ohne Freetz sollten die Änderungen ähnlich bis gleich gehen.



Hinweis: Seit dem 19.07.08 sind alle meine Änderungen ins Skript eingegangen.



1. Die Menüänderungen:

Da ich eigentlich nie die Assistenten nutze, habe ich mir den Einstellungen-Link gleich auf die Erweiterten Einstellungen umgebogen. Dazu habe ich in der Datei menus/menu2.html die Zeile

Code:
<a href="javascript:OnSetting()">

ersetzt durch

Code:
<a href="javascript:jslGoTo('enhsettings','enhsettings')">



Ich bin kein Freund von versteckten Seiten. Es gibt eine Support-Seite, die aber nirgendwo verlinkt ist. Das habe ich in den Dateien menu2_konfig.html und menu2_homehome.html im Ordner menus verbessert. Dazu habe ich erstmal in menu2_homehome.html

Code:
<li class="<? echo $var:classname ?>"><img class="LMenuPfeil" src="<? echo $var:aktivpfeil ?>"><a href="javascript:jslGoTo('home','energy')"><? echo `$var:TextEnergyMonitor` ?></a><span class="PTextOnly"><? echo `$var:TextEnergyMonitor` ?></span></li>
<li class="LMenuitemTop" style="margin-top:24px"><img src="<? echo $var:pfeil ?>"> <a href="/cgi-bin/freetz_status" target="_blank"><? echo $var:menuFreetz ?></a></li>
<li class="LMenuitemTop"><img src="<? echo $var:pfeil ?>"> <a href="/cgi-bin/freetz_wol" target="_blank"><? echo $var:menuFreetzWOL ?></a></li>
<li class="LMenubottom">&nbsp;</li>
</ul>

durch das hier

Code:
<li class="<? echo $var:classname ?>"><img class="LMenuPfeil" src="<? echo $var:aktivpfeil ?>"><a href="javascript:jslGoTo('home','energy')"><? echo `$var:TextEnergyMonitor` ?></a><span class="PTextOnly"><? echo `$var:TextEnergyMonitor` ?></span></li>
<li class="LMenuitemTop"><img src="<? echo $var:pfeil ?>"> <a href="../html/support.html" target="_blank">Support</a></li>
<li class="LMenuitemTop"><img src="<? echo $var:pfeil ?>"> <a href="/cgi-bin/freetz_status" target="_blank"><? echo $var:menuFreetz ?></a></li>
<li class="LMenuitemTop"><img src="<? echo $var:pfeil ?>"> <a href="/cgi-bin/freetz_wol" target="_blank"><? echo $var:menuFreetzWOL ?></a></li>
<li class="LMenubottom">&nbsp;</li>
</ul>

und in der menu2_konfig.html

Code:
<li class="LMenuitemaktivTop"><img class="LMenuPfeil" src="<? echo `$var:aktivpfeil` ?>"><a href="javascript:jslGoTo('software','extern')"><? echo '$var:TextMenuSoftware' ?></a><span class="PTextOnly"><? echo '$var:TextMenuSoftware' ?></span></li>

` ?>
` ?>
<li class="LMenuitemTop" style="margin-top:24px"><img src="<? echo $var:pfeil ?>"> <a href="/cgi-bin/freetz_status" target="_blank"><? echo $var:menuFreetz ?></a></li>
<li class="LMenuitemTop"><img src="<? echo $var:pfeil ?>"> <a href="/cgi-bin/freetz_wol" target="_blank"><? echo $var:menuFreetzWOL ?></a></li>
<li class="LMenubottom">&nbsp;</li>
</ul>

durch folgendes ersetzt:

Code:
<li class="LMenuitemaktivTop"><img class="LMenuPfeil" src="<? echo `$var:aktivpfeil` ?>"><a href="javascript:jslGoTo('software','extern')"><? echo '$var:TextMenuSoftware' ?></a><span class="PTextOnly"><? echo '$var:TextMenuSoftware' ?></span></li>
` ?>
` ?>
<li class="LMenuitemTop"><img src="<? echo $var:pfeil ?>"> <a href="../html/support.html" target="_blank">Support</a></li>
<li class="LMenuitemTop"><img src="<? echo $var:pfeil ?>"> <a href="/cgi-bin/freetz_status" target="_blank"><? echo $var:menuFreetz ?></a></li>
<li class="LMenuitemTop"><img src="<? echo $var:pfeil ?>"> <a href="/cgi-bin/freetz_wol" target="_blank"><? echo $var:menuFreetzWOL ?></a></li>
<li class="LMenubottom">&nbsp;</li>
</ul>

Wo der Link in eine Firmware ohne Freetz hin muss sollte durch etwas hingucken erkennbar sein.



2. Programmlinks:

Immer wenn man auf einen Programmlink klickt, steht da, dass der Download für diese Fritzbox nicht zur Verfügung steht. Die erste Stelle ist unter Einstellungen -> Erweiterte Einstellungen -> USB-Geräte -> USB-Fernanschluss. Ich habe dazu den Link durch einen direkten Download-Link ersetzt und dazu in der Datei usb/aura.html die Zeile

Code:
<li><? echo $var:TextInstallationErforderlich ?><a href="javascript:ShowPopup()" id="auraLink" title="Klicken Sie hier, um die Installation des USB-Fernanschluss Programms zu starten"><? echo $var:TextProgramm ?></a><? echo $var:TextPunkt ?></li>

in diese umgeändert:

Code:
<li><? echo $var:TextInstallationErforderlich ?><a href="http://clickonce.avm.de/usb-fernanschluss/deutsch/fritzbox-usb-fernanschluss.exe" id="auraLink" title="Klicken Sie hier, um die Installation des USB-Fernanschluss Programms zu starten"><? echo $var:TextProgramm ?></a><? echo $var:TextPunkt ?></li>



Die zweite problematische Stelle ist unter Einstellungen -> Programme. Hier habe ich eine Zeile in software/extern.js geändert:

Code:
return "<iframe src=\""+DownloadUrl(kontext)+"\" name=\"software\""+wStr+"height=\"500\" frameborder=\"0\" style=\"overflow: auto;\">";

wird zu

Code:
return "<iframe src=\"http://webgw.avm.de/download/Download.jsp?lang=de&product=FRITZ!Box%20Fon%20WLAN%207170&os=winxp\" name=\"software\""+wStr+"height=\"500\" frameborder=\"0\" style=\"overflow: auto;\">";

Hier hat man nun Downloadlinks zur aktuellen Fritzbox 7170 Firmware, zur Fritz-DSL-Software und durch einen Klick ganz unten rechts auf "Weitere Downloads" auf einige weitere Programme.



3. DSL-Seiten

Speedport2Fritz hat zwar eine Option die DSL-Seiten aus der DSL-Labor in das Image reinzukopieren. Wenn man sich aber eh durch die ganzen Dateien wuselt und sie schon früher manuell rüberkopiert hat, kann man sie aus Gewohnheit jetzt immernoch manuell rüberkopieren ;-)

Dazu nehme ich aus dem Ordner FBDIR2/squashfs-root/usr/www/avm/html/de/internet die Dateien (adsl|atm|bits|labor_dsl|overview).(frm|html|inc|js) und kopiert sie in den entsprechenden Ordner in FBDIR.

Leider habe ich gemerkt, dass die DSL-Labor 11500 einen Bug auf der Statistik-Seite hat. Der macht sich sofern bemerkbar, dass ein CRC-Fehler-Balken erst angezeigt wird, wenn der FEC-Fehler-Balken nicht auf 0 ist und anders herum. Außerdem fehlt in der Gaming-Labor noch eine Bilddatei. Deshalb muss aus dem Ordner images in FBDIR2 die Datei balkeneinheit24-blau.gif in den entsprechenden Ordner in FBDIR rüberkopiert werden. Außerdem muss die Datei internet/atm.js bearbeitet werden:

Code:
if( (k == 0) && (hCRC!=0) && (hFEC!=0))
{
if (navigator.appName == "Microsoft Internet Explorer")
sTd += "<div style=\"height:"+hCRC + "px; padding-top:" + (hBalken-hCRC+1) +"px\">";
else
sTd += "<div style=\"height:"+hCRC + "px; padding-top:" + (hBalken-hCRC) +"px\">";
sTd += "<img src='../html/<? echo $var:lang ?>/images/balkeneinheit24.gif' width=\"15px\" height=\""+hCRC+"px\" style=\"position:absolute;display:block;\" title=\""+volumeCRC[k]+" " + nameCRC +"\" >";
sTd += "<img src='../html/<? echo $var:lang ?>/images/balkeneinheit24-blau.gif' width=\"7px\" height=\""+hFEC+"px\" style=\"position:relative; top:" + (hCRC-hFEC) +"px;left:4px; \" title=\""+volumeFEC[k]+" " + nameFEC +"\" >";
sTd += "</div>";
} else {
if( hCRC != 0 && hFEC!=0)
{
if (navigator.appName == "Microsoft Internet Explorer")
sTd += "<div style=\"height:"+hCRC + "px; padding-top:" + (hBalken-hCRC+1) +"px\">";
else
sTd += "<div style=\"height:"+hCRC + "px; padding-top:" + (hBalken-hCRC) +"px\">";
sTd += "<img src='../html/<? echo $var:lang ?>/images/balkeneinheit24.gif' width=\"15px\" height=\""+hCRC+"px\" style=\"position:absolute;display:block;\" title=\""+volumeCRC[k]+" " + nameCRC +"\" >";
sTd += "<img src='../html/<? echo $var:lang ?>/images/balkeneinheit24-blau.gif' width=\"7px\" height=\""+hFEC+"px\" style=\"position:relative; top:" + (hCRC-hFEC) +"px;left:4px; \" title=\""+volumeFEC[k]+" " + nameFEC +"\" >";
sTd += "</div>";
}
}
wird ersetzt durch

Code:
if( (k == 0) && ((hCRC!=0) || (hFEC!=0)))
{
if (navigator.appName == "Microsoft Internet Explorer")
sTd += "<div style=\"height:"+hCRC + "px; padding-top:" + (hBalken-hCRC+1) +"px\">";
else
sTd += "<div style=\"height:"+hCRC + "px; padding-top:" + (hBalken-hCRC) +"px\">";
if (hCRC!=0) sTd += "<img src='../html/<? echo $var:lang ?>/images/balkeneinheit24.gif' width=\"15px\" height=\""+hCRC+"px\" style=\"position:absolute;display:block;\" title=\""+volumeCRC[k]+" " + nameCRC +"\" >";
if (hFEC!=0) sTd += "<img src='../html/<? echo $var:lang ?>/images/balkeneinheit24-blau.gif' width=\"7px\" height=\""+hFEC+"px\" style=\"position:relative; top:" + (hCRC-hFEC) +"px;left:4px; \" title=\""+volumeFEC[k]+" " + nameFEC +"\" >";
sTd += "</div>";
} else {
if( hCRC != 0 || hFEC!=0)
{
if (navigator.appName == "Microsoft Internet Explorer")
sTd += "<div style=\"height:"+hCRC + "px; padding-top:" + (hBalken-hCRC+1) +"px\">";
else
sTd += "<div style=\"height:"+hCRC + "px; padding-top:" + (hBalken-hCRC) +"px\">";
if (hCRC!=0) sTd += "<img src='../html/<? echo $var:lang ?>/images/balkeneinheit24.gif' width=\"15px\" height=\""+hCRC+"px\" style=\"position:absolute;display:block;\" title=\""+volumeCRC[k]+" " + nameCRC +"\" >";
if (hFEC!=0) sTd += "<img src='../html/<? echo $var:lang ?>/images/balkeneinheit24-blau.gif' width=\"7px\" height=\""+hFEC+"px\" style=\"position:relative; top:" + (hCRC-hFEC) +"px;left:4px; \" title=\""+volumeFEC[k]+" " + nameFEC +"\" >";
sTd += "</div>";
}
}

Damit sollte der Fehler von AVM weg sein.



4. Aussehen:

Ich habe mir einen neuen Header erstellt, der so nah wie möglich am Original sein soll. Da die Bilder beim Anhängen automatisch in jpeg-Dateien umgewandelt werden, habe ich sie nochmal gezippt als header.zip angehängt. Als Mod-Info-Button gibt es bei mir ein kleines i-Symbol. Alternativ habe ich noch ein zweites Bild in dem man als Hintergrund das Favicon vom IP-Phone-Forum hat. Die Bilder kann man in Speedport2Fritz in den Ordner alien/patches reinkopieren.

Dass der rechte Rand in den Screenshots nicht gerade ist, liegt nicht an den Änderungen, sondern am Verkleinern der Seite in Firefox mit der Erweiterung No Squint, damit ich nicht den horizontalen Scrollbalken habe.



Das währe mein W900V-Image mit Freetz, den Gaming- und DSL-Labor-Einstellungen und den oberen Änderungen. Ich hoffe, dass ich damit einige inspirieren konnte und hoffe, dass weitere Ideen von mir oder anderen ;-) dazukommen.

Gruß FaeRhan
 

Anhänge

  • help1.gif
    help1.gif
    913 Bytes · Aufrufe: 189
  • help1_ippf.gif
    help1_ippf.gif
    978 Bytes · Aufrufe: 189
  • speedbox.jpg
    speedbox.jpg
    123.6 KB · Aufrufe: 78
  • statistik.jpg
    statistik.jpg
    103.1 KB · Aufrufe: 62
  • programme.jpg
    programme.jpg
    137.7 KB · Aufrufe: 60
  • support.jpg
    support.jpg
    71.9 KB · Aufrufe: 52
  • fernanschluss.jpg
    fernanschluss.jpg
    130.5 KB · Aufrufe: 64
  • fw_header980.jpg
    fw_header980.jpg
    23.7 KB · Aufrufe: 36
  • fw_header.jpg
    fw_header.jpg
    21.6 KB · Aufrufe: 36
  • header.zip
    25.6 KB · Aufrufe: 17
Zuletzt bearbeitet:
Holen Sie sich 3CX - völlig kostenlos!
Verbinden Sie Ihr Team und Ihre Kunden Telefonie Livechat Videokonferenzen

Gehostet oder selbst-verwaltet. Für bis zu 10 Nutzer dauerhaft kostenlos. Keine Kreditkartendetails erforderlich. Ohne Risiko testen.

3CX
Für diese E-Mail-Adresse besteht bereits ein 3CX-Konto. Sie werden zum Kundenportal weitergeleitet, wo Sie sich anmelden oder Ihr Passwort zurücksetzen können, falls Sie dieses vergessen haben.