Code Monkey home page Code Monkey logo

coderscamp2020.project2.javascript.starwarsquiz's Introduction

💥 STAR WARS QUIZ 💥

Overview 👁️‍🗨️

Are You a Real Star Wars Fan? The Force calls for you. Test your knowledge of Star Wars characters, vehicles and starships with this fun quiz.

Screen of our app

Rules 📜

You have one minute to answer as many questions as possible. During the game on each questions you need to select who or what from Star Wars is showed on the left from available options. Remember to choose your game level before starting

Keep calm and may the FORCE be with you! 🤞

Live version: Star Wars

Team Members 🦾

  • Mentor Marcin Woś
  • Product Owner Joanna Zioła
  • Tech Leader Marcin Pawęzka
  • Development Manager Lila Religa
  • Patrycja Kowalczyk

Features ⚔️

  • three levels of game difficulty (easy, medium, hard)
  • over 120 randomly generated questions
  • quiz modes with description: People, Vehicles, Spaceships
  • game ranking (data stored locally)
  • full responsiveness for all devices!
  • Star Wars sounds
  • Rules description for the quiz
  • timer
  • tests for the game engine

The following technologies were used :

  • HTML
  • JavaScript
  • SASS
  • Star Wars API
  • JEST

coderscamp2020.project2.javascript.starwarsquiz's People

Contributors

adraganwojtowicz avatar asiaziola avatar dependabot[bot] avatar kalush81 avatar kowalczp avatar ktprezes avatar lilareliga avatar nebrakada avatar

Watchers

 avatar  avatar

coderscamp2020.project2.javascript.starwarsquiz's Issues

Layout for Game Selection

Kryteria akceptacji

Należy zweryfikować i skonsultować, a także ewentualnie uaktualnić przed rozpoczęciem prac nad zgłoszeniem.

  • //TODO1 - update html
  • //TODO2 - update css

Dodatkowe uwagi

Klasa Game Engine

Kryteria akceptacji

Należy zweryfikować i skonsultować, a także ewentualnie uaktualnić przed rozpoczęciem prac nad zgłoszeniem.
Klasę Quiz można przemianować na Game Engine, żeby była bardziej specyficzna, skoro quiz to cały projekt.

  • //TODO1 - wyniesienie funkcji play z app.js do osobnego service np. swapi service
  • //TODO2 - wykorzystywanie konfiguracji zamiast hardcoded url

Dodatkowe uwagi

Loader

Kryteria akceptacji

Należy zweryfikować i skonsultować, a także ewentualnie uaktualnić przed rozpoczęciem prac nad zgłoszeniem.

  • //TODO1 - loader

Dodatkowe uwagi

Komponent Hall Of Fame

Kryteria akceptacji

Należy zweryfikować i skonsultować, a także ewentualnie uaktualnić przed rozpoczęciem prac nad zgłoszeniem.

  • //TODO1 - stworzenie komponentu i dostosowanie obecnego kody związanego z hall of fame

Dodatkowe uwagi

Layout for Game Ranking

Kryteria akceptacji

Należy zweryfikować i skonsultować, a także ewentualnie uaktualnić przed rozpoczęciem prac nad zgłoszeniem.

  • //TODO1 - update html
  • //TODO2 - CSS

Dodatkowe uwagi

Komponent Game over

Kryteria akceptacji

Należy zweryfikować i skonsultować, a także ewentualnie uaktualnić przed rozpoczęciem prac nad zgłoszeniem.

  • //TODO1 - stworzenie komponentu Game Over i przeniesienie tam istniejących obecnie funkcjonalności
  • //TODO2 - wyświetlenie podsumowania w game over, pobranie imienia gracza i zapisanie do hall of fame oraz wyświetlenie poprawności odpowiedzi gracza i komputera

Dodatkowe uwagi

Poprawki scss

Poprawienie scss, m.in.:

  • przeskakiwanie grafiki w tle
  • ew. obniżenie miecza świetlnego (obrazki są większe niż w layoucie przykładowego projektu)
  • dodanie transition do &__saberLight--lit: transition: width 1s daje efekt zmniejszania się czasu/paska bez tych skoków co sekundę, myślę, że warto to dodać :slight_smile:
    zauważyłem że obecnie robimy to poprzez zmniejszanie width elementu. gdzieś widziałem że nie powinno się transformować width bo powoduje rerender większej ilości warstw strony, i można zamiast tego użyć transformX z overflow: hidden na parencie.
  • ew. ustawienie wyboru trudności

Dźwięki przy odpowiedziach

Kryteria akceptacji

Należy zweryfikować i skonsultować, a także ewentualnie uaktualnić przed rozpoczęciem prac nad zgłoszeniem.

  • //TODO1 - Dźwięki przy odpowiedziach

Dodatkowe uwagi

Komponent GameView

Kryteria akceptacji

Należy zweryfikować i skonsultować, a także ewentualnie uaktualnić przed rozpoczęciem prac nad zgłoszeniem.

  • 1 - użyc nextQuestion do wyrenderowania pytania na widoku html w oddzielnym komponencie GameView (?)
  • 2 zaznaczenie odpowiedzi i sprawdzenie jej poprawności
  • 3 - ukazanie na ekranie poprawnej odpowiedzi przez kafel zaznaczony na zielono (przez sekundę)

Dodatkowe uwagi

Komponent timer

Kryteria akceptacji

Należy zweryfikować i skonsultować, a także ewentualnie uaktualnić przed rozpoczęciem prac nad zgłoszeniem.

  • //TODO1 - konfiguracja odliczania 60 s w 1 grze i zakończenie gry (gracza i komputera) wraz z upływem 1 minuty
  • //TODO2 - powiązanie upływu czasu z paskiem na mieczu świetlnym
  • //TODO3 - blokada przycisków
  • //TODO4 - testy

Dodatkowe uwagi

Napisanie README

Kryteria akceptacji

Należy zweryfikować i skonsultować, a także ewentualnie uaktualnić przed rozpoczęciem prac nad zgłoszeniem.

  • //TODO1 - Napisanie README wraz z linkiem do demo

Dodatkowe uwagi

Testy do Game Engine 2/2

Kryteria akceptacji

Należy zweryfikować i skonsultować, a także ewentualnie uaktualnić przed rozpoczęciem prac nad zgłoszeniem.

  • //TODO1 - Testy do Game Engine 2/2

Dodatkowe uwagi

Ustawienia quizu

Kryteria akceptacji

Należy zweryfikować i skonsultować, a także ewentualnie uaktualnić przed rozpoczęciem prac nad zgłoszeniem.

  • //TODO1 - przeniesienie klasy Quiz do folderu service
  • //TODO2 - ustawienie, by klasa pytała o wszystkie zasoby

Dodatkowe uwagi

Uporządkowanie kodu

Kryteria akceptacji

Należy zweryfikować i skonsultować, a także ewentualnie uaktualnić przed rozpoczęciem prac nad zgłoszeniem.

  • //TODO1 - stworzenie brakujących komponentów
  • //TODO2 - wyrzucenie zbędnego kodu z app.js i html, podmianka na metody z nowych klas

Dodatkowe uwagi

Jako <kto>, chcę mieć możliwość <co zrobić>.

Kryteria akceptacji

Należy zweryfikować i skonsultować, a także ewentualnie uaktualnić przed rozpoczęciem prac nad zgłoszeniem.

  • //TODO1 - użyc nextQuestion do wyrenderowania pytania na widoku html w oddzielnym komponencie GameView (?)

Dodatkowe uwagi

poprawa cssów

Kryteria akceptacji

Należy zweryfikować i skonsultować, a także ewentualnie uaktualnić przed rozpoczęciem prac nad zgłoszeniem.

  • //TODO1 - widok miecza świetlnego, wyświetlanie obrazków, modal, marginesy do przycisku z dźwiękami, wyświetlenie opcji wyboru trudności gry, favicon

Dodatkowe uwagi

First layout

Kryteria akceptacji

Należy zweryfikować i skonsultować, a także ewentualnie uaktualnić przed rozpoczęciem prac nad zgłoszeniem.

  • //TODO1 - html
  • //TODO2 - css

Dodatkowe uwagi

testy do ApiDataFetcher

Kryteria akceptacji

Należy zweryfikować i skonsultować, a także ewentualnie uaktualnić przed rozpoczęciem prac nad zgłoszeniem.

  • //TODO1 - testy do ApiDataFetcher

Dodatkowe uwagi

Testy do Game Engine 1/2

Kryteria akceptacji

Należy zweryfikować i skonsultować, a także ewentualnie uaktualnić przed rozpoczęciem prac nad zgłoszeniem.

  • //TODO1 - Testy do Game Engine 1/2

Dodatkowe uwagi

Przygotowanie wersji demo

Kryteria akceptacji

Należy zweryfikować i skonsultować, a także ewentualnie uaktualnić przed rozpoczęciem prac nad zgłoszeniem.

  • //TODO1 - wstawienie strony głównej na github pages
  • //TODO2 - konfiguracja wszystkich widoków i trybów gry w 1 działające demo gry

Dodatkowe uwagi

demo, prezentacja

Należy zweryfikować i skonsultować, a także ewentualnie uaktualnić przed rozpoczęciem prac nad zgłoszeniem.

  • //TODO1 - plan prezentacji
  • //TODO2 - podział ról i zakresu wypowiedzi
  • //TODO2 - wypełnienie google forms dla projektu

Dodatkowe uwagi

testy do ComputerMind

Kryteria akceptacji

Należy zweryfikować i skonsultować, a także ewentualnie uaktualnić przed rozpoczęciem prac nad zgłoszeniem.

  • //TODO1 - testy do ComputerMind
  • //TODO2

Dodatkowe uwagi

Opis gry

Kryteria akceptacji

Należy zweryfikować i skonsultować, a także ewentualnie uaktualnić przed rozpoczęciem prac nad zgłoszeniem.

  • //TODO1 - przeniesienie logiki odnośnie zmiany trybu z app.js do komponentu GameMode
  • //TODO2 - tryb gry częścią obiektu konfig inicjalizowanym w app.js

Dodatkowe uwagi

Zapisywanie punktów i odpowiedzi

Kryteria akceptacji

Należy zweryfikować i skonsultować, a także ewentualnie uaktualnić przed rozpoczęciem prac nad zgłoszeniem.

W ramach tego zadania można ustawić mocka, który wywoła pobranie pytania z setTimeout, raz pobierze dobrze, raz źle, dla testów.

  • //TODO1 - ewentualne zapisanie punktu i przejście do kolejnego pytania
  • //TODO2 - zapisanie odpowiedzi (które wyświetlą się w podsumowaniu game over)
  • //TODO3 - dostosowanie do wszystkich trybów (people/vehicles/starships) - w podsumowaniu rankingi wyświetlają wyniki z danego trybu gry
  • //TODO4 - testy

Dodatkowe uwagi

Layout for Game Over

Kryteria akceptacji

Należy zweryfikować i skonsultować, a także ewentualnie uaktualnić przed rozpoczęciem prac nad zgłoszeniem.

  • //TODO1 - update html
  • //TODO2 - update css

Dodatkowe uwagi

komunikat o błędzie

Kryteria akceptacji

Należy zweryfikować i skonsultować, a także ewentualnie uaktualnić przed rozpoczęciem prac nad zgłoszeniem.

  • //TODO1 - stworzenie komunikatu o błędzie, jeśli np, wywali się API

Dodatkowe uwagi

Layout for Game Settings

Kryteria akceptacji

Należy zweryfikować i skonsultować, a także ewentualnie uaktualnić przed rozpoczęciem prac nad zgłoszeniem.

  • //TODO1 - update html
  • //TODO2 - update CSS

Dodatkowe uwagi

Layout GameInProgress

Kryteria akceptacji

Należy zweryfikować i skonsultować, a także ewentualnie uaktualnić przed rozpoczęciem prac nad zgłoszeniem.

  • //TODO1 - update html
  • //TODO2 - update css

Dodatkowe uwagi

Komputer jako gracz

Kryteria akceptacji

Należy zweryfikować i skonsultować, a także ewentualnie uaktualnić przed rozpoczęciem prac nad zgłoszeniem.

  • //TODO1 - dostosowanie logiki gry do komputera jako gracza (odpowiedzi wybierane są losowo)
  • //TODO2 - zapisanie odpowiedzi (które wyświetlą się w podsumowaniu game over)
  • //TODO3 - testy

Dodatkowe uwagi

Komponent Game Description

Kryteria akceptacji

Należy zweryfikować i skonsultować, a także ewentualnie uaktualnić przed rozpoczęciem prac nad zgłoszeniem.
w ramach komponentu elementy środkowej części widoku:

  • //TODO1 - wyświetlenie panelu z pytaniem otwierającym i rules
  • //TODO2 - wystawienie metody change gameDescription (nazwa przykładowa), która zmienia tekst i pobiera losowe zdjęcie

Dodatkowe uwagi

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.