Skip to content

Commit 71c04f6

Browse files
JustinWebDevJustinWebDev
committed
change innterHTML to innerText
1 parent 590408e commit 71c04f6

File tree

1 file changed

+87
-89
lines changed

1 file changed

+87
-89
lines changed

‎js/wmain.js

Lines changed: 87 additions & 89 deletions
Original file line numberDiff line numberDiff line change
@@ -3,117 +3,115 @@
33

44
let weatherConditions = new XMLHttpRequest();
55
let weatherForecast = new XMLHttpRequest();
6-
let wCond; //conditions
7-
let fObj; //forecast
6+
let wCond; //conditions JSON obj
7+
let fObj; //forecast JSON object
88

9-
document.getElementById('zip').value ="";
9+
document.getElementById('zip').value = "";
1010

1111
function loadWeather() {
1212
let zip = document.getElementById('zip').value;
13-
if (zip === '') {zip = "35810"}
14-
const conditionsPath = "https://api.openweathermap.org/data/2.5/weather?zip="+zip+",us&units=imperial&APPID=8c6405207db6b6fe115ac161f770cd31";
15-
const forecastPath = "https://api.openweathermap.org/data/2.5/forecast?zip=" + zip + ",us&units=imperial&cnt=17&APPID=8c6405207db6b6fe115ac161f770cd31";
13+
if (zip === '') { zip = "35810" } // default zipcode
14+
const conditionsPath = `https://api.openweathermap.org/data/2.5/weather?zip=${zip},us&units=imperial&APPID=8c6405207db6b6fe115ac161f770cd31`;
15+
const forecastPath = `https://api.openweathermap.org/data/2.5/forecast?zip=${zip},us&units=imperial&cnt=17&APPID=8c6405207db6b6fe115ac161f770cd31`;
1616

1717
// GET THE CONDITIONS
1818
weatherConditions.open('get', conditionsPath, true);
1919
//weatherConditions.responseType = '';
2020
weatherConditions.send(null);
2121

2222
// GET THE FORECAST
23-
console.log("TEST for json");
2423
weatherForecast.open('GET', forecastPath, true);
2524
//weatherForecast.responseType = '';
2625
weatherForecast.send();
2726
}
2827

29-
weatherConditions.onload = function() {
30-
if (weatherConditions.status === 200) {
31-
wCond = JSON.parse(weatherConditions.responseText);
32-
console.log(wCond);
33-
document.getElementById('location').innerText = wCond.name;
34-
const iconcode = wCond.weather[0].icon;
35-
console.log("GOT icon = "+ iconcode);
36-
const iconpath = "https://openweathermap.org/img/w/"+iconcode+".png";
37-
console.log(iconpath);
38-
document.getElementById('wcicon').src = iconpath;
39-
// document.getElementById('wcicon').innerHTML = "<img src=\"https://openweathermap.org/img/w/"+wCond.weather[0].icon+".png\">";
40-
// https://openweathermap.org/weather-conditions <img src="https://openweathermap.org/img/w/10d.png">
41-
let weatherCond = "";
42-
for (let i=0; i < wCond.weather.length; i++) {
43-
weatherCond += wCond.weather[i].main;
44-
if (i !== wCond.weather.length-1){
45-
weatherCond += ", ";}
46-
}
47-
document.getElementById('weather').innerText = weatherCond;
48-
document.getElementById('temperature').innerText = Math.round(wCond.main.temp);
49-
document.getElementById('windspeed').innerText = wCond.wind.speed.toFixed();
50-
let weatherDesc = "";
51-
for (let i=0; i < wCond.weather.length; i++) {
52-
weatherDesc += wCond.weather[i].description;
53-
if (i !== wCond.weather.length-1){
54-
weatherDesc += ", ";}
55-
}
56-
document.getElementById('desc').innerText = weatherDesc;
57-
//document.getElementById('radar').src = 'https://tile.openweathermap.org/map/precipitation_new/4/6/10.png?appid=8c6405207db6b6fe115ac161f770cd31' // for radar div
58-
} //end if
28+
weatherConditions.onload = function () {
29+
if (weatherConditions.status === 200) {
30+
wCond = JSON.parse(weatherConditions.responseText);
31+
console.log(wCond);
32+
document.getElementById('location').innerText = wCond.name;
33+
const iconcode = wCond.weather[0].icon;
34+
console.log("GOT icon = " + iconcode);
35+
const iconpath = "https://openweathermap.org/img/w/" + iconcode + ".png";
36+
console.log(iconpath);
37+
document.getElementById('wcicon').src = iconpath;
38+
// document.getElementById('wcicon').innerHTML = "<img src=\"https://openweathermap.org/img/w/"+wCond.weather[0].icon+".png\">";
39+
// https://openweathermap.org/weather-conditions <img src="https://openweathermap.org/img/w/10d.png">
40+
let weatherCond = "";
41+
for (let i = 0; i < wCond.weather.length; i++) {
42+
weatherCond += wCond.weather[i].main;
43+
if (i !== wCond.weather.length - 1) {
44+
weatherCond += ", ";
45+
}
46+
}
47+
document.getElementById('weather').innerText = weatherCond;
48+
document.getElementById('temperature').innerText = Math.round(wCond.main.temp);
49+
document.getElementById('windspeed').innerText = wCond.wind.speed.toFixed();
50+
let weatherDesc = "";
51+
for (let i = 0; i < wCond.weather.length; i++) {
52+
weatherDesc += wCond.weather[i].description;
53+
if (i !== wCond.weather.length - 1) {
54+
weatherDesc += ", ";
55+
}
56+
}
57+
document.getElementById('desc').innerText = weatherDesc;
58+
//document.getElementById('radar').src = 'https://tile.openweathermap.org/map/precipitation_new/4/6/10.png?appid=8c6405207db6b6fe115ac161f770cd31' // for radar div
59+
} //end if
5960
}; //end function
6061

6162

62-
weatherForecast.onload = function() {
63-
if (weatherForecast.status === 200){
64-
fObj = JSON.parse(weatherForecast.responseText);
65-
console.log(fObj);
66-
// day 1
67-
const d1 = new Date();
68-
const dayWeek = d1.getDay(); console.log(`day is ${dayWeek}`);
69-
const weekday = [];
70-
weekday[0] = "Sunday";
71-
weekday[1] = "Monday";
72-
weekday[2] = "Tuesday";
73-
weekday[3] = "Wednesday";
74-
weekday[4] = "Thursday";
75-
weekday[5] = "Friday";
76-
weekday[6] = "Saturday";
77-
const day1 = weekday[dayWeek]; console.log(`day1 is ${day1}`);
78-
let day2, day3;
79-
document.getElementById('r1c1').innerHTML = day1;
80-
document.getElementById('r1c3').innerHTML = Math.round(fObj.list[0].main.temp)+"&deg;";
81-
document.getElementById('r1c2').src = "https://openweathermap.org/img/w/"+fObj.list[0].weather[0].icon+".png";
82-
document.getElementById('r1c2').alt = fObj.list[0].weather[0].description;
83-
document.getElementById('r1c2').title = fObj.list[0].weather[0].main;
63+
weatherForecast.onload = function () {
64+
if (weatherForecast.status === 200) {
65+
fObj = JSON.parse(weatherForecast.responseText);
66+
console.log(fObj);
67+
// day 1
68+
const d1 = new Date();
69+
const dayWeek = d1.getDay(); console.log(`day is ${dayWeek}`);
70+
const weekday = [];
71+
weekday[0] = "Sunday";
72+
weekday[1] = "Monday";
73+
weekday[2] = "Tuesday";
74+
weekday[3] = "Wednesday";
75+
weekday[4] = "Thursday";
76+
weekday[5] = "Friday";
77+
weekday[6] = "Saturday";
78+
const day1 = weekday[dayWeek]; console.log(`day1 is ${day1}`);
79+
let day2, day3;
80+
document.getElementById('r1c1').innerText = day1;
81+
document.getElementById('r1c3').innerText = Math.round(fObj.list[0].main.temp) + "&deg;";
82+
document.getElementById('r1c2').src = "https://openweathermap.org/img/w/" + fObj.list[0].weather[0].icon + ".png";
83+
document.getElementById('r1c2').alt = fObj.list[0].weather[0].description;
84+
document.getElementById('r1c2').title = fObj.list[0].weather[0].main;
8485

85-
// day 2
86-
if (dayWeek === 6) {
87-
day2 = weekday[0];
88-
}
89-
else {
90-
day2 = weekday[dayWeek+1];
91-
}
92-
console.log(`day2 is ${day2}`);
93-
document.getElementById('r2c1').innerHTML = day2;
94-
document.getElementById('r2c3').innerHTML = Math.round(fObj.list[8].main.temp)+"&deg;";
95-
document.getElementById('r2c2').src = "https://openweathermap.org/img/w/"+fObj.list[8].weather[0].icon+".png";
96-
document.getElementById('r2c2').alt = fObj.list[8].weather[0].description;
97-
document.getElementById('r2c2').title = fObj.list[8].weather[0].main;
86+
// day 2
87+
if (dayWeek === 6) {
88+
day2 = weekday[0];
89+
} else {
90+
day2 = weekday[dayWeek + 1];
91+
}
92+
console.log(`day2 is ${day2}`);
93+
document.getElementById('r2c1').innerText = day2;
94+
document.getElementById('r2c3').innerText = Math.round(fObj.list[8].main.temp) + "&deg;";
95+
document.getElementById('r2c2').src = "https://openweathermap.org/img/w/" + fObj.list[8].weather[0].icon + ".png";
96+
document.getElementById('r2c2').alt = fObj.list[8].weather[0].description;
97+
document.getElementById('r2c2').title = fObj.list[8].weather[0].main;
9898

99-
// day 3
100-
if (dayWeek === 5) {
101-
day3 = weekday[0];
102-
}
103-
else if (dayWeek === 6) {
104-
day3 = weekday[1];
105-
}
106-
else {
107-
day3 = weekday[dayWeek+2];
108-
}
109-
console.log(`day3 is ${day3}`);
110-
document.getElementById('r3c1').innerHTML = day3;
111-
document.getElementById('r3c3').innerHTML = Math.round(fObj.list[16].main.temp)+"&deg;";
112-
document.getElementById('r3c2').src = "https://openweathermap.org/img/w/"+fObj.list[16].weather[0].icon+".png";
113-
document.getElementById('r3c2').alt = fObj.list[16].weather[0].description;
114-
document.getElementById('r3c2').title = fObj.list[16].weather[0].main;
99+
// day 3
100+
if (dayWeek === 5) {
101+
day3 = weekday[0];
102+
} else if (dayWeek === 6) {
103+
day3 = weekday[1];
104+
} else {
105+
day3 = weekday[dayWeek + 2];
106+
}
107+
console.log(`day3 is ${day3}`);
108+
document.getElementById('r3c1').innerHTML = day3;
109+
document.getElementById('r3c3').innerHTML = Math.round(fObj.list[16].main.temp) + "&deg;";
110+
document.getElementById('r3c2').src = "https://openweathermap.org/img/w/" + fObj.list[16].weather[0].icon + ".png";
111+
document.getElementById('r3c2').alt = fObj.list[16].weather[0].description;
112+
document.getElementById('r3c2').title = fObj.list[16].weather[0].main;
115113

116-
} //end if
114+
} //end if
117115
}; //end function
118116

119117
loadWeather();

0 commit comments

Comments
 (0)