webui

andrew (from workstation) · andrew (from workstation) · commit f41dc2b93140 · 2020-12-08T15:50:52.000+01:00
diff --git a/MANIFEST.in b/MANIFEST.in
@@ -0,0 +1 @@
+include smart_tv_telegram/static/*
diff --git a/README.md b/README.md
@@ -11,6 +11,7 @@ A Telegram Bot to stream content on your smart TV (also Chromecast, FireTV and o
 - You can streaming on any device that supports UPnP (AVTransport)
 - Chromecast, Vlc (telnet api) and Kodi (xbmc http api) support
 - Streaming over HTTP
+- Web interface that plays videos in your browser
 
 Note: Chromecast (1st, 2nd and 3rd Gen.) [only supports H.264 and VP8 video codecs](https://developers.google.com/cast/docs/media#video_codecs)
 
@@ -52,6 +53,15 @@ docker run --network host -v "$(pwd)/config.ini:/app/config.ini:ro" -d smart-tv-
 
 ## Troubleshooting
 
+**Q:** How do I use the web interface?
+
+**A:** Set `enabled` to `1` in `web_ui` config block, and change the `password`
+
+- open http://`listen_ip`:`listen_port`/static/index.html
+
+- now if you send a video in the bot on telegram you can choose to play it in the browser
+
+##
 **Q:** My Firewall block upnp and broadcasting, how can use kodi without it
 
 **A:** Set `xbmc_enabled` to `1` and add your kodi device to `xbmc_devices` list
diff --git a/setup.py b/setup.py
@@ -31,5 +31,6 @@
             "smart_tv_telegram=smart_tv_telegram.__main__:arg_parser",
             "smart_tv_telegram_tests=smart_tv_telegram.__main__:unit_test"
         ],
-    }
+    },
+    include_package_data=True
 )
diff --git a/smart_tv_telegram/http.py b/smart_tv_telegram/http.py
@@ -1,4 +1,5 @@
 import asyncio
+import os.path
 import typing
 from urllib.parse import quote
 
@@ -39,6 +40,7 @@ def __init__(self, mtproto: Mtproto, config: Config, finders: typing.List[Device
 
     async def start(self):
         app = web.Application()
+        app.add_routes([web.static("/static/", os.path.dirname(__file__) + "/static/")])
         app.add_routes([web.get("/stream/{message_id}/{token}", self._stream_handler)])
         app.add_routes([web.options("/stream/{message_id}/{token}", self._upnp_discovery_handler)])
         app.add_routes([web.put("/stream/{message_id}/{token}", self._upnp_discovery_handler)])
diff --git a/smart_tv_telegram/static/index.html b/smart_tv_telegram/static/index.html
@@ -0,0 +1,64 @@
+<html lang="en">
+<head>
+    <title>smart-telegram-bot web</title>
+    <script>
+        const source = document.createElement("source");
+
+        function onPasswordSubmit() {
+            const xhttp = new XMLHttpRequest();
+            const inputPassword = document.getElementById("password");
+            const buttonPassword = document.getElementById("password_submit")
+
+            xhttp.onloadend = function() {
+                if (this.status === 200) {
+                    inputPassword.hidden = true;
+                    buttonPassword.hidden = true;
+                    pollVideo(xhttp.responseText);
+                } else {
+                    window.alert("wrong password");
+                }
+            };
+
+            xhttp.open("GET", "/web/api/register/" + inputPassword.value, true);
+            xhttp.send();
+        }
+
+        function pollVideo(token) {
+            const player = document.getElementById("player")
+            const xhttp = new XMLHttpRequest();
+
+            xhttp.onloadend = function() {
+                if (this.status === 200) {
+                    if (player.hidden) {
+                        player.appendChild(source);
+                        player.hidden = false;
+                    }
+
+                    player.pause();
+                    source.setAttribute("src", xhttp.responseText);
+                    player.load();
+                    player.play();
+                }
+
+                if (this.status === 404) {
+                    location.reload();
+                }
+
+                setTimeout(function () { pollVideo(token); }, 1000);
+            };
+
+            xhttp.open("GET", "/web/api/poll/" + token, true);
+            xhttp.send();
+        }
+    </script>
+</head>
+<body>
+<label for="password">
+    <input id="password" type="password" placeholder="password">
+    <button onclick="onPasswordSubmit()" id="password_submit">submit password</button>
+</label>
+<label for="player">
+    <video id="player" controls hidden></video>
+</label>
+</body>
+</html>

Original file line number	Diff line number	Diff line change
`@@ -31,5 +31,6 @@`
`31`	`31`	`"smart_tv_telegram=smart_tv_telegram.__main__:arg_parser",`
`32`	`32`	`"smart_tv_telegram_tests=smart_tv_telegram.__main__:unit_test"`
`33`	`33`	`],`
`34`		`- }`
	`34`	`+ },`
	`35`	`+ include_package_data=True`
`35`	`36`	`)`