Detta är den avslutande uppgiften, där du arbetar mer självständigt med ett program. Betygsskalan är denna gång U, G, VG, så beskrivningen och därmed även kraven och bedömningen är uppdelad i G och VG. Det program som ska skapas är ett litet spel med olika brickor, där interaktionen sker genom "drag-and-drop". Följande film demonstrerar hur det färdiga programmet ska fungera:
9 min.
Du arbetar med uppgiften under kursens fyra sista veckor. Utgå från filerna i mappen U3, där det finns filer med HTML- och CSS-kod. Dessa filer får inte förändras, utan de ska vara som de är. Det finns också en JS-fil, men den är denna gång tom. Det är i den filen du ska lägga till din JavaScript-kod.
Funktionsbeskrivning
Du ska skapa ett program för ett litet spel. Det finns totalt 40 brickor med siffror. Spelaren får fyra brickor i taget och ska placera ut dem på en spelplan med 4x4 rutor. Målet är att få så många rader och kolumner som möjligt med stigande serier både i rader och kolumner, då spelplanen är fylld. I en stigande serie är numret på varje bricka högre än numret på föregående bricka.
Poäng ges för varje korrekt rad och kolumn. Poängen ska adderas till en totalpoäng, som tillsammans med en räknare för antal spel, ska sparas i localStorage eller i en cookie. Totalpoängen och antal spel ska sedan läsas in igen, nästa gång man kommer till webbsidan.
Programmet och interaktionen med användaren visas i ovanstående film. Funktionaliteten beskrivs också i nedanstående punkter.
Normalt flöde i spelet
Följande punkter är obligatoriska för betyget G.
- Då man klickar på knappen för nytt spel, ska spelet initeras samt knappen för nytt spel inaktiveras och knappen för nya brickor aktiveras.
- Då man klickar på knappen för nya brickor, får man fyra nya brickor som väljs slumpmässigt bland brickorna 1-40. Samma nummer ska inte kunna väljas mer än en gång i en spelomgång. De nya brickorna placeras i rutorna ovanför knappen.
- Man kan sedan dra de nya brickorna till valfri tom ruta på spelplanen. Man drar en bricka i taget i valfri ordning.
- Man ska endast kunna släppa brickan över en tom plats i spelplanen. Medan man drar, ska de tomma platser man drar över markeras med en annan bakgrundsfärg.
- Då alla nya brickor dragits till spelplanen, ska knappen för nya brickor aktiveras igen, så att man kan klicka fram fyra nya brickor.
- Då spelplanen är fylld ska alla rader och kolumner kontrolleras. Om det är en stigande serie, dvs numret i varje bricka är lägre än numret i efterföljande bricka, ska det markeras med en grön bock till höger om raden eller under kolumnen. I annat fall ska det markeras med ett rött kryss.
- Använd klasserna
checkellercross, för att lägga in bock eller kryss. - Kontrollen av alla serier ska ske i en loop, så att inte i stort sett likadan kod upprepas i onödan.
- Använd klasserna
- Antal korrekta serier räknas och detta antal blir poäng, som skrivs ut i elementet för meddelande.
- Poängen för en spelomgång ska adderas till totalpoängen. En räknare för antal spel ska också räknas upp. Totalpoängen och räknaren ska visas i rutan i det övre högra hörnet.
- Både totalpoäng och räknaren för antal spel ska sparas i en variabel i localStorage eller i en cookie. Båda värdena ska sparas i samma variabel eller cookie. Dessa läses in då man öppnar sidan, så att de poäng och antal spel som man haft tidigare finns kvar, då man kommer tillbaks till sidan. De ska då också skrivas ut på sidan.
- Då spelet är klart, ska knappen för nytt spel aktiveras igen, så att man kan spela en gång till. Då man sedan klickar på knappen för nytt spel, ska spelplanen rensas och meddelanden från föregående spel tas bort.
Tillägg för VG
Följande tillägg är inte obligatoriska för G, men måste finnas med för betyget VG.
- Efter en slumpmässigt vald tid från det att spelet startas ska det dyka upp ett spöke som tar bort fyra brickor med nummer från spelplanen. Skulle det inte finnas så många brickor på spelplanen, tas alla de som finns bort. Därefter sätts en ny slumpmässigt vald tid och ett nytt spöke kan dyka upp igen. Detta fortsätter tills man fyllt hela spelplanen med nummer. Då spelet avslutas, ska inget nytt spöke kunna dyka upp.
- Gången för detta ska vara:
- Då spelet startas initieras en timer med en slumpmässigt vald tid på mellan 30 och 60 sekunder (eller annan tid som du finner lämplig).
- Då timerns tid gått ut visas bilden på spöket och fyra (eller så många som finns) av de brickor med nummer markeras med klassen
ghostTile. - Efter ytterligare 2 sekunder tas brickorna bort, genom att rutans nummer tas bort och klassen
ghostTiletas bort. Brickornas nummer läggs tillbaks i mängden med nummer som kan dras för nya brickor. Samtidigt döljs också bilden på spöket. - Timern för spöket initieras igen med en ny slumpmässigt vald tid.