mirrors/TiddlyWiki5
1
0
Fork 0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-11-23 10:07:19 +00:00
Code Issues Releases Wiki Activity

Toggle a style on the page container when a modal is displayed

Browse Source
This commit is contained in:
Jeremy Ruston 2013-06-04 16:19:47 +01:00
parent 376d24ff39
commit 854a9d6d1c
2 changed files with 19 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
core/modules/startup.js
View File

@ -116,9 +116,10 @@ exports.startup = function() {
parser = $tw.wiki.parseTiddler(templateTitle), parser = $tw.wiki.parseTiddler(templateTitle),
renderTree = new $tw.WikiRenderTree(parser,{wiki: $tw.wiki, context: {tiddlerTitle: templateTitle}, document: document}); renderTree = new $tw.WikiRenderTree(parser,{wiki: $tw.wiki, context: {tiddlerTitle: templateTitle}, document: document});
renderTree.execute(); renderTree.execute();
var container = document.createElement("div"); $tw.pageContainer = document.createElement("div");
document.body.insertBefore(container,document.body.firstChild); $tw.utils.addClass($tw.pageContainer,"tw-page-container");
renderTree.renderInDom(container); document.body.insertBefore($tw.pageContainer,document.body.firstChild);
renderTree.renderInDom($tw.pageContainer);
$tw.wiki.addEventListener("change",function(changes) { $tw.wiki.addEventListener("change",function(changes) {
renderTree.refreshInDom(changes); renderTree.refreshInDom(changes);
}); });

15
core/modules/utils/dom/modal.js
View File

@ -14,6 +14,7 @@ Modal message mechanism
var Modal = function(wiki) { var Modal = function(wiki) {
this.wiki = wiki; this.wiki = wiki;
this.modalCount = 0;
}; };
/* /*
@ -25,6 +26,10 @@ Options include:
*/ */
Modal.prototype.display = function(title,options) { Modal.prototype.display = function(title,options) {
options = options || {}; options = options || {};
var self = this;
// Up the modal count and adjust the body class
this.modalCount++;
this.adjustPageClass();
// Create the wrapper divs // Create the wrapper divs
var wrapper = document.createElement("div"), var wrapper = document.createElement("div"),
modalBackdrop = document.createElement("div"), modalBackdrop = document.createElement("div"),
@ -43,6 +48,7 @@ Modal.prototype.display = function(title,options) {
return; return;
} }
// Add classes // Add classes
$tw.utils.addClass(wrapper,"modal-wrapper");
$tw.utils.addClass(modalBackdrop,"modal-backdrop"); $tw.utils.addClass(modalBackdrop,"modal-backdrop");
$tw.utils.addClass(modalWrapper,"modal"); $tw.utils.addClass(modalWrapper,"modal");
$tw.utils.addClass(modalHeader,"modal-header"); $tw.utils.addClass(modalHeader,"modal-header");
@ -110,6 +116,9 @@ Modal.prototype.display = function(title,options) {
}); });
// Add the close event handler // Add the close event handler
wrapper.addEventListener("tw-close-tiddler",function(event) { wrapper.addEventListener("tw-close-tiddler",function(event) {
// Decrease the modal count and adjust the body class
self.modalCount--;
self.adjustPageClass();
// Force layout and animate the modal message away // Force layout and animate the modal message away
$tw.utils.forceLayout(modalBackdrop); $tw.utils.forceLayout(modalBackdrop);
$tw.utils.forceLayout(modalWrapper); $tw.utils.forceLayout(modalWrapper);
@ -159,6 +168,12 @@ Modal.prototype.display = function(title,options) {
]); ]);
}; };
Modal.prototype.adjustPageClass = function() {
if($tw.pageContainer) {
$tw.utils.toggleClass($tw.pageContainer,"tw-modal-displayed",this.modalCount > 0);
}
};
exports.Modal = Modal; exports.Modal = Modal;
})(); })();