This repository has been archived on 2025-02-15. You can view files and clone it, but cannot push or open issues or pull requests.
Heartily/templates/index.html
2023-06-29 16:32:46 -07:00

126 lines
4.1 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<title>Heartily</title>
<link
rel="stylesheet"
href="{{ url_for('static', filename='style.css') }}"
/>
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"
/>
</head>
<body>
<header>
<div class="logo">
<a href="/" class="logo-link">
<img
src="{{ url_for('static', filename='heartily1.gif') }}"
alt="Heartily Logo"
class="logo-img"
/>
<p class="logo-name">Heartily</p>
<p>Col. 3:23</p>
</a>
</div>
</header>
<div class="container">
<form action="{{ url_for('search') }}" method="GET" class="search-form">
<input
type="text"
name="query"
placeholder="Search..."
class="search-input"
/>
<button type="submit" class="search-button">Search</button>
<a href="/" class="wrapper">
<span class="button-text">Refresh</span>
<span class="button-icon"><i class="far fa-heart"></i></span>
</a>
</form>
<h1>Latest Jobs:</h1>
<p>This list is updated hourly. Last update: {{ run_time }}</p>
<ul>
{% for item in items %}
<li>
<h2>{{ item.title }}</h2>
<p>Source: {{ item.source }}</p>
<p>Post Date: {{ item.pub_date }}</p>
<div class = "list-container">
<a href="{{ item.link }}" target="_blank" class="wrapper">
<span class="button-text">Apply Now</span>
<span class="button-icon"><i class="far fa-heart"></i></span>
</a>
<form
action="{{ url_for('report') }}"
method="POST"
class="report-form"
>
<input type="hidden" name="title" value="{{ item.title }}" />
<input type="hidden" name="link" value="{{ item.link }}" />
<button type="submit" class="report-button">
<span class="button-text">Report</span>
<span class="button-icon">
<i class="fas fa-heart-circle-exclamation"></i>
</span>
</button>
</form>
</div>
</li>
{% endfor %}
</ul>
</div>
<footer>
<p>
&copy; 2023 Heartily. All rights reserved. Version:
<a href="https://githaven.org/Shiloh/heartily" target="_blank">Beta</a>.
Powered by
<a href="https://shilohcode.com" target="_blank">Shiloh</a>.
</p>
</footer>
<!-- Notification overlay -->
<div id="notification-overlay" class="notification-overlay">
<span id="notification-message"></span>
</div>
<script>
// JavaScript code for displaying the notification overlay
function showNotification(message) {
var overlay = document.getElementById("notification-overlay");
var notification = document.getElementById("notification-message");
notification.textContent = message;
overlay.style.display = "block";
setTimeout(function () {
overlay.style.display = "none";
}, 10000); // Display the notification for 10 seconds
}
// JavaScript code for handling the AJAX request and displaying the notification
var reportForms = document.getElementsByClassName("report-form");
Array.prototype.forEach.call(reportForms, function (form) {
form.addEventListener("submit", function (event) {
event.preventDefault(); // Prevent the form from submitting
// Create a new FormData object to send the form data
var formData = new FormData(form);
// Send the AJAX request
var xhr = new XMLHttpRequest();
xhr.open("POST", "/report");
xhr.onreadystatechange = function () {
if (xhr.readyState === XMLHttpRequest.DONE && xhr.status === 200) {
var response = JSON.parse(xhr.responseText);
showNotification(response.message); // Display the notification
}
};
xhr.send(formData);
});
});
</script>
</body>
</html>