Introducing Epik: micro MVC on top of primish and lodash

Nearly two years ago, I started work on Epitome, an MVC framework for MooTools. And today, it’s pretty stable and a viable project to use, if you have MooTools in your stack, rather than jQuery.

Unfortunately, less and less people use MooTools these days, myself included. This made Epitome redundant – and yet I wanted to continue using the API.

So, without further delays, I present Epik.

API is nearly identical with Epitome, with some slight changes and fixes. If anything, Epik is more powerful and more resilient. Built on top of the tiny class library Primish, it even offers a syntax that is similar to that of MooTools.

Architecture wise, it is built on top of lodash with jQuery or zepto for the views and a RivetsJS adapter for bi-directional model binding.

What does the code look like?

;(function(factory){
        // works under nodejs (CJS) and requirejs (AMD)
	if (typeof define == 'function' && define.amd){
		define([
			'epik/index',
			'epik/model'
		], factory);
	} else if (typeof module != 'undefined' && module.exports){
		module.exports = factory(
			require('epik'),
			require('epik/lib/model')
		);
	}
}).call(this, function(epik, model, big){
        // currency pair model
	var cp = epik.primish({

		extend: model,

		options: {
			refreshMin: 100,
			refreshMax: 2000
		},

		validators: {
			size: function(value){
				return Number(value) == value || 'size needs to be a number';
			}
		},

		defaults: {
			title: '',
			formatter: '0.0000',
			bid: 0,
			ask: 0,
			oldBid: 0,
			oldAsk: 0,
			changeBid: '',
			changeAsk: ''
		},
                
                constructor: function(data){
			this.parent('constructor', data);
			this.set('spread', spreads[this.get('title')] || 1);

			this.formatter = this.get('formatter').replace(/[1-9]/g, '0');
			this.set('formatter', null, true);
			this.maxPips = Number(this.formatter.substring(0, this.formatter.length - 2) + _.random(50,70));
		}
	});


	return cp;
});

Available via web, Bower and npm (node), written with UMD wraps throughout.

For more complete examples, look at the following:

• Currency Pairs demo, repo here: https://github.com/dimitarchristoff/cp, via RivetsJS bindings
• The classic TodoMVC implementation
• Examples in epik repo