-
Notifications
You must be signed in to change notification settings - Fork 0
/
todo.txt
77 lines (58 loc) · 2.75 KB
/
todo.txt
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
[ ] - P2P Mindmeet Talk
[ ] - Chat de menssagens P2P
[ ] - Video chamada P2P
[ ] - Audio chamada P2P
[ ] - Piscar bordar ao falar (Speek regonigtion)
[ ] - Estilizacao da video chamada
[ ] - Sons para deixar a coisa mais divertida
[ ] - Icones para deixar interface bonitinha (clipboard, toasts, etc)
[ ] - Mindmeet Signaling
[ ] - Websocket
[ ] - Controle e gerenciamento das salas
IDEIAS (Refatoracao e boas praticas)
- https://github.com/svarunan/serverless-webrtc/blob/master/js/plainwebrtc.js (refactor)
- https://github.com/anshuthopsee/p2p-webrtc (pass to Vue3 and Tailwind)
- https://github.com/miroslavpejic85/mirotalk (best practices and ideias)
Desafios:
1. Preciso de um link para enviar para o meu cliente entrar na chamada.
Requisitos:
O link precisa ser único, curto e simples.
2. Fazer a chamada de video funcionar da maneira correta
O meu link por ser unico, precisa ser compartilhado por um meio publico para meu cliente,
e quando ele entrar no link, ele vai "chamar" o outro participante da chamada para entrar
em uma chamada de video.
Ou seja o Link criado vai ser um canal que vai ser aberto por um participante e o outro vai
entrar nesse canal para fazer a chamada de video. esse canal vai esta aberto enquanto um usuario
estiver na chamada.
3. Fazer a chamada de audio funcionar da maneira correta
4. Fazer o chat funcionar da maneira correta.
O chat deve conter as seguintes informacoes
- Nome do usuario
- Mensagem
- Data da mensagem (HH:mm, hora e minuto)
Mensagens:
"Parece que você está sozinho aqui, que tal chamar um amigo para conversar?" (Mostrar Link da Sala para copiar)
Vai aparecer quando o usuario entrar na sala assim que criar ela.
"Voce foi desconectado da sala" (Mostrar em forma de Toast Message)
"Voce foi expulso da sala" (Mostrar em forma de Toast Message)
"Voce deseja aceitar XXXX entrar na sala?" (Mostar em forma de Modal no centro superior da tela)
"Ops, aconteceu um erro, tente novamente mais tarde" (Mostrar em forma de Toast Message)
"Link da sala copiado com sucesso" (Mostrar em forma de Toast Message)
"This app requires Camera/Microphone permission. Refresh the page and provide access."
----------GERAR QR CODE-----------------------------------------------------------------------------------
const input = document.querySelector("input");
const qrcode = document.querySelector("#qrcode");
document.addEventListener("keypress", (e) => {
if (e.key === "Enter") {
genQRCode();
}
});
function genQRCode() {
if (!input.value) return;
qrcode.src = `https://api.qrserver.com/v1/create-qr-code/?size=150x150&data=${input.value}`;
}
-----------
- Detalhes Legais
1. Contador de tempo no nome da sala quando o usuario estiver em outra ABA do navegador
2. Animacoes de entrada e saida
3. Sons