Vinnaren i pepparkakshustävlingen!
2018-04-02, 12:30
  #1
Medlem
Worldnatures avatar
Hej!

Jag sitter och jobbar på ett quiz nu, och har endast en score lista som ska vara en topp 5 lista kvar och localstorage för att spara det.

Är rätt ny på detta så skulle behöva all hjälp.

Kod:
var highScore = []
var score = { smeknamn: name, sekunder : totaltime }
highScore.push(score)


console.log(highScore[0].name)

tror att detta kan vara något på vägen, men vet inte i så fall hur jag ska ta mig vidare direkt för att få ut en topp 5 lista som sparar resultatet med, med localstorage.

Har en variabel som heter name som är en tom string. Let name = '' har jag satt den som, den och lite kod till hämtar liksom nicknamet, sen har jag en totaltime som hämtar den totala tiden så jag har gjort så att man har 20 sekunder på sig att svara på varje fråga.

Hade uppskattat all hjälp med att kunna ta mig vidare från detta och lyckas fixa detta.

sitter fast och vet inte riktigt hur jag ska lösa detta, om denna kod ovanför är rätt ens.
Citera
2018-04-02, 15:00
  #2
Medlem
Citat:
Ursprungligen postat av Worldnature
Jag sitter och jobbar på ett quiz nu

Jaså?

Har du läst på om LocalStorage? Har du en idé om hur du vill att det ska fungera? Det vill säga, kan du beskriva i ord hur du vill att programmet ska gå till väga?
Citera
2018-04-02, 15:15
  #3
Medlem
Worldnatures avatar
Citat:
Ursprungligen postat av Nich
Jaså?

Har du läst på om LocalStorage? Har du en idé om hur du vill att det ska fungera? Det vill säga, kan du beskriva i ord hur du vill att programmet ska gå till väga?


Nej, inte så mycket alls faktiskt, får göra det lite mer nu.

Jag vill skapa en topp 5 lista, där nickname och totala tiden syns, den totala tiden gör så att det ska sparas i ordning på topp 5 listan om du förstår. finns det 5 nickname som finns på listan, och du spelar, du får bättre tid än plats 2 men inte 1, då hamnar du där på plats 2 och personen som var på 2 åker ner till 3 om du fattar.

Går det att lösa liknande så här? eller är det alldeles för komplicerat?
Citera
2018-04-02, 15:46
  #4
Medlem
Citat:
Ursprungligen postat av Worldnature
Nej, inte så mycket alls faktiskt, får göra det lite mer nu.

Ja, det är såklart en bra sak att göra om du nu vet att du ska använda localstorage.

Citat:
Ursprungligen postat av Worldnature
Jag vill skapa en topp 5 lista, där nickname och totala tiden syns, den totala tiden gör så att det ska sparas i ordning på topp 5 listan om du förstår. finns det 5 nickname som finns på listan, och du spelar, du får bättre tid än plats 2 men inte 1, då hamnar du där på plats 2 och personen som var på 2 åker ner till 3 om du fattar.

Går det att lösa liknande så här? eller är det alldeles för komplicerat?

Det är inte alls komplicerat. Jag skulle lösa det ungefär så här:

1. Hämta aktuell topplista från localstorage.
2. Lägg till det nya objektet i listan med .push().
3. Sortera listan efter tid (kortast tid först antar jag) med .sort().
4. Plocka de 5 första med .slice().
5. Spara till localstorage.

Jag är inte helt säker på huruvida du kan spara objekt som de är i localstorage, dock. Du kan behöva konvertera till JSON.
Citera
2018-04-02, 15:54
  #5
Medlem
Worldnatures avatar
Citat:
Ursprungligen postat av Nich
Ja, det är såklart en bra sak att göra om du nu vet att du ska använda localstorage.



Det är inte alls komplicerat. Jag skulle lösa det ungefär så här:

1. Hämta aktuell topplista från localstorage.
2. Lägg till det nya objektet i listan med .push().
3. Sortera listan efter tid (kortast tid först antar jag) med .sort().
4. Plocka de 5 första med .slice().
5. Spara till localstorage.

Jag är inte helt säker på huruvida du kan spara objekt som de är i localstorage, dock. Du kan behöva konvertera till JSON.

kanon tack!

Testat detta lite tidigare, kan det vara något på väg kanske?
Kod:
function saveScore() {
  let highScore = []
  let score = { smeknamn: name, sekunder : totaltime }
  score.sort(totaltime)
  highScore.push(score)  
  highScore = JSON.parse(window.localStorage.getItem('highScore'))
  }  
Citera
2018-04-02, 18:41
  #6
Medlem
Citat:
Ursprungligen postat av Worldnature
kanon tack!

Testat detta lite tidigare, kan det vara något på väg kanske?
Kod:
function saveScore() {
  let highScore = []
  let score = { smeknamn: name, sekunder : totaltime }
  score.sort(totaltime)
  highScore.push(score)  
  highScore = JSON.parse(window.localStorage.getItem('highScore'))
  }  

Det är en början. Men först och främst måste du ju hämta sparade resultat om det finns några. En tom array behöver du bara skapa om det inte finns några resultat sparade.

Kod:
var hs = JSON.parse( localStorage.getItem( 'highscore' ) );

if( hs === null ) {
	hs = [];
}

Sen lägger du till det nya värdet.

Kod:
var myScore = { score: 21, name: 'Test' };
hs.push( myScore );

Sortera sedan. Observera att du måste skicka med en funktion som sköter sorteringsmekanismen. Att bara anropa .sort() kommer troligen inte fungera.

Kod:
hs.sort( function( a, b ) {
	return a.score - b.score;
} );

Vi vill bara ha de fem första.

Kod:
hs = hs.slice( 0, 5 );

Spara sedan.

Kod:
localStorage.setItem( 'highscore', JSON.stringify( hs ) );
Citera
2018-04-06, 12:11
  #7
Medlem
Worldnatures avatar
hej!

Jag sitter här och närmar mig så det börjar fungera nu tror jag

jag sitter på detta

Kod:
function quizCompleted() {
  document.getElementById('quiz-things').hidden = true
  document.getElementById('highScorePanel').hidden = false
  clearInterval(downloadTimer)
  let h1Text = '<h1>Highscore Lista</h1>'
    let h1Div = document.getElementById('highScorePanel')
    h1Div.innerHTML = h1Text

}
function quizScore() {
  highScore.sort(function (a, b) {
    return a.totaltime - b.totaltime
  })

  for (let i = 0; i < 5; i++){
    let scoreList = highScore[i]
    let toppList = document.createElement('li')
    let score = { nickname: name, totala : totaltime }
    highScore.push(score)  
    topHighScore.appendChild(score)
  
    //Avbryter loopen om det är så att arrayen inte har så många värden som efterfrågas
    if (i >= highScore.length-1)
        {
             break;
        }
  }
}
det som är i fet stil, försöker jag få ut, så att den hämtar ut nicknamet och den totalatiden och göra det i en topp 5 lista.

globalt har jag detta

Kod:
let topHighScore = document.getElementById('highScorePanel')
let highScore = []



Kod:
  if (jsonA.message == "Correct answer!")
  {
     if (jsonA.nextURL !== undefined)
     {
      questionURL = jsonA.nextURL
     }
     else {
      quizCompleted()
      quizScore()

     }
    }
  else {
    questionURL = 'http://vhost3.lnu.se:20080/question/1'
    document.getElementById('thistext').innerHTML = 'Du svarade fel, börja om.'
    clearInterval(downloadTimer)
    loss()
  }
  getNextQ()
}

och här hämtar jag funktionerna quizcomppleted och quizscore i else satsen.

Men problemet ligger i for loopen där tidigare i den fet markerade tror jag.

Hur kan man lösa detta så den hämtar det.

körde på detta innan, men då skriver den ut bara, och hämtar inte riktigt den ur highScore
Kod:
 toppList.textContent = '<p><b>' + name + '</b> klarade quizet på <b>' + totaltime + '</b> sekunder.</p>'
    topHighScore.appendChild(toppList)
Citera
2018-04-06, 14:56
  #8
Medlem
Är det någonting i den där uppgiften du inte skapat trådar om och frågat om exakt varje liten del av koden, grejen med den är ju att du ska lära dig.
Citera

Stöd Flashback

Flashback finansieras genom donationer från våra medlemmar och besökare. Det är med hjälp av dig vi kan fortsätta erbjuda en fri samhällsdebatt. Tack för ditt stöd!

Stöd Flashback