CSS Media-Query Breakpoints. Im gezeigten CSS also z.B. $min-width: 2100px.
Die Breakpoints passen wohl. Der mit 2100px wird benutzt wenn der Browser nicht im Vollbild ist. Der mit 2300px dann im Vollbild. Ich hab jetzt Werte die mit und ohne Chat für Vollbild und nicht Vollbild in 21:9 und 16:9 passen:
.grid-container {
max-width: 93rem;
padding: 1rem
}
@media only screen and (min-width: 2100px) {
.grid-container {
max-width:97rem
}
}
@media only screen and (min-width: 2300px) {
.grid-container {
max-width:109rem
}
}
.grid-container-118rem {
max-width: 118rem!important
}
@media only screen and (min-width: 2100px) {
.grid-container-118rem {
max-width:122rem!important
}
}
@media only screen and (min-width: 2300px) {
.grid-container-118rem {
max-width:134rem!important
}
}
Screenshots: http://imgur.com/a/j7I12
Kann ich übernehmen, aber sollte der Stream-Titel nicht vielleicht auch im Bild sein? Sicherlich eine Geschmacksfrage, allerdings macht es dann wohl mehr Sinn ein wenig Raum in der Breite zu verschwenden anstatt es gar nicht erst zu ermöglichen alles zu sehen.
Ich geb es dir gleich nochmal mit dem Stream Titel.
Allerdings hab ich grade noch das Problem gefunden das es nicht im Vollbild nur passt weil ich meine Tableiste links habe und damit die breite kleiner wird. Wenn die oben ist bräuchte man wieder andere Werte. Ich probier mal etwas ob das noch besser geht.
So passt es jetzt bei mir mit Stream Titel und auch wenn die Tab-Leiste oben wäre:
.grid-container {
max-width: 93rem;
padding: 1rem
}
@media only screen and (min-width: 2100px) {
.grid-container {
max-width:89rem
}
}
@media only screen and (min-width: 2300px) and (min-height: 1000px) {
.grid-container {
max-width:106rem
}
}
.grid-container-118rem {
max-width: 118rem!important
}
@media only screen and (min-width: 2100px) {
.grid-container-118rem {
max-width:113rem!important
}
}
@media only screen and (min-width: 2300px) and (min-height: 1000px) {
.grid-container-118rem {
max-width:130rem!important
}
}
Damit es für andere Fenstergrößen auch passt müsste man wenn ich es richtig verstehe auch die Höhe des Videos beschränken. Extremes Beispiel bei dem es nicht passt:
Updates
- Options-Menü: Auswahl zwischen 16:9 und 21:9; Aktvieren/Deaktivieren von Notifications.
- HTML5-Notifications wenn ein neuer Titel (Wechsel des Videos oder neuer Stream Titel) erkannt wird.
- Hervorhebung von Shows/Sendungen im Titel sofern sie erkannt werden können.
2 „Gefällt mir“
Updates
- Geändertes Update Verhalten für Video Listen. Nur der aktive Channel wird automatisch aktualisiert. Umschalten triggert ein Update.
- Stream Titel Aktualisierung über Google Spreadsheet statt Youtube API.
- Uhr zur Menu-Leiste hinzugefügt.
- Notification Bilder/Logos für (fast) alle Sendungen hinzugefügt.
Updates
1 „Gefällt mir“
Updates
Stream und Video Daten werden nun indirekt über die Youtube API bezogen (Umweg über Google Spreadsheet), somit werden die API Limits umgangen und die Daten können minütlich aktualisiert werden. Unabhängig von der Anzahl an Benutzern.
2 „Gefällt mir“
geiles Projekt. 
kleine Frage: ist es möglich die Chat Icons von BetterRBTV auf der Seite zu implementieren, für alle die RBTV nicht am Desktop Rechner schauen und somit keine Addons installieren können?
Ich könnte mir vorstellen, dass es zwar möglich ist jedoch den Chat unbrauchbar macht, wenn in realtime die Icons per JavaScript ausgetauscht werden. Trotzdem wollte ich mal fragen ob du glaubst, dass man das vielleicht erfolgreich schaffen könnte. Ist die einzige Sache die rocketview noch zur Perfektion fehlt. Wenn bitte als zusätzliche Checkbox. Danke 
Hammer Projekt!
Darf ich das Spreadsheet auch für meine SmartTV-App nutzen?
Meines Wissens nach gibt es (immernoch) keine Möglichkeit den Inhalt externer iframes zu beeinflussen. Das macht aus sicherheitstechnischen Gründen auch eine Menge Sinn. Mehr als das Theme des Chats ändern geht nicht, auch das nur weil Youtube es erlaubt. BetterRBTV kann dies nur tun, da es sich hier um ein Browser Addon handelt.
Klar, ich sehe keinen Grund warum nicht. Mir sind keine Einschränkungen von Google’s Seite aus bekannt was die Anzahl an Zugriffen auf diese Daten betrifft. Du kannst dir das Sheet aber auch einfach kopieren, einen Google Developer Account erstellen und dir darüber einen API Key besorgen. Alles kostenlos und sehr einfach.
1 „Gefällt mir“
Wollte hier mal danke sagen für die tolle Seite! YouTube Gaming gibt mir 720p nur, wenn ich ins Vollbild gehe, mit dem eingebetteten Player bei dir läuft es dagegen wie geschmiert! Und der Sendeplan ist einfach toll.
Gäbe es eine Möglichkeit, das Design so anzupassen, dass der Chat unter einer gewissen Breite unter das Videofenster geht? Bin einer dieser 0.7% Windows-Phone-Nutzer ohne YouTube-App…
Wie gut 
Gefällt mir besser als bei Youtube direkt zu schauen.
Geht auf jeden Fall, ich weiß nur nicht ob ich die nächsten Tage/Nächste Woche Zeit habe daran zu arbeiten. Vielleicht kann ich es irgendwo dazwischen schieben da es nur eine kleine Änderung sein sollte. Du könntest mir soweit behilflich sein mir zu sagen ab welcher Bildschirmbreite dies geschehen sollte. Vielleicht optimiere ich dann auch bei Gelegenheit das Menü, unter 600px verschiebt sich da ja alles übereinander, was für Desktop natürlich kein Problem ist.
Habe gerade den CSS-Query orientation:portrait gefunden, das würde dann auch Tablets abdecken. Ansonsten wären die Dimensionen bei mir 360x544, das deckt sich auch mit den 600px fürs Menü.
Vielen Dank dafür!
Richtig geiler Viewer.
Hallo @Eruyome
Vielen Dank für diese Seite! Ich gucke seit Plattformwechsel ausschließlich über RocketView.
Eine Sache, die man vielleicht noch verbessern könnte, wäre den Abstand zwischen Adressleiste und Bild zu verkleinern (Siehe Bild). So könnte man das Fenster für die Chat-Eingabe immer sehen, wenn man komplett hoch gescrollt hat. Momentan muss man die Seite immer etwas nach unten navigieren, sodass man alles sieht.
Könnte man z.B. den Titel ganz oben einpflegen?
1 „Gefällt mir“