Ranking in javascript

1

I've managed to save the runners at the local Storage, however, I want, on another page, to compare the athletes over time and display a leaderboard with the competitors' name and time, how can I do that? Here's the code you've done so far:

window.addEventListener("load", showCorredores(JSON.parse(localStorage.getItem('Corredores'))), false)

document.getElementById("curriculo").addEventListener("submit", enviar,
  false)

function enviar(e) {

  var alt = document.getElementById('enviar').alt
  if (alt != undefined) {
    updateCorredor()

  } else {
    addCorredor()
    window.location.reload()

  }
  e.preventDefault()
}

function addCorredor(e) {

  // Obtém valores do formulário
  var nomeCorredor = document.getElementById("nome").value
  var idadeCorredor = document.getElementById("idade").value
  var tempoCorredor = document.getElementById("tempo").value
  var raiaCorredor = document.getElementById("raia").value


  // Define um objeto com os valores obtidos do formulário
  var corredor = {
    id: gerarIDCorredor(), // Adicionar
    nome: nomeCorredor,
    idade: idadeCorredor,
    tempo: tempoCorredor,
    raia: raiaCorredor
  }

  // Testa se a chave 'corredor' é nula (vazia)
  if (localStorage.getItem('Corredores') === null) {
    // Inicia o vetor (array)
    var corredores = []
    // Adiciona objeto no array
    corredores.push(corredor)
    // Armazena no localStorage - JSON.stringify = converte o JavaScript em 
    nota JSON
    localStorage.setItem('Corredores', JSON.stringify(corredores))
  } else {
    // Define uma nova variável e coloca o conteúdo de localStorage nela - 
    JSON.parse = converte a notação JSON em JavaScript
    var corredores = JSON.parse(localStorage.getItem('Corredores'))
    // Adiciona objeto no array
    corredores.push(corredor)
    // Re-armazena no localStorage - JSON.stringify = converte o JavaScript 
    em nota JSON
    localStorage.setItem('Corredores', JSON.stringify(corredores))

  }
  showCorredores(corredores)

  e.preventDefault()

}

function gerarIDCorredor() {
  var id = JSON.parse(localStorage.getItem('idCorredor'))
  if (id === null) {
    localStorage.setItem('idCorredor', 1)
  } else {
    id += 1
    localStorage.setItem('idCorredor', id)
  }
  return JSON.parse(localStorage.getItem('idCorredor'))
}


function setCorredor(i) {
  var corredores = JSON.parse(localStorage.getItem('Corredores'))
  document.getElementById('nome').value = corredores[i].nome
  document.getElementById('idade').value = corredores[i].idade
  document.getElementById('tempo').value = corredores[i].tempo
  document.getElementById('raia').value = corredores[i].raia
  document.getElementById('enviar').alt = i
}




function updateCorredor(posicao) {
  var corredores = JSON.parse(localStorage.getItem('Corredor'))

  var posicao = document.getElementById('enviar').alt

  corredores[posicao].nome = document.getElementById('nome').value
  corredores[posicao].idade = document.getElementById('idade').value
  corredores[posicao].tempo = document.getElementById('tempo').value
  corredores[posicao].raia = document.getElementById('raia').value

  localStorage.setItem('Corredores', JSON.stringify(corredores))
  document.getElementById('enviar').alt = ""
  showCorredores(corredores)
}



function deleteCorredor(i) {
  var corredores = JSON.parse(localStorage.getItem('Corredores'))
  // O método splice retira itens do Array, o argumento (i) é a posição em
  // que o item está no array e o segundo argumento indica a quantidade de 
  itens
  // que serão removidos.
  corredores.splice(i, 1)
  localStorage.setItem('Corredores', JSON.stringify(corredores))
  showCorredores(corredores)
}


function showCorredores(corredores) {
  // Pegar id (elemento HTML) de onde quero mostrar os corredores: "mostrar"
  var listarCorredores = document.getElementById('mostrar')
  // Construir a saída
  listarCorredores.innerHTML = ''
  if (corredores === null || corredores.length === 0) {
    listarCorredores.innerHTML = '<h3>Nenhum registro localizado</h3>'
  } else {
    for (var i = 0; i < corredores.length; i++) {
      listarCorredores.innerHTML += '<h4>' + corredores[i].nome + ' ' +
        corredores[i].idade + ' ' + corredores[i].tempo + ' ' +
        corredores[i].raia + '</h4>' +
        '<button onclick="deleteCorredor(' + i + ')">Excluir</button>' // 
      Adicionar
        +
        '<button onclick="setCorredor(' + i + ')">Editar</button>' // 
      Adicionar
    }

  }
}
    
asked by anonymous 22.04.2017 / 19:34

0 answers