Multichat-Webseite für chatbegeisterte Zuschauer
Verfasst: 15. April 2019, 20:52
Hallo liebe W.B.-Community,
Beim Entwickeln eines kleinen Chat-Bots ist mir die Idee gekommen, ob man nicht, zB. auf writingbull.de, eine kleine Stream-Einbindung realisieren könnte, in der man gleichzeitig beide Chats (YT und Twitch) lesen kann.
Für all diejenigen, die den gemeinsamen Chat im Streambild vermissen, oder beide Chats gleichzeitig verfolgen wollen.
(Hoffe es ist O.K. die Chatnachrichten hier unzensiert reinzustellen)
Das ist eine kleine erste Testseite, die den Stream und beide Chats, passend für einen 4:3 Monitor, anzeigt.
Der nächste Schritt wäre die Seite zu dynamisieren, dass sie sich automatisch an die Browsergröße anpasst.
Evtl. macht es auch Sinn, ein alternatives Layout anzubieten, und zB. den Youtube-Chat unter dem Video anzuzeigen.
Nur so als Idee, was haltet ihr davon?
Fändet ihr das praktisch, bzw. würdet es benutzen?
Viele Grüße,
Marvin S.
Code der Testseite:
(mit Apache/XAMPP getestet)
Beim Entwickeln eines kleinen Chat-Bots ist mir die Idee gekommen, ob man nicht, zB. auf writingbull.de, eine kleine Stream-Einbindung realisieren könnte, in der man gleichzeitig beide Chats (YT und Twitch) lesen kann.
Für all diejenigen, die den gemeinsamen Chat im Streambild vermissen, oder beide Chats gleichzeitig verfolgen wollen.
(Hoffe es ist O.K. die Chatnachrichten hier unzensiert reinzustellen)
Das ist eine kleine erste Testseite, die den Stream und beide Chats, passend für einen 4:3 Monitor, anzeigt.
Der nächste Schritt wäre die Seite zu dynamisieren, dass sie sich automatisch an die Browsergröße anpasst.
Evtl. macht es auch Sinn, ein alternatives Layout anzubieten, und zB. den Youtube-Chat unter dem Video anzuzeigen.
Nur so als Idee, was haltet ihr davon?
Fändet ihr das praktisch, bzw. würdet es benutzen?
Viele Grüße,
Marvin S.
Code der Testseite:
(mit Apache/XAMPP getestet)
Code: Alles auswählen
<!doctype html>
<html lang="en">
<head>
<title>Testpage</title>
</head>
<body class="index">
<style>
.box {
float: left;
padding: 5px;
background: #eee;
}
</style>
<div class="box">
<script src= "https://player.twitch.tv/js/embed/v1.js"></script>
<div id="123"></div>
<script type="text/javascript">
var options = {
width: 650,
height: 800,
channel: "writing_bull",
};
var player = new Twitch.Player("123", options);
player.setVolume(0.5);
</script>
</div>
<div class="box">
<iframe frameborder="0"
scrolling="no"
id="chat_embed"
src="https://www.twitch.tv/embed/writing_bull/chat"
height="800"
width="250">
</iframe>
</div>
<div class="box">
<iframe allowfullscreen=""
frameborder="0"
height="800"
src="https://www.youtube.com/live_chat?v=GwcgFuyJLg8&embed_domain=localhost"
width="300"></iframe><br />
</div>
</body>
</html>
