Why is my custom module not available after YUILoader.onSuccess event fires?

Hi all,

Trying to write better JavaScript, woohoo!

First step for me: YUILoader dependency loader so all of my custom code is available to use at a reliable point in time.

My current environment:

YUI (2.8.1) library path: C:\wamp\www\lib\js\yui\2\build\ (http://localhost/lib/js/yui/2/build/)
All YUI min, debug and raw files located in above location
Custom library path: C:\wamp\www\lib\js\ (http://localhost/lib/js/)
Custom Module 'fln-min.js' located in above location
Testing in Chrome

Notes:

Below is my example HTML page, my custom module follows the HTML code. No CSS or anything funky yet, I just want to get this working as a proof of concept. If you run my code, you'll see that both onSuccess events fire, but in the nested callback data is null, and my custom module seems to be unavailable. I've tried a few things, like the path concatenation, hence 'base' in the first YUILoader instance, and the commented out 2nd 'fullpath' in the 2nd YUILoader instance.

Demo HTML page:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
<html xmlns="http://www.w3.org/1999/xhtml"&gt;
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>External file Loader</title>
  <script src="/lib/js/yui/2/build/yuiloader/yuiloader-min.js"></script>
  <script>
   new YAHOO.util.YUILoader({

    base: '/lib/js/yui/2/build/',
    require: ['yahoo-dom-event'],
//    require: ['yahoo-dom-event','reset-fonts-grids','container'],
//    allowRollup: true,
//    combine: true,

    onSuccess: function() {

     alert('YAHOO: '+YAHOO);

     var loader = new YAHOO.util.YUILoader();
     //
     loader.addModule({
      name:'FLN',
//      varName:'FLN',
      type:'js',
      fullpath:'/lib/js/fln-min.js'
//      fullpath:'../../../fln-min.js'
     }); 
     loader.onSuccess = function(o) {
      // 
      alert('o.data: '+YAHOO.lang.dump(o.data));
      alert('FLN: '+FLN);
      //
     };
     loader.onFailure = function(o) {
      // 
      alert('Error: '+YAHOO.lang.dump(o));
      //
     };
     loader.insert();
    }

   }).insert();
  </script>
 </head>
 <body>
  <div id="output"></div>
 </body>
</html>

Custom module (fln-min.js):

var FLN = function(){

 var _debug = false ;
 var _masterDebug = false ;

 return {
  loaded: function(){ return true; }
    }

}();
alert('...');

ansaurus

tags:

views:

answers:

Why is my custom module not available after YUILoader.onSuccess event fires?

related questions