templejs - npm Package Compare versions

Comparing version 0.2.11 to 0.2.12

lib/binding/each.js

@@ -83,3 +83,3 @@ var _ = require("underscore"),
 		_.some(this.rows, function(row) {
-			return !!(el = row.binding.find(selector));
+			return !!(el = row.find(selector));
 		});
@@ -94,3 +94,3 @@
 		_.each(this.rows, function(row) {
-			els = els.concat(row.binding.findAll(selector));
+			els = els.concat(row.findAll(selector));
 		});
@@ -97,0 +97,0 @@

lib/binding/element.js

@@ -29,3 +29,4 @@ var _ = require("underscore"),
 
-		return Binding.prototype._mount.apply(this, arguments);
+		Binding.prototype._mount.apply(this, arguments);
+		Binding.prototype._appendTo.call(this, this.node);
 	},
@@ -42,3 +43,2 @@
 		parent.insertBefore(this.node, before);
-		Binding.prototype._appendTo.call(this, this.node);
 	},
@@ -45,0 +45,0 @@

lib/binding/index.js

@@ -109,3 +109,5 @@ var _ = require("underscore"),
 	_mount: function() {
-		_.invoke(this.children, "mount");
+		this.children.slice(0).forEach(function(c) {
+			c.mount();
+		});
 	},
@@ -117,4 +119,6 @@
 
+		this.trigger("mount:before");
 		this._mount.apply(this, arguments);
 		this.trigger("mount");
+		this.trigger("mount:after");
 
@@ -129,3 +133,5 @@ return this;
 	_detach: function() {
-		_.invoke(this.children, "detach");
+		this.children.slice(0).forEach(function(c) {
+			c.detach();
+		});
 	},
@@ -135,5 +141,9 @@
 		if (!this.isMounted()) return this;
+		
+		this.trigger("detach:before");
 		this._detach.apply(this, arguments);
 		delete this._mounted;
 		this.trigger("detach");
+		this.trigger("detach:after");
+
 		return this;
@@ -143,4 +153,4 @@ },
 	_appendTo: function(parent, before) {
-		this.children.forEach(function(child) {
-			child.appendTo(parent, before);
+		this.children.slice(0).forEach(function(c) {
+			c.appendTo(parent, before);
 		});
@@ -151,4 +161,9 @@ },
 		if (!this.isMounted()) return this;
-		this._appendTo(parent, before);
-		this.trigger("append", parent, before);
+		var self = this;
+
+		Deps.nonreactive(function() {
+			self._appendTo(parent, before);
+			self.trigger("append", parent, before);
+		});
+		
 		return this;
@@ -155,0 +170,0 @@ },

lib/binding/react.js

@@ -35,3 +35,2 @@ var _ = require("underscore"),
 			var bindings = this.render.apply(this, args);
-
 			if (bindings != null) this.addChild(bindings);
@@ -38,0 +37,0 @@ this.refreshNodes();

lib/binding/scope.js

@@ -20,3 +20,3 @@ var _ = require("underscore"),
 			var data = model;
-			model = new Model(_.result(this, "defaults"));
+			model = new Model(_.clone(_.result(this, "defaults")));
 			if (!_.isUndefined(data)) model.set([], data);
@@ -23,0 +23,0 @@ }

lib/model.js

@@ -155,5 +155,6 @@ var _ = require("underscore"),
 	// return the value of the model at path, deeply
-	get: function(path) {
-		this.depend(path);
-		return this.getModel(path).value;
+	get: function(path, options) {
+		options = options || {};
+		if (options.depend !== false) this.depend(path);
+		return this.getModel(path, options).value;
 	},
@@ -160,0 +161,0 @@

lib/mustache/arguments.js

@@ -49,9 +49,8 @@ module.exports = (function() {
         peg$c13 = function(s) {
-        		var path = s.join("").trim(),
-        			model = (options.ctx.findModel(path) || options.ctx).getModel(path);
+        		var path = s.join("").trim();
 
         		// we must listen to changes at all deep paths
-        		model.depend("**");
+        		options.ctx.depend(util.joinPathParts(path, "**"));
         		
-        		return model.value;
+        		return options.ctx.get(path);
         	},
@@ -58,0 +57,0 @@ peg$c14 = "true",

lib/mustache/context.js

@@ -5,3 +5,4 @@ var _ = require("underscore"),
 	Model = require("../model"),
-	Observe = require("../observe");
+	Observe = require("../observe"),
+	Deps = require("../deps");
 
@@ -19,3 +20,3 @@ var Context =
 			var data = model;
-			model = new Model(_.result(this, "defaults"));
+			model = new Model(_.clone(_.result(this, "defaults")));
 			if (!_.isUndefined(data)) model.set([], data);
@@ -95,7 +96,7 @@ }
 	// returns the first model whose value at path isn't undefined
-	findModel: function(path) {
+	findModel: function(path, options) {
 		var i, models = this.getModels();
 
 		for (var i in models)
-			if (models[i].get(path) !== void 0)
+			if (models[i].get(path, options) !== void 0)
 				return models[i];
@@ -118,15 +119,19 @@
 
-	get: function(parts) {
+	get: function(parts, options) {
 		var val, model;
 		parts = util.splitPath(parts);
+		options = options || {};
 
 		if (parts[0] === "this") {
 			parts.shift();
-			val = this.models[0].get(parts);
 		} else {
-			model = this.findModel(parts);
-			if (model != null) val = model.get(parts);
+			model = this.findModel(parts, options);
 		}
 
+		if (model == null) model = this.models[0];
+		if (options.model) return model.getModel(parts);
+		
+		val = model.get(parts, options);
 		if (_.isFunction(val)) val = val.call(this);
+		
 		return val;
@@ -140,6 +145,12 @@ },
 	set: function(path) {
-		var model;
-		if (_.isArray(path) || _.isString(path)) model = this.findModel(path);
+		var model, self = this;
+		
+		if (_.isArray(path) || _.isString(path)) {
+			model = this.findModel(path, { depend: false });
+		}
+		
 		if (model == null) model = this.getModel();
-		return model.set.apply(model, arguments);
+		model.set.apply(model, arguments);
+		
+		return this;
 	},
@@ -146,0 +157,0 @@

lib/mustache/index.js

@@ -9,3 +9,4 @@ var Temple = require("../temple"),
 	ArgParser = require("./arguments.js"),
-	Deps = require("../deps");
+	Deps = require("../deps"),
+	debug = require("debug")("temple:mustache");
 
@@ -15,2 +16,3 @@ var Mustache =
 	constructor: function(template, data) {
+		debug("init mustache view");
 		this._partials = {};
@@ -156,2 +158,3 @@ this._components = {};
 
+		debug("rendering mustache view");
 		this.addChild(this.convertTemplate(this._template));
@@ -165,2 +168,36 @@ Context.prototype._mount.call(this);
 
+	renderPartial: function(name, ctx) {
+		debug("init partial binding: '%s'", name);
+
+		if (ctx == null) ctx = this;
+
+		var partial = this.findPartial(name),
+			comps = this._components,
+			self = this,
+			comp, detach;
+
+		if (partial != null) {
+			comp = new partial;
+
+			if (comp instanceof Context) comp.setParentContext(ctx);
+
+			if (comps[name] == null) comps[name] = [];
+			comps[name].push(comp);
+
+			detach = function() {
+				comps[name] = _.without(comps[name], comp);
+				if (comp instanceof Context) comp.setParentContext(null);
+				self.off("detach", detach);
+				comp.off("detach", detach);
+			}
+
+			this.on("detach", detach);
+			comp.on("detach", detach);
+			
+			return comp;
+		}
+
+		return null;
+	},
+
 	convertTemplate: function(template, ctx) {
@@ -174,80 +211,106 @@ if (ctx == null) ctx = this;
 
-		switch(template.type) {
-			case NODE_TYPE.ROOT:
-				return this.convertTemplate(template.children, ctx);
+		return Deps.nonreactive(function() {
+			switch(template.type) {
+				case NODE_TYPE.ROOT:
+					return temple.convertTemplate(template.children, ctx);
 
-			case NODE_TYPE.ELEMENT:
-				var binding = new Temple.Element(template.name);
-				binding.addChild(this.convertTemplate(template.children, ctx));
+				case NODE_TYPE.ELEMENT:
+					var comp = temple.renderPartial(template.name, ctx);
 
-				template.attributes.forEach(function(attr) {
-					temple._attrToDecorator(attr, binding, ctx);
-				});
+					if (comp != null) {
+						if (comp instanceof Context) {
+							comp.on("mount:before", function() {
+								comp.autorun("values", function() {
+									template.attributes.forEach(function(attr) {
+										comp.autorun(function() {
+											var val;
 
-				return binding;
+											if (attr.children.length) {
+												var tpl = attr.children[0];
 
-			case NODE_TYPE.TEXT:
-				return new Temple.Text(template.value);
+												switch(tpl.type) {
+													case NODE_TYPE.INTERPOLATOR:
+													case NODE_TYPE.TRIPLE:
+														val = ctx.get(tpl.value, { model: true }).value;
+														break;
 
-			case NODE_TYPE.INTERPOLATOR:
-			case NODE_TYPE.TRIPLE:
-				var klass = template.type === NODE_TYPE.TRIPLE ? "HTML" : "Text";
+													case NODE_TYPE.TEXT:
+														val = ArgParser.parse(tpl.value, { ctx: ctx });
+														if (val.length === 1) val = val[0];
+														break;
+												}
+											}
 
-				return new Temple[klass](function() {
-					return ctx.get(template.value);
-				});
+											comp.set(attr.name, val);
+										});
+									});
+								});
+							});
 
-			case NODE_TYPE.INVERTED:
-			case NODE_TYPE.SECTION:
-				var inverted = template.type === NODE_TYPE.INVERTED,
-					onRow;
+							comp.on("detach", function() {
+								comp.stopComputation("values");
+							});
+						}
 
-				onRow = function(model, key) {
-					var row = new Context(model);
-					row.addModel(new Temple.Model({ $key: key }));
-					row.setParentContext(ctx);
-					row.addChild(temple.convertTemplate(template.children, row));
+						return comp;
 
-					// for the GC
-					Deps.currentComputation.onInvalidate(function() {
-						row.setParentContext(null);
-					});
+					} else {
+						debug("init element binding: '%s'", template.name);
+						var binding = new Temple.Element(template.name);
+						binding.addChild(temple.convertTemplate(template.children, ctx));
 
-					return row;
-				}
+						template.attributes.forEach(function(attr) {
+							temple._attrToDecorator(attr, binding, ctx);
+						});
 
-				return new Section(ctx, template.value, onRow, inverted);
+						return binding;
+					}
 
-			case NODE_TYPE.PARTIAL:
-				return Deps.nonreactive(function() {
-					var name = template.value,
-						partial = temple.findPartial(name),
-						comps = temple._components,
-						comp, detach;
+				case NODE_TYPE.TEXT:
+					debug("init text binding");
+					return new Temple.Text(decodeEntities(template.value));
 
-					if (partial != null) {
-						comp = new partial;
+				case NODE_TYPE.HTML:
+					debug("init html binding");
+					return new Temple.HTML(template.value);
 
-						if (comp instanceof Context) comp.setParentContext(ctx);
+				case NODE_TYPE.INTERPOLATOR:
+				case NODE_TYPE.TRIPLE:
+					debug("init interpolator binding: '%s'", template.value);
+					var klass = template.type === NODE_TYPE.TRIPLE ? "HTML" : "Text";
 
-						if (comps[name] == null) comps[name] = [];
-						comps[name].push(comp);
+					return new Temple[klass](function() {
+						return ctx.get(template.value);
+					});
 
-						detach = function() {
-							comps[name] = _.without(comps[name], comp);
-							if (comp instanceof Context) comp.setParentContext(null);
-							temple.off("detach", detach);
-							comp.off("detach", detach);
-						}
+				case NODE_TYPE.INVERTED:
+				case NODE_TYPE.SECTION:
+					debug("init interpolator binding: '%s'", template.value);
 
-						temple.on("detach", detach);
-						comp.on("detach", detach);
-						
-						return comp;
+					var inverted = template.type === NODE_TYPE.INVERTED,
+						onRow;
+
+					onRow = function(model, key) {
+						var row = new Context(model);
+						row.addModel(new Temple.Model({ $key: key }));
+						row.setParentContext(ctx);
+						row.addChild(temple.convertTemplate(template.children, row));
+
+						// for the GC
+						Deps.currentComputation.onInvalidate(function() {
+							row.setParentContext(null);
+						});
+
+						return row;
 					}
-				});
 
-			default:
-				console.log(template);
-		}
+					return new Section(ctx, template.value, onRow, inverted);
+
+				case NODE_TYPE.PARTIAL:
+					return temple.renderPartial(template.value, ctx);
+
+				default:
+					console.log(template);
+			}
+		});
 	},
@@ -268,3 +331,3 @@
 			case NODE_TYPE.INTERPOLATOR:
-			case NODE_TYPE.TRIPLE:	
+			case NODE_TYPE.TRIPLE:
 				var val = ctx.get(template.value);
@@ -338,2 +401,3 @@ return val != null ? val.toString() : "";
 				destroyed = false;
+				debug("init decorator '%s'", attr.name);
 
@@ -348,7 +412,3 @@ processed = decorators.map(function(fn) {
 					if (d.parse !== false) {
-						rawargs = convertTemplateToArgs(attr.children)
-							.filter(function(t) { return t.type === NODE_TYPE.TEXT; })
-							.map(function(t) { return t.value; })
-							.join("");
-
+						rawargs = convertTemplateToRawArgs(attr.children);
 						return true;
@@ -363,2 +423,3 @@ }
 				this.autorun(id, function() {
+					debug("updating decorator '%s'", attr.name);
 					var args = [];
@@ -378,2 +439,3 @@
 			binding.on("detach", function() {
+				debug("destroying decorator '%s'", attr.name);
 				this.stopComputation(id);
@@ -390,2 +452,3 @@ destroyed = true;
 			binding.attr(attr.name, function() {
+				debug("updating attribute '%s'", attr.name);
 				return temple.convertStringTemplate(attr.children, ctx);
@@ -398,3 +461,14 @@ });
 	NODE_TYPE: NODE_TYPE,
-	Context: Context
+	Context: Context,
+
+	// converts raw html str to template tree
+	parseHTML: function(str) {
+		return {
+			type: NODE_TYPE.ROOT,
+			children: [ {
+				type: NODE_TYPE.HTML,
+				value: str
+			} ]
+		};
+	}
 });
@@ -421,9 +495,40 @@
 		case NODE_TYPE.INVERTED:
-			throw new Error("Unexpected section in decorator value.");
+			throw new Error("Unexpected section in attribute value.");
 
 		case NODE_TYPE.PARTIAL:
-			throw new Error("Unexpected partial in decorator value.");
+			throw new Error("Unexpected partial in attribute value.");
 	}
 
 	return template;
-}
+}
+
+function convertTemplateToRawArgs(template) {
+	return convertTemplateToArgs(template)
+		.filter(function(t) { return t.type === NODE_TYPE.TEXT; })
+		.map(function(t) { return t.value; })
+		.join("");
+}
+
+
+// cleans html, then converts html entities to unicode
+var decodeEntities = (function() {
+	if (typeof document === "undefined") return;
+
+	// this prevents any overhead from creating the object each time
+	var element = document.createElement('div');
+
+	function decodeHTMLEntities (str) {
+		if(str && typeof str === 'string') {
+			// strip script/html tags
+			str = str.replace(/<script[^>]*>([\S\s]*?)<\/script>/gmi, '');
+			str = str.replace(/<\/?\w(?:[^"'>]|"[^"]*"|'[^']*')*>/gmi, '');
+			element.innerHTML = str;
+			str = element.textContent;
+			element.textContent = '';
+		}
+
+		return str;
+	}
+
+	return decodeHTMLEntities;
+})();

lib/mustache/parse.js

@@ -27,2 +27,4 @@ var Hogan = require("hogan.js"),
 			src += node.text.toString();
+		} else if (node.tag === "\n") {
+			src += "\n";
 		} else {
@@ -29,0 +31,0 @@ src += d[0] + index + d[1];

lib/mustache/types.js

@@ -5,12 +5,13 @@ module.exports = {
 	// XML/HTML
-	TEXT              : 1,
-	ELEMENT           : 2,
-	ATTRIBUTE         : 3,
+	HTML              : 1,
+	TEXT              : 2,
+	ELEMENT           : 3,
+	ATTRIBUTE         : 4,
 	
 	// Mustache
-	INTERPOLATOR      : 4,
-	TRIPLE            : 5,
-	SECTION           : 6,
-	INVERTED          : 7,
-	PARTIAL           : 8
+	INTERPOLATOR      : 5,
+	TRIPLE            : 6,
+	SECTION           : 7,
+	INVERTED          : 8,
+	PARTIAL           : 9
 }

lib/temple.js

@@ -7,6 +7,6 @@ var _ = require("underscore"),
 var Temple =
-module.exports = Binding.Scope.extend({
+module.exports = Binding.ReactScope.extend({
 	constructor: function() {
-		Binding.Scope.apply(this, arguments);
-		this.initialize();
+		Binding.ReactScope.apply(this, arguments);
+		this.initialize.apply(this, arguments);
 	},
@@ -22,3 +22,3 @@ initialize: function(){},
 // class properties/methods
-Temple.VERSION = "0.2.11";
+Temple.VERSION = "0.2.12-alpha";
 Temple.util = util;
@@ -25,0 +25,0 @@

package.json

 {
 	"name": "templejs",
-	"version": "0.2.11",
+	"version": "0.2.12",
 	"description": "A modern JavaScript view framework.",
@@ -19,2 +19,3 @@ "author": "Beneath the Ink <[e-mail]>",
 	"dependencies": {
+		"debug": "1.0.2",
 		"hogan.js": "3.0.2",
@@ -21,0 +22,0 @@ "underscore": "1.6.0"

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

132697

increased by3.26%

Number of package files

28

increased by7.69%

Lines of code

4256

increased by3.8%

Worsened metrics

Dependency count

3

increased by50%

Dependency changes

• + Addeddebug@1.0.2

• + Addeddebug@1.0.2(transitive)

• + Addedms@0.6.2(transitive)