diff --git a/Controller/AdminController.php b/Controller/AdminController.php index 3486bc18c6f577112115374c2e30e99fea77896b..cf1a880f6af7522d951c449f67f905c4e4098e39 100644 --- a/Controller/AdminController.php +++ b/Controller/AdminController.php @@ -7,6 +7,7 @@ use Lib\Interfaces\Routing\IRequest; use Lib\Interfaces\Routing\IResponse; use Lib\Interfaces\Routing\IRoute; use Model\Relations\Album; +use Model\Relations\Song; use Model\Relations\User; const USER_sIZE = 10; @@ -17,7 +18,6 @@ class AdminController { $users = new User($req->db); $page = $req->getQuery("page") ?? 1; - $errors = []; if (!is_numeric($page)) { return $res->redirect("/admin/users"); @@ -93,4 +93,41 @@ class AdminController ...$album[0], ]); } + + static function editAlbumSong(IRequest $req, IResponse $res) { + $users = new Song($req->db); + $page = $req->getQuery("page") ?? 1; + $idAlbum = $req->getParam("/admin/album/edit/:id/lagu", "id"); + + if (!is_numeric($page)) { + return $res->redirect("/albums"); + } + + $transaction = $users->transaction(); + + $total = $transaction + ->select(["COUNT(*) cnt"]) + ->all()[0]["cnt"]; + $total_page = ceil($total / USER_sIZE); + + if ($page < 1) { + return $res->redirect("/admin/album/edit/$idAlbum/lagu"); + } + + if ($page > $total_page) { + return $res->redirect("/admin/album/edit/$idAlbum/lagu?page=$total_page"); + } + + $songs = $transaction->select(["*"])->paginate(10, $page-1)->all(); + + return $res->view("Pages/AlbumSongEdit", [ + "page"=>$page, + "next_page" => $page < $total_page ? $page + 1 : null, + "prev_page" => $page > 1 ? $page - 1 : null, + "auth" => $req->auth, + "songs" => $songs, + "id_album" => $idAlbum, + ]); + + } } diff --git a/README.md b/README.md index 96a246c22cb9b547a65eadcbb17de71d6c2e75c0..baa1842e07812beb577c91c0d20cf81bc5148acf 100644 --- a/README.md +++ b/README.md @@ -1,28 +1,33 @@ -## Panduan Pengerjaan - -Berikut adalah hal yang harus diperhatikan untuk pengumpulan tugas ini: - -1. Buatlah grup pada Gitlab dengan format "IF3110-2022-KXX-01-YY", dengan XX adalah nomor kelas dan YY adalah nomor kelompok. -2. Tambahkan anggota tim pada grup anda. -3. **Fork** pada repository ini dengan organisasi yang telah dibuat. -4. Ubah hak akses repository hasil Fork anda menjadi **private**. -5. Hal-hal yang harus diperhatikan. - - Silakan commit pada repository anda (hasil fork) - - Lakukan beberapa commit dengan pesan yang bermakna, contoh: “add register formâ€, “fix logout bugâ€, jangan seperti “finalâ€, “benerin dikitâ€, “fix bugâ€. - - Disarankan untuk tidak melakukan commit dengan perubahan yang besar karena akan mempengaruhi penilaian (contoh: hanya melakukan satu commit kemudian dikumpulkan). - - Sebaiknya commit dilakukan setiap ada penambahan fitur. - - Commit dari setiap anggota tim akan mempengaruhi penilaian. - - Jadi, setiap anggota tim harus melakukan commit yang berpengaruh terhadap proses pembuatan aplikasi. - - Sebagai panduan bisa mengikuti [semantic commit](https://gist.github.com/joshbuchea/6f47e86d2510bce28f8e7f42ae84c716). -6. Buatlah file README yang berisi: - - Deskripsi aplikasi web - - Daftar requirement - - Cara instalasi - - Cara menjalankan server - - Screenshot tampilan aplikasi (tidak perlu semua kasus, minimal 1 per halaman), dan - - Penjelasan mengenai pembagian tugas masing-masing anggota (lihat formatnya pada bagian pembagian tugas). - -# Note - -- Sebelum menjalankan aplikasi, pastikan sudah membuat folder `/storage/audio` dan `storage/image` dengan permision 777. -- Kalau pas ngupload file kena permission denied, ketik `chmod 777 /storage/` +## Deskripsi Aplikasi Web +Webtune merupakan suatu aplikasi pemutaran lagu berbasis web yang dibuat menggunakan HTML5, CSS, dan JavaScript untuk client-side, serta PHP buat server-side. +## Daftar Requirement +- HTML5 +- PHP +- CSS +- Javascript +- Docker +## Cara instalasi +- Lakukan pemasangan docker +## Cara menjalankan server +- Lakukan perintah docker compose up untuk menjalankan program +## Screenshot tampilan aplikasi + + + + + + + +## Penjelasan mengenai pembagian tugas masing-masing anggota +Login: 13520128 +Register: 13520128 +Home: 13520128 +Daftar user: 13520128 +Daftar Album: 13520047 +Detail Album: 13520047 +CRUD album: 13520047 +CRUD lagu: 13520086 +search: 13520086 +sort: 13520086 +filter: 13520086 +detail lagu: 13520086 diff --git a/Router/AdminRoutes.php b/Router/AdminRoutes.php index 1d92c299c1d82c975cd080849bdf63d3d0537f63..2dcca2640f13d6fa3fd2e5e55f8d6f34b72f0dc2 100644 --- a/Router/AdminRoutes.php +++ b/Router/AdminRoutes.php @@ -26,6 +26,7 @@ class AdminRoutes $route->route(HttpMethod::Put, "/admin/lagu/:id/album", [LaguController::class, "changeSongAlbum"]); $route->route(HttpMethod::Delete, "/admin/lagu/:id/album", [LaguController::class, "deleteSongAlbum"]); + $route->route(HttpMethod::Get, "/admin/album/edit/:id/lagu", [AdminController::class, "editAlbumSong"]); $route->route(HttpMethod::Get, "/admin/album/edit/:id", [AdminController::class, "editAlbums"]); $route->route(HttpMethod::Post, "/admin/album/edit/:id", [AlbumController::class, "editAlbums"]); $route->route(HttpMethod::Delete, "/admin/album/delete/:id", [AlbumController::class, "deleteAlbums"]); diff --git a/View/Pages/AlbumSongEdit.php b/View/Pages/AlbumSongEdit.php new file mode 100644 index 0000000000000000000000000000000000000000..1f9fb4bf4066becffa3a067ce61c39d73b0b27d9 --- /dev/null +++ b/View/Pages/AlbumSongEdit.php @@ -0,0 +1,55 @@ +<?php + $this->layout("Templates/PageTemplate", [ + "title" => "Edit daftar lagu | Webtune", + "auth" => $auth, + "page" => "album", + "styles" => ["/static/css/home.css", "/static/css/album-song.css"], + "scripts" => [ + "/static/js/http.js", + "/static/js/album-song.js", + ], + ]); +?> + +<h2>Edit Daftar Lagu</h2> + +<?php + foreach($songs as $song) { + $release_date = $song["release_date"] ?? ""; + $year = strlen($release_date)>0 ? explode('-',$release_date)[0]: ""; +?> +<div class="list__item"> + <div class="list__item__picture"> + <img src='<?= $song["image_path"] ?>' alt="<?= $song["title"] ?> by <?= $song["singer_name"] ?> Cover Image" /> + </div> + <div class="list__item__content"> + <h1 class="list__item__title"><?= $song["title"] ?></h1> + <p class="list__item__year"><?= $year ?></p> + <p class="list__item__author"><?= $song["singer_name"] ?></p> + <p class="list__item__genre" ><?= $song["genre"] ?></p> + <div style="margin-top: 20px;"> + <?php + if($song["album_id"] === (int) $id_album) { + ?> + <button class="destroy" onclick="deleteSong(<?= $song['song_id'] ?>)">Hapus Lagu</button> + <?php + }else{ + ?> + <button class="primary" onclick="addSong(<?= $song['song_id'] ?>, <?= $id_album ?>)">Tambah Lagu</button> + <?php + } + ?> + </div> + </div> +</div> +<?php + } +?> + +<?php + $this->component("Component/Pagination", [ + "page_number" => $page, + "next_page" => isset($next_page) && !is_null($next_page) ? "/admin/users/?page=$next_page": null, + "prev_page" => isset($prev_page) && !is_null($prev_page) ? "/admin/users/?page=$prev_page": null, + ]) +?> \ No newline at end of file diff --git a/View/Pages/DetailAlbum.php b/View/Pages/DetailAlbum.php index d99fa5fa03724eee5279ad81723830529509f44d..d552dbd0ab56ac1d5cc2f256bb726341ac208bd2 100644 --- a/View/Pages/DetailAlbum.php +++ b/View/Pages/DetailAlbum.php @@ -1,13 +1,21 @@ <?php $this->layout("Templates/PageTemplate", [ - "title" => "Daftar Album Page | Webtune", + "title" => "Album $title | Webtune", "auth" => $auth, "page" => "album", "styles" => ["/static/css/home.css", "/static/css/detail_album.css", "/static/css/search.css"], - "scripts" => [], + "scripts" => [ + "/static/js/http.js", + ], ]); ?> +<script> + async function onDelete() { + await http.delete(`/admin/album/delete/<?= $album_id ?>`) + location.assign("/album") + } +</script> <div> <div class="detail__album"> <img src="<?= $image_path ?>" alt="<?= $title ?> Cover Image" /> @@ -18,10 +26,17 @@ $this->layout("Templates/PageTemplate", [ <p id="singer_name"><?= $singer_name ?></p> <p id="total_duration"><?= $total_duration ?></p> </div> + <?php + if(isset($auth) && !is_null($auth) && $auth->is_admin) { + ?> <div class="edit__delete"> <a class="edit" href="/admin/album/edit/<?= $album_id ?>">Edit</a> - <a class="delete" href="/admin/album/delete/<?= $album_id ?>">Delete</a> + <a class="edit" href="/admin/album/edit/<?= $album_id ?>/lagu">Edit Songs</a> + <button class="delete" onclick="onDelete()">Delete</button> </div> + <?php + } + ?> </div> <div class="detail__list"> <h2>Daftar Lagu</h2> diff --git a/image-1.png b/image-1.png new file mode 100644 index 0000000000000000000000000000000000000000..f13e44e9f182ab2680edb0430617505e2168c98f Binary files /dev/null and b/image-1.png differ diff --git a/image-2.png b/image-2.png new file mode 100644 index 0000000000000000000000000000000000000000..4a3371dc86d03e4930dc6aa81df30bb1aa9d3d79 Binary files /dev/null and b/image-2.png differ diff --git a/image-3.png b/image-3.png new file mode 100644 index 0000000000000000000000000000000000000000..e9fcd75252ae9c5503ff774ab37e4ae52da17683 Binary files /dev/null and b/image-3.png differ diff --git a/image-4.png b/image-4.png new file mode 100644 index 0000000000000000000000000000000000000000..211d3fac0b6f16944fced33683d34511d395f612 Binary files /dev/null and b/image-4.png differ diff --git a/image-5.png b/image-5.png new file mode 100644 index 0000000000000000000000000000000000000000..63163fe291ca2095c2d495db68d31967ffbf0b2a Binary files /dev/null and b/image-5.png differ diff --git a/image-6.png b/image-6.png new file mode 100644 index 0000000000000000000000000000000000000000..3749f8461334da31fd2228403409dd6d5d8fa1a0 Binary files /dev/null and b/image-6.png differ diff --git a/image.png b/image.png new file mode 100644 index 0000000000000000000000000000000000000000..9fedb9a858627a45982a52a5502d1ca5f906b664 Binary files /dev/null and b/image.png differ diff --git a/static/css/album-song.css b/static/css/album-song.css new file mode 100644 index 0000000000000000000000000000000000000000..81e9622e3e73b7a71ec0b9ded6e9582ebda5698d --- /dev/null +++ b/static/css/album-song.css @@ -0,0 +1,20 @@ +.list__item:hover { + background-color: transparent; +} + +.list__item { + display: flex; + gap: 1.5rem; +} + +.list__item__picture { + max-width: 150px; +} + +.destroy { + background-color: #8b4141; +} + +button { + padding: 10px 20px; +} diff --git a/static/js/album-song.js b/static/js/album-song.js new file mode 100644 index 0000000000000000000000000000000000000000..ed400c8bc7c1c70da1e42a9eaa48b2019f226e07 --- /dev/null +++ b/static/js/album-song.js @@ -0,0 +1,11 @@ +async function deleteSong(song_id) { + await http.delete(`/admin/lagu/${song_id}/album`); + location.reload(); +} + +async function addSong(song_id, album_id) { + await http.put(`/admin/lagu/${song_id}/album`, { + album_id, + }) + location.reload(); +} \ No newline at end of file