Refining classless JavaScript
A full example.
by FiNGAHOLiC
HTML
<p id='display'></p>
JavaScript
var base = {
create: function (self) {
return self || {};
},
destroy: function (self) {
var key;
for (key in self) {
if (self.hasOwnProperty(key)) {
delete self[key];
}
}
return self;
}
};
var events = Object.create(base);
events.create = function (self) {
self = base.create(self);
self.events = {};
return self;
};
events.addListener = function (self, event, listener) {
var listeners = self.events[event] = self.events[event] || [];
listeners.push(listener);
};
events.removeListener = function (self, event, listener) {
var index;
var listeners = self.events[event];
if (listeners) {
index = listeners.indexOf(listener);
listeners.slice(index, 1);
}
};
events.emitEvent = function (self, event, args, scope) {
var listeners = self.events[event];
var i;
var length;
if (listeners) {
length = listeners.length;
for (i = 0; i < length; i++) {
listeners[i].apply(scope, args);
}
}
};
var model = Object.create(base);
model.create = function (self) {
self = events.create(self);
self.data = {};
return self;
};
model.set = function (self, key, value) {
var before = self.data[key];
self.data[key] = value;
events.emitEvent(self, 'change', [key, value, before]);
};
model.get = function (self, key) {
if (key) {
return self.data[key];
}
return self.data;
};
model.remove = function (self, key) {
var before = self.data[key];
delete self.data[key];
events.emitEvent(self, 'remove', [key, before]);
};
var template = Object.create(base);
template.compile = function (self, templateSource) {
self.compiledTemplate = _.template(templateSource);
};
template.render = function (self, values) {
return self.compiledTemplate(values);
};
var view = Object.create(base);
view.create = function (self, viewModel, viewTemplate) {
self = events.create(self);
self.model = viewModel;
self.template = viewTemplate;
events.addListener(self.model, 'change', function () {
view.render(self);
});
return...