Angularowy Wojownik Autostrady: MAPA!

Wreszcie znalazłem czas, aby dokończyć mapę gry.
Teraz dokładnie wiadomo jak dużą odległość pokonaliśmy w drodze z McKinney do Big Spring wraz z postępem w grze i przeczytanymi paragrafami. Wykonanie tego elementu zajęło mi mniej czasu niż się spodziewałem! Pozostaje tylko się cieszyć.

Cóż, bez zbędnego pisania, poniżej zrzut ekranowy prezentujący efekt.

Jeszcze nie wiem czy w jakichś sposób wyróżniać punkty np. w zależności od typu. Tak czy inaczej  jest to jedno z ostatnich dużych ulepszeń gry jakie przewidziałem jeszcze przed napisaniem pierwszej linii kodu.
Zakończenie prac już blisko...

Angularowy Wojownik beta testy ?

Pojawił się propozycja od osób, które widziały grę w aktualnej wersji, aby wystawić ją  do testów.  Takie typowe beta-testy przed ostatecznym wdrożeniem i zanim program zdobędzie wszystkie założone możliwości.

Po rozważeniu pomysłu powoli skłaniam się ku tej propozycji.  Jedyna trudność to postawienie gry w miejscu, do którego miałbym łatwy dostęp czyli serwer z ftp i zarejestrowana domena. A takowego miejsca w tej chwili nie mam :D  (co, patrząc na to co robię na co dzień, jest dziwne :) ) .

W najbliższych dniach zamierzam więc wykupić domenę oraz jakąś lokalizację w sieci, w której będę mógł zająć trochę miejsca. Przy okazji wystawię jakiegoś redmina czy inną jire / bugzille (heheheh)  na potrzeby samego procesu zgłaszania błędów przez zainteresowanych użyszkodników :).

A paragrafówka spytacie...
Poprawiam różne drobne błędy. To tu to tam czasem coś się przewróci. Dorobiłem kilka prostych ekranów powitalno - wprowadzających, wyciąłem sporo zbędnego kodu (mój kod nie przeszedł mojego code-review :D) i jeszcze drugie tyle muszę wyciąć, zmieniłem trochę wygląd menu postaci (teraz prawie mi się podoba) i dodałem rysunki.
Przez chwilę korciło mnie, aby całe menu postaci zrobić na html-owych canvas, ale na szczęście powstrzymałem swoje absurdalne zapędy. Patrząc na moją prędkość nocnego pisania kodu wydłużyłoby to proces powstawania gry o kolejny miesiąc :D

Pisanie kodu w nocy idzie mi dużo, dużo wolniej niż w dzień. Nie przeskoczę jednak tego problemu pracując na pełny etat. Koniec marudzenia, niedokończone rozwiązania wołają!

I randomowy zrzut :), przecież notka bez tego to jak brak notki.

Menu postaci wygląda już trochę inaczej ale co tam:)

Angularowy Wojownik Autostrady - rzuty kością

Ten wpis wrzucam w nocy ponieważ jestem z siebie nadzwyczaj zadowolony. W końcu udało mi się połączyć mój kod z kodem generującym rzut kością. Oczywiście okazało się, że wystarczy dopisać dosłownie kilka linijek, żeby całość zaczęła prawidłowo współpracować.
 Zanim to jednak zrobiłem minęło dobre 2-3h siedzenia przy kodzie i szukania rozwiązania.
Poniżej efekt

Wejście do paragrafu z testem. Wiać możliwość rzutu kością.

Po kliknięciu ikonki kostki wykonywany jest rzut z pomocą użytej biblioteki. Oczywiście kość obraca się i obija o granicę tak, aby była widoczna na ekranie. Pod kością widać wynik testu na który składają się wartość umiejętności (tu strzelanie równe 5) + bonus (tu +0 i docelowo bonusy =0 nie będą pokazywane) + rzut kostką ( tu oczywiście równe 9)

Na koniec, jak klikniemy ponownie na ekranie, kostka znika i ładowane jest wyjście wynikające z sumy przeprowadzonego testu.

I jeszcze jedna rzecz. Mapa została zintegrowana z menu postaci. Nie działa jeszcze skalowanie, ale efektem mogę się już pochwalić:

Angularowy Wojownik Autostrady cd...

Liczyłem na to, że uda mi się ukończyć grę na święta, aby zrobić prezent tak sobie jak i ewentualnym graczom. Wszelkie znaki na niebie i ziemi wskazują jednak, iż jest to termin nierealny :D Gdy siadałem do projektu nie spodziewałem się, że zajmie tak dużo czasu.
Nie mam jednak powodów do załamywania rąk. Dzięki włożonej w kod pracy nauczyłem się kilku nowych rzeczy, które w przyszłości wielokrotnie wykorzystam.
Dość marudzenia! Trzeba napisać trochę kodu.

Rozbudowuje dwa spore urozmaicenia, bez których gra spokojnie by się obeszła, ale nie była by tak fajna jak mogła by być. Są to pomysły, które pojawiły się przed stworzeniem pierwszego pliku gry.

Pierwszy z nich to możliwość rzucenia kostką k10 na ekranie gry. Taką generowaną w pełnym 3d ze wsparciem fizyki, odbijania się i toczenia. Wykorzystałem rozwiązanie stworzone z pomocą biblioteki Three.js (https://threejs.org/) przez Antona Natarowa (http://www.teall.info/2014/01/online-3d-dice-roller.html)  Napisał i udostępnił spory kawałek kodu js, który umożliwia rzuty wirtualną kostką. Chłopie - wielkie dzięki!
Musiałem zmodyfikować kod na swoje potrzeby oraz pogodzić nie-angularowy sposób pisania z angularowym. W tej chwili połączyłem swoje skrypty silnika paragrafówki ze skryptem generującym kostki . Brakuje jeszcze kilka szlifów, żeby oba rozwiązania w pełni ze sobą współpracowały. Sam efekt jest naprawdę fajny.
Poniżej zrzut ekranu z efektem działania powiązanych skryptów.

Trochę z czapy rzut 3k10

A tutaj już sensowny rzut na wytrzymałość

Druga rzecz nad, którą siedzę na zmianę z rzucaniem kostkami w 3d to interaktywna mapa gry. Chciałem, aby była możliwość zobaczenia jak nasz bohater przemieszcza się nie tylko w wymiarze tekstowym, ale także graficznym. W efekcie w oparciu o html-owy element canvas zaprojektowałem i niemal ukończyłem okno dialogowe (docelowo będzie stanowił jedną z zakładek charakterystyk postaci), na którym nanoszona jest aktualna pozycja gracza zgodna z jego postępami w grze paragrafowej. Mapa jest skalowalna, zawiera dane bohatera, można ją przesuwać. Sam plik mapy pochodzi ze strony amerykańskiego projektu Aon, którego uczestnicy otrzymali zezwolenie od samego Joe Devera na umieszczenie jego paragrafowych książek w Internecie! Strona projektu znajduje się tutaj: https://www.projectaon.org/ i zawiera chyba wszystkie wydane gry Joe Devera. Dostępne są w formie elektronicznej i oczywiście po angielsku. 
Dla poprawienia odbioru mapa przykrywana animowanym szumem, który daje lekko falloutowy efekt.  Poniżej zrzut ekranowy.

W tej chwili jeszcze nie zdecydowałem czy ten szum zostanie.  Niby nie jest męczący ale ...


 p.s.
Śmiechem żartem - jako że  testuję paragrafówkę w Chromie dopiero ostatnio wpadłem na pomysł, aby sprawdzić czy silnik działa w InternetExplorerze. Okazało się, że kilka rozwiązań wymaga specjalnego potraktowania (np. brak w IE funkcji Object.assign()), poprawiłem kilka drobnych błędów i proszz. W IE też można grać