DamianJamrozy / HTML-CSS-JS-PHP---Mini-University-Shop-Project-PRZEGRYWY

Own shoop named 'prze-gry.wy'. Its the biggest project with I created for funn.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Projekt zaliczeniowy z przedmiotu: Aplikacje internetowe

Temat projektu: Internetowy Sklep z Grami.

Skład grupy: Damian Jamroży & Rafał Iwańczyk

Specyfikacja projektu

Cel projektu : Utworzenie pseudo sklepu internetowego z grami cyfrowymi.

Cele szczegółowe:

  1. Symulacja sklepu internetowego.
  2. Symulacja koszyka sklepu internetowego.
  3. Symulacja metod płatności.
  4. Symulacja zakupów z wykorzystaniem kodów rabatowych
  5. Administracja dostępnymi danymi w bazie danych.
  6. Administracja symulowanych zakupów.
  7. Utworzenie wydajnego komunikatora pomiędzy użytkownikiem a moderatorem sklepu.

Funkcjonalności:

  1. Rejestracja nowych użytkowników.
  2. Logowanie do kont administracyjnych, moderacyjnych oraz zwykłych użytkowników.
  3. Edycja informacji dotyczących użytkowników.
  4. Wirtualny koszyk przetrzymujący informacje o obecnym zamówieniu.
  5. Funkcjonalności CRUD.
  6. Obsługa wirtualnych metod płatności.
  7. Składanie wirtualnych zamówień.
  8. Wyświetlanie mini statystyk strony (tj. ilość użytkowników oraz ilość złożonych zamówień).
  9. Wyświetlanie rozbudowanych danych statystycznych dostępnych jedynie dla administratorów, wyświetlanych w postaci boxów oraz wykresów. Przedstawiają one statystyki dotyczące zarobków za dany miesiąc/rok oraz ilość nowych oraz obecnych użytkowników.
  10. Wybór avatarów profilu.
  11. Wczytywanie dynamicznie budowanych stron opartych na skryptach PHP.
  12. Instant czat z moderacją w stylu messengera.

Interfejs serwisu

Ekran główny (Home)

alt text

       Przedstawiono stronę główną aplikacji (index.php).

Strona ta zawiera sekcje takie jak: header, baner, content oraz foter. Układ ten jest powielany na większości podstron z wyjątkiem slidera. Jest on ustawiony jako tło baneru, a napisany został w języku CSS. Strona ta dotyczy głównie kwestii wizualnej. Home jest wizytówką każdej strony internetowej i to często od jej wyglądu zależy, czy użytkownik postanowi ją obejrzeć w całości czy też nie. Kolorystycznie nawiązuje do barw neonowych, które są uwielbiane przez większość graczy - czyli grupę docelową symulowanego sklepu.

alt text

       Przedstawiono stronę główną aplikacji (index.php) - scroll.

Poniżej slidera na stronie startowej wyświetlają się również animowane mini statystyki wirtualnego sklepu, wczytywane z bazy danych. Dotyczą one liczby złożonych zamówień oraz ilości zarejestrowanych użytkowników.

alt text

       Przedstawiono stronę główną aplikacji (index.php) - menu.

Na stronie w sekcji header funkcjonuje logo oraz zakładki, umożliwiające łatwe przemieszczanie się pomiędzy różnymi podstronami. Kolor niebieski oznacza obecną stronę, natomiast kolor fioletowy to zakładka po najechaniu kursora myszy..

Ekran RODO

alt text

       Przedstawiono stronę RODO (rodo.php).

Strona ta nie zawiera żadnych funkcjonalności. Jest to jedynie strona opisowa, zawierająca informacje dotyczące RODO.

Ekran Kart Lojalnościowych

alt text

       Przedstawiono stronę Kart Lojalnościowych (loyality.php).

Strona ta nie zawiera żadnych funkcjonalności. Jest to jedynie strona opisowa, zawierająca informacje dotyczące kart lojalnościowych.

Ekran O Sklepie

alt text

       Przedstawiono stronę O sklepie (me.php).

Strona ta nie zawiera żadnych funkcjonalności. Jest to jedynie strona opisowa, umożliwiająca pozyskanie większej ilości informacji dotyczących wirtualnego sklepu. (Funkcja reprezentacyjna).

Ekran Kontakt

alt text

       Przedstawiono stronę Kontakt (contact.php).

Strona ta nie zawiera żadnych funkcjonalności. Jest to jedynie strona opisowa, umożliwiająca pozyskanie większej ilości informacji dotyczących kontaktu z właścicielami sklepu.

Ekran Produkty

alt text

       Przedstawiono stronę produkty (brand.php).

Na stronie tej wyświetlane są okładki gier sprzedawanych w naszym sklepie. Okładki te przechowywane są w bazie danych za pomocą bloblong. Każda z okładek wczytywana jest w postaci formularza, który ma za zadanie pobrać oraz przesłać id wybranej gry do strony danego produktu. Strona ta jest w 100% generowana na podstawie otrzymanego id. Na górze strony wyświetla się top 6 gier, pod względem sprzedaży.

alt text

       Przedstawiono stronę produkty (brand.php).

Poniżej listy bestsellerów znajdują się wszystkie inne gry, dostępne do kupna w bazie danych. Na wszystkie okładki gier, narzucane zostają nazwy platformy wraz z ich ceną dla wyznaczonej gry.

alt text

       Przedstawiono stronę produkty - wyszukiwarka (brand.php).

Pod banerem na stronie produktów wyświetlają się dwa przyciski, służące do obsługi wyszukiwarki. Wyszukiwarka ta, przeszukuje nazwy oraz opisy gier w poszukiwaniu wpisów zbliżonych do podanych przez użytkownika. Jeżeli natrafi na podobny rekord to wyświetla go w postaci okładki gry. Jeżeli takowych rekordów jest bardzo dużo to wypisuje 16 najbardziej pasujących gier, a na górze strony podaje liczbę wszystkich pasujących rekordów.

alt text

       Przedstawiono stronę produkty - wyszukiwarka (brand.php).

Jeżeli użytkownik nie odnalazł pasujących dla niego rekordów może dopisać więcej szczegółów w celu zmniejszenia ilości uzyskanych rekordów lub zwinąć okno wyszukiwarki, klikając na strzałkę, znajdującą się w prawym dolnym rogu ekranu.

Ekran Produkt -> Wybrany produkt

alt text alt text

       Przedstawiono stronę produkt (product.php).

Strony produktów są w pełni zautomatyzowane. Zawartość jest generowana na podstawie informacji zawartych w bazie danych. Każda z gier nie posiada osobnej podstrony, co pozwala na wysoką oszczędność pamięciową. Informacje o grze są automatycznie wczytywane do utworzonego wcześniej szablonu graficznego.

alt text

       Przedstawiono stronę produkt (product.php).

Na podstawie wygenerowanych danych, użytkownik może wybrać odpowiednią konfigurację gry, którą chce nabyć. Musi wybrać odpowiednio platformę, edycję, wersję oraz ilość kopii. Wybór ilości kopii odblokowuje się dopiero po wybraniu platformy, a ich liczba jest zależna od zawartości bazy danych.

alt text

       Przedstawiono stronę produkt (product.php) - po zatwierdzeniu kupna.

Po zatwierdzeniu chęci kupna gry, informacje o wyborach użytkownika zostają przesłane do zmiennej sesyjnej, a użytkownik może zadecydować, czy chce przejść do koszyka, czy woli wybrać więcej produktów i przejść do koszyka później.

Ekran Koszyk

alt text

       Przedstawiono stronę Koszyk (bucket.php) - Pusty.

Gdy użytkownik nie doda jeszcze produktu (zmienna sesyjna jest pusta), na ekranie wyświetla się odpowiedni komunikat.

alt text

       Przedstawiono stronę Koszyk (bucket.php).

Gdy koszyk nie jest pusty, użytkownik na ekranie uzyskuje obraz aktualnego zamówienia wraz z jego szczegółami. Jeżeli posiada on kartę lojalnościową, w tym momencie zostają naliczone zniżki do zamówienia, które odejmowane są od ceny dostawy lub sumy zamówienia.

alt text

       Przedstawiono stronę Koszyk (bucket.php).

Poniżej informacji o zamówieniu, użytkownik ma do wyboru metodę dostawy oraz metodę płatności. Jeżeli użytkownik wybierze produkt w wersji CD-KEY, a w zamówieniu nie ma żadnej gry w wersji pudełkowej, może on wybrać opcję dostawy w wersji CD-KEY’a, który zostanie przesłany na podany adres email. W razie wyboru takowej opcji, w metodzie płatności „Gotówka” ulega zablokowaniu, tak aby użytkownik musiał dokonać płatności w sposób zdalny. Jeżeli natomiast użytkownik wybierze grę w wersji Pudełkowej na liście dotyczącej metody dostawy opcja CD-KEY jest niewidoczna.

alt text alt text

       Przedstawiono stronę Koszyk (bucket.php).

Po wybraniu odpowiedniej metody dostawy, użytkownik otrzymuje różne opcje do wyboru. Przy dostawie „Odbiór w sklepie” użytkownik musi wybrać jedną z istniejących placówek firmy, przy innych metodach musi podać adres dostawy.

alt text

       Przedstawiono stronę Koszyk (bucket.php).

Użytkownik, który podał swoje dane podczas konfiguracji konta, bądź uzupełnił je później, za pomocą edycji konta ma dostęp do opcji autouzupełniania. Po kliknięciu przycisku typu radio, w miejsce wymaganych danych, wklejają się podane informacje. Wszystkie podane informacje muszą przejść walidację, tak aby kod pocztowy lub numer telefonu, spełniał wymagania formalne.

alt text

       Przedstawiono stronę Koszyk - Podsumowanie (sum_bucket.php).

Po zatwierdzeniu informacji, użytkownik zostaje przekierowany do strony podsumowującej zamówienie. Na stronie tej wyświetlają się wszystkie niezbędne informacje, a poniżej podanych danych, użytkownik musi podać dane (w przypadku metody płatności innej niżeli gotówka). Dane te nie są weryfikowane, gdyż jest to jedynie symulacja sklepu – nie metod płatności.

alt text

       Przedstawiono stronę Koszyk - Podsumowanie (sum_bucket.php).

Po potwierdzeniu zamówienia, użytkownik otrzymuje odpowiedni komunikat, a zamówienie zostaje dodane do bazy danych, pomniejszając ilość dostępnych kopii gier, tak aby następny użytkownik nie mógł zamówić gry, która jest już kupiona.

Ekran Zaloguj / Rejestracja

alt text

       Przedstawiono stronę Logowania / Rejestracji (login.php).

Zakładka zaloguj się (przycisk) jest dynamicznie kontrolowana przez status sesji. Gdy użytkownik posiada już konto oraz poprawnie zaloguje się w panelu dostępnym po lewej stronie ekranu. Następuje podmiana przycisku zaloguj się, na przycisk wyloguj się. Po kliknięciu przycisku wyloguj się, sesja zostaje zamknięta, a użytkownik przestaje mieć dostęp do ekranu edycji konta. Zakładka zaloguj się umożliwia również rejestrowanie nowych użytkowników (po prawej stronie). Nowy użytkownik musi podać niezbędne informacje dotyczące swojej osoby. Tj. Imię, Nazwisko, E-mail, Telefon, Login do zakładanego konta oraz hasło, wraz z jego powtórzeniem w celu weryfikacji poprawności składni. Dane te muszą odpowiadać formatowi bazy danych! Np. jeżeli użytkownik poda adres email bez użycia znaku @, otrzyma odpowiedni komunikat błędu walidacji danych. Gdy walidacja przebiegnie poprawnie, dane użytkownika zostają przesłane do bazy danych, a skrypt wysyła go do nowej strony, gdzie jest proszony o uzupełnienie profilu większą ilością danych opcjonalnych (adres, nr konta itd.) Przy czym hasło użytkownika zostaje przesłane metodą haszującą, dzięki czemu niwelujemy możliwość przechwycenia / wycieku haseł użytkowników.

Menu po zalogowaniu na konto administracyjne.

alt text

       Przedstawiono stronę Logowania / Rejestracji (login.php) - menu.

Po zalogowaniu się na górnym menu pojawiają się dodatkowe ikony. Jeżeli użytkownik jest administratorem dostaje on dostęp do konta oraz admin panelu. Jeżeli natomiast jest to zwykły użytkownik to otrzymuje jedynie dostęp do zakładki 'Moje konto'.

alt text

       Przedstawiono stronę konfiguracyjną (reg_next.php).

Gdy użytkownik loguje się po raz pierwszy, zostaje przekierowany na stronę konfiguracyjną konta, którą może pominąć. Dane które tam wpisze, zostaną przypisane do jego konta oraz będą dostępne w zakładce „Moje konto”. Służyć one będą autouzupełnianiu danych podczas składania zamówienia.

Ekran Admin Panel

alt text alt text

       Przedstawiono stronę główną 'Admin Panel' (admin.php).

Użytkownicy z uprawnieniami administratora mają dostęp do strony Admin Panel, gdzie mają możliwość zarządzania: produktami, użytkownikami, zamówieniami oraz wiadomościami wysyłanymi do moderatorów.

Po wejściu na stronę Admin Panel, użytkownik widzi stronę główną, gdzie znajdują się statystyki generowane dynamicznie w postaci czytelnych wykresów oraz dokładnych informacji, ważnych dla zarządzającego sklepem internetowym

Dostępnymi aktualnie statystykami są:
* Zarobki za obecny miesiąc (PLN)
* Zarobki ogólne (PLN)
* Przychód obecnoroczny (PLN)
* Przychód zeszłoroczny (PLN)
* Graf ilustrujący przychody za każdy miesiąc bieżącego roku
* Liczba zarejestrowanych kont
* Liczba administratorów
* Liczba moderatorów
* Liczba użytkowników (wyłączając administratorów i moderatorów)
* Graf ilustrujący liczbę rejestracji kont w każdym miesiącu bieżącego roku

alt text

       Przedstawiono stronę 'Admin Panel' wraz z rozsuwanym menu (admin.php).

Panel administratora posiada wysuwane, animowane menu, które jest częściowo responsywne. Pozwala ono na wygodną nawigację pomiędzy podstronami, na których można zarządzać odpowiednimi dziedzinami sklepu.

alt text alt text

       Przedstawiono stronę 'Admin Panel' pozwalającą dodawać asortyment (admin.php).

Administrator ma możliwość dodawania nowej pozycji w sklepie, wypełniając pola opisujące odpowiednio produkt (nazwa gry, opis, PEGI, okładka, czas przejścia, data premiery). Dodawanie okładki obsługuje mechanizm "drag and drop", który przyśpiesza oraz ułatwia ten proces. Admin ma także możliwość podglądu dodanej przez siebie grafiki, usunięcia jej oraz eksportu do bazy danych (przycisk ten jednak nie został w pełni ukończony z powodu napotkania wielu problemów)

alt text

       Przedstawiono stronę 'Admin Panel' pozwalającą usuwać pozycje z asortymentu (admin.php).

Administrator ma możliwość usuwania danej pozycji w sklepie oraz usuwania wybranej platformy dla danej gry. Wystarczy wybrać z listy produkt oraz zadecydować jakie działania są potrzebne.

alt text

       Przedstawiono stronę 'Admin Panel' pozwalającą edytować pozycje z asortymentu (admin.php).

Administrator jest w stanie w bardzo łatwy sposób edytować wszystkie informacje na temat wybranej gry. Po wybraniu pozycji z listy, należy wypełnić te same informacje, co przy dodawaniu nowego produktu.

alt text

       Przedstawiono stronę 'Admin Panel' pozwalającą na odczytanie wszystkich dostępnych wydawców, których produkty są dostępne w sklepie oraz umożliwienie swobodnej ich modyfikacji (admin.php).

Strona wyświetla nazwy wydawców, które pochodzą z bazy danych, w formie tabelarycznej. Na stronie znajduje się paginacja, która ma na celu podniesienie walorów estetycznych oraz użytkowych strony. Poniżej znajdują się pola umożliwiające dodawanie, edycję oraz usunięcie wybranego wydawcy.

alt text

       Przedstawiono stronę 'Admin Panel' pozwalającą na odczytanie wszystkich dostępnych studiów, których produkty są dostępne w sklepie oraz umożliwienie swobodnej ich modyfikacji (admin.php).

Strona wyświetla nazwy studiów, które pochodzą z bazy danych, w formie tabelarycznej. Na stronie znajduje się paginacja, która ma na celu podniesienie walorów estetycznych oraz użytkowych strony. Poniżej znajdują się pola umożliwiające dodawanie, edycję oraz usunięcie wybranego studia.

alt text

       Przedstawiono stronę 'Admin Panel' pozwalającą zarządzać edycjami oferowanymi przez sklep (admin.php).

Na stronie wyświetlane są informacje na temat edycji. Stworzony sklep ma w domyśle 3 edycje (Podstawową, Gracza oraz Prze-Grywa). Przedstawiona strona pozawala na dodanie kolejnych edycji (wraz z ich benefitami), modyfikację istniejących (oraz ich benefitów), a także na usuwanie całych edycji.

alt text

       Przedstawiono stronę 'Admin Panel' pozwalającą zarządzać wersjami oferowanymi przez sklep (admin.php).

Na stronie wyświetlane są informacje na temat wersji. Stworzony sklep ma w domyśle 2 wersje (Pudełkową oraz CD-Key). Przedstawiona strona pozawala na dodanie kolejnych wersji, modyfikację istniejących, a także na usuwanie całych edycji.

alt text

       Przedstawiono stronę 'Admin Panel' pozwalającą zarządzać zasobami sklepu (admin.php).

Na stronie wyświetlane są informacje na temat asortymentu (nazwa gry, dostępne platformy, ceny oraz ilość kopii). Administrator ma możliwość uzupełniania ilości gier na daną platofrmę oraz modyfikację ich cen

alt text

       Przedstawiono stronę 'Admin Panel' pozwalającą zarządzać zamówieniami (admin.php).

Na stronie wyświetlane są wszystkie informacje na temat złożonych zamówień przez użytkowników. Administator może zmieniać statusy zamówienia (wszystkie zamówienia ze statusem "Dostarczono" lub "Anulowano" trafiają do archiwum)

alt text

       Przedstawiono stronę 'Admin Panel' pozwalającą zarządzać zamówieniami wersji CD-Key (admin.php).

Na stronie wyświetlane są wszystkie informacje na temat złożonych zamówień wersji CD-Key przez użytkowników. Administator może zmieniać statusy zamówienia (wszystkie zamówienia ze statusem "Dostarczono" lub "Anulowano" trafiają do archiwum)

alt text

       Przedstawiono stronę 'Admin Panel' pozwalającą zarządzać zamówieniami, które są dostarczane do sklepu stacjonarnego (admin.php).

Na stronie wyświetlane są wszystkie informacje na temat złożonych zamówień, które są dostarczane do sklepu stacjonarnego. Administator może zmieniać statusy zamówienia (wszystkie zamówienia ze statusem "Dostarczono" lub "Anulowano" trafiają do archiwum)

alt text

       Przedstawiono stronę 'Admin Panel' pozwalającą zarządzać zamówieniami, które są dostarczane pod wskazany adres (admin.php).

Na stronie wyświetlane są wszystkie informacje na temat złożonych zamówień, które są dostarczane pod wskazany adres. Administator może zmieniać statusy zamówienia (wszystkie zamówienia ze statusem "Dostarczono" lub "Anulowano" trafiają do archiwum)

alt text

       Przedstawiono stronę 'Admin Panel' pozwalającą zarządzać zamówieniami, które są w archiwum (admin.php).

Na stronie wyświetlane są wszystkie informacje na temat złożonych zamówień, które mają status "Dostarczono" lub "Anulowano". Administator może zmieniać statusy zamówienia (wszystkie zamówienia ze statusem innym niż "Dostarczono" lub "Anulowano" zostaną przeniesione z archiwum)

alt text

       Przedstawiono stronę 'Admin Panel' pozwalającą zarządzać moderatorami (admin.php).

Na stronie wyświetlane są wszystkie informacje na temat moderatorów strony, którzy mają pełnią rolę pomocy technicznej oraz informacji dla użytkowników.

alt text

       Przedstawiono stronę 'Admin Panel' pozwalającą przeglądać wiadomości moderatorów (admin.php).

Na stronie wyświetlane są wszystkie informacje na temat konwersaji prowadzonych przez moderatorów strony. Administrator każdą konwersacje może swobodnie przeglądać, jednak nie może odpowiadać na wiadomości, usuwać ich, ani zamykać tematu.

alt text

       Przedstawiono stronę 'Admin Panel' pozwalającą przeglądać wiadomości moderatorów (admin.php).

Przykładowa konwersacja z moderatorem.

alt text

       Przedstawiono stronę 'Admin Panel' pozwalającą zarządzać kontami na stronie sklepu (admin.php).

Informacje na temat kont wyświetlane są w formie tabelarycznej (zastosowano paginację w celu zwiększenia przejrzystości strony). Niedostępne są jedynie hasła (które są przechowywane w bazie danych za pomocą hashcode w celu podniesienia bezpieczeństwa użytkowników). Poniżej znajdują się opcje edycji typu konta (możliwość nadania uprawień administatora, moderatora lub zwykłego użytkownika), a także możliwość usunięcia konta wybranego użytkownika.

Ekran Konta Klienta

alt text

       Przedstawiono stronę 'Moje konto' (user_account.php).

Po założeniu konta oraz zalogowaniu się, użytkownik otrzymuje dostęp do własnego konta. W zakładce tej znajdują się skrócone informacje dotyczące danych osobowych oraz zamówień wykonanych przez danego użytkownika. Może on uzyskać takie informacje jak: Imię i Nazwisko, Adres zamieszkania, Kontakt, Nr. Karty kredytowej, Wartość kupionych gier, Ilość dokonanych zamówień oraz ich skrócony opis, a także wygląd oraz opis karty lojalnościowej (o ile użytkownik takową posiada).

alt text

       Przedstawiono stronę 'Moje konto' (user_account.php) - Komunikat edycji konta.

Użytkownik może również w pełni edytować dane umieszczone na stronie korzystając z symbolu zębatki. Po kliknięciu takowej ikony, użytkownik otrzymuje komunikat z zapytaniem, czy jest pewien, iż chce edytować swoje dane. Po wybraniu opcji Tak, komunikat automatycznie się zamyka, a ekran scrolluje się do końca strony, gdzie odkrywa się nowa opcja edycji konta.

alt text

       Przedstawiono stronę 'Moje konto' (user_account.php) - Po akceptacji edycji.

alt text

       Przedstawiono stronę 'Moje konto' (user_account.php) - Edycja hasła.

Dostępna jest również opcja edycji hasła do konta użytkownika. Po kliknięciu opcji „Zmień hasło” oraz po zatwierdzeniu wstępnego komunikatu, użytkownik otrzymuje kolejny komunikat, w którym musi podać poprzednie hasło oraz potwierdzić nowe hasło. Jeżeli podane dane przejdą walidację poprawnie, hasło zostanie zmienione, a użytkownik zostanie wylogowany..

alt text

       Przedstawiono stronę 'Moje konto' (user_account.php) - Edycja avatara.

Każdy użytkownik ma do wyboru 4 różne avatary. Ilość avatarów, zmienia się wraz ze zdobyciem wyższych poziomów kont lojalnościowych.
- Brak karty = 4 avatary
- Brązowa karta (50 zamówień) = 10 avatarów
- Srebrna karta (100 zamówień) = 20 avatarów
- Złota karta (250 zamówień) = 40 avatarów
- Platynowa karta (500 zamówień) = 60 avatarów
Dodatkowo, użytkownik może otrzymać dostęp do kilku dodatkowych avatarów, jeżeli podczas zakupów użyje odpowiedniego kodu rabatowego.

alt text

       Przedstawiono stronę 'Moje konto' (user_account.php) - Zamówienia.

Po kliknięciu „Zamówienia”, użytkownik może obejrzeć złożone przez siebie zamówienia oraz śledzić ich status.

Instant Czat - Messenger

alt text

       Przedstawiono stronę 'Index' (Index.php).

Dla użytkowników zwykłych typu ‘user’ dostępna jest opcja instant czatu z moderatorem. Jest ona dostępna w postaci kółka w prawym dolnym rogu ekranu.

alt text

       Przedstawiono stronę 'Index' (Index.php) - Otworzenie instant czatu.

Po kliknięciu na kółko zostaje otwarte okienko rozmowy. Jeżeli użytkownik nie wysłał jeszcze żadnej wiadomości otrzyma on wiadomość standardową. Jak widać wiadomość nie posiada widocznego odbiorcy, gdyż żaden z moderatorów nie został dopasowany do danego użytkownika.

alt text

       Przedstawiono stronę 'Index' (Index.php) - Po wysłaniu wiadomości.

Po wysłaniu wiadomości, dla użytkownika zostaje przyznany jeden z dostępnych moderatorów. Skrypt, wysyła zapytania do bazy danych i sprawdza który z moderatorów jest obecnie dostępny. Działa to w postaci sprawdzenia czy dany moderator posiada obecnie więcej niżeli 5 oczekujących rozmów. Jeżeli tak się stanie to sprawdza następnego moderatora itd. Jeżeli każdy z moderatorów posiada co najmniej 5 oczekujących wiadomości, system powtarza proces dla liczby 10 rozmów itd. Iterując liczbę wiadomości o 5.

alt text

       Przedstawiono stronę 'Wiadomości' (messenger_moderator.php).

Po zalogowaniu się na konto o typie moderatora, na górnym pasku, możemy zauważyć dodatkową opcję jaką jest ‘Wiadomości’. W zakładce tej moderator może odpisywać oczekującym klientom. Jak widać moderator w zakładce ‘Wiadomości’ otrzymuje takie informacje jak: id, imię oraz nazwisko klienta wysyłającego wiadomość oraz treść rozmowy.

alt text

       Przedstawiono stronę 'Wiadomości' (messenger_moderator.php) - Zakończenie rozmowy.

Po zakończeniu rozmowy (rozwiązaniu problemu). Moderator musi zakończyć rozmowę za pośrednictwem przycisku znajdującego się poniżej. Gdy kliknie takową opcję, statusy wiadomości w bazie danych zostają edytowane i przeniesione do archiwum, a moderator (o ile jest ktoś w kolejce) natychmiastowo otrzymuje nowego użytkownika do rozmowy.

alt text

       Przedstawiono stronę 'Index' (Index.php) - Odpowiedź dla usera.

Jak widać na powyższym screenie użytkownik otrzymał odpowiedź od moderatora.

Baza danych

Diagram ERD

alt text

Skrypt do utworzenia struktury bazy danych znajduje się w pliku baza_przegrywy.sql

Wykorzystane technologie:

  1. PHP v7.4.7
  2. HTML
  3. JavaScript
  4. JQuery
  5. CSS
  6. MySql
  7. Bootstrap (Wykorzystany jedynie do listowania stron)

Proces uruchomienia aplikacji (krok po kroku)

Aplikacja ta została utworzona w środowisku PHP wersji 7. Aby wszystkie zaimplementowane funkcje działały poprawnie należy korzystać z PHP w wersji 7.4.7, monitora o rozdzielczości min. 1920x1080 (rekomendowane 4k) oraz przeglądarki google chrome. Do uruchomienia aplikacji wymagany jest program obsługujący ww. język. Jednym z takowych programów jest xampp. Aby uruchomić aplikację za pomocą programu xampp należy:

  1. Zainstalować xampp v. 7.4.7.
  2. Uruchomić program oraz aktywować dwie pierwsze opcje tj. Apache oraz MySQL.
  3. W przeglądarce wpisać "localhost" następnie przejść do phpMyAdmin oraz należy utworzyć pustą bazę danych o nazwie baza_przegrywy.
  4. Po utworzeniu bazy należy kliknąć na jej nazwę, a następnie wybrać funkcję importowania.
  5. Podczas importowania wybieramy dołączony powyżej plik baza_przegrywy.sql a następnie klikamy wykonaj.
  6. Jeżeli proces przebiegnie pomyślnie nasza baza danych będzie gotowa do użycia wraz z przykładowymi kontami użytkowników oraz wpisami na temat gier.
  7. W tym kroku należy poprawnie zaimportować stronę. Należy przejść do katalogu docelowego instalacji oprogramowania xampp (standardowo jest to C:\xampp\htdocs). W katalogu tym należy utworzyć folder o nazwie np. websites, a następnie do tego katalogu należy wkleić wypakowaną uprzednio aplikację.
  8. Aby otworzyć aplikację należy wejść w przeglądarkę (Zalecana google chrome) i w pasku wyszukiwania wpisać: "localhost/websites". Jeżeli strona oraz baza danych została poprawnie dodana, na naszym monitorze powinna ukazać się strona główna aplikacji webowej prze-gry.wy.

Potrzebne nazwy użytkowników do uruchomienia aplikacji

Administrator: Login: djamrozy Hasło: zaq1@WSX

Moderator: Login: riwanczyk Hasło: XSW@1qaz

Użytkownik: Login: kk123 Hasło: kk123

About

Own shoop named 'prze-gry.wy'. Its the biggest project with I created for funn.

License:Other


Languages

Language:PHP 64.3%Language:CSS 34.3%Language:JavaScript 1.4%