GCM – Czerwiec: Robot. Ulepszone strzelanie.

Koniec pierwszej połowy lipca nadchodzi wielkimi krokami a ja wciąż pracuję na czerwcową grą. Publikowanie gier z opóźnieniem chyba stanie się moją tradycją 🙂 Cóż, lepiej dostarczyć grę później ale kompletną i bez bugów 😉

Tym razem do platformówki z robotem dodałem nowy sposób strzelania. Postać zamiast wyrzucać z siebie kule plazmy, wali teraz seriami z karabinu maszynowego 🙂

Jak napisać gre w javascript

Opisywaną dziś wersję gry można przetestować klikając w obrazek powyżej. Na moim githubie znajduje się repozytorium zawierające jak najaktualniejszy stan gry. Wersja przedstawiona w poście dostępna jest po zajrzeniu w źródło strony gry 🙂 .

Kod obsługujący nowy rodzaj broni znajduje się oczywiście w osobnym module. Cała jego treść zawarta jest w pliku machineGun.js. Oto jak wygląda:

Ten moduł jest trochę niedoszlifowany tu i tam, ale to dlatego, że pierwszy raz korzystam tutaj z paru funkcji. Tym razem, obiekt broni nie jest phaserowym spritem a zwykłym obiektem.

Na początku przypisuję do niego pole coolDown. Przechowuje ono wartość mówiącą co ile milisekund będzie można oddać strzał. W tym wypadku działanie jest jednak nieco inne niż w przypadku plazmy, ale o tym za chwilkę. Następne kilka linijek jest identyczne jak w pierwszej broni. Dodaje do gry odgłos karabinu maszynowego. Do obiektu przypisuję też emiter cząsteczek i funkcję go obsługującą (akurat tutaj duplikuję zawartość modułu plazmy, będę musiał to gdzieś wywalić, ale to później).

Następnie do obiektu przypisuję nowego spritea. Jest to grafika przedstawiająca ogień buchający z lufy podczas strzału. Ustawiam jego wartość alfa na zero, co spowoduje, że domyślnie jest niewidoczny. Punkt odniesienia w poziomie przenoszę na połowę obrazka (linijka z anchor.setTo) będzie miało to znaczenie za moment.

następnie w obiekcie pojawiają się dwie metody shoot oraz update. Pierwsza wywoływana będzie gdy gracz naciśnie spację, a karabin maszynowy będzie aktywną bronią. Druga, co każdy obieg pętli gry.

Zacznę może od update. Jej głównym zadaniem jest ustawienie ognia z lufy w odpowiednim miejscu. Nie ma tu nic skomplikowanego. Jedyna rzecz na którą warto zwrócić uwagę to użycie metody scale spritea. Jeśli podamy mu wartość negatywną, sprite obróci się. Dlatego, gdy postać patrzy w lewo, skaluje obrazek ognia na osi x o -1 (czyli jego rozmiar nie zmienia się) aby obrócić go. Ponieważ Punkt odniesienia na tej osi znajduje się dokładnie na środku sprite (dzięki anchor.setTo), nie przemieszcza się on.

Metoda shoot jest znacznie ważniejsza. Kluczowe są tu współrzędne przechowywane w zmiennych x1 i y1 oraz x2 i y2. Zmienne te ustawiane są na nowo przy każdym strzale. Pierwsza para wskazuje na lufę robota druga na punkt na lewym lub prawym końcu ekranu (w zależności od tego, w którą stronę patrzy robot) . Wartości y są takie same. Oznacza to, że po połączeniu tych punktów linią, była by ona równoległa do podłogi i sufitu. Właśnie taka linia będzie mi potrzebna. Nie będzie ona niczym innym jak trajektorią lotu wystrzelonych z karabinu pocisków.

Linię taką tworzę za pomocą metody/konstruktora Line głównego obiektu phasera. Metoda ta przyjmuje cztery parametry. Są ta współrzędne początku oraz końca linii. Dzięki temu mam phaserowy obiekt linii, przypisany do pola shootLine obiektu broni. Linia ta nie będzie widoczna, ale specjalnie zostawiłem zakomentowane polecenia debug, dzięki którym można ją zobaczyć gdy zostanie dodana do gry. Wystarczy usunąć komentarze.

Na koniec metody shoot za pomocą game.time.events.add (taki phaserowy setTimeOut). Ustawiam zdarzenie, które odpali się po 120 milisekundach. W jego wyniku wartość shootLine zostanie ustawiona na undefined.

Wszystko co potrzebuję jest już gotowe. Teraz muszę dodać obiekt karabinu maszynowego do gry 🙂 W stanie poziomu, w metodzie update dodaje następujący kod (oczywiście po zainicjalizowaniu obiektu i dodaniu go do pola machineGun stanu):

Gdy zmienna shootLine posiada wartość, wywoływana jest metoda checkMachineGunHits, która jako parametr dostaje wszystkie obiekty, na które wpływa mają wystrzelone przez robota pociski. Oczywiście muszę dodać też obiekt robota oraz broni.

A tak wygląda treść checkMachineGunHits:

Metoda ta jest dość obszerna, ale ma bardzo proste działanie. Przechodzi ona przez każdy z przekazanych jej grup obiektów i sprawdza czy został on przecięty linią strzału. Jeżeli tak, sprawdzam, jak blisko gracza leży „trafiony” obiekt, odejmując wartości współrzędnych x tego obiektu oraz robota. Następnie, wyciągam wartość bezwzględną z uzyskanego wyniku (metoda Macth.abs) i to co wyjdzie, zapisuje do zmiennej. To samo robię z kolejnym obiektem, na koniec porównuje wartość otrzymaną z tą zapisaną, jeśli jest mniejsza oznacza to, że nowy obiekt leży bliżej. W takim wypadku nadpisuję starą odległość oraz referencje do aktualnego obiektu. I tak aż przejdę przez wszystkie obiekty ze wszystkich grup. Na koniec mam referencję do obiektu leżącego najbliżej gracza, czyli tego, który został trafiony z karabinu. Mogę teraz wprowadzić do gry efekty takiego trafienia.

Oczywiście metoda jest trochę bardziej rozbudowana niż ten prosty opis, ale zachęcam do przestudiowania jej na własną rękę. W razie jakichkolwiek wątpliwości, pytaj w komentarzach. Na każde pytanie chętnie odpowiem i postaram się wszystko wyjaśnić.

I to tyle jeśli chodzi o dzisiejszy wpis. Na koniec, jak zawsze, zachęcam do polubienia mojej strony na facebooku. Zawsze na bieżąco zamieszczam tam informacje o nowościach, więc warto polubić aby nie przegapić żadnego nowego wpisu.

Dodaj komentarz

Twój adres email nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *