mirror of
https://github.com/Jermolene/TiddlyWiki5
synced 2025-01-12 02:10:27 +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:
parent
48dbacc88a
commit
2a571b4f5f
@ -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",{
|
||||
|
@ -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"}
|
||||
|
@ -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,[
|
||||
|
Loading…
Reference in New Issue
Block a user