title: How to use a preloader to load an external javascript if Internet becomes available after startup?
body: <p>I've been experimenting with <a href="http://responsivevoice.org/" rel="nofollow">responsive voice</a> for my html5 application. Apart from responsive voice, my app works stand-alone, with no need for the Internet, because the schools where I work have unreliable Internet connections. </p>
  
  <p>I previously had a problem waiting for RV's javascript to load on a slow connection, which I solved using the preloader <a href="http://yepnopejs.com/" rel="nofollow">yepnope</a>:</p>
  
  <pre><code>yepnope({
      load: 'https://code.responsivevoice.org/responsivevoice.js',
      callback: function (url, result, key) {
          if (typeof responsiveVoice!="undefined"){
                  //code to activate RV functionality here
          }
      }
  });
  </code></pre>
  
  <p>While testing this out, I realised the potential for something much better: yepnope automatically times out after 10 seconds if the script doesn't load and triggers the callback function anyway. That timeout can be changed, but what I'd like is, effectively, no timeout at all!</p>
  
  <p>For example, if the students start using my app at 07:30 a.m. when the school's satellite dish barely works, then at 3 p.m. the clouds clear to make RV viable, it would be nice if the script finally loaded, triggered the callback and RV sprang into life.</p>
  
  <p>So I have 3 questions:</p>
  
  <ol>
  <li><p>In principle, is there any reason why I should not change the yepnope timeout from 10 seconds, to 12 hours? e.g.</p>
  
  <pre><code>yepnope.errorTimeout = 43200000;
  </code></pre></li>
  <li><p>I notice that yepnope has been deprecated. Can anyone recommend a similarly easy-to-use preloader with a no timeout option?</p></li>
  <li><p>Would it be lighter on system resources to use setInterval? e.g.</p>
  
  <pre><code>var net_check = window.setInterval(yepnope, 18000); // try loading the script every 5 minutes
  </code></pre>
  
  <p>then if RV loads, cancel the setInterval:        </p>
  
  <pre><code>yepnope({
    load: 'https://code.responsivevoice.org/responsivevoice.js',
      callback: function (url, result, key) {
      if (typeof responsiveVoice!="undefined"){
          clearInterval(net_check);
          //code to activate RV functionality here
      }
    }
  });
  </code></pre></li>
  </ol>
  
  <p>Thanks as always for any advice.</p>
  
  <p><strong>Edit:</strong>  @Steyn van Esveld raised a really good point: "Is there any reason you can't download the responsivevoice.js and load it locally?"</p>
  
  <p>In fact the RV script doesn't provide the text-to-speech voices itself - it's more of a facilitator. If your browser has native t-t-s support, it will use it, if not, they generate audio files (presumably from their website) and send them to your browser. Also, even Chrome's native t-t-s support evaporates if you are off-line. e.g. if you run:</p>
  
  <pre><code>voices = window.speechSynthesis.getVoices();
  voices.length
  </code></pre>
  
  <p>from the console when offline, it returns "0".</p>
  
  <p>This means I need a fallback if the Internet goes down <strong>after</strong> my app loads. The most reliable way I've found to do this is:</p>
  
  <pre><code>var rvStarted=false;
  responsiveVoice.speak(vocEx, {onstart:function(){rvStarted=true;}}); 
  setTimeout(function(){
    if (rvStarted==false){
      responsiveVoice.cancel();
      audVoc.play(); //plays a backup off-line recording 
    }
  },1000);
  </code></pre>
  
  <p>There is an onerror callback in the RV api, but it's vaguely documented, and I certainly cannot control the timeout myself as I can with this script.</p>