lockandload/lockandload_headready.js

Minimalist AMD-compliant Javascript and CSS loader

((W,D,F,E,P)=>
{ "use strict";
  W.gtag=function(){ dataLayer.push(arguments); };
  function n(e,a,v,r,u,p,x,y,k)
  { k=D.createElement(e); if(p) k.onload=()=>E(p, 1);
    k.fetchPriority="low"; k[a]=v; k[r]=u; x||(k.crossOrigin="");
    for (x in y) k.setAttribute(x, y[x]);
    D.head.appendChild(k); }
  function css(u,p){ n("link","rel","stylesheet","href",u,p); }
  function js(u,a,x,y)
  { if (!D.head.querySelector(`script[src="${u}"]`))
      n("script","async",a,"src",u,0,x,y); }
  function jsa(a,p){ P[a]=p; }
  /*
  ** This is the start of your config area.  Customise to taste.
  **
  ** Define a bunch of pathname aliases to reference javascript files that
  ** shall be loaded through require.load(path) on demand.
  ** Specifying those here now avoids sprinkling pathnames throughout
  ** your other modules' source code:
  **jsa("lzstring", "js/lz-string.js");
  **
  ** Optional headready define, if you want it, uncomment the next line:
  **define("headready", 1);
  **
  ** Add low priority CSS files here.
  ** High priority CSS should use direct <link> entries instead if you
  ** do not need to fulfill a custom dependency for those files.
  ** CSS files you need to fulfill dependency 'id' for, must use scss(id, url)
  ** instead.
  **
  **var t="//cdn.remixml.org/css/";
  **css(t+"blue.css", "bluecssloaded");		// CSS fulfilling dependency
  **css(t+"sample.css");			// Low prio CSS
  **
  ** Add medium priority Javascript files here.
  ** Typically jQuery should be loaded here, if needed:
  **
  **require(["domready"], ()=> {
  **  js("//ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js");
  **});
  **
  ** Executed when the DOM has been loaded completely.
  ** Typically the place to add remaining low priority Javascript files.
  ** High priority Javascript files should use direct script entries instead.
  ** If you do not use jQuery, take out the jQuery dependency from the line
  ** below:
  */
  require(["domready", "jQuery"], (domready)=> {
    /*var t="//cdn.remixml.org/js/";
    **js(t+"sequentialload.js");	// Legacy sequential low prio loads
    **js(t+"sequentialload2.js");	// Legacy sequential low prio loads
    **js(t+"sequentialload3.js");	// Legacy sequential low prio loads
    **js("lastjs.js");			// Fullfill lastjs dependency after
    **					// all js()s have been processed
    **js(t+"asynchronousload.js", "async");	// Low priority async
    */
    setTimeout(()=> {
	/*
	** Low priority non-interactive
	*/
	js("//www.googletagmanager.com/gtm.js?id=GTM-xxxxxx", "async", 1);
    }, 2048);
    /*
    ** Call domready(1) with a one as argument once from the startup scripts.
    ** Call domready() without arguments from your SPA after that on every
    ** page refresh.  Calling domready() before domready(1) has been called
    ** will silently ignore the domready() call.
    ** You can offer a limited scope for the domready() call by supplying
    ** an argument as in domready(scope).  The argument will be available
    ** to the scripts being run.  If you do not provide an argument, they
    ** will receive $(document) (the jQuery whole document object/scope).
    */
    domready(1);
  });
  /*
  ** This is where your config area ends.  Do not edit until after the
  ** end of the script
  */
  E("jQuery", ["jquery"], ($, i)=>
  { W.jQuery=W.$=$; while (i=E.Q.shift()) $(i); return $; });
  E(F, ["module"], (R)=>
   (W[F].undef=(n)=>R[n]=0, W[F].load=(p,y)=>js(P[p]||p, 1, 0, y), W[F]));
  W.onload=()=>E("domready", ["module"], (R)=> (t,i)=>
    { if(E.S[0]||t==1)
      { t=!(t==1?E.S.shift():t)&&R.jquery?$(D):t;
	for (i=0; i<E.S.length; E.S[i++](t)); }});
})(window,document,"require",define,{});