Fixed greetings

This commit is contained in:
Miguel R. Ávila 2021-01-03 20:54:21 -06:00
parent b56bb5706a
commit ea1acd1f9e
4 changed files with 84 additions and 88 deletions

View File

@ -1,11 +1,6 @@
// Get the hour // Get the hour
if (today === undefined) { const today = new Date();
const today = new Date(); const hour = today.getHours();
}
if (today === undefined) {
const hour = today.getHours();
}
// Here you can change your name // Here you can change your name
const name = 'John Doe'; const name = 'John Doe';
@ -20,11 +15,11 @@ const gree6 = 'Good evening ';
// Define the hours of the greetings // Define the hours of the greetings
if (hour >= 23 && hour < 5) { if (hour >= 23 && hour < 5) {
document.getElementById('greetings').innerText = gree1 + name; document.getElementById('greetings').innerText = gree1 + name;
} else if (hour >= 6 && hour < 12) { } else if (hour >= 6 && hour < 12) {
document.getElementById('greetings').innerText = gree2 + name; document.getElementById('greetings').innerText = gree2 + name;
} else if (hour >= 12 && hour < 17) { } else if (hour >= 12 && hour < 17) {
document.getElementById('greetings').innerText = gree3 + name; document.getElementById('greetings').innerText = gree3 + name;
} else { } else {
document.getElementById('greetings').innerText = gree4 + name; document.getElementById('greetings').innerText = gree4 + name;
} }

View File

@ -3,32 +3,32 @@ let darkTheme = localStorage.getItem('darkTheme');
const themeToggle = document.querySelector('#themeButton'); const themeToggle = document.querySelector('#themeButton');
const enableDark = () => { const enableDark = () => {
document.body.classList.add('darktheme'); document.body.classList.add('darktheme');
localStorage.setItem('darkTheme', 'enabled'); localStorage.setItem('darkTheme', 'enabled');
themeToggle.innerHTML = `<i id="bicon" data-feather="moon"></i>`; themeToggle.innerHTML = `<i id="bicon" data-feather="moon"></i>`;
feather.replace(); feather.replace();
}; };
const disableDark = () => { const disableDark = () => {
document.body.classList.remove('darktheme'); document.body.classList.remove('darktheme');
localStorage.setItem('darkTheme', null); localStorage.setItem('darkTheme', null);
themeToggle.innerHTML = `<i id="bicon" data-feather="sun"></i>`; themeToggle.innerHTML = `<i id="bicon" data-feather="sun"></i>`;
feather.replace(); feather.replace();
}; };
if (darkTheme === 'enabled') { if (darkTheme === 'enabled') {
enableDark(); enableDark();
} else { } else {
disableDark(); disableDark();
} }
themeToggle.addEventListener('click', () => { themeToggle.addEventListener('click', () => {
darkTheme = localStorage.getItem('darkTheme'); darkTheme = localStorage.getItem('darkTheme');
if (darkTheme !== 'enabled') { if (darkTheme !== 'enabled') {
enableDark(); enableDark();
} else { } else {
disableDark(); disableDark();
} }
}); });
// Change the theme with the time // Change the theme with the time

View File

@ -1,42 +1,42 @@
window.onload = displayClock(); window.onload = displayClock();
function displayClock() { function displayClock() {
const monthNames = [ const monthNames = [
'Jan', 'Jan',
'Feb', 'Feb',
'Mar', 'Mar',
'Apr', 'Apr',
'May', 'May',
'Jun', 'Jun',
'Jul', 'Jul',
'Aug', 'Aug',
'Sep', 'Sep',
'Oct', 'Oct',
'Nov', 'Nov',
'Dec', 'Dec',
]; ];
// Set to true to use a 12 hour date format // Set to true to use a 12 hour date format
var format_12hour = false; var format_12hour = false;
var d = new Date(); var d = new Date();
var mm = monthNames[d.getMonth()]; var mm = monthNames[d.getMonth()];
var dd = d.getDate(); var dd = d.getDate();
var min = (mins = ('0' + d.getMinutes()).slice(-2)); var min = (mins = ('0' + d.getMinutes()).slice(-2));
var hh = d.getHours(); var hh = d.getHours();
var ampm = ''; var ampm = '';
if (format_12hour) {
ampm = hh >= 12 ? ' pm' : ' am';
hh = hh % 12;
hh = hh ? hh : 12; //show mod 0 as 12
}
document.getElementById('hour').innerText = hh;
document.getElementById('separator').innerHTML = ' : ';
document.getElementById('minutes').innerText = min + ampm;
document.getElementById('month').innerText = mm; if (format_12hour) {
document.getElementById('day').innerText = dd; ampm = hh >= 12 ? ' pm' : ' am';
hh = hh % 12;
hh = hh ? hh : 12; //show mod 0 as 12
}
setTimeout(displayClock, 1000); document.getElementById('hour').innerText = hh;
document.getElementById('separator').innerHTML = ' : ';
document.getElementById('minutes').innerText = min + ampm;
document.getElementById('month').innerText = mm;
document.getElementById('day').innerText = dd;
setTimeout(displayClock, 1000);
} }

View File

@ -5,7 +5,7 @@ const descElement = document.querySelector('.temperature-description p');
// App data // App data
const weather = {}; const weather = {};
weather.temperature = { weather.temperature = {
unit: 'celsius', unit: 'celsius',
}; };
// Change to 'F' for Fahrenheit // Change to 'F' for Fahrenheit
@ -19,39 +19,40 @@ const key = 'aa5b0a76dfbf87441928fb3cc32d3d25';
setPosition(); setPosition();
function setPosition(position) { function setPosition(position) {
// Here you can change your position // Here you can change your position
// You can use https://www.latlong.net/ to get it! (I use San Francisco as an example) // You can use https://www.latlong.net/ to get it! (I use San Francisco as an example)
let latitude = 37.774929; let latitude = 37.774929;
let longitude = -122.419418; let longitude = -122.419418;
getWeather(latitude, longitude); getWeather(latitude, longitude);
} }
// Get the Weather data // Get the Weather data
function getWeather(latitude, longitude) { function getWeather(latitude, longitude) {
let api = `https://api.openweathermap.org/data/2.5/weather?lat=${latitude}&lon=${longitude}&appid=${key}`; let api = `https://api.openweathermap.org/data/2.5/weather?lat=${latitude}&lon=${longitude}&appid=${key}`;
console.log(api); console.log(api);
fetch(api) fetch(api)
.then(function (response) { .then(function (response) {
let data = response.json(); let data = response.json();
return data; return data;
}) })
.then(function (data) { .then(function (data) {
let celsius = Math.floor(data.main.temp - KELVIN); let celsius = Math.floor(data.main.temp - KELVIN);
weather.temperature.value = (tempUnit == 'C') ? celsius : (celsius * 9/5) + 32; weather.temperature.value =
weather.description = data.weather[0].description; tempUnit == 'C' ? celsius : (celsius * 9) / 5 + 32;
weather.iconId = data.weather[0].icon; weather.description = data.weather[0].description;
}) weather.iconId = data.weather[0].icon;
.then(function () { })
displayWeather(); .then(function () {
}); displayWeather();
});
} }
// Display Weather info // Display Weather info
function displayWeather() { function displayWeather() {
iconElement.innerHTML = `<img src="icons/OneDark/${weather.iconId}.png"/>`; iconElement.innerHTML = `<img src="icons/OneDark/${weather.iconId}.png"/>`;
tempElement.innerHTML = `${weather.temperature.value}°<span class="darkfg">${tempUnit}</span>`; tempElement.innerHTML = `${weather.temperature.value}°<span class="darkfg">${tempUnit}</span>`;
descElement.innerHTML = weather.description; descElement.innerHTML = weather.description;
} }