Arkusz E.14-01-15.08

Zadanie egzaminacyjne

Utwórz witrynę internetową, bazę danych oraz grafiki. Wykorzystaj edytor tekstu koloryzujący składnie i/lub edytor WYSIWYG, programy graficzne oraz program MS Access lub LibreOffice Base.
Na stanowisku egzaminacyjnym znajduje się komputer z zainstalowanym systemem operacyjnym i oprogramowaniem, a także dokumentacja w postaci spisu zainstalowanego oprogramowania. Zaloguj się na konto egzamin z uprawnieniami administratora, bez hasła. Utwórz na pulpicie folder i nazwij go swoim numerem PESEL. Utwórz w nim podfoldery baza i grafika.

Wymagania dotyczące bazy danych

Utwórz bazę danych o nazwie matematycy (z odpowiednim dla wersji programu rozszerzeniem). Bazę danych zapisz, w folderze PESEL, w podfolderze baza. Baza powinna zawierać:
  1. dwie tabele o nazwach: Matematycy i Publikacje. Każda z tabel powinna zawierać klucz podstawowy, ponadto:
    a) tabela Matematycy zawiera pola: imie, nazwisko,
    b) tabela Publikacje zawiera pola: tytul, rokWydania, idAutora;
  2. relację opisującą zależność taką, aby można było każdemu z zapisanych w tabeli matematyków przypisywać wiele publikacji. Pole idAutora z tabeli Publikacje jest kluczem obcym tej relacji; formularz z podformularzem do wprowadzania danych. Na karcie formularza powinno być możliwe wpisanie danych jednego matematyka wraz z jego publikacjami;
Wprowadź dane do tabel na podstawie podanych niżej informacji:

Wymagania dotyczące grafiki

Utwórz zestaw dwóch grafik przedstawiających figury kwadratu i koła według następujących wymagań:
  1. format pliku PNG, pliki zapisane, w folderze PESEL, w podfolderze grafika, nazwy kwadrat.png oraz kolo.png,
  2. wymiary obrazu 80 x 80 px,
  3. kształt kwadratu powinien zawierać całą grafikę (długość boku 80 px),
  4. kształt koła powinien zawierać całą grafikę (średnica 80 px), kolor wypełnienia figur to dowolny odcień koloru brązowego, brak krawędzi,
  5. tło grafiki koła jest przeźroczyste.

Wymagania dotyczące struktury witryny internetowej

Utwórz stronę internetową, a pliki źródłowe zapisz w folderze nazwanym Twoim numerem PESEL. Utwórz strukturę strony internetowej według wymagań :
  1. wyświetlanie polskich liter w oparciu o kodowanie UTF-8,
  2. wszystkie strony witryny mają układ zgodny z rysunkiem 1. Składają się z banera , pod nim dwóch paneli: lewego oraz prawego, a także stopki znajdującej się na dole witryny;
  3. wzajemne położenie banera, paneli i sopki jest zorganizowane przy wykorzystaniu bloków. Nie należy wykorzystywać do tego celu ramek ani tabel;
  4. baner, panel lewy i stopka są stałe dla wszystkich podstron witryny;
  5. w bloku banera znajduje się tekst FIGURY GEOMETRYCZNE I MATEMATYCY. Kliknięcie myszą na napis przenosi do strony głównej;
  6. w lewym panelu znajdują się:
     - nagłówek trzeciego stopnia o treści WYBIERZ FIGURĘ,
     - lista numerowana z zagnieżdżoną listą numerowaną, której treść przedstawia rysunek 2, po kliknięciu słowa KWADRAT lub KOŁO następuje przejście do podstron,
     - odnośnik zapisany w nagłówku trzeciego stopnia o treści BAZA DANYCH, po jego kliknięciu pobierany jest plik bazy danych matematycy;
  7. w prawym panelu znajduje się treść strony głównej lub podstron;
  8. stopka zawiera tekst Strona stworzona przez: PESEL.W miejsce PESEL wstaw swój numer PESEL.

Rysunek 3. Wygląd witryny - strona główna (kursor na napisie KOŁO)
Utwórz oprawę graficzną strony. Wykorzystaj język CSS. Kod CSS umieść w osobnym pliku lub w części nagłówkowej każdego pliku HTML. Właściwości formatowania są następujące:
  1. szerokość panelu lewego: 20 %,
  2. wysokość panelu lewego: 500 px,
  3. szerokość panelu prawego: 80 %,
  4. tło elementów, czyli baner, panel lewy oraz stopka: kolor #63b03c,
  5. kolor czcionki  banera, lewego panelu i stopki: biały (kolor odnośników również biały),
  6. czcionka banera: krój Arial, rozmiar 300%, kapitaliki (small-caps),
  7. wyrównywanie tekstu banera i stopki: do środka,
  8. lista nienumerowana: typ punktora - kwadrat (właściwość list-style-type).

Wymagania dotyczące strony głównej i podstron

Wygląd strony głównej przedstawia rysunek 3. Należy wykorzystać wcześniej stworzone grafiki . W panelu prawym strony głównej umieść:
  1. tekst FIGURY GEOMETRYCZNE zapisany nagłówkiem pierwszego stopnia. Poniżej w jednym rzędzie wypisane słowa: KWADRAT, KOŁO. 
  2. po najechaniu myszki na dane słowo, w dowolnym miejscu panelu, pojawia się odpowiednia figura geometryczna. Figura znika, gdy kursor myszki przesuwa się poza dane słowo. 
Wygląd panelu prawego podstrony kwadrat jest zgodny z rysunkiem 4. Tekst KWADRAT powinien być zapisany nagłówkiem pierwszego stopnia.

Wciśnięcie dowolnego przycisku spowoduje uruchomienie kodu JavaScript, który:
  1. sprawdzi, czy pole do wprowadzania wartości jest puste lub czy wprowadzona wartość nie jest liczbą. Jeśli tak wyświetli w okienku treść komunikatu Należy wpisać wartość liczbową.
  2. w przeciwnym wypadku obliczy pole lub obwód, zależnie od wciśniętego przycisku. Zostanie wypisany tekst dla pola: Treść tekstu dla pola: P = a2 = ... (uwaga 2 zapisane w indeksie górnym). Dla obwodu: Obw =  4a = ... . W miejsce trzech kropek wstawiony jest wyliczony wynik.
W panelu prawym podstrony koło umieść treść: Podstrona w trakcie budowy, krój pisma pochylony.
Czas przeznaczony na wykonanie zadania wynosi 150 minut.
Ocenie podlegać będą 5 rezultatów:
  • baza danych, 
  • grafiki dla witryny internetowej, 
  • struktura witryny internetowej, 
  • styl dla elementów strony,
  • strona główna i podstrony witryny.

index.html