Inlägg

Inlägg som Howardtheory har skrivit i forumet
Av Howardtheory

hämta fråga ur api till sajt

tjenare. det är så att jag har en skoluppgift med att göra ett quiz och hämta en fråga ur api och sedan svaret.

jag försöker hämta frågan nu med denna kod.

async function myQuiz () { let myQ = await window.fetch(`http://vhost3.lnu.se:20080/question/1`) let jsonQ = await myQ.json() console.log(jsonQ) } // exports. module.exports = myQuiz

denna kod har jag i network.js

Sedan i app.js så kör jag let Quiz = require('./network')

console.log(Quiz)

med denna kod försöker jag hämta ut frågan ur länken i myQ för att se så det fungerar. Men när jag går in i min localhost://4000 efter jag kört npm start. Så går jag in på webbsidan, högerklickar, väljer inspektera och sedan kollar i consolen, för att se om frågan som finns i länken dyker fram, för gör den det så antar jag att detta fungerar, men när jag kör detta nu och kollar i consolen i webbläsaren så visas endast

async function myQuiz () { let myQ = await window.fetch(`http://vhost3.lnu.se:20080/question/1`) let jsonQ = await myQ.json() console.log(jsonQ) } // exports. module.exports = myQuiz

vad gör jag för fel? Hur hämtar jag frågan ur länken? gör jag inte rätt?

Av Howardtheory

@Leedow:

ok tack. Nä tänkte så med.

Den vita undermenyn är alltså lokal navigering om jag förstår det rätt och den blåa är den globala? Men som du ser på min sida, så behöver jag inte en lokal navigering, men det var det jag misslyckades på i uppgiften, så får försöka hitta något intresse som jag kan lägga in så det finns en lokal navigering annars.

Av Howardtheory

Som det ser ut så ska jag alltså göra en till meny i varje fil som är för "lokala" sidan?

http://www.bilddump.se/bilder/20180130130440-194.47.105.200.j...

är det det som saknas eller? jag behöver inte extra meny för lokalt för varje sida liksom?

Annars är det så jag borde göra?

Av Howardtheory

@anon14781: tack för svaret och hjälpen. Jag tänkte bara hur får man in det i min funktion showcase på bästa sett?

https://jsfiddle.net/ksL398xg/40/

har försökt, men misslyckats.

innan quizen startar så jag ett nickname man måste skriva in och en funktion där tiden räknar hur snabbt man svarar på de totala frågorna, som dyker upp i funktionen showcase, men hur får man inte localstorage och topp 5 listan med den koden du skrev på bästa sett?

Det ska liksom läggas till automatiskt, vilket det gör nu men inte i en lista och det sparas inte i https://jsfiddle.net/ksL398xg/40/ just nu.

Av Howardtheory

@anon14781: tack så mycket för svaret!

Hur gör jag dock så jag får in de "nickname" som dom skriver in istället för
{ name: 'Kalle', time: 29 },
{ name: 'Ulf', time: 46 },
{ name: 'Frej', time: 34 },
{ name: 'Einar', time: 12 },
{ name: 'Pelle', time: 23 }

som finns inne i funktionen nu? och så det sparas med webstorage, typ local?

Av Howardtheory

RESTful api, hjälp quiz

Hej!

är nybörjare inom detta och har skapat ett quiz med html, css och js kod. Jag skapade frågor och svar, (detta är en uppgift i skolan) men såg sedan efter att det var inte så man skulle göra, man ska alltså hämta hem frågor via RESTful api och svara på dom, nu har jag gjort det på flera och det ser ungefär ut så här.

{ "id": 1, "question": "What is 1+1?", "nextURL": "http://v****.se:20080/answer/1", "message": "You got your question! Now send me the answer via HTTP POST to the nextURL in JSON-format" }

jag svarade

{ "answer" : 2 }

och fick fram

{ "message": "Correct answer!", "nextURL": "http://v*****.se:20080/question/21" }

Är detta rätt gjort? Och jag fortsatte att göra så här på varje ny "nextURL" som dök upp.

Men hur ropar jag nu till mig dessa frågor och svar till mitt quiz?

quizet ser ut så här

https://jsfiddle.net/ksL398xg/40/ (glöm svaren och frågorna) gjorde egna vilket var fel som jag beskrev

Av Howardtheory

js lista med webstorage

Hej!

https://jsfiddle.net/ksL398xg/51/

där är sidan om hur allt ser ut

och det jag har kvar i uppgiften är att skapa en lista och spara det med webstorage i en topp 5 lista.

function showScores() { let gameOverHtml = "<h1>Resultat</h1>"; gameOverHtml += "<p>" + name + " klarade quizet på " + totaltime + " sekunder.</p>"; let element = document.getElementById("quiz"); element.innerHTML = gameOverHtml; }

Där är koden som jag har gjort, har skapat så namnet kommer fram och den totala tiden, nu är det bara att skapa en topp 5 lista som sparas i webstorage, vilket jag har zeeerrroo koll på och hoppas att någon kan hjälpa mig med detta. Ni har länken längst upp om hur allt i koden ser ut.

Av Howardtheory

Får inte till det riktigt asså.

function showScores() { let gameOverHtml = "<h1>Resultat</h1>"; gameOverHtml += "<h2 id='score'>Ditt resultat: " + quiz.score + "</h2>"; document.getElementsByClassName("grid").innerHTML var HTML = "<table border=1><tr>"; for(j=1;j <=10; j++) { HTML += "<td align=center>"+String.fromCharCode(j+64)+"</td>"; } HTML += "</tr></table>"; let hmhm = document.getElementById("quiz") hmhm.innerHTML = HTML; let element = document.getElementById("quiz"); element.innerHTML = gameOverHtml; }

Vad gör jag för fel? Vill ha en tabell där jag sparar information om användarnas tid i en topp 5 lista, då dom har 20 sekunder på sig att svara på varje fråga, och vill spara detta i webstorage, men har ingen aning om hur man gör.

https://jsfiddle.net/7r2npqe0/89/

där är hela sidan annars om ni vill se. Behöver all hjälp jag kan få

Av Howardtheory

skapa ul/li lista i function JS

Hej! jag har denna kod

function showScores() {
let gameOverHtml = "<h1>Resultat</h1>";
gameOverHtml += "<h2 id='score'>Ditt resultat: " + quiz.score + "</h2>";
let element = document.getElementById("quiz");
element.innerHTML = gameOverHtml;
}

Som dyker upp efter man svarat rätt på alla 5 frågor i quizen, då kommer det fram ditt resultat: 5 blir det.

Hur bygger man vidare så man kan bygga en ul/li lista på de topp 5 snabbaste svaren? Då jag gjort så att man har max 20 sekunder på sig att svara på varje fråga.

Av Howardtheory

sorry!

Jag behöver lite hjälp, sitter fast i huvudet nu.

https://jsfiddle.net/g61rg0od/45/

så ser koden o sidan ut, jag vill man inte ska kunna trycka på något av svaren förens man har skrivit in sitt nickname och klickat på välj, har för mig att det är en if sats som ska typ in under let button kanske? Vill att en alert ska komma upp som säger, "du måste skriva in nickname innan du kan starta quizen"

Är rätt ny inom JS med så ni vet. Hade uppskattat all hjälp där.

Av Howardtheory
Skrivet av Leedow:

Om du flyttar tilldelningen som sker på rad 14 ner in i knapp-metoden, ca rad 32, så borde #1 lösas.

Quiz-objektet är designad att ge poäng för rätt svar och inga poäng för fel svar, oavsett vad så tuggar den igenom alla frågor. Hur vill du att den ska fungera? Vid första felaktigt svar så börjar den om från början?

Hej tack för svar!

Har sedan tidigare testat att sätta in

var downloadTimer = setInterval(intervalTick,1000);

ner till

function updateBtn () { name = input.value document.getElementById("displayedName").innerHTML = name input.value = '' // clear input field }

Men det fungerar inte, den tickar fortfarande ner innan jag ens hinner skriva in nickname och klicka på knappen välj då jag vill att kl ska starta.

Ja exakt så, vid första felaktiga svar så ska den börja om, har du haft rätt på de två första och fel på tredje så får du börja om quizen samt om tiden hinner rinna ut på en fråga så får du börja om med.

Hade uppskattat all hjälp verkligen

Ha det bra!

Av Howardtheory

var name = ''; // Empty string var input = document.getElementById('nameInput'); var nameBtn = document.getElementById('nameButton'); var txt = document.querySelector('p'); nameBtn.addEventListener('click', updateBtn); function updateBtn () { name = input.value document.getElementById("displayedName").innerHTML = name input.value = '' // clear input field }

Jag tror man måste sätta min första globala Interval i function updateBtn function? Kan det stämma?

Nu hittar jag dock inte min första globala Interval i all min kod. Hade uppskattat om någon kan hjälpa mig, då jag är rätt ny med JS

Av Howardtheory

js, quiz/countdown

Hej!

Jag har ett litet problem här.

https://jsfiddle.net/jwaqwrrt/70/

där är koden som finns.

har två problem.

Första:
Det är så att jag har skapat en countdown och en alert när den kommer ner till 0 som säger den du har förlorat! men det är så att jag vill fixa så att det börjar räknas ner när man väl har skrivit in sitt nickname och klickat på knappen välj, då ska nedräkningen börja. Nu räknar den ner direkt så fort man kommer in på sidan.

andra:
Det andra är att, svarar man fel på en fråga eller tiden rinner ut så ska alert komma upp där det står du har fölorat som jag har fixat i countdown knappen, men vill ha det så även när dom svarar fel. Och då ska man kunna starta om spelet från fråga 1 igen.

Hade uppskattat all hjälp med detta om hur man löser dessa två problem

Av Howardtheory

@Dunder:

Tanken är att om man inte hunnit svara på 20 sekunder att tiden har hunnit rinna ut så har man förlorat och så ska det finnas en starta om knapp så man börjar om på fråga 1 igen. Men jag vill få in så att klarar man fråga 1 så kommer man till fråga två så ska det börjas om på 20 sekunder och klarar man fråga två på t.ex när det är 8 sekunder kvar så börjas det om på 20 sekunder på fråga tre igen.

Det är det jag vill ha hjälp med och får inte riktigt till liksom.

Av Howardtheory

@knge: hur menar du exakt?

Av Howardtheory

Ber om ursäkt visste inte detta.

var timeleft = 20; var downloadTimer = setInterval(function(){ timeleft--; document.getElementById("countdowntimer").textContent = timeleft; if(timeleft <= 0) clearInterval(downloadTimer); },1000);

Där har jag min countdown kod, men den räknar bara ner från 20 till 0 men svarar man på en fråga så börjar den inte om på 20 utan den fortsätter räkna ner från t.ex 15 om det var då man klickade på första svaret.

Hur löser man detta så den börjar om på 20 när man svarat på första frågan?

Av Howardtheory

JS quiz med countdown timer

Hej!

Har i uppgift i skolan att göra ett quiz i JS där jag ska skapa en kundansökan där användaren kans vara på specifika frågeställningar, användaren måste göra detta under en viss tid, alltså har på sig 20 sekunder på varje fråga. Om användaren ger rätt svar så går man vidare till nästa fråga och har man fel eller tiden hinner rinna ut så är frågesporten över. Man ska kunna skriva in sitt smeknamn som han/hon vill ha i frågespelet. När man väl har svarat fel eller tiden har runnit ut så är spelet över men då ska man kunna starta om spelet igen från start. Om nu användaren skulle lyckas svara rätt på alla frågor så ska spelet registrera användarens totala tid och man ska presentera detta i en poänglista med de fem snabbaste tiderna. The high-score will be saved in the browsers Web Storage.

(function() {
var questions = [{
question: "Vilket fotbollslag spelar i Norra london",
choices: ['Arsenal', 'Chelsea' ,'Manchester United', 'West ham', 'Burnley'],
correctAnswer: 0
}, {
question: "Vilket fotbollslag spelar i Norra london",
choices: ['Arsenal', 'Chelsea' ,'Manchester United', 'West ham', 'Burnley'],
correctAnswer: 0
}, {
question: "Vilket fotbollslag spelar i Norra london",
choices: ['Arsenal', 'Chelsea' ,'Manchester United', 'West ham', 'Burnley'],
correctAnswer: 0
}, {
question: "Vilket fotbollslag spelar i Norra london",
choices: ['Arsenal', 'Chelsea' ,'Manchester United', 'West ham', 'Burnley'],
correctAnswer: 0
}, {
question: "Vilket fotbollslag spelar i Norra london",
choices: ['Arsenal', 'Chelsea' ,'Manchester United', 'West ham', 'Burnley'],
correctAnswer: 0
}];

Frågorna är detsamma jag vet, ska ändra det senare.

Men det är detta jag har hunnit få ut och vet inte hur jag ska kunna lägga till en countdown timer på 20 sekunder på varje fråga så en fråga visas i taget och så att använadren kan skriva in sitt "smeknamn" och sen att lyckas inte användaren fixa en fråga så förlorar man och så ska det finnas en knapp där man kan starta om.

Skulle uppskatta all hjälp till detta. Är nybörjare inom JS.

Av Howardtheory

html - lokal navigering

Hej! Har precis börjat studera webbprogrammerare och sitter i webbtekniken nu och kodar en hemsida.

Min hemsida blev godkänd med allt utom lokal navigering

http://www.bilddump.se/bilder/20180119113030-194.47.106.164.j...

Så ser hemsidan ut och vad är det som saknas för att lokal navigering ska fungera eller att man får godkänt på det rättare sagt?

Av Howardtheory

@Leedow:

Tack så mycket, fungerar i jsfiddle nu.

Men förstår inte varför det inte fungerar i localhost://4000 har samma kod i app.js filen i visualstudiocode, men ändras inte på min localhost://4000:/ vet du vad problemet kan vara?

Av Howardtheory

@Elghinnarisa:

Tack! men får inte riktigt till det

jsfiddle

Där finns länken så kan du se hur det ser ut. Varför det inte fungerar?