Archiwum dla kategorii: Media Ambassador (TJT:2,5)

Nagroda Web Star Festival dla Media Ambasador

Statuetka Web Star FestivalNa dzisiejszej gali Web Star Festival wręczono naszej firmie pierwszą nagrodę w kategorii Odzież, moda i uroda za serwis House przyznaną przez Akademię Internetu. Bardzo się z tego cieszę, bo miałem swój skromny udział w realizacji tego projektu.

Równocześnie był to mój ostatni dzień w Media Ambasador. Pomyślałem sobie, że ciekawie się złożyło, że dzisiaj firma otrzymała nagrodę. Myślę, że jednak lepiej jest odejść w momencie triumfu firmy, niż w chwili jej upadku. Wiele się tutaj nauczyłem, brałem udział w ciekawych projektach i poznałem fantastycznych ludzi. Czas jednak na zmiany i od jutra zaczynam pracę w nowej firmie.

House

Strona główna house.plHouse to jedna z najbardziej znanych na rynku marek ubrań dla młodzieży, której właścicielem jest firma Artman.

Firma, w której pracuję otrzymała po raz czwarty zlecenie realizacji kolejnej edycji strony. Strona w większości została zrealizowana w postaci animacji Flash i moim zadaniem było dostarczenie danych w postaci XML oraz oprogramowanie części HTML. Na początku zająłem się katalogiem ubrań. Proces importu danych jest miał być zrealizowany kilkustopniowo: najpierw należało przeiterować listę zdjęć produktów i na podstawie ich nazwy przydzielić do odpowiedniej kategorii, płci, rodzaju zdjęcia oraz wygenerować miniatury. Skorzystałem z funkcji napisanych przy okazji poprzednich edycji, ale i tak musiałem wprowadzić sporo zmian (m.in. raportowanie o plikach, których nazwy nie pasują do określonego wzorca). W drugim etapie konieczne było zaimportowanie pliku z danymi (kolory, nazwy kategorii) w formacie Excela. Przekonwertowałem plik na format CSV i napisałem funkcję importującą obsługiwaną po stronie systemu CMS. Ostatnim etapem były zmiany wprowadzane ręcznie przez pracowników firmy Artman (ceny, produkty podobne). Tutaj moja praca sprowadziła się do przygotowania i oprogramowania odpowiedniego interfejsu po stronie systemu CMS.

Podstrona HousepartyMogąc wczytać katalog przystąpiłem do generowania XML’a potrzebnego po stronie frontendu. Napisałem metodę, która dla przekazanej, określonej struktury generowała kod XML (z zagnieżdżeniami). W poprzednich edycjach tworzenie XML’a odbywało się przez sklejanie łańcuchów znaków. Zastanowiło mnie, czy jest to najlepsze i najszybsze rozwiązanie, ale z braku czasu na testy zrobiłem tak samo. Aby za każdym razem nie generować wszystkiego od nowa, gotowy XML buforowałem przy pomocy biblioteki PEAR::CacheLite. Jeśli ktoś wprowadził jakąś zmianę w katalogu po stronie CMS’a, plik bufora z danymi był automatycznie unieważniany i przy najbliższym żądaniu tworzony od nowa. Dużo później pomyślałem, że warto byłoby zastosować odpowiednie nagłówki HTTP, tak by przeglądarka pobierała plik XML tylko wtedy, gdy zmienił się on od ostatniego pobrania.

Podstrona KolekcjaPodobny mechanizm unieważniania bufora po jakiejś zmianie zastosowałem w innych miejscach, gdzie konieczne było przekazywanie danych XML do animacji Flash. Część HTML była dość prosta i sprowadzała się do prezentacji treści z modułu Artykułów. Jedynie sekcja Klub wymagała trochę więcej pracy. Zrobiłem mechanizm dwustopniowej rejestracji z weryfikacją adresu e-mail zgodnie z wytycznymi. Zapisanie się do Klubu było nagradzane możliwością wydrukowania kuponu rabatowego. Zastanawiając się nad sposobem generowania numerów kuponów wpadłem na pomysł, by użyć w tym celu kodu kreskowego EAN13. Okazało się, że specjalnie na potrzeby kuponów zarezerwowano prefiksy od 050 do 059. Skorzystałem z biblioteki PEAR::Image_Barcode i wkrótce na kuponie pojawiał się ładny kod kreskowy. Niestety, sprzedawcy weryfikujący kupony w sklepie musieli i tak wpisać numer ręcznie. Na szczęście mogłem wykorzystać algorytm generowania sumy kontrolnej, by sprawdzić, czy zrobili to poprawnie.

Ciekawym zagadnieniem było opracowanie techniki udostępniania filmów tworzonych przez użytkowników w ramach sekcji „Nagi instynkt”. Miało to być coś na kształt YouTube. Poszperałem w sieci i znalazłem program ffmpeg. Pozwala on m.in. na konwersję filmów z różnych formatów do formatu FLV obsługiwanego przez Flash. Niestety, wersja instalowana z paczki binarnej nie posiadała wkompilowanej obsługi mp3. Cóż poradzić, poszukałem dobrego samouczka, ściągnąłem źródła lame, skompilowałem, ściągnąłem źródła ffmpeg i również skompilowałem. Po wykonaniu polecenia:

ffmpeg -i film.mpg -b 480000 -s 320x240 -acodec mp3 -ab 64 -ar 22050 film.flv

mogłem obejrzeć film przy pomocy Riva FLV Player. Ostatecznie stanęło na tym, że użytkownicy nie będą sami dodawać filmów, lecz wysyłać na podany adres, a my zajmiemy się konwersją i umieszczeniem filmów na stronie. Na koniec Marek przygotował ładny odtwarzacz do osadzenia na stronie.

Ważnym elementem, nad którym pracowałem z przerwami od dłuższego czasu był moduł rozsyłania biuletynów. Istniejący moduł nie posiadał kilku dość ważnych opcji (podglądu w trakcie edycji, zliczania kliknięć, komponowania z dowolnych elementów) oraz używał XML+XSLT jako szablonów, więc za każdym razem w Dominik miał sporo roboty.

Nowy moduł umożliwia stosowanie wielu różnych szablonów, w ramach których można osadzać różnego rodzaju elementy w dowolnej kolejności. Gdy zachodzi potrzeba dodania nowego typu elementów, to wystarczy dopisać klasę dziedziczącą po klasie bazowej, nadpisać kilka metod, dodać w konfiguracji i gotowe. W każdym momencie tworzenia biuletynu można zrobić jego podgląd w wersji HTML i tekstowej, by przekonać się, jak wygląda.

Po zapisaniu można rozesłać go do grupy testowej, poprawić ewentualne błędy i zaplanować rozsyłanie. Biuletyn może być rozesłany o zadanej dacie i czasie. W czasie rozsyłania można śledzić ilość wysłanych e-maili a także ilość odebranych oraz ilość kliknięć na każdym elemencie biuletynu.

Aby ukryć lokalizację skryptu rozsyłającego w treści wiadomości (nadpisywanie nagłówków nie pomagało) zdecydowałem się zrezygnować z używania wget i przerobiłem skrypt tak, by można go było uruchamiać z linii poleceń przy pomocy php-cgi.

Strona została uruchomiona 16 września 2006 roku.

Użyte technologie: PHP 5, MySQL 4.1, Smarty, PEAR, XML, FLV

Wrocław Non Stop

Strona głowna wroclawnonstop.plWrocław Non Stop to jedyny w swoim rodzaju maraton kulturalny, podkreślający dynamizm i barwność tego miasta.

Firma, w której pracuję, wygrała po raz drugi konkurs na realizację portalu związanego z festiwalem Wrocław Non Stop. Moim zadaniem było przygotowanie strony w oparciu o gotowe szablony XHTML.

Czas bardzo naglił, więc zdecydowałem się wykorzystać moduł artykułów do prezentacji programu. Na początku pomysł wydawał się dobry, bo faktycznie bardzo szybko udało się zaimplementować potrzebną funkcjonalność. Problemy zaczęły się, gdy okazało się, że konieczne są zmiany. Musiałem się nieźle zagimnastykować, by wyciągnąć potrzebne dane. Wynikło to z tego, że sposób prezentacji programu ulegał dynamicznie zmianom wraz z upływem kolejnych dni imprezy.

Kolejnym wyzwaniem był mechanizm buforowania. Kolega Sławek dał mi dwie ważne wskazówki: włączaj tylko te pliki, które są naprawdę potrzebne (najlepiej tylko bibliotekę obsługi buforowania) i wyeliminuj konieczność łączenia się z bazą danych za każdym razem. Wykorzystałem świetną bibliotekę PEAR::CacheLite i zrobiłem, tak jak sugerował. Faktycznie, w przypadku odczytu strony z bufora, czas potrzebny na jej wygenerowanie jest rzędu tysięcznych sekund. Niestety, kłopoty pojawiły się przy stronie głównej, gdzie przy każdym wejściu powinny się pokazywać losowo inne wydarzenia. Ilość możliwych kombinacji była tak duża, że cache nigdy by się prawdopodobnie nie wygenerował. Ostatecznie postanowiłem, że nie będzie pełnej losowości, ale będę wybierał losowo sekwencje np. element 1 i 2, 2 i 3, itd. Napisałem funkcję, która generowała wyszystkie możliwe kombinacje i buforowała je. Przy wyświetlaniu strony odczytywałem plik z kombinacjami, losowałem jedną i używałem jako klucza dla mechanizmu buforowania.

Teraz rozwiązałbym to jeszcze inaczej i dużo prościej: dla każdego losowanego elementu tworzyłbym bufor w postaci pliku z fragmentem kodu HTML. Przy wyświetlaniu losowałbym potrzebne elementy, pobierał kod HTML dla nich i składał gotową stronę.

Na szczęście nie było problemu z pokazywaniem najbliższych wydarzeń: czasowe wygasanie buforów rozwiązywało sprawę. Przez to, że się bardzo spieszyłem nie doczytałem w dokumentacji CacheLite o bardzo użytecznym parametrze automaticCleaningFactor. Gdybym to zrobił, nie musiałbym pisać specjalnych skryptów do czyszczenia bufora uruchamianych przez CRON.

Wykorzystałem po raz kolejny moduł biuletynów, ale wyszukiwanie zrealizowałem już z wykorzystaniem modułu, który od dość dawna istniał w naszym CMS’ie, a na który nie zwróciłem uwagi. Kolega Piotr wykorzystał go w innym projekcie, więc szlak był przetarty – wystarczyło skorzystać z jego doświadczeń. Dodałem tylko zbieranie statystyk o wyszukiwanych frazach.

Serwis został uruchomiony 22.06.2006 roku w nocy – równo z rozpoczęciem festiwalu.

Użyte technologie: PHP5, MySQL 4.1, Smarty, PEAR, XHTML

Centrum Praw Kobiet

Strona główna Centrum Praw KobietFundacja Centrum Praw Kobiet jest organizacją, której misją jest działanie na rzecz równego statusu kobiet i mężczyzn w życiu publicznym oraz w rodzinie.

Moim zadaniem było uruchomienie strony fundacji wykorzystując gotowy szablon XHTML. Większość witryny stanowiły skategoryzowane artykuły, więc wykorzystałem moduł dostępny w firmowym systemie CMS i dodałem tylko pobieranie danych po stronie frontendu i prezentowanie ich na różne sposoby.

Ponieważ potrzebne było wyszukiwanie w serwisie, rozbudowałem moduł artykułów naszego firmowego systemu CMS o taką funkcjonalność. Użyłem dostępnych w MySQL indeksów wyszukiwania pełnotekstowego zakładając je dla pól tytułu, wstępu i treści. Potem samo wyszukiwanie wyglądało mniej więcej tak:

select
at.id, match(at.title, at.abstract, at.content) against('szukane słowa' in boolean mode) as score
from
artykuly as at
where
match(title, abstract, content) against('szukane słowa' in boolean mode)
order by
score desc

Proste, prawda? :-) Przydało się także w serwisie The Media Beat.

Przygotowałem także nowy moduł do rozsyłania biuletynów. Stary, będący cześcią firmowego systemu CMS, był dedykowany dla serwisu House i nie nadawał się do wykorzystania w tym przypadku. Idea jest prosta: administrator może wybrać artykuły z których kategorii mają tworzyć pulę elementów biuletynu, wybrać dowolną ilość artykułów, podejrzeć i zmodyfikować wstępnie przygotowaną treść (tylko czysty tekst) po czym zatwierdzić rozesłanie. Niewielki skrypt uruchamiany przez cron zajmie się resztą. Wykorzystałem biblioteki PEAR::Mime i PEAR::Mail, które oszczędziły mi sporo pracy. Moduł ten wykorzystany jest również w serwisie The Media Beat.

W maju 2006 roku strona została uruchomiona.

Użyte technologie: PHP5, MySQL 4.1, PEAR, Smarty

T.Media

Strona główna serwisu T.MediaT.Media to firma zajmująca się świadczeniem usług z zakresu public relations. Moim zadaniem było przygotować niewielką witrynę wizerunkową bazując na przygotowanym kodzie HTML. Miałem położyć nacisk na wykorzystanie Ajax i sprawdzić, jak wiele pracy potrzeba, by strona była również dostępna dla osób z wyłączonym JavaScript.

Wykorzystałem jako podstawę zestaw metod do obsługi Ajax’a napisany na potrzeby Echo of the Dreamer. Całość sprowadziła się do pobierania XML’a z treścią podstrony i podmieniania zawartości. Dodatkowo zapisywanie się do biuletynu (znowu skorzystałem z modułu napisanego przeze mnie wcześniej) było również obsługiwane w ten sposób.

W przypadku braku JavaScript menu na dole strony nie było podmieniane na wersję obsługującą Ajax, co pozwalało normalnie poruszać się po stronie.

Natknąłem się na bardzo dziwny błąd w Firefox: kliknięcie na opcję menu z animacji Flash powodowało zatrzymanie obsługi wszelkich zdarzeń JavaScript do momentu ruszenia myszką lub wciśnięcia jakiegoś klawisza. Pytałem, szukałem, ale nie znalazłem rozwiązania. :-(

Okazało się za to, że z poziomu JavaScript, można wywoływać metody we Flashu. Widzę, że teraz dostępny jest zestaw metod, który być może daje dużo większe możliwości.

Niestety, strona nie została uruchomiona. :-(

Użyte technologie: PHP5, MySQL 4.1, Smarty, PEAR, Ajax, JavaScript