State.js - hold values and call named functions on state change

State.js

var State = (function() {
    var values = {
    };

    var before = {

    };

    var after = {
    };

    var get = function(property) {
        if(property in values) {
            return values[property];
        }
        return undefined;
    };
    var runBefore = function(funcs,property,value) {
        if (property in funcs) {
            for(var i = 0; i <= funcs[property].length - 1; i+=1) {
                /* old,new */
                value = funcs[property][i](get(property),value);
            }
        }
        return value;
    };

    var runAfter = function(funcs,property,value) {
        if (property in funcs) {
            for(var i = 0; i <= funcs[property].length - 1; i+=1) {
                /* old,new */
                var v = funcs[property][i](get(property),value);
            }
        }
        return value;
    };

    var set = function(property,value) {
        value = runBefore(before,property,value);
        values[property] = value;
        runAfter(after,property,value);
    };

    var setAfter = function(property,func) {
        if(! ( property in after)) {
            after[property] = [];
        }
        after[property].push(func);
    };

    var setBefore = function(property,func) {
        if(! ( property in before)) {
            before[property] = [];
        }
        before[property].push(func);
    };

    return {
        set: function(property,value) {
            var values;
            if(typeof(property) !== 'object') {
                values = {};
                values[property] = value;
            }
            else {
                values = property;
            }
            for(var p in values) {
                value = values[p];
                property = p;
                if(typeof(value) === 'function') {
                    // If the "value" is a function, call it with a callback
                    // that will call ourselves to set the value later
                    var callback = value;
                    callback(function(input) {
                        set(property,input);
                    });
                    continue;
                }
                set(property,value);
            }
        },
        get: function(property) {
            return get(property);
        },
        before: function(a,b) {
            for (var i = 0; i < arguments.length; i++) {
                if(i == 0 ) {
                    var property = arguments[i];
                    continue;
                }
                setBefore(property,arguments[i]);
            }
            return this;
        },
        after:function(a,b) {
            for (var i = 0; i < arguments.length; i++) {
                if(i == 0 ) {
                    var property = arguments[i];
                    continue;
                }
                setAfter(property,arguments[i]);
            }
            return this;
        },
        prop: function(property) {

                return {
                    after: function(func) {
                        setAfter(property,func);
                        return this;
                    },
                    before: function(func) {
                        setBefore(property,func);
                        return this;
                    }
                }

        },
        dump: function() {
            console.log(values);
        },
        refresh: function(property) {
            //console.log(values);
            var v = get(property);
            set(property,v);
        }
    };
});



// Example usage



// Glorious State Pipeline
var s = State();

// Setup the initial state
s.set({
    'current.selection': null,
    'results.filter': 'both',
    'num.results': 100,
    'image.scale.class': 'col-md-2',
    'image.scale': 200,
    'tags.chosen': [],
    'item.template': $("#gridOfImagesTmpl"),
    'tags.available': service.getAvailableTags
});

// When the list of chosen tags is updated
s.prop('tags.chosen').after(function(old,n) {
    s.set('items',function(callback) {
        service.getItemsByTags(n, s.get('num.results'), s.get('results.filter'), callback);
    })
});

// Before the list of items is updated
s.prop('items').before(function(old,n) {
    s.set('tags.available', n);
    return n;
}).after(function(old,n) {
    var template = s.get('item.template').html();
    nodes.container.empty();
    if (typeof n == "undefined" || n.items.length == 0) {
        return false;
    }
    $.each(n.items, function (idx, item) {
        var doc = item._source;
        doc['image_scale_class'] = s.get('image.scale.class');
        var html = Mustache.to_html(template, doc);
        nodes.container.append(html);
    });
}).after(function(old,n) {
    if (typeof n == "undefined" || n.items.length == 0) {
        return false;
    }
    $.notify("Found " + n.items.length + " items","success", {'autoHideDelay': 500})
});