Component based mustache example

examples/client_mustache_component.html

@@ -7,6 +7,7 @@
 $(function(){
 	var self = this;
 	var components = {};
+	window.components = {};
 
 	function handleComponent(){
 		var name = $(this).attr('component');
@@ -14,19 +15,29 @@ $(function(){
 
 		if (components[name]) return;
 		components[name] = true;
-		
+
 		$.ajax({dataType:'text', url: name+'.css',success:function(data){
 			$('<style>').appendTo('body').text(data);
 		}});
 		$.ajax({dataType:'text', url: name+'.html',success:function(data){
 			template = data;
 			$.ajax({dataType:'text', url: name+'.js',success:function(data){
-				var fn = eval(data);
+				var h = window.onerror;
+				window.onerror = function(msg, url, line, col, error) {
+					var extra = !col ? '' : '\ncolumn: ' + col;
+					extra += !error ? '' : '\nerror: ' + error;
+					url = !url?name+'.js':url;
+					alert("Error: " + msg + "\nurl: " + url + "\nline: " + line + extra);
+					return true;
+				};
+				$('<script>').appendTo('body').text(data);
+				window.onerror = h;
+				if (!window.components[name]) alert('could not load '+name+'.js');
 				$(['div.component[component="'+name+'"]']).each(function(){
-					fn($(this),template);
+					window.components[name]($(this),template);
 				});
 			}});
-		}});		
+		}});
 	}
 
 	$('div.component').each(handleComponent);

examples/post-list.js

@@ -1,4 +1,4 @@
-(function (element, template) {
+window.components['post-list'] = function (element, template) {
 	var self = this;
 	var url = '../api.php/posts';
 	self.edit = function() {
@@ -35,4 +35,4 @@
 	element.on('click','a.edit',self.edit)
 	element.on('click','a.delete',self.delete)
 	self.post();
-});
+};