Metody integracji techniki AJAX w aplikacjach Web opartych o platformę Java Enterprise Edition

Jan Mrzygłód 21 października 2006, Kraków Metody integracji techniki AJAX w aplikacjach Web opartych o platformę Java Enterprise Edition Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 1

Zobaczmy to na mapie Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 2

Jakieś sugestie? Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 3

Inni nie pozostają w tyle Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 4

Czy wiedziałeśże Aplikacje AJAX używają technologii które były z nami przez lata Jedyne czego brakowało to: Wizja. Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 5

Jaka jest więc c wizja? Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 6

Co to jest AJAX? Typowe wzorce AJAX Typowe problemy AJAX Biblioteki AJAX Integracja AJAX z JEE Narzędzia wspomagające Prezentacja praktyczna Pytania Agenda Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 7

Zaczynamy! Co to jest AJAX? Typowe wzorce AJAX Typowe problemy AJAX Biblioteki AJAX Integracja z JEE Narzędzia wspomagające Prezentacja praktyczna Pytania Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 8

Nie jest technologią Technika tworzenia interaktywnych aplikacji Web Cel: Interaktywnie Przyjaźnie Szybko AJAX w pigułce Ergonomicznie Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 9

Asynchronous Żądania są tworzone asynchronicznie z wykorzystaniem XMLHttpRequest Żądanie nie wstrzymuje przeglądarki oraz użytkownika JavaScript Język skryptowy Akronim JScript wg. Microsoftu And Inne technologie takie jak CSS, XHTML XML XML jako technologia wymian danych Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 10

Typowy przykład Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 11

Odpowiedź jako HTML Jak to działa Zwracany tekst lub HTML Modyfikacja strony Zalety Łatwe w oprogramowaniu Minimalna ilość JavaScript Mniej przetwarzania Wady Może zużywać więcej pasma Nie tak łatwe do powtórnego użycia jak ogólne serwisy Trudne to zorganizowania tak by modyfikować różne elementy strony Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 12

Odpowiedź semantyczna Jak to działa Zwracany XML lub JSON Interpretacja i modyfikacja Zalety Łatwość modyfikacji różnych elementów Małe wykorzystania pasma Powtórne użycie Wady XML wymaga parsingu który z kolei wymaga mocy obliczeniowej Inne podejścia jeśli chodzi o rendering inicjacyjny a modyfikacjy Mnóstwo specyficznego dla aplikacji kodu JavaScript Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 13

Odpowiedź skryptowa Jak to działa Zwracany JavaScript Uruchomienie i modyfikacja Zalety Minimum kodu JavaScript Łatwo wykorzystać możliwości głównego języka implementacji aby śledzić DOM, zarządzać aktualizacjami itp.. Wady Wrażliwe jeśli mieszamy wraz z bibliotekami które modyfikują DOM Bardzo ściśle związany ze strukturą strony trudne do re-użycia Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 14

Filozofia modelu Aplikacje AJAX nie: Przeładowują całej strony by zmodyfikować jej jedną część Ograniczają kreatywność twórców do niewielkiego zbioru kontrolek HTML Blokują aktywność użytkownika podczas oczekiwania na odpowiedź serwera Odświeżają strony pomiędzy ładowaniami Aplikacje AJAX zazwyczaj: Ładują dużo danych przy pierwszym wejściu na stronę Dokonują małych przyrostowych aktualizacji części strony Są interaktywne (informują użytkowników o tym co w danej chwili robią) Udostępniają elastyczne kontrolki Aplikacje AJAX są: Wydajne Ergonomiczne Interaktywne Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 15

Całe bogactwo aplikacji typu Desktop Zaawansowane kontrolki interfejsu użytkownika Natychmiastowa odpowiedź Drag & drop Animacje Ziemia obiecana? Szybkie odpowiedzi (brak białych plam w przeglądarce) Wszystkie zalety aplikacji typu Web Proste wdrażanie pomiędzy platformami Natychmiastowa aktualizacja poprzez instalacje na serwerze Siła i elastyczność projektu graficznego Bezpieczeństwo i stabilność po stronie serwera Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 16

Dwie strony medalu var xhr; try { xhr = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { xhr = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) { xhr = false; } } if (!xhr && typeof XMLHttpRequest!= 'undefined') { xhr = new XMLHttpRequest(); } Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 17

AJAX to coś więcej niż zdalne wywołania Manipulacje modelem DOM CSS DHTML Złożone efekty graficzne Bogate doświadczenia użytkowników Wiele narzędzi Rzeczywistość Szkielety łagodzące trud kodowania JavaScript Łatwy do użycia nawet poprzez niewielkie wstawki Budowa kompletnej aplikacja AJAX może przypominać budowę bogatej aplikacji desktop w języku JavaScript Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 18

Wgłę łębiamy się w AJAX Co to jest AJAX? Typowe wzorce AJAX Typowe problemy AJAX Biblioteki AJAX Integracja z JEE Narzędzia wspomagające Prezentacja praktyczna Pytania Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 19

Znacznik statusu operacji Kiedy używać Długotrwające operacje Ładowanie plików na serwer Każde żądanie asynchroniczne mogące trwać kilka sekund Jak działa Użytkownik wyzwala operacje Wywołane jest zapytanie asynchroniczne oraz pokazana jest animacja Gdy zostaje otrzymana odpowiedź animacja jest usuwana W bardziej skomplikowanych przypadkach możliwe jest użycie czasomierzy po stronie klienta / serwera modyfikujących procentowy stopień postępu procesu Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 20

Drill down Kiedy używać Interfejsy podobne do klientów email z listą oraz panelem do przeglądania Kiedykolwiek użytkownik może przeglądać listę oraz przewijać elementy Jak działa Aplikacja wysyła żądanie danych poprzez onclick lub onkeypress Zwracane rezultaty są umieszczane w przewijanym polu Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 21

Panel kontrolny popup Kiedy używać Panele z kontrolkami które nie w każdej chwili są potrzebne użytkownikowi Zaawansowane wyszukiwanie Przyciski które mają użyteczne opcje dla aktualnego elementu Jak działa Ukryty div zawierający panel kontrolny Przy zdarzeniu onclick, jest wywoływany i pozycjonowany Użytkownik może wykonywać operacje oraz zamknąć (schować) pop-up Do odkrywania/ukrywania panelu mogą być wykorzystywane efekty animacji Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 22

Drag & drop Kiedy używać Sterowanie zawartością Reorganizacja list Listy zakupów Re-aranżacja portletów Jak działa Rejestrujemy komponenty (np. okna) Odbiorniki zdarzeń przesunięć myszy są zarejestrowane w przesuwalnych komponentach Przy zdarzeniu onmouseup, sprawdzana jest pozycja przynależności do celów upuszczania Jeśli rozpoznano cel, wysyłane jest żądanie powiadamiające serwer W innym przypadku - animacja do powrotu do poprzedniego stanu Najprościej użyć szkieletu Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 23

Wirtualna przestrzeń Kiedy używać Serwisy map Każda aplikacja z funkcją zoom Bardzo duże wykresy bądź obrazy Jak działa Dane obrazu lub wykresu są dzielone na płytki Aktualnie widoczne identyfikatory płytek przechowywane są w tablicy JavaScript Wewnętrzny div wyświetla widoczne płytki w siatce Przy każdym przeciągnięciu siatka jest przesuwana Jeśli zachodzi potrzeba uaktualnienie poprzez żądanie zdalne Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 24

Natychmiastowa walidacja Kiedy używać Wyświetlanie błędu gdy nazwa użytkownika jest już zajęta Wyświetlanie błędów formatu Wyświetlanie podpowiedzi Jak działa Podobieństwo do auto-uzupełniania Akcja serwera uruchamiana onkeypressed Błędy wyświetlane przy polu wejściowym Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 25

Auto uzupełnianie Kiedy używać Pola zaznaczane kaskadowo Dynamiczne pola wyszukiwania Auto wypełnianie skojarzonych lub zależnych pól Uzupełnianie tabulatorem w polach formularza Jak działa Aplikacja wysyła do serwera wiadomości poprzez zdarzenia onkeypress, onchange Przychodzące wyniki są użyte do wpisania w inne pola lub zbiór wartości które mogą być zaznaczone i wybrane Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 26

Powiadamianie użytkownikau Kiedy używać Zakończenia lub pojawienie się błędów w długotrwających procesach Pojawienie się nowej wiadomości lub elementu Inny użytkownik aktualnie pracuje na tym samym obiekcie aplikacji Jak działa Strona zawiera niewidzialny obszar powiadomień Timer JavaScript periodycznie sprawdza (pooling) serwer poprzez zapytanie asynchroniczne Powiadomienie jest wyświetlane dla użytkownika w obszarze powiadomień Użytkownik może dokonywać operacji na powiadomieniu (pop-up control panel) Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 27

Profilowanie użytkownikau Kiedy używać Zapis preferencji wyświetlania Śledzenie czasu spędzonego na każdej stronie Śledzenie które pole formularza powoduje problemy Zdobywanie statystyk ergonomiczności Jak działa Akcje użytkownika ustawiające preferencje na stronie, wysyłają asynchroniczne akcje do serwisu preferencji gdzie zostają zapisane do przyszłego użytku Mogą być użyte timery Javascript do periodycznego wysyłania bitu życia (heartbeat) do serwera który może być użyty do śledzenia czasu spędzonego na danej stronie Żądanie może być wysłane przy przejściu pomiędzy polami formatki do śledzenia ile czasu jest spędzane nad każdym z pól i zrozumieć charakterystykę funkcjonalności Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 28

Efekty wizualne Kiedy używać Dodawanie lub kasowanie elementów strony Podświetlenia ostatnio dodanych lub zmodyfikowanych elementów strony Animacje dla zaawansowanych widgetów strony Jak działa Efekt wizualny rozpoczyna się poprzez rozpoczęcie czasowej sekwencji JavaScript która modyfikuje rozmiar, kolor, widoczność oraz inne atrybuty elementów Zazwyczaj ukrywane jako biblioteka efektów Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 29

Co to jest AJAX? Nie ma rzeczy idealnych Typowe wzorce AJAX Typowe problemy AJAX Biblioteki AJAX Integracja z J2EE Narzędzia wspomagające Prezentacja praktyczna Pytania Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 30

Problemy: Użytkownik wywołuje akcje zdalną bez zdawania sobie sprawy z tego faktu Brak pewności czy akcja została wywołana na serwerze Duplikacja żądań Można przypadkowo przerwać długotrwałą akcje Rozwiązania: Brak odpowiedzi Wyświetlać dyskretną animacje kiedy tylko jest jakaś operacja w tle Używać bibliotek efektów gdy uzyskano poprawną odpowiedź Zawsze wyświetlać komunikat błędu gdy tylko jest jakieś niepowodzenie operacji Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 31

Brak widoczności ci linku Problem: Duża część strony może być uaktualniona bez ładowania całej strony Pająki sieciowe mogą widzieć jedynie zawartość inicjującą Użytkownik nie może wysłać linka znajomym Użytkownik nie może zaznaczyć zawartości (bookmark) Trudność z linkiem z jednej części aplikacji do drugiej Rozwiązanie: Ładowania całej strony dla newralgicznych przejść Wspierać dwa modele przyrostowe modyfikacje oraz dla całej strony Udostępniać linki by użytkownik miał permanentny URL Udostępniać linki by użytkownik mógł wysłać URL do innych ludzi Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 32

Brak przycisku back Problem Zaawansowana aplikacja AJAX może mieć jedynie pierwszą stronę w pełni ładowalną Użytkownicy są przyzwyczajeni do używania przycisków następny / poprzedni Mogą niechcący wyjść za aplikacji tracąc całą zawartość strony Rozwiązanie Wsparcie dla linków (poprzedni slajd) Użycie biblioteki Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 33

Złamanie oczekiwań Web Problem Dane z formatek są wysłane bez submit a użytkownik nie zdaje sobie z tego sprawy Wiele indywidualnych przewijanych regionów na (przewijanej) stronie Nie działają klawisze back, bookmark Niespójne standardy kontrolek formularzy Rozwiązanie: Uważność w auto-zapisie formularzy Konsystencja w całej aplikacji Używanie popularnych bibliotek do efektów widget, tak aby użytkownik mógł je rozpoznać Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 34

Złamanie oczekiwań Desktop Problem: Aplikacje AJAX stają się zastępnikiem aplikacji konwencjonalnych Wyglądają tak jak aplikacje desktop (n.p. Outlook) Nie wspierają jednak (zazwyczaj) standardowych cech grubego klienta: Cofnięcie, powtórzenie (undo / redo) Auto-zapis Ostrzeżenie podczas zamknięcia nie zachowanego dokumentu Rozwiązanie Implementacja cofnięć, powtórzeń, auto-zapisu oraz ostrzeżeń przy zamykaniu Zapewnić że przycisk powrotu nie wyprowadzi użytkownika poza aplikacje Zapewnić by linki nie otwierały się w tym samym oknie/zakładce zastępując aplikacje Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 35

Ignorowanie błęb łędów Problem Użytkownik wywołuje zdalną operacje Wywołanie zwraca błędny kod lub zostaje przekroczony czas oczekiwania Użytkownik myśli iż akcja została poprawnie wywołana Strona jest niekompletna lub przestaje być spójna ze stanem serwera Rozwiązanie: Sprawdzać status HTTP w obiekcie odpowiedzi a nie tylko stan gotowości Wypisywać błędy procedur dla klauzul wyłapujących jak również błędne kody zwrotu Nie wyświetlać efektów sukcesu dopóki żądanie nie zostanie całkowicie obsłużone w tym czasie wyświetlać pasek postępu Zaimplementować spójny sposób informowania o błędach (komunikaty błędów, zaznaczenie na czerwono itp.) Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 36

Niespójne odświe wieżanie Problem: Jedna część strony jest odświeżana periodycznie (server polling) Inna część jest statyczna dopóki strona nie zostanie ponownie w pełni odświeżona Mylące dla użytkownika Dane mogą być niespójne Rozwiązanie: Nie mieszać statycznych oraz dynamicznych danych wybrać jedno rozwiązanie Nie zapominać zmodyfikować wszystkie części strony jeśli te same dane są powtórzone wielokrotnie Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 37

Starsze przeglądarki Problem Pewna funkcjonalność dostępna jedynie poprzez AJAX Użytkownicy z niekompatybilnymi przeglądarkami nie będą w stanie skorzystać z naszej aplikacji i być może nie będą nawet wiedzieli dlaczego aplikacja im nie działa Rozwiązanie Dostarczyć czyste strony HTML do dostępu do podstawowej funkcjonalności Testować z wyłączonym JavaScript Testować w starszych przeglądarkach Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 38

Za dużo o połą łączeń Problem Strona może posiadać kilka znaczników pollingu serwera Przeglądarki limitują liczbę równoczesnych połączeń Ryzyko konfliktu jednoczesnej zmiany w DOM Ryzyko znaczących spowolnień Rozwiązanie Bądź świadomy ile połączeń jest niezbędne Kolejkowaćżądania i wykonywać w sekwencji lub jako jedno połączone wywołanie Użycie oddzielnych wywołań zwrotnych (callbacks) do równoległych żądań tak aby odświeżyć właściwy znacznik stanu postępu Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 39

Eksplozja DOM Problem Rezultaty wywołania są zachowywane w DOM bez usunięcia poprzednich informacji Dynamiczna zawartość jest tworzona za każdym użyciem i tylko ukrywana kiedy już nie jest potrzebna Aplikacja zaczyna działać wolniej Rozwiązanie Usunięcie elementów z DOM kiedy są już niepotrzebne Ponowne użycie elementów pop-up, znaczników stanu, boksów komunikatów itd.. Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 40

Co to jest AJAX? Nie wymyślajmy koła Typowe wzorce AJAX Typowe problemy AJAX Biblioteki AJAX Integracja z J2EE Narzędzia wspomagające Prezentacja praktyczna Pytania Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 41

Biblioteki, szkielety - podział Specjalizowane biblioteki JavaScript Zdalne wywołania, Efekty, Drag & Drop, Komponenty DHTML Mogą być mieszane i dopasowane Wszechstronne biblioteki JavaScript Udostępniają powyższą funkcjonalność i więcej Czysty interfejs pomiędzy stroną serwera a klienta Language-specific Wrappery JavaScript Wygodne narzędzia / marka do ukrywania detali JavaScript Świetne do dodania małej właściwości AJAX do aplikacji Web W środku ciągle jednak JavaScript / DOM Language-specific Implementacje AJAX Brak zależności z zewnętrznymi bibliotekami Mogą wstawiać cechy języka do warstwy JavaScript Mogą być silnie zintegrowane z istniejącymi szkieletami W kontekście JEE omówione szerzej w kolejnym rozdziale Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 42

Uniwersalny zestaw narzędzi Pełny i wszechstronny, zawierający: Biblioteki pomocnicze JavaScript Operacje na DOM / CSS Biblioteki zdarzeń Kolekcje Wywołania zdalne Wsparcie dla JSON Parser XML Widgets WYSIWIG Text Editor Efekty Drag & Drop Walidacja Manipulacja grafiką DOJO Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 43

Biblioteka uniwersalnego zastosowania Udostępnia podstawowe udogodnienia metod JavaScript Np.. ${foo} zamiast document.getelementbyid( foo ) Zapewnia podstawową funkcjonalność AJAX Wywołania zdalne Periodyczne modyfikacje Ewaluacje JSON Prototype Lekka i prosto zintegrowana z innymi bibliotekami JavaScript Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 44

Rico Na podstawie Prototype Udostępnia podstawową funkcjonalność AJAX: wywołania zdalne, drag & drop, efekty (np. zaokrąglone rogi) widgets (live grid) Wsparcie dla modyfikacji więcej niż jednego elementu strony poprzez jedną odpowiedź Lekki i prosto zintegrowany z innymi bibliotekami Yahoo User Interface Library Echo Scriptaculous Rialto Popularne szkielety - inne Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 45

TrimPath trimpath.com Log4js log4js.sourceforge.net log4js.berlios.de JsUnit jsunit.net Biblioteki ogólne JSON parser kawa.net/works/js/jkl/parsexml.html Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 46

Małą czarną poproszę Co to jest AJAX? Typowe wzorce AJAX Typowe problemy AJAX Biblioteki AJAX Integracja z JEE Narzędzia wspomagające Prezentacja praktyczna Pytania Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 47

Biblioteki Integracja z Servlet API Integracja z JSF Integracja z JEE Integracja z Tapestry Integracja z Portlet API Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 48

Google Web Toolkit AjaxTags AjaxStruts Biblioteki dedykowane Javie Direct Web Remoting Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 49

Integracja z platformą JEE AjaxTags Szkielet Javy dla AJAX Usiłuje zasłonić developerów od praktycznie całego kodu JavaScript Niestandardowe znaczniki JSP dla funkcjonalności takich jak: Autouzupełnianie Callout Zamiana DOM Kaskadowe wybieranie Kaskadowe modyfikacje pól Zintegrowane efekty dla znacznika postępu stanu Dobry dla minimalnej ilości AJAX, jednak jeszcze niedojrzały Nie mylić z Struts AJAX Tags Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 50

Szkielet AJAX dla platformy Java Zachowanie podobne do RMI, daje dostęp do klas dostępnych po stronie serwera z kodu JavaScript klienta Faworyzuje styl odpowiedzi semantycznej Dodaje udogodnienia Odpowiedź przychodzi jako obiekt a nie XML Metody narzędziowe do modyfikacji zbioru opcji na podstawie tablicy Popularny DWR Direct Web Remoting Zintegrowany z przodującymi frameworkami javy (Struts, Tapestry, Spring, JSF) Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 51

Prosty przykład (1/4) Tworzenie obiektu XMLHttpRequest reprezentującego żądanie var req; function validate() { var idfield = document.getelementbyid("userid"); var url = "validate?id=" + escape(idfield.value); if (window.xmlhttprequest) { req = new XMLHttpRequest(); } else if (window.activexobject) { req = new ActiveXObject("Microsoft.XMLHTTP"); } req.open("get", url, true); req.onreadystatechange = callback; req.send(null); } Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 52

Prosty przykład (2/4) Przetwarzanie żądania przez Servlet i generowanie odpowiedzi public void doget(httpservletrequest request, HttpServletResponse response) throws IOException, ServletException { String targetid = request.getparameter("id"); if ((targetid!= null) &&!users.containskey(targetid.trim())) { response.setcontenttype("text/xml"); response.setheader("cache-control", "no-cache"); response.getwriter().write("valid"); } else { response.setcontenttype("text/xml"); response.setheader("cache-control", "no-cache"); response.getwriter().write("invalid"); } } Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 53

Prosty przykład (3/4) Zwrócenie odpowiedzi i wywołanie funkcji modyfikującej stronę function callback() { if (req.status == 200) { // call function to update the HTML DOM } } Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 54

Prosty przykład (4/4) Modyfikacja zawartości (poprzez DOM) var rootdisplaynode = document.getelementbyid("root"); var TAB = document.createelement("table"); TAB.cellSpacing = "0"; TAB.cellPadding = "0"; TAB.border = "0"; TAB.className = "table_class"; var TB = document.createelement("tbody"); var TR = document.createelement("tr") var TD = document.createelement("td"); var class = "td_class"; TD.className = "td_class"; var link = document.createelement("a"); link.href = "#"; link.appendchild(document.createtextnode("link")); TD.appendChild(link); TR.appendChild(TD); TB.appendChild(TR); TAB.appendChild(TB); rootdisplaynode.appendchild(tab); Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 55

Integracja AJAX oraz JSF Integracja z istniejącą architekturą JSF Niestandardowy komponent JSF współdziałający z kontrolerem AJAX Niestandardowy komponent JSF Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 56

Integracja z istniejącą architekturą Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 57

Kontroler AJAX Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 58

Niestandardowy komponent Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 59

Prosta Dedykowany Servlet, lub z użyciem szkieletu ogólnego przeznaczenia Zaawansowana Integracja z Tapestry Dedykowana biblioteka (np. Tacos), lub niestandardowe komponenty Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 60

Specyfika Portlet API w kontekście wykorzystania techniki AJAX Potencjalne problemy Rozwiązania AJAX & Portlet API Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 61

AJAX & Portlet API Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 62

Co to jest AJAX? Dobre narzędzie to podstawa Typowe wzorce AJAX Typowe problemy AJAX Biblioteki AJAX Integracja z J2EE Narzędzia wspomagające Prezentacja praktyczna Pytania Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 63

Popularne narzędzia Live Source Viewers Polegamy na view source do debugowania standardowych aplikacji web Nieeleganckie Nie działa gdy kod JavaScript dynamicznie dodaje/usuwa zawartość Narzędzie które przetłumaczy aktualny model DOM do widoku źródła Sprawdź rozszerzenia Firefox View Rendered Source Chart View Formatted Source Można również używać Ctrl-A oraz View selection source do otrzymania syntaktycznie podświetlonego widoku źródła strony. Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 64

Firefox plugins View Rendered Source Chart View formatted source Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 65

Nawigacja po całym drzewie DOM Widok właściwości każdego elementu Widok jak obliczany jest styl CSS Check out: Inspektorzy DOM Firefox built-in DOM Inspector (Tools Menu) Safari Debug Menu and Web Inspector Internet Explorer Developer Tool and DOM Inspector Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 66

Odpluskwiacze JavaScript Każda aplikacja AJAX posiada dużo kodu JavaScript Przeglądarki (w szczególności inne niż Mozilla) nie ułatwiają odpluskwiania Brak łatwego sposobu na logowanie informacji debugujących w sposób niezniszczalny po przeładowaniu strony Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 67

Java Script Debuggers Sprawdź Venkman JavaScript Debugger MyEclipse JavaScript Debugger (oraz inne narzędzia dla AJAX) Microsoft Script Debugger Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 68

IE WebDeveloper Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 69

FF DOM Inspector Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 70

FF JavaScript Debugger Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 71

FF FireBug Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 72

Książki Pragmatyczny AJAX Wzorce Projektowe AJAX AJAX w akcji Strony web AjaxPatterns.org AlistApart.com Ajaxian.com Gdzie dowiedzieć się więcej? Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 73

Show time Co to jest AJAX? Typowe wzorce AJAX Typowe problemy AJAX Biblioteki AJAX Integracja z J2EE Narzędzia wspomagające Prezentacja praktyczna Pytania Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 74

Portal Liferay Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 75

Platforma BEA ALSB Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 76

O firmie Jesteśmy firmą zaawansowanych technologii Działamy na rynku Globalnym Dostarczamy wysokiej jakości produkty Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 77

Partnerzy technologiczni Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 78

Co to jest AJAX? Partnerzy technologiczni Typowe wzorce AJAX Typowe problemy AJAX Biblioteki AJAX Integracja z J2EE Narzędzia wspomagające Prezentacja praktyczna Pytania Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 79

Zakończenie Dziękuj kuję za uwagę! Jan Mrzygłód Java Developer Days 2006 www.softwaremind.pl 80