mirror of
https://github.com/Jermolene/TiddlyWiki5
synced 2024-12-24 00:50:28 +00:00
Update modal message mechanism to support custom footers
This commit is contained in:
parent
a689abf0c1
commit
d21a70f085
@ -1,6 +1,7 @@
|
||||
title: $:/messages/EnterEditMode
|
||||
type: text/x-tiddlywiki
|
||||
subtitle: Editing this wiki
|
||||
footer: <<button close class:"btn btn-primary"><Close>>
|
||||
help: http://alpha.tiddlywiki.com/#help:EditMode
|
||||
|
||||
You can edit this wiki and save your changes. You are strongly advised to verify that saving is working properly before trusting ~TiddlyWiki with your data.
|
||||
|
@ -1,6 +1,7 @@
|
||||
title: $:/messages/SaveInstructions
|
||||
type: text/x-tiddlywiki
|
||||
subtitle: Save your work
|
||||
footer: <<button close class:"btn btn-primary"><Close>>
|
||||
help: http://alpha.tiddlywiki.com/#help:SavingChanges
|
||||
|
||||
Your changes to this wiki need to be saved as a ~TiddlyWiki HTML file.
|
||||
|
@ -45,7 +45,7 @@ exports.startup = function() {
|
||||
rootElement: document.body
|
||||
});
|
||||
// Install the modal message mechanism
|
||||
$tw.modal = new $tw.utils.Modal(this);
|
||||
$tw.modal = new $tw.utils.Modal($tw.wiki);
|
||||
document.addEventListener("tw-modal",function(event) {
|
||||
$tw.modal.display(event.param);
|
||||
},false);
|
||||
|
@ -17,20 +17,59 @@ var Modal = function(wiki) {
|
||||
};
|
||||
|
||||
Modal.prototype.display = function(title) {
|
||||
// Create the wrapper divs
|
||||
var wrapper = document.createElement("div"),
|
||||
template,renderer;
|
||||
template = "$:/templates/ModalMessage";
|
||||
renderer = $tw.wiki.parseTiddler(template);
|
||||
renderer.execute([],title);
|
||||
renderer.renderInDom(wrapper);
|
||||
$tw.wiki.addEventListener("",function(changes) {
|
||||
renderer.refreshInDom(changes);
|
||||
modalBackdrop = document.createElement("div"),
|
||||
modalWrapper = document.createElement("div"),
|
||||
modalHeader = document.createElement("div"),
|
||||
headerTitle = document.createElement("h1"),
|
||||
modalBody = document.createElement("div"),
|
||||
modalFooter = document.createElement("div"),
|
||||
modalFooterHelp = document.createElement("div"),
|
||||
modalFooterButtons = document.createElement("div");
|
||||
// Add classes
|
||||
$tw.utils.addClass(modalBackdrop,"modal-backdrop");
|
||||
$tw.utils.addClass(modalWrapper,"modal");
|
||||
$tw.utils.addClass(modalHeader,"modal-header");
|
||||
$tw.utils.addClass(modalBody,"modal-body");
|
||||
$tw.utils.addClass(modalFooter,"modal-footer");
|
||||
// Join them together
|
||||
wrapper.appendChild(modalBackdrop);
|
||||
wrapper.appendChild(modalWrapper);
|
||||
modalHeader.appendChild(headerTitle);
|
||||
modalWrapper.appendChild(modalHeader);
|
||||
modalWrapper.appendChild(modalBody);
|
||||
modalFooter.appendChild(modalFooterHelp);
|
||||
modalFooter.appendChild(modalFooterButtons);
|
||||
modalWrapper.appendChild(modalFooter);
|
||||
// Render the title of the message
|
||||
var headerRenderer = this.wiki.parseText("text/x-tiddlywiki-run","<<view subtitle wikified>>");
|
||||
headerRenderer.execute([],title);
|
||||
headerRenderer.renderInDom(headerTitle);
|
||||
this.wiki.addEventListener("",function(changes) {
|
||||
headerRenderer.refreshInDom(changes);
|
||||
});
|
||||
// Render the body of the message
|
||||
var bodyRenderer = this.wiki.parseTiddler(title);
|
||||
bodyRenderer.execute([],title);
|
||||
bodyRenderer.renderInDom(modalBody);
|
||||
this.wiki.addEventListener("",function(changes) {
|
||||
bodyRenderer.refreshInDom(changes);
|
||||
});
|
||||
// Render the footer of the message
|
||||
var footerRenderer = this.wiki.parseText("text/x-tiddlywiki-run","<<view footer wikified>>");
|
||||
footerRenderer.execute([],title);
|
||||
footerRenderer.renderInDom(modalFooterButtons);
|
||||
this.wiki.addEventListener("",function(changes) {
|
||||
footerRenderer.refreshInDom(changes);
|
||||
});
|
||||
// Add the close event handler
|
||||
wrapper.addEventListener("tw-close",function(event) {
|
||||
document.body.removeChild(wrapper);
|
||||
event.stopPropagation();
|
||||
return false;
|
||||
},false);
|
||||
// Put the message into the document
|
||||
document.body.appendChild(wrapper);
|
||||
};
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user