Return to Answer

I suggest looking at KernelJS, which implements this pattern

Sample implementation, to be placed in your base code:

Module.addSection = function(name,def){
 
  //check if name and def are what they are: string and function
  
  //create an instance of the constructor
  var section = new def();

  //add the section to the module namespace
  Module[name] = section;
}

Here's a simple usage for such functionality with Config:

Module.addSection('Config',function(){

  //everything in here is private
  var systemName = 'mySystem'
    , version = '1.1.4'
    ;

  //the namespace for this section is provided via "this" so you can expose
  //your public interface for this section
  this.getSystemInfo = function(){
    return systemName + ' v'+version;
  }

  //you may want to add special functions that get fired on certain events
  //like for example, fire upon add or fire when document.ready
  //implementation depends on you
  this.onDocumentReady = function(){
    console.log('this gets fired on document ready');
  }
 
});

Here's a simple, yet incomplete implementation using this new approach (it lacks the document.ready part). It is long, yet it's modular and easily maintainable. You can even split the section codes in separate files.

(function (ns) {

  ns.addSection = function (name, def) {
    ns[name] = new def();
  }

}(this.Module = this.Module || {}));

//adding config
Module.addSection('Config', function () {
  var systemName = 'mySystem',
    version = '1.1.4',
    section = this;

  section.getSystemInfo = function () {
    return systemName + ' v' + version;
  }

});

//adding Dialog
Module.addSection('Dialog', function () {

  var section = this;

  section.onDocumentReady = function () {
    $('.showDialog').on('click', function () {
      var obj = {
        element: this, 
        foo: 'foo',
        bar: 'bar',
        target: $('#title')
      };
      section.setParam(obj);
      section.show();
    })
  }

  section.setParam = function (config) {
    console.log('config set for dialog box');
    console.log(config);
  }

  section.show = function () {
    console.log('dialogbox show | ' + Module.Config.getSystemInfo());
  }

  section.close: function () {
    console.log('dialogbox close');
  }

});

//Savescreen section
Module.addSection('Savescreen', function () {

  var section = this;

  section.setParam = function (config, foo) {
    console.log('config set for savescreen');
  }

  section.show = function () {
    console.log('savescreen show | ' + Module.Config.getSystemInfo());
  }

});

Module.addSection = function(name,def){

  //check if name and def are what they are: string and function
  
  //then we add the definition
  //basically, def is a constructor and you are interfacing
  //with an instance of it that is attached to Module
  Module[name] = new def();

}

Module.addSection('Config',function(){

  //everything in here is private
  var systemName = 'mySystem'
    , version = '1.1.4'
    ;

  //the namespace for this section is provided via "this" so you can expose
  //your public interface for this section
  this.getSystemInfo = function(){
    return systemName + ' v'+version;
  }
 
});

Module.addSection = function(name,def){

  //check if name and def are what they are: string and function
  
  //create an instance of the constructor
  var section = new def();

  //add the section to the module namespace
  Module[name] = section;
}

Module.addSection('Config',function(){

  //everything in here is private
  var systemName = 'mySystem'
    , version = '1.1.4'
    ;

  //the namespace for this section is provided via "this" so you can expose
  //your public interface for this section
  this.getSystemInfo = function(){
    return systemName + ' v'+version;
  }

  //you may want to add special functions that get fired on certain events
  //like for example, fire upon add or fire when document.ready
  //implementation depends on you
  this.onDocumentReady = function(){
    console.log('this gets fired on document ready');
  }
 
});