$(document).ready(function() {
$( "#getWeather" ).click(function() {
	tryToGetLocation();
});

var APP_ID = "3abdc25e06a9753f60cafd4efa793ba3";
var API_DATA={};
  var Celsius_Result=0;
  
  
   $('body').on('click', '#getTemp', function() {
    convertFtoC();
  });
  
  
  $('body').on('click', '#getMoreTemp', function() {
    convertCtoF();
  });

  
function success(position) {
	console.log('position',position);
	var latitude = position.coords.latitude;
	var longitude = position.coords.longitude;
	getData( latitude, longitude );
};

function error(error) {
	console.log('error',error);
	alert(error.message);
};

var options = {
	maximumAge: 50000,
	enableHighAccuracy: true
}

var tryToGetLocation = function() {
	if ( navigator.geolocation ) {
		navigator.geolocation.getCurrentPosition( success, error, options);
	} else {
		alert("Geolocation is disabled, please enable it");
	}
};


function getData( latitude, longitude ) {
	$.getJSON("https://crossorigin.me/http://api.openweathermap.org/data/2.5/weather?lat=" + latitude + "&lon="+ longitude + "&APPID=" + APP_ID + "&callback=", callbackFuncWithData);
}

function callbackFuncWithData(data) {
  API_DATA=data;
	console.log("data",data);
	$("#city").html("<span class='myclass'>City:"  + data.name+"</span>"
  );
  $("#temp").html("Temperature: "+data.main.temp);
  $("#temp").append('<button class="button" id="getTemp"> &deg;F</button>');
  
	$("#weather").html("<span class='myclass'>Weather: " + data.main.weather +"</span");
}
  //Update Weather animation based on the returned weather description
   
var convertFtoC=function(){
  var Celsius=(API_DATA.main.temp-32)/(9/5);Celsius_Result=Celsius.toFixed(2);
  $("#temp").html("Temperature: "+Celsius.toFixed(2)+'<button class="button" id="getMoreTemp"> &deg;C</button>')};


var convertCtoF=function(){
  var Fahrenheit=(Celsius_Result*(9/5))+32;
  $("#temp").html("Temperature: "+Fahrenheit.toFixed(2)+'<button class="button" id="getTemp"> &deg;F</button>');}




});