Changeset 1243

Timestamp:

02/18/10 14:00:38 (3 years ago)

Author:

gogo

Message:

Fix for Internet Explorer with MootoolsFileManager?
Using loadScript and loadStyle is asynchronous in Internet Explorer which meant that the dependancies of MootoolsFileManager? were not being included.
Added a Xinha.includeAssets method to handle this by making it possible to synchronously load these items.

 * Example Usage:
 *
 * Xinha.includeAssets( 'foo.css', 'bar.js', [ 'foo.css', 'MyPlugin' ], { type: 'text/css', url: 'foo.php', plugin: 'MyPlugin } );
 *
 * Alternative usage, use Xinha.includeAssets() to make a loader, then use loadScript, loadStyle and whenReady methods
 * on your loader object as and when you wish, you can chain the calls if you like.
 *
 * Note whenReady can only have one active callback at a time, but once it's been called you can
 * issue another whenReady(), if there is nothing waiting to be loaded, it will be executed immediately.
 *
 *   var myAssetLoader = Xinha.includeAssets();
 *       myAssetLoader.loadScript('foo.js', 'MyPlugin')
 *                    .loadStyle('foo.css', 'MyPlugin'); 

Location:

trunk

Files:

• XinhaCore.js (modified) (2 diffs)
• plugins/MootoolsFileManager/MootoolsFileManager.js (modified) (3 diffs)

trunk/XinhaCore.js

@@ -4043 +4043 @@
 
 /** Adds a script to the document
- * @param {String} style name of the stylesheet file
+ *
+ * Warning: Browsers may cause the script to load asynchronously.
+ *
+ * @param {String} style name of the javascript file
  * @param {String} plugin optional name of a plugin; if passed this function looks for the stylesheet file in the plugin directory 
- * @param {String} id optional a unique id for identifiing the created link element, e.g. for avoiding double loading 
- *                 or later removing it again
- */
-Xinha.loadScript = function(script, plugin)
+ *
+ */
+Xinha.loadScript = function(script, plugin, callback)
 {
   var url = _editor_url || '';
@@ -4066 +4068 @@
   }
   
-  Xinha._loadback(url);
-  
-};
-
+  Xinha._loadback(url, callback);
+  
+};
+
+/** Load one or more assets, sequentially, where an asset is a CSS file, or a javascript file.
+ *
+ * Example Usage:
+ *
+ * Xinha.includeAssets( 'foo.css', 'bar.js', [ 'foo.css', 'MyPlugin' ], { type: 'text/css', url: 'foo.php', plugin: 'MyPlugin } );
+ *
+ * Alternative usage, use Xinha.includeAssets() to make a loader, then use loadScript, loadStyle and whenReady methods
+ * on your loader object as and when you wish, you can chain the calls if you like.
+ *
+ * Note whenReady can only have one active callback at a time, but once it's been called you can
+ * issue another whenReady(), if there is nothing waiting to be loaded, it will be executed immediately.
+ *
+ *   var myAssetLoader = Xinha.includeAssets();
+ *       myAssetLoader.loadScript('foo.js', 'MyPlugin')
+ *                    .loadStyle('foo.css', 'MyPlugin');                        
+ * 
+ */
+ 
+Xinha.includeAssets = function()
+{
+  var assetLoader = { pendingAssets: [ ], loaderRunning: false };
+  
+  assetLoader.callback = function() { };
+  
+  assetLoader.loadNext = function()
+  {  
+    var self = this;
+    this.loaderRunning = true;
+    
+    if(this.pendingAssets.length)
+    {
+      var nxt = this.pendingAssets[0];
+      this.pendingAssets.splice(0,1); // Remove 1 element
+      switch(nxt.type)
+      {
+        case 'text/css':
+          Xinha.loadStyle(nxt.url, nxt.plugin);
+          return this.loadNext();
+        
+        case 'text/javascript':
+          Xinha.loadScript(nxt.url, nxt.plugin, function() { self.loadNext(); });
+      }
+    }
+    else
+    {
+      this.loaderRunning = false;
+      this.runCallback();      
+    }
+  };
+  
+  assetLoader.loadScript = function(url, plugin)
+  {
+    var self = this;
+    
+    this.pendingAssets.push({ 'type': 'text/javascript', 'url': url, 'plugin': plugin });
+    if(!this.loaderRunning) this.loadNext();
+    
+    return this;
+  };
+  
+  assetLoader.loadStyle = function(url, plugin)
+  {
+    var self = this;
+    
+    this.pendingAssets.push({ 'type': 'text/css', 'url': url, 'plugin': plugin });
+    if(!this.loaderRunning) this.loadNext();
+    
+    return this;    
+  };
+  
+  assetLoader.whenReady = function(callback) 
+  {
+    this.callback = callback;    
+    if(!this.loaderRunning) this.loadNext();
+    
+    return this;    
+  };
+  
+  assetLoader.runCallback = function()
+  {
+    this.callback();
+    this.callback = null;
+    return this;
+  }
+  
+  for(var i = 0 ; i < arguments.length; i++)
+  {
+    if(typeof arguments[i] == 'string')
+    {
+      if(arguments[i].match(/\.css$/i))
+      {
+        assetLoader.loadStyle(arguments[i]);
+      }
+      else 
+      {
+        assetLoader.loadScript(arguments[i]);
+      }
+    }
+    else if(arguments[i].type)
+    {
+      if(arguments[i].type.match(/text\/css/i))
+      {
+        assetLoader.loadStyle(arguments[i].url, arguments[i].plugin);
+      }
+      else if(arguments[i].type.match(/text\/javascript/i))
+      {
+        assetLoader.loadScript(arguments[i].url, arguments[i].plugin);
+      }
+    }
+    else if(arguments[i].length >= 1)
+    {
+      if(arguments[i][0].match(/\.css$/i))
+      {
+        assetLoader.loadStyle(arguments[i][0], arguments[i][1]);
+      }
+      else 
+      {
+        assetLoader.loadScript(arguments[i][0], arguments[i][1]);
+      }
+    }
+  }
+  
+  return assetLoader;
+}
 
 /***************************************************

trunk/plugins/MootoolsFileManager/MootoolsFileManager.js

@@ -35 +35 @@
 };
 
+MootoolsFileManager.AssetLoader = Xinha.includeAssets();
+
 // In case you want to use your own version of Mootools, you can load it first.
 if(typeof MooTools == 'undefined')
 {
-  Xinha.loadScript('mootools-filemanager/Demos/mootools-core.js', 'MootoolsFileManager');
-  Xinha.loadScript('mootools-filemanager/Demos/mootools-more.js', 'MootoolsFileManager');
+  MootoolsFileManager.AssetLoader
+    .loadScript('mootools-filemanager/Demos/mootools-core.js', 'MootoolsFileManager')
+    .loadScript('mootools-filemanager/Demos/mootools-more.js', 'MootoolsFileManager');
 }
 
@@ -46 +49 @@
 if(typeof FileManager == 'undefined')
 {
-  Xinha.loadStyle('mootools-filemanager/Css/FileManager.css', 'MootoolsFileManager');
-  Xinha.loadStyle('mootools-filemanager/Css/Additions.css', 'MootoolsFileManager');
-  Xinha.loadScript('mootools-filemanager/Source/FileManager.js', 'MootoolsFileManager');
-  Xinha.loadScript('mootools-filemanager/Language/Language.en.js', 'MootoolsFileManager');
-  Xinha.loadScript('mootools-filemanager/Source/Additions.js', 'MootoolsFileManager');
-  Xinha.loadScript('mootools-filemanager/Source/Uploader/Fx.ProgressBar.js', 'MootoolsFileManager');
-  Xinha.loadScript('mootools-filemanager/Source/Uploader/Swiff.Uploader.js', 'MootoolsFileManager');
-  Xinha.loadScript('mootools-filemanager/Source/Uploader.js', 'MootoolsFileManager');
+  MootoolsFileManager.AssetLoader
+    .loadStyle('mootools-filemanager/Css/FileManager.css', 'MootoolsFileManager')
+    .loadStyle('mootools-filemanager/Css/Additions.css', 'MootoolsFileManager')
+    .loadScript('mootools-filemanager/Source/FileManager.js', 'MootoolsFileManager')
+    .loadScript('mootools-filemanager/Language/Language.en.js', 'MootoolsFileManager')
+    .loadScript('mootools-filemanager/Source/Additions.js', 'MootoolsFileManager')
+    .loadScript('mootools-filemanager/Source/Uploader/Fx.ProgressBar.js', 'MootoolsFileManager')
+    .loadScript('mootools-filemanager/Source/Uploader/Swiff.Uploader.js', 'MootoolsFileManager')
+    .loadScript('mootools-filemanager/Source/Uploader.js', 'MootoolsFileManager');
 }
-Xinha.loadStyle('MootoolsFileManager.css', 'MootoolsFileManager');
+MootoolsFileManager.AssetLoader.loadStyle('MootoolsFileManager.css', 'MootoolsFileManager');
 
 // Initialise the plugin for an editor instance.
@@ -290 +294 @@
       selectable:     true,
       uploadAuthData: this.editor.config.MootoolsFileManager.backend_data,
-      onComplete:     function(path, file, params) { self.ImageManagerReturn(path,file,params); }
+      onComplete:     function(path, file, params) { self.ImageManagerReturn(path,file,params); },
+      extendedAttributes: outparam
       // @TODO : Add support to pass in the existing src, alt etc...
     });