Digital Eliteboard - Das Digitale Technik Forum

Registriere dich noch heute kostenloses um Mitglied zu werden! Sobald du angemeldet bist, kannst du auf unserer Seite aktiv teilnehmen, indem du deine eigenen Themen und Beiträge erstellst und dich über deinen eigenen Posteingang mit anderen Mitgliedern unterhalten kannst! Zudem bekommst du Zutritt zu Bereiche, welche für Gäste verwehrt bleiben

WebIF für iPhone-/iPod-Darstellung optimieren

Status
Für weitere Antworten geschlossen.

fidero85

Ist oft hier
Registriert
10. März 2011
Beiträge
157
Reaktionspunkte
50
Punkte
48
Ort
diesseits der Wohnungstüre
Aus guten Gründen gibt es ja im Gegensatz zu Android meines Wissens keine App für iOS zum Zugriff auf Oscam. Trotzdem hat man ja gelegentlich das Bedürfnis (ich zumindest :emoticon-0122-itwas) mal schnell von unterwegs auf die Client-Liste zu schauen ob alles rund läuft. Dabei störte mich bei der Darstellung des WebIf auf dem kleinen iPhone-Display die Informationsfülle und die Tatsache, dass durch Menü, Logfile, Thread-IDs, etc. die essenziellen Informationen (sprich die Client-Liste mit aktuell geschautem Programm und den ECM-Zeiten) nur sehr klein und durch viel Scrollen & Zoomen erreichbar sind. Es kam also die Frage auf, ob man das nicht selektiv für iPhone/iPod-Darstellung optimieren kann und nur auf großen Bildschirmen das WebIf weiter wie gewohnt anzeigen kann. Und - es geht relativ einfach. Vorab: So sieht es am Ende auf dem iPhone aus (sorry für die mittelmäßige Quali, aber man erkennt worum es geht ;-))

Bild ist nicht mehr aktiv.

Es werden also bei Aufruf des WebIf vom iPhone aus das Menü, Kopf-und Fußzeilen, die Logdatei sowie meiner Meinung nach entbehrliche Spalten aus den Tabellen ausgeblendet und automatisch so gezoomt, dass man auf einen Blick alles erkennen kann. Um das zu erreichen ist also eine Art Browserweiche notwendig, die via Stylesheetangaben die entsprechenden Formatierungen vornimmt sobald erkannt wird, dass das aufrufende Gerät ein iPhone/iPod ist.

Oscam ermöglicht es, ein automatisch eingebundenes JavaScript durch eine modifizierte Version zu ersetzen. Man sieht die Originaldatei wenn man die Adresse http://<oscam-webif-adresse>/oscam.js aufruft. Den Inhalt dieser Datei kopieren wir uns jetzt und erstellen (am einfachsten im Oscam-Konfigurationsverzeichnis, also da wo oscam.conf, etc. liegen) eine neue Datei namens custom.js. Dort fügen wir den gerade kopierten Inhalt ein und ergänzen um ein paar Stylesheet-Angaben zum Ausblenden irrelevanter Elemente. Bei mir sieht die Datei aktuell wie folgt (inkl. 'original' Oscam-Inhalten) aus:

Du musst dich Anmelden oder Registrieren um diesen Inhalt sichtbar zu machen!


Die ersten Zeilen entsprechen wie gesagt der JS-Datei, die mit Oscam mitgeliefert wurde (Die Funktionen sorgen dafür, dass die Scrollleistenposition vor demAutoRefresh gespeichert und danach wieder eingestellt wird, ist potenziell ganz nützlich). Die mit document.write beginnenden Zeilen sind der Patch und bewirken, dass für Devices, die maximal 480px breit sind (damit trifft man iPhone/iPod, etc.) zusätzliche Formatierungen gelten sollen. Dann werden der Reihe nach alle Elemente, die ich bei mobilem Zugriff nicht benötige, über display:none ausgeblendet.
Wer dabei andere Präferenzen als ich hat kann sich das auch ganz einfach beim Aufruf des WebIf über bspw. Chrome über die "Element untersuchen"-Funktion anpassen; hiermit lässt sich herausfinden, wie die einzelnen Elemente des WebIf heißen.

Die letzte Zeile sorgt auf dem Gerät dafür, dass die Zoom-Funktion beim Aufrufen der Seite bereits so eingestellt ist dass alles angezeigt wird. Man muss dann bei langer Client-Liste ggf. nur noch nach unten scrollen, horizontales Scrollen ist nicht mehr erforderlich (s. Beispielfoto oben).

Als letztes muss man Oscam nur noch mitteilen, dass es anstatt dem eingebauten JS das Modifizierte verwenden soll. Dazu fügen wir in die oscam.conf die Zeile

Du musst dich Anmelden oder Registrieren um diesen Inhalt sichtbar zu machen!
ein. Wenn euer Oscam-Konfigurationsverzeichnis also bspw. /etc/oscam/ ist und ihr die Datei wie vorgeschlagen dort erstellt habt wäre hier ein

Du musst dich Anmelden oder Registrieren um diesen Inhalt sichtbar zu machen!
einzusetzen.
Nach OSCAM-Neustart sollte nun die geänderte Datei eingebunden werden. Da man mit dem "normalen" Browser vom PC aus wie beschrieben keinen Unterschied sieht sollte man am besten kurz noch einmal http://<oscam-webif-adresse>/oscam.js (!, nicht /custom.css!) aufrufen und nachprüfen, ob die zusätzlichen document.write-Zeilen mit angezeigt werden. Wenn dem so ist sollte nur bei Aufruf via iPhone/iPod die angepasste Kurzdarstellung verwendet werden.
 
Status
Für weitere Antworten geschlossen.
Zurück
Oben