From 8e41f008b717e1445516a84f24938f07466d80c3 Mon Sep 17 00:00:00 2001 From: Chris Date: Sun, 5 Dec 2021 23:49:16 +0100 Subject: [PATCH 1/6] add OBS setup helper page --- frontend/app/frontend.py | 9 ++ frontend/app/static/style.default.css | 29 ++++++ frontend/app/templates/default/main.html.j2 | 2 +- .../templates/default/setup_helper.html.j2 | 91 +++++++++++++++++++ 4 files changed, 130 insertions(+), 1 deletion(-) create mode 100644 frontend/app/templates/default/setup_helper.html.j2 diff --git a/frontend/app/frontend.py b/frontend/app/frontend.py index 22e40df..8338c18 100644 --- a/frontend/app/frontend.py +++ b/frontend/app/frontend.py @@ -31,3 +31,12 @@ def show_player(appname, streamname): configuration=zomstream.configuration ) return page + +@frontend.route("/setup_helper") +def setup_helper(): + template = '%s/setup_helper.html.j2' % zomstream.configuration['template_folder'] + page = flask.render_template( + template, + configuration=zomstream.configuration + ) + return page \ No newline at end of file diff --git a/frontend/app/static/style.default.css b/frontend/app/static/style.default.css index 48c8803..488fcc4 100644 --- a/frontend/app/static/style.default.css +++ b/frontend/app/static/style.default.css @@ -54,6 +54,35 @@ article { padding: 0px; } +form { + margin: 4px; +} + +article p { + margin: 4px; +} + +input, select { + width: 100%; + border: 3px solid #888; + border-radius: 3px; + box-sizing: border-box; +} + +input:focus { + border: 3px solid #88f; +} + +form button { + border-radius: 4px; + color: #eee; + background: #88f; + display: block; + width: 100%; + padding: 5px; + margin-top: 4px; +} + article h1 { font-size: 13pt; font-weight: normal; diff --git a/frontend/app/templates/default/main.html.j2 b/frontend/app/templates/default/main.html.j2 index e9fb218..0d09219 100644 --- a/frontend/app/templates/default/main.html.j2 +++ b/frontend/app/templates/default/main.html.j2 @@ -8,7 +8,7 @@

{{ configuration["pagetitle"] }}

-

{{ configuration["subtitle"] }}

+

Setup Helper | {{ configuration["subtitle"] }}

{% if items == [] %} diff --git a/frontend/app/templates/default/setup_helper.html.j2 b/frontend/app/templates/default/setup_helper.html.j2 new file mode 100644 index 0000000..a08bbaa --- /dev/null +++ b/frontend/app/templates/default/setup_helper.html.j2 @@ -0,0 +1,91 @@ + + + + + {{ configuration['pagetitle'] }} - Stream Overview + + + +
+

{{ configuration["pagetitle"] }}

+

{{ configuration["subtitle"] }}

+
+
+
+

+ Setup Helper +

+

+ This tool should help you with the setup of OBS for use with zomstream +

+
+ + + + + + + + + + +
+
+ +
+

OBS Configuration

+

go to Settings -> Stream to set up these parameters in OBS

+ + + + + + + + + + + + + + + + + + + + + + + +
ParameterSetting
ServiceCustom...
Server
Stream Key
Use Authenticationoff
+
+
+ + + \ No newline at end of file From 2181f78725ec473a932f4937cc66d8fd0ed512c9 Mon Sep 17 00:00:00 2001 From: Chris Date: Mon, 6 Dec 2021 00:00:03 +0100 Subject: [PATCH 2/6] add rtmp and http url to player page as these aren't accessible from the main page for unlisted streams it might be helpful to have them listed on the player page for users which want to use external media players --- frontend/app/templates/default/player.html.j2 | 24 +++++++++++++++++++ 1 file changed, 24 insertions(+) diff --git a/frontend/app/templates/default/player.html.j2 b/frontend/app/templates/default/player.html.j2 index 281e365..bbc90e3 100644 --- a/frontend/app/templates/default/player.html.j2 +++ b/frontend/app/templates/default/player.html.j2 @@ -15,6 +15,30 @@ +
+
+

URLs

+ + + + + + + + + + + + + + + + + + +
ProtocolURL
RTMPrtmp://{{ configuration["rtmp_base"] }}/{{ appname }}/{{ streamname }}
RTMP
HTTP-FLV{{ configuration["web_proto"] }}://{{ configuration["base_url"] }}/flv?app={{ appname }}&stream={{ streamname }}
HTTP-FLV
+
+
diff --git a/frontend/app/templates/default/player.html.j2 b/frontend/app/templates/default/player.html.j2 index bbc90e3..610c966 100644 --- a/frontend/app/templates/default/player.html.j2 +++ b/frontend/app/templates/default/player.html.j2 @@ -24,16 +24,47 @@ Protocol URL + RTMP - rtmp://{{ configuration["rtmp_base"] }}/{{ appname }}/{{ streamname }} -
RTMP
+ + + + + + + + + ▶ RTMP + + HTTP-FLV - {{ configuration["web_proto"] }}://{{ configuration["base_url"] }}/flv?app={{ appname }}&stream={{ streamname }} -
HTTP-FLV
+ + + + + + + + + ▶ HTTP-FLV + + @@ -51,6 +82,12 @@ flvPlayer.load(); flvPlayer.play(); } + + function copy_to_clipboard(elem) { + textfield = document.getElementById(elem) + textfield.select() + navigator.clipboard.writeText(textfield.value) + } diff --git a/frontend/app/templates/default/setup_helper.html.j2 b/frontend/app/templates/default/setup_helper.html.j2 index f5c9ca2..047db4b 100644 --- a/frontend/app/templates/default/setup_helper.html.j2 +++ b/frontend/app/templates/default/setup_helper.html.j2 @@ -28,12 +28,16 @@ - + - + - + @@ -45,22 +49,26 @@ Parameter Setting + - Service - Custom... + Service + + Server - + + Stream Key - + + Use Authentication - off + @@ -74,52 +82,65 @@ Type URL + Web Player - + + FLV HTTP - + + RTMP - + +
\ No newline at end of file From 4a57a4dcf49018f4f93e3d9d9788ef0cb35ac9ad Mon Sep 17 00:00:00 2001 From: Chris Date: Mon, 6 Dec 2021 21:12:17 +0100 Subject: [PATCH 5/6] use different sample password --- docker-compose.default.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docker-compose.default.yml b/docker-compose.default.yml index 9466e8f..dd069e9 100644 --- a/docker-compose.default.yml +++ b/docker-compose.default.yml @@ -15,7 +15,7 @@ services: - "./auth:/code" # set the PSK Password for the Auth Daemon here environment: - - password=ex4mple_p4ssw0rd! + - password=P4ssW0rD nginx-rtmp: # nginx rtmp server build: ./docker-nginx-rtmp/. From 7fa201e1ad4d30be1cedb9ce05a31f2c86669725 Mon Sep 17 00:00:00 2001 From: Chris Date: Mon, 6 Dec 2021 21:13:26 +0100 Subject: [PATCH 6/6] make example config work ootb with docker-compose.default.yml --- config/frontend/config.example.yml | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/config/frontend/config.example.yml b/config/frontend/config.example.yml index 9586428..8fe7b18 100644 --- a/config/frontend/config.example.yml +++ b/config/frontend/config.example.yml @@ -1,12 +1,12 @@ # This is the title and Subtitle displayed on the Head of the Page pagetitle: Zomstream -subtitle: v0.4 +subtitle: v0.5 # the footer footer: "© 2021 by the zom.bi Team" # the ip or hostname used to generate rtmp URLs -rtmp_base: stream.zom.bi +rtmp_base: 127.0.0.1 # this is the base url used to generate internal links -base_url: 127.0.0.1:5001 +base_url: 127.0.0.1:8080 # the url to the nginx servers status page. # this is used for discovering the running streams