Narzędzia użytkownika

Narzędzia witryny


pl:jitw:lab_jitw_js_projekt

Laboratorium, JIiTW, JavaScript, Projekt

Walidacja Formularzy

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

1. [2p] W formularzu dokonywania wpisu 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) albo daty z przyszłości. 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 albo wykorzystanie możliwości HTML5. 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ć np. FireBug (rozszerzenie Firefox).

Uwaga: informacje o stylach tj. nazwa, rodzaj etc. nie mogą być zaprogramowane na sztywno w kodzie JavaScript, muszą być pobierane z odpowiednich elementów dokument XHTML!

Informacje na temat JavaScript i DOM:

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.

Uwaga: wymagane jest również napisanie kodu po stronie serwera w języku PHP.

[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.

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

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

pl/jitw/lab_jitw_js_projekt.txt · ostatnio zmienione: 2021/01/08 14:09 (edycja zewnętrzna)