diff --git a/app/api/anime/filter.php b/app/api/anime/filter.php
new file mode 100644
index 0000000000000000000000000000000000000000..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
diff --git a/app/api/client/edit.php b/app/api/client/edit.php
index a71d2ad858e817a6f933c030d6243291a8addf1f..bbbcd2497b049e8006b538b78f7f04dc438f0bde 100644
--- a/app/api/client/edit.php
+++ b/app/api/client/edit.php
@@ -11,6 +11,7 @@ if ($_SERVER["REQUEST_METHOD"] == "POST") {
echo "No client ID provided. Cannot proceed with edit.";
exit();
}
+
$data = [
'client_id' => $_POST['client_id'],
'username' => $_POST['username'],
diff --git a/app/controller/AnimeController.php b/app/controller/AnimeController.php
index 7b5b4fa2f6eca99c32ec289a76061ad24a995733..8693a859f403e16a7c8ac71b7f89337c33cc2caa 100644
--- a/app/controller/AnimeController.php
+++ b/app/controller/AnimeController.php
@@ -4,8 +4,11 @@ require_once(dirname(__DIR__,1).'/define.php');
require_once(BASE_DIR.'/models/Controller.php');
class AnimeController extends Controller {
- public function index(){
- $this->view('Anime/index');
+ public function index($path = "page=1"){
+ $this->view('Anime/index',
+ array(
+ 'path' => $path
+ ));
}
public function detail($id) {
$this->view('Anime/detail', array('id' => $id));
diff --git a/app/public/handler/anime.js b/app/public/handler/anime.js
new file mode 100644
index 0000000000000000000000000000000000000000..36ed66245827882983190c4e5d78d4be3e3a6f98
--- /dev/null
+++ b/app/public/handler/anime.js
@@ -0,0 +1,3 @@
+function handleSearch(){
+ let val = document.getElementById('search-bar').value;
+}
\ No newline at end of file
diff --git a/app/public/style/anime.css b/app/public/style/anime.css
index e81e8f60bd248edca396f2e74f5e6afb5ee0c017..a399178fe6277f2f5055a4a11853190c449857ae 100644
--- a/app/public/style/anime.css
+++ b/app/public/style/anime.css
@@ -1,6 +1,6 @@
.filter-flex {
display: flex;
- flex-wrap: wrap;
+ flex-direction: column;
justify-content: center;
align-items: center;
background-color: #dedede;
@@ -9,6 +9,89 @@
gap: 5px;
}
+.filter-part {
+ display: flex;
+ flex-wrap: wrap;
+ flex-direction: row;
+ justify-content: center;
+ align-items: end;
+ gap: 30px;
+}
+
+.filter-block{
+ display: flex;
+ flex-direction: column;
+}
+
+.filter-label {
+ font-weight: bold;
+ margin-bottom: 5px;
+}
+
+.filter-select select {
+ display: none;
+}
+
+.filter-select {
+ border-radius: 10px;
+ padding: 5px 10px;
+ border: black 2px solid;
+ min-width: 150px;
+ cursor: pointer;
+ transition: ease-in-out;
+ transition-duration: 0.2s;
+}
+
+.filter-select:focus {
+ scale: 115%;
+ transition: ease-in-out;
+ transition-duration: 0.2s;
+}
+
+.filter-submit-btn{
+ background-color: white;
+ border: rgb(19, 146, 250) 2px solid;
+ padding: 10px 15px;
+ border-radius: 10px;
+ color: rgb(19, 146, 250);
+ cursor: pointer;
+ font-weight: bold;
+ transition: ease-in-out;
+ transition-duration: 0.2s;
+}
+
+.filter-submit-btn:hover{
+ transition: ease-in-out;
+ transition-duration: 0.2s;
+ background-color: rgb(19, 146, 250);
+ color: white;
+}
+
+.search-part {
+ display: flex;
+ flex-wrap: wrap;
+ flex-direction: row;
+ justify-content: center;
+ align-items: center;
+ padding: 0px 10px;
+}
+
+.search-bar {
+ width: 350px;
+ color: black;
+ padding: 5px 10px;
+ transition: ease-in-out;
+ transition-duration: 0.2s;
+}
+
+.search-bar:focus {
+ transition: ease-in-out;
+ transition-duration: 0.2s;
+ scale: 110%;
+ border: black 2px solid;
+}
+
+
.genre-button {
min-width: 100px;
max-width: 250px;
diff --git a/app/views/Client/detail.php b/app/views/Client/detail.php
index 6a819509728f6d362b5e10c13386e1da8e41b370..f5d9070feefa33bc7e41a4dca5ce63e72b8746a7 100644
--- a/app/views/Client/detail.php
+++ b/app/views/Client/detail.php
@@ -53,10 +53,11 @@ $isUser = $c->getClientByUsername($_SESSION['username'])['client_id'] == $id;
<label for="editAdminStatus">Status:</label>
<select id="editAdminStatus" name="admin_status">
<?php
+ $value = $client['admin_status'] ? "true" : "client";
$option = $client['admin_status'] ? 'Admin' : 'Client';
echo
"
- <option value='$client[admin_status]'>$option</option>
+ <option value='$value'>$option</option>
";
?>
</select>
diff --git a/app/views/anime/index.php b/app/views/anime/index.php
index 7ac5c6d2c81c41488723aff1bfa602bcf8d46dd4..7eff08e4bb0249726e9f12b06df3d69fe9b9f1e6 100644
--- a/app/views/anime/index.php
+++ b/app/views/anime/index.php
@@ -4,9 +4,13 @@ require_once(dirname(__DIR__,2).'/define.php');
require_once(BASE_DIR.'/views/includes/header.php');
require_once(BASE_DIR.'/models/Anime.php');
require_once(BASE_DIR.'/models/Genre.php');
+require_once(BASE_DIR.'/models/Studio.php');
$a = new Anime();
+$s = new Studio();
$g = new Genre();
+$path = $data['path'];
+$animes = $a->getAllAnime();
?>
@@ -17,26 +21,84 @@ $g = new Genre();
<link rel="stylesheet" href="../../public/style/global.css">
<link rel='stylesheet' href="../../public/style/anime.css">
<script src='/public/handler/navbar.js'></script>
+ <script src='/public/handler/anime.js'></script>
</head>
-
<body>
<div class="filter-flex">
- <?php
- $genres = $g->getAllGenre();
- foreach($genres as $genre){
- echo "
- <div class='genre-button'>
- $genre[name]
- </div>
- ";
- }
- ?>
+ <form action='/api/anime/filter.php' method='post' class='filter-part'>
+ <div class="filter-block">
+ <label class='filter-label' for='filter-genre'>Genre </label>
+ <select class='filter-select' id='filter-genre' name='filter-genre' placeholder='Genre'>
+ <?php
+ $genres = $g->getAllGenre();
+ echo "<option value=null> Any </option>";
+ foreach($genres as $genre){
+ echo "
+ <option value=$genre[name]> $genre[name] </option>
+ ";
+ }
+ ?>
+ </select>
+ </div>
+
+ <div class="filter-block">
+ <label class='filter-label' for='filter-type'>Type </label>
+ <select class='filter-select' id='filter-type' name='filter-type' placeholder='Type'>
+ <option value=null> Any </option>
+ <option value="TV">TV</option>
+ <option value="MOVIE">Movie</option>
+ <option value="OVA">OVA</option>
+ </select>
+ </div>
+
+ <div class="filter-block">
+ <label class='filter-label' for='filter-status'>Status </label>
+ <select class='filter-select' id='filter-status' name='filter-status' placeholder='Status'>
+ <option value=null> Any </option>
+ <option value="ON-GOING">On Going</option>
+ <option value="COMPLETED">Completed</option>
+ <option value="HIATUS">Hiatus</option>
+ <option value="UPCOMING">Upcoming</option>
+ </select>
+ </div>
+
+ <div class="filter-block">
+ <label class='filter-label' for='filter-rating'>Rating </label>
+ <select class='filter-select' id='filter-rating' name='filter-rating' placeholder='Rating'>
+ <option value=null> Any </option>
+ <option value="G">G</option>
+ <option value="PG-13">PG-13</option>
+ <option value="R(17+)">R(17+)</option>
+ <option value="Rx">Rx</option>
+ </select>
+ </div>
+
+ <div class="filter-block">
+ <label class='filter-label' for='filter-studio'>Studio </label>
+ <select class='filter-select' id='filter-studio' name='filter-studio' placeholder='Studio'>
+ <?php
+ $studios = $s->getAllStudio();
+ echo "<option value=null> Any </option>";
+ foreach($studios as $studio){
+ echo "
+ <option value=$studio[name]> $studio[name] </option>
+ ";
+ }
+ ?>
+ </select>
+ </div>
+ <input class='filter-submit-btn' type='submit' value='Submit Filter'>
+ </form>
+ <div class='search-part'>
+ <div class='search-bar'>
+ <input class='search-bar' id='search-bar' type='text' onkeyup='handleSearch()' placeholder='Search...'>
+ </div>
+ </div>
</div>
<div class="flex-wrap">
<?php
- $animes = $a->getAllAnime();
foreach($animes as $anime){
$year = date('Y', strtotime($anime['release_date'])) ?? '';
$month = date('M', strtotime($anime['release_date'])) ?? '';
diff --git a/app/views/includes/header.php b/app/views/includes/header.php
index 605ba7de0d44b6434178c1c7c1eed6b9e7535549..768987c97ba3b798450d12e3bbd679b82bd123c8 100644
--- a/app/views/includes/header.php
+++ b/app/views/includes/header.php
@@ -95,6 +95,3 @@ $c = new Client();
</div>
</div>
-<!-- <div class='search-bar'>
- <input type='text' placeholder='Search Anime/Genre/Studi/Trailer'>
-</div> -->
\ No newline at end of file