mirror of
https://github.com/rudy3333/eversync.git
synced 2025-07-01 16:46:02 +00:00
233 lines
No EOL
8.7 KiB
HTML
233 lines
No EOL
8.7 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Eversync</title>
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">
|
|
{% load static %}
|
|
<link rel="icon" href="{% static 'favicon.ico' %}">
|
|
<link rel="stylesheet" href="{% static 'index-style.css' %}" ">
|
|
{% block scripts %}
|
|
{% include "sentry_replay.html" %}
|
|
{% endblock %}
|
|
|
|
|
|
<style>
|
|
.container {
|
|
display: flex;
|
|
gap: 30px;
|
|
align-items: flex-start;
|
|
}
|
|
|
|
.welcome-box {
|
|
flex: 0 0 250px;
|
|
padding: 20px;
|
|
border-radius: 8px;
|
|
max-width: 250px;
|
|
}
|
|
|
|
/* On mobile */
|
|
@media (max-width: 700px) {
|
|
.container {
|
|
flex-direction: column;
|
|
align-items: center;
|
|
}
|
|
.welcome-box {
|
|
flex: none;
|
|
width: auto;
|
|
max-width: 90vw;
|
|
margin: 0 0 20px 0;
|
|
padding: 15px;
|
|
}
|
|
.content-box {
|
|
width: 100%;
|
|
}
|
|
}
|
|
|
|
</style>
|
|
</head>
|
|
|
|
</head>
|
|
<body>
|
|
<div class="header">
|
|
<div class="header-content">
|
|
<a href="/"><img src="{% static 'eversync2.png' %}" alt="Eversync Logo" style="height: 80px; margin-right: 10px; display: flex; align-items: center; gap: 5px;"></a>
|
|
<a href="/" class="logo" >eversync</a>
|
|
<div class="nav-links" style="position: relative;">
|
|
<div class="dropdown">
|
|
<button class="dropdown-toggle" style="background: none; border: none; color: white; font-size: 16px; cursor: pointer;">
|
|
Welcome, {{ user.username }} <i class="fas fa-caret-down"></i>
|
|
</button>
|
|
<div class="dropdown-menu" style="display: none; position: absolute; right: 0; background-color: #333; border: 1px solid #444; border-radius: 4px; padding: 10px; width: 184px;">
|
|
|
|
<form action="{% url 'manage' %}" method="post" style="margin: 0;">
|
|
{% csrf_token %}
|
|
<button type="submit" class="logout-button" style="background-color: transparent; color: white; border: none; cursor: pointer;">Manage Account</button>
|
|
</form>
|
|
|
|
<form action="{% url 'logoutz' %}" method="post" style="margin: 0;">
|
|
{% csrf_token %}
|
|
<button type="submit" class="logout-button" style="background-color: transparent; color: white; border: none; cursor: pointer;">Log Out</button>
|
|
</form>
|
|
<button id="themeToggle" class="logout-button" style="background-color: transparent; color: white; border: none; cursor: pointer;">Toggle Dark Mode</button>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="container">
|
|
<div class="welcome-box">
|
|
<h1>Welcome to Eversync</h1>
|
|
<p>You are logged in as {{ user.username }}</p>
|
|
<div id="affirmation-box" style="font-style: italic; margin-top: 20px;">
|
|
Loading encouragement...
|
|
</div>
|
|
|
|
<a href="/thought_reframing" style="font-style: italic; margin-top: 20px; display: block;">
|
|
thought reframing tool
|
|
</a>
|
|
<div id="message-notification" style="display: none; background-color: #ffeb3b; padding: 10px; border-radius: 4px; margin-top: 10px; text-align: center;">
|
|
<a href="/chat" style="text-decoration: none; color: black;">
|
|
<i class="fa-solid fa-envelope"></i> You have unread messages
|
|
</a>
|
|
</div>
|
|
<script>
|
|
async function fetchAffirmation() {
|
|
const res = await fetch("/api/affirmation/");
|
|
const data = await res.json();
|
|
document.getElementById("affirmation-box").innerText = data.affirmation;
|
|
}
|
|
|
|
async function checkUnseenMessages() {
|
|
const res = await fetch("/inbox/");
|
|
const data = await res.json();
|
|
const notification = document.getElementById("message-notification");
|
|
if (data.has_unseen) {
|
|
notification.style.display = "block";
|
|
} else {
|
|
notification.style.display = "none";
|
|
}
|
|
}
|
|
|
|
fetchAffirmation();
|
|
checkUnseenMessages();
|
|
setInterval(checkUnseenMessages, 10000);
|
|
</script>
|
|
</div>
|
|
|
|
<div class="content-box">
|
|
<h2>Your Dashboard</h2>
|
|
|
|
<div class="button-container">
|
|
<!-- <div class="service-button mail">
|
|
<i class="fas fa-envelope"></i>
|
|
mail
|
|
</div>
|
|
-->
|
|
|
|
<a href="/task_list" style="text-decoration: none;"><div class="service-button todo">
|
|
<i class="fa-solid fa-square-check"></i>
|
|
to-do
|
|
</div></a>
|
|
|
|
<a href="/calendar" style="text-decoration: none;"><div class="service-button calendar">
|
|
<i class="fas fa-calendar-alt"></i>
|
|
calendar
|
|
</div></a>
|
|
<a href="/upload" style="text-decoration: none;"><div class="service-button cloud">
|
|
<i class="fas fa-cloud-arrow-up"></i>
|
|
cloud
|
|
</div></a>
|
|
|
|
<a href="/notes" style="text-decoration: none;"><div class="service-button notes">
|
|
<i class="fa-solid fa-clipboard"></i>
|
|
notes
|
|
</div>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="button-container">
|
|
<a href="/pomodoro" style="text-decoration: none;"><div class="service-button timer">
|
|
<i class="fa-solid fa-hourglass"></i>
|
|
timer
|
|
</div></a>
|
|
|
|
<a href="/embed_list" style="text-decoration: none;"><div class="service-button embed">
|
|
<i class="fa-solid fa-bookmark"></i>
|
|
embeds
|
|
</div></a>
|
|
|
|
<a href="/meeting" style="text-decoration: none;"><div class="service-button meeting">
|
|
<i class="fa-solid fa-inverse fa-video"></i>
|
|
<div id="white-text">meetings</div>
|
|
</div></a>
|
|
|
|
<a href="/weather_pick" style="text-decoration: none;"><div class="service-button weather">
|
|
<i class="fa-solid fa-cloud"></i>
|
|
weather
|
|
</div></a>
|
|
|
|
</div>
|
|
|
|
<div class="button-container">
|
|
<a href="/documents" style="text-decoration: none;"><div class="service-button documents">
|
|
<i class="fa-solid fa-file"></i>
|
|
documents
|
|
</div></a>
|
|
|
|
<a href="/chat" style="text-decoration: none;"><div class="service-button chat">
|
|
<i class="fa-solid fa-comment"></i>
|
|
chat
|
|
</div></a>
|
|
|
|
<a href="/music" style="text-decoration: none;"><div class="service-button music">
|
|
<i class="fa-solid fa-music"></i>
|
|
music
|
|
</div></a>
|
|
|
|
<a href="/whiteboard" style="text-decoration: none;"><div class="service-button whiteboard">
|
|
<i class="fa-solid fa-chalkboard-user"></i>
|
|
whiteboard
|
|
</div></a>
|
|
</div>
|
|
<div class="button-container">
|
|
<a href="/web_archive" style="text-decoration: none;"><div class="service-button archive">
|
|
<i class="fa-solid fa-camera"></i>
|
|
web archive
|
|
</div></a>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
</div>
|
|
</div>
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
const toggle = document.querySelector('.dropdown-toggle');
|
|
const menu = document.querySelector('.dropdown-menu');
|
|
toggle.addEventListener('click', function () {
|
|
menu.style.display = menu.style.display === 'block' ? 'none' : 'block';
|
|
});
|
|
});
|
|
|
|
const toggle = document.getElementById("themeToggle");
|
|
const root = document.documentElement;
|
|
|
|
if (localStorage.getItem("theme") === "dark") {
|
|
root.classList.add("dark");
|
|
}
|
|
|
|
toggle.addEventListener("click", () => {
|
|
root.classList.toggle("dark");
|
|
if (root.classList.contains("dark")) {
|
|
localStorage.setItem("theme", "dark");
|
|
} else {
|
|
localStorage.setItem("theme", "light");
|
|
}
|
|
});
|
|
</script>
|
|
</body>
|
|
</html> |