ATD
/
jitsi-stream-client
1
0
Fork 0
Code Issues 2 Pull Requests Releases Wiki Activity

added Readme and username placeholders in the HTML

This commit is contained in:
Lucas Pleß 2020-12-25 15:38:40 +01:00
parent ba4e8ecd7f
commit c6c0922fe8
2 changed files with 29 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
README.md Normal file
View File

@ -0,0 +1,20 @@
# Jitsi Client for Streaming
This is a small HTML/Javascript Client for Jitsi. With this client you can join any Jitsi Room and the Client shows the participants on a fixed window on the screen. The client can show a maximum of 9 Videos. The positions on the Screen are fixed and mapped by the username of the participants.
With this design it is possible to capture the Screen with OBS and crop the different Video feeds of your Users seperately.
Its best to open the Browser on a second Monitor. (Use Chrome or Chromium)
The Jitsi Server can be changed in the script.js file. The default Server is "meet.theater.digital".
Furthermore you can Control the Volume of each Participant via a Slider and even via Midi Controller. (Korg nanoKontrol2)
Since this client will join the Jitsi Meeting, its name is "Streamer". It has no Video for the other users.
## User mapping
Below the Video Placeholdes there a Input Boxes for the Usernames. You have to enter the exact name of the participant into the box and hit the reload Button to apply.
Ask your users that they give themself a uniqe username. Best are simple names without blanks and any special symbols. Please avoid duplicate names.

18
index.html
View File

@ -120,19 +120,19 @@
<div class="volume-slider volume-0 col">
<span class="volume">70%</span>
<input type="range" min="0" max="1" step="0.01" value="0.7" oninput="setLevel(0, this.value)">
<input type="text" onchange="setName(0, this.value)">
<input type="text" onchange="setName(0, this.value)" placeholder="username1">
<button onclick="reload(0)">Reload</button>
</div>
<div class="volume-slider volume-1 col">
<span class="volume">70%</span>
<input type="range" min="0" max="1" step="0.01" value="0.7" oninput="setLevel(1, this.value)">
<input type="text" onchange="setName(1, this.value)">
<input type="text" onchange="setName(1, this.value)" placeholder="username2">
<button onclick="reload(1)">Reload</button>
</div>
<div class="volume-slider volume-2 col">
<span class="volume">70%</span>
<input type="range" min="0" max="1" step="0.01" value="0.7" oninput="setLevel(2, this.value)">
<input type="text" onchange="setName(2, this.value)">
<input type="text" onchange="setName(2, this.value)" placeholder="username3">
<button onclick="reload(2)">Reload</button>
</div>
</div>
@ -140,19 +140,19 @@
<div class="volume-slider volume-3 col">
<span class="volume">70%</span>
<input type="range" min="0" max="1" step="0.01" value="0.7" oninput="setLevel(3, this.value)">
<input type="text" onchange="setName(3, this.value)">
<input type="text" onchange="setName(3, this.value)" placeholder="username4">
<button onclick="reload(3)">Reload</button>
</div>
<div class="volume-slider volume-4 col">
<span class="volume">70%</span>
<input type="range" min="0" max="1" step="0.01" value="0.7" oninput="setLevel(4, this.value)">
<input type="text" onchange="setName(4, this.value)">
<input type="text" onchange="setName(4, this.value)" placeholder="username5">
<button onclick="reload(4)">Reload</button>
</div>
<div class="volume-slider volume-5 col">
<span class="volume">70%</span>
<input type="range" min="0" max="1" step="0.01" value="0.7" oninput="setLevel(5, this.value)">
<input type="text" onchange="setName(5, this.value)">
<input type="text" onchange="setName(5, this.value)" placeholder="username6">
<button onclick="reload(5)">Reload</button>
</div>
</div>
@ -160,19 +160,19 @@
<div class="volume-slider volume-6 col">
<span class="volume">70%</span>
<input type="range" min="0" max="1" step="0.01" value="0.7" oninput="setLevel(6, this.value)">
<input type="text" onchange="setName(6, this.value)">
<input type="text" onchange="setName(6, this.value)" placeholder="username7">
<button onclick="reload(6)">Reload</button>
</div>
<div class="volume-slider volume-7 col">
<span class="volume">70%</span>
<input type="range" min="0" max="1" step="0.01" value="0.7" oninput="setLevel(7, this.value)">
<input type="text" onchange="setName(7, this.value)">
<input type="text" onchange="setName(7, this.value)" placeholder="username8">
<button onclick="reload(7)">Reload</button>
</div>
<div class="volume-slider volume-8 col">
<span class="volume">70%</span>
<input type="range" min="0" max="1" step="0.01" value="0.7" oninput="setLevel(8, this.value)">
<input type="text" onchange="setName(8, this.value)">
<input type="text" onchange="setName(8, this.value)" placeholder="username9">
<button onclick="reload(8)">Reload</button>
</div>
</div>