var refresh = 1; // minutes
var refresh_timer = refresh * 60000;
var error_timer = refresh * 60000 / 10;
var logo_url = "https://www.cotedesbasques.io/card-logo.php?lang=en&mode=hastea";
var weather_url = "https://www.cotedesbasques.io/card-weather.php?lang=en&mode=hastea";
var tides_url = "https://www.cotedesbasques.io/card-tides.php?lang=en&mode=hastea";
var surf_url = "https://www.cotedesbasques.io/card-surf.php?lang=en&mode=hastea";
var aqi_url = "https://www.cotedesbasques.io/card-aqi.php?lang=en&mode=hastea";
var wqi_url = "https://www.cotedesbasques.io/card-wqi.php?lang=en&mode=hastea";
var vigilance_url = "https://www.cotedesbasques.io/card-vigilance.php?lang=en&mode=hastea";
console.log("Welcome to cotedesbasques.io!");

$('document').ready(function() {
  $('#radio').attr("src", "https://www.cotedesbasques.io/radio.php?lang=en&mode=hastea");
  $('#radio').attr("preload", "none");
  StartClock();
  tippy('[data-tippy-content]');
  tippy.delegate( '#menubar', {
    target: '[data-tippy-content]'
  } );
  tippy.delegate( '#weather', {
    target: '[data-tippy-content]'
  } );
  tippy.delegate( '#tide', {
    target: '[data-tippy-content]'
  } );
  tippy.delegate( '#surf', {
    target: '[data-tippy-content]'
  } );
  UpdateLogo();
  UpdateWeather();
  UpdateTide();
  UpdateSurf();
  UpdateAqi();
  UpdateWqi();
  UpdateVigilance();
});
$(document).ajaxComplete(function() {
  tippy('[data-tippy-content]');
});
function playradio() {
    $('#radioplay').toggle();
    $('#radiopause').toggle();
    $('#radio').get(0).play();
} 
function pauseradio() {
    $('#radiopause').toggle();
    $('#radioplay').toggle();
    $('#radio').get(0).pause();
    $('#radio').get(0).currentTime = 0;
}
function modal_about() {
    $('#modal_about').toggle();
}
function modal_aqi() {
    $('#modal_aqi').toggle();
} 

function UpdateLogo() {
    $.ajax({
      url:  logo_url + "&t=" + new Date().getTime(),
      success: function (result) {
        $('#logo').html(result);
        setTimeout(function () {
          UpdateLogo();
        }, refresh_timer * 10);
      },
      error: function () {
        setTimeout(() => {
          UpdateLogo()
        }, error_timer)
      }
    });
  }
function UpdateWeather() {
    $( "#weather-loader" ).show();
    console.log("Weather updating...");
    $.ajax({
      url:  weather_url + "&t=" + new Date().getTime(),
      success: function (result) {
        $('#weather').html(result);
        console.log("Weather OK");
        setTimeout(function () {
          UpdateWeather();
        }, refresh_timer * 2);
      },
      error: function () {
        console.log("Weather error, retrying...");
        setTimeout(() => {
          UpdateWeather()
        }, error_timer)
      }
    });
  }
  function UpdateTide() {
    $( "#tides-loader" ).show();
    console.log("Tides updating...");
    $.ajax({
      url: tides_url + "&t=" + new Date().getTime(),
      success: function (result) {
        console.log("Tides OK");
        $('#tide').html(result);
        setTimeout(function () {
          UpdateTide();
        }, refresh_timer * 2);
      },
      error: function () {
        console.log("Tides error, retrying...");
        setTimeout(() => {
          UpdateTide()
        }, error_timer)
      }
    });
  }
  function UpdateSurf() {
    $( "#surf-loader" ).show();
    console.log("Surf updating...");
    $.ajax({
      url: surf_url + "&t=" + new Date().getTime(),
      success: function (result) {
        console.log("Surf OK");
        $('#surf').html(result);
        setTimeout(function () {
          UpdateSurf();
        }, refresh_timer * 5);
      },
      error: function () {
        console.log("Surf error, retrying...");
        setTimeout(() => {
          UpdateSurf()
        }, error_timer)
      }
    });
  }
  function UpdateAqi() {
    console.log("AQI updating...");
    $.ajax({
      url: aqi_url + "&t=" + new Date().getTime(),
      success: function (result) {
        console.log("AQI OK");
        $('#aqi').html(result);
        setTimeout(function () {
          UpdateAqi();
        }, refresh_timer * 11);
      },
      error: function () {
        console.log("AQI error, retrying...");
        setTimeout(() => {
          UpdateAqi()
        }, error_timer)
      }
    });
  }
  function UpdateWqi() {
    console.log("WQI updating...");
    $.ajax({
      url: wqi_url + "&t=" + new Date().getTime(),
      success: function (result) {
        console.log("WQI OK");
        $('#wqi').html(result);
        setTimeout(function () {
          UpdateWqi();
        }, refresh_timer * 13);
      },
      error: function () {
        console.log("WQI error, retrying...");
        setTimeout(() => {
          UpdateWqi()
        }, error_timer)
      }
    });
  }
  function UpdateVigilance() {
    console.log("Vigilance updating...");
    $.ajax({
      url: vigilance_url + "&t=" + new Date().getTime(),
      success: function (result) {
        console.log("Vigilance OK");
        $('#vigilance').html(result);
        setTimeout(function () {
          UpdateVigilance();
        }, refresh_timer * 15);
      },
      error: function () {
        console.log("Vigilance error, retrying...");
        setTimeout(() => {
          UpdateVigilance()
        }, error_timer)
      }
    });
  }
var clockID,
    yourTimeZoneFrom = 1,
    d = new Date(),
    tzDifference = 60 * yourTimeZoneFrom + d.getTimezoneOffset(),
    offset = 60 * tzDifference * 1e3;
function UpdateClock() {
  var tDate = new Date(new Date().getTime() + offset);
  var in_hours = tDate.getHours();
  var in_minutes = tDate.getMinutes();
  
  if (in_minutes < 10)
    in_minutes = '0' + in_minutes;
  if (in_hours < 10)
    in_hours = '0' + in_hours;
	
  r(min, 6*in_minutes);
	r(hour, 30*(in_hours%12) + in_minutes/2);
	function r(el, deg) {
		el.setAttribute('transform', 'rotate('+ deg +' 50 50)')
	}
  $("#clock-text").html(in_hours + ':' + in_minutes);
}
function StartClock() {
    clockID = setInterval(UpdateClock, 500);
}
function KillClock() {
    clearTimeout(clockID);
}