Fixed greetings
This commit is contained in:
parent
b56bb5706a
commit
ea1acd1f9e
@ -1,11 +1,6 @@
|
||||
// Get the hour
|
||||
if (today === undefined) {
|
||||
const today = new Date();
|
||||
}
|
||||
|
||||
if (today === undefined) {
|
||||
const hour = today.getHours();
|
||||
}
|
||||
const today = new Date();
|
||||
const hour = today.getHours();
|
||||
|
||||
// Here you can change your name
|
||||
const name = 'John Doe';
|
||||
@ -20,11 +15,11 @@ const gree6 = 'Good evening ';
|
||||
|
||||
// Define the hours of the greetings
|
||||
if (hour >= 23 && hour < 5) {
|
||||
document.getElementById('greetings').innerText = gree1 + name;
|
||||
document.getElementById('greetings').innerText = gree1 + name;
|
||||
} else if (hour >= 6 && hour < 12) {
|
||||
document.getElementById('greetings').innerText = gree2 + name;
|
||||
document.getElementById('greetings').innerText = gree2 + name;
|
||||
} else if (hour >= 12 && hour < 17) {
|
||||
document.getElementById('greetings').innerText = gree3 + name;
|
||||
} else {
|
||||
document.getElementById('greetings').innerText = gree4 + name;
|
||||
document.getElementById('greetings').innerText = gree3 + name;
|
||||
} else {
|
||||
document.getElementById('greetings').innerText = gree4 + name;
|
||||
}
|
||||
|
32
js/theme.js
32
js/theme.js
@ -3,32 +3,32 @@ let darkTheme = localStorage.getItem('darkTheme');
|
||||
const themeToggle = document.querySelector('#themeButton');
|
||||
|
||||
const enableDark = () => {
|
||||
document.body.classList.add('darktheme');
|
||||
localStorage.setItem('darkTheme', 'enabled');
|
||||
themeToggle.innerHTML = `<i id="bicon" data-feather="moon"></i>`;
|
||||
feather.replace();
|
||||
document.body.classList.add('darktheme');
|
||||
localStorage.setItem('darkTheme', 'enabled');
|
||||
themeToggle.innerHTML = `<i id="bicon" data-feather="moon"></i>`;
|
||||
feather.replace();
|
||||
};
|
||||
|
||||
const disableDark = () => {
|
||||
document.body.classList.remove('darktheme');
|
||||
localStorage.setItem('darkTheme', null);
|
||||
themeToggle.innerHTML = `<i id="bicon" data-feather="sun"></i>`;
|
||||
feather.replace();
|
||||
document.body.classList.remove('darktheme');
|
||||
localStorage.setItem('darkTheme', null);
|
||||
themeToggle.innerHTML = `<i id="bicon" data-feather="sun"></i>`;
|
||||
feather.replace();
|
||||
};
|
||||
|
||||
if (darkTheme === 'enabled') {
|
||||
enableDark();
|
||||
enableDark();
|
||||
} else {
|
||||
disableDark();
|
||||
disableDark();
|
||||
}
|
||||
|
||||
themeToggle.addEventListener('click', () => {
|
||||
darkTheme = localStorage.getItem('darkTheme');
|
||||
if (darkTheme !== 'enabled') {
|
||||
enableDark();
|
||||
} else {
|
||||
disableDark();
|
||||
}
|
||||
darkTheme = localStorage.getItem('darkTheme');
|
||||
if (darkTheme !== 'enabled') {
|
||||
enableDark();
|
||||
} else {
|
||||
disableDark();
|
||||
}
|
||||
});
|
||||
|
||||
// Change the theme with the time
|
||||
|
70
js/time.js
70
js/time.js
@ -1,42 +1,42 @@
|
||||
window.onload = displayClock();
|
||||
function displayClock() {
|
||||
const monthNames = [
|
||||
'Jan',
|
||||
'Feb',
|
||||
'Mar',
|
||||
'Apr',
|
||||
'May',
|
||||
'Jun',
|
||||
'Jul',
|
||||
'Aug',
|
||||
'Sep',
|
||||
'Oct',
|
||||
'Nov',
|
||||
'Dec',
|
||||
];
|
||||
const monthNames = [
|
||||
'Jan',
|
||||
'Feb',
|
||||
'Mar',
|
||||
'Apr',
|
||||
'May',
|
||||
'Jun',
|
||||
'Jul',
|
||||
'Aug',
|
||||
'Sep',
|
||||
'Oct',
|
||||
'Nov',
|
||||
'Dec',
|
||||
];
|
||||
|
||||
// Set to true to use a 12 hour date format
|
||||
var format_12hour = false;
|
||||
// Set to true to use a 12 hour date format
|
||||
var format_12hour = false;
|
||||
|
||||
var d = new Date();
|
||||
var mm = monthNames[d.getMonth()];
|
||||
var dd = d.getDate();
|
||||
var min = (mins = ('0' + d.getMinutes()).slice(-2));
|
||||
var hh = d.getHours();
|
||||
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;
|
||||
var d = new Date();
|
||||
var mm = monthNames[d.getMonth()];
|
||||
var dd = d.getDate();
|
||||
var min = (mins = ('0' + d.getMinutes()).slice(-2));
|
||||
var hh = d.getHours();
|
||||
var ampm = '';
|
||||
|
||||
document.getElementById('month').innerText = mm;
|
||||
document.getElementById('day').innerText = dd;
|
||||
if (format_12hour) {
|
||||
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);
|
||||
}
|
||||
|
@ -5,7 +5,7 @@ const descElement = document.querySelector('.temperature-description p');
|
||||
// App data
|
||||
const weather = {};
|
||||
weather.temperature = {
|
||||
unit: 'celsius',
|
||||
unit: 'celsius',
|
||||
};
|
||||
|
||||
// Change to 'F' for Fahrenheit
|
||||
@ -19,39 +19,40 @@ const key = 'aa5b0a76dfbf87441928fb3cc32d3d25';
|
||||
setPosition();
|
||||
|
||||
function setPosition(position) {
|
||||
// Here you can change your position
|
||||
// You can use https://www.latlong.net/ to get it! (I use San Francisco as an example)
|
||||
let latitude = 37.774929;
|
||||
let longitude = -122.419418;
|
||||
// Here you can change your position
|
||||
// You can use https://www.latlong.net/ to get it! (I use San Francisco as an example)
|
||||
let latitude = 37.774929;
|
||||
let longitude = -122.419418;
|
||||
|
||||
getWeather(latitude, longitude);
|
||||
getWeather(latitude, longitude);
|
||||
}
|
||||
|
||||
// Get the Weather data
|
||||
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)
|
||||
.then(function (response) {
|
||||
let data = response.json();
|
||||
return data;
|
||||
})
|
||||
.then(function (data) {
|
||||
let celsius = Math.floor(data.main.temp - KELVIN);
|
||||
weather.temperature.value = (tempUnit == 'C') ? celsius : (celsius * 9/5) + 32;
|
||||
weather.description = data.weather[0].description;
|
||||
weather.iconId = data.weather[0].icon;
|
||||
})
|
||||
.then(function () {
|
||||
displayWeather();
|
||||
});
|
||||
fetch(api)
|
||||
.then(function (response) {
|
||||
let data = response.json();
|
||||
return data;
|
||||
})
|
||||
.then(function (data) {
|
||||
let celsius = Math.floor(data.main.temp - KELVIN);
|
||||
weather.temperature.value =
|
||||
tempUnit == 'C' ? celsius : (celsius * 9) / 5 + 32;
|
||||
weather.description = data.weather[0].description;
|
||||
weather.iconId = data.weather[0].icon;
|
||||
})
|
||||
.then(function () {
|
||||
displayWeather();
|
||||
});
|
||||
}
|
||||
|
||||
// Display Weather info
|
||||
function displayWeather() {
|
||||
iconElement.innerHTML = `<img src="icons/OneDark/${weather.iconId}.png"/>`;
|
||||
tempElement.innerHTML = `${weather.temperature.value}°<span class="darkfg">${tempUnit}</span>`;
|
||||
descElement.innerHTML = weather.description;
|
||||
iconElement.innerHTML = `<img src="icons/OneDark/${weather.iconId}.png"/>`;
|
||||
tempElement.innerHTML = `${weather.temperature.value}°<span class="darkfg">${tempUnit}</span>`;
|
||||
descElement.innerHTML = weather.description;
|
||||
}
|
||||
|
Loading…
x
Reference in New Issue
Block a user