1
0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-11-30 13:29:56 +00:00

Refactor widget implementation

This commit is contained in:
Jeremy Ruston 2012-12-14 16:01:37 +00:00
parent 0055947913
commit 3e06bca347
8 changed files with 67 additions and 66 deletions

View File

@ -39,7 +39,8 @@ var WidgetRenderer = function(renderTree,renderContext,parseTreeNode) {
// Create the widget object
var WidgetClass = this.renderTree.parser.vocabulary.widgetClasses[this.parseTreeNode.tag];
if(WidgetClass) {
this.widget = new WidgetClass(this);
this.widget = new WidgetClass();
this.widget.init(this);
} else {
// Error if we couldn't find the widget
this.children = this.renderTree.createRenderers(this.renderContext,[

View File

@ -12,14 +12,16 @@ Implements the button widget.
/*global $tw: false */
"use strict";
var ButtonWidget = function(renderer) {
exports.name = "button";
exports.init = function(renderer) {
// Save state
this.renderer = renderer;
// Generate child nodes
this.generateChildNodes();
};
ButtonWidget.prototype.generateChildNodes = function() {
exports.generateChildNodes = function() {
// Get the parameters from the attributes
this.message = this.renderer.getAttribute("message");
this.param = this.renderer.getAttribute("param");
@ -53,7 +55,7 @@ ButtonWidget.prototype.generateChildNodes = function() {
}]);
};
ButtonWidget.prototype.render = function(type) {
exports.render = function(type) {
var output = [];
$tw.utils.each(this.children,function(node) {
if(node.render) {
@ -63,7 +65,7 @@ ButtonWidget.prototype.render = function(type) {
return output.join("");
};
ButtonWidget.prototype.renderInDom = function(parentElement) {
exports.renderInDom = function(parentElement) {
this.parentElement = parentElement;
// Render any child nodes
$tw.utils.each(this.children,function(node) {
@ -73,14 +75,14 @@ ButtonWidget.prototype.renderInDom = function(parentElement) {
});
};
ButtonWidget.prototype.dispatchMessage = function(event) {
exports.dispatchMessage = function(event) {
$tw.utils.dispatchCustomEvent(event.target,this.message,{
param: this.param,
tiddlerTitle: this.renderer.getContextTiddlerTitle()
});
};
ButtonWidget.prototype.triggerPopup = function(event) {
exports.triggerPopup = function(event) {
$tw.popup.triggerPopup({
textRef: this.popup,
domNode: this.renderer.domNode,
@ -90,12 +92,12 @@ ButtonWidget.prototype.triggerPopup = function(event) {
});
};
ButtonWidget.prototype.setTiddler = function() {
exports.setTiddler = function() {
var tiddler = this.renderer.renderTree.wiki.getTiddler(this.set);
this.renderer.renderTree.wiki.addTiddler(new $tw.Tiddler(tiddler,{title: this.set, text: this.setTo}));
};
ButtonWidget.prototype.handleClickEvent = function(event) {
exports.handleClickEvent = function(event) {
if(this.message) {
this.dispatchMessage(event);
}
@ -109,7 +111,7 @@ ButtonWidget.prototype.handleClickEvent = function(event) {
return false;
};
ButtonWidget.prototype.handleMouseOverOrOutEvent = function(event) {
exports.handleMouseOverOrOutEvent = function(event) {
if(this.popup) {
this.triggerPopup(event);
}
@ -117,7 +119,7 @@ ButtonWidget.prototype.handleMouseOverOrOutEvent = function(event) {
return false;
};
ButtonWidget.prototype.refreshInDom = function(changedAttributes,changedTiddlers) {
exports.refreshInDom = function(changedAttributes,changedTiddlers) {
// Check if any of our attributes have changed, or if a tiddler we're interested in has changed
if(changedAttributes.message || changedAttributes.param || changedAttributes.set || changedAttributes.setTo || changedAttributes.popup || changedAttributes.hover || changedAttributes.qualifyTiddlerTitles || changedAttributes["class"] || (this.set && changedTiddlers[this.set]) || (this.popup && changedTiddlers[this.popup])) {
// Remove old child nodes
@ -140,6 +142,4 @@ ButtonWidget.prototype.refreshInDom = function(changedAttributes,changedTiddlers
}
};
exports.button = ButtonWidget;
})();

View File

@ -12,19 +12,21 @@ Implements the link widget.
/*global $tw: false */
"use strict";
exports.name = "link";
var isLinkExternal = function(to) {
var externalRegExp = /(?:file|http|https|mailto|ftp|irc|news|data):[^\s'"]+(?:\/|\b)/i;
return externalRegExp.test(to);
};
var LinkWidget = function(renderer) {
exports.init = function(renderer) {
// Save state
this.renderer = renderer;
// Generate child nodes
this.generateChildNodes();
};
LinkWidget.prototype.generateChildNodes = function() {
exports.generateChildNodes = function() {
// Get the parameters from the attributes
this.to = this.renderer.getAttribute("to");
this.hover = this.renderer.getAttribute("hover");
@ -66,7 +68,7 @@ LinkWidget.prototype.generateChildNodes = function() {
}]);
};
LinkWidget.prototype.render = function(type) {
exports.render = function(type) {
var output = [];
$tw.utils.each(this.children,function(node) {
if(node.render) {
@ -76,7 +78,7 @@ LinkWidget.prototype.render = function(type) {
return output.join("");
};
LinkWidget.prototype.renderInDom = function(parentElement) {
exports.renderInDom = function(parentElement) {
this.parentElement = parentElement;
// Render any child nodes
$tw.utils.each(this.children,function(node) {
@ -86,7 +88,7 @@ LinkWidget.prototype.renderInDom = function(parentElement) {
});
};
LinkWidget.prototype.handleClickEvent = function(event) {
exports.handleClickEvent = function(event) {
if(isLinkExternal(this.to)) {
event.target.setAttribute("target","_blank");
return true;
@ -101,7 +103,7 @@ LinkWidget.prototype.handleClickEvent = function(event) {
}
};
LinkWidget.prototype.handleMouseOverOrOutEvent = function(event) {
exports.handleMouseOverOrOutEvent = function(event) {
if(this.hover) {
$tw.popup.triggerPopup({
textRef: this.hover,
@ -115,7 +117,7 @@ LinkWidget.prototype.handleMouseOverOrOutEvent = function(event) {
return false;
};
LinkWidget.prototype.refreshInDom = function(changedAttributes,changedTiddlers) {
exports.refreshInDom = function(changedAttributes,changedTiddlers) {
// Set the class for missing tiddlers
if(this.targetTitle) {
$tw.utils.toggleClass(this.children[0].domNode,"tw-tiddler-missing",!this.renderer.renderTree.wiki.tiddlerExists(this.targetTitle));
@ -142,6 +144,4 @@ LinkWidget.prototype.refreshInDom = function(changedAttributes,changedTiddlers)
}
};
exports.link = LinkWidget;
})();

View File

@ -12,6 +12,8 @@ The list widget
/*global $tw: false */
"use strict";
exports.name = "list";
/*
These types are shorthands for particular filters
*/
@ -23,14 +25,14 @@ var typeMappings = {
shadowed: "[is[shadow]sort[title]]"
};
var ListWidget = function(renderer) {
exports.init = function(renderer) {
// Save state
this.renderer = renderer;
// Generate child nodes
this.generateChildNodes();
};
ListWidget.prototype.generateChildNodes = function() {
exports.generateChildNodes = function() {
// We'll manage our own dependencies
this.renderer.dependencies = undefined;
// Get our attributes
@ -66,7 +68,7 @@ ListWidget.prototype.generateChildNodes = function() {
}]);
};
ListWidget.prototype.getTiddlerList = function() {
exports.getTiddlerList = function() {
var filter;
if(this.renderer.hasAttribute("type")) {
filter = typeMappings[this.renderer.getAttribute("type")];
@ -82,7 +84,7 @@ ListWidget.prototype.getTiddlerList = function() {
/*
Create and execute the nodes representing the empty message
*/
ListWidget.prototype.getEmptyMessage = function() {
exports.getEmptyMessage = function() {
return {
type: "element",
tag: "span",
@ -93,7 +95,7 @@ ListWidget.prototype.getEmptyMessage = function() {
/*
Create a list element representing a given tiddler
*/
ListWidget.prototype.createListElement = function(title) {
exports.createListElement = function(title) {
// Define an event handler that adds navigation information to the event
var handleEvent = function(event) {
event.navigateFromTitle = title;
@ -125,7 +127,7 @@ ListWidget.prototype.createListElement = function(title) {
/*
Create the tiddler macro needed to represent a given tiddler
*/
ListWidget.prototype.createListElementMacro = function(title) {
exports.createListElementMacro = function(title) {
// Check if the tiddler is a draft
var tiddler = this.renderer.renderTree.wiki.getTiddler(title),
isDraft = tiddler ? tiddler.hasField("draft.of") : false;
@ -167,7 +169,7 @@ ListWidget.prototype.createListElementMacro = function(title) {
/*
Remove a list element from the list, along with the attendant DOM nodes
*/
ListWidget.prototype.removeListElement = function(index) {
exports.removeListElement = function(index) {
// Get the list element
var listElement = this.children[0].children[index];
// Remove the DOM node
@ -181,7 +183,7 @@ Return the index of the list element that corresponds to a particular title
startIndex: index to start search (use zero to search from the top)
title: tiddler title to seach for
*/
ListWidget.prototype.findListElementByTitle = function(startIndex,title) {
exports.findListElementByTitle = function(startIndex,title) {
while(startIndex < this.children[0].children.length) {
if(this.children[0].children[startIndex].children[0].attributes.target === title) {
return startIndex;
@ -191,7 +193,7 @@ ListWidget.prototype.findListElementByTitle = function(startIndex,title) {
return undefined;
};
ListWidget.prototype.render = function(type) {
exports.render = function(type) {
var output = [];
$tw.utils.each(this.children,function(node) {
if(node.render) {
@ -201,7 +203,7 @@ ListWidget.prototype.render = function(type) {
return output.join("");
};
ListWidget.prototype.renderInDom = function(parentElement) {
exports.renderInDom = function(parentElement) {
this.parentElement = parentElement;
// Render any child nodes
$tw.utils.each(this.children,function(node) {
@ -211,7 +213,7 @@ ListWidget.prototype.renderInDom = function(parentElement) {
});
};
ListWidget.prototype.refreshInDom = function(changedAttributes,changedTiddlers) {
exports.refreshInDom = function(changedAttributes,changedTiddlers) {
// Reexecute the widget if any of our attributes have changed
if(changedAttributes.itemClass || changedAttributes.template || changedAttributes.editTemplate || changedAttributes.emptyMessage || changedAttributes.type || changedAttributes.filter || changedAttributes.template) {
// Remove old child nodes
@ -230,7 +232,7 @@ ListWidget.prototype.refreshInDom = function(changedAttributes,changedTiddlers)
}
};
ListWidget.prototype.handleListChanges = function(changedTiddlers) {
exports.handleListChanges = function(changedTiddlers) {
var t,
prevListLength = this.list.length,
frame = this.children[0];
@ -290,6 +292,4 @@ ListWidget.prototype.handleListChanges = function(changedTiddlers) {
}
};
exports.list = ListWidget;
})();

View File

@ -12,14 +12,16 @@ Implements the navigator widget.
/*global $tw: false */
"use strict";
var NavigatorWidget = function(renderer) {
exports.name = "navigator";
exports.init = function(renderer) {
// Save state
this.renderer = renderer;
// Generate child nodes
this.generateChildNodes();
};
NavigatorWidget.prototype.generateChildNodes = function() {
exports.generateChildNodes = function() {
// We'll manage our own dependencies
this.renderer.dependencies = undefined;
// Get our parameters
@ -29,7 +31,7 @@ NavigatorWidget.prototype.generateChildNodes = function() {
this.children = this.renderer.renderTree.createRenderers(this.renderer.renderContext,this.renderer.parseTreeNode.children);
};
NavigatorWidget.prototype.render = function(type) {
exports.render = function(type) {
var output = [];
$tw.utils.each(this.children,function(node) {
if(node.render) {
@ -39,7 +41,7 @@ NavigatorWidget.prototype.render = function(type) {
return output.join("");
};
NavigatorWidget.prototype.renderInDom = function(parentElement) {
exports.renderInDom = function(parentElement) {
this.parentElement = parentElement;
// Render any child nodes
$tw.utils.each(this.children,function(node) {
@ -57,7 +59,7 @@ NavigatorWidget.prototype.renderInDom = function(parentElement) {
]);
};
NavigatorWidget.prototype.refreshInDom = function(changedAttributes,changedTiddlers) {
exports.refreshInDom = function(changedAttributes,changedTiddlers) {
// We don't need to refresh ourselves, so just refresh any child nodes
$tw.utils.each(this.children,function(node) {
if(node.refreshInDom) {
@ -66,7 +68,7 @@ NavigatorWidget.prototype.refreshInDom = function(changedAttributes,changedTiddl
});
};
NavigatorWidget.prototype.getStoryList = function() {
exports.getStoryList = function() {
var text = this.renderer.renderTree.wiki.getTextReference(this.storyTitle,"");
if(text && text.length > 0) {
this.storyList = text.split("\n");
@ -75,14 +77,14 @@ NavigatorWidget.prototype.getStoryList = function() {
}
};
NavigatorWidget.prototype.saveStoryList = function() {
exports.saveStoryList = function() {
var storyTiddler = this.renderer.renderTree.wiki.getTiddler(this.storyTitle);
this.renderer.renderTree.wiki.addTiddler(new $tw.Tiddler({
title: this.storyTitle
},storyTiddler,{text: this.storyList.join("\n")}));
};
NavigatorWidget.prototype.findTitleInStory = function(title,defaultIndex) {
exports.findTitleInStory = function(title,defaultIndex) {
for(var t=0; t<this.storyList.length; t++) {
if(this.storyList[t] === title) {
return t;
@ -92,7 +94,7 @@ NavigatorWidget.prototype.findTitleInStory = function(title,defaultIndex) {
};
// Navigate to a specified tiddler
NavigatorWidget.prototype.handleNavigateEvent = function(event) {
exports.handleNavigateEvent = function(event) {
if(this.storyTitle) {
// Update the story tiddler if specified
this.getStoryList();
@ -119,7 +121,7 @@ NavigatorWidget.prototype.handleNavigateEvent = function(event) {
};
// Close a specified tiddler
NavigatorWidget.prototype.handleCloseTiddlerEvent = function(event) {
exports.handleCloseTiddlerEvent = function(event) {
this.getStoryList();
// Look for tiddlers with this title to close
var slot = this.findTitleInStory(event.tiddlerTitle,-1);
@ -132,7 +134,7 @@ NavigatorWidget.prototype.handleCloseTiddlerEvent = function(event) {
};
// Place a tiddler in edit mode
NavigatorWidget.prototype.handleEditTiddlerEvent = function(event) {
exports.handleEditTiddlerEvent = function(event) {
this.getStoryList();
// Replace the specified tiddler with a draft in edit mode
for(var t=0; t<this.storyList.length; t++) {
@ -161,7 +163,7 @@ NavigatorWidget.prototype.handleEditTiddlerEvent = function(event) {
};
// Take a tiddler out of edit mode, saving the changes
NavigatorWidget.prototype.handleSaveTiddlerEvent = function(event) {
exports.handleSaveTiddlerEvent = function(event) {
this.getStoryList();
var storyTiddlerModified = false;
for(var t=0; t<this.storyList.length; t++) {
@ -198,7 +200,7 @@ NavigatorWidget.prototype.handleSaveTiddlerEvent = function(event) {
};
// Create a new draft tiddler
NavigatorWidget.prototype.handleNewTiddlerEvent = function(event) {
exports.handleNewTiddlerEvent = function(event) {
// Get the story details
this.getStoryList();
// Create the new tiddler
@ -236,6 +238,4 @@ NavigatorWidget.prototype.handleNewTiddlerEvent = function(event) {
return false;
};
exports.navigator = NavigatorWidget;
})();

View File

@ -46,14 +46,16 @@ of the tiddler `Foo`.
/*global $tw: false */
"use strict";
var TranscludeWidget = function(renderer) {
exports.name = "transclude";
exports.init = function(renderer) {
// Save state
this.renderer = renderer;
// Generate child nodes
this.generateChildNodes();
};
TranscludeWidget.prototype.generateChildNodes = function() {
exports.generateChildNodes = function() {
var tr, templateParseTree, templateTiddler;
// We'll manage our own dependencies
this.renderer.dependencies = undefined;
@ -98,7 +100,7 @@ TranscludeWidget.prototype.generateChildNodes = function() {
}]);
};
TranscludeWidget.prototype.render = function(type) {
exports.render = function(type) {
var output = [];
$tw.utils.each(this.children,function(node) {
if(node.render) {
@ -108,7 +110,7 @@ TranscludeWidget.prototype.render = function(type) {
return output.join("");
};
TranscludeWidget.prototype.renderInDom = function(parentElement) {
exports.renderInDom = function(parentElement) {
this.parentElement = parentElement;
// Render any child nodes
$tw.utils.each(this.children,function(node) {
@ -118,7 +120,7 @@ TranscludeWidget.prototype.renderInDom = function(parentElement) {
});
};
TranscludeWidget.prototype.refreshInDom = function(changedAttributes,changedTiddlers) {
exports.refreshInDom = function(changedAttributes,changedTiddlers) {
// Set the class for missing tiddlers
if(this.targetTitle) {
$tw.utils.toggleClass(this.children[0].domNode,"tw-tiddler-missing",!this.renderer.renderTree.wiki.tiddlerExists(this.targetTitle));
@ -145,6 +147,4 @@ TranscludeWidget.prototype.refreshInDom = function(changedAttributes,changedTidd
}
};
exports.transclude = TranscludeWidget;
})();

View File

@ -12,6 +12,8 @@ The view widget displays a tiddler field.
/*global $tw: false */
"use strict";
exports.name = "view";
/*
Define the "text" viewer here so that it is always available
*/
@ -40,7 +42,7 @@ TextViewer.prototype.render = function() {
// We'll cache the available field viewers here
var fieldViewers = undefined;
var ViewWidget = function(renderer) {
exports.init = function(renderer) {
// Save state
this.renderer = renderer;
// Initialise the field viewers if they've not been done already
@ -52,7 +54,7 @@ var ViewWidget = function(renderer) {
this.generateChildNodes();
};
ViewWidget.prototype.generateChildNodes = function() {
exports.generateChildNodes = function() {
// We'll manage our own dependencies
this.renderer.dependencies = undefined;
// Get parameters from our attributes
@ -93,7 +95,7 @@ ViewWidget.prototype.generateChildNodes = function() {
this.children = this.viewer.render();
};
ViewWidget.prototype.render = function(type) {
exports.render = function(type) {
var output = [];
$tw.utils.each(this.children,function(node) {
if(node.render) {
@ -103,7 +105,7 @@ ViewWidget.prototype.render = function(type) {
return output.join("");
};
ViewWidget.prototype.renderInDom = function(parentElement) {
exports.renderInDom = function(parentElement) {
this.parentElement = parentElement;
// Render any child nodes
$tw.utils.each(this.children,function(node) {
@ -113,7 +115,7 @@ ViewWidget.prototype.renderInDom = function(parentElement) {
});
};
ViewWidget.prototype.refreshInDom = function(changedAttributes,changedTiddlers) {
exports.refreshInDom = function(changedAttributes,changedTiddlers) {
// Check if any of our attributes have changed, or if a tiddler we're interested in has changed
if(changedAttributes.tiddler || changedAttributes.field || changedAttributes.format || (this.tiddlerTitle && changedTiddlers[this.tiddlerTitle])) {
// Remove old child nodes
@ -136,6 +138,4 @@ ViewWidget.prototype.refreshInDom = function(changedAttributes,changedTiddlers)
}
};
exports.view = ViewWidget;
})();

View File

@ -19,7 +19,7 @@ var WikiVocabulary = function(options) {
// Hashmap of the various renderer classes
this.rendererClasses = $tw.modules.applyMethods("wikirenderer");
// Hashmap of the available widgets
this.widgetClasses = $tw.modules.applyMethods("widget");
this.widgetClasses = $tw.modules.createClassesFromModules("widget");
};
WikiVocabulary.prototype.parseText = function(type,text) {