Como solução para esse projeto, eu utilizei dois arrays. O primeiro para armazenar os nomes escolhidos e o segundo para armazenar os nomes sorteados. Meu código ficou assim:
let nomesInseridos = [];
let nomesSorteados = [];
function adicionar () {
let nomeAmigo = document.getElementById('nome-amigo').value;
nomesInseridos.push(` ${nomeAmigo}`);
let listaNomes = document.getElementById('lista-amigos');
listaNomes.innerHTML = `${nomesInseridos} `;
limparCampo();
document.getElementById('nome-amigo').focus();
}
Para construir a function sortear ()
, eu pensei em sortear números entre 0 e o último índice do array nomesInseridos
dentro de um while e depois usei if para verificar se o valor do índice sorteado não era igual ao controlador do atual array, evitando assim que uma pessoa se sorteasse. Também fiz uma verificação para que um índice já sorteado não fosse utilizado novamente. Ficou assim:
function sortear () {
let tamanho = nomesInseridos.length;
let i = 0;
while (i < tamanho) {
let indice = parseInt(Math.random() * tamanho);
if (indice == i) {
i = i;
} else if (nomesSorteados.includes(nomesInseridos[indice])) {
i = i;
} else {
nomesSorteados[i] = nomesInseridos[indice];
i++;
}
}
exibirSorteio (tamanho);
}
Por fim, eu criei uma função para exibir o sorteio e a função reiniciar.
function exibirSorteio (tamanho) {
let listaSorteio = document.getElementById('lista-sorteio');
for (let i = 0; i < tamanho; i++) {
listaSorteio.innerHTML = listaSorteio.innerHTML +
`${nomesInseridos[i]} --> ${nomesSorteados[i]} <br>`;
}
}
function reiniciar () {
nomesInseridos = [];
nomesSorteados = [];
document.getElementById('nome-amigo').focus();
listaNomes = document.getElementById('lista-amigos');
listaNomes.innerHTML = '';
listaSorteio = document.getElementById('lista-sorteio');
listaSorteio.innerHTML = '';
}
Obs.: Em dois momentos eu utilizei document.getElementById('nome-amigo').focus()
para já ativar o cursor no campo para inserir o nome do amigo.