mardi 6 octobre 2015

Separation of concerns javascript vs html

In my ASP.NET web-application I have a lot of distinct javascript per View.

I'm using a module-pattern for my javascript as described here. The pro here is to have a single .js per View. A module will look like:

// set the module for Home functionality
Modules.Home.Events = (function(parent, $, win, doc, undefined) {
    // the private instance of the module
    var module = {};
    var settings = {};

    // default settings for the module
    var defaults = new HomeEventsSettings();

    // ##### public functions #####
    module.initModule = function(options) {
        // merge settings as the may be overriden by calling page
        settings = $.extend(true, {}, defaults, options);

        // do things to init the module here
        doSomePrivateStuff();
    };

    // ##### private functions #####
    var doSomePrivateStuff = function() {
    };

    // return the module
    return module;
}(Modules.Home, jQuery, window, document, undefined));

whereas HomeEventsSettings is defined like:

function HomeEventsSettings() {
    this.someValue1 = undefined;
    this.someValue2 = undefined;
}

In my View I'll then have to init the module by calling:

$(function() {
    // create the settings for this module
    var moduleSettings = new HomeEventsSettings();

    // set values
    moduleSettings.someValue1 = "value1";
    moduleSettings.someValue2 = "value2";

    // init the module
    Home.Events.initModule(moduleSettings);
});

However. This somehow feels wrong to me as of the settings could get crowded depending on the View.

Other issues:

In VisualStudio 2012 intellisense is a catastrophe if I have another module with similar module-settings.

ReSharper (V. 7): In case I copy a module-settings "class" to HomeGamesSettings and rename the properties afterwards it would also rename the original ones in HomeEventsSettings.

function HomeGamesSettings() {
    this.someValue1 = undefined; // renaming to someChangedValue1 with R# will also rename HomeEventsSettings.someValue1
    this.someValue2 = undefined;
}

All this will make it nearly impossible to be maintained when the application grows with time.

How can this be made better? Is this just an issue with VS2012 an R# or is the whole approach totally wrong?

Aucun commentaire:

Enregistrer un commentaire