Zadanie 12

Wykonaj aplikację internetową portalu ogłoszeniowego. Wykorzystaj pakiet XAMPP jako środowisko bazodanowo-aplikacyjne. Stronę internetową zbuduj przy  wykorzystaniu edytora zaznaczającego składnię.
Aby wykonać zadanie, ściągnij archiwum ZIP o nazwie materialy.zip. Archiwum należy rozpakować.
Na pulpicie utwórz folder. Jako nazwy folderu użyj swojego nazwiska. Rozpakowane pliki umieść w tym folderze. Po skończonej pracy wyniki zapisz także w tym folderze.

Baza danych

Baza danych jest zgodna ze strukturą przedstawioną na obrazie 1. Tabela ogloszenie ma klucz obcy uzytkownik_id będący w relacji z kluczem głównym tabeli uzytkownik. Pole kategoria przyjmuje wartości liczbowe: 1 – książki, 2 – muzyka.

• Uruchom usługi MySQL i Apache za pomocą XAMPP Control Panel. Za pomocą narzędzia phpMyAdmin wykonaj podane operacje na bazie danych:
  Utwórz nową bazę danych o nazwie ogloszenia
  Do bazy ogloszenia zaimportuj tabele z pliku baza.sql z wcześniej rozpakowanego archiwum
• Wykonaj zrzut ekranu po imporcie. Zrzut zapisz w folderze znazwiskiem, w formacie JPEG i nazwij import.jpg. Nie kadruj zrzutu. Powinien on obejmować cały ekran, 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 ogloszenia. Zapytania zapisz w pliku kwerendy.txt, w folderze znazwiskiem. Wykonaj zrzuty ekranu przedstawiające wyniki działania kwerend. Zrzuty zapisz w formacie JPEG 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 id, tytul i tresc z tabeli ogloszenie dla tych rekordów, dla których kategoria to książki 
• Zapytanie 2: wykorzystujące relację pomiędzy tabelami i wybierające jedynie telefon tego użytkownika, który jest przypisany do ogłoszenia numer 1
• Zapytanie 3: tworzące użytkownika moderator na localhost z hasłem qwerty 
• Zapytanie 4: nadające prawa dla użytkownika moderator do usuwania i przeglądania danych w tabeli ogloszenie.

Witryna internetowa

Przygotowanie grafiki

• Plik ksiazki.jpg, wypakowany z archiwum, należy przeskalować do wymiarów: szerokość 200 px, wysokość 300 px. Pozostałych atrybutów obrazu nie należy zmieniać

Cechy witryny

• Nazwa pliku: ogloszenia.php
• Zastosowany właściwy standard kodowania polskich znaków
• Tytuł strony widoczny na karcie przeglądarki: „Portal ogłoszeniowy”
• Arkusz stylów w pliku o nazwie styl1.css prawidłowo połączony z kodem strony
• Podział strony na bloki: baner, panele lewy i prawy, stopka zrealizowany za pomocą znaczników sekcji, tak aby po uruchomieniu strony w przeglądarce wygląd był zgodny z obrazkiem
• Zawartość banera: nagłówek pierwszego stopnia o treści: „Portal Ogłoszeniowy”
• Zawartość panelu lewego:
• Nagłówek drugiego stopnia o treści: „Kategorie ogłoszeń”
• Lista numerowana z trzema elementami: Książki, Muzyka, Filmy
• Obraz ksiazki.jpg z tekstem alternatywnym o treści: „Kupię / sprzedam książkę”
• Tabela o wymiarach 3 kolumny na 4 wiersze. Ostatnia kolumna zawiera scalone trzy wiersze.
• Zawartość i wygląd tabeli zgodne ze wzorem:
  
• Zawartość panelu prawego:
• Nagłówek drugiego stopnia o treści: „Ogłoszenia kategorii książki”
• Skrypt połączenia z bazą
• Zawartość stopki: napis o treści: „Portal ogłoszeniowy opracował:”, dalej wstawiony Twój numer PESEL.

Styl CSS witryny internetowej

Plik styl1.css zawiera formatowanie:

• Banera: kolor tła #40271A, biały kolor czcionki, krój czcionki: Tahoma, wyrównanie tekstu do środka, wysokość 80 px
• Panelu lewego: kolor tła #DBB29C, szerokość 40%, wysokość 700 px
• Panelu prawego: kolor tła #FFE3D4, szerokość 60%, wysokość 700 px
• Stopki: kolor tła #40271A, biały kolor czcionki, wyrównanie tekstu do prawej strony
• Tabeli, komórki tabeli: obramowanie na 1 px linią przerywaną brązową, szerokość tabeli 500 px, marginesy zewnętrzne 10 px, wyrównanie tekstu do środka
• Obrazu: marginesy wewnętrzne 30 px
• Listy numerowanej: styl punktora cyfry rzymskie wielkie

Niewymienione właściwości selektorów przybierają wartości domyślne.

Skrypt połączenia z bazą

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

• Napisany w języku PHP
• Nie jest wymagane sprawdzenie, czy operacja na bazie danych powiodła się
• Skrypt łączy się z serwerem bazodanowym na localhost, użytkownik root bez hasła, baza danych o nazwie ogloszenia
• Skrypt wysyła do bazy danych dwa zapytania:
• zapytanie 1 (patrz punkt „Operacje na bazie danych”)
• zapytanie 2 (patrz punkt „Operacje na bazie danych”) zmodyfikowane tak, aby dla danego id ogłoszenia pobierany był numer telefonu użytkownika, do którego należy ogłoszenie
• Dla każdego zwróconego zapytaniem wiersza wykonuje następujące działania:
• Wyświetla w nagłówku trzeciego stopnia pola id oraz tytul
• Wyświetla w akapicie treść ogłoszenia
• W kolejnym akapicie wyświetla tekst: „telefon kontaktowy:” i dalej numer telefonu pobrany zmodyfikowanym zapytaniem 2
• Na końcu działania skrypt zamyka połączenie z serwerem.

Czas przeznaczony na wykonanie zadania wynosi 150 minut.

Ocenie będą podlegać 4 rezultaty:

• operacje na bazie danych,
• witryna internetowa,
• styl CSS witryny internetowej,
• skrypt połączenia z bazą.