środa, 4 maja 2016

JourneyPlanner #6.3 - Refaktoryzacja wyników wyszukiwania cz.3

Witam cię drogi czytelniku w trzecim i ostatnim wpisie traktującym o refaktoryzacji funkcji wyszukiwania. Zostaną opisane tutaj zmiany jakie wykonałem aby możliwe było naniesienie wybranych wyników wyszukiwania na mapę. A więc do dzieła!


Widok wyszukiwania

Ostatnim razem zatrzymałem się w momencie, w którym wyszukiwanie odbywa się w osobnym widoku, a jego wyniki prezentowane są pod postacią przyjaznej urządzeniom dotykowym listy. Lista ta nie ma podpiętej póki co żadnej akcji pozwalającej na jakiekolwiek działanie. Należałoby ją w takim razie dodać. Zrealizowałem to poprzez dodanie atrybutu ng-click na elemencie listy. Jako wartość zadałem metodę kontrolera, do której przekazuję wybrany element. A wszystko to oczywiście w pliku szablonu ./lib/home/templates/search-results.html


Posiadając już taką konstrukcję trzeba tę metodę utworzyć. Dylematem był tutaj dla mnie sposób rozwiązania. W poprzedniej wersji wyszukiwania do usługi przekazywałem już gotową lokalizację. Tutaj niestety obiekt, który metoda otrzymuje posiada tylko identfikator. Przekazuje się go do dedykowanej usługi API Google Maps PlacesService aby uzyskać szczegółowe informacje na temat miejsca np. jego lokalizację. Wymagało to zmiany podejścia ponieważ wspomniana usługa Google Maps przyjmuje również w konstruktorze obiekt samej mapy, niedostępny w przestrzeni kontrolera wyszukiwania. Zmodyfikowałem zatem moją usługę wyszukiwania tak aby przyjmowała tylko identyfikator miejsca zamiast jego lokalizacji:


A co za tym idzie w kontrolerze wyszukiwania przekazuję do niej tylko identyfikator i wykonuję przekierowanie na akcję zawierającą mapę.


Widok mapy

Kontroler odpowiadający za wyświetlanie mapy, nie zmienił się zbyt wiele. Jedynie przybyło mu objętości. Inicjalizacja mapy odbywa się tak samo jak dotychczas, po jej wywołaniu dodałem fragment kodu w warunku:


Następuje tutaj wywołanie centrowania mapy na elemencie zawartym w usłudze wyszukiwania (jeśli jest zadany) i dodanie markera. Kod jest żywcem wzięty z przykładu zawartego w dokumentacji API Google Maps i działa bardzo dobrze :)

Rezultat

Rezultat jest bardzo przyjemny, a jego efekty spełniają moje oczekiwania: 
Podsumowując, punkt drugi priorytetu MUST wykonany. Pozostał jeszcze jeden dotyczący nanoszenia na mapę informacji o pogodzie. Dobrze się składa ponieważ okres publikacji postów do konkursu kończy się dla mnie w tym tygodniu. Oczywiście termin ten można przekroczyć, a posty publikować w dalszym ciągu co mam zamiar uczynić. Dumnie muszę powiedzieć, że udawało mi się dotychczas publikować minimum dwa posty tygodniowo. Zgodnie z regulaminem konkursu aby mój blog był rozpatrywany, poza tym postem powinienem do 8 maja opublikować jeszcze jeden wpis. O czym będzie traktował już wspomniałem - punkt trzeci priorytetu MUST czyli "Informacje pogodowe dla wybranego obszaru".

Brak komentarzy:

Prześlij komentarz