Weather app changing pictures?

JavaScript
26

No
Not the pictures, but the background color change and the icon returned from the server is assigned to the placeholder correctly

27

My weather icons donā€™t show up with that code.

28

I only have your codepen code to play withā€¦
Dunno what pictures you are trying to displayā€¦

29

Canā€™t you copy the code into an IDE and check? Thanks for helping me, though.

31

Currently, yes. Sorry for the yellow as a warmer color, itā€™s too vibrant but I will fix tomorrow.

EDIT: Sorry for the late reply. I really appreciate all the help.

32

Also, trying to find a way to search for any city and set the weather to that location. I know in the Docs it shows city name e.g.: q=Paris.

So, I tried a string literal inside of the API call after q= and couldnā€™t get it to work.

34

I will try to work on what you just told me. Yes, the images do NOT work when I use that code. Stressing a bit at this point to get it all done. And for the cities, Iā€™m trying to search any city in the world and have the weather show up. There has gotta be an easier way of using the same API string and searching all the cities without making an array of every city in the world.

Wow, that string literal change worked wonderfully. Thank you!!

36

30%20AM
30%20AM944Ɨ400 30.7 KB

38

Thanks so much I got it to work!

40

I donā€™t believe I would. I looked through the docs and tried a string literal to add to my API with the input value of the searchbar.

42

Up top I declared searchbar and put the string literal in the API. You understand what Iā€™m trying to achieve here, right? Just search for the city and put the weather info up.

44

This is the current, the city comes up but the problem is it isnā€™t going through the for loop again to append the weather of that city.

EDIT: Just trying to clear the conditions and forecast and then re-append it once the search goes through.

46

Got it to work hereā€¦thank you again!

Will have to add a bit of things like a local weather button, and stying for the input form. :slight_smile:

47

Also, having trouble with having it switch to celsius depending on the location and the colors of the background.

49

I think all the functionality works when the location is in US, but breaks if it is elsewhere. It definitely has to do with

    //Append current location
    let location = document.getElementById(`location`)
    if (country === `United States of America`) {
      country = `US`
      //Set default to fahrenheit, gray out celsius
      temp.innerText = fahrenheit + `Āŗ`
      degTypeF.classList.add(`on`)
      degTypeC.classList.add(`off`)
    } else {
      temp.innerText = celsius + `Āŗ`
      degTypeF.classList.add(`off`)
      degTypeC.classList.add(`on`)
    }
    location.innerText = curLocation + `, ` + country
51

Updated, but havenā€™t fixed Wind kph yet.

52

So, when I open up the app it is reading as fahrenheit in the US. When I search for Paris for example, it shows Celsius properly, and then when I search for example: Phoenix, AZ, it breaks the toggling back to fahrenheit. I know it has to do with something in the for loop. But that is the current problem I am on.

54

Itā€™s giving me an absolute headache because this is essentially the last part of the functionality I need to solve.

56

Absolutely, please help with this. I understand the isImperial/Metric boolean is a great way to go about it, but I am very unsure how to start it.

EDIT: Another bug I have found is that the colors arenā€™t really working properly when it comes to celsius. Iā€™m only really checking for fahrenheit it seems like.

58

Finally got it to work. Had to refactor a whole bunch of stuff, but I got the event listeners out of the loop. My next one to attack is the colors depending on celsius as well.