====== Laboratorium, TIiM, JavaScript, Projekt ======

===== Walidacja Formularzy =====

Należy przeprowadzić walidacje/modyfikacje zawartości formularzy korzystając z JavaScript:

1. **[2p]** W formularzu z projektu dot. Blogu, pola data i godzina muszą zawierać domyślnie aktualna datę i godzinę klienta.

2. **[3p]** Przy modyfikacji daty i godziny należy wymusić zgodność z formatem: RRRR-MM-DD , GG:MM. Ponadto należy zaprogramować mechanizm uniemożliwiający wprowadzenie nieistniejącej daty (0<miesiąc<12, 0<dzień<{28,29,30,31}, 0<rok).
Przy wystąpieniu błędu data i godzina powinna być aktualizowana do bieżącej.

3. **[3p]** Dodaj mechanizm umożliwiający przesłanie dowolnej liczby
plików: dynamiczne dodawanie odpowiednich elementów służących do
przesyłania zawartości pliku. Zwróć uwagę na odpowiednie nazywanie elementów umożliwiających przesłanie pliku.

===== JavaScript i CSS ===== 

4. **[1p]** Kod JavaScript realizujący poniższe ćwiczenia umieść w osobnym pliku,
inkludowanym przez każda stronę Twojego portalu (jako portal rozumiany jest system blogów albo portal implementowany jako rezultat projektów XHTML/CSS).

5. **[3p]** Używając DOM wygeneruj listę dostępnych stylów alternatywnych na
każdej stronie swojego portalu z poprzednich ćwiczeń.
Lista może być zbudowana np. z elementów li, albo a albo list rozwijanych formularza.

Do przeglądnięcia hierarchii elementów możesz użyć DOM Inspector lub FireBug
(rozszerzenia Firefox).

**Uwaga**: informacje o stylach tj. nazwa, rodzaj etc. nie mogą być zaprogramowane na sztywno!

Informacje na temat JavaScript i DOM: 
  * http://www.w3schools.com/js/js_obj_htmldom.asp
  * http://developer.mozilla.org/en/docs/The_DOM_and_JavaScript
  * http://developer.mozilla.org/en/docs/Gecko_DOM_Reference
  * http://www.w3.org

6. **[2p]** Korzystając z onClick na elementach listy i DOM zaprogramuj stronę
tak aby przeglądarka przełączała aktywny styl.

Podpowiedź: element LINK określający styl posiada własność disabled,
która ustawiona jest na true dla stylów alternatywnych oraz false
dla preferowanych oraz persistant.
**Uwaga** na kaskadowe łączenie stylów i wiele elementów LINK o takiej
samej wartości atrybutu title.

7. **[3p]** Za pomocą Cookies zaprogramuj aby wybrany styl był domyślny przy
ponownym odwiedzaniu strony, albo przejściu do innej strony Twojego
portalu.

===== AJAX =====

Zaimplementuj prosty interaktywny komunikator dla osób odwiedzających Twojego bloga.

**[2p]** Interfejs komunikator musi składać się z następujących elementów:
  * Przycisk aktywujący komunikator (checkbox)
  * Tekstowe pole wyświetlające komunikaty
  * Tekstowe pole do wpisania imienia.
  * Tekstowe pole do wysyłania komunikatów.
  * Przycisk wyślij, wysyłający komunikat.

**[7p]** Komunikator jest aktywny tylko wtedy, gdy przycisk aktywujący jest włączony.
Pole wyświetlające komunikaty zawiera wiadomości przysyłane przez wszystkich użytkowników korzystających z komunikatora.
Wyświetlany komunikat musi być poprzedzony imieniem nadawcy np:

  Kasia: Pisz szybko bo szybko czytam.

**[2p]** Aplikacja powinna być skalowalna, proszę zminimalizować częstotliwość tworzenia nowych połączeń z serwerem, jednocześnie zapewniając komunikację w czasie rzeczywistym.

**Uwaga**: ilość komunikatów przechowywana na serwerze musi być ograniczona.