Skip to content

Commit

Permalink
Improved support for passing options to defer, such as dependencies,
Browse files Browse the repository at this point in the history 
without needing to define the script in a deferDef.
Support for detecting if a script, such as jQuery, has been loaded statically,
or by some other script loader, and not loading it dynamically, even if
declared as a dependency.
Added samples, in particular, Movie App sample with lazy loading of jQuery.
  • Loading branch information
@BorisMoore
BorisMoore committed Feb 6, 2011
1 parent f82f52e commit 138c017
Show file tree
Hide file tree
Showing 36 changed files with 315 additions and 140 deletions.
43 changes: 25 additions & 18 deletions DeferJS.js
View file
@@ -1,7 +1,7 @@
// This is DeferJS.js: The jQuery-independent version of DeferJS
// (If you want the jQuery plugin version of DeferJS, use jquery.defer.js).

window.deferJs || window.jQuery && jQuery.defer || (function ( window, undefined ) {
window.deferJs || window.jQuery && jQuery.defer || (function( window, undefined ) {

var $, document = window.document,
anchor = document.createElement("a"),
Expand All @@ -10,8 +10,7 @@ var $, document = window.document,
loadingScripts = [],
loadingSubScripts,
promiseMethods = "then done fail isResolved isRejected promise".split( " " ),
slice = Array.prototype.slice,
getAjax;
slice = Array.prototype.slice;

if ( window.jQuery ) {
////////////////////////////////////////////////////////////////////////////////////////////////
Expand All @@ -33,7 +32,7 @@ if ( window.jQuery ) {
// Also provide simplified support for $.extend, DomReady and AJAX x-domain requests,
// since we can't use jQuery implementations of those...

window.deferJs = window.$ = $ = function ( cb ) {
window.deferJs = window.$ = $ = function( cb ) {
return readyList.done( cb );
};

Expand Down Expand Up @@ -201,7 +200,7 @@ if ( window.jQuery ) {
if ( length > 1 ) {
resolveArray = new Array( length );
for ( index = 0; index < length; index++ ) {
$.when( element ).then( function( value ) {
$.when( args[index] ).then( function( value ) {
resolveArray[ index ] = arguments.length > 1 ? slice.call( arguments, 0 ) : value;
if( ! --length ) {
deferred.resolveWith( promise, resolveArray );
Expand All @@ -215,7 +214,7 @@ if ( window.jQuery ) {
}
});

getAjax = function getAjax( options ) {
function getAjax( options ) {
var deferred = $.Deferred(),
head = document.getElementsByTagName( "head" )[ 0 ] || document.documentElement,
script = document.createElement( "script" );
Expand All @@ -224,7 +223,7 @@ if ( window.jQuery ) {

// TODO? Add support for timeout and cache

script.onload = script.onreadystatechange = function () {
script.onload = script.onreadystatechange = function() {
if ( !script.readyState || /loaded|complete/.test( script.readyState ) ) {
// Handle memory leak in IE
script.onload = script.onreadystatechange = null;
Expand All @@ -244,7 +243,7 @@ if ( window.jQuery ) {

function domReady() {
if ( !document.body ) {
return setTimeout( function () {
return setTimeout( function() {
domReady();
}, 1 );
}
Expand Down Expand Up @@ -310,15 +309,18 @@ $.extend({
delayDomReady = options.delayDomReady || deferSettings.delayDomReady,
min = options.min || deferSettings.min,
scriptDef = getScriptDef( scriptName, basePath ),
bare = options.bare || scriptDef.bare,
url = scriptDef.url,
loadUrl = ( min && scriptDef.minUrl ) || scriptDef.url,

contains = scriptDef.contains,
settings = $.extend( scriptDef, options ),
bare = settings.bare,
contains = settings.contains,
loaded = settings.loaded,
depends = settings.depends,
multiple = settings.multiple,

parentPromise = scriptDef.prntPrms,
promise = scriptDef.promise,
depends = scriptDef.depends,
multiple = scriptDef.multiple,
runCb, thisPromise, hasRun, hasRunPromise;

function run() {
Expand Down Expand Up @@ -386,8 +388,7 @@ $.extend({

function getScript() {
// Use $.ajax if jQuery is loaded. Otherwised use our stripped down getAjax call.
return ($.ajax || getAjax)(
{
return ($.ajax || getAjax)({
url: loadUrl,
dataType: "script",
timeout: options.timeout,
Expand Down Expand Up @@ -451,6 +452,12 @@ $.extend({
}

if ( multiple || !promise ) {
asyncLoad = $.Deferred();

if ( loaded && eval( loaded )) {
return asyncLoad.resolve().promise();
}

if ( delayDomReady ) {
$.readyWait++;
}
Expand Down Expand Up @@ -478,7 +485,7 @@ $.extend({
return promise;
},

deferDef: function ( scriptDefs, thisUrl ) {
deferDef: function( scriptDefs, thisUrl ) {
var scriptName, basePath, scriptDef,
scriptEl = document.getElementsByTagName( "script" );

Expand All @@ -495,15 +502,15 @@ $.extend({
// scriptDef = scriptByUrl[ url ];
// // Autogenerate methods on defer for registered scripts.
// if ( !scriptDef ) {
// scriptDef = function () {
// scriptDef = function() {
// var args = array.prototype.slice.call( arguments, 0 );
// args.unshift( name );
// return defer.apply( $, args );
// }
// }

// Autogenerate methods on defer for registered scripts.
scriptDef = scriptByUrl[ url ] || function () {
scriptDef = scriptByUrl[ url ] || function() {
var args = slice.call( arguments, 0 );
args.unshift( name );
return defer.apply( $, args );
Expand Down Expand Up @@ -548,7 +555,7 @@ $.extend({
}
});

window.$deferRun = function ( run, settings ) {
window.$deferRun = function( run, settings ) {
settings = makeArray( settings );
settings = settings && settings.length ? { depends: settings } : settings || {};
settings.run = run;
Expand Down
3 changes: 2 additions & 1 deletion demos/FeatureTests/Advanced/1_NamedDeferredsNoGlobals.html
View file
Expand Up @@ -48,7 +48,8 @@
$.ready.c,
$.ready.e,
$.ready
).done( function( result0, result1, result2 ){
)
.done( function( result0, result1, result2 ){
log( "a, c, e and domReady: " + result0 + ", " + result1 + ", " + result2 );
});
}());
Expand Down
3 changes: 2 additions & 1 deletion demos/FeatureTests/Advanced/2_NoCache.html
View file
Expand Up @@ -35,7 +35,8 @@
$.defer.a({
myVal: "one",
noCache:true
}).done(
})
.done(
log,
function( result ) {
log( $.defer.c.result );
Expand Down
12 changes: 8 additions & 4 deletions demos/FeatureTests/Advanced/4_Multiple.html
View file
Expand Up @@ -18,7 +18,8 @@

$.defer.d({
myVal: "first value"
}).done( function( result ) {
})
.done( function( result ) {
log( "multiple false. First Call" );
log( result );
});
Expand All @@ -27,7 +28,8 @@
// Script does not re-execute. Previous value returned
$.defer.d({
myVal: "second value"
}).done( function( result ) {
})
.done( function( result ) {
log( "multiple false. Second Call" );
log( result );
});
Expand All @@ -42,7 +44,8 @@

$.defer.d({
myVal: "first value"
}).done( function( result ) {
})
.done( function( result ) {
log( "multiple true. First Call" );
log( result );
});
Expand All @@ -51,7 +54,8 @@
// Script re-executes, with new parameters and returns new value.
$.defer.d({
myVal: "second value"
}).done( function( result ) {
})
.done( function( result ) {
log( "multiple true. Second Call" );
log( result );
});
Expand Down
15 changes: 10 additions & 5 deletions demos/FeatureTests/Advanced/5_OverlappingComposites.html
View file
Expand Up @@ -29,7 +29,8 @@

$.defer.dcf( {
myVal: "valDCF"
}).done( function( components ) {
})
.done( function( components ) {
log( "DCF done" );
log( components[0] );
log( components[1] );
Expand All @@ -38,28 +39,32 @@

$.defer( "../resources/folder2/c.js", {
myVal: "valC"
}).done( function( result ) {
})
.done( function( result ) {
log( "C done" );
log( result );
});

$.defer( "../resources/folder2/d.js", {
myVal: "valD"
}).done( function( result ) {
})
.done( function( result ) {
log( "D done" );
log( result );
});

$.defer( "../resources/folder2/d.js", {
myVal: "valD2"
}).done( function( result ) {
})
.done( function( result ) {
log( "D done" );
log( result );
});

$.defer( "../resources/folder2/compositeFED.js", {
myVal: "valFED"
}).done( function( components ) {
})
.done( function( components ) {
log( "FED done" );
log( components[0] );
log( components[1] );
Expand Down
4 changes: 2 additions & 2 deletions demos/FeatureTests/Advanced/AsyncTemplates/1_passDeferred.html
View file
Expand Up @@ -9,8 +9,8 @@

$( function() {
$.tmpl(
$.defer( "templatesAndData/myTmpl.js" ),
$.defer( "templatesAndData/myData.js" )
$.defer( "../../templatesAndData/myTmpl.js" ),
$.defer( "../../templatesAndData/myData.js" )
).appendTo( "ul" );
});
</script>
Expand Down
8 changes: 4 additions & 4 deletions demos/FeatureTests/Advanced/AsyncTemplates/2_passUrl.html
View file
Expand Up @@ -7,10 +7,10 @@
<script type="text/javascript">
$.defer( "jquery.tmpl.experimental.js", { bare: true, delayDomReady: true } );

$( function() {
$.tmpl(
"@templatesAndData/myTmpl.js",
"@templatesAndData/myData.js"
$( function() {
$.tmpl(
"@../../templatesAndData/myTmpl.js",
"@../../templatesAndData/myData.js"
).appendTo( "ul" );
});
</script>
Expand Down
10 changes: 5 additions & 5 deletions demos/FeatureTests/Advanced/AsyncTemplates/3_waitAlsoForDomReady.html
View file
Expand Up @@ -4,12 +4,12 @@
<script src="http://code.jquery.com/jquery.js" type="text/javascript"></script>
<script src="../../../../jquery.defer.js" type="text/javascript"></script>
<script src="jquery.tmpl.experimental.js" type="text/javascript"></script>

<script type="text/javascript">
$.tmpl(
"@templatesAndData/myTmpl.js",
"@templatesAndData/myData.js"

$.tmpl(
"@../../templatesAndData/myTmpl.js",
"@../../templatesAndData/myData.js"
).appendTo( "ul" );

</script>
Expand Down
9 changes: 5 additions & 4 deletions demos/FeatureTests/Advanced/AsyncTemplates/4_remoteCompositeTemplates.html
View file
Expand Up @@ -10,14 +10,15 @@

$.deferDef({
richTmpls: {
url: "templatesAndData/richTmpls.js",
url: "../../templatesAndData/richTmpls.js",
contains: ["outer", "inner"]
}
});

$.defer.richTmpls().done( function() {
$.tmpl( "@outer", "@templatesAndData/myRichData.js" ).appendTo( "ul" );
});
$.defer.richTmpls()
.done( function() {
$.tmpl( "@outer", "@../../templatesAndData/myRichData.js" ).appendTo( "ul" );
});


</script>
Expand Down
4 changes: 2 additions & 2 deletions demos/FeatureTests/Basic/1a_DelayDomReady.html
View file
Expand Up @@ -9,8 +9,8 @@
<script type="text/javascript">

$.defer( "../resources/folder1/a.js", {
myVal: "val1",
delayDomReady: true
myVal: "val1",
delayDomReady: true
})
.done( log );

Expand Down
2 changes: 1 addition & 1 deletion demos/FeatureTests/Basic/1b_DelayDomReady.html
View file
Expand Up @@ -11,7 +11,7 @@
$.deferSettings.delayDomReady = true;

$.defer( "../resources/folder1/a.js", {
myVal: "val1"
myVal: "val1"
})
.done( log );

Expand Down
8 changes: 4 additions & 4 deletions demos/FeatureTests/Basic/2a_Def.html
View file
Expand Up @@ -17,12 +17,12 @@
e: "../resources/folder2/e.js"
});

$.deferSettings.min = false;
$.deferSettings.min = false;

$.defer.a({
myVal: "val1",
delayDomReady: true,
min: true
myVal: "val1",
delayDomReady: true,
min: true
})
.done( log );

Expand Down
2 changes: 1 addition & 1 deletion demos/FeatureTests/Basic/2b_Def.html
View file
Expand Up @@ -5,7 +5,7 @@
<script src="../consoleTest.js" type="text/javascript"></script>

<script src="../../../jquery.defer.js" type="text/javascript"></script>

<script src="../resources/myScriptDefs.js" type="text/javascript"></script>

<script type="text/javascript">
Expand Down
17 changes: 10 additions & 7 deletions demos/FeatureTests/Basic/3_JoinWithWhen.html
View file
Expand Up @@ -7,26 +7,29 @@
<script src="../../../jquery.defer.js" type="text/javascript"></script>

<script type="text/javascript">

var f = $.defer( "../resources/f.js", {
delayDomReady: true
}).done( function(){
})
.done( function(){
log( "f loaded. DomReady: " + $.ready.isResolved() );
});

var a = $.defer( "../resources/folder1/a.js" );

$.when(
a,
f
).done( function(){
a,
f
)
.done( function(){
log( "a and f loaded. DomReady: " + $.ready.isResolved() );
});

$.when(
f,
f,
$.ready
).done( function( result ){
)
.done( function( result ){
log( "f has loaded and Dom is ready" );
});

Expand Down

0 comments on commit 138c017

Please sign in to comment.