Local Weather App Help

Local Weather App Help
0

#1

I know that my code is clunky (I’m still new to this), but I am trying to get the Celcius/Farenheit conversion to work correctly. It works whenever I load the page and execute the code. When searching for a city, the code doesn’t execute correctly and it converts the temperature as though it is Celcius when Farenheit. Any pointers? Here is the link to my CodePen.

http://codepen.io/christopheredwardkoch/pen/rLKJRY?editors=0010


#2

:sweat_smile:

I’m not entirely certain what the problem is, but it has to do with the logic you’re using to switch between calculating fahrenheit and celsius. We don’t need to debug, though. Instead of relying on some HTML that you have to pull, try setting a variable in your JavaScript. I’d suggest using a boolean value, var celsius = false or whatever to start. Then you can switch it when you recalculate the temperatures.


#3

hi, u check wheter “#converted” is changed:

 var convertText = document.getElementById('converted').innerHTML;
if (convertText.indexOf("Celcius") > 0)

but u change “.convert”
$(".convert").html("Convert to Farenheit");

Also i can’t scroll down to enter city, so u may want this to put in .centered:
.centered {
background-color: white;
opacity: 0.7;
padding: 5%;

  width: 50%; 
  margin: 0 auto; // 0 is for top/bottom and auto is for left/right sides
  
}

And also u will get on speed if u simply use this fact:

1 degree Celsius =33.8 degrees Fahrenheit

And u may cache it when u pull data from api in two variables one for celsius, and other for fahrenheit so u don’t compute it every time

Also your background-image doesn’t fit whole screen so u may want to move your code from body to html tag in css, cause html height is always big as viewport of browser

also u may want to take look to this: