added проверка на пустую строку

This commit is contained in:
Sergey Yarkov 2019-09-21 18:59:56 +03:00
parent ebe715640d
commit 01f8197b22

104
js/app.js
View File

@ -1,62 +1,68 @@
'use strict';
function weatherInfo() { function weatherInfo() {
document.querySelector('#search-btn').onclick = () => { document.querySelector('#search-btn').onclick = () => {
// запрос // запрос
const searchValue = document.querySelector('#search-area').value; const searchValue = document.querySelector('#search-area').value;
const request = `http://api.openweathermap.org/data/2.5/weather?q=${searchValue}&appid=32dda4a23cf5093afca2f2f086c16833`; const request = `http://api.openweathermap.org/data/2.5/weather?q=${searchValue}&appid=32dda4a23cf5093afca2f2f086c16833`;
// обработчик if (searchValue.trim() != '') {
function showData(data) { // обработчик
const weatherCard = document.querySelector('.weather-card'), function showData(data) {
titleCard = document.querySelector('.title-description'), const weatherCard = document.querySelector('.weather-card'),
titleData = document.querySelector('.weather-card__title h2'), titleCard = document.querySelector('.title-description'),
tempData = document.querySelector('.weather-card__temp p'), titleData = document.querySelector('.weather-card__title h2'),
descData = document.querySelector('.weather-card__description p'), tempData = document.querySelector('.weather-card__temp p'),
dataImg = document.querySelector('.weather-card__img'), descData = document.querySelector('.weather-card__description p'),
dataWind = document.querySelector('.weather-card__wind p'), dataImg = document.querySelector('.weather-card__img'),
dataHumidity = document.querySelector('.weather-card__humidity p'); dataWind = document.querySelector('.weather-card__wind p'),
dataHumidity = document.querySelector('.weather-card__humidity p');
// перевод слов на русский // перевод слов на русский
switch (data.weather[0].description) { switch (data.weather[0].description) {
case 'light rain': case 'light rain':
data.weather[0].description = 'легкий дождь' data.weather[0].description = 'легкий дождь';
break; break;
case 'clear sky': case 'clear sky':
data.weather[0].description = 'чистое небо' data.weather[0].description = 'чистое небо';
break; break;
case 'scattered clouds': case 'scattered clouds':
data.weather[0].description = 'рассеянные облака' data.weather[0].description = 'рассеянные облака';
break; break;
case 'broken clouds': case 'broken clouds':
data.weather[0].description = 'облачность' data.weather[0].description = 'облачность';
break; break;
case 'haze': case 'haze':
data.weather[0].description = 'туман' data.weather[0].description = 'туман';
break; break;
default: default:
break; break;
}
weatherCard.style.display = 'block';
titleCard.style.display = 'block';
titleData.textContent = `${data.name}, ${data.sys.country}`;
tempData.innerHTML = Math.round(data.main.temp - 273) + '&deg C';
descData.textContent = data.weather[0].description;
dataImg.innerHTML = `<img src="http://openweathermap.org/img/wn/${data.weather[0].icon}@2x.png" alt="">`;
dataWind.textContent = `Скорость ветра: ${data.wind.speed}м/c`;
dataHumidity.textContent = `Влажность: ${data.main.humidity}%`;
} }
weatherCard.style.display = 'block'; // вывод
titleCard.style.display = 'block'; fetch(request)
titleData.textContent = `${data.name}, ${data.sys.country}`; .then(function (resp) {
tempData.innerHTML = Math.round(data.main.temp - 273) + '&deg C'; return resp.json();
descData.textContent = data.weather[0].description; })
dataImg.innerHTML = `<img src="http://openweathermap.org/img/wn/${data.weather[0].icon}@2x.png" alt="">`; .then(function (data) {
dataWind.textContent = `Скорость ветра: ${data.wind.speed}м/c`; showData(data);
dataHumidity.textContent = `Влажность: ${data.main.humidity}%`; })
.catch(function () {
alert('Город не найден!');
});
} else {
alert('Введите город!');
} }
};
// вывод
fetch(request)
.then(function (resp) {
return resp.json();
})
.then(function (data) {
showData(data);
})
.catch(function () {
alert('Город не найден!');
})
}
} }
weatherInfo(); weatherInfo();