Skip to content
Snippets Groups Projects
Commit aa988664 authored by moonawar's avatar moonawar
Browse files

pop up in all pages

parent 6f0b9216
Branches
Tags
No related merge requests found
Hide whitespace changes
Inline Side-by-side
Showing
with 350 additions and 134 deletions
app/controllers/BookController.php
+ 2
− 1
View file @ aa988664
......@@ -93,7 +93,8 @@ class BookController extends Controller implements ControllerInterface{
$title, $year, $summary, $price, $duration, $lang,
$uploadedAudio, $uploadedImage, $authors, $genres
);
header("Location: /book/", true, 301);
exit;
default:
......
app/models/BookModel.php
+ 0
− 2
View file @ aa988664
......@@ -25,8 +25,6 @@ class BookModel {
$this->db->execute($stmt);
$bookId = $this->db->insertId();
echo $bookId;
$stmt->close();
if ($bookId) {
......
app/pages/admin/AddAuthorPage.php
+ 56
− 15
View file @ aa988664
......@@ -10,6 +10,7 @@
<link rel="stylesheet" type="text/css" href="<?= BASE_URL ?>/styles/template/globals.css">
<!-- Navbar CSS -->
<link rel="stylesheet" type="text/css" href="<?= BASE_URL ?>/styles/template/navbar.css">
<link rel="stylesheet" type="text/css" href="<?= BASE_URL ?>/styles/template/popup.css">
<!-- Page-specific CSS -->
<link rel="stylesheet" type="text/css" href="<?= BASE_URL ?>/styles/admin/crud-page.css">
<title>Add Author</title>
......@@ -18,22 +19,62 @@
<body>
<!-- Navigation bar -->
<?php include(dirname(__DIR__) . '../../components/Navbar.php') ?>
<div class="content">
<h2>Add Author Page</h2>
<form
class="form-box center-contents"
action="/author/add" method="POST" enctype="multipart/form-data"
>
<div class="form-content flex-column"> <label class="form-label" for="author-name">Author Name:</label>
<input class="form-field" type="text" id="author-name" name="author-name" required>
<label class="form-label" for="author-age">Author Age:</label>
<input class="form-field" type="text" id="author-age" name="author-age" required>
<input type="submit" class="button green-button" value="Add">
<section>
<!-- Pop Up -->
<span class="overlay"></span>
<div class="modal-box">
<h2>Add Author</h2>
<h3>Are you sure want to add this Author?</h3>
<div class="buttons">
<button class="cancel-btn">Cancel</button>
<button id="addAuthorBtn" class="confirm-btn">Add</button>
</div>
</form>
</div>
</div>
<div class="content">
<h2>Add Author Page</h2>
<form
id="addAuthorForm"
class="form-box center-contents"
>
<div class="form-content flex-column"> <label class="form-label" for="author-name">Author Name:</label>
<input class="form-field" type="text" id="author-name" name="author-name" required>
<label class="form-label" for="author-age">Author Age:</label>
<input class="form-field" type="number" id="author-age" name="author-age" required>
<input type="button" class="show-modal button green-button" value="Add">
</div>
</form>
</div>
</section>
</body>
<script>
const section = document.querySelector("section"),
overlay = document.querySelector(".overlay"),
showBtn = document.querySelector(".show-modal"),
closeBtn = document.querySelector(".cancel-btn"),
editUser = document.getElementById("addAuthorBtn");
editUser.addEventListener("click", function (event) {
event.preventDefault();
const form = document.getElementById("addAuthorForm");
form.action="/author/add/"
form.method = "POST";
form.enctype = "multipart/form-data";
form.submit();
});
showBtn.addEventListener("click", ()=>section.classList.add("active"));
overlay.addEventListener("click", () =>
section.classList.remove("active")
);
closeBtn.addEventListener("click", () =>
section.classList.remove("active")
);
</script>
</html>
\ No newline at end of file
app/pages/admin/AddBookPage.php
+ 90
− 37
View file @ aa988664
......@@ -9,6 +9,7 @@
<link rel="stylesheet" type="text/css" href="<?= BASE_URL ?>/styles/template/globals.css">
<!-- Navbar CSS -->
<link rel="stylesheet" type="text/css" href="<?= BASE_URL ?>/styles/template/navbar.css">
<link rel="stylesheet" type="text/css" href="<?= BASE_URL ?>/styles/template/popup.css">
<!-- Page-specific CSS -->
<link rel="stylesheet" type="text/css" href="<?= BASE_URL ?>/styles/admin/crud-page.css">
<title>Add Book</title>
......@@ -16,43 +17,95 @@
<body>
<!-- Navigation bar -->
<?php include(dirname(__DIR__) . '../../components/Navbar.php') ?>
<div class="content">
<br><br><br>
<h2>Add Book Page</h2>
<form
class="form-box center-contents"
action="/book/add" method="POST" enctype="multipart/form-data"
>
<div class="form-content flex-column">
<label class="form-label" for="title">Title:</label>
<input class="form-field" type="text" id="title" name="title" required>
<label class="form-label" for="year">Year Published:</label>
<input class="form-field" type="number" id="year" name="year" required>
<label class="form-label" for="summary">Summary:</label>
<textarea
class="text-area" type="text" id="summary" name="summary"
rows="5" cols="50" required
> </textarea>
<label class="form-label" for="authors[]">Authors:</label>
<input class="form-field" type="number" id="author" name="authors[]" required>
<label class="form-label" for="genres[]">Genres:</label>
<input class="form-field" type="number" id="genre" name="genres[]" required>
<label class="form-label" for="price">Price:</label>
<input class="form-field" type="number" id="price" name="price" required>
<label class="file-upload form-label" for="cover">Book Cover:</label>
<input type="file" id="image" name="cover" accept="image/png, image/jpeg" required>
<label class="file-upload form-label" for="audio">Audio:</label>
<input type="file" id="audio" name="audio" accept="audio/mpeg" required>
<button type="submit" class="button green-button">Add</button>
<section>
<!-- Pop Up -->
<span class="overlay"></span>
<div class="modal-box">
<h2>Add Book</h2>
<h3>Are you sure want to add this book?</h3>
<div class="buttons">
<button class="cancel-btn">Cancel</button>
<button id="addBookBtn" class="confirm-btn">Add</button>
</div>
</div>
<div class="content">
<br><br><br>
<h2>Add Book Page</h2>
<form
id="addBookForm"
class="form-box center-contents"
>
<div class="form-content flex-column">
<label class="form-label" for="title">Title:</label>
<input class="form-field" type="text" id="title" name="title" required>
<label class="form-label" for="year">Year Published:</label>
<input class="form-field" type="number" id="year" name="year" required>
<label class="form-label" for="summary">Summary:</label>
<textarea
class="text-area" type="text" id="summary" name="summary"
rows="5" cols="50" required
> </textarea>
<label class="form-label" for="authors[]">Authors:</label>
<input class="form-field" type="number" id="author" name="authors[]" required>
<label class="form-label" for="genres[]">Genres:</label>
<input class="form-field" type="number" id="genre" name="genres[]" required>
<label class="form-label" for="price">Price:</label>
<input class="form-field" type="number" id="price" name="price" required>
<label class="file-upload form-label" for="cover">Book Cover:</label>
<input type="file" id="image" name="cover" accept="image/png, image/jpeg" required>
<label class="file-upload form-label" for="audio">Audio:</label>
<input type="file" id="audio" name="audio" accept="audio/mpeg" required>
<input type="button" class="show-modal button green-button" value="Add">
</div>
</form>
</div>
</form>
</div>
</section>
</body>
<script>
const section = document.querySelector("section"),
overlay = document.querySelector(".overlay"),
showBtn = document.querySelector(".show-modal"),
closeBtn = document.querySelector(".cancel-btn"),
addBookBtn = document.getElementById("addBookBtn");
function showModal() {
const inputFields = document.querySelectorAll('.form-field');
// Check if any input field is empty
const isEmpty = Array.from(inputFields).some(field => field.value.trim() === '');
if (!isEmpty) {
section.classList.add("active");
} else {
alert("Please fill in all the required fields.");
showBtn.removeEventListener("click", showModal);
}
}
addBookBtn.addEventListener("click", function () {
const form = document.getElementById("addBookForm");
form.action = "/book/add";
form.method = "POST";
form.enctype = "multipart/form-data";
form.submit();
});
showBtn.addEventListener("click", showModal);
overlay.addEventListener("click", () =>
section.classList.remove("active")
);
closeBtn.addEventListener("click", () =>
section.classList.remove("active")
);
</script>
</html>
app/pages/admin/AddGenrePage.php
+ 2
− 1
View file @ aa988664
......@@ -36,6 +36,7 @@
<div class="content">
<h2>Add Genre Page</h2>
<form
id="addGenreForm"
class="form-box center-contents"
>
<div class="form-content flex-column">
......@@ -68,7 +69,7 @@
}
}
addGenreBtn.addEventListener("click", function () {
const form = document.querySelector('form');
const form = document.getElementById("addGenreForm");
form.action = "/genre/add";
form.method = "POST";
form.enctype = "multipart/form-data";
......
app/pages/admin/UpdateSpecificAuthorPage.php
+ 73
− 31
View file @ aa988664
......@@ -10,6 +10,7 @@
<link rel="stylesheet" type="text/css" href="<?= BASE_URL ?>/styles/template/globals.css">
<!-- Navbar CSS -->
<link rel="stylesheet" type="text/css" href="<?= BASE_URL ?>/styles/template/navbar.css">
<link rel="stylesheet" type="text/css" href="<?= BASE_URL ?>/styles/template/popup.css">
<!-- Page-specific CSS -->
<link rel="stylesheet" type="text/css" href="<?= BASE_URL ?>/styles/admin/list.css">
<link rel="stylesheet" type="text/css" href="<?= BASE_URL ?>/styles/admin/crud-page.css">
......@@ -19,38 +20,79 @@
<body>
<!-- Navigation bar -->
<?php include(dirname(__DIR__) . '../../components/Navbar.php') ?>
<div class="wrapper-small">
<div class="pad-40">
<h1>Update Author Page</h1>
<form
action="/author/update/<? echo $this->data['author_id']?>" method="POST" enctype="multipart/form-data"
>
<p class="form-label">Author ID : <?
echo $this->data['author_id'];
?></p>
<p class="form-label">Previous Name : <?
echo $this->data['full_name'];
?></p>
<p class="form-label">Previous Age : <?
echo $this->data['age'];
?></p>
<br>
<label class="form-label" for="full_name">New Author Name:</label><br>
<input class="form-field" type="text" id="full_name" name="full_name" required>
<br><br>
<label class="form-label" for="age">New Author Age:</label><br>
<input class="form-field" type="number" id="age" name="age" required>
<br><br>
<input type="submit" class="button green-button" value="Update">
</form>
<section>
<!-- Pop Up -->
<span class="overlay"></span>
<div class="modal-box">
<h2>Edit Author</h2>
<h3>Are you sure want to edit this Author?</h3>
<div class="buttons">
<button class="cancel-btn">Cancel</button>
<button id="editAuthorBtn" class="confirm-btn">Edit</button>
</div>
</div>
</div>
<div class="wrapper-small">
<div class="pad-40">
<h1>Update Author Page</h1>
<form
id="editAuthorForm"
action="/author/update/<? echo $this->data['author_id']?>" method="POST" enctype="multipart/form-data"
>
<p class="form-label">Author ID : <?
echo $this->data['author_id'];
?></p>
<p class="form-label">Previous Name : <?
echo $this->data['full_name'];
?></p>
<p class="form-label">Previous Age : <?
echo $this->data['age'];
?></p>
<br>
<label class="form-label" for="full_name">New Author Name:</label><br>
<input class="form-field" type="text" id="full_name" name="full_name" required>
<br><br>
<label class="form-label" for="age">New Author Age:</label><br>
<input class="form-field" type="number" id="age" name="age" required>
<br><br>
<input type="button" class="show-modal button green-button" value="Update">
</form>
</div>
</div>
</section>
</body>
<script>
const section = document.querySelector("section"),
overlay = document.querySelector(".overlay"),
showBtn = document.querySelector(".show-modal"),
closeBtn = document.querySelector(".cancel-btn"),
editAuthor = document.getElementById("editAuthorBtn");
editAuthor.addEventListener("click", function (event) {
event.preventDefault();
const form = document.getElementById("editAuthorForm");
form.action="/author/update/<? echo $this->data['author_id']?>"
form.method = "POST";
form.enctype = "multipart/form-data";
form.submit();
});
showBtn.addEventListener("click", ()=>section.classList.add("active"));
overlay.addEventListener("click", () =>
section.classList.remove("active")
);
closeBtn.addEventListener("click", () =>
section.classList.remove("active")
);
</script>
</html>
\ No newline at end of file
app/pages/admin/UpdateSpecificGenrePage.php
+ 65
− 24
View file @ aa988664
......@@ -10,39 +10,80 @@
<link rel="stylesheet" type="text/css" href="<?= BASE_URL ?>/styles/template/globals.css">
<!-- Navbar CSS -->
<link rel="stylesheet" type="text/css" href="<?= BASE_URL ?>/styles/template/navbar.css">
<link rel="stylesheet" type="text/css" href="<?= BASE_URL ?>/styles/template/popup.css">
<!-- Page-specific CSS -->
<link rel="stylesheet" type="text/css" href="<?= BASE_URL ?>/styles/admin/list.css">
<link rel="stylesheet" type="text/css" href="<?= BASE_URL ?>/styles/admin/crud-page.css">
<title>Update User : <? echo $this->data['genre_id'];?></title>
<title>Update Genre : <? echo $this->data['genre_id'];?></title>
</head>
<body>
<!-- Navigation bar -->
<?php include(dirname(__DIR__) . '../../components/Navbar.php') ?>
<div class="wrapper-small">
<div class="pad-40">
<h1>Update Genre Page</h1>
<form
action="/genre/update/<? echo $this->data['genre_id']?>" method="POST" enctype="multipart/form-data"
>
<p class="form-label">Genre ID : <?
echo $this->data['genre_id'];
?></p>
<p class="form-label">Previous Genre Name : <?
echo $this->data['name'];
?></p>
<br>
<label class="form-label" for="name">New Genre Name:</label><br>
<input class="form-field" type="text" id="name" name="name" required>
<br><br>
<input type="submit" class="button green-button" value="Update">
</form>
<section>
<!-- Pop Up -->
<span class="overlay"></span>
<div class="modal-box">
<h2>Edit Genre</h2>
<h3>Are you sure want to edit this Genre?</h3>
<div class="buttons">
<button class="cancel-btn">Cancel</button>
<button id="editGenreBtn" class="confirm-btn">Edit</button>
</div>
</div>
<div class="wrapper-small">
<div class="pad-40">
<h1>Update Genre Page</h1>
<form
id="editGenreForm"
action="/genre/update/<? echo $this->data['genre_id']?>" method="POST" enctype="multipart/form-data"
>
<p class="form-label">Genre ID : <?
echo $this->data['genre_id'];
?></p>
<p class="form-label">Previous Genre Name : <?
echo $this->data['name'];
?></p>
<br>
<label class="form-label" for="name">New Genre Name:</label><br>
<input class="form-field" type="text" id="name" name="name" required>
<br><br>
<input type="button" class="show-modal button green-button" value="Update">
</form>
</div>
</div>
</div>
</section>
</body>
<script>
const section = document.querySelector("section"),
overlay = document.querySelector(".overlay"),
showBtn = document.querySelector(".show-modal"),
closeBtn = document.querySelector(".cancel-btn"),
editGenre = document.getElementById("editGenreBtn");
editGenre.addEventListener("click", function (event) {
event.preventDefault();
const form = document.getElementById("editGenreForm");
form.action="/genre/update/<? echo $this->data['genre_id']?>"
form.method = "POST";
form.enctype = "multipart/form-data";
form.submit();
});
showBtn.addEventListener("click", ()=>section.classList.add("active"));
overlay.addEventListener("click", () =>
section.classList.remove("active")
);
closeBtn.addEventListener("click", () =>
section.classList.remove("active")
);
</script>
</html>
\ No newline at end of file
app/pages/admin/UpdateSpecificUserPage.php
+ 62
− 23
View file @ aa988664
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
......@@ -10,6 +9,7 @@
<link rel="stylesheet" type="text/css" href="<?= BASE_URL ?>/styles/template/globals.css">
<!-- Navbar CSS -->
<link rel="stylesheet" type="text/css" href="<?= BASE_URL ?>/styles/template/navbar.css">
<link rel="stylesheet" type="text/css" href="<?= BASE_URL ?>/styles/template/popup.css">
<!-- Page-specific CSS -->
<link rel="stylesheet" type="text/css" href="<?= BASE_URL ?>/styles/admin/list.css">
<title>Update User : <? echo $this->data['username'];?></title>
......@@ -18,30 +18,69 @@
<body>
<!-- Navigation bar -->
<?php include(dirname(__DIR__) . '../../components/Navbar.php') ?>
<div class="wrapper-small">
<div class="pad-40">
<h1>Update User Page</h1>
<div class="centered">
<form
class="center-contents"
action="/user/update/<? echo $this->data['username']?>" method="POST" enctype="multipart/form-data"
>
<p class="form-label">Username : <?
echo $this->data['username'];
?></p>
<label class="form-label" for="role">User Role:</label>
<select class="select" id="role" name="role" value="<? echo $this->data['role'];?>">
<option value="customer">Customer</option>
<option value="admin">Admin</option>
</select>
<input type="submit" class="button green-button" value="Update">
</form>
<section>
<!-- Pop Up -->
<span class="overlay"></span>
<div class="modal-box">
<h2>Edit User</h2>
<h3>Are you sure want to edit this User?</h3>
<div class="buttons">
<button class="cancel-btn">Cancel</button>
<button id="editUserBtn" class="confirm-btn">Edit</button>
</div>
</div>
</div>
<div class="wrapper-small">
<div class="pad-40">
<h1>Update User Page</h1>
<div class="centered">
<form
class="center-contents" id="editUserForm"
action="/user/update/<? echo $this->data['username']?>" method="POST" enctype="multipart/form-data"
>
<p class="form-label">Username : <?
echo $this->data['username'];
?></p>
<label class="form-label" for="role">User Role:</label>
<select class="select" id="role" name="role" value="<? echo $this->data['role'];?>">
<option value="customer">Customer</option>
<option value="admin">Admin</option>
</select>
<input type="button" class="show-modal button green-button" value="Update">
</form>
</div>
</div>
</div>
</section>
</body>
<script>
const section = document.querySelector("section"),
overlay = document.querySelector(".overlay"),
showBtn = document.querySelector(".show-modal"),
closeBtn = document.querySelector(".cancel-btn"),
editUser = document.getElementById("editUserBtn");
editUser.addEventListener("click", function (event) {
event.preventDefault();
const form = document.getElementById("editUserForm");
form.action="/user/update/<? echo $this->data['username']?>"
form.method = "POST";
form.enctype = "multipart/form-data";
form.submit();
});
showBtn.addEventListener("click", ()=>section.classList.add("active"));
overlay.addEventListener("click", () =>
section.classList.remove("active")
);
closeBtn.addEventListener("click", () =>
section.classList.remove("active")
);
</script>
</html>
\ No newline at end of file
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment