Komentarze na mikroblogach w czasie rzeczywistym

Zapewne znasz taki scenariusz: dostajesz powiadomienie o nowym komentarzu do obserwowanego wpisu na mikroblogu. Klikasz na listę rozwijalną, następnie w powiadomienie które prowadzi do danego komentarza.

Od dziś nie ma takiej potrzeby. Komentarze będą pojawiać się na stronie w czasie rzeczywistym co da Ci możliwość dyskusji jak na zwykłym czacie. Nowo dodane komentarze będą wyróżnione pomarańczowym obramowaniem, podobnie jak to ma miejsce w pozostałych częściach serwisu. Wygląda to tak:

Screenshot_20201016_090609.png

Lista postów: refaktoryzacja oraz nowy wygląd

Kilka miesięcy temu przepisaliśmy cały kod front-endu na stronie głównej forum oraz na liście wątków. Najgorsze, czyli lista postów wraz z formularzami do edycji postów/komentarzy - zostawiliśmy na koniec. Dzisiaj, po kilku miesiącach, zostało wdrożone ponad 160 commitów.

Z punktu widzenia użytkownika niewiele powinno się zmienić. Została zachowana dotychczasowa funkcjonalność. Wygląd został jedynie ujednolicony z mikroblogami, czy też listą wątków.

  • Przycisk Edytuj przejął funkcjonalność przycisku Szybka edycja. Mamy możliwość dodawania załączników, tagów czy podglądu wiadomości bez konieczności przechodzenia do osobnej podstrony.
  • treść wiadomości prywatnej nie znika po odświeżeniu strony #487
  • wyświetlanie komunikatów błędów walidacji tagów #516
  • zmiana tytułu wątku nie generuje powiadomienia dla autora #534
  • dodanie znaku nowej linii na końcu cytatu #515
  • poprawiony komunikat o nieistniejącym poście #496
  • przyciski obserwacji postu oraz komentowania widoczne dla niezalogowanych #309

Autocomplete w polu wyszukiwarki

Jak można zauważyć, wprowadziliśmy nowe pole wyszukiwania wyposażone w funkcjonalność autocomplete (albo search as you type). Dodatkowo, kliknięcie w to pole wyświetla skróconą listę wątków, ofert pracy czy też artykułów w których użytkownik brał udział lub był autorem.

Jak to działa?

Zaznaczmy, że funkcjonalność jest w fazie beta więc działanie czy też wygląd mogą się wkrótce zmienić toteż ten artykuł przestanie być aktualny.

W momencie gdy użytkownik kliknie w pole wyszukiwania (lub użyje skrótu klawiaturowego) pobierana jest lista ogłoszeń o pracę, wątków na forum czy też artykułów. Warunkiem jest to aby użytkownik był autorem wątku/artykułu, brał udział w dyskusji (w przypadku wątków) lub obserwował dany wątek/ogłoszenie prace czy artykuł. Bycie autorem ustawia dodatkowo wyższy priorytet.

Pozycja na liście z czasem ma mniejszą wagę. Po 10 dniach ostatniej aktywności dany wątek, czy ogłoszenie traci swój ranking. Dzięki temu Twoje stare ogłoszenia czy wątki ustępują miejsca innym.

Mechanizm autocomplete działa podobnie. Próbuje znaleźć dopasowania w dwóch pierwszych wyrazach danego zdania (tytułu wątku czy ogłoszenia). Wyżej promowane są Twoje wątki/ogłoszenia czy też takie które obserwujesz.

Lista wątków: odświeżony wygląd oraz nowe funkcjonalności

Jakiś czas temu informowaliśmy o zmianie na stronie głównej forum. Możesz poczytać o tym tutaj: Odświeżona strona główna forum.

Teraz, w ramach pozbywania się jQuery z projektu, zmieniliśmy wygląd listy wątków. Przede wszystkim przepisany został cały kod front endu. Zmiany dotknęły również backend, ale w mniejszym stopniu. Oto lista zmian:

  • Kliknięcie w nazwę wątku automatycznie przekierowuje do pierwszego, nieczytanego posta.
  • Skrócony zapis statystyk (liczby wyświetleń, postów, odpowiedzi itp). Zamiast 20 000 wyświetleń, teraz wyświetlamy 20k wyświetleń
  • Statystyki danego posta wyświetlają się w nowym rzędzie, pod nazwą tematu. Dodatkowo ikonki są podświetlone w zależności od tego czy wypowiadaliśmy się w danym wątku, głosowaliśmy na niego, czy go obserwujemy
  • Ikona umożliwiająca wł/wył obserwacji danego tematu została umieszczona wraz z pozostałymi ikonami.
  • Kliknięcia w datę dodania wątku, przekierowuje do pierwszego postu.
  • Wyświetlanie treści ostatniego posta w wątku. Jego kliknięcie powoduje przekierowanie do owego wątku.
  • Nowe wątki są podświetlane kropką na ikonce aby zapewnić spójność z listą kategorii forum.
  • Nowy wygląd na urządzeniach mobilnych.

Odświeżona strona główna forum

W ramach pozbycia się jQuery z naszego projektu, przepisaliśmy stronę główną forum. Przepisany został kod front end (JavaScript oraz częściowo SCSS) oraz niektóre elementy backendu. W sumie ok 100 commitów.

Co się zmieniło?

  • Nowy wygląd strony głównej na urządzeniach mobilnych. Tytuł tematu powędrował do nowej linii dzięki czemu jest bardziej widoczny. W widoku mobilnym, kategoria forum ma ustawiony border-left zamiast ikony.
  • Zmiana ikon kategori. Kategorie techniczne zyskały logo języków, natomiast oznaczenie nowych postów w danej kategorii jest poprzez małą pomarańczową kropkę.
  • Możliwość przenoszenia kategorii góra/dół (personalizacja widoku forum) wprost z poziomu strony głównej forum.
  • Przy każdej sekcji dodano nową ikonę umożliwiającą ukrycie danych kategorii.
  • Nowa ikona umożliwiająca oznaczenie danej kategorii jako przeczytanej.
  • Zwijanie oraz rozwijanie danej sekcji nie jest już zapamiętywane po stronie backendu. Okazało się że ta funkcjonalność nie cieszy się zbytnim zainteresowaniem.
  • Usunięcie zakładki "Bez odpowiedzi" która nie była zbyt popularna.
  • Kliknięcie na tytuł wątku w kategorii przenosi domyślnie do ostatniego nieczytanego postu.