Bonustehtävä

• Bonustehtävä 1
• Bonustehtävä 2
• Bonustehtävä 3

Bonustehtävien vaatimuksia on päivitetty 10.1.2022.

Bonustehtävällä voit korottaa viikkotehtävistä saamaasi pistemäärää. Bonustehtävää on kolme eri tasoa. Valitse tehtäväsi taso sen mukaan miten paljon sinulla on viikkotehtävistä pisteitä.

Bonustehtävästä saa 1-2 lisäpistettä

Bonustehtävällä voi korvata yhden puuttuvan viikkotehtävän

Voit tehdä vain yhden seuraavista bonustehtävistä. Valitse oikea tehtävä viikkotehtävistä saamasi pistemäärän mukaan.

Bonustehtävä on toteutettava siistinä React-sovelluksena ja noudattaen Reactin toimintaperiaatteita

• Normaaleja DOM-operaatioita kuten getElementById ja getElementsByTagName ei pidä käyttää, kuin perustellusta syystä. Sama koskee vastaavia jQuery-metodeja. Sivun ulkoasun käsittely on hoidettava Reactin tilan, tapahtumankäsittelijöiden ja render-metodin avulla.
• dangerouslySetInnerHTML, findDOMNode()- ja forceUpdate-funktioiden käyttäminen on kielletty. Myös Refs-ominaisuuden käyttäminen on kiellettyä ellet todella hyvin pysty perustelemaan miksi et selviä ilman. Perustelu on kirjoitettava ohjelmakoodiin kommentteina.
• Alert-funktion käyttäminen on kiellettyä

Toteutettavan pelilaudan on hyödynnettävä koko selainikkunan vapaa tila, mutta säilytettävä pelialueen suhteet järkevinä. Asetuslomakkeen ei pidä olla näkyvillä pelaamisen aikana.

Sovelluksen on oltava responsiivinen ja sen on toimittava myös kännyköiden pienillä näytöillä.

Bonustehtävä 1

Tämä tehtävä on tarkoitettu niille joiden pistemäärä viikkotehtävistä on enintään 10 eli arvosanaksi on tulossa 1 tai hylätty.

Toteuta jätkänshakkipeli seuraavilla ominaisuuksilla:

• Peliruudukon koko voidaan määrätä lomakkeella. Koko on vähintään 10x10. Koon valinta on tehtävä sliderilla. Valittu koko on esitettävä sliderin vieressä.
• Voittoon tarvittavan rivin pituus voidaan määrätä lomakkeella. Vähintään kolme ja enintään 10. Valinta on tehtävä sliderilla. Valittu pituus on esitettävä sliderin vieressä.
• Peliä pelaa aina kaksi ihmispelaajaa. Lomakkeella kysytään pelaajien nimet. Nimiä ei saa jättää tyhjäksi.
• Peliä ei voida aloittaa ennen kuin lomakkeelle on syötetty oikein kaikki tarvittavat tiedot
• Pelimerkkejä sijoitetaan laudalle vuorotellen valitsemalla hiirellä tyhjä ruutu. Jo täytettyjä ruutuja ei saa kyetä valitsemaan.
  • Ruudukon on pysyttävä samankokoisena riippumatta siitä miten monta ruutua on valittu
  • Ruudukon ruutujen on oltava neliöitä eli yhtä korkeita ja leveitä
  • Tyhjissä ruuduissa ei saa olla mitään merkkejä
  • Ruudukon on oltava koko selainikkunan levyinen. Ruutujen koko on skaalattava tämän mukaan. Ruudukko ei saa aiheuttaa sivusuuntaista scrollbaria. Pystysuuntainen scrollbar on sallittu
  • Ruudukon ulkoasu on oltava seuraavanlainen:
    
• Pelin loputtua voittajan nimi ilmoitetaan selkeästi sivulla. Voittorivi korostetaan pelilaudalla.

Bonustehtävä 2

Tämä tehtävä on tarkoitettu niille joiden pistemäärä viikkotehtävistä on enintään 20 eli arvosanaksi on tulossa 2 tai 3.

Toteuta Othello seuraavilla ominaisuuksilla:

• Peliä pelaa aina kaksi ihmispelaajaa. Toisella on valkoiset ja toisella mustat nappulat
• Pelilaudan koko ja pelaajien nimet kysytään lomakkeella. Pelilaudan ruutujen määrä on oltava väliltä 4x4 - 16x16 ja se on kysyttävä sliderilla. Valittu koko on esitettävä sliderin vieressä. Peliä ei voida aloittaa ennen kuin lomake on oikein täytetty.
• Pelilaudan vieressä näkyy pelaajien nimet ja niiden yhteydessä kuinka monta nappulaa kyseisellä pelaajalla on laudalla.
• Pelinappuloita sijoitetaan ruudukolle vuoron perään raahaamalla (drag & drop)
• Pelilauta sallii pudottaa nappulan vain sääntöjen mukaisiin ruutuihin. Sallitut siirtoruudut korostetaan pelilaudalla.
• Pelilaudan on oltava koko selainikkunan levyinen ja korkuinen. Ruutujen koko on skaalattava tämän mukaan. Pelilauta ei saa aiheuttaa sivu- eikä pystysuuntaista scrollbaria.
• Ruudukon ulkoasun on oltava seuraavanlainen:
  
• Pelin on noudatettava wikipedian sivulla mainittuja sääntöjä.
• Pelin päätyttyä voittaneen pelaajan nimi ja nappuloiden määrä esitetään korostettuina.

Bonustehtävä 3

Tämä tehtävä on tarkoitettu niille joiden pistemäärä viikkotehtävistä on enintään 25 eli arvosanaksi on tulossa 4.

Toteuta Mastermind-peli seuraavilla ominaisuuksilla:

• Lomakkeella kysytään pelissä käytettävien värien lukumäärä (4-16), arvattavien nappuloiden määrä ja käytettävissä olevien arvausrivien lukumäärä. Kaikki nämä kysytään sliderilla. Valitut arvot on näytettävä sliderien vieressä.
• Tietokone arpoo arvattavan rivin
• Pelilaudan on skaalauduttava selainikkunan kokoon siten, että se on aina koko ikkunan korkuinen. Sivulla ei saa olla scrollbareja.
• Pelinappuloita lisätään pelilaudalle raahaamalla niitä pelilaudan ulkopuolelta laudalle. Laudan ulkopuolella täytyy koko ajan näkyä pelaajalla käytettävissä olevat nappulat (värit)
• Pelinappuloita voi myös siirtää ruudusta toiseen raahaamalla (drag & drop)
• Pelilauta sallii pudottaa nappulan vain sääntöjen mukaisiin ruutuihin. Sallitut siirtoruudut korostetaan pelilaudalla. Jo arvatuille riveille ei voi enää raahata eikä vielä vuoroaan odottaville riveille.
• Nappulan voi myös poistaa keskeneräiseltä riviltä raahaamalla sen pois laudalta.
• Valmis rivi tarkistetaan, kun rivi on täytetty ja valitaan tarkista-painike
• Valmiin rivin oikeellisuus esitetään rivin vieressä punaisilla ja valkoisilla ympyröillä kuten oikeassakin pelissä. Nämä pallot ovat samaan tapaan järjestettyjä kuin oikeassakin pelissä ja pienempiä kuin oikeat pelinappulat.
• Pelin on noudatettava wikipedian sivulla mainittuja sääntöjä.
• Pelin päätyttyä näytetään oikea rivi ja ilmoitetaan kuinka kauan pelaamiseen kului aikaa