Added contact form
This commit is contained in:
parent
86508aad5c
commit
d5910f5280
37
public/admin/deleteMessage.php
Executable file
37
public/admin/deleteMessage.php
Executable file
@ -0,0 +1,37 @@
|
|||||||
|
<?php
|
||||||
|
|
||||||
|
session_start();
|
||||||
|
|
||||||
|
if (!isset($_SESSION['uid'])) {
|
||||||
|
header('Location: /admin/login.php');
|
||||||
|
die;
|
||||||
|
}
|
||||||
|
|
||||||
|
$id = $_POST['id'];
|
||||||
|
if (!isset($id)) {
|
||||||
|
http_response_code(400);
|
||||||
|
die("Error: no message ID provided to delete");
|
||||||
|
}
|
||||||
|
|
||||||
|
$conn = new mysqli("localhost", "mileslinden", "Daiso@6969", "mileslinden");
|
||||||
|
|
||||||
|
$query = $conn->prepare("DELETE FROM messages WHERE id = ?");
|
||||||
|
if (!$query) {
|
||||||
|
http_response_code(500);
|
||||||
|
die("Error: {$conn->error}");
|
||||||
|
}
|
||||||
|
if (!$query->bind_param("i", $id)) {
|
||||||
|
http_response_code(400);
|
||||||
|
die("Error: message ID must be an integer.");
|
||||||
|
}
|
||||||
|
if (!$query->execute()) {
|
||||||
|
http_response_code(500);
|
||||||
|
die("Error {$query->errno}: {$query->error}");
|
||||||
|
}
|
||||||
|
|
||||||
|
if ($query->affected_rows === 0) {
|
||||||
|
http_response_code(400);
|
||||||
|
die("Error: that message does not exist");
|
||||||
|
} else {
|
||||||
|
die("Removed message $id successfully.");
|
||||||
|
}
|
@ -12,60 +12,156 @@ $conn = new mysqli("localhost", "mileslinden", "Daiso@6969", "mileslinden");
|
|||||||
$result = $conn->query("SELECT * FROM subscribers");
|
$result = $conn->query("SELECT * FROM subscribers");
|
||||||
if (!$result) {
|
if (!$result) {
|
||||||
http_response_code(500);
|
http_response_code(500);
|
||||||
die("Error: {$conn->error}");
|
die("Error retrieving subscribers: {$conn->error}");
|
||||||
}
|
}
|
||||||
|
|
||||||
$subscribers = [];
|
$subscribers = [];
|
||||||
while ($row = $result->fetch_assoc()) {
|
while ($row = $result->fetch_assoc()) {
|
||||||
$subscribers[] = $row;
|
$subscribers[] = $row;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
$result = $conn->query("SELECT id, full_name, subject, send_date FROM messages ORDER BY send_date DESC");
|
||||||
|
if (!$result) {
|
||||||
|
http_response_code(500);
|
||||||
|
die("Error retrieving messages: {$conn->error}");
|
||||||
|
}
|
||||||
|
|
||||||
|
$messages = [];
|
||||||
|
while ($row = $result->fetch_assoc()) {
|
||||||
|
$messages[] = $row;
|
||||||
|
}
|
||||||
?>
|
?>
|
||||||
<!DOCTYPE HTML>
|
<!DOCTYPE HTML>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
<title>Miles Linden for San Jose City Council</title>
|
<title>Miles Linden for San Jose City Council</title>
|
||||||
|
<style>
|
||||||
|
.cols {
|
||||||
|
display: flex;
|
||||||
|
gap: 4rem;
|
||||||
|
}
|
||||||
|
.cols > div {
|
||||||
|
flex: 1 1 0;
|
||||||
|
}
|
||||||
|
.tasks {
|
||||||
|
display: flex;
|
||||||
|
gap: 4rem;
|
||||||
|
}
|
||||||
|
.message {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1>Admin Panel</h1>
|
<h1>Admin Panel</h1>
|
||||||
<div>
|
<div class="tasks">
|
||||||
<p><a href="logout.php">Logout</a></p>
|
<a href="logout.php">Logout</a>
|
||||||
<p><a href="mail.php">Mail All</a></p>
|
<a href="mail.php">Mail All</a>
|
||||||
</div>
|
</div>
|
||||||
<h2>Subscribers</h2>
|
<div class="cols">
|
||||||
<table cellpadding="5">
|
<div>
|
||||||
<thead>
|
<h2>Subscribers</h2>
|
||||||
<tr>
|
<table cellpadding="5">
|
||||||
<th>Name</th>
|
<thead>
|
||||||
<th>Email</th>
|
<tr>
|
||||||
<th>Phone</th>
|
<th>Name</th>
|
||||||
<!--<th>Gender</th>-->
|
<th>Email</th>
|
||||||
<th>Join Date</th>
|
<th>Phone</th>
|
||||||
<th>Actions</th>
|
<!--<th>Gender</th>-->
|
||||||
</tr>
|
<th>Join Date</th>
|
||||||
</thead>
|
<th>Actions</th>
|
||||||
<tbody>
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
<?php
|
<?php
|
||||||
foreach ($subscribers as $row) {
|
foreach ($subscribers as $row) {
|
||||||
?>
|
?>
|
||||||
<tr>
|
<tr>
|
||||||
<td><?= htmlspecialchars($row['full_name']) ?></td>
|
<td><?= htmlspecialchars($row['full_name']) ?></td>
|
||||||
<td>
|
<td>
|
||||||
<a href="mailto:<?= htmlspecialchars($row['email']) ?>"><?= htmlspecialchars($row['email']) ?></a></td>
|
<a href="mailto:<?= htmlspecialchars($row['email']) ?>"><?= htmlspecialchars($row['email']) ?></a></td>
|
||||||
<td><?= htmlspecialchars($row['phone']) ?></td>
|
<td><?= htmlspecialchars($row['phone']) ?></td>
|
||||||
<!--<td><?= htmlspecialchars($row['gender']) ?></td>-->
|
<!--<td><?= htmlspecialchars($row['gender']) ?></td>-->
|
||||||
<td><?= htmlspecialchars($row['join_date']) ?></td>
|
<td><?= htmlspecialchars($row['join_date']) ?></td>
|
||||||
<td>
|
<td>
|
||||||
<form action="/admin/unsubscribe.php" method="POST">
|
<button class="deleteEmail" data-email="<?= htmlspecialchars($row['email']) ?>">Delete</button>
|
||||||
<input type="hidden" name="email" value="<?= htmlspecialchars($row['email']) ?>">
|
</td>
|
||||||
<button type="submit">Delete</button>
|
</tr>
|
||||||
</form>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
<?php
|
<?php
|
||||||
}
|
}
|
||||||
?>
|
?>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h2>Messages</h2>
|
||||||
|
<div class="messages">
|
||||||
|
<?php
|
||||||
|
foreach ($messages as $row) {
|
||||||
|
?>
|
||||||
|
<div class="message">
|
||||||
|
<div>
|
||||||
|
<a href="message.php?id=<?= $row['id'] ?>">
|
||||||
|
[<?= $row['send_date'] ?>] <?= htmlspecialchars($row['full_name']) ?>: <?= isset($row['subject']) ? htmlspecialchars($row['subject']) : '(no subject)' ?>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<button class="deleteMessage" data-message="<?= $row['id'] ?>">Delete</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<?php
|
||||||
|
}
|
||||||
|
?>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
document.addEventListener('DOMContentLoaded', function () {
|
||||||
|
for (const btn of document.querySelectorAll('button.deleteEmail')) {
|
||||||
|
btn.addEventListener('click', function (e) {
|
||||||
|
var email = e.target.dataset.email;
|
||||||
|
if (confirm(`Are you sure you want to delete ${email}?`)) {
|
||||||
|
var fd = new FormData();
|
||||||
|
fd.append('email', email);
|
||||||
|
fetch('/admin/unsubscribe.php', {
|
||||||
|
method: 'POST',
|
||||||
|
body: fd
|
||||||
|
}).then(function (res) {
|
||||||
|
if (!res.ok) {
|
||||||
|
res.text().then(alert);
|
||||||
|
} else {
|
||||||
|
window.location.reload();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
for (const btn of document.querySelectorAll('button.deleteMessage')) {
|
||||||
|
btn.addEventListener('click', function (e) {
|
||||||
|
var id = e.target.dataset.message;
|
||||||
|
var message = e.target.parentElement.parentElement.children[0];
|
||||||
|
var summary = message.innerText;
|
||||||
|
if (confirm(`Are you sure you want to delete message "${summary}"?`)) {
|
||||||
|
var fd = new FormData();
|
||||||
|
fd.append('id', id);
|
||||||
|
fetch('/admin/deleteMessage.php', {
|
||||||
|
method: 'POST',
|
||||||
|
body: fd
|
||||||
|
}).then(function (res) {
|
||||||
|
if (!res.ok) {
|
||||||
|
res.text().then(alert);
|
||||||
|
} else {
|
||||||
|
window.location.reload();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
52
public/admin/message.php
Executable file
52
public/admin/message.php
Executable file
@ -0,0 +1,52 @@
|
|||||||
|
<?php
|
||||||
|
|
||||||
|
session_start();
|
||||||
|
|
||||||
|
if (!isset($_SESSION['uid'])) {
|
||||||
|
header('Location: /admin/login.php');
|
||||||
|
die;
|
||||||
|
}
|
||||||
|
|
||||||
|
$id = $_GET['id'];
|
||||||
|
if (!isset($id)) {
|
||||||
|
http_response_code(400);
|
||||||
|
die("No message ID provided.");
|
||||||
|
}
|
||||||
|
|
||||||
|
$conn = new mysqli("localhost", "mileslinden", "Daiso@6969", "mileslinden");
|
||||||
|
|
||||||
|
$query = $conn->prepare("SELECT * FROM messages WHERE id = ?");
|
||||||
|
if (!$query) {
|
||||||
|
http_response_code(500);
|
||||||
|
die("Error: {$conn->error}");
|
||||||
|
}
|
||||||
|
if (!$query->bind_param("i", $id)) {
|
||||||
|
http_response_code(400);
|
||||||
|
die("Message ID must be an integer.");
|
||||||
|
}
|
||||||
|
if (!$query->execute()) {
|
||||||
|
http_response_code(500);
|
||||||
|
die("Error {$query->errno}: {$query->error}");
|
||||||
|
}
|
||||||
|
|
||||||
|
$result = $query->get_result();
|
||||||
|
if ($result->num_rows === 0) {
|
||||||
|
http_response_code(404);
|
||||||
|
die("Message with ID $id not found.");
|
||||||
|
}
|
||||||
|
|
||||||
|
$message = $result->fetch_assoc();
|
||||||
|
?>
|
||||||
|
<!DOCTYPE HTML>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>Miles Linden for San Jose City Council</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<h1><?= isset($message['subject']) ? htmlspecialchars($message['subject']) : '(no subject)' ?></h1>
|
||||||
|
<p>From: <?= htmlspecialchars($message['full_name']) ?> (<a href="mailto:<?= htmlspecialchars($message['email']) ?>"><?= htmlspecialchars($message['email']) ?></a>)</p>
|
||||||
|
<p>Date: <strong><?= $message['send_date'] ?></strong></p>
|
||||||
|
<pre><?= htmlspecialchars($message['message']) ?></pre>
|
||||||
|
</body>
|
||||||
|
</html>
|
@ -30,6 +30,5 @@ if ($query->affected_rows === 0) {
|
|||||||
http_response_code(400);
|
http_response_code(400);
|
||||||
die("Error: that email address does not exist");
|
die("Error: that email address does not exist");
|
||||||
} else {
|
} else {
|
||||||
header('Location: /admin');
|
die("Removed subscribed user $email successfully.");
|
||||||
die;
|
|
||||||
}
|
}
|
||||||
|
79
public/contact.php
Executable file
79
public/contact.php
Executable file
@ -0,0 +1,79 @@
|
|||||||
|
<?php
|
||||||
|
|
||||||
|
session_set_cookie_params(3600);
|
||||||
|
session_start();
|
||||||
|
|
||||||
|
$email = $_POST['email'];
|
||||||
|
$fname = $_POST['full_name'];
|
||||||
|
$subject = $_POST['subject'];
|
||||||
|
$message = $_POST['message'];
|
||||||
|
|
||||||
|
$pattern = '/^(?!(?:(?:\\x22?\\x5C[\\x00-\\x7E]\\x22?)|(?:\\x22?[^\\x5C\\x22]\\x22?)){255,})(?!(?:(?:\\x22?\\x5C[\\x00-\\x7E]\\x22?)|(?:\\x22?[^\\x5C\\x22]\\x22?)){65,}@)(?:(?:[\\x21\\x23-\\x27\\x2A\\x2B\\x2D\\x2F-\\x39\\x3D\\x3F\\x5E-\\x7E]+)|(?:\\x22(?:[\\x01-\\x08\\x0B\\x0C\\x0E-\\x1F\\x21\\x23-\\x5B\\x5D-\\x7F]|(?:\\x5C[\\x00-\\x7F]))*\\x22))(?:\\.(?:(?:[\\x21\\x23-\\x27\\x2A\\x2B\\x2D\\x2F-\\x39\\x3D\\x3F\\x5E-\\x7E]+)|(?:\\x22(?:[\\x01-\\x08\\x0B\\x0C\\x0E-\\x1F\\x21\\x23-\\x5B\\x5D-\\x7F]|(?:\\x5C[\\x00-\\x7F]))*\\x22)))*@(?:(?:(?!.*[^.]{64,})(?:(?:(?:xn--)?[a-z0-9]+(?:-+[a-z0-9]+)*\\.){1,126}){1,}(?:(?:[a-z][a-z0-9]*)|(?:(?:xn--)[a-z0-9]+))(?:-+[a-z0-9]+)*)|(?:\\[(?:(?:IPv6:(?:(?:[a-f0-9]{1,4}(?::[a-f0-9]{1,4}){7})|(?:(?!(?:.*[a-f0-9][:\\]]){7,})(?:[a-f0-9]{1,4}(?::[a-f0-9]{1,4}){0,5})?::(?:[a-f0-9]{1,4}(?::[a-f0-9]{1,4}){0,5})?)))|(?:(?:IPv6:(?:(?:[a-f0-9]{1,4}(?::[a-f0-9]{1,4}){5}:)|(?:(?!(?:.*[a-f0-9]:){5,})(?:[a-f0-9]{1,4}(?::[a-f0-9]{1,4}){0,3})?::(?:[a-f0-9]{1,4}(?::[a-f0-9]{1,4}){0,3}:)?)))?(?:(?:25[0-5])|(?:2[0-4][0-9])|(?:1[0-9]{2})|(?:[1-9]?[0-9]))(?:\\.(?:(?:25[0-5])|(?:2[0-4][0-9])|(?:1[0-9]{2})|(?:[1-9]?[0-9]))){3}))\\]))$/iD';
|
||||||
|
|
||||||
|
if (!isset($email) || preg_match($pattern, $email) !== 1) {
|
||||||
|
http_response_code(400);
|
||||||
|
header('Content-Type: application/json');
|
||||||
|
die(json_encode([
|
||||||
|
'field' => 'email',
|
||||||
|
'message' => 'Error: A valid email address is required.'
|
||||||
|
]));
|
||||||
|
}
|
||||||
|
if (!isset($fname)) {
|
||||||
|
http_response_code(400);
|
||||||
|
header('Content-Type: application/json');
|
||||||
|
die(json_encode([
|
||||||
|
'field' => 'full_name',
|
||||||
|
'message' => 'Error: A first and last name are required.'
|
||||||
|
]));
|
||||||
|
}
|
||||||
|
if (!isset($message)) {
|
||||||
|
http_response_code(400);
|
||||||
|
header('Content-Type: application/json');
|
||||||
|
die(json_encode([
|
||||||
|
'field' => 'email',
|
||||||
|
'message' => 'Error: A message is required.'
|
||||||
|
]));
|
||||||
|
}
|
||||||
|
if (!isset($subject)) {
|
||||||
|
$subject = null;
|
||||||
|
}
|
||||||
|
$conn = new mysqli("localhost", "mileslinden", "Daiso@6969", "mileslinden");
|
||||||
|
|
||||||
|
$query = $conn->prepare(
|
||||||
|
"INSERT INTO messages (`email`, `full_name`, `subject`, `message`, `send_date`) VALUES (?, ?, ?, ?, ?)"
|
||||||
|
);
|
||||||
|
if (!$query) {
|
||||||
|
http_response_code(500);
|
||||||
|
header('Content-Type: application/json');
|
||||||
|
die(json_encode(['message' => $conn->error]));
|
||||||
|
}
|
||||||
|
if (!isset($_SESSION['messages'])) {
|
||||||
|
$_SESSION['messages'] = 0;
|
||||||
|
} else if ($_SESSION['messages'] >= 5) {
|
||||||
|
http_response_code(429);
|
||||||
|
header('Content-Type: application/json');
|
||||||
|
die(json_encode(['message' => 'You are sending messages too often.']));
|
||||||
|
}
|
||||||
|
$query->bind_param(
|
||||||
|
"sssss",
|
||||||
|
$email, $fname, $subject, $message,
|
||||||
|
date("Y-m-d H:i:s")
|
||||||
|
);
|
||||||
|
if (!$query->execute()) {
|
||||||
|
http_response_code(500);
|
||||||
|
header('Content-Type: application/json');
|
||||||
|
die(json_encode(['message' => $query->error, 'errno' => $query->errno]));
|
||||||
|
}
|
||||||
|
$_SESSION['messages']++;
|
||||||
|
|
||||||
|
?>
|
||||||
|
<!DOCTYPE HTML>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>Miles Linden for San Jose City Council</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<h1>Your message was sent successfully.</h1>
|
||||||
|
</body>
|
||||||
|
</html>
|
@ -94,13 +94,13 @@ nav a:hover {
|
|||||||
padding: 1rem;
|
padding: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.banner form input {
|
.banner form input, .banner form textarea {
|
||||||
border-bottom: 0.25rem solid black;
|
border-bottom: 0.25rem solid black;
|
||||||
width: 60%;
|
width: 60%;
|
||||||
min-width: 250px;
|
min-width: 250px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.banner form input.invalid {
|
.banner form input.invalid, .banner form textarea.invalid {
|
||||||
border-bottom-color: red;
|
border-bottom-color: red;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -220,6 +220,14 @@ nav a:hover {
|
|||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#contactForm div {
|
||||||
|
padding: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
#contactForm input {
|
||||||
|
font-size: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
.read-more {
|
.read-more {
|
||||||
margin-top: 4rem;
|
margin-top: 4rem;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
@ -36,7 +36,7 @@
|
|||||||
<h1>Join</h1>
|
<h1>Join</h1>
|
||||||
</div>
|
</div>
|
||||||
<div class="banner">
|
<div class="banner">
|
||||||
<form action="/subscribe.php" method="POST">
|
<form id="subscribeForm" action="/subscribe.php" method="POST">
|
||||||
<div>
|
<div>
|
||||||
<input type="text" name="full_name" placeholder="Full Name" required>
|
<input type="text" name="full_name" placeholder="Full Name" required>
|
||||||
</div>
|
</div>
|
||||||
@ -84,8 +84,23 @@
|
|||||||
<h1>Contact</h1>
|
<h1>Contact</h1>
|
||||||
</div>
|
</div>
|
||||||
<div class="banner">
|
<div class="banner">
|
||||||
<h2>For any further inquiries please email</h2>
|
<form id="contactForm" method="POST" action="/contact.php">
|
||||||
<h2>contact@mileslinden.com</h2>
|
<div>
|
||||||
|
<input placeholder="Your Email" type="email" required name="email" maxlength="255">
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<input placeholder="Full Name" type="text" required name="full_name" maxlength="255">
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<input placeholder="Subject" type="text" required name="subject" maxlength="255">
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<textarea name="message" placeholder="Message"></textarea>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<button type="submit">Send</button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
172
public/js/app.js
172
public/js/app.js
@ -1,76 +1,118 @@
|
|||||||
document.addEventListener('DOMContentLoaded', function () {
|
function registerFormValidators(formId) {
|
||||||
|
var form = document.getElementById(formId);
|
||||||
var fullName = document.querySelector('input[name="full_name"]');
|
var fullName = form.querySelector('input[name="full_name"]');
|
||||||
var email = document.querySelector('input[name="email"]');
|
var email = form.querySelector('input[name="email"]');
|
||||||
var phone = document.querySelector('input[name="phone"]');
|
var phone = form.querySelector('input[name="phone"]');
|
||||||
var submit = document.querySelector('button[type="submit"]');
|
var subject = form.querySelector('input[name="subject"]');
|
||||||
|
var message = form.querySelector('textarea[name="message"]');
|
||||||
|
var submit = form.querySelector('button[type="submit"]');
|
||||||
|
|
||||||
const emailRegex = /^(([^<>()[\]\.,;:\s@\"]+(\.[^<>()[\]\.,;:\s@\"]+)*)|(\".+\"))@(([^<>()[\]\.,;:\s@\"]+\.)+[^<>()[\]\.,;:\s@\"]{2,})$/i;
|
const emailRegex = /^(([^<>()[\]\.,;:\s@\"]+(\.[^<>()[\]\.,;:\s@\"]+)*)|(\".+\"))@(([^<>()[\]\.,;:\s@\"]+\.)+[^<>()[\]\.,;:\s@\"]{2,})$/i;
|
||||||
const phoneRegex = /^(\+?0?1\s?)?\(?\d{3}\)?[\s.-]?\d{3}[\s.-]?\d{4}$/;
|
const phoneRegex = /^(\+?0?1\s?)?\(?\d{3}\)?[\s.-]?\d{3}[\s.-]?\d{4}$/;
|
||||||
const fullNameRegex = /[^\s.]{2,} [^\s.]{2,}/;
|
const fullNameRegex = /[^\s.]{2,} [^\s.]{2,}/;
|
||||||
|
|
||||||
|
|
||||||
fullName.addEventListener('input', function (e) {
|
if (fullName) {
|
||||||
if (! fullName.value.toLowerCase().match(fullNameRegex)) {
|
fullName.addEventListener('input', function (e) {
|
||||||
fullName.classList.add('invalid');
|
if (! fullName.value.toLowerCase().match(fullNameRegex)) {
|
||||||
} else {
|
fullName.classList.add('invalid');
|
||||||
fullName.classList.remove('invalid');
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
email.addEventListener('input', function (e) {
|
|
||||||
if (! email.value.toLowerCase().match(emailRegex)) {
|
|
||||||
email.classList.add('invalid');
|
|
||||||
} else {
|
|
||||||
email.classList.remove('invalid');
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
phone.addEventListener('input', function (e) {
|
|
||||||
if (! phone.value.match(phoneRegex)) {
|
|
||||||
phone.classList.add('invalid');
|
|
||||||
} else {
|
|
||||||
phone.classList.remove('invalid');
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
submit.addEventListener('click', function (e) {
|
|
||||||
e.preventDefault();
|
|
||||||
|
|
||||||
if (! fullName.value.toLowerCase().match(fullNameRegex)) {
|
|
||||||
alert("Your full name appears invalid.");
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
if (! email.value.toLowerCase().match(emailRegex)) {
|
|
||||||
alert("Your email address is invalid.");
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
if (! phone.value.match(phoneRegex)) {
|
|
||||||
alert("Your phone number is invalid.");
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
var fd = new FormData();
|
|
||||||
fd.append('full_name', fullName.value);
|
|
||||||
fd.append('email', email.value);
|
|
||||||
fd.append('phone', phone.value);
|
|
||||||
var req = fetch('/subscribe.php', {
|
|
||||||
method: 'POST',
|
|
||||||
body: fd
|
|
||||||
}).then(function (res) {
|
|
||||||
if (!res.ok) {
|
|
||||||
res.json().then(function (err) {
|
|
||||||
if ('field' in err) {
|
|
||||||
document.querySelector('input[name="'+ err.field + '"]').classList.add('invalid');
|
|
||||||
}
|
|
||||||
alert(err.message);
|
|
||||||
});
|
|
||||||
} else {
|
} else {
|
||||||
alert("You have subscribed successfully.");
|
fullName.classList.remove('invalid');
|
||||||
fullName.value = "";
|
|
||||||
email.value = "";
|
|
||||||
phone.value = "";
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
});
|
}
|
||||||
|
|
||||||
|
if (email) {
|
||||||
|
email.addEventListener('input', function (e) {
|
||||||
|
if (! email.value.toLowerCase().match(emailRegex)) {
|
||||||
|
email.classList.add('invalid');
|
||||||
|
} else {
|
||||||
|
email.classList.remove('invalid');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (phone) {
|
||||||
|
phone.addEventListener('input', function (e) {
|
||||||
|
if (! phone.value.match(phoneRegex)) {
|
||||||
|
phone.classList.add('invalid');
|
||||||
|
} else {
|
||||||
|
phone.classList.remove('invalid');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (message) {
|
||||||
|
message.addEventListener('input', function (e) {
|
||||||
|
if (!message.value) {
|
||||||
|
message.classList.add('invalid');
|
||||||
|
} else {
|
||||||
|
message.classList.remove('invalid');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (submit) {
|
||||||
|
submit.addEventListener('click', function (e) {
|
||||||
|
e.preventDefault();
|
||||||
|
|
||||||
|
if (fullName && !fullName.value.toLowerCase().match(fullNameRegex)) {
|
||||||
|
alert("Your full name appears invalid.");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (email && !email.value.toLowerCase().match(emailRegex)) {
|
||||||
|
alert("Your email address is invalid.");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (phone && !phone.value.match(phoneRegex)) {
|
||||||
|
alert("Your phone number is invalid.");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (message && !message.value) {
|
||||||
|
alert("Your message is invalid.");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
var fd = new FormData();
|
||||||
|
if (fullName)
|
||||||
|
fd.append('full_name', fullName.value);
|
||||||
|
if (email)
|
||||||
|
fd.append('email', email.value);
|
||||||
|
if (phone)
|
||||||
|
fd.append('phone', phone.value);
|
||||||
|
if (message)
|
||||||
|
fd.append('message', message.value);
|
||||||
|
if (subject)
|
||||||
|
fd.append('subject', subject.value);
|
||||||
|
var req = fetch(form.action, {
|
||||||
|
method: 'POST',
|
||||||
|
body: fd
|
||||||
|
}).then(function (res) {
|
||||||
|
if (!res.ok) {
|
||||||
|
res.json().then(function (err) {
|
||||||
|
if ('field' in err) {
|
||||||
|
form.querySelector('input[name="'+ err.field + '"]').classList.add('invalid');
|
||||||
|
}
|
||||||
|
alert(err.message);
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
alert("Submitted successfully.");
|
||||||
|
if (fullName)
|
||||||
|
fullName.value = "";
|
||||||
|
if (email)
|
||||||
|
email.value = "";
|
||||||
|
if (phone)
|
||||||
|
phone.value = "";
|
||||||
|
if (message)
|
||||||
|
message.value = "";
|
||||||
|
if (subject)
|
||||||
|
subject.value = "";
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
document.addEventListener('DOMContentLoaded', function () {
|
||||||
|
registerFormValidators('subscribeForm');
|
||||||
|
registerFormValidators('contactForm');
|
||||||
});
|
});
|
||||||
|
@ -6,10 +6,18 @@ session_start();
|
|||||||
$email = $_POST['email'];
|
$email = $_POST['email'];
|
||||||
$fname = $_POST['full_name'];
|
$fname = $_POST['full_name'];
|
||||||
$phone = $_POST['phone'];
|
$phone = $_POST['phone'];
|
||||||
$gender = isset($_POST['gender']) && $_POST['gender'];
|
$gender = $_POST['gender'];
|
||||||
|
|
||||||
$pattern = '/^(?!(?:(?:\\x22?\\x5C[\\x00-\\x7E]\\x22?)|(?:\\x22?[^\\x5C\\x22]\\x22?)){255,})(?!(?:(?:\\x22?\\x5C[\\x00-\\x7E]\\x22?)|(?:\\x22?[^\\x5C\\x22]\\x22?)){65,}@)(?:(?:[\\x21\\x23-\\x27\\x2A\\x2B\\x2D\\x2F-\\x39\\x3D\\x3F\\x5E-\\x7E]+)|(?:\\x22(?:[\\x01-\\x08\\x0B\\x0C\\x0E-\\x1F\\x21\\x23-\\x5B\\x5D-\\x7F]|(?:\\x5C[\\x00-\\x7F]))*\\x22))(?:\\.(?:(?:[\\x21\\x23-\\x27\\x2A\\x2B\\x2D\\x2F-\\x39\\x3D\\x3F\\x5E-\\x7E]+)|(?:\\x22(?:[\\x01-\\x08\\x0B\\x0C\\x0E-\\x1F\\x21\\x23-\\x5B\\x5D-\\x7F]|(?:\\x5C[\\x00-\\x7F]))*\\x22)))*@(?:(?:(?!.*[^.]{64,})(?:(?:(?:xn--)?[a-z0-9]+(?:-+[a-z0-9]+)*\\.){1,126}){1,}(?:(?:[a-z][a-z0-9]*)|(?:(?:xn--)[a-z0-9]+))(?:-+[a-z0-9]+)*)|(?:\\[(?:(?:IPv6:(?:(?:[a-f0-9]{1,4}(?::[a-f0-9]{1,4}){7})|(?:(?!(?:.*[a-f0-9][:\\]]){7,})(?:[a-f0-9]{1,4}(?::[a-f0-9]{1,4}){0,5})?::(?:[a-f0-9]{1,4}(?::[a-f0-9]{1,4}){0,5})?)))|(?:(?:IPv6:(?:(?:[a-f0-9]{1,4}(?::[a-f0-9]{1,4}){5}:)|(?:(?!(?:.*[a-f0-9]:){5,})(?:[a-f0-9]{1,4}(?::[a-f0-9]{1,4}){0,3})?::(?:[a-f0-9]{1,4}(?::[a-f0-9]{1,4}){0,3}:)?)))?(?:(?:25[0-5])|(?:2[0-4][0-9])|(?:1[0-9]{2})|(?:[1-9]?[0-9]))(?:\\.(?:(?:25[0-5])|(?:2[0-4][0-9])|(?:1[0-9]{2})|(?:[1-9]?[0-9]))){3}))\\]))$/iD';
|
$pattern = '/^(?!(?:(?:\\x22?\\x5C[\\x00-\\x7E]\\x22?)|(?:\\x22?[^\\x5C\\x22]\\x22?)){255,})(?!(?:(?:\\x22?\\x5C[\\x00-\\x7E]\\x22?)|(?:\\x22?[^\\x5C\\x22]\\x22?)){65,}@)(?:(?:[\\x21\\x23-\\x27\\x2A\\x2B\\x2D\\x2F-\\x39\\x3D\\x3F\\x5E-\\x7E]+)|(?:\\x22(?:[\\x01-\\x08\\x0B\\x0C\\x0E-\\x1F\\x21\\x23-\\x5B\\x5D-\\x7F]|(?:\\x5C[\\x00-\\x7F]))*\\x22))(?:\\.(?:(?:[\\x21\\x23-\\x27\\x2A\\x2B\\x2D\\x2F-\\x39\\x3D\\x3F\\x5E-\\x7E]+)|(?:\\x22(?:[\\x01-\\x08\\x0B\\x0C\\x0E-\\x1F\\x21\\x23-\\x5B\\x5D-\\x7F]|(?:\\x5C[\\x00-\\x7F]))*\\x22)))*@(?:(?:(?!.*[^.]{64,})(?:(?:(?:xn--)?[a-z0-9]+(?:-+[a-z0-9]+)*\\.){1,126}){1,}(?:(?:[a-z][a-z0-9]*)|(?:(?:xn--)[a-z0-9]+))(?:-+[a-z0-9]+)*)|(?:\\[(?:(?:IPv6:(?:(?:[a-f0-9]{1,4}(?::[a-f0-9]{1,4}){7})|(?:(?!(?:.*[a-f0-9][:\\]]){7,})(?:[a-f0-9]{1,4}(?::[a-f0-9]{1,4}){0,5})?::(?:[a-f0-9]{1,4}(?::[a-f0-9]{1,4}){0,5})?)))|(?:(?:IPv6:(?:(?:[a-f0-9]{1,4}(?::[a-f0-9]{1,4}){5}:)|(?:(?!(?:.*[a-f0-9]:){5,})(?:[a-f0-9]{1,4}(?::[a-f0-9]{1,4}){0,3})?::(?:[a-f0-9]{1,4}(?::[a-f0-9]{1,4}){0,3}:)?)))?(?:(?:25[0-5])|(?:2[0-4][0-9])|(?:1[0-9]{2})|(?:[1-9]?[0-9]))(?:\\.(?:(?:25[0-5])|(?:2[0-4][0-9])|(?:1[0-9]{2})|(?:[1-9]?[0-9]))){3}))\\]))$/iD';
|
||||||
|
|
||||||
|
if (!isset($phone)) {
|
||||||
|
http_response_code(400);
|
||||||
|
header('Content-Type: application/json');
|
||||||
|
die(json_encode([
|
||||||
|
'field' => 'phone',
|
||||||
|
'message' => 'Error: A phone number is required.'
|
||||||
|
]));
|
||||||
|
}
|
||||||
//eliminate every char except 0-9
|
//eliminate every char except 0-9
|
||||||
$phone_num = preg_replace("/[^0-9]/", '', $phone);
|
$phone_num = preg_replace("/[^0-9]/", '', $phone);
|
||||||
|
|
||||||
@ -17,19 +25,35 @@ $phone_num = preg_replace("/[^0-9]/", '', $phone);
|
|||||||
if (strlen($phone_num) == 11)
|
if (strlen($phone_num) == 11)
|
||||||
$phone_num = preg_replace("/^1/", '', $phone_num);
|
$phone_num = preg_replace("/^1/", '', $phone_num);
|
||||||
|
|
||||||
if (!$email || preg_match($pattern, $email) !== 1 || !$fname || strlen($phone_num) !== 10) {
|
if (!isset($email) || preg_match($pattern, $email) !== 1) {
|
||||||
http_response_code(400);
|
http_response_code(400);
|
||||||
header('Content-Type: application/json');
|
header('Content-Type: application/json');
|
||||||
die(json_encode([
|
die(json_encode([
|
||||||
'field' => 'email',
|
'field' => 'email',
|
||||||
'message' => 'Error: An email address, first name, and last name are required.'
|
'message' => 'Error: A valid email address is required.'
|
||||||
|
]));
|
||||||
|
}
|
||||||
|
if (!isset($fname)) {
|
||||||
|
http_response_code(400);
|
||||||
|
header('Content-Type: application/json');
|
||||||
|
die(json_encode([
|
||||||
|
'field' => 'full_name',
|
||||||
|
'message' => 'Error: A first and last name are required.'
|
||||||
|
]));
|
||||||
|
}
|
||||||
|
if (strlen($phone_num) !== 10) {
|
||||||
|
http_response_code(400);
|
||||||
|
header('Content-Type: application/json');
|
||||||
|
die(json_encode([
|
||||||
|
'field' => 'phone',
|
||||||
|
'message' => 'Error: This phone number is invalid.'
|
||||||
]));
|
]));
|
||||||
}
|
}
|
||||||
if ($gender && $gender !== 'm' && $gender !== 'f') {
|
if ($gender && $gender !== 'm' && $gender !== 'f') {
|
||||||
http_response_code(400);
|
http_response_code(400);
|
||||||
header('Content-Type: application/json');
|
header('Content-Type: application/json');
|
||||||
die(json_encode([
|
die(json_encode([
|
||||||
'field' => 'full_name',
|
'field' => 'gender',
|
||||||
'message' => 'Error: An invalid gender was given.'
|
'message' => 'Error: An invalid gender was given.'
|
||||||
]));
|
]));
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user