Zgodnie z obietnicami czas na małe przemieszanie i poprawianie dotychczasowych osiągnieć w dziedzinie tworzenia mapy. Na pierwszy ogień pójdą wyniki wyszukiwania i ich prezentacja.
Reorganizacja #1
Rozpocząłem od reorganizacji widoku zakładek i paska wyszukiwania. Na zakładki aplikacji mam inny pomysł i finalnie prawdopodobnie znikną. Póki co będą użyte jako osobny moduł. Natomiast górna belka będzie zawierać w widoku mapy tylko lupę, po której kliknięciu zostaniemy przekierowani do podstrony z polem tekstowym, a wyniki podpowiedzi będą się wyświetlać w formie wygodnej listy na całym ekranie.
A więc do dzieła!
Przeniesienie zakładek do osobnego modułu
Postanowiłem przenieść zakładki do osobnego modułu, ponieważ nie chcę mieć ich widocznych na każdej podstronie. Podobnie będzie teraz z paskiem wyszukiwania w nagłówku. Będzie on wstrzykiwany tylko dla konkretnych widoków. Więc pierwszy ktok to usunięcie zakładkek oraz nagłówka z wyszukiwaniem z pliku ./lib/app/index.html.
Następnie utworzenie nowego modułu tabs:
i wprowadzenie go do głównego kontrolera:
W tym momencie usunąłem również zawartość metody onEnter z AppController oraz całą metodę geolocate()
Kolejną czynnością była zmiana nazw stanów stron występujących jako zakładki. Nazwa stanu została zmieniona z "app.home" na "app.tabs.home".
Wygląd interfejsu nie zmienił się ani trochę, nawet jest uboższy w nagłówek z polem wyszukiwania.
Chcemy szukajkę!
Ten etap zajął więcej czasu niż mogłem się spodziewać. Po pierwsze w module Home zmieniła się organizacja struktury plików. Doszedł drugi kontroler oraz widok.
Struktura prezentuje się następująco:
│ config.ts │ home.scss │ index.ts │ ├───controllers │ map.ts │ searchResults.ts │ └───templates index.html search-results.html
Wydzieliłem osobny katalog na kontrolery oraz na szablony. Uznałem, że nie warto robić kolejnego modułu, zajmującego się wyszukiwaniem skoro jest on związany bezpośrednio z mapą czyli modułem Home.
Szczegółowym opisem zmian jakie tu wprowadziłem podzielę się w następnym poście, ponieważ jest to dość obszerny temat. Nie chciałbym zaczynać kolejnej części opisu aby przerwać ją w połowie. To co zostało zaprezentowane powyżej jest zamkniętą całością.
Można powiedzieć, że mały cel refaktoryzacji został osiągnięty. Zakłądki zostały wydzielone do osobnego modułu co zwiększa elastyczność rozwiązania. Zapraszam was do oczekiwania na część drugą, w której zostanie opisane jak wydzieliłem wyszukiwarkę wraz z podpowiedziami do osobnego kontrolera i widoku bez zakładek.
Jeśli macie jakiekolwiek sugestie co do formy prezentowanych tutaj treści zachęcam do dzielenia się krytyką w komentarzach.
Brak komentarzy:
Prześlij komentarz