1
0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-06-24 06:13:17 +00:00

Switch the notifier and modal mechanisms to use the new widget mechanism

Note the use of the `$tw.rootWidget` to collect together the root event
handlers
This commit is contained in:
Jeremy Ruston 2013-10-21 20:14:01 +01:00
parent 48dbacc88a
commit 2a571b4f5f
3 changed files with 64 additions and 48 deletions

View File

@ -63,29 +63,38 @@ exports.startup = function() {
$tw.popup = new $tw.utils.Popup({
rootElement: document.body
});
// Install the animator
$tw.anim = new $tw.utils.Animator();
// Kick off the stylesheet manager
$tw.stylesheetManager = new $tw.utils.StylesheetManager($tw.wiki);
// Create a root widget for attaching event handlers. By using it as the parentWidget for another widget tree, one can reuse the event handlers
$tw.rootWidget = new widget.widget({type: "widget", children: []},{
wiki: $tw.wiki,
document: document
});
// Install the modal message mechanism
$tw.modal = new $tw.utils.Modal($tw.wiki);
document.addEventListener("tw-modal",function(event) {
$tw.rootWidget.addEventListener("tw-modal",function(event) {
$tw.modal.display(event.param);
},false);
});
// Install the notification mechanism
$tw.notifier = new $tw.utils.Notifier($tw.wiki);
document.addEventListener("tw-notify",function(event) {
$tw.rootWidget.addEventListener("tw-notify",function(event) {
$tw.notifier.display(event.param);
},false);
});
// Install the scroller
$tw.pageScroller = new $tw.utils.PageScroller();
document.addEventListener("tw-scroll",$tw.pageScroller,false);
$tw.rootWidget.addEventListener("tw-scroll",$tw.pageScroller);
// Install the save action handler
$tw.wiki.initSavers();
document.addEventListener("tw-save-wiki",function(event) {
$tw.rootWidget.addEventListener("tw-save-wiki",function(event) {
$tw.wiki.saveWiki({
template: event.param,
downloadType: "text/plain"
});
},false);
});
// Install the crypto event handlers
document.addEventListener("tw-set-password",function(event) {
$tw.rootWidget.addEventListener("tw-set-password",function(event) {
$tw.passwordPrompt.createPrompt({
serviceName: "Set a new password for this TiddlyWiki",
noUserName: true,
@ -96,19 +105,16 @@ exports.startup = function() {
}
});
});
document.addEventListener("tw-clear-password",function(event) {
$tw.rootWidget.addEventListener("tw-clear-password",function(event) {
$tw.crypto.setPassword(null);
});
// Install the animator
$tw.anim = new $tw.utils.Animator();
// Kick off the stylesheet manager
$tw.stylesheetManager = new $tw.utils.StylesheetManager($tw.wiki);
// Display the PageTemplate
var templateTitle = "$:/core/ui/PageTemplate",
parser = $tw.wiki.new_parseTiddler(templateTitle),
parseTreeNode = parser ? {type: "widget", children: parser.tree} : undefined,
widgetNode = new widget.widget(parseTreeNode,{
wiki: $tw.wiki,
parentWidget: $tw.rootWidget,
document: document
});
$tw.new_pageContainer = document.createElement("div");
@ -118,18 +124,6 @@ exports.startup = function() {
$tw.wiki.addEventListener("change",function(changes) {
widgetNode.refresh(changes,$tw.new_pageContainer,null);
});
// // Display the old PageTemplate
// var old_templateTitle = "$:/core/ui/PageTemplate",
// old_parser = $tw.wiki.parseTiddler(old_templateTitle),
// renderTree = new $tw.WikiRenderTree(old_parser,{wiki: $tw.wiki, context: {tiddlerTitle: old_templateTitle}, document: document});
// renderTree.execute();
// $tw.pageContainer = document.createElement("div");
// $tw.utils.addClass($tw.pageContainer,"tw-page-container");
// document.body.insertBefore($tw.pageContainer,document.body.firstChild);
// renderTree.renderInDom($tw.pageContainer);
// $tw.wiki.addEventListener("change",function(changes) {
// renderTree.refreshInDom(changes);
// });
// If we're being viewed on a data: URI then give instructions for how to save
if(document.location.protocol === "data:") {
$tw.utils.dispatchCustomEvent(document,"tw-modal",{

View File

@ -12,6 +12,8 @@ Modal message mechanism
/*global $tw: false */
"use strict";
var widget = require("$:/core/modules/new_widgets/widget.js");
var Modal = function(wiki) {
this.wiki = wiki;
this.modalCount = 0;
@ -71,20 +73,28 @@ Modal.prototype.display = function(title,options) {
} else {
titleText = title;
}
var headerParser = this.wiki.parseText("text/vnd.tiddlywiki",titleText,{parseAsInline: true}),
headerRenderTree = new $tw.WikiRenderTree(headerParser,{wiki: $tw.wiki, context: {tiddlerTitle: title}, document: document});
headerRenderTree.execute();
headerRenderTree.renderInDom(headerTitle);
var headerParser = this.wiki.new_parseText("text/vnd.tiddlywiki",titleText,{parseAsInline: true}),
headerParseTreeNode = headerParser ? {type: "widget", children: headerParser.tree} : undefined,
headerWidgetNode = new widget.widget(headerParseTreeNode,{
wiki: this.wiki,
parentWidget: $tw.rootWidget,
document: document
});
headerWidgetNode.render(modalHeader,null);
this.wiki.addEventListener("change",function(changes) {
headerRenderTree.refreshInDom(changes);
headerWidgetNode.refresh(changes,modalHeader,null);
});
// Render the body of the message
var bodyParser = this.wiki.parseTiddler(title),
bodyRenderTree = new $tw.WikiRenderTree(bodyParser,{wiki: $tw.wiki, context: {tiddlerTitle: title}, document: document});
bodyRenderTree.execute();
bodyRenderTree.renderInDom(modalBody);
var bodyParser = this.wiki.new_parseTiddler(title),
bodyParseTreeNode = bodyParser ? {type: "widget", children: bodyParser.tree} : undefined,
bodyWidgetNode = new widget.widget(bodyParseTreeNode,{
wiki: this.wiki,
parentWidget: $tw.rootWidget,
document: document
});
bodyWidgetNode.render(modalBody,null);
this.wiki.addEventListener("change",function(changes) {
bodyRenderTree.refreshInDom(changes);
bodyWidgetNode.refresh(changes,modalBody,null);
});
// Setup the link if present
if(options.downloadLink) {
@ -107,15 +117,19 @@ Modal.prototype.display = function(title,options) {
} else {
footerText = '<$button message="tw-close-tiddler" class="btn btn-primary">Close</$button>';
}
var footerParser = this.wiki.parseText("text/vnd.tiddlywiki",footerText,{parseAsInline: true}),
footerRenderTree = new $tw.WikiRenderTree(footerParser,{wiki: $tw.wiki, context: {tiddlerTitle: title}, document: document});
footerRenderTree.execute();
footerRenderTree.renderInDom(modalFooterButtons);
var footerParser = this.wiki.new_parseText("text/vnd.tiddlywiki",footerText,{parseAsInline: true}),
footerParseTreeNode = footerParser ? {type: "widget", children: footerParser.tree} : undefined,
footerWidgetNode = new widget.widget(footerParseTreeNode,{
wiki: this.wiki,
parentWidget: $tw.rootWidget,
document: document
});
footerWidgetNode.render(modalFooterButtons,null);
this.wiki.addEventListener("change",function(changes) {
footerRenderTree.refreshInDom(changes);
footerWidgetNode.refresh(changes,modalFooterButtons,null);
});
// Add the close event handler
wrapper.addEventListener("tw-close-tiddler",function(event) {
var closeHandler = function(event) {
// Decrease the modal count and adjust the body class
self.modalCount--;
self.adjustPageClass();
@ -136,9 +150,11 @@ Modal.prototype.display = function(title,options) {
}
},duration);
// Don't let anyone else handle the tw-close-tiddler message
event.stopPropagation();
return false;
},false);
};
headerWidgetNode.addEventListener("tw-close-tiddler",closeHandler,false);
bodyWidgetNode.addEventListener("tw-close-tiddler",closeHandler,false);
footerWidgetNode.addEventListener("tw-close-tiddler",closeHandler,false);
// Set the initial styles for the message
$tw.utils.setStyle(modalBackdrop,[
{opacity: "0"}

View File

@ -12,6 +12,8 @@ Notifier mechanism
/*global $tw: false */
"use strict";
var widget = require("$:/core/modules/new_widgets/widget.js");
var Notifier = function(wiki) {
this.wiki = wiki;
};
@ -35,12 +37,16 @@ Notifier.prototype.display = function(title,options) {
// Add classes
$tw.utils.addClass(notification,"tw-notification");
// Render the body of the notification
var bodyParser = this.wiki.parseTiddler(title),
bodyRenderTree = new $tw.WikiRenderTree(bodyParser,{wiki: $tw.wiki, context: {tiddlerTitle: title}, document: document});
bodyRenderTree.execute();
bodyRenderTree.renderInDom(notification);
var parser = this.wiki.new_parseTiddler(title),
parseTreeNode = parser ? {type: "widget", children: parser.tree} : undefined,
widgetNode = new widget.widget(parseTreeNode,{
wiki: this.wiki,
parentWidget: $tw.rootWidget,
document: document
});
widgetNode.render(notification,null);
this.wiki.addEventListener("change",function(changes) {
bodyRenderTree.refreshInDom(changes);
widgetNode.refresh(changes,notification,null);
});
// Set the initial styles for the notification
$tw.utils.setStyle(notification,[