mirror of
https://github.com/Jermolene/TiddlyWiki5
synced 2024-12-25 01:20:30 +00:00
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
This commit is contained in:
parent
121d491af2
commit
04e91245cb
@ -40,7 +40,10 @@ exports.executeMacro = function() {
|
|||||||
if(this.hasParameter("class")) {
|
if(this.hasParameter("class")) {
|
||||||
attributes["class"] = this.params["class"].split(" ");
|
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)]);
|
||||||
};
|
};
|
||||||
|
|
||||||
})();
|
})();
|
||||||
|
@ -149,7 +149,7 @@ exports.handleEvent = function(event) {
|
|||||||
|
|
||||||
exports.executeMacro = function() {
|
exports.executeMacro = function() {
|
||||||
this.chooserDisplayed = false;
|
this.chooserDisplayed = false;
|
||||||
return [];
|
return $tw.Tree.Element("div",{},[]);
|
||||||
};
|
};
|
||||||
|
|
||||||
})();
|
})();
|
||||||
|
@ -18,7 +18,7 @@ exports.info = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
exports.executeMacro = function() {
|
exports.executeMacro = function() {
|
||||||
return [];
|
return null;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
|
@ -47,7 +47,10 @@ exports.executeMacro = function() {
|
|||||||
} else {
|
} else {
|
||||||
content.push($tw.Tree.Text("Download \"" + this.downloadFilename + "\""));
|
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);
|
||||||
};
|
};
|
||||||
|
|
||||||
})();
|
})();
|
||||||
|
@ -20,7 +20,7 @@ exports.info = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
exports.executeMacro = function() {
|
exports.executeMacro = function() {
|
||||||
return [$tw.Tree.Text(this.params.text)];
|
return $tw.Tree.Text(this.params.text);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
|
@ -35,11 +35,9 @@ exports.executeMacro = function() {
|
|||||||
}
|
}
|
||||||
this.editor = new Editor(this);
|
this.editor = new Editor(this);
|
||||||
// Call the editor to generate the child nodes
|
// Call the editor to generate the child nodes
|
||||||
var children = this.editor.getChildren();
|
var child = this.editor.getChild();
|
||||||
for(var t=0; t<children.length; t++) {
|
child.execute(this.parents,this.tiddlerTitle);
|
||||||
children[t].execute(this.parents,this.tiddlerTitle);
|
return child;
|
||||||
}
|
|
||||||
return children;
|
|
||||||
};
|
};
|
||||||
|
|
||||||
exports.addEventHandlers = function() {
|
exports.addEventHandlers = function() {
|
||||||
@ -60,22 +58,19 @@ exports.refreshInDom = function(changes) {
|
|||||||
if(this.dependencies.hasChanged(changes,this.tiddlerTitle)) {
|
if(this.dependencies.hasChanged(changes,this.tiddlerTitle)) {
|
||||||
// Only refresh if the editor lets us
|
// Only refresh if the editor lets us
|
||||||
if(this.editor.isRefreshable()) {
|
if(this.editor.isRefreshable()) {
|
||||||
// Remove the previous children
|
// Remove the previous child
|
||||||
while(this.domNode.hasChildNodes()) {
|
var parent = this.child.domNode.parentNode,
|
||||||
this.domNode.removeChild(this.domNode.firstChild);
|
nextSibling = this.child.domNode.nextSibling;
|
||||||
}
|
parent.removeChild(this.child.domNode);
|
||||||
// Execute the new children
|
// Execute the macro
|
||||||
this.execute(this.parents,this.tiddlerTitle);
|
this.execute(this.parents,this.tiddlerTitle);
|
||||||
// Render to the DOM
|
// Render to the DOM
|
||||||
for(t=0; t<this.children.length; t++) {
|
this.child.renderInDom(parent,nextSibling);
|
||||||
this.children[t].renderInDom(this.domNode);
|
this.addEventHandlers();
|
||||||
}
|
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
// Refresh any children
|
// Refresh any children
|
||||||
for(t=0; t<this.children.length; t++) {
|
this.child.refreshInDom(changes);
|
||||||
this.children[t].refreshInDom(changes);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -16,18 +16,18 @@ function BitmapEditor(macroNode) {
|
|||||||
this.macroNode = macroNode;
|
this.macroNode = macroNode;
|
||||||
}
|
}
|
||||||
|
|
||||||
BitmapEditor.prototype.getChildren = function() {
|
BitmapEditor.prototype.getChild = function() {
|
||||||
return [$tw.Tree.Element("canvas",{
|
return $tw.Tree.Element("canvas",{
|
||||||
"class": ["tw-edit-field"]
|
"class": ["tw-edit-field"]
|
||||||
},[])];
|
},[]);
|
||||||
};
|
};
|
||||||
|
|
||||||
BitmapEditor.prototype.postRenderInDom = function() {
|
BitmapEditor.prototype.postRenderInDom = function() {
|
||||||
var tiddler = this.macroNode.wiki.getTiddler(this.macroNode.tiddlerTitle),
|
var tiddler = this.macroNode.wiki.getTiddler(this.macroNode.tiddlerTitle),
|
||||||
canvas = this.macroNode.children[0].domNode,
|
canvas = this.macroNode.child.domNode,
|
||||||
currImage = new Image();
|
currImage = new Image();
|
||||||
// Set the macro node itself to be position: relative
|
///////////////////// // Set the macro node itself to be position: relative
|
||||||
this.macroNode.domNode.style.position = "relative";
|
///////////////////// this.macroNode.domNode.style.position = "relative";
|
||||||
// Get the current bitmap into an image object
|
// Get the current bitmap into an image object
|
||||||
currImage.src = "data:" + tiddler.fields.type + ";base64," + tiddler.fields.text;
|
currImage.src = "data:" + tiddler.fields.type + ";base64," + tiddler.fields.text;
|
||||||
// Copy it to the on-screen canvas
|
// Copy it to the on-screen canvas
|
||||||
@ -45,14 +45,14 @@ BitmapEditor.prototype.postRenderInDom = function() {
|
|||||||
|
|
||||||
BitmapEditor.prototype.addEventHandlers = function() {
|
BitmapEditor.prototype.addEventHandlers = function() {
|
||||||
var self = this;
|
var self = this;
|
||||||
this.macroNode.domNode.addEventListener("touchstart",function(event) {
|
this.macroNode.child.domNode.addEventListener("touchstart",function(event) {
|
||||||
self.brushDown = true;
|
self.brushDown = true;
|
||||||
self.strokeStart(event.touches[0].clientX,event.touches[0].clientY);
|
self.strokeStart(event.touches[0].clientX,event.touches[0].clientY);
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
event.stopPropagation();
|
event.stopPropagation();
|
||||||
return false;
|
return false;
|
||||||
},false);
|
},false);
|
||||||
this.macroNode.domNode.addEventListener("touchmove",function(event) {
|
this.macroNode.child.domNode.addEventListener("touchmove",function(event) {
|
||||||
if(self.brushDown) {
|
if(self.brushDown) {
|
||||||
self.strokeMove(event.touches[0].clientX,event.touches[0].clientY);
|
self.strokeMove(event.touches[0].clientX,event.touches[0].clientY);
|
||||||
}
|
}
|
||||||
@ -60,7 +60,7 @@ BitmapEditor.prototype.addEventHandlers = function() {
|
|||||||
event.stopPropagation();
|
event.stopPropagation();
|
||||||
return false;
|
return false;
|
||||||
},false);
|
},false);
|
||||||
this.macroNode.domNode.addEventListener("touchend",function(event) {
|
this.macroNode.child.domNode.addEventListener("touchend",function(event) {
|
||||||
if(self.brushDown) {
|
if(self.brushDown) {
|
||||||
self.brushDown = false;
|
self.brushDown = false;
|
||||||
self.strokeEnd();
|
self.strokeEnd();
|
||||||
@ -69,14 +69,14 @@ BitmapEditor.prototype.addEventHandlers = function() {
|
|||||||
event.stopPropagation();
|
event.stopPropagation();
|
||||||
return false;
|
return false;
|
||||||
},false);
|
},false);
|
||||||
this.macroNode.domNode.addEventListener("mousedown",function(event) {
|
this.macroNode.child.domNode.addEventListener("mousedown",function(event) {
|
||||||
self.strokeStart(event.clientX,event.clientY);
|
self.strokeStart(event.clientX,event.clientY);
|
||||||
self.brushDown = true;
|
self.brushDown = true;
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
event.stopPropagation();
|
event.stopPropagation();
|
||||||
return false;
|
return false;
|
||||||
},false);
|
},false);
|
||||||
this.macroNode.domNode.addEventListener("mousemove",function(event) {
|
this.macroNode.child.domNode.addEventListener("mousemove",function(event) {
|
||||||
if(self.brushDown) {
|
if(self.brushDown) {
|
||||||
self.strokeMove(event.clientX,event.clientY);
|
self.strokeMove(event.clientX,event.clientY);
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
@ -84,7 +84,7 @@ BitmapEditor.prototype.addEventHandlers = function() {
|
|||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
},false);
|
},false);
|
||||||
this.macroNode.domNode.addEventListener("mouseup",function(event) {
|
this.macroNode.child.domNode.addEventListener("mouseup",function(event) {
|
||||||
if(self.brushDown) {
|
if(self.brushDown) {
|
||||||
self.brushDown = false;
|
self.brushDown = false;
|
||||||
self.strokeEnd();
|
self.strokeEnd();
|
||||||
@ -97,7 +97,7 @@ BitmapEditor.prototype.addEventHandlers = function() {
|
|||||||
};
|
};
|
||||||
|
|
||||||
BitmapEditor.prototype.adjustCoordinates = function(x,y) {
|
BitmapEditor.prototype.adjustCoordinates = function(x,y) {
|
||||||
var canvas = this.macroNode.children[0].domNode,
|
var canvas = this.macroNode.child.domNode,
|
||||||
canvasRect = canvas.getBoundingClientRect(),
|
canvasRect = canvas.getBoundingClientRect(),
|
||||||
scale = canvas.width/canvasRect.width;
|
scale = canvas.width/canvasRect.width;
|
||||||
return {x: (x - canvasRect.left) * scale, y: (y - canvasRect.top) * scale};
|
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) {
|
BitmapEditor.prototype.strokeMove = function(x,y) {
|
||||||
var canvas = this.macroNode.children[0].domNode,
|
var canvas = this.macroNode.child.domNode,
|
||||||
ctx = canvas.getContext("2d"),
|
ctx = canvas.getContext("2d"),
|
||||||
t;
|
t;
|
||||||
// Add the new position to the end of the stroke
|
// Add the new position to the end of the stroke
|
||||||
@ -134,7 +134,7 @@ BitmapEditor.prototype.strokeMove = function(x,y) {
|
|||||||
|
|
||||||
BitmapEditor.prototype.strokeEnd = function() {
|
BitmapEditor.prototype.strokeEnd = function() {
|
||||||
// Copy the bitmap to the off-screen canvas
|
// 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 = this.currCanvas.getContext("2d");
|
||||||
ctx.drawImage(canvas,0,0);
|
ctx.drawImage(canvas,0,0);
|
||||||
// Save the image into the tiddler
|
// Save the image into the tiddler
|
||||||
@ -145,7 +145,7 @@ BitmapEditor.prototype.saveChanges = function() {
|
|||||||
var tiddler = this.macroNode.wiki.getTiddler(this.macroNode.tiddlerTitle);
|
var tiddler = this.macroNode.wiki.getTiddler(this.macroNode.tiddlerTitle);
|
||||||
if(tiddler) {
|
if(tiddler) {
|
||||||
// data URIs look like "data:<type>;base64,<text>"
|
// 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(":"),
|
posColon = dataURL.indexOf(":"),
|
||||||
posSemiColon = dataURL.indexOf(";"),
|
posSemiColon = dataURL.indexOf(";"),
|
||||||
posComma = dataURL.indexOf(","),
|
posComma = dataURL.indexOf(","),
|
||||||
|
@ -16,7 +16,7 @@ function TextEditor(macroNode) {
|
|||||||
this.macroNode = macroNode;
|
this.macroNode = macroNode;
|
||||||
}
|
}
|
||||||
|
|
||||||
TextEditor.prototype.getChildren = function() {
|
TextEditor.prototype.getChild = function() {
|
||||||
var tiddler = this.macroNode.wiki.getTiddler(this.macroNode.tiddlerTitle),
|
var tiddler = this.macroNode.wiki.getTiddler(this.macroNode.tiddlerTitle),
|
||||||
field = this.macroNode.hasParameter("field") ? this.macroNode.params.field : "title",
|
field = this.macroNode.hasParameter("field") ? this.macroNode.params.field : "title",
|
||||||
value;
|
value;
|
||||||
@ -48,12 +48,12 @@ TextEditor.prototype.getChildren = function() {
|
|||||||
attributes.type = "text";
|
attributes.type = "text";
|
||||||
attributes.value = value;
|
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() {
|
TextEditor.prototype.addEventHandlers = function() {
|
||||||
this.macroNode.domNode.addEventListener("focus",this,false);
|
this.macroNode.child.domNode.addEventListener("focus",this,false);
|
||||||
this.macroNode.domNode.addEventListener("keyup",this,false);
|
this.macroNode.child.domNode.addEventListener("keyup",this,false);
|
||||||
};
|
};
|
||||||
|
|
||||||
TextEditor.prototype.handleEvent = function(event) {
|
TextEditor.prototype.handleEvent = function(event) {
|
||||||
@ -70,7 +70,7 @@ TextEditor.prototype.handleEvent = function(event) {
|
|||||||
};
|
};
|
||||||
|
|
||||||
TextEditor.prototype.saveChanges = function() {
|
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);
|
tiddler = this.macroNode.wiki.getTiddler(this.macroNode.tiddlerTitle);
|
||||||
if(tiddler && text !== tiddler.fields[this.macroNode.params.field]) {
|
if(tiddler && text !== tiddler.fields[this.macroNode.params.field]) {
|
||||||
var update = {};
|
var update = {};
|
||||||
@ -80,9 +80,9 @@ TextEditor.prototype.saveChanges = function() {
|
|||||||
};
|
};
|
||||||
|
|
||||||
TextEditor.prototype.fixHeight = function() {
|
TextEditor.prototype.fixHeight = function() {
|
||||||
if(this.macroNode.children[0] && this.macroNode.children[0].domNode) {
|
if(this.macroNode.child && this.macroNode.child.domNode) {
|
||||||
var wrapper = this.macroNode.domNode,
|
var wrapper = this.macroNode.child.domNode,
|
||||||
textarea = this.macroNode.children[0].domNode;
|
textarea = this.macroNode.child.children[0].domNode;
|
||||||
// Set the text area height to 1px temporarily, which allows us to read the true scrollHeight
|
// Set the text area height to 1px temporarily, which allows us to read the true scrollHeight
|
||||||
var prevWrapperHeight = wrapper.style.height;
|
var prevWrapperHeight = wrapper.style.height;
|
||||||
wrapper.style.height = textarea.style.height + "px";
|
wrapper.style.height = textarea.style.height + "px";
|
||||||
@ -99,7 +99,7 @@ TextEditor.prototype.postRenderInDom = function() {
|
|||||||
|
|
||||||
TextEditor.prototype.isRefreshable = function() {
|
TextEditor.prototype.isRefreshable = function() {
|
||||||
// Don't refresh the editor if it contains the caret or selection
|
// 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;
|
exports["text/x-tiddlywiki"] = TextEditor;
|
||||||
|
@ -24,24 +24,21 @@ exports.info = {
|
|||||||
exports.executeMacro = function() {
|
exports.executeMacro = function() {
|
||||||
if(this.wiki.tiddlerExists(this.params.src)) {
|
if(this.wiki.tiddlerExists(this.params.src)) {
|
||||||
var imageTree = this.wiki.parseTiddler(this.params.src).tree,
|
var imageTree = this.wiki.parseTiddler(this.params.src).tree,
|
||||||
cloneImage = [];
|
cloneImage = imageTree[0].clone();
|
||||||
for(var t=0; t<imageTree.length; t++) {
|
|
||||||
cloneImage.push(imageTree[t].clone());
|
|
||||||
}
|
|
||||||
if(this.params.text) {
|
if(this.params.text) {
|
||||||
return [$tw.Tree.Element("div",{
|
return $tw.Tree.Element("div",{
|
||||||
alt: this.params.text,
|
alt: this.params.text,
|
||||||
title: this.params.text
|
title: this.params.text
|
||||||
},cloneImage)];
|
},[cloneImage]);
|
||||||
} else {
|
} else {
|
||||||
return cloneImage;
|
return cloneImage;
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
return [$tw.Tree.Element("img",{
|
return $tw.Tree.Element("img",{
|
||||||
src: this.params.src,
|
src: this.params.src,
|
||||||
alt: this.params.text,
|
alt: this.params.text,
|
||||||
title: this.params.text
|
title: this.params.text
|
||||||
})];
|
});
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -42,11 +42,11 @@ exports.executeMacro = function() {
|
|||||||
result.push(this.wiki.serializeTiddler(titles[t],as));
|
result.push(this.wiki.serializeTiddler(titles[t],as));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return [$tw.Tree.Element("pre",{},[
|
return $tw.Tree.Element("pre",{},[
|
||||||
$tw.Tree.Text(result.join("\n"))
|
$tw.Tree.Text(result.join("\n"))
|
||||||
])];
|
]);
|
||||||
}
|
}
|
||||||
return [];
|
return null;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
|
@ -72,17 +72,18 @@ exports.executeMacro = function() {
|
|||||||
linkInfo.attributes["class"].push("tw-tiddlylink-resolves");
|
linkInfo.attributes["class"].push("tw-tiddlylink-resolves");
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
if(this.classes) {
|
||||||
|
$tw.utils.pushTop(linkInfo.attributes["class"],this.classes);
|
||||||
|
}
|
||||||
// Create the link
|
// Create the link
|
||||||
var children;
|
var child;
|
||||||
if(linkInfo.suppressLink) {
|
if(linkInfo.suppressLink) {
|
||||||
children = this.content;
|
child = $tw.Tree.Element("span",{},this.content);
|
||||||
} else {
|
} 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++) {
|
child.execute(this.parents,this.tiddlerTitle);
|
||||||
children[t].execute(this.parents,this.tiddlerTitle);
|
return child;
|
||||||
}
|
|
||||||
return children;
|
|
||||||
};
|
};
|
||||||
|
|
||||||
})();
|
})();
|
||||||
|
@ -52,7 +52,8 @@ exports.executeMacro = function() {
|
|||||||
template = this.params.template ? this.wiki.getTiddler(this.params.template) : null,
|
template = this.params.template ? this.wiki.getTiddler(this.params.template) : null,
|
||||||
children = [],
|
children = [],
|
||||||
t,
|
t,
|
||||||
parents = this.parents;
|
parents = this.parents,
|
||||||
|
attributes = {};
|
||||||
if(template) {
|
if(template) {
|
||||||
parents = parents.slice(0);
|
parents = parents.slice(0);
|
||||||
parents.push(template.title);
|
parents.push(template.title);
|
||||||
@ -62,8 +63,11 @@ exports.executeMacro = function() {
|
|||||||
var handler = handlers[this.params.type];
|
var handler = handlers[this.params.type];
|
||||||
handler = handler || handlers.all;
|
handler = handler || handlers.all;
|
||||||
var tiddlers = handler(this.wiki);
|
var tiddlers = handler(this.wiki);
|
||||||
|
if(this.classes) {
|
||||||
|
$tw.utils.pushTop(attributes["class"],this.classes);
|
||||||
|
}
|
||||||
if(tiddlers.length === 0) {
|
if(tiddlers.length === 0) {
|
||||||
return [$tw.Tree.Text(this.params.emptyMessage || "")];
|
return $tw.Tree.Text(this.params.emptyMessage || "");
|
||||||
} else {
|
} else {
|
||||||
var templateTree = this.wiki.parseText(templateType,templateText).tree;
|
var templateTree = this.wiki.parseText(templateType,templateText).tree;
|
||||||
for(t=0; t<tiddlers.length; t++) {
|
for(t=0; t<tiddlers.length; t++) {
|
||||||
@ -75,7 +79,7 @@ exports.executeMacro = function() {
|
|||||||
listNode.execute(parents,tiddlers[t]);
|
listNode.execute(parents,tiddlers[t]);
|
||||||
children.push(listNode);
|
children.push(listNode);
|
||||||
}
|
}
|
||||||
return [$tw.Tree.Element("ul",null,children)];
|
return $tw.Tree.Element("ul",attributes,children);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -89,7 +89,7 @@ exports.getSliderChildren = function() {
|
|||||||
|
|
||||||
exports.handleEvent = function(event) {
|
exports.handleEvent = function(event) {
|
||||||
if(event.type === "click") {
|
if(event.type === "click") {
|
||||||
if(event.target === this.domNode.firstChild.firstChild) {
|
if(event.target === this.child.domNode.firstChild) {
|
||||||
this.isOpen = !this.isOpen;
|
this.isOpen = !this.isOpen;
|
||||||
if(!this.saveOpenState()) {
|
if(!this.saveOpenState()) {
|
||||||
this.refreshInDom({});
|
this.refreshInDom({});
|
||||||
@ -115,6 +115,9 @@ exports.executeMacro = function() {
|
|||||||
if(this.hasParameter("class")) {
|
if(this.hasParameter("class")) {
|
||||||
attributes["class"].push(this.params["class"]);
|
attributes["class"].push(this.params["class"]);
|
||||||
}
|
}
|
||||||
|
if(this.classes) {
|
||||||
|
$tw.utils.pushTop(attributes["class"],this.classes);
|
||||||
|
}
|
||||||
if(this.hasParameter("state")) {
|
if(this.hasParameter("state")) {
|
||||||
attributes["data-tw-slider-type"] = this.params.state;
|
attributes["data-tw-slider-type"] = this.params.state;
|
||||||
}
|
}
|
||||||
@ -122,7 +125,7 @@ exports.executeMacro = function() {
|
|||||||
attributes.alt = this.params.tooltip;
|
attributes.alt = this.params.tooltip;
|
||||||
attributes.title = this.params.tooltip;
|
attributes.title = this.params.tooltip;
|
||||||
}
|
}
|
||||||
var children = $tw.Tree.Element("span",
|
var child = $tw.Tree.Element("span",
|
||||||
attributes,
|
attributes,
|
||||||
[
|
[
|
||||||
$tw.Tree.Element("a",
|
$tw.Tree.Element("a",
|
||||||
@ -141,8 +144,8 @@ exports.executeMacro = function() {
|
|||||||
)
|
)
|
||||||
]
|
]
|
||||||
);
|
);
|
||||||
children.execute(this.parents,this.tiddlerTitle);
|
child.execute(this.parents,this.tiddlerTitle);
|
||||||
return [children];
|
return child;
|
||||||
};
|
};
|
||||||
|
|
||||||
exports.refreshInDom = function(changes) {
|
exports.refreshInDom = function(changes) {
|
||||||
@ -152,22 +155,20 @@ exports.refreshInDom = function(changes) {
|
|||||||
this.isOpen = this.getOpenState();
|
this.isOpen = this.getOpenState();
|
||||||
}
|
}
|
||||||
// Render the children if the slider is open and we don't have any children yet
|
// 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
|
// 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
|
// Get the slider children and execute it
|
||||||
this.children[0].children[1].children = this.getSliderChildren();
|
this.child.children[1].children = this.getSliderChildren();
|
||||||
this.children[0].children[1].execute(this.parents,this.tiddlerTitle);
|
this.child.children[1].execute(this.parents,this.tiddlerTitle);
|
||||||
this.children[0].children[1].renderInDom(this.children[0].domNode,null);
|
this.child.children[1].renderInDom(this.child.domNode,null);
|
||||||
needChildrenRefresh = false; // Don't refresh the children if we've just created them
|
needChildrenRefresh = false; // Don't refresh the children if we've just created them
|
||||||
}
|
}
|
||||||
// Set the visibility of the slider children
|
// 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
|
// Refresh any children
|
||||||
if(needChildrenRefresh) {
|
if(needChildrenRefresh) {
|
||||||
for(var t=0; t<this.children.length; t++) {
|
this.child.refreshInDom(changes);
|
||||||
this.children[t].refreshInDom(changes);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -158,7 +158,11 @@ exports.executeMacro = function() {
|
|||||||
m.execute(this.parents,this.tiddlerTitle);
|
m.execute(this.parents,this.tiddlerTitle);
|
||||||
this.storyNode.children.push($tw.Tree.Element("div",{"class": "tw-story-element"},[m]));
|
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() {
|
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);
|
this.storyNode.children.splice(story.tiddlers.length,this.storyNode.children.length-story.tiddlers.length);
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
// If our dependencies didn't change, just refresh the children
|
if(this.child) {
|
||||||
for(t=0; t<this.children.length; t++) {
|
this.child.refreshInDom(changes);
|
||||||
this.children[t].refreshInDom(changes);
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
// Clear the details of the last navigation
|
// Clear the details of the last navigation
|
||||||
|
@ -124,7 +124,7 @@ exports.executeMacro = function() {
|
|||||||
attributes["class"].push("tw-tiddler-missing");
|
attributes["class"].push("tw-tiddler-missing");
|
||||||
}
|
}
|
||||||
// Return the children
|
// Return the children
|
||||||
return [$tw.Tree.Element("div",attributes,childrenClone)];
|
return $tw.Tree.Element("div",attributes,childrenClone);
|
||||||
};
|
};
|
||||||
|
|
||||||
exports.refreshInDom = function(changes) {
|
exports.refreshInDom = function(changes) {
|
||||||
@ -135,23 +135,18 @@ exports.refreshInDom = function(changes) {
|
|||||||
renderTitle = this.params.template;
|
renderTitle = this.params.template;
|
||||||
}
|
}
|
||||||
if(renderTitle) {
|
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
|
// Rerender the tiddler if it is impacted by the changes
|
||||||
if(this.dependencies.hasChanged(changes,this.tiddlerTitle)) {
|
if(this.dependencies.hasChanged(changes,this.tiddlerTitle)) {
|
||||||
// Manually reexecute and rerender this macro
|
// Manually reexecute and rerender this macro
|
||||||
while(this.domNode.hasChildNodes()) {
|
var parent = this.child.domNode.parentNode,
|
||||||
this.domNode.removeChild(this.domNode.firstChild);
|
nextSibling = this.child.domNode.nextSibling;
|
||||||
}
|
parent.removeChild(this.child.domNode);
|
||||||
this.execute(this.parents,this.tiddlerTitle);
|
this.execute(this.parents,this.tiddlerTitle);
|
||||||
for(t=0; t<this.children.length; t++) {
|
this.child.renderInDom(parent,nextSibling);
|
||||||
this.children[t].renderInDom(this.domNode);
|
|
||||||
}
|
|
||||||
} else {
|
} else {
|
||||||
// Refresh any children
|
this.child.refreshInDom(changes);
|
||||||
for(t=0; t<this.children.length; t++) {
|
|
||||||
this.children[t].refreshInDom(changes);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -19,7 +19,7 @@ exports.info = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
exports.executeMacro = function() {
|
exports.executeMacro = function() {
|
||||||
return [$tw.Tree.Text($tw.utils.getVersionString())];
|
return $tw.Tree.Text($tw.utils.getVersionString());
|
||||||
};
|
};
|
||||||
|
|
||||||
})();
|
})();
|
||||||
|
@ -29,29 +29,29 @@ exports.executeMacro = function() {
|
|||||||
videoHeight = this.params.height || 360;
|
videoHeight = this.params.height || 360;
|
||||||
switch(videoType) {
|
switch(videoType) {
|
||||||
case "vimeo":
|
case "vimeo":
|
||||||
return [$tw.Tree.Element("iframe",{
|
return $tw.Tree.Element("iframe",{
|
||||||
src: "http://player.vimeo.com/video/" + src + "?autoplay=0",
|
src: "http://player.vimeo.com/video/" + src + "?autoplay=0",
|
||||||
width: videoWidth,
|
width: videoWidth,
|
||||||
height: videoHeight,
|
height: videoHeight,
|
||||||
frameborder: 0
|
frameborder: 0
|
||||||
})];
|
});
|
||||||
case "youtube":
|
case "youtube":
|
||||||
return [$tw.Tree.Element("iframe",{
|
return $tw.Tree.Element("iframe",{
|
||||||
type: "text/html",
|
type: "text/html",
|
||||||
src: "http://www.youtube.com/embed/" + src,
|
src: "http://www.youtube.com/embed/" + src,
|
||||||
width: videoWidth,
|
width: videoWidth,
|
||||||
height: videoHeight,
|
height: videoHeight,
|
||||||
frameborder: 0
|
frameborder: 0
|
||||||
})];
|
});
|
||||||
case "archiveorg":
|
case "archiveorg":
|
||||||
return [$tw.Tree.Element("iframe",{
|
return $tw.Tree.Element("iframe",{
|
||||||
src: "http://www.archive.org/embed/" + src,
|
src: "http://www.archive.org/embed/" + src,
|
||||||
width: videoWidth,
|
width: videoWidth,
|
||||||
height: videoHeight,
|
height: videoHeight,
|
||||||
frameborder: 0
|
frameborder: 0
|
||||||
})];
|
});
|
||||||
default:
|
default:
|
||||||
return [];
|
return null;
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -52,7 +52,7 @@ exports.executeMacro = function() {
|
|||||||
switch(this.params.format) {
|
switch(this.params.format) {
|
||||||
case "link":
|
case "link":
|
||||||
if(value === undefined) {
|
if(value === undefined) {
|
||||||
return [];
|
return $tw.Tree.Element("span",{},[]);
|
||||||
} else {
|
} else {
|
||||||
var link = $tw.Tree.Macro("link",{
|
var link = $tw.Tree.Macro("link",{
|
||||||
srcParams: {to: value},
|
srcParams: {to: value},
|
||||||
@ -60,7 +60,7 @@ exports.executeMacro = function() {
|
|||||||
wiki: this.wiki
|
wiki: this.wiki
|
||||||
});
|
});
|
||||||
link.execute(parents,this.tiddlerTitle);
|
link.execute(parents,this.tiddlerTitle);
|
||||||
return [link];
|
return $tw.Tree.Element("span",{},[link]);
|
||||||
}
|
}
|
||||||
break;
|
break;
|
||||||
case "wikified":
|
case "wikified":
|
||||||
@ -81,13 +81,13 @@ exports.executeMacro = function() {
|
|||||||
for(t=0; t<childrenClone.length; t++) {
|
for(t=0; t<childrenClone.length; t++) {
|
||||||
childrenClone[t].execute(parents,this.tiddlerTitle);
|
childrenClone[t].execute(parents,this.tiddlerTitle);
|
||||||
}
|
}
|
||||||
return childrenClone;
|
return $tw.Tree.Element(this.isBlock ? "div" : "span",{},childrenClone);
|
||||||
case "date":
|
case "date":
|
||||||
var template = this.params.template || "DD MMM YYYY";
|
var template = this.params.template || "DD MMM YYYY";
|
||||||
if(value === undefined) {
|
if(value === undefined) {
|
||||||
return [];
|
return $tw.Tree.Element("span",{},[]);
|
||||||
} else {
|
} else {
|
||||||
return [$tw.Tree.Text($tw.utils.formatDateString(value,template))];
|
return $tw.Tree.Text($tw.utils.formatDateString(value,template));
|
||||||
}
|
}
|
||||||
break;
|
break;
|
||||||
default: // "text"
|
default: // "text"
|
||||||
@ -96,12 +96,12 @@ exports.executeMacro = function() {
|
|||||||
value = tiddler.getFieldString(field);
|
value = tiddler.getFieldString(field);
|
||||||
}
|
}
|
||||||
if(value === undefined || value === null) {
|
if(value === undefined || value === null) {
|
||||||
return [];
|
return $tw.Tree.Element("span",{},[]);
|
||||||
} else {
|
} else {
|
||||||
return [$tw.Tree.Text(value)];
|
return $tw.Tree.Text(value);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return [];
|
return $tw.Tree.Element("span",{},[]);
|
||||||
};
|
};
|
||||||
|
|
||||||
})();
|
})();
|
||||||
|
@ -100,7 +100,7 @@ exports.handleEvent = function(event) {
|
|||||||
|
|
||||||
exports.executeMacro = function() {
|
exports.executeMacro = function() {
|
||||||
this.inZoomer = false;
|
this.inZoomer = false;
|
||||||
return [];
|
return $tw.Tree.Element("div",{},[]);
|
||||||
};
|
};
|
||||||
|
|
||||||
})();
|
})();
|
||||||
|
@ -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) {
|
Element.prototype.addClass = function(className) {
|
||||||
if(typeof this.attributes["class"] === "string") {
|
if(typeof this.attributes["class"] === "string") {
|
||||||
this.attributes["class"] = this.attributes["class"].split(" ");
|
this.attributes["class"] = this.attributes["class"].split(" ");
|
||||||
|
@ -166,62 +166,31 @@ Macro.prototype.execute = function(parents,tiddlerTitle) {
|
|||||||
// Save the context info for use when we're refreshing it
|
// Save the context info for use when we're refreshing it
|
||||||
this.tiddlerTitle = tiddlerTitle;
|
this.tiddlerTitle = tiddlerTitle;
|
||||||
this.parents = parents;
|
this.parents = parents;
|
||||||
// Execute the macro to generate its children, and recursively execute them
|
// Execute the macro to generate its node and children, and recursively execute them
|
||||||
this.children = this.executeMacro.call(this);
|
this.child = this.executeMacro.call(this);
|
||||||
};
|
};
|
||||||
|
|
||||||
Macro.prototype.render = function(type) {
|
Macro.prototype.render = function(type) {
|
||||||
var output = [];
|
return this.child ? this.child.render(type) : "";
|
||||||
for(var t=0; t<this.children.length; t++) {
|
|
||||||
output.push(this.children[t].render(type));
|
|
||||||
}
|
|
||||||
return output.join("");
|
|
||||||
};
|
};
|
||||||
|
|
||||||
Macro.prototype.renderInDom = function(parentDomNode,insertBefore) {
|
Macro.prototype.renderInDom = function(parentDomNode,insertBefore) {
|
||||||
// Create the wrapper node for the macro
|
if(this.child) {
|
||||||
var domNode = document.createElement(this.isBlock ? "div" : "span");
|
this.child.renderInDom(parentDomNode,insertBefore);
|
||||||
this.domNode = domNode;
|
this.addEventHandlers();
|
||||||
if(insertBefore) {
|
this.postRenderInDom();
|
||||||
parentDomNode.insertBefore(domNode,insertBefore);
|
|
||||||
} else {
|
|
||||||
parentDomNode.appendChild(domNode);
|
|
||||||
}
|
}
|
||||||
// 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() {
|
Macro.prototype.addEventHandlers = function() {
|
||||||
if(this.info.events) {
|
if(this.info.events && this.child) {
|
||||||
for(var t=0; t<this.info.events.length; t++) {
|
for(var t=0; t<this.info.events.length; t++) {
|
||||||
// Register this macro node to handle the event via the handleEvent() method
|
// 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() {
|
Macro.prototype.postRenderInDom = function() {
|
||||||
// Do nothing, individual macros can override
|
// Do nothing, individual macros can override
|
||||||
};
|
};
|
||||||
@ -234,9 +203,9 @@ Macro.prototype.refresh = function(changes) {
|
|||||||
// Re-execute the macro if so
|
// Re-execute the macro if so
|
||||||
this.execute(this.parents,this.tiddlerTitle);
|
this.execute(this.parents,this.tiddlerTitle);
|
||||||
} else {
|
} else {
|
||||||
// Refresh any children
|
// Refresh the child node
|
||||||
for(t=0; t<this.children.length; t++) {
|
if(this.child) {
|
||||||
this.children[t].refresh(changes);
|
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
|
// Check if any of the dependencies of this macro node have changed
|
||||||
if(this.dependencies.hasChanged(changes,this.tiddlerTitle)) {
|
if(this.dependencies.hasChanged(changes,this.tiddlerTitle)) {
|
||||||
// Manually reexecute and rerender this macro
|
// Manually reexecute and rerender this macro
|
||||||
while(this.domNode.hasChildNodes()) {
|
var parent = this.child.domNode.parentNode,
|
||||||
this.domNode.removeChild(this.domNode.firstChild);
|
nextSibling = this.child.domNode.nextSibling;
|
||||||
}
|
parent.removeChild(this.child.domNode);
|
||||||
this.execute(this.parents,this.tiddlerTitle);
|
this.execute(this.parents,this.tiddlerTitle);
|
||||||
for(t=0; t<this.children.length; t++) {
|
this.child.renderInDom(parent,nextSibling);
|
||||||
this.children[t].renderInDom(this.domNode);
|
this.addEventHandlers();
|
||||||
}
|
|
||||||
} else {
|
} else {
|
||||||
// Refresh any children
|
if(this.child) {
|
||||||
for(t=0; t<this.children.length; t++) {
|
this.child.refreshInDom(changes);
|
||||||
this.children[t].refreshInDom(changes);
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
@ -30,13 +30,6 @@ Node.prototype.clone = function() {
|
|||||||
return this;
|
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
|
Execute a node and derive its child nodes
|
||||||
parents: array of titles of each transcluded parent tiddler (used for detecting recursion)
|
parents: array of titles of each transcluded parent tiddler (used for detecting recursion)
|
||||||
|
Loading…
Reference in New Issue
Block a user