tears.js mini-mvc

// myapp.js

$(function() {
	var tabs=function(id) {
		$(".tab").removeClass("active").filter(".tab[href*='" + id + "']").addClass("active");
		$(".tabview").hide().filter("#" + id).show();
	}

	window.realDate=function(timestamp) {
		var date = new Date(timestamp*1000);
		var hours = date.getHours();
		var minutes = date.getMinutes();
		var seconds = date.getSeconds();
		return hours + ':' + minutes + ':' + seconds;
	}

	tears.route({
		'activeSurveysAction': function() {
			tabs("activeSurveys");
			tears.view("#activeSurveys", {
				'activeSurveys': <?php echo json_encode($activeSurveys); ?>,
				'rowView': {
					'click': function() {
						console.log(this);
					}
				}
			});
		},
		'archivedSurveysAction': function() {
			tabs("archivedSurveys");
			tears.view("#archivedSurveys", {
				'archivedSurveys': [],
				'rowView': {
					'click': function() {
						console.log(this);
					}
				}
			});
		},
		'editAction': function(args) {
			console.log(args);
		},
		'defaultAction': function() {
			this.activeSurveysAction();
		}
	});
});

// tears.js

(function() {
	var root = this,
		tears = {};

	tears.route=function(routes) {
		routes.init = (routes.init) ? routes.init() && false : false;
		var hashPart = window.location.hash.replace("#", "");
		if (hashPart.substr(0,1) == "/") hashPart = hashPart.substr(1);
		if (!routes[hashPart + "Action"]) hashPart = 'default';
		$.proxy(routes[hashPart + "Action"](hashPart.split("/")), routes);
		$(window).off('hashchange.tears').on('hashchange.tears', function() { tears.route(routes) });
	}

	tears.tmpl=function(str, data) {
		var fn = new Function("obj",
			"var p=[],print=function(){p.push.apply(p,arguments);};" +
			"with(obj){p.push('" +
			str
				.trim()
				.replace(/&lt;%/g, '<%').replace(/%&gt;/g, '%>')
				.replace(/[\r\t\n]/g, " ")
				.split("<%").join("\t")
				.replace(/((^|%>)[^\t]*)'/g, "$1\r")
				.replace(/\t=(.*?)%>/g, "',$1,'")
				.split("\t").join("');")
				.split("%>").join("; p.push('")
				.split("\r").join("\\'")
			+ "');}return p.join('');");
		return data ? fn( data ) : fn;
	};

	var cache = {};
	tears.render=function(selector, data, events) {
		var isArray = data instanceof Array;
		if (!isArray) data = [data];

		var el = $(selector);
		if (!el.length || !el.html) return;

		var emt = {},
			emts = [],
			render = (typeof(selector) == String) ? (cache[selector] || (cache[selector] = tears.tmpl(el.html()))) : tears.tmpl(el.html());

		for (var i=0,max=data.length;i<max;i++) {
			$.extend(data[i], {'index': i});
			emt = $(render(data[i]));
			if (events) {
				var boundEvents = {};
				$.each(events, function(index, ev) { boundEvents[index] = $.proxy(ev, data[i]); });
				$(emt).on(boundEvents);
			}
			emts.push(emt);
		}
		el.html(emts);
	}

	tears.renderOnce=function(selector, data, events) {
		if (cache[selector]) return;
		tears.render(selector, data, events);
	}

	tears.view=function(selector, attributes) {
		var el = $(selector);
		if (!el.length || !el.html) return;

		var children = el.find("[meta]");
		for (var x=0,max=children.length;x<max;x++) {
			var child=$(children[x]), ctx=$.extend({'el': child}, attributes);
			tears.tmpl(child.attr("meta"), ctx);
		}
		children.attr("meta", "");
	}

	root.tears = tears;
})();