mirror of
https://github.com/Jermolene/TiddlyWiki5
synced 2024-11-23 18:17:20 +00:00
Added rerender support to the story macro
Allowing the selective refresh of the story tiddlers
This commit is contained in:
parent
8a22ba2e7b
commit
5b301dc30b
@ -389,6 +389,20 @@ WikiStore.prototype.renderMacro = function(macroName,targetType,tiddler,params,c
|
||||
}
|
||||
};
|
||||
|
||||
/*
|
||||
Re-renders a macro into a node
|
||||
*/
|
||||
WikiStore.prototype.rerenderMacro = function(node,changes,macroName,targetType,tiddler,params,content) {
|
||||
var macro = this.macros[macroName];
|
||||
if(macro) {
|
||||
if(macro.rerender) {
|
||||
macro.rerender(node,changes,targetType,tiddler,this,params,content);
|
||||
} else {
|
||||
node.innerHTML = macro.render(targetType,tiddler,this,params,content);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
/*
|
||||
Refresh a DOM node and it's children so that it reflects the current state of the store
|
||||
node: reference to the DOM node to be refreshed
|
||||
@ -436,7 +450,7 @@ WikiStore.prototype.refreshDomNode = function(node,changes,renderer,tiddler) {
|
||||
}
|
||||
}
|
||||
if(hasChanged) {
|
||||
node.innerHTML = renderer.render(tiddler,this,renderStep);
|
||||
renderer.rerender(node,changes,tiddler,this,renderStep);
|
||||
} else {
|
||||
// If no change, just refresh the children
|
||||
refreshChildNodes(node,renderer,tiddler);
|
||||
|
@ -39,6 +39,25 @@ WikiTextRenderer.prototype.render = function(tiddler,store,renderStep) {
|
||||
}
|
||||
};
|
||||
|
||||
WikiTextRenderer.prototype.rerender = function(node,changes,tiddler,store,renderStep) {
|
||||
renderStep = renderStep || 0;
|
||||
var step = this.renderSteps[renderStep];
|
||||
if(renderStep < this.renderSteps.length) {
|
||||
switch(step.type) {
|
||||
case "main":
|
||||
node.innerHTML = step.handler(tiddler,this,store,utils);
|
||||
break;
|
||||
case "macro":
|
||||
store.rerenderMacro(node,changes,step.macro,
|
||||
step.renderType,
|
||||
tiddler,
|
||||
step.params(tiddler,this,store,utils),
|
||||
step.content(tiddler,this,store,utils));
|
||||
break;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
WikiTextRenderer.prototype.toString = function(type) {
|
||||
var output = [],
|
||||
stitchSplitLabel = function(name,value) {
|
||||
|
@ -9,6 +9,37 @@ title: js/macros/story.js
|
||||
|
||||
var utils = require("../Utils.js");
|
||||
|
||||
// Parse the text of a story tiddler into an array of tiddler titles
|
||||
var parseStory = function(storyText) {
|
||||
var storyLines = storyText.split("\n"),
|
||||
tiddlers = [];
|
||||
for(var t=0; t<storyLines.length; t++) {
|
||||
var title = storyLines[t].trim();
|
||||
if(title !== "") {
|
||||
tiddlers.push(title);
|
||||
}
|
||||
}
|
||||
return tiddlers;
|
||||
};
|
||||
|
||||
// Search the children of a node looking for the required tiddler rendering
|
||||
var searchTiddlerNode = function(node,renderTiddler,renderTemplate) {
|
||||
var renderAs;
|
||||
if(renderTemplate) {
|
||||
renderAs = renderTiddler;
|
||||
renderTiddler = renderTemplate;
|
||||
}
|
||||
while(node !== null) {
|
||||
if(node.getAttribute && node.getAttribute("data-tw-render-tiddler") === renderTiddler) {
|
||||
if(!renderAs || (renderAs && node.getAttribute("data-tw-render-as") == renderAs)) {
|
||||
return node;
|
||||
}
|
||||
}
|
||||
node = node.nextSibling;
|
||||
}
|
||||
return null;
|
||||
};
|
||||
|
||||
exports.macro = {
|
||||
name: "story",
|
||||
types: ["text/html","text/plain"],
|
||||
@ -17,20 +48,52 @@ exports.macro = {
|
||||
template: {byName: true, type: "tiddler", optional: true}
|
||||
},
|
||||
render: function(type,tiddler,store,params) {
|
||||
var tiddlers = store.getTiddlerText(params.story).split("\n"),
|
||||
t,
|
||||
var tiddlers = parseStory(store.getTiddlerText(params.story)),
|
||||
output = [];
|
||||
for(t=0; t<tiddlers.length; t++) {
|
||||
var title = tiddlers[t].trim();
|
||||
if(title !== "") {
|
||||
if(params.template) {
|
||||
output.push(store.renderTiddler(type,params.template,title));
|
||||
} else {
|
||||
output.push(store.renderTiddler(type,title));
|
||||
}
|
||||
for(var t=0; t<tiddlers.length; t++) {
|
||||
if(params.template) {
|
||||
output.push(store.renderTiddler(type,params.template,tiddlers[t]));
|
||||
} else {
|
||||
output.push(store.renderTiddler(type,tiddlers[t]));
|
||||
}
|
||||
}
|
||||
return output.join("\n");
|
||||
},
|
||||
rerender: function(node,changes,type,tiddler,store,params) {
|
||||
/*jslint browser: true */
|
||||
// Get the tiddlers we're supposed to be displaying
|
||||
var targetTiddlers = parseStory(store.getTiddlerText(params.story)),
|
||||
currNode = node.firstChild,
|
||||
nextNode;
|
||||
for(var t=0; t<targetTiddlers.length; t++) {
|
||||
// See if the node we want is already there
|
||||
var tiddlerNode = searchTiddlerNode(currNode,targetTiddlers[t],params.template);
|
||||
if(tiddlerNode === null) {
|
||||
// If not, render the tiddler
|
||||
var tmpNode = document.createElement("div");
|
||||
tmpNode.innerHTML = params.template ?
|
||||
store.renderTiddler(type,params.template,targetTiddlers[t]) :
|
||||
store.renderTiddler(type,targetTiddlers[t]);
|
||||
tiddlerNode = tmpNode.firstChild;
|
||||
node.insertBefore(tiddlerNode,currNode);
|
||||
} else {
|
||||
// Delete any nodes preceding the one we want
|
||||
while(currNode !== tiddlerNode) {
|
||||
nextNode = currNode.nextSibling;
|
||||
node.removeChild(currNode);
|
||||
currNode = nextNode;
|
||||
}
|
||||
// Refresh it
|
||||
store.refreshDomNode(tiddlerNode,changes);
|
||||
currNode = currNode.nextSibling;
|
||||
}
|
||||
}
|
||||
// Remove any unused nodes
|
||||
while(currNode !== null) {
|
||||
nextNode = currNode.nextSibling;
|
||||
node.removeChild(currNode);
|
||||
currNode = nextNode;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user