Arkusz EE.09 : 2020 - czerwiec - zad. 03 (php)

Oznaczenie: EE.09-03-20.06-SG   Limit czasu: 150 minut

Zadanie egzaminacyjne

Wykonaj aplikację internetową kalendarza, wykorzystując pakiet XAMPP oraz edytor zaznaczający składnię.

Aby wykonać zadanie zaloguj się na konto Egzamin bez hasła. Na pulpicie znajdziesz archiwum ZIP o nazwie kalendarz.zip zabezpieczone hasłem: kaL(end)arz%

Archiwum należy rozpakować.

Pobierz kalendarz.zip

Na pulpicie konta Egzamin utwórz folder. Jako nazwy folderu użyj swojego numeru PESEL. Umieść w tym folderze rozpakowane pliki.

Po skończonej pracy wyniki zapisz również w tym folderze.

Operacje na bazie danych

Do wykonania zadania należy użyć tabeli zadania przedstawionej na Obrazie 1.

Obraz 1. Tabela zadania

Uruchom usługi MySQL i Apache za pomocą XAMPP Control Panel. Za pomocą narzędzia phpMyAdmin wykonaj podane operacje na bazie danych:

  • Utwórz bazę danych o nazwie egzamin5
  • Do bazy egzamin5 zaimportuj tabele z pliku baza5.sql z rozpakowanego archiwum
  • Wykonaj zrzut ekranu po imporcie. Zrzut zapisz w formacie PNG pod nazwą import w folderze opisanym numerem PESEL. Nie kadruj zrzutu. Zrzut powinien obejmować cały ekran monitora, z widocznym paskiem zadań. Na zrzucie powinny być widoczne elementy wskazujące na poprawnie wykonany import tabel
  • Zapisz i wykonaj zapytania SQL działające na bazie egzamin5. Zapytania zapisz w pliku kwerendy.txt, w folderze z numerem PESEL. Wykonaj zrzuty ekranu przedstawiające wyniki działania kwerend. Zrzuty zapisz w formacie JPG i nadaj im nazwy kw1, kw2, kw3, kw4. Zrzuty powinny obejmować cały ekran monitora z widocznym paskiem zadań
    • Zapytanie 1: wybierające jedynie pola miesiac i rok z tabeli zadania dla zadania z datą 2020-07-01
    • Zapytanie 2: wybierające jedynie pola dataZadania i wpis z tabeli zadania dla zadań, których miesiąc to lipiec
    • Zapytanie 3: wybierające jedynie pole miesiąc i wyświetlające je bez powtórzeń, z tabeli zadania dla miesięcy zaczynających się na literę „l” (l jak lew, lizak)
    • Zapytanie 4: zmieniające pole wpis w tabeli zadania dla zadania z datą 2020-07-13, nowy wpis to „Wycieczka: jezioro”

Witryna internetowa

Obraz 2. Witryna internetowa

Przygotowanie grafiki:

  • Plik logo1.png, wypakowany z archiwum, należy przeskalować z zachowaniem proporcji tak, aby jego wysokość wynosiła dokładnie 150 px

Cechy witryny:

  • Składa się ze strony o nazwie kalendarz.php
  • Zastosowany właściwy standard kodowania polskich znaków
  • Tytuł strony widoczny na karcie przeglądarki: „Mój kalendarz”
  • Arkusz stylów w pliku o nazwie styl5.css prawidłowo połączony z kodem strony
  • Podział strony na bloki: dwa bloki banera, poniżej blok główny, w którym znajdują się bloki wyświetlające dane kolejnych dni, na dole blok stopki. Podział zrealizowany za pomocą znaczników sekcji tak, aby po uruchomieniu w przeglądarce wygląd układu bloków był zgodny z Obrazem 2
  • Zawartość pierwszego bloku banera: logo1.png z tekstem alternatywnym o treści: „Mój kalendarz”
  • Zawartość drugiego bloku banera:
    • Nagłówek pierwszego stopnia o treści: „KALENDARZ”
    • Efekt działania skryptu 1
  • Zawartość bloku głównego: Efekt działania skryptu 2
  • Zawartość stopki:
    • Formularz wysyłający dane metodą POST do tej samej strony, zawierający:
      • Pole edycyjne podpisane: „dodaj wpis: ”
      • Przycisk wysyłający zawartość formularza z opisem „DODAJ”
    • Paragraf (akapit) o treści: „Stronę wykonał: ”, dalej wstawiony numer PESEL zdającego

Styl CSS witryny internetowej

Cechy formatowania CSS:

  • Domyślne dla całej strony: krój czcionki Arial
  • Dla pierwszego bloku banera: kolor tła #483D8B, wysokość 150 px, szerokość 30%
  • Dla drugiego bloku banera: kolor tła #483D8B, biały kolor czcionki, wysokość 150 px, szerokość 70%
  • Dla bloku wyświetlającego dane jednego dnia: kolor tła #AFEEEE, szerokość 150 px, wysokość 100 px, marginesy zewnętrzne 3 px, obramowanie o szerokości 1 px, linią ciągłą
  • Dla stopki: kolor tła #483D8B, biały kolor czcionki, marginesy wewnętrzne 10 px
  • Dla znacznika nagłówka piątego stopnia: wyrównanie tekstu do środka

Skrypt połączenia z bazą

W tabeli 1 podano wybór funkcji PHP, do obsługi bazy danych. Wymagania dotyczące skryptu:

  • Napisany w języku PHP, w pliku kalendarz.php
  • Łączy się z serwerem bazodanowym na localhost, użytkownik root bez hasła, baza danych o nazwie egzamin5
  • Działanie skryptu 1:
    • Wysyła do bazy danych zapytanie 1
    • Wyświetla w nagłówku trzeciego stopnia tekst: „miesiąc: <nazwa_miesiąca>, rok: <rok>”, gdzie pola w nawiasach <…> oznaczają dane pobrane skryptem
  • Działanie skryptu 2:
    • Wysyła do bazy danych zapytanie 2
    • Definiuje blok (za pomocą znacznika sekcji), a w nim wyświetla dane przesłane skryptem, dotyczące jednego wiersza. Blok jest zgodny z Obrazem 3 oraz jest w nim wyświetlone:
      • Data zadania w nagłówku piątego stopnia
      • Pole wpis w paragrafie (akapicie)
      • Liczba wygenerowanych bloków odpowiada liczbie wierszy zwróconych zapytaniem

Obraz 3. Pierwszy blok

  • Działanie skryptu, który odbiera dane przesłane z formularza
    • Skrypt pobiera dane z pola edycyjnego
    • Następnie uaktualnia dane w bazie danych. Aby uprościć zadanie skrypt wprowadza wpis zawsze do rekordu o dacie 2020-07-13. Do uaktualnienia danych wykorzystaj zapytanie 4 modyfikując w nim wartość pola wpis
  • Na końcu działania skrypt zamyka połączenie z serwerem

Tabela 1. Wybór funkcji języka PHP do obsługi bazy MySQL i MariaDB

Funkcje bilioteki mysqli Zwracana wartość
mysqli_connect(serwer, uzytkownik, haslo, nazwa_bazy) id połączenia lub FALSE, gdy niepowodzenie
mysqli_select_db(id_polaczenia, nazwa_bazy) TRUE / FALSE, w zależności od stanu operacji
mysqli_error(id_polaczenia) Tekst komunikatu błędu
mysqli_close(id_polaczenia) TRUE / FALSE, w zależności od stanu operacji
mysqli_query(id_polaczenia, zapytanie) Wynik zapytania
mysqli_fetch_row(wynik_zapytania) Tablica numeryczna odpowiadająca wierszowi zapytania
mysqli_fetch_array(wynik_zapytania) Tablica zawierająca kolejny wiersz z podanych w wyniku zapytania lub FALSE, jeżeli nie ma więcej wierszy w wyniku zapytania
mysqli_num_rows(wynik_zapytania) Liczba wierszy w podanym zapytaniu
mysqli_num_fields (wynik_zapytania) Liczba kolumn w podanym zapytaniu
UWAGA!
Po zakończeniu pracy utwórz plik tekstowy. Zapisz w nim nazwę przeglądarki internetowej, w której weryfikowałeś poprawność działania witryny. Nazwij plik przeglądarka.txt i zapisz go w folderze z numerem PESEL.
Nagraj płytę z rezultatami pracy. W folderze z numerem PESEL powinny się znajdować następujące pliki: import.png, kalendarz.php, kw1.jpg, kw2.jpg, kw3.jpg, kw4.jpg, kwerendy.txt, logo1.png, przeglądarka.txt, styl5.css, ewentualnie inne przygotowane pliki.
Po nagraniu płyty sprawdź poprawność nagrania. Opisz płytę swoim numerem PESEL i zapakowaną w pudełku pozostaw na stanowisku wraz z arkuszem egzaminacyjnym.

Czas przeznaczony na wykonanie zadania wynosi 150 minut.

Ocenie będzie podlegać 5 rezultatów:

  • operacje na bazie danych
  • zawartość witryny internetowej
  • działanie witryny internetowej
  • styl CSS witryny internetowej
  • skrypt połączenia z bazą.