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=default"; var weather_url = "https://www.cotedesbasques.io/card-weather.php?lang=en&mode=default"; var tides_url = "https://www.cotedesbasques.io/card-tides.php?lang=en&mode=default"; var surf_url = "https://www.cotedesbasques.io/card-surf.php?lang=en&mode=default"; var aqi_url = "https://www.cotedesbasques.io/card-aqi.php?lang=en&mode=default"; var wqi_url = "https://www.cotedesbasques.io/card-wqi.php?lang=en&mode=default"; var vigilance_url = "https://www.cotedesbasques.io/card-vigilance.php?lang=en&mode=default"; console.log("Welcome to cotedesbasques.io!"); $('document').ready(function() { $('#radio').attr("src", "https://www.cotedesbasques.io/radio.php?lang=en&mode=default"); $('#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); }