Logic Machine Forum
javascript daily URL change - Printable Version

+- Logic Machine Forum (https://forum.logicmachine.net)
+-- Forum: LogicMachine eco-system (https://forum.logicmachine.net/forumdisplay.php?fid=1)
+--- Forum: Visualization (https://forum.logicmachine.net/forumdisplay.php?fid=9)
+--- Thread: javascript daily URL change (/showthread.php?tid=5332)



javascript daily URL change - sgraystar - 02.04.2024

I have a widget that loads multiple iFrames showing weather info and one of them has the format https://<base_url>/#dYYYY-MM-DD

I can use the dynamic url examples from the forum to use a virtual group to trigger the changing url, but calculation of the string is simple in javascript and I would prefer to have things done in one place.

How do do I apply the src change every time this widget/iFrame is loaded without using a virtual group?

This works:

Code:
$(function(){
  if (typeof grp != 'undefined') {
    grp.listen('0/250/247', function(object) {
      let d = new Date();
      let forecastDate = d.getFullYear() + '-' + ('0' + (d.getMonth() + 1)).slice(-2) + '-' + ('0' + d.getDate()).slice(-2);
      $('.hourlyforecastbak').find('iframe').attr('src','https://reg.bom.gov.au/places/vic/melbourne/forecast/detailed/#d' + forecastDate);
    }, true);
  }
});

Attempt that does not work:

Code:
$(function(){
  $('iframe').load(function() {
    let d = new Date();
    let forecastDate = d.getFullYear() + '-' + ('0' + (d.getMonth() + 1)).slice(-2) + '-' + ('0' + d.getDate()).slice(-2);
    $('.hourlyforecast').find('iframe').attr('src','https://reg.bom.gov.au/places/vic/melbourne/forecast/detailed/#d' + forecastDate);
  }, true);
});



RE: javascript daily URL change - admin - 03.04.2024

Try this:
Code:
$(function() {
  $('iframe').one('load', function() {
    let forecastDate = (new Date()).toISOString().split('T')[0];
    this.src = 'https://reg.bom.gov.au/places/vic/melbourne/forecast/detailed/#d' + forecastDate;
  });
});



RE: javascript daily URL change - sgraystar - 04.04.2024

Thanks, that works but I don't understand why it did not change every iFrame?

The code below is working.
I kept the search for .hourlyforecast but perhaps there is a more elegant way of specifying the wanted class or Custom name in the load event.
The forecastDate string is to get the local time instead of UTC.

Code:
$(function() {
  $('iframe').one('load', function() {
    let d = new Date();
    let forecastDate = d.getFullYear() + '-' + ('0' + (d.getMonth() + 1)).slice(-2) + '-' + ('0' + d.getDate()).slice(-2);
    $('.hourlyforecast').find('iframe').attr('src','https://reg.bom.gov.au/places/vic/melbourne/forecast/detailed/#d' + forecastDate);
  });
});



RE: javascript daily URL change - sgraystar - 04.04.2024

Unfortunately this did not update overnight with the changed date. Do I need to go back to using a virtual group that changes regularly as a trigger to update the url?


RE: javascript daily URL change - admin - 05.04.2024

You can periodically check if the date has changed and modify the iframe src accordingly. Use setInterval: https://developer.mozilla.org/en-US/docs/Web/API/setInterval


RE: javascript daily URL change - sgraystar - 06.04.2024

OK. Thanks again.