Refactored macro mechanism

Now there is now longer a dummy DOM element corresponding to the macro
itself. Instead, macros must create a single element child. This allows
us to more easily fit Bootstrap's requirements for HTML layout (eg,
that problem with links in navbars not being recognised). The
refactoring isn't complete, there are still a few bugs to chase down

core/modules/macros/button.js

@@ -40,7 +40,10 @@ exports.executeMacro = function() {
 	if(this.hasParameter("class")) {
 		attributes["class"] = this.params["class"].split(" ");
 	}
-	return [$tw.Tree.Element("button",attributes,[$tw.Tree.Text(this.params.label)])];
+	if(this.classes) {
+		$tw.utils.pushTop(attributes["class"],this.classes);
+	}
+	return $tw.Tree.Element("button",attributes,[$tw.Tree.Text(this.params.label)]);
 };
 
 })();

core/modules/macros/chooser.js

@@ -149,7 +149,7 @@ exports.handleEvent = function(event) {
 
 exports.executeMacro = function() {
 	this.chooserDisplayed = false;
-	return [];
+	return $tw.Tree.Element("div",{},[]);
 };
 
 })();

core/modules/macros/comment.js

@@ -18,7 +18,7 @@ exports.info = {
 };
 
 exports.executeMacro = function() {
-	return [];
+	return null;
 };
 
 

core/modules/macros/download.js

@@ -47,7 +47,10 @@ exports.executeMacro = function() {
 	} else {
 		content.push($tw.Tree.Text("Download \"" + this.downloadFilename + "\""));
 	}
-	return [$tw.Tree.Element("button",attributes,content)];
+	if(this.classes) {
+		attributes["class"] = this.classes.slice(0);
+	}
+	return $tw.Tree.Element("button",attributes,content);
 };
 
 })();

core/modules/macros/echo.js

@@ -20,7 +20,7 @@ exports.info = {
 };
 
 exports.executeMacro = function() {
-	return [$tw.Tree.Text(this.params.text)];
+	return $tw.Tree.Text(this.params.text);
 };
 
 

core/modules/macros/edit/edit.js

@@ -35,11 +35,9 @@ exports.executeMacro = function() {
 	}
 	this.editor = new Editor(this);
 	// Call the editor to generate the child nodes
-	var children = this.editor.getChildren();
-	for(var t=0; t<children.length; t++) {
-		children[t].execute(this.parents,this.tiddlerTitle);
-	}
-	return children;
+	var child = this.editor.getChild();
+	child.execute(this.parents,this.tiddlerTitle);
+	return child;
 };
 
 exports.addEventHandlers = function() {
@@ -60,22 +58,19 @@ exports.refreshInDom = function(changes) {
 	if(this.dependencies.hasChanged(changes,this.tiddlerTitle)) {
 		// Only refresh if the editor lets us
 		if(this.editor.isRefreshable()) {
-			// Remove the previous children
-			while(this.domNode.hasChildNodes()) {
-				this.domNode.removeChild(this.domNode.firstChild);
-			}
-			// Execute the new children
+			// Remove the previous child
+			var parent = this.child.domNode.parentNode,
+				nextSibling = this.child.domNode.nextSibling;
+			parent.removeChild(this.child.domNode);
+			// Execute the macro
 			this.execute(this.parents,this.tiddlerTitle);
 			// Render to the DOM
-			for(t=0; t<this.children.length; t++) {
-				this.children[t].renderInDom(this.domNode);
-			}
+			this.child.renderInDom(parent,nextSibling);
+			this.addEventHandlers();
 		}
 	} else {
 		// Refresh any children
-		for(t=0; t<this.children.length; t++) {
-			this.children[t].refreshInDom(changes);
-		}
+		this.child.refreshInDom(changes);
 	}
 };
 

core/modules/macros/edit/editors/bitmapeditor.js

@@ -16,18 +16,18 @@ function BitmapEditor(macroNode) {
 	this.macroNode = macroNode;
 }
 
-BitmapEditor.prototype.getChildren = function() {
-	return [$tw.Tree.Element("canvas",{
+BitmapEditor.prototype.getChild = function() {
+	return $tw.Tree.Element("canvas",{
 		"class": ["tw-edit-field"]
-	},[])];
+	},[]);
 };
 
 BitmapEditor.prototype.postRenderInDom = function() {
 	var tiddler = this.macroNode.wiki.getTiddler(this.macroNode.tiddlerTitle),
-		canvas = this.macroNode.children[0].domNode,
+		canvas = this.macroNode.child.domNode,
 		currImage = new Image();
-	// Set the macro node itself to be position: relative
-	this.macroNode.domNode.style.position = "relative";
+/////////////////////	// Set the macro node itself to be position: relative
+/////////////////////	this.macroNode.domNode.style.position = "relative";
 	// Get the current bitmap into an image object
 	currImage.src = "data:" + tiddler.fields.type + ";base64," + tiddler.fields.text;
 	// Copy it to the on-screen canvas
@@ -45,14 +45,14 @@ BitmapEditor.prototype.postRenderInDom = function() {
 
 BitmapEditor.prototype.addEventHandlers = function() {
 	var self = this;
-	this.macroNode.domNode.addEventListener("touchstart",function(event) {
+	this.macroNode.child.domNode.addEventListener("touchstart",function(event) {
 			self.brushDown = true;
 			self.strokeStart(event.touches[0].clientX,event.touches[0].clientY);
 			event.preventDefault();
 			event.stopPropagation();
 			return false;
 		},false);
-	this.macroNode.domNode.addEventListener("touchmove",function(event) {
+	this.macroNode.child.domNode.addEventListener("touchmove",function(event) {
 			if(self.brushDown) {
 				self.strokeMove(event.touches[0].clientX,event.touches[0].clientY);
 			}
@@ -60,7 +60,7 @@ BitmapEditor.prototype.addEventHandlers = function() {
 			event.stopPropagation();
 			return false;
 		},false);
-	this.macroNode.domNode.addEventListener("touchend",function(event) {
+	this.macroNode.child.domNode.addEventListener("touchend",function(event) {
 			if(self.brushDown) {
 				self.brushDown = false;
 				self.strokeEnd();
@@ -69,14 +69,14 @@ BitmapEditor.prototype.addEventHandlers = function() {
 			event.stopPropagation();
 			return false;
 		},false);
-	this.macroNode.domNode.addEventListener("mousedown",function(event) {
+	this.macroNode.child.domNode.addEventListener("mousedown",function(event) {
 			self.strokeStart(event.clientX,event.clientY);
 			self.brushDown = true;
 			event.preventDefault();
 			event.stopPropagation();
 			return false;
 		},false);
-	this.macroNode.domNode.addEventListener("mousemove",function(event) {
+	this.macroNode.child.domNode.addEventListener("mousemove",function(event) {
 			if(self.brushDown) {
 				self.strokeMove(event.clientX,event.clientY);
 				event.preventDefault();
@@ -84,7 +84,7 @@ BitmapEditor.prototype.addEventHandlers = function() {
 				return false;
 			}
 		},false);
-	this.macroNode.domNode.addEventListener("mouseup",function(event) {
+	this.macroNode.child.domNode.addEventListener("mouseup",function(event) {
 			if(self.brushDown) {
 				self.brushDown = false;
 				self.strokeEnd();
@@ -97,7 +97,7 @@ BitmapEditor.prototype.addEventHandlers = function() {
 };
 
 BitmapEditor.prototype.adjustCoordinates = function(x,y) {
-	var canvas = this.macroNode.children[0].domNode,
+	var canvas = this.macroNode.child.domNode,
 		canvasRect = canvas.getBoundingClientRect(),
 		scale = canvas.width/canvasRect.width;
 	return {x: (x - canvasRect.left) * scale, y: (y - canvasRect.top) * scale};
@@ -109,7 +109,7 @@ BitmapEditor.prototype.strokeStart = function(x,y) {
 };
 
 BitmapEditor.prototype.strokeMove = function(x,y) {
-	var canvas = this.macroNode.children[0].domNode,
+	var canvas = this.macroNode.child.domNode,
 		ctx = canvas.getContext("2d"),
 		t;
 	// Add the new position to the end of the stroke
@@ -134,7 +134,7 @@ BitmapEditor.prototype.strokeMove = function(x,y) {
 
 BitmapEditor.prototype.strokeEnd = function() {
 	// Copy the bitmap to the off-screen canvas
-	var canvas = this.macroNode.children[0].domNode,
+	var canvas = this.macroNode.child.domNode,
 		ctx = this.currCanvas.getContext("2d");
 	ctx.drawImage(canvas,0,0);
 	// Save the image into the tiddler
@@ -145,7 +145,7 @@ BitmapEditor.prototype.saveChanges = function() {
 	var tiddler = this.macroNode.wiki.getTiddler(this.macroNode.tiddlerTitle);
 	if(tiddler) {
 		// data URIs look like "data:<type>;base64,<text>"
-		var dataURL = this.macroNode.children[0].domNode.toDataURL(tiddler.fields.type,1.0),
+		var dataURL = this.macroNode.child.domNode.toDataURL(tiddler.fields.type,1.0),
 			posColon = dataURL.indexOf(":"),
 			posSemiColon = dataURL.indexOf(";"),
 			posComma = dataURL.indexOf(","),

core/modules/macros/edit/editors/texteditor.js

@@ -16,7 +16,7 @@ function TextEditor(macroNode) {
 	this.macroNode = macroNode;
 }
 
-TextEditor.prototype.getChildren = function() {
+TextEditor.prototype.getChild = function() {
 	var tiddler = this.macroNode.wiki.getTiddler(this.macroNode.tiddlerTitle),
 		field = this.macroNode.hasParameter("field") ? this.macroNode.params.field : "title",
 		value;
@@ -48,12 +48,12 @@ TextEditor.prototype.getChildren = function() {
 		attributes.type = "text";
 		attributes.value = value;
 	}
-	return [$tw.Tree.Element(tagName,attributes,content)];
+	return $tw.Tree.Element("div",{},[$tw.Tree.Element(tagName,attributes,content)]);
 };
 
 TextEditor.prototype.addEventHandlers = function() {
-	this.macroNode.domNode.addEventListener("focus",this,false);
-	this.macroNode.domNode.addEventListener("keyup",this,false);
+	this.macroNode.child.domNode.addEventListener("focus",this,false);
+	this.macroNode.child.domNode.addEventListener("keyup",this,false);
 };
 
 TextEditor.prototype.handleEvent = function(event) {
@@ -70,7 +70,7 @@ TextEditor.prototype.handleEvent = function(event) {
 };
 
 TextEditor.prototype.saveChanges = function() {
-	var text = this.macroNode.children[0].domNode.value,
+	var text = this.macroNode.child.children[0].domNode.value,
 		tiddler = this.macroNode.wiki.getTiddler(this.macroNode.tiddlerTitle);
 	if(tiddler && text !== tiddler.fields[this.macroNode.params.field]) {
 		var update = {};
@@ -80,9 +80,9 @@ TextEditor.prototype.saveChanges = function() {
 };
 
 TextEditor.prototype.fixHeight = function() {
-	if(this.macroNode.children[0] && this.macroNode.children[0].domNode) {
-		var wrapper = this.macroNode.domNode,
-			textarea = this.macroNode.children[0].domNode;
+	if(this.macroNode.child && this.macroNode.child.domNode) {
+		var wrapper = this.macroNode.child.domNode,
+			textarea = this.macroNode.child.children[0].domNode;
 		// Set the text area height to 1px temporarily, which allows us to read the true scrollHeight
 		var prevWrapperHeight = wrapper.style.height;
 		wrapper.style.height = textarea.style.height + "px";
@@ -99,7 +99,7 @@ TextEditor.prototype.postRenderInDom = function() {
 
 TextEditor.prototype.isRefreshable = function() {
 	// Don't refresh the editor if it contains the caret or selection
-	return document.activeElement !== this.macroNode.children[0].domNode;
+	return document.activeElement !== this.macroNode.child.children[0].domNode;
 };
 
 exports["text/x-tiddlywiki"] = TextEditor;

core/modules/macros/image.js

@@ -24,24 +24,21 @@ exports.info = {
 exports.executeMacro = function() {
 	if(this.wiki.tiddlerExists(this.params.src)) {
 		var imageTree = this.wiki.parseTiddler(this.params.src).tree,
-			cloneImage = [];
-		for(var t=0; t<imageTree.length; t++) {
-			cloneImage.push(imageTree[t].clone());
-		}
+			cloneImage = imageTree[0].clone();
 		if(this.params.text) {
-			return [$tw.Tree.Element("div",{
+			return $tw.Tree.Element("div",{
 					alt: this.params.text,
 					title: this.params.text
-				},cloneImage)];
+				},[cloneImage]);
 		} else {
 			return cloneImage;	
 		}
 	} else {
-		return [$tw.Tree.Element("img",{
+		return $tw.Tree.Element("img",{
 			src: this.params.src,
 			alt: this.params.text,
 			title: this.params.text
-		})];
+		});
 	}
 };
 

core/modules/macros/include.js

@@ -42,11 +42,11 @@ exports.executeMacro = function() {
 				result.push(this.wiki.serializeTiddler(titles[t],as));
 			}
 		}
-		return [$tw.Tree.Element("pre",{},[
+		return $tw.Tree.Element("pre",{},[
 				$tw.Tree.Text(result.join("\n"))
-			])];
+			]);
 	}
-	return [];
+	return null;
 };
 
 

core/modules/macros/link.js

@@ -72,17 +72,18 @@ exports.executeMacro = function() {
 			linkInfo.attributes["class"].push("tw-tiddlylink-resolves");
 		}
 	}
+	if(this.classes) {
+		$tw.utils.pushTop(linkInfo.attributes["class"],this.classes);
+	}
 	// Create the link
-	var children;
+	var child;
 	if(linkInfo.suppressLink) {
-		children = this.content;
+		child = $tw.Tree.Element("span",{},this.content);
 	} else { 
-		children = [$tw.Tree.Element("a",linkInfo.attributes,this.content)];
+		child = $tw.Tree.Element("a",linkInfo.attributes,this.content);
 	}
-	for(var t=0; t<children.length; t++) {
-		children[t].execute(this.parents,this.tiddlerTitle);
-	}
-	return children;
+	child.execute(this.parents,this.tiddlerTitle);
+	return child;
 };
 
 })();

core/modules/macros/list.js

@@ -52,7 +52,8 @@ exports.executeMacro = function() {
 		template = this.params.template ? this.wiki.getTiddler(this.params.template) : null,
 		children = [],
 		t,
-		parents = this.parents;
+		parents = this.parents,
+		attributes = {};
 	if(template) {
 		parents = parents.slice(0);
 		parents.push(template.title);
@@ -62,8 +63,11 @@ exports.executeMacro = function() {
 	var handler = handlers[this.params.type];
 	handler = handler || handlers.all;
 	var tiddlers = handler(this.wiki);
+	if(this.classes) {
+		$tw.utils.pushTop(attributes["class"],this.classes);
+	}
 	if(tiddlers.length === 0) {
-		return [$tw.Tree.Text(this.params.emptyMessage || "")];
+		return $tw.Tree.Text(this.params.emptyMessage || "");
 	} else {
 		var templateTree = this.wiki.parseText(templateType,templateText).tree;
 		for(t=0; t<tiddlers.length; t++) {
@@ -75,7 +79,7 @@ exports.executeMacro = function() {
 			listNode.execute(parents,tiddlers[t]);
 			children.push(listNode);
 		}
-		return [$tw.Tree.Element("ul",null,children)];
+		return $tw.Tree.Element("ul",attributes,children);
 	}
 };
 

core/modules/macros/slider.js

@@ -89,7 +89,7 @@ exports.getSliderChildren = function() {
 
 exports.handleEvent = function(event) {
 	if(event.type === "click") {
-		if(event.target === this.domNode.firstChild.firstChild) {
+		if(event.target === this.child.domNode.firstChild) {
 			this.isOpen = !this.isOpen;
 			if(!this.saveOpenState()) {
 				this.refreshInDom({});
@@ -115,6 +115,9 @@ exports.executeMacro = function() {
 	if(this.hasParameter("class")) {
 		attributes["class"].push(this.params["class"]);
 	}
+	if(this.classes) {
+		$tw.utils.pushTop(attributes["class"],this.classes);
+	}
 	if(this.hasParameter("state")) {
 		attributes["data-tw-slider-type"] = this.params.state;
 	}
@@ -122,7 +125,7 @@ exports.executeMacro = function() {
 		attributes.alt = this.params.tooltip;
 		attributes.title = this.params.tooltip;
 	}
-	var children = $tw.Tree.Element("span",
+	var child = $tw.Tree.Element("span",
 		attributes,
 		[
 			$tw.Tree.Element("a",
@@ -141,8 +144,8 @@ exports.executeMacro = function() {
 			)
 		]
 	);
-	children.execute(this.parents,this.tiddlerTitle);
-	return [children];
+	child.execute(this.parents,this.tiddlerTitle);
+	return child;
 };
 
 exports.refreshInDom = function(changes) {
@@ -152,22 +155,20 @@ exports.refreshInDom = function(changes) {
 		this.isOpen = this.getOpenState();
 	}
 	// Render the children if the slider is open and we don't have any children yet
-	if(this.isOpen && this.children[0].children[1].children.length === 0) {
+	if(this.isOpen && this.child.children[1].children.length === 0) {
 		// Remove the existing dom node for the body
-		this.children[0].domNode.removeChild(this.children[0].children[1].domNode);
+		this.child.domNode.removeChild(this.child.children[1].domNode);
 		// Get the slider children and execute it
-		this.children[0].children[1].children = this.getSliderChildren();
-		this.children[0].children[1].execute(this.parents,this.tiddlerTitle);
-		this.children[0].children[1].renderInDom(this.children[0].domNode,null);
+		this.child.children[1].children = this.getSliderChildren();
+		this.child.children[1].execute(this.parents,this.tiddlerTitle);
+		this.child.children[1].renderInDom(this.child.domNode,null);
 		needChildrenRefresh = false; // Don't refresh the children if we've just created them
 	}
 	// Set the visibility of the slider children
-	this.children[0].children[1].domNode.style.display = this.isOpen ? "block" : "none";
+	this.child.children[1].domNode.style.display = this.isOpen ? "block" : "none";
 	// Refresh any children
 	if(needChildrenRefresh) {
-		for(var t=0; t<this.children.length; t++) {
-			this.children[t].refreshInDom(changes);
-		}
+		this.child.refreshInDom(changes);
 	}
 };
 

core/modules/macros/story/story.js

@@ -158,7 +158,11 @@ exports.executeMacro = function() {
 		m.execute(this.parents,this.tiddlerTitle);
 		this.storyNode.children.push($tw.Tree.Element("div",{"class": "tw-story-element"},[m]));
 	}
-	return [this.contentNode,this.storyNode];
+	var attributes = {"class": []};
+	if(this.classes) {
+		$tw.utils.pushTop(attributes["class"],this.classes);
+	}
+	return $tw.Tree.Element("div",attributes,[this.contentNode,this.storyNode]);
 };
 
 exports.postRenderInDom = function() {
@@ -238,9 +242,8 @@ exports.refreshInDom = function(changes) {
 			this.storyNode.children.splice(story.tiddlers.length,this.storyNode.children.length-story.tiddlers.length);
 		}
 	} else {
-		// If our dependencies didn't change, just refresh the children
-		for(t=0; t<this.children.length; t++) {
-			this.children[t].refreshInDom(changes);
+		if(this.child) {
+			this.child.refreshInDom(changes);
 		}
 	}
 	// Clear the details of the last navigation

core/modules/macros/tiddler.js

@@ -124,7 +124,7 @@ exports.executeMacro = function() {
 		attributes["class"].push("tw-tiddler-missing");
 	}
 	// Return the children
-	return [$tw.Tree.Element("div",attributes,childrenClone)];
+	return $tw.Tree.Element("div",attributes,childrenClone);
 };
 
 exports.refreshInDom = function(changes) {
@@ -135,23 +135,18 @@ exports.refreshInDom = function(changes) {
 		renderTitle = this.params.template;
 	}
 	if(renderTitle) {
-		$tw.utils.toggleClass(this.children[0].domNode,"tw-tiddler-missing",!this.wiki.tiddlerExists(renderTitle));
+		$tw.utils.toggleClass(this.child.domNode,"tw-tiddler-missing",!this.wiki.tiddlerExists(renderTitle));
 	}
 	// Rerender the tiddler if it is impacted by the changes
 	if(this.dependencies.hasChanged(changes,this.tiddlerTitle)) {
 		// Manually reexecute and rerender this macro
-		while(this.domNode.hasChildNodes()) {
-			this.domNode.removeChild(this.domNode.firstChild);
-		}
+		var parent = this.child.domNode.parentNode,
+			nextSibling = this.child.domNode.nextSibling;
+		parent.removeChild(this.child.domNode);
 		this.execute(this.parents,this.tiddlerTitle);
-		for(t=0; t<this.children.length; t++) {
-			this.children[t].renderInDom(this.domNode);
-		}
+		this.child.renderInDom(parent,nextSibling);
 	} else {
-		// Refresh any children
-		for(t=0; t<this.children.length; t++) {
-			this.children[t].refreshInDom(changes);
-		}
+		this.child.refreshInDom(changes);
 	}
 };
 

core/modules/macros/version.js

@@ -19,7 +19,7 @@ exports.info = {
 };
 
 exports.executeMacro = function() {
-	return [$tw.Tree.Text($tw.utils.getVersionString())];
+	return $tw.Tree.Text($tw.utils.getVersionString());
 };
 
 })();

core/modules/macros/video.js

@@ -29,29 +29,29 @@ exports.executeMacro = function() {
 		videoHeight = this.params.height || 360;
 	switch(videoType) {
 		case "vimeo":
-			return [$tw.Tree.Element("iframe",{
+			return $tw.Tree.Element("iframe",{
 				src: "http://player.vimeo.com/video/" + src + "?autoplay=0",
 				width: videoWidth,
 				height: videoHeight,
 				frameborder: 0
-			})];
+			});
 		case "youtube":
-			return [$tw.Tree.Element("iframe",{
+			return $tw.Tree.Element("iframe",{
 				type: "text/html",
 				src: "http://www.youtube.com/embed/" + src,
 				width: videoWidth,
 				height: videoHeight,
 				frameborder: 0
-			})];
+			});
 		case "archiveorg":
-			return [$tw.Tree.Element("iframe",{
+			return $tw.Tree.Element("iframe",{
 				src: "http://www.archive.org/embed/" + src,
 				width: videoWidth,
 				height: videoHeight,
 				frameborder: 0
-			})];
+			});
 		default:
-			return [];
+			return null;
 	}
 };
 

core/modules/macros/view.js

@@ -52,7 +52,7 @@ exports.executeMacro = function() {
 	switch(this.params.format) {
 		case "link":
 			if(value === undefined) {
-				return [];
+				return $tw.Tree.Element("span",{},[]);
 			} else {
 				var link = $tw.Tree.Macro("link",{
 											srcParams: {to: value},
@@ -60,7 +60,7 @@ exports.executeMacro = function() {
 											wiki: this.wiki
 										});
 				link.execute(parents,this.tiddlerTitle);
-				return [link];
+				return $tw.Tree.Element("span",{},[link]);
 			}
 			break;
 		case "wikified":
@@ -81,13 +81,13 @@ exports.executeMacro = function() {
 			for(t=0; t<childrenClone.length; t++) {
 				childrenClone[t].execute(parents,this.tiddlerTitle);
 			}
-			return childrenClone;
+			return $tw.Tree.Element(this.isBlock ? "div" : "span",{},childrenClone);
 		case "date":
 			var template = this.params.template || "DD MMM YYYY";
 			if(value === undefined) {
-				return [];
+				return $tw.Tree.Element("span",{},[]);
 			} else {
-				return [$tw.Tree.Text($tw.utils.formatDateString(value,template))];
+				return $tw.Tree.Text($tw.utils.formatDateString(value,template));
 			}
 			break;
 		default: // "text"
@@ -96,12 +96,12 @@ exports.executeMacro = function() {
 				value = tiddler.getFieldString(field);
 			}
 			if(value === undefined || value === null) {
-				return [];
+				return $tw.Tree.Element("span",{},[]);
 			} else {
-				return [$tw.Tree.Text(value)];
+				return $tw.Tree.Text(value);
 			}
 	}
-	return [];
+	return $tw.Tree.Element("span",{},[]);
 };
 
 })();

core/modules/macros/zoomer.js

@@ -100,7 +100,7 @@ exports.handleEvent = function(event) {
 
 exports.executeMacro = function() {
 	this.inZoomer = false;
-	return [];
+	return $tw.Tree.Element("div",{},[]);
 };
 
 })();

core/modules/treenodes/element.js

@@ -133,17 +133,6 @@ Element.prototype.refreshInDom = function(changes) {
 	}
 };
 
-Element.prototype.broadcastEvent = function(event) {
-	if(this.children) {
-		for(var t=0; t<this.children.length; t++) {
-			if(!this.children[t].broadcastEvent(event)) {
-				return false;
-			}
-		}
-	}
-	return true;
-};
-
 Element.prototype.addClass = function(className) {
 	if(typeof this.attributes["class"] === "string") {
 		this.attributes["class"] = this.attributes["class"].split(" ");

core/modules/treenodes/macro.js

@@ -166,62 +166,31 @@ Macro.prototype.execute = function(parents,tiddlerTitle) {
 	// Save the context info for use when we're refreshing it
 	this.tiddlerTitle = tiddlerTitle;
 	this.parents = parents;
-	// Execute the macro to generate its children, and recursively execute them
-	this.children = this.executeMacro.call(this);
+	// Execute the macro to generate its node and children, and recursively execute them
+	this.child = this.executeMacro.call(this);
 };
 
 Macro.prototype.render = function(type) {
-	var output = [];
-	for(var t=0; t<this.children.length; t++) {
-		output.push(this.children[t].render(type));
-	}
-	return output.join("");
+	return this.child ? this.child.render(type) : "";
 };
 
 Macro.prototype.renderInDom = function(parentDomNode,insertBefore) {
-	// Create the wrapper node for the macro
-	var domNode = document.createElement(this.isBlock ? "div" : "span");
-	this.domNode = domNode;
-	if(insertBefore) {
-		parentDomNode.insertBefore(domNode,insertBefore);	
-	} else {
-		parentDomNode.appendChild(domNode);
+	if(this.child) {
+		this.child.renderInDom(parentDomNode,insertBefore);
+		this.addEventHandlers();
+		this.postRenderInDom();
 	}
-	// Add classes and some debugging information to it
-	if(this.classes) {
-		domNode.setAttribute("class",this.classes.join(" "));
-	}
-	domNode.setAttribute("data-tw-macro",this.macroName);
-	// Ask the macro to add event handlers to the node
-	this.addEventHandlers();
-	// Render the content of the macro
-	for(var t=0; t<this.children.length; t++) {
-		this.children[t].renderInDom(domNode);
-	}
-	this.postRenderInDom();
 };
 
 Macro.prototype.addEventHandlers = function() {
-	if(this.info.events) {
+	if(this.info.events && this.child) {
 		for(var t=0; t<this.info.events.length; t++) {
 			// Register this macro node to handle the event via the handleEvent() method
-			this.domNode.addEventListener(this.info.events[t],this,false);
+			this.child.domNode.addEventListener(this.info.events[t],this,false);
 		}
 	}
 };
 
-Macro.prototype.broadcastEvent = function(event) {
-	if(!this.handleEvent(event)) {
-		return false;
-	}
-	for(var t=0; t<this.children.length; t++) {
-		if(!this.children[t].broadcastEvent(event)) {
-			return false;
-		}
-	}
-	return true;
-};
-
 Macro.prototype.postRenderInDom = function() {
 	// Do nothing, individual macros can override
 };
@@ -234,9 +203,9 @@ Macro.prototype.refresh = function(changes) {
 		// Re-execute the macro if so
 		this.execute(this.parents,this.tiddlerTitle);
 	} else {
-		// Refresh any children
-		for(t=0; t<this.children.length; t++) {
-			this.children[t].refresh(changes);
+		// Refresh the child node
+		if(this.child) {
+			this.child.refresh(changes);
 		}
 	}
 };
@@ -247,17 +216,15 @@ Macro.prototype.refreshInDom = function(changes) {
 	// Check if any of the dependencies of this macro node have changed
 	if(this.dependencies.hasChanged(changes,this.tiddlerTitle)) {
 		// Manually reexecute and rerender this macro
-		while(this.domNode.hasChildNodes()) {
-			this.domNode.removeChild(this.domNode.firstChild);
-		}
+		var parent = this.child.domNode.parentNode,
+			nextSibling = this.child.domNode.nextSibling;
+		parent.removeChild(this.child.domNode);
 		this.execute(this.parents,this.tiddlerTitle);
-		for(t=0; t<this.children.length; t++) {
-			this.children[t].renderInDom(this.domNode);
-		}
+		this.child.renderInDom(parent,nextSibling);
+		this.addEventHandlers();
 	} else {
-		// Refresh any children
-		for(t=0; t<this.children.length; t++) {
-			this.children[t].refreshInDom(changes);
+		if(this.child) {
+			this.child.refreshInDom(changes);
 		}
 	}
 };

core/modules/treenodes/node.js

@@ -30,13 +30,6 @@ Node.prototype.clone = function() {
 	return this;
 };
 
-/*
-Fire an event at a node which is also broadcast to any child nodes
-*/
-Node.prototype.broadcastEvent = function(event) {
-	return true; // true means that the event wasn't handled by this node
-};
-
 /*
 Execute a node and derive its child nodes
 	parents: array of titles of each transcluded parent tiddler (used for detecting recursion)