Recently I have been working on a VA for a client and I noticed im using quite a bit of jquery.
Maintaining this code can be a bit of a headache so ive decided to create a boilerplate to maintain ALL my jQuery in one place.
Before I began I done a quick search and was unable to find exactly what I wanted, there was a similar method used by studioforty9.com, however it relied on a body class produced by in their case magento e-commerce.
This would not work in phpvms's case as it does not apply a class to the body for each page(controller) so here is my work-around for a global scope.
The method:
init Loads any code used cross domain
initSiteSection Loads the correct code for certain controllers
Firstly we catch the window.location.pathname
Next we need to slice off anything before the last /{forward slash}
Regex would work for this but I found lastIndexOf to be faster, then a substr and remove the last /{forward slash with +1}
Finally we evaluate the code{when a controller is loaded, we pick it up and then apply the correct initFunction to that controller}
Our code is now easy to maintain ....
(function($){
var Iphpvms = {
sections: {
'profile' : 'this.initProfile()',
'pilots' : 'this.initPilots()',
'pireps' : 'this.initPireps()',
'downloads' : 'this.initDownloads()',
'schedules' : 'this.initSchedules()',
'finances' : 'this.initFinances()'
},
/*
init ###################################################################
*/
init: function(){
//Common functionlaity across your site
},
/*
initSiteSection #########################################################
*/
initSiteSection: function(section){
var path = window.location.pathname;
var index = path.lastIndexOf("/");
var section = path.substr(index +1);
eval(this.sections[section]);
/**
* If a class is applied to the <body> for each page(controller)
* you can use this method instead!
* Source: studioforty9.com
*
initSiteSection: function(section){
var section = $('body').attr('class').split(' ')[1];
eval(this.sections[section]);
},
**/
},
/*
initProfile #########################################################
*/
initProfile: function(){
//De-buggin ONLY console.log($('body').attr('class', 'profile'));
},
initPilots: function(){
//De-buggin ONLY console.log($('body').attr('class', 'pilot'));
},
/*
initPireps #########################################################
*/
initPireps: function(){
//De-buggin ONLY console.log($('body').attr('class', 'pireps'));
},
/*
initDownloads #########################################################
*/
initDownloads: function(){
//De-buggin ONLY console.log($('body').attr('class', 'downloads'));
},
/*
initSchedules #########################################################
*/
initSchedules: function(){
//De-buggin ONLY console.log($('body').attr('class', 'schedules'));
},
/*
initFinances #########################################################
*/
initFinances: function(){
//De-buggin ONLY console.log($('body').attr('class', 'finances'));
},
}
/*
Ready? Invoke#########################################################
*/
$(function() {
Iphpvms.init();
Iphpvms.initSiteSection();
});
// use jQuery.noConflict() so we can use with other frameworks
})(jQuery.noConflict());
