Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 1 of 1
  1. #1
    Senior Coder DJCMBear's Avatar
    Join Date
    Mar 2010
    Location
    United Kindom
    Posts
    1,173
    Thanks
    14
    Thanked 136 Times in 136 Posts

    Window Boot Loader and Javascript Include

    Just wanted to post a snippet as it took me a while to find a good way to do something like this for my API engine and thought others may want to look over the code and get ideas of how to build one like mine themselves for their codes.

    NOTE: If you want to use this code please keep the top comment on the code as it will allow people to know who CMBSystems are thank you.

    Code:
    /**
     * Window Boot Loader and Javascript Include
     * Build 1.125.064.024
     *
     * @Author: CMBSystems (Chris Bearcroft)
     * @Created: 10/12/2010, 09:15 PM (GMT)
     * @Copyright: CMBSystems 2010
     *
     * This is a boot loader and Javascript include
     * built by CMBSystems founder (Chris Bearcroft).
     *
     * The code is free to use as a preview / demo
     * as long as this comment stays intact. You
     * can also use it on your own sites but also
     * keeping this comment intact.
     */
    
    (function($){
      /**
       * @FUNCTION: boot :: GLOBAL
       * This will boot the full function
       * and loads the final output to a
       * global onload function.
       */
      $.boot = function(o) {
        // Allows multi onload calls
        var load = function(func) {
          var oldonload = window.onload;
          if(typeof window.onload != 'function') {
            window.onload = func;
          } else {
            window.onload = function() {
              oldonload();
              func();
            };
          }
        };
        if(typeof o == 'object') {
          if(o.external !== undefined) {
            for(var i=0;i<o.external.length;i++) {
              // Renders any commanded files
              document.write('<script src="'+o.external[i]+'" type="'+
                             'text\/javascript"><\/scr'+'ipt>');
            }
          }
          if(o.success !== undefined) {
            // loads the final function
            load(o.success);
          }
        } else {
          if(typeof o != 'function') {
            // loads the given file
            document.write('<script src="'+o+'" type="'+
                           'text\/javascript"><\/scr'+'ipt>');
          } else {
            // loads the final function
            load(o);
          }
        }
        return this;
      };
    })(window);
    USAGE:
    Code:
    /**
      * lets say you have a js file called include.js
      * and it has a function called innerAlert that 
      * alerts any inputted text this is how you would do
      * it, there are 9 examples below of how to code it.
      */
    
    /* example 1 */
    
    // Boot javascript file
    boot('http://www.example.com/include.js');
    
    // Boot from function
    boot(function(){innerAlert('Testing example 1 from boot.');});
    
    // Boot from variable
    var inner1 = function(){innerAlert('Testing example 1 from boot again.');};
    boot(inner1);
    
    /* example 2 */
    
    // Booting in all-in-one mode
    boot({
      external: ['http://www.example.com/include.js'],
      success: function(){innerAlert('Testing example 2 from boot');}
    });
    
    /* example 3 */
    
    // Setting variable function
    var inner2 = function(){innerAlert('Testing example 3 boot again.');};
    
    // Boot in string mode
    boot('http://www.example.com/include.js').
    boot(function(){innerAlert('Testing example 3 boot.');}).
    boot(inner2);
    
    
    /* example 4 */
    
    // Setting variable function
    var inner2 = function(){innerAlert('Testing example 4 boot 3.');};
    
    // Boot as combo string: allows the use of extra js includes to one call
    boot('http://www.example.com/include.js').
    boot(function(){innerAlert('Testing example 4 boot 1.');}).
    boot({
      external: ['http://www.example.com/include2.js'],
      success: function(){
        // You can also use functions from past includes in the new include calls
        innerAlert(
          changeString('Testing example 4 boot 2.','Testing example 4 boot 2, CHANGED.')
        );
      }
    }).
    boot(inner2);
    
    /* example 5 */
    
    // Setting variable function
    var inner3 = function(){innerAlert('Testing example 5 from boot');};
    
    // Booting in all-in-one mode with function variable
    boot({
      external: ['http://www.example.com/include.js'],
      success: inner3
    });
    
    /* example 6 */
    
    // Setting variable function
    var inner4 = function(){innerAlert('Testing example 6 from boot 2');};
    
    // Booting in all-in-one mode with function and function variable
    // using only one external call and stringing
    boot({
      external: ['http://www.example.com/include.js'],
      success: function(){
        innerAlert('Testing example 6 from boot 1');
      }
    }).
    boot({
      success: inner4
    });
    
    /* example 7 - NOTE: this one defeats the whole external value but you can do this */
    
    // Boot javascript file
    boot('http://www.example.com/include.js');
    
    // Booting in all-in-one mode: success called only
    boot({
      success: function() {
        innerAlert('Testing example 7 from boot');
      }
    });
    
    /* example 8 */
    
    // You can also boot multiple js files like this
    boot('http://www.example.com/include.js');
    boot('http://www.example.com/include1.js');
    boot('http://www.example.com/include2.js');
    boot('http://www.example.com/include3.js');
    boot('http://www.example.com/include4.js');
    
    // Now use boot just like any normal call by window.onload
    boot(function(){
      // Then you can use them in the current js file as normal functions
      innerAlert(include1inner()); // function from include 1
      innerAlert(include2inner()); // function from include 2
      innerAlert(include3inner()); // function from include 3
      innerAlert(include4inner()); // function from include 4
    
      // You can also use them like so
      innerAlert(include1inner(include2inner()));
      // Getting the value from function2inner and
      // using it in function1inner as a parameter.
    });
    
    /* example 9 */
    
    // Boot multiple js files like this
    boot('http://www.example.com/include.js');
    boot('http://www.example.com/include1.js');
    
    // Set your function variables
    var e91 = function() {
      innerAlert('boot e91');
    };
    
    var e92 = function() {
      innerAlert('boot e92');
    };
    
    // Now you can boot a global variable call
    boot(function(){
      e91();
      e92();
    });
    - include.js
    Code:
    function innerAlert(o) {
      alert(o);
    }
    - include1.js
    Code:
    function include1inner(o) {
      if(o) {
        return 'calling value from '+o;
      } else {
        return 'func1';
      }
    }
    - include2.js
    Code:
    function include2inner() {
      return 'func2';
    }
    
    function changeString(o,c) {
      return "Changed '"+o+"' to '"+c+"'";
    }
    - include3.js
    Code:
    function include3inner() {
      return 'func3';
    }
    - include4.js
    Code:
    function include4inner() {
      return 'func4';
    }
    Last edited by DJCMBear; 12-12-2010 at 03:17 PM. Reason: Added: easy checker, Removed: booted variable
    Official BinPress hand picked coder.
    For anyone worried about SQL injection go have a look at my small yet powerful script here.
    Go Pledge for Light Table, if it hit's $300,000 Python and other languages will get added.
    I am 1 of 65,608 people to get a Pebble Watch :P


 

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •