Zattoo Web Player

Dieser Artikel wurde für die folgenden Ubuntu-Versionen getestet:

Zum Verständnis dieses Artikels sind folgende Seiten hilfreich:

Inhaltsverzeichnis

Mit Prism

Der Zattoo Web Player {en} , der auf Flash basiert, soll in diesem Artikel für die Desktop-Nutzung optimiert werden.

Mit Prism¶

Installation von Prism¶

Zuerst muss Prism wie im dazugehörigen Artikel beschrieben installiert werden. Nun erstellt man über "Internet -> Prism" die Zattoo-Webanwendung^[1]. Hier müssen folgende Zeilen eingetragen werden:

Unter "Web Application":

URL:

http://zattoo.com/view/DasErste

Name:

Zattoo

Unter "Create Shortcuts": Hier sollte die Option "Desktop" aktiviert werden.

Optimierung¶

Um nun die Darstellung von möglicherweise störenden Elementen zu säubern, haben die User Roughtrade und Linux-Fan Skripte erstellt.

Hinweis:

Entwicklung, Instandhaltung und Bandbreite einer Webapplikation verursachen Kosten. Diese gedenkt Zattoo durch Werbeeinblendungen zu erwirtschaften. Wenn dem Benutzer etwas an der Fortführung des Services liegt, sollte in Erwägung gezogen werden, diese Bemühungen nicht zu behindern.

Deshalb blenden die folgenden "Optimierungen" das Werbefenster im Gegensatz zu vorhergehenden Versionen nicht mehr aus. Sollte dies auch in Anbetracht obiger Argumente dennoch gewünscht sein, so muss in der Zeile, die auf "@-moz-document url-prefix("http://zattoo.com/") {" folgt, in der durch Kommata getrennten Aufzählung "#tv-frame-ad-iframe" ergänzt werden.

Variante 1¶

Mit feststehender Seitenleiste, aber ohne ChannelsHeader. Man erstellt mit einem Editor die Datei ~/.webapps/zattoo.tv@prism.app/webapp.css und fügt Folgendes ein^[2]:

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("zattoo.com") {
#landing-video-content, #landing-ad-blocking-div, #companion {
 display: none !important;
}
#channels {
 height: 100% !important;
}
#mosaic-wrap {
 top: 0 !important;
}
}

@-moz-document url-prefix("http://zattoo.com/") {
#headerpane, #companion, #sidebaradpane, #channels-header, #title {
 display: none !important;
}

#zingspane {
 padding-top: -30px !important;
 margin-top: -30px !important;
 height: 100% !important;
}

#bodypane {
 top: 0 !important;
}

#body, #wrapper {
 top: 0 !important;
}

#mainpane {
 left: 300px !important;
}

.promo {
 display: none !important;
}

Vorher

Nachher

Variante 2¶

Mit flexibler Kopfleiste und Seitenleiste sowie ChannelsHeader. Man erstellt mit einem Editor die Datei ~/.webapps/zattoo.tv@prism.app/webapp.css und fügt Folgendes ein^[2]:

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("zattoo.com") {
#landing-video-content, #landing-ad-blocking-div {
 display: none !important;
}
#mosaic-wrap {
 top: 0 !important;
}
}

@-moz-document url-prefix("http://zattoo.com/") {
#companion, #title, #sidebaradpane, #channels-header {
 display: none !important;
}
#body, #wrapper {
 top: 0 !important;
}
#headerpane {
 z-index: 2 !important;
 position: absolute !important;
 width: 100% !important;
 background: #000 !important;
 top: -47px !important;
}
#headerpane:hover {
 top: 0 !important;
}
#channels {
 height: 100% !important;
}
#zingspane {
 z-index: 1 !important;
 left: -296px !important;
 background: #000 !important;
}
#zingspane:hover {
 left: 0 !important;
}
#controlpane {
 z-index: 99 !important;
 height: 90% !important;
 border-right: 8px solid #222 !important;
 -moz-border-radius-topright: 3px;
 -moz-border-radius-bottomright: 3px;
 border-top-right-radius: 3px;
 border-bottom-right-radius: 3px;
 left: -305px !important;
 background: #000 !important;
 }
#controlpane:hover {
 left: 0 !important;
 }
#mainpane {
 left: 0 !important;
 z-index: 0 !important;
}
.promo {
 display: none !important;
}
}

Variante 3¶

Mit einblendbarer Senderwahl, ansonsten reduziert auf das wesentliche (gültig ab Zattoo Layout vom 10.12.2012). Man erstellt mit einem Editor die Datei ~/.webapps/zattoo.tv@prism.app/webapp.css und fügt Folgendes ein^[2]:

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document url-prefix("http://zattoo.com/") {
	#header {
	top: 0 !important;
	height: 0 !important;
	}
	#headerpane {
	background: none !important;
	background-image: none !important;
	height: 22px !important;
	}
	#tabs #list_tabs {
	display: none !important;
	}
	#logo, #auxlinks span.tab,
	.listheader, .zapper_promo {
	display: none !important;
	}
	#identity, #main_tabs, #main_tabs li, #header a {
	color: #555 !important;
	}
	#main_tabs, #main_tabs li {
	background: none !important;
	background-image: none !important;
	border: 0 !important;
	top: 2px !important;
	}
	#main_tabs li a[href*="subscribe"] {
	display: none !important;
	}
	#controlpane {
	z-index: 99 !important;
	height: 100% !important;
	border-right: 8px solid #222 !important;
	-moz-border-radius-topright: 3px;
	-moz-border-radius-bottomright: 3px;
	border-top-right-radius: 3px;
	border-bottom-right-radius: 3px;
	left: -305px !important;
	background: #000 !important;
	}
	#controlpane:hover {
	left: 0 !important;
	}
	#zingspane, .scrollwrap.llContainer {
	top: 0 !important;
	height: 100% !important;
	}
	
	#sidebaradpane, #social {
	display: none !important;
	}
	#mainpane, #mainpane {
	z-index: 1 !important;
	left: 0 !important;
	right: 0 !important;
	width: auto !important;
	}
}

Vollbild ohne Kopf- und Seitenleiste

Vollbild mit Seitenleiste

Vollbild mit Kopfleiste

Menüeintrag¶

Zur "Perfektion" kann man nun noch einen Menüeintrag erstellen^[3].

Icon herunterladen¶

Das dafür nötige Icon kann in den Ordner /usr/share/pixmaps heruntergeladen werden.

Eintrag in das Feld "Befehl:"¶

Befehl:

"prism" -override "~/.webapps/zattoo@prism.app/override.ini" -webapp zattoo@prism.app

Diese Revision wurde am 11. April 2012 15:43 von frustschieber erstellt.
Die folgenden Schlagworte wurden dem Artikel zugewiesen: TV, Internet

ubuntuusers.de

Wiki