1
Fork 0
mirror of https://github.com/jech/galene.git synced 2024-11-22 16:45:58 +01:00

Improve typing of javascript code.

We now enable typing of sfu.js.
This commit is contained in:
Juliusz Chroboczek 2020-09-20 14:33:13 +02:00
parent 4e14c29fbb
commit 0aa77441bd
3 changed files with 266 additions and 118 deletions

View file

@ -7,7 +7,8 @@
/**
* toHex formats an array as a hexadecimal string.
* @returns {string}
* @param {number[]|Uint8Array} array - the array to format
* @returns {string} - the hexadecimal representation of array
*/
function toHex(array) {
let a = new Uint8Array(array);
@ -37,43 +38,52 @@ function randomid() {
function ServerConnection() {
/**
* The id of this connection.
*
* @type {string}
* @const
*/
this.id = randomid();
/**
* The group that we have joined, or nil if we haven't joined yet.
*
* @type {string}
*/
this.group = null;
/**
* The underlying websocket.
*
* @type {WebSocket}
*/
this.socket = null;
/**
* The set of all up streams, indexed by their id.
* @type {Object.<string,Stream>}
*
* @type {Object<string,Stream>}
*/
this.up = {};
/**
* The set of all down streams, indexed by their id.
* @type {Object.<string,Stream>}
*
* @type {Object<string,Stream>}
*/
this.down = {};
/**
* The ICE configuration used by all associated streams.
* @type {Array.<RTCIceServer>}
*
* @type {RTCIceServer[]}
*/
this.iceServers = null;
/**
* The permissions granted to this connection.
* @type {Object.<string,boolean>}
*
* @type {Object<string,boolean>}
*/
this.permissions = {};
/**
* clientdata is a convenient place to attach data to a ServerConnection.
* It is not used by the library.
* @type{Object.<string,any>}
*
* @type{Object<any,any>}
*/
this.userdata = {};
@ -81,46 +91,54 @@ function ServerConnection() {
/**
* onconnected is called when the connection has been established
* @type{function(): any}
*
* @type{(this: ServerConnection) => any}
*/
this.onconnected = null;
/**
* onclose is called when the connection is closed
* @type{function(number, string): any}
*
* @type{(this: ServerConnection, code: number, reason: string) => any}
*/
this.onclose = null;
/**
* onuser is called whenever a user is added or removed from the group
* @type{function(string, string, string): any}
*
* @type{(this: ServerConnection, id: string, kind: string, username: string) => any}
*/
this.onuser = null;
/**
* onpermissions is called whenever the current user's permissions change
* @type{function(Object.<string,boolean>): any}
*
* @type{(this: ServerConnection, permissions: Object<string,boolean>) => any}
*/
this.onpermissions = null;
/**
* ondownstream is called whenever a new down stream is added. It
* should set up the stream's callbacks; actually setting up the UI
* should be done in the stream's ondowntrack callback.
* @type{function(Stream): any}
*
* @type{(this: ServerConnection, stream: Stream) => any}
*/
this.ondownstream = null;
/**
* onchat is called whenever a new chat message is received.
* @type {function(string, string, string, string): any}
*
* @type {(this: ServerConnection, id: string, username: string, kind: string, message: string) => any}
*/
this.onchat = null;
/**
* onclearchat is called whenever the server requests that the chat
* be cleared.
* @type{function(): any}
*
* @type{(this: ServerConnection) => any}
*/
this.onclearchat = null;
/**
* onusermessage is called when the server sends an error or warning
* message that should be displayed to the user.
* @type{function(string, string): any}
*
* @type{(this: ServerConnection, kind: string, message: string) => any}
*/
this.onusermessage = null;
}
@ -132,14 +150,14 @@ function ServerConnection() {
* @property {string} [id]
* @property {string} [username]
* @property {string} [password]
* @property {Object.<string,boolean>} [permissions]
* @property {Object<string,boolean>} [permissions]
* @property {string} [group]
* @property {string} [value]
* @property {RTCSessionDescriptionInit} [offer]
* @property {RTCSessionDescriptionInit} [answer]
* @property {RTCIceCandidate} [candidate]
* @property {Object.<string,string>} [labels]
* @property {Object.<string,(boolean|number)>} [request]
* @property {Object<string,string>} [labels]
* @property {Object<string,(boolean|number)>} [request]
*/
/**
@ -157,17 +175,18 @@ ServerConnection.prototype.close = function() {
*/
ServerConnection.prototype.send = function(m) {
if(!this.socket || this.socket.readyState !== this.socket.OPEN) {
// send on a closed connection doesn't throw
// send on a closed socket doesn't throw
throw(new Error('Connection is not open'));
}
return this.socket.send(JSON.stringify(m));
}
/** getIceServers fetches an ICE configuration from the server and
/**
* getIceServers fetches an ICE configuration from the server and
* populates the iceServers field of a ServerConnection. It is called
* lazily by connect.
*
* @returns {Promise<Array.<Object>>}
* @returns {Promise<RTCIceServer[]>}
* @function
*/
ServerConnection.prototype.getIceServers = async function() {
@ -294,8 +313,8 @@ ServerConnection.prototype.connect = async function(url) {
/**
* login authenticates with the server.
*
* @param {string} username
* @param {string} password
* @param {string} username - the username to login as.
* @param {string} password - the password.
*/
ServerConnection.prototype.login = function(username, password) {
this.send({
@ -324,7 +343,7 @@ ServerConnection.prototype.join = function(group) {
* @param {string} what - One of '', 'audio', 'screenshare' or 'everything'.
*/
ServerConnection.prototype.request = function(what) {
/** @type {Object.<string,boolean>} */
/** @type {Object<string,boolean>} */
let request = {};
switch(what) {
case '':
@ -422,7 +441,7 @@ ServerConnection.prototype.chat = function(username, kind, message) {
*
* @param {string} kind - One of "clearchat", "lock", "unlock", "record or
* "unrecord".
* @param {string} [message]
* @param {string} [message] - An optional user-readable message.
*/
ServerConnection.prototype.groupAction = function(kind, message) {
this.send({
@ -436,8 +455,8 @@ ServerConnection.prototype.groupAction = function(kind, message) {
* userAction sends a request to act on a user.
*
* @param {string} kind - One of "op", "unop", "kick", "present", "unpresent".
* @param {string} id
* @param {string} [message]
* @param {string} id - The id of the user to act upon.
* @param {string} [message] - An optional user-readable message.
*/
ServerConnection.prototype.userAction = function(kind, id, message) {
this.send({
@ -452,7 +471,7 @@ ServerConnection.prototype.userAction = function(kind, id, message) {
* Called when we receive an offer from the server. Don't call this.
*
* @param {string} id
* @param {Object.<string, string>} labels
* @param {Object<string, string>} labels
* @param {RTCSessionDescriptionInit} offer
* @param {boolean} renegotiate
* @function
@ -656,12 +675,14 @@ function Stream(sc, id, pc) {
* The associated ServerConnection.
*
* @type {ServerConnection}
* @const
*/
this.sc = sc;
/**
* The id of this stream.
*
* @type {string}
* @const
*/
this.id = id;
/**
@ -693,20 +714,20 @@ function Stream(sc, id, pc) {
/**
* Track labels, indexed by track id.
*
* @type {Object.<string,string>}
* @type {Object<string,string>}
*/
this.labels = {};
/**
* Track labels, indexed by mid.
*
* @type {Object.<string,string>}
* @type {Object<string,string>}
*/
this.labelsByMid = {};
/**
* Buffered ICE candidates. This will be flushed by flushIceCandidates
* when the PC becomes stable.
*
* @type {Array.<RTCIceCandidate>}
* @type {RTCIceCandidate[]}
*/
this.iceCandidates = [];
/**
@ -721,7 +742,7 @@ function Stream(sc, id, pc) {
* a dictionary indexed by track id, with each value a disctionary of
* statistics.
*
* @type {Object.<string,any>}
* @type {Object<string,any>}
*/
this.stats = {};
/**
@ -734,7 +755,7 @@ function Stream(sc, id, pc) {
/**
* clientdata is a convenient place to attach data to a Stream.
* It is not used by the library.
* @type{Object.<string,any>}
* @type{Object<any,any>}
*/
this.userdata = {};
@ -743,21 +764,21 @@ function Stream(sc, id, pc) {
/**
* onclose is called when the stream is closed.
*
* @type{function(): any}
* @type{(this: Stream) => any}
*/
this.onclose = null;
/**
* onerror is called whenever an error occurs. If the error is
* fatal, then onclose will be called afterwards.
*
* @type{function(any): any}
* @type{(this: Stream, error: any) => any}
*/
this.onerror = null;
/**
* onnegotiationcompleted is called whenever negotiation or
* renegotiation has completed.
*
* @type{function(): any}
* @type{(this: Stream) => any}
*/
this.onnegotiationcompleted = null;
/**
@ -765,32 +786,32 @@ function Stream(sc, id, pc) {
* If the stream parameter differs from its previous value, then it
* indicates that the old stream has been discarded.
*
* @type{function(MediaStreamTrack, RTCRtpTransceiver, string, MediaStream): any}
* @type{(this: Stream, track: MediaStreamTrack, transceiver: RTCRtpTransceiver, label: string, stream: MediaStream) => any}
*/
this.ondowntrack = null;
/**
* onlabel is called whenever the server sets a new label for the stream.
*
* @type{function(string): any}
* @type{(this: Stream, label: string) => any}
*/
this.onlabel = null;
/**
* onstatus is called whenever the status of the stream changes.
*
* @type{function(string): any}
* @type{(this: Stream, status: string) => any}
*/
this.onstatus = null;
/**
* onabort is called when the server requested that an up stream be
* closed. It is the resposibility of the client to close the stream.
*
* @type{function(): any}
* @type{(this: Stream) => any}
*/
this.onabort = null;
/**
* onstats is called when we have new statistics about the connection
*
* @type{function(Object.<string,any>): any}
* @type{(this: Stream, stats: Object<any,any>) => any}
*/
this.onstats = null;
}
@ -834,6 +855,7 @@ Stream.prototype.close = function(sendclose) {
* @function
*/
Stream.prototype.flushIceCandidates = async function () {
/** @type {Promise<any>[]} */
let promises = [];
this.iceCandidates.forEach(c => {
promises.push(this.pc.addIceCandidate(c).catch(console.warn));
@ -845,16 +867,16 @@ Stream.prototype.flushIceCandidates = async function () {
/**
* negotiate negotiates or renegotiates an up stream. It is called
* automatically when required. If the client requires renegotiation, it
* is probably more effective to call restartIce on the underlying PC
* rather than invoking this function directly.
* is probably better to call restartIce which will cause negotiate to be
* called asynchronously.
*
* @function
* @param {boolean} [restartIce]
* @param {boolean} [restartIce] - Whether to restart ICE.
*/
Stream.prototype.negotiate = async function (restartIce) {
let c = this;
let options = null;
let options = {};
if(restartIce)
options = {iceRestart: true};
let offer = await c.pc.createOffer(options);
@ -892,8 +914,7 @@ Stream.prototype.negotiate = async function (restartIce) {
Stream.prototype.restartIce = function () {
let c = this;
/** @ts-ignore */
if(typeof c.pc.restartIce === 'function') {
if('restartIce' in c.pc) {
try {
/** @ts-ignore */
c.pc.restartIce();
@ -988,7 +1009,7 @@ Stream.prototype.updateStats = async function() {
* setStatsInterval sets the interval in milliseconds at which the onstats
* handler will be called. This is only useful for up streams.
*
* @param {number} ms
* @param {number} ms - The interval in milliseconds.
*/
Stream.prototype.setStatsInterval = function(ms) {
let c = this;

View file

@ -103,9 +103,8 @@ function storeSettings(settings) {
*
* @returns {settings}
*/
function getSettings() {
/** @type{settings} */
/** @type {settings} */
let settings;
try {
let json = window.sessionStorage.getItem('settings');
@ -127,22 +126,50 @@ function updateSettings(settings) {
storeSettings(s);
}
/**
* @param {string} id
*/
function getSelectElement(id) {
let elt = document.getElementById(id);
if(!elt || !(elt instanceof HTMLSelectElement))
throw new Error(`Couldn't find ${id}`);
return elt;
}
/**
* @param {string} id
*/
function getInputElement(id) {
let elt = document.getElementById(id);
if(!elt || !(elt instanceof HTMLInputElement))
throw new Error(`Couldn't find ${id}`);
return elt;
}
/**
* @param {string} id
*/
function getButtonElement(id) {
let elt = document.getElementById(id);
if(!elt || !(elt instanceof HTMLButtonElement))
throw new Error(`Couldn't find ${id}`);
return elt;
}
function reflectSettings() {
let settings = getSettings();
let store = false;
setLocalMute(settings.localMute);
let videoselect =
/** @type {HTMLSelectElement} */(document.getElementById('videoselect'));
let videoselect = getSelectElement('videoselect');
if(!settings.video || !selectOptionAvailable(videoselect, settings.video)) {
settings.video = selectOptionDefault(videoselect);
store = true;
}
videoselect.value = settings.video;
let audioselect =
/** @type {HTMLSelectElement} */(document.getElementById('audioselect'));
let audioselect = getSelectElement('audioselect');
if(!settings.audio || !selectOptionAvailable(audioselect, settings.audio)) {
settings.audio = selectOptionDefault(audioselect);
store = true;
@ -150,24 +177,24 @@ function reflectSettings() {
audioselect.value = settings.audio;
if(settings.request)
document.getElementById('requestselect').value = settings.request;
getSelectElement('requestselect').value = settings.request;
else {
settings.request = document.getElementById('requestselect').value;
settings.request = getSelectElement('requestselect').value;
store = true;
}
if(settings.send)
document.getElementById('sendselect').value = settings.send;
getSelectElement('sendselect').value = settings.send;
else {
settings.send = document.getElementById('sendselect').value;
settings.send = getSelectElement('sendselect').value;
store = true;
}
document.getElementById('activitybox').checked = settings.activityDetection;
getInputElement('activitybox').checked = settings.activityDetection;
document.getElementById('blackboardbox').checked = settings.blackboardMode;
getInputElement('blackboardbox').checked = settings.blackboardMode;
document.getElementById('studiobox').checked = settings.studioMode;
getInputElement('studiobox').checked = settings.studioMode;
if(store)
storeSettings(settings);
@ -218,9 +245,9 @@ function setConnected(connected) {
} else {
resetUsers();
let userpass = getUserPass();
document.getElementById('username').value =
getInputElement('username').value =
userpass ? userpass.username : '';
document.getElementById('password').value =
getInputElement('password').value =
userpass ? userpass.password : '';
statspan.textContent = 'Disconnected';
statspan.classList.remove('connected');
@ -234,6 +261,7 @@ function setConnected(connected) {
}
}
/** @this {ServerConnection} */
function gotConnected() {
setConnected(true);
let up = getUserPass();
@ -243,6 +271,7 @@ function gotConnected() {
}
/**
* @this {ServerConnection}
* @param {number} code
* @param {string} reason
*/
@ -255,6 +284,7 @@ function gotClose(code, reason) {
}
/**
* @this {ServerConnection}
* @param {Stream} c
*/
function gotDownStream(c) {
@ -291,12 +321,12 @@ setViewportHeight();
addEventListener('resize', setViewportHeight);
addEventListener('orientationchange', setViewportHeight);
document.getElementById('presentbutton').onclick = function(e) {
getButtonElement('presentbutton').onclick = function(e) {
e.preventDefault();
addLocalMedia();
};
document.getElementById('unpresentbutton').onclick = function(e) {
getButtonElement('unpresentbutton').onclick = function(e) {
e.preventDefault();
delUpMediaKind('local');
resizePeers();
@ -353,26 +383,34 @@ function setLocalMute(mute) {
}
}
document.getElementById('videoselect').onchange = function(e) {
getSelectElement('videoselect').onchange = function(e) {
e.preventDefault();
if(!(this instanceof HTMLSelectElement))
throw new Error('Unexpected type for this');
updateSettings({video: this.value});
changePresentation();
};
document.getElementById('audioselect').onchange = function(e) {
getSelectElement('audioselect').onchange = function(e) {
e.preventDefault();
if(!(this instanceof HTMLSelectElement))
throw new Error('Unexpected type for this');
updateSettings({audio: this.value});
changePresentation();
};
document.getElementById('blackboardbox').onchange = function(e) {
getInputElement('blackboardbox').onchange = function(e) {
e.preventDefault();
if(!(this instanceof HTMLInputElement))
throw new Error('Unexpected type for this');
updateSettings({blackboardMode: this.checked});
changePresentation();
}
document.getElementById('studiobox').onchange = function(e) {
getInputElement('studiobox').onchange = function(e) {
e.preventDefault();
if(!(this instanceof HTMLInputElement))
throw new Error('Unexpected type for this');
updateSettings({studioMode: this.checked});
changePresentation();
}
@ -413,7 +451,9 @@ function getMaxVideoThroughput() {
}
}
document.getElementById('sendselect').onchange = async function(e) {
getSelectElement('sendselect').onchange = async function(e) {
if(!(this instanceof HTMLSelectElement))
throw new Error('Unexpected type for this');
updateSettings({send: this.value});
let t = getMaxVideoThroughput();
for(let id in serverConnection.up) {
@ -423,8 +463,10 @@ document.getElementById('sendselect').onchange = async function(e) {
}
}
document.getElementById('requestselect').onchange = function(e) {
getSelectElement('requestselect').onchange = function(e) {
e.preventDefault();
if(!(this instanceof HTMLSelectElement))
throw new Error('Unexpected type for this');
updateSettings({request: this.value});
serverConnection.request(this.value);
};
@ -433,7 +475,9 @@ const activityDetectionInterval = 200;
const activityDetectionPeriod = 700;
const activityDetectionThreshold = 0.2;
document.getElementById('activitybox').onchange = function(e) {
getInputElement('activitybox').onchange = function(e) {
if(!(this instanceof HTMLInputElement))
throw new Error('Unexpected type for this');
updateSettings({activityDetection: this.checked});
for(let id in serverConnection.down) {
let c = serverConnection.down[id];
@ -446,6 +490,10 @@ document.getElementById('activitybox').onchange = function(e) {
}
}
/**
* @this {Stream}
* @param {Object<string,any>} stats
*/
function gotUpStats(stats) {
let c = this;
@ -477,8 +525,12 @@ function setActive(c, value) {
peer.classList.remove('peer-active');
}
/**
* @this {Stream}
* @param {Object<string,any>} stats
*/
function gotDownStats(stats) {
if(!document.getElementById('activitybox').checked)
if(!getInputElement('activitybox').checked)
return;
let c = this;
@ -514,7 +566,11 @@ function addSelectOption(select, label, value) {
if(!value)
value = label;
for(let i = 0; i < select.children.length; i++) {
let child = /** @type {HTMLOptionElement} */ (select.children[i]);
let child = select.children[i];
if(!(child instanceof HTMLOptionElement)) {
console.warn('Unexpected select child');
continue;
}
if(child.value === value) {
if(child.label !== label) {
child.label = label;
@ -536,10 +592,13 @@ function addSelectOption(select, label, value) {
function selectOptionAvailable(select, value) {
let children = select.children;
for(let i = 0; i < children.length; i++) {
let child = /** @type {HTMLOptionElement} */ (select.children[i]);
if(child.value === value) {
return true;
let child = select.children[i];
if(!(child instanceof HTMLOptionElement)) {
console.warn('Unexpected select child');
continue;
}
if(child.value === value)
return true;
}
return false;
}
@ -551,7 +610,11 @@ function selectOptionAvailable(select, value) {
function selectOptionDefault(select) {
/* First non-empty option. */
for(let i = 0; i < select.children.length; i++) {
let child = /** @type {HTMLOptionElement} */ (select.children[i]);
let child = select.children[i];
if(!(child instanceof HTMLOptionElement)) {
console.warn('Unexpected select child');
continue;
}
if(child.value)
return child.value;
}
@ -587,13 +650,13 @@ async function setMediaChoices(done) {
if(d.kind === 'videoinput') {
if(!label)
label = `Camera ${cn}`;
addSelectOption(document.getElementById('videoselect'),
addSelectOption(getSelectElement('videoselect'),
label, d.deviceId);
cn++;
} else if(d.kind === 'audioinput') {
if(!label)
label = `Microphone ${mn}`;
addSelectOption(document.getElementById('audioselect'),
addSelectOption(getSelectElement('audioselect'),
label, d.deviceId);
mn++;
}
@ -693,6 +756,7 @@ async function addLocalMedia(id) {
stopUpMedia(old);
let constraints = {audio: audio, video: video};
/** @type {MediaStream} */
let stream = null;
try {
stream = await navigator.mediaDevices.getUserMedia(constraints);
@ -717,11 +781,11 @@ async function addLocalMedia(id) {
t.enabled = false;
} else if(t.kind == 'video') {
if(settings.blackboardMode) {
if('contentHint' in t)
/** @ts-ignore */
t.contentHint = 'detail';
}
}
let sender = c.pc.addTrack(t, stream);
c.pc.addTrack(t, stream);
});
c.onstats = gotUpStats;
@ -730,12 +794,16 @@ async function addLocalMedia(id) {
setButtonsVisibility();
}
async function addShareMedia(setup) {
async function addShareMedia() {
if(!getUserPass())
return;
/** @type {MediaStream} */
let stream = null;
try {
if(!('getDisplayMedia' in navigator.mediaDevices))
throw new Error('Your browser does not support screen sharing');
/** @ts-ignore */
stream = await navigator.mediaDevices.getDisplayMedia({video: true});
} catch(e) {
console.error(e);
@ -747,7 +815,7 @@ async function addShareMedia(setup) {
c.kind = 'screenshare';
c.stream = stream;
stream.getTracks().forEach(t => {
let sender = c.pc.addTrack(t, stream);
c.pc.addTrack(t, stream);
t.onended = e => {
delUpMedia(c);
};
@ -807,6 +875,9 @@ function delUpMediaKind(kind) {
hideVideo();
}
/**
* @param {string} kind
*/
function findUpMedia(kind) {
for(let id in serverConnection.up) {
if(serverConnection.up[id].kind === kind)
@ -815,6 +886,9 @@ function findUpMedia(kind) {
return null;
}
/**
* @param {boolean} mute
*/
function muteLocalTracks(mute) {
if(!serverConnection)
return;
@ -846,12 +920,14 @@ function setMedia(c, isUp) {
peersdiv.appendChild(div);
}
let media = document.getElementById('media-' + c.id);
let media = /** @type {HTMLVideoElement} */
(document.getElementById('media-' + c.id));
if(!media) {
media = document.createElement('video');
media.id = 'media-' + c.id;
media.classList.add('media');
media.autoplay = true;
/** @ts-ignore */
media.playsinline = true;
media.controls = true;
if(isUp)
@ -883,7 +959,9 @@ function delMedia(id) {
let peer = document.getElementById('peer-' + id);
if(!peer)
throw new Error('Removing unknown media');
let media = document.getElementById('media-' + id);
let media = /** @type{HTMLVideoElement} */
(document.getElementById('media-' + id));
media.srcObject = null;
mediadiv.removeChild(peer);
@ -941,14 +1019,19 @@ function resizePeers() {
if (!count)
// No video, nothing to resize.
return;
let size = 100 / columns;
let container = document.getElementById("video-container")
// Peers div has total padding of 30px, we remove 30 on offsetHeight
let max_video_height = Math.trunc((peers.offsetHeight - 30) / columns);
let media_list = document.getElementsByClassName("media");
for(let i = 0; i < media_list.length; i++)
media_list[i].style['max_height'] = max_video_height + "px";
for(let i = 0; i < media_list.length; i++) {
let media = media_list[i];
if(!(media instanceof HTMLMediaElement)) {
console.warn('Unexpected media');
continue;
}
media.style['max_height'] = max_video_height + "px";
}
if (count <= 2 && container.offsetHeight > container.offsetWidth) {
peers.style['grid-template-columns'] = "repeat(1, 1fr)";
@ -957,7 +1040,7 @@ function resizePeers() {
}
}
/** @type{Object.<string,string>} */
/** @type{Object<string,string>} */
let users = {};
/**
@ -1051,7 +1134,7 @@ function clearUsername() {
}
/**
* @param {Object.<string,boolean>} perms
* @param {Object<string,boolean>} perms
*/
function gotPermissions(perms) {
displayUsername();
@ -1064,7 +1147,7 @@ const urlRegexp = /https?:\/\/[-a-zA-Z0-9@:%/._\\+~#=?]+[-a-zA-Z0-9@:%/_\\+~#=]/
/**
* @param {string} line
* @returns {Array.<Text|HTMLElement>}
* @returns {(Text|HTMLElement)[]}
*/
function formatLine(line) {
let r = new RegExp(urlRegexp);
@ -1088,7 +1171,7 @@ function formatLine(line) {
}
/**
* @param {Array.<string>} lines
* @param {string[]} lines
* @returns {HTMLElement}
*/
function formatLines(lines) {
@ -1113,6 +1196,12 @@ function formatLines(lines) {
/** @type {lastMessage} */
let lastMessage = {};
/**
* @param {string} peerId
* @param {string} nick
* @param {string} kind
* @param {string} message
*/
function addToChatbox(peerId, nick, kind, message){
let userpass = getUserPass();
let row = document.createElement('div');
@ -1174,7 +1263,7 @@ function clearChat() {
* part may be quoted and may include backslash escapes.
*
* @param {string} line
* @returns {Array.<string>}
* @returns {string[]}
*/
function parseCommand(line) {
let i = 0;
@ -1204,7 +1293,8 @@ function parseCommand(line) {
}
function handleInput() {
let input = document.getElementById('input');
let input = /** @type {HTMLTextAreaElement} */
(document.getElementById('input'));
let data = input.value;
input.value = '';
@ -1356,39 +1446,66 @@ function chatResizer(e) {
document.getElementById('resizer').addEventListener('mousedown', chatResizer, false);
/** @enum {string} */
const MessageLevel = {
info: 'info',
warning: 'warning',
error: 'error',
}
function displayError(message, level, position, gravity) {
var background = "linear-gradient(to right, #e20a0a, #df2d2d)";
if (level === "info") {
background = "linear-gradient(to right, #529518, #96c93d)";
}
if (level === "warning") {
/**
* @param {string} message
* @param {MessageLevel} [level]
*/
function displayError(message, level) {
if(!level)
level = MessageLevel.error;
var background = 'linear-gradient(to right, #e20a0a, #df2d2d)';
var position = 'center';
var gravity = 'top';
switch(level) {
case MessageLevel.info:
background = 'linear-gradient(to right, #529518, #96c93d)';
position = 'right';
gravity = 'bottom';
break;
case MessageLevel.warning:
background = "linear-gradient(to right, #edd800, #c9c200)";
break;
}
/** @ts-ignore */
Toastify({
text: message,
duration: 4000,
close: true,
position: position ? position: 'center',
gravity: gravity ? gravity : 'top',
position: position,
gravity: gravity,
backgroundColor: background,
className: level,
}).showToast();
}
/**
* @param {string} message
*/
function displayWarning(message) {
let level = "warning";
return displayError(message, level);
return displayError(message, MessageLevel.warning);
}
/**
* @param {string} message
*/
function displayMessage(message) {
return displayError(message, "info", "right", "bottom");
return displayError(message, MessageLevel.info);
}
document.getElementById('userform').onsubmit = function(e) {
e.preventDefault();
let username = document.getElementById('username').value.trim();
let password = document.getElementById('password').value;
let username = getInputElement('username').value.trim();
let password = getInputElement('password').value;
storeUserPass(username, password);
serverConnect();
};
@ -1438,6 +1555,8 @@ document.getElementById('clodeside').onclick = function(e) {
document.getElementById('collapse-video').onclick = function(e) {
e.preventDefault();
if(!(this instanceof HTMLElement))
throw new Error('Unexpected type for this');
let width = window.innerWidth;
if (width <= 768) {
let user_box = document.getElementById('userDropdown');
@ -1453,6 +1572,8 @@ document.getElementById('collapse-video').onclick = function(e) {
document.getElementById('switch-video').onclick = function(e) {
e.preventDefault();
if(!(this instanceof HTMLElement))
throw new Error('Unexpected type for this');
showVideo();
this.style.display = "";
document.getElementById('collapse-video').style.display = "block";

View file

@ -4,10 +4,16 @@
"allowJs": true,
"checkJs": true,
"declaration": true,
"noImplicitThis": true,
"emitDeclarationOnly": true,
"strictBindCallApply": true
"strictFunctionTypes": true,
"strictBindCallApply": true,
"noFallthroughCasesInSwitch": true,
"noImplicitReturns": true,
"noUnusedLocals": true
},
"files": [
"protocol.js"
"protocol.js",
"sfu.js"
]
}