livekit-client 0.14.0 → 0.15.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (94) hide show
  1. package/.github/workflows/{lint.yaml → test.yaml} +7 -4
  2. package/README.md +27 -12
  3. package/dist/api/SignalClient.d.ts +4 -31
  4. package/dist/api/SignalClient.js +25 -7
  5. package/dist/api/SignalClient.js.map +1 -1
  6. package/dist/connect.d.ts +1 -1
  7. package/dist/connect.js +70 -56
  8. package/dist/connect.js.map +1 -1
  9. package/dist/index.d.ts +3 -4
  10. package/dist/index.js +4 -4
  11. package/dist/index.js.map +1 -1
  12. package/dist/logger.d.ts +10 -0
  13. package/dist/logger.js +14 -0
  14. package/dist/logger.js.map +1 -1
  15. package/dist/options.d.ts +77 -12
  16. package/dist/options.js +0 -10
  17. package/dist/options.js.map +1 -1
  18. package/dist/proto/livekit_models.d.ts +28 -1
  19. package/dist/proto/livekit_models.js +194 -3
  20. package/dist/proto/livekit_models.js.map +1 -1
  21. package/dist/proto/livekit_rtc.d.ts +49 -7
  22. package/dist/proto/livekit_rtc.js +303 -28
  23. package/dist/proto/livekit_rtc.js.map +1 -1
  24. package/dist/room/RTCEngine.d.ts +2 -2
  25. package/dist/room/RTCEngine.js +6 -4
  26. package/dist/room/RTCEngine.js.map +1 -1
  27. package/dist/room/Room.d.ts +12 -14
  28. package/dist/room/Room.js +78 -45
  29. package/dist/room/Room.js.map +1 -1
  30. package/dist/room/events.d.ts +98 -1
  31. package/dist/room/events.js +97 -0
  32. package/dist/room/events.js.map +1 -1
  33. package/dist/room/participant/LocalParticipant.d.ts +27 -9
  34. package/dist/room/participant/LocalParticipant.js +194 -155
  35. package/dist/room/participant/LocalParticipant.js.map +1 -1
  36. package/dist/room/participant/Participant.js +6 -2
  37. package/dist/room/participant/Participant.js.map +1 -1
  38. package/dist/room/participant/RemoteParticipant.d.ts +1 -1
  39. package/dist/room/participant/RemoteParticipant.js +6 -5
  40. package/dist/room/participant/RemoteParticipant.js.map +1 -1
  41. package/dist/room/participant/publishUtils.d.ts +11 -0
  42. package/dist/room/participant/publishUtils.js +148 -0
  43. package/dist/room/participant/publishUtils.js.map +1 -0
  44. package/dist/room/participant/publishUtils.test.d.ts +1 -0
  45. package/dist/room/participant/publishUtils.test.js +79 -0
  46. package/dist/room/participant/publishUtils.test.js.map +1 -0
  47. package/dist/room/track/LocalAudioTrack.d.ts +4 -3
  48. package/dist/room/track/LocalAudioTrack.js +5 -3
  49. package/dist/room/track/LocalAudioTrack.js.map +1 -1
  50. package/dist/room/track/LocalTrack.d.ts +1 -3
  51. package/dist/room/track/LocalTrack.js +2 -49
  52. package/dist/room/track/LocalTrack.js.map +1 -1
  53. package/dist/room/track/LocalVideoTrack.d.ts +6 -4
  54. package/dist/room/track/LocalVideoTrack.js +41 -12
  55. package/dist/room/track/LocalVideoTrack.js.map +1 -1
  56. package/dist/room/track/LocalVideoTrack.test.d.ts +1 -0
  57. package/dist/room/track/LocalVideoTrack.test.js +68 -0
  58. package/dist/room/track/LocalVideoTrack.test.js.map +1 -0
  59. package/dist/room/track/RemoteTrackPublication.d.ts +10 -4
  60. package/dist/room/track/RemoteTrackPublication.js +60 -4
  61. package/dist/room/track/RemoteTrackPublication.js.map +1 -1
  62. package/dist/room/track/RemoteVideoTrack.d.ts +15 -1
  63. package/dist/room/track/RemoteVideoTrack.js +98 -1
  64. package/dist/room/track/RemoteVideoTrack.js.map +1 -1
  65. package/dist/room/track/Track.d.ts +15 -2
  66. package/dist/room/track/Track.js +6 -2
  67. package/dist/room/track/Track.js.map +1 -1
  68. package/dist/room/track/options.d.ts +15 -65
  69. package/dist/room/track/options.js +14 -13
  70. package/dist/room/track/options.js.map +1 -1
  71. package/dist/room/track/utils.d.ts +3 -0
  72. package/dist/room/track/utils.js +68 -0
  73. package/dist/room/track/utils.js.map +1 -0
  74. package/dist/room/track/utils.test.d.ts +1 -0
  75. package/dist/room/track/utils.test.js +85 -0
  76. package/dist/room/track/utils.test.js.map +1 -0
  77. package/dist/room/utils.d.ts +6 -0
  78. package/dist/room/utils.js +25 -1
  79. package/dist/room/utils.js.map +1 -1
  80. package/dist/version.d.ts +1 -1
  81. package/dist/version.js +1 -1
  82. package/example/index.html +183 -178
  83. package/example/sample.ts +410 -326
  84. package/example/styles.css +144 -0
  85. package/example/webpack.config.js +1 -1
  86. package/jest.config.js +6 -0
  87. package/package.json +9 -6
  88. package/tsconfig.eslint.json +8 -1
  89. package/dist/room/defaults.d.ts +0 -5
  90. package/dist/room/defaults.js +0 -32
  91. package/dist/room/defaults.js.map +0 -1
  92. package/dist/room/track/create.d.ts +0 -25
  93. package/dist/room/track/create.js +0 -170
  94. package/dist/room/track/create.js.map +0 -1
package/example/index.html CHANGED
@@ -15,16 +15,7 @@
15
15
  crossorigin="anonymous"
16
16
  />
17
17
 
18
- <style>
19
- .video-container {
20
- display: inline-block;
21
- border-radius: 5px;
22
- }
23
-
24
- .video-container video.speaking {
25
- border: 4px solid rgba(94, 166, 190, 0.7);
26
- }
27
- </style>
18
+ <link rel="stylesheet" href="styles.css">
28
19
  </head>
29
20
 
30
21
  <body>
@@ -33,200 +24,214 @@
33
24
  <div class="col-md-8">
34
25
  <h2>Livekit Sample App</h2>
35
26
  <br/>
36
- <form>
37
- <div class="form-group row">
38
- <label for="url" class="col-md-3 col-form-label"
39
- >LiveKit URL</label
40
- >
27
+ <div id="connect-area">
28
+ <div>
29
+ <b>LiveKit URL</b>
30
+ </div>
31
+ <div>
41
32
  <input
42
33
  type="text"
43
- class="form-control col-md-5"
34
+ class="form-control"
44
35
  id="url"
45
36
  value="ws://localhost:7880"
46
37
  />
47
38
  </div>
48
-
49
- <div class="form-group row">
50
- <label for="token" class="col-md-3 col-form-label">Token</label>
51
- <input type="text" class="form-control col-md-5" id="token" />
39
+ <div>
40
+ <b>Token</b>
52
41
  </div>
53
-
54
- <div class="form-group row">
55
- <div class="col-md-2 offset-md-1">
56
- <div class="form-check">
57
- <input
58
- type="checkbox"
59
- class="form-check-input"
60
- id="publish-option"
61
- checked
62
- />
63
- <label for="checkbox" class="form-check-label">
64
- Publish
65
- </label>
66
- </div>
67
- </div>
68
- <div class="col-md-2">
69
- <div class="form-check">
70
- <input
71
- type="checkbox"
72
- class="form-check-input"
73
- id="simulcast"
74
- checked
75
- />
76
- <label for="checkbox" class="form-check-label">
77
- Simulcast
78
- </label>
79
- </div>
80
- </div>
81
- <div class="col-md-3">
82
- <div class="form-check">
83
- <input
84
- type="checkbox"
85
- class="form-check-input"
86
- id="force-turn"
87
- />
88
- <label for="checkbox" class="form-check-label">
89
- Force TURN
90
- </label>
91
- </div>
92
- </div>
42
+ <div>
43
+ <input type="text" class="form-control" id="token" />
93
44
  </div>
45
+ </div>
94
46
 
95
- <div class="form-group row">
96
- <div class="col-md-2">
97
- <button
98
- id="connect-button"
99
- class="btn btn-primary mt-1"
100
- type="button"
101
- onclick="connectWithFormInput()"
102
- >
103
- Connect
104
- </button>
105
- </div>
106
- <div class="col-md-10">
107
- <button
108
- id="toggle-audio-button"
109
- class="btn btn-secondary mt-1"
110
- disabled
111
- type="button"
112
- onclick="toggleAudio()"
113
- >
114
- Enable Audio
115
- </button>
116
- <button
117
- id="toggle-video-button"
118
- class="btn btn-secondary mt-1"
119
- disabled
120
- type="button"
121
- onclick="toggleVideo()"
122
- >
123
- Enable Video
124
- </button>
125
- <button
126
- id="flip-video-button"
127
- class="btn btn-secondary mt-1"
128
- disabled
129
- type="button"
130
- onclick="flipVideo()"
131
- >
132
- Back Camera
133
- </button>
134
- <button
135
- id="share-screen-button"
136
- class="btn btn-secondary mt-1"
137
- disabled
138
- type="button"
139
- onclick="shareScreen()"
140
- >
141
- Share Screen
142
- </button>
143
- <button
144
- id="disconnect-ws-button"
145
- class="btn btn-warning mt-1"
146
- disabled
147
- type="button"
148
- onclick="disconnectSignal()"
149
- >
150
- WS Reconnect
151
- </button>
152
- <button
153
- id="disconnect-room-button"
154
- class="btn btn-danger mt-1"
155
- disabled
156
- type="button"
157
- onclick="disconnectRoom()"
158
- >
159
- Disconnect
160
- </button>
161
- <button
162
- id="start-audio-button"
163
- class="btn btn-secondary mt-1"
164
- disabled
165
- type="button"
166
- onclick="startAudio()"
167
- >
168
- Enable Audio
169
- </button>
170
- </div>
47
+ <!-- connect options -->
48
+ <div id="options-area">
49
+ <div>
50
+ <input
51
+ type="checkbox"
52
+ class="form-check-input"
53
+ id="publish-option"
54
+ checked
55
+ />
56
+ <label for="publish-option" class="form-check-label">
57
+ Publish
58
+ </label>
171
59
  </div>
172
-
173
- <!-- video devices -->
174
- <div class="form-group row">
175
- <div class="col-md-4">
176
- <select id="video-input" class="custom-select" onchange="handleDeviceSelected(event)">
177
- <option selected>Video Input (default)</option>
178
- </select>
179
- </div>
180
- <div class="col-md-4">
181
- <select id="audio-input" class="custom-select" onchange="handleDeviceSelected(event)">
182
- <option selected>Audio Input (default)</option>
183
- </select>
184
- </div>
185
- <div class="col-md-4">
186
- <select id="audio-output" class="custom-select" onchange="handleDeviceSelected(event)">
187
- <option selected>Audio Output (default)</option>
188
- </select>
189
- </div>
60
+ <div>
61
+ <input
62
+ type="checkbox"
63
+ class="form-check-input"
64
+ id="simulcast"
65
+ checked
66
+ />
67
+ <label for="simulcast" class="form-check-label">
68
+ Simulcast
69
+ </label>
190
70
  </div>
191
-
192
- <div class="form-group row">
193
- <textarea
194
- class="form-control col-md-12"
195
- id="log"
196
- rows="5"
197
- ></textarea>
71
+ <div>
72
+ <input
73
+ type="checkbox"
74
+ class="form-check-input"
75
+ id="adaptive-video"
76
+ checked
77
+ />
78
+ <label for="adaptive-video" class="form-check-label">
79
+ Adaptive video
80
+ </label>
198
81
  </div>
199
- </form>
200
- </div>
201
- <div class="col-md-4">
202
- <h3>Chat</h3>
203
- <div class="row">
204
- <div class="col-md-12">
205
- <textarea class="form-control" id="chat" rows="15"></textarea>
82
+ <div>
83
+ <input
84
+ type="checkbox"
85
+ class="form-check-input"
86
+ id="force-turn"
87
+ />
88
+ <label for="force-turn" class="form-check-label">
89
+ Force TURN
90
+ </label>
206
91
  </div>
207
92
  </div>
208
- <div class="row mt-1">
209
- <div class="col-md-10">
210
- <input type="text" class="form-control" id="entry" />
93
+
94
+ <!-- actions -->
95
+ <div id="actions-area">
96
+ <div>
97
+ <button
98
+ id="connect-button"
99
+ class="btn btn-primary mt-1"
100
+ type="button"
101
+ onclick="appActions.connectWithFormInput()"
102
+ >
103
+ Connect
104
+ </button>
211
105
  </div>
212
- <div class="col-md-1">
106
+ <div>
107
+ <button
108
+ id="toggle-audio-button"
109
+ class="btn btn-secondary mt-1"
110
+ disabled
111
+ type="button"
112
+ onclick="appActions.toggleAudio()"
113
+ >
114
+ Enable Mic
115
+ </button>
116
+ <button
117
+ id="toggle-video-button"
118
+ class="btn btn-secondary mt-1"
119
+ disabled
120
+ type="button"
121
+ onclick="appActions.toggleVideo()"
122
+ >
123
+ Enable Camera
124
+ </button>
125
+ <button
126
+ id="flip-video-button"
127
+ class="btn btn-secondary mt-1"
128
+ disabled
129
+ type="button"
130
+ onclick="appActions.flipVideo()"
131
+ >
132
+ Flip Camera
133
+ </button>
134
+ <button
135
+ id="share-screen-button"
136
+ class="btn btn-secondary mt-1"
137
+ disabled
138
+ type="button"
139
+ onclick="appActions.shareScreen()"
140
+ >
141
+ Share Screen
142
+ </button>
143
+ <button
144
+ id="disconnect-ws-button"
145
+ class="btn btn-warning mt-1"
146
+ disabled
147
+ type="button"
148
+ onclick="appActions.disconnectSignal()"
149
+ >
150
+ Signal Reconnect
151
+ </button>
152
+ <button
153
+ id="disconnect-room-button"
154
+ class="btn btn-danger mt-1"
155
+ disabled
156
+ type="button"
157
+ onclick="appActions.disconnectRoom()"
158
+ >
159
+ Disconnect
160
+ </button>
213
161
  <button
214
- class="btn btn-primary"
162
+ id="start-audio-button"
163
+ class="btn btn-secondary mt-1"
164
+ disabled
215
165
  type="button"
216
- onclick="enterText()"
166
+ onclick="appActions.startAudio()"
217
167
  >
218
- Enter
168
+ Start Audio
219
169
  </button>
220
170
  </div>
221
171
  </div>
172
+
173
+ <div id="inputs-area">
174
+ <div>
175
+ <select id="video-input" class="custom-select" onchange="appActions.handleDeviceSelected(event)">
176
+ <option selected>Video Input (default)</option>
177
+ </select>
178
+ </div>
179
+ <div>
180
+ <select id="audio-input" class="custom-select" onchange="appActions.handleDeviceSelected(event)">
181
+ <option selected>Audio Input (default)</option>
182
+ </select>
183
+ </div>
184
+ <div>
185
+ <select id="audio-output" class="custom-select" onchange="appActions.handleDeviceSelected(event)">
186
+ <option selected>Audio Output (default)</option>
187
+ </select>
188
+ </div>
189
+ </div>
222
190
  </div>
191
+ <div class="col-md-4">
192
+ <h3>Chat</h3>
193
+ <div id="chat-area">
194
+ <textarea class="form-control" id="chat" rows="9"></textarea>
195
+ <div id="chat-input-area">
196
+ <div>
197
+ <input type="text" class="form-control" id="entry"
198
+ placeholder="Type your message here" />
199
+ </div>
200
+ <div>
201
+ <button
202
+ id="send-button"
203
+ class="btn btn-primary"
204
+ type="button"
205
+ onclick="appActions.enterText()"
206
+ disabled
207
+ >
208
+ Send
209
+ </button>
210
+ </div>
211
+ </div>
212
+ </div>
213
+ </div>
214
+ </div>
215
+
216
+ <div id="screenshare-area">
217
+ <div>
218
+ <span id="screenshare-info">
219
+ </span>
220
+ <span id="screenshare-resolution">
221
+ </span>
222
+ </div>
223
+ <video id="screenshare-video" autoplay playsinline></video>
224
+ </div>
225
+
226
+ <div id="participants-area">
223
227
  </div>
224
228
 
225
- <div class="row" id="remote-area"></div>
226
- <div class="row" id="local-area">
227
- <div class="col-md-6 video-container" id="local-video"></div>
229
+ <div id="log-area">
230
+ <textarea id="log"></textarea>
228
231
  </div>
229
232
  </div>
230
233
  <script src="bundle.js"></script>
234
+ <!-- for icons -->
235
+ <script src="https://kit.fontawesome.com/7c1c4c7e9c.js" crossorigin="anonymous"></script>
231
236
  </body>
232
237
  </html>