Based on a JavaScript app like below (with about 4,000 lines of code removed from it).
Basically I have a Project Management application. It consist of several sections and components...
- Task modal
- Task lists
- Files
- Milestones
- Tags
- Activity stream
- Forums
- Task boards
- Comments
- Wiki
- and many more
THis code below is what I consider the base of it all. THere are things that I need to access in this object as well as in other objects so I am yting to come up with a sort of sub-module object which can be injected into the object below as well as others.
For an example a Userlist could be a JSON object with username and all related user data and have an entry for all users.
This userlist might be needed in the object below as well as in all the other object/module/sections of code. Instead of loading the userlist from the server many times I would like to instead have a User submodule which can be injected or loaded into the other object when needed.
Same situation for a Tag list, Milestone list, and many others.
I am looking for help in designing some sort of submodule object code and then how I can load it into the code below and access it.
The goal is to load each submodule 1 time as they make AJAX request for data and then when the next module calls it, it will instead serve cached data since it is already loaded in the previous module if that makes sense.
I would love any help or ideas please?
/**
* ProjectManagementTaskModal handles all the Task Modal functionality
* @param {[type]} window [description]
* @param {[type]} document [description]
* @param {[type]} $ [description]
* @param {[type]} undefined [description]
* @return {[type]} [description]
*/
(function (window, document, $, undefined) {
"use strict";
//we cache a few useful values, like jQuery wrapped window and document
var $window = $(window),
$document = $(document),
ProjectManagementTaskModal = {
//Turn on/off Task Modal Data being Mocked
canUseMockAjaxJsonProjectDataFlag: true, //, //true false//
// Cache Properties
cache: {
// cache DOM selectors, properties, and more for access throughout the object/app
},
/**
* Initialize ProjectManagementTaskModal Object and fire off some other init functions
* @return {[type]} [description]
*/
init: function() {
// load dependant modules
// user
// milestones
// tags
// acl
// settings
// check if sub-module is loaded?
if(typeof ProjectManagement.modules.User != 'undefined'){
alert('user module loaded');
// Load from User object module and also test user module cache
console.log(ProjectManagement.modules.User.getCurrentUser('1'));
alert(ProjectManagement.modules.User.getCurrentUser('1'));
}else{
alert('user module NOT loaded');
}
this.events.initializeEventHandlers();
this.events.initCurrentUser();
this.events.editInPlaceFieldSaveEvents();
ProjectManagement.modules.Debug.log('info', 'ProjectManagementTaskModal Init() Function Ran');
},
someOtherFUnction: function() {
/* other function in app */
},
someOtherFUnction2: function() {
/* other function in app */
},
someOtherFUnction3: function() {
/* other function in app */
},
};
// Run Init on DOM Ready
$(function() {
ProjectManagementTaskModal.init();
});
}(this, document, jQuery));
Aucun commentaire:
Enregistrer un commentaire