From e4d246ecd203601dfd98c2d7e762089e4749a85b Mon Sep 17 00:00:00 2001
From: unknown <13521043@std.stei.itb.ac.id>
Date: Sat, 4 Nov 2023 03:12:33 +0700
Subject: [PATCH] update: application list on admin
---
src/admin/gym/application/index.php | 44 +++++++++++++++++
src/admin/gym/index.php | 23 ++++++---
src/public/css/gym.css | 11 ++++-
src/public/javascript/gym/application.js | 59 +++++++++++++++++++++++
src/public/javascript/gym/trainer_card.js | 35 ++++++++++++++
5 files changed, 165 insertions(+), 7 deletions(-)
create mode 100644 src/admin/gym/application/index.php
create mode 100644 src/public/javascript/gym/application.js
create mode 100644 src/public/javascript/gym/trainer_card.js
diff --git a/src/admin/gym/application/index.php b/src/admin/gym/application/index.php
new file mode 100644
index 0000000..735a214
--- /dev/null
+++ b/src/admin/gym/application/index.php
@@ -0,0 +1,44 @@
+<?php
+
+require_once __DIR__ . '/../../../components/NavbarAdmin.php';
+require_once __DIR__ . '/../../../middleware/AuthMiddleware.php';
+
+AuthMiddleware::getInstance()->secureRoute(true);
+
+?>
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <link rel="stylesheet" href="/public/css/style.css">
+ <title>Gym Finder App</title>
+</head>
+
+<body>
+ <div class="app">
+ <script>
+ const apikey = <?php echo json_encode($_ENV['API_KEY']) ?>;
+ </script>
+ <?php
+ echo NavbarAdmin();
+ ?>
+ <div class="space"></div>
+
+ <div class="gym-page-content">
+ <div class="gym-content" id="gym-content">
+
+ </div>
+ <div class="space"></div>
+
+
+ <div class="space"></div>
+ </div>
+ </div>
+ <script src="/public/javascript/gym/format_card.js"></script>
+ <script src="/public/javascript/gym/trainer_card.js"></script>
+ <script src="/public/javascript/gym/application.js"></script>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/src/admin/gym/index.php b/src/admin/gym/index.php
index 9373c45..0625314 100644
--- a/src/admin/gym/index.php
+++ b/src/admin/gym/index.php
@@ -42,36 +42,44 @@ AuthMiddleware::getInstance()->secureRoute(true);
$formatted_price = formatPrice($gym->monthly_price);
?>
<img class="photo-gym" src="/public/image/gym/<?= $gym->picture_id ?>.png" alt="Gym Image">
- <div class="space3"></div>
+ <div class="space"></div>
<div class=gym-name><?= $gym->name ?></div>
- <div class="space3"></div>
+ <div class="space"></div>
<div class="gym-attribute">Location</div>
<div class="nama-kota">
<?= $city_name ?>
</div>
- <div class="space3"></div>
+ <div class="space"></div>
<div class="gym-attribute">Description</div>
<div class="gym-description">
<?= $gym->description ?>
</div>
- <div class="space3"></div>
+ <div class="space"></div>
<div class="gym-attribute">Price</div>
<div class="gym-price">
<?= $formatted_price ?>
</div>
- <div class="space3"></div>
+ <div class="space"></div>
<div class="gym-attribute">Training Video</div>
- <div class="space3"></div>
+ <div class="space2"></div>
<video controls class="video-gym">
<source src="/public/video/gym/<?= $gym->video_id ?>.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
</div>
<div class="space"></div>
+
+ <div class="gym-attribute">Application List</div>
+ <div class="gym-card-container" id="gym-application-list">
+ <div class="space"></div>
+ Loading...
+ </div>
+ <div class="space"></div>
+
<div class="gym-attribute">Rate List</div>
@@ -98,6 +106,9 @@ AuthMiddleware::getInstance()->secureRoute(true);
<div class="space"></div>
</div>
</div>
+ <script src="/public/javascript/gym/format_card.js"></script>
+ <script src="/public/javascript/gym/trainer_card.js"></script>
+ <script src="/public/javascript/gym/application.js"></script>
</body>
</html>
\ No newline at end of file
diff --git a/src/public/css/gym.css b/src/public/css/gym.css
index 990a671..4ababf6 100644
--- a/src/public/css/gym.css
+++ b/src/public/css/gym.css
@@ -28,7 +28,7 @@
flex-direction: column;
align-items: center;
}
-.loading, .gym-name, .gym-attribute, .nama-kota, .gym-description, .gym-price, .rate-button, .gym-card-text {
+.loading, .gym-name, .gym-attribute, .nama-kota, .gym-description, .gym-price, .rate-button, .gym-card-text, .trainer-card-text {
color: var(--text-standard);
text-align: center;
font-family: var(--font-standard);
@@ -73,6 +73,15 @@
width: 44%;
margin: 0;
}
+.trainer-card-text {
+ font-size: var(--font-size-standard);
+ text-align: left;
+ width: 90%;
+}
+.gym-card-text-bottom {
+ width: 100%;
+ font-weight: 400;
+}
.gym-card {
margin-top: 10px;
margin-bottom: 5px;
diff --git a/src/public/javascript/gym/application.js b/src/public/javascript/gym/application.js
new file mode 100644
index 0000000..55a2b7b
--- /dev/null
+++ b/src/public/javascript/gym/application.js
@@ -0,0 +1,59 @@
+function modifyGymApplicationList(data) {
+ const gymApplicationList = document.getElementById("gym-application-list");
+ gymApplicationList.innerHTML = "";
+ data.forEach((trainer) => {
+ gymApplicationList.innerHTML += TrainerCard(trainer);
+ });
+}
+// dummy data
+let trainer = {
+ name: "John Doe",
+ username: "johndoe",
+ acceptance: 0,
+ gym_id: 43
+}
+let trainer2 = {
+ name: "Jane Doe",
+ username: "janedoe",
+ acceptance: 1,
+ gym_id: 43
+}
+let data = [trainer, trainer2];
+modifyGymApplicationList(data);
+
+function getApplication(gymId, username) {
+ const xhr = new XMLHttpRequest();
+ xhr.onreadystatechange = function () {
+ if (this.readyState === 4) {
+ if (this.status === 200) {
+ // modifyGymRateList(JSON.parse(this.responseText)["ratings"], username);
+ modifyGymApplicationList(JSON.parse(this.responseText)["trainers"]);
+ } else {
+ const json = JSON.parse(this.responseText);
+ alert(json["error"]);
+ }
+ }
+ };
+
+ // xhr.open("GET", `/api/gym/rating?gym_id=${gymId}`, true);
+ // xhr.setRequestHeader("X-API-KEY", apikey);
+ xhr.send();
+}
+
+function acceptApplication(username, gymId) {
+ const xhr = new XMLHttpRequest();
+ xhr.onreadystatechange = function () {
+ if (this.readyState === 4) {
+ if (this.status === 200) {
+
+ } else {
+ const json = JSON.parse(this.responseText);
+ alert(json["error"]);
+ }
+ }
+ };
+
+ // xhr.open("GET", `/api/gym/rating?gym_id=${gymId}`, true);
+ // xhr.setRequestHeader("X-API-KEY", apikey);
+ xhr.send();
+}
\ No newline at end of file
diff --git a/src/public/javascript/gym/trainer_card.js b/src/public/javascript/gym/trainer_card.js
new file mode 100644
index 0000000..69a9ccf
--- /dev/null
+++ b/src/public/javascript/gym/trainer_card.js
@@ -0,0 +1,35 @@
+function acceptance(acc_code){
+ if (acc_code == 0){
+ return "Applied";
+ } else if (acc_code == 1){
+ return "Accepted";
+ } else if (acc_code == 2){
+ return "Rejected";
+ } else {
+ return "Unknown";
+ }
+}
+
+function TrainerCard(trainer){
+ let truncated_name = truncateText(trainer.name, 16);
+ let acceptance_status = acceptance(trainer.acceptance);
+ let tname = "trainer name : " + truncated_name;
+ let tusername = "username : " + trainer.username;
+ let trainer_card = `
+ <a class="gym-card" id="gym-card-${trainer.username}" href="./application/?gym_id=${trainer.gym_id}&trainer_username=${trainer.username}">
+ <div class="trainer-card-text">
+ <div class="gym-card-name"> ${tname} </div>
+ <div class="space3"></div>
+ <div class="gym-card-text-bottom">
+ <div class="gym-card-text-bottom-left">
+ ${tusername}
+ </div>
+ <div class="gym-card-text-bottom-right">
+ ${acceptance_status}
+ </div>
+ </div>
+ </div>
+ </a>
+ `;
+ return trainer_card;
+}
\ No newline at end of file
--
GitLab