forked from sent/waves
Small Luh Update
This commit is contained in:
parent
a76dab2d1f
commit
6b4ec8b1ae
|
@ -29,7 +29,7 @@
|
|||
<script src="/assets/js/eruda.js" defer></script>
|
||||
<script src="/assets/js/register.js" defer></script>
|
||||
<script src="/assets/js/settings.js" defer></script>
|
||||
<script src="/assets/js/greeting.js" defer></script>
|
||||
<script src="/assets/js/greetings.js" defer></script>
|
||||
<script src="/assets/js/$.js" defer></script>
|
||||
<script src="/assets/js/a.js" defer></script>
|
||||
<div class="relative flex flex-col h-[100vh] items-center justify-center bg-black transition-bg">
|
||||
|
@ -55,7 +55,7 @@
|
|||
<li><a id="backIcon" href="#"><i class="fa-regular fa-arrow-left"></i></a></li>
|
||||
<li><a id="refreshIcon" href="#"><i class="fa-regular fa-rotate-right"></i></a></li>
|
||||
<li><a id="forwardIcon" href="#"><i class="fa-regular fa-arrow-right"></i></a></li>
|
||||
<li><a href="/"><i class="fa-regular fa-home"></i></a></li>
|
||||
<li><a id="fullscreenIcon" href="#"><i class="fa-regular fa-expand"></i></a></li>
|
||||
<li>
|
||||
<div class="small-searchbar" style="position: relative;">
|
||||
<i id="lockIcon" class="fa-solid fa-lock"></i>
|
||||
|
@ -64,9 +64,9 @@
|
|||
style="padding-left: 40px;">
|
||||
</div>
|
||||
</li>
|
||||
<li><a href="/"><i class="fa-regular fa-home"></i></a></li>
|
||||
<li><a href="/g"><i class="fa-regular fa-gamepad"></i></a></li>
|
||||
<li><a href="/a"><i class="fa-regular fa-grid-2"></i></a></li>
|
||||
<li><a id="fullscreenIcon" href="#"><i class="fa-regular fa-expand"></i></a></li>
|
||||
<li><a id="erudaIcon" href="#"><i class="fa-regular fa-code"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
|
|
@ -29,7 +29,7 @@
|
|||
<script src="/assets/js/eruda.js" defer></script>
|
||||
<script src="/assets/js/register.js" defer></script>
|
||||
<script src="/assets/js/settings.js" defer></script>
|
||||
<script src="/assets/js/greeting.js" defer></script>
|
||||
<script src="/assets/js/greetings.js" defer></script>
|
||||
<script src="/assets/js/$.js" defer></script>
|
||||
<script src="/assets/js/g.js" defer></script>
|
||||
<div class="relative flex flex-col h-[100vh] items-center justify-center bg-black transition-bg">
|
||||
|
@ -55,7 +55,7 @@
|
|||
<li><a id="backIcon" href="#"><i class="fa-regular fa-arrow-left"></i></a></li>
|
||||
<li><a id="refreshIcon" href="#"><i class="fa-regular fa-rotate-right"></i></a></li>
|
||||
<li><a id="forwardIcon" href="#"><i class="fa-regular fa-arrow-right"></i></a></li>
|
||||
<li><a href="/"><i class="fa-regular fa-home"></i></a></li>
|
||||
<li><a id="fullscreenIcon" href="#"><i class="fa-regular fa-expand"></i></a></li>
|
||||
<li>
|
||||
<div class="small-searchbar" style="position: relative;">
|
||||
<i id="lockIcon" class="fa-solid fa-lock"></i>
|
||||
|
@ -64,9 +64,9 @@
|
|||
style="padding-left: 40px;">
|
||||
</div>
|
||||
</li>
|
||||
<li><a href="/"><i class="fa-regular fa-home"></i></a></li>
|
||||
<li><a href="/g"><i class="fa-regular fa-gamepad"></i></a></li>
|
||||
<li><a href="/a"><i class="fa-regular fa-grid-2"></i></a></li>
|
||||
<li><a id="fullscreenIcon" href="#"><i class="fa-regular fa-expand"></i></a></li>
|
||||
<li><a id="erudaIcon" href="#"><i class="fa-regular fa-code"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
|
|
@ -29,7 +29,7 @@
|
|||
<script src="/assets/js/register.js" defer></script>
|
||||
<script src="/assets/js/settings.js" defer></script>
|
||||
<script src="/assets/js/ping.js" defer></script>
|
||||
<script src="/assets/js/greeting.js" defer></script>
|
||||
<script src="/assets/js/greetings.js" defer></script>
|
||||
<script src="/assets/js/$.js" defer></script>
|
||||
<div class="relative flex flex-col h-[100vh] items-center justify-center bg-white transition-bg">
|
||||
<div class="absolute inset-0 overflow-hidden">
|
||||
|
@ -54,7 +54,7 @@
|
|||
<li><a id="backIcon" href="#"><i class="fa-regular fa-arrow-left"></i></a></li>
|
||||
<li><a id="refreshIcon" href="#"><i class="fa-regular fa-rotate-right"></i></a></li>
|
||||
<li><a id="forwardIcon" href="#"><i class="fa-regular fa-arrow-right"></i></a></li>
|
||||
<li><a href="/"><i class="fa-regular fa-home"></i></a></li>
|
||||
<li><a id="fullscreenIcon" href="#"><i class="fa-regular fa-expand"></i></a></li>
|
||||
<li>
|
||||
<div class="small-searchbar" style="position: relative;">
|
||||
<i id="lockIcon" class="fa-solid fa-lock"></i>
|
||||
|
@ -63,9 +63,9 @@
|
|||
style="padding-left: 40px;">
|
||||
</div>
|
||||
</li>
|
||||
<li><a href="/"><i class="fa-regular fa-home"></i></a></li>
|
||||
<li><a href="/g"><i class="fa-regular fa-gamepad"></i></a></li>
|
||||
<li><a href="/a"><i class="fa-regular fa-grid-2"></i></a></li>
|
||||
<li><a id="fullscreenIcon" href="#"><i class="fa-regular fa-expand"></i></a></li>
|
||||
<li><a id="erudaIcon" href="#"><i class="fa-regular fa-code"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
|
|
@ -427,7 +427,8 @@ body {
|
|||
top: 46%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
background-color: #131313a4;
|
||||
background-color: #08080894;
|
||||
border: 1px solid #ffffff21;
|
||||
color: #e0e0e0;
|
||||
padding: 25px 30px;
|
||||
border-radius: 20px;
|
||||
|
|
|
@ -4,7 +4,8 @@
|
|||
top: 47%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
background-color: #0a0a0ae7;
|
||||
background-color: #08080894;
|
||||
border: 1px solid #ffffff21;
|
||||
padding: 25px 30px;
|
||||
border-radius: 20px;
|
||||
width: 450px;
|
||||
|
@ -46,7 +47,7 @@
|
|||
|
||||
#close-settings {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
top: 17px;
|
||||
right: 10px;
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
|
|
|
@ -1,112 +0,0 @@
|
|||
window.onload = function() {
|
||||
var storedName = localStorage.getItem('userName');
|
||||
var greetingElement = document.getElementById('greeting');
|
||||
|
||||
if (!storedName) {
|
||||
document.getElementById('overlay').style.display = 'block';
|
||||
document.getElementById('namePrompt').style.display = 'block';
|
||||
} else if (greetingElement) {
|
||||
updateGreeting(storedName);
|
||||
showToast(`Hey, ${storedName} welcome back to Waves!`);
|
||||
}
|
||||
|
||||
var nameInput = document.getElementById('userName');
|
||||
var doneButton = document.getElementById('doneButton');
|
||||
|
||||
doneButton.disabled = nameInput.value.trim() === '';
|
||||
nameInput.addEventListener('input', function() {
|
||||
doneButton.disabled = nameInput.value.trim() === '';
|
||||
});
|
||||
};
|
||||
|
||||
function submitName() {
|
||||
var nameInput = document.getElementById('userName');
|
||||
var name = nameInput.value.trim();
|
||||
|
||||
if (name) {
|
||||
localStorage.setItem('userName', name);
|
||||
|
||||
var greetingElement = document.getElementById('greeting');
|
||||
if (greetingElement) {
|
||||
updateGreeting(name);
|
||||
}
|
||||
|
||||
document.getElementById('namePrompt').classList.add('fade-out');
|
||||
showToast(`Hey, ${name}! Welcome to Waves!`);
|
||||
|
||||
setTimeout(function() {
|
||||
document.getElementById('namePrompt').style.display = 'none';
|
||||
document.getElementById('overlay').style.display = 'none';
|
||||
}, 300);
|
||||
}
|
||||
}
|
||||
|
||||
function updateGreeting(name) {
|
||||
var greeting = getGreeting();
|
||||
var greetingElement = document.getElementById('greeting');
|
||||
|
||||
if (greetingElement) {
|
||||
greetingElement.innerHTML = `<i class="${greeting.iconClass}"></i> ${greeting.text}, ${name}!`;
|
||||
greetingElement.style.opacity = 1;
|
||||
}
|
||||
}
|
||||
|
||||
function showToast(message, type = "success", iconType = "check") {
|
||||
const toast = document.createElement("div");
|
||||
toast.className = `toast show ${type}`;
|
||||
|
||||
const icons = {
|
||||
success: '<i class="fas fa-check-circle" style="margin-right: 8px;"></i>',
|
||||
error: '<i class="fas fa-times-circle" style="margin-right: 8px;"></i>',
|
||||
info: '<i class="fas fa-info-circle" style="margin-right: 8px;"></i>',
|
||||
warning: '<i class="fas fa-exclamation-triangle" style="margin-right: 8px;"></i>',
|
||||
wave: '<i class="fa-regular fa-hand-wave" style="margin-right: 8px;"></i>'
|
||||
};
|
||||
|
||||
const icon = icons[iconType] || icons['wave'];
|
||||
toast.innerHTML = `${icon}${message} `;
|
||||
|
||||
const progressBar = document.createElement("div");
|
||||
progressBar.className = "progress-bar";
|
||||
toast.appendChild(progressBar);
|
||||
|
||||
const closeBtn = document.createElement("button");
|
||||
closeBtn.className = "toast-close";
|
||||
closeBtn.innerHTML = '<i class="fas fa-xmark" style="margin-left: 8px; font-size: 0.8em;"></i>';
|
||||
closeBtn.addEventListener("click", () => {
|
||||
toast.classList.add("hide");
|
||||
setTimeout(() => toast.remove(), 500);
|
||||
});
|
||||
toast.appendChild(closeBtn);
|
||||
document.body.appendChild(toast);
|
||||
|
||||
setTimeout(() => {
|
||||
toast.classList.add("hide");
|
||||
setTimeout(() => toast.remove(), 500);
|
||||
}, 3000);
|
||||
}
|
||||
|
||||
function getGreeting() {
|
||||
var hour = new Date().getHours();
|
||||
if (hour >= 5 && hour < 12) {
|
||||
return {
|
||||
text: 'Good morning',
|
||||
iconClass: 'fa-regular fa-cloud-sun'
|
||||
};
|
||||
} else if (hour >= 12 && hour < 17) {
|
||||
return {
|
||||
text: 'Good afternoon',
|
||||
iconClass: 'fa-regular fa-sun'
|
||||
};
|
||||
} else if (hour >= 17 && hour < 21) {
|
||||
return {
|
||||
text: 'Good evening',
|
||||
iconClass: 'fa-regular fa-cloud-moon'
|
||||
};
|
||||
} else {
|
||||
return {
|
||||
text: 'Good night',
|
||||
iconClass: 'fa-regular fa-moon'
|
||||
};
|
||||
}
|
||||
}
|
126
public/assets/js/greetings.js
Normal file
126
public/assets/js/greetings.js
Normal file
|
@ -0,0 +1,126 @@
|
|||
window.onload = function() {
|
||||
const storedName = localStorage.getItem('userName');
|
||||
if (!storedName) {
|
||||
document.getElementById('overlay').style.display = 'block';
|
||||
document.getElementById('namePrompt').style.display = 'block';
|
||||
const nameInput = document.getElementById('userName');
|
||||
const doneButton = document.getElementById('doneButton');
|
||||
doneButton.disabled = true;
|
||||
nameInput.addEventListener('input', () => {
|
||||
doneButton.disabled = nameInput.value.trim() === '';
|
||||
});
|
||||
return;
|
||||
}
|
||||
showToast(`Hey, ${storedName}! Welcome back to Waves!`, 'success', 'wave');
|
||||
const greetingElement = document.getElementById('greeting');
|
||||
if (greetingElement) {
|
||||
updateGreeting(storedName);
|
||||
}
|
||||
};
|
||||
|
||||
function submitName() {
|
||||
const name = document.getElementById('userName').value.trim();
|
||||
if (!name) return;
|
||||
localStorage.setItem('userName', name);
|
||||
updateGreeting(name);
|
||||
document.getElementById('namePrompt').classList.add('fade-out');
|
||||
showToast(`Hey, ${name}! Welcome to Waves!`, 'success', 'wave');
|
||||
setTimeout(() => {
|
||||
document.getElementById('namePrompt').style.display = 'none';
|
||||
document.getElementById('overlay').style.display = 'none';
|
||||
}, 300);
|
||||
}
|
||||
|
||||
function updateGreeting(name) {
|
||||
const { text, iconClass } = getGreeting();
|
||||
const el = document.getElementById('greeting');
|
||||
if (el) {
|
||||
el.innerHTML = `<i class="${iconClass}"></i> ${text}, ${name}!`;
|
||||
el.style.opacity = 1;
|
||||
}
|
||||
}
|
||||
|
||||
function showToast(message, type = 'success', iconType = 'check') {
|
||||
const toast = document.createElement('div');
|
||||
toast.className = `toast show ${type}`;
|
||||
const icons = {
|
||||
success: '<i class="fas fa-check-circle" style="margin-right: 8px;"></i>',
|
||||
error: '<i class="fas fa-times-circle" style="margin-right: 8px;"></i>',
|
||||
info: '<i class="fas fa-info-circle" style="margin-right: 8px;"></i>',
|
||||
warning: '<i class="fas fa-exclamation-triangle" style="margin-right: 8px;"></i>',
|
||||
wave: '<i class="fa-regular fa-hand-wave" style="margin-right: 8px;"></i>'
|
||||
};
|
||||
toast.innerHTML = `${icons[iconType] || icons.wave}${message} `;
|
||||
const progressBar = document.createElement('div');
|
||||
progressBar.className = 'progress-bar';
|
||||
toast.appendChild(progressBar);
|
||||
const closeBtn = document.createElement('button');
|
||||
closeBtn.className = 'toast-close';
|
||||
closeBtn.innerHTML = '<i class="fas fa-xmark" style="margin-left: 8px; font-size: 0.8em;"></i>';
|
||||
closeBtn.addEventListener('click', () => {
|
||||
toast.classList.add('hide');
|
||||
setTimeout(() => toast.remove(), 500);
|
||||
});
|
||||
toast.appendChild(closeBtn);
|
||||
document.body.appendChild(toast);
|
||||
setTimeout(() => {
|
||||
toast.classList.add('hide');
|
||||
setTimeout(() => toast.remove(), 500);
|
||||
}, 3000);
|
||||
}
|
||||
|
||||
function getGreeting() {
|
||||
const now = new Date();
|
||||
const hour = now.getHours();
|
||||
const day = now.getDay();
|
||||
const options = [];
|
||||
if (hour >= 5 && hour < 12) {
|
||||
options.push(
|
||||
{ text: 'Good morning, sunshine', iconClass: 'fa-regular fa-sun' },
|
||||
{ text: 'Here’s to a bright morning', iconClass: 'fa-regular fa-cloud-sun' },
|
||||
{ text: 'Morning vibes only', iconClass: 'fa-regular fa-mug-hot' },
|
||||
{ text: 'Your day starts here', iconClass: 'fa-regular fa-star' }
|
||||
);
|
||||
} else if (hour < 17) {
|
||||
options.push(
|
||||
{ text: 'Good afternoon', iconClass: 'fa-regular fa-leaf' },
|
||||
{ text: 'Hope your day is going well', iconClass: 'fa-regular fa-coffee' },
|
||||
{ text: 'Keep up the pace', iconClass: 'fa-regular fa-book' },
|
||||
{ text: 'Stay on track today', iconClass: 'fa-regular fa-sun' }
|
||||
);
|
||||
} else if (hour < 21) {
|
||||
options.push(
|
||||
{ text: 'Good evening', iconClass: 'fa-regular fa-cloud-moon' },
|
||||
{ text: 'Time to unwind', iconClass: 'fa-regular fa-fire' },
|
||||
{ text: 'Evening’s here—relax', iconClass: 'fa-regular fa-star' },
|
||||
{ text: 'Breathe and recharge', iconClass: 'fa-regular fa-moon' }
|
||||
);
|
||||
} else {
|
||||
options.push(
|
||||
{ text: 'Good night', iconClass: 'fa-regular fa-bed' },
|
||||
{ text: 'Rest well', iconClass: 'fa-regular fa-sleep' },
|
||||
{ text: 'Sweet dreams', iconClass: 'fa-regular fa-star-and-crescent' },
|
||||
{ text: 'See you tomorrow', iconClass: 'fa-regular fa-moon' }
|
||||
);
|
||||
}
|
||||
if (day === 4) {
|
||||
options.push(
|
||||
{ text: 'Thursday mode: engaged', iconClass: 'fa-regular fa-party-popper' },
|
||||
{ text: 'Almost Friday', iconClass: 'fa-regular fa-music' },
|
||||
{ text: 'Keep going', iconClass: 'fa-regular fa-thumbs-up' }
|
||||
);
|
||||
}
|
||||
if (day === 0 || day === 6) {
|
||||
options.push(
|
||||
{ text: 'Happy weekend', iconClass: 'fa-regular fa-umbrella-beach' },
|
||||
{ text: 'Enjoy some downtime', iconClass: 'fa-regular fa-cocktail' }
|
||||
);
|
||||
} else {
|
||||
options.push(
|
||||
{ text: 'You’ve got this', iconClass: 'fa-regular fa-hand-holding-heart' },
|
||||
{ text: 'One step at a time', iconClass: 'fa-regular fa-walking' },
|
||||
{ text: 'Summer is coming', iconClass: 'fa-regular fa-umbrella-beach' }
|
||||
);
|
||||
}
|
||||
return options[Math.floor(Math.random() * options.length)];
|
||||
}
|
Loading…
Reference in New Issue
Block a user