mirrors/TiddlyWiki5
1
0
Fork 0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-09-27 22:58:19 +00:00
Code Issues Releases Wiki Activity

Update modal handling to allow variables to be passed

Browse Source 
@felixhayashi I’m afraid I haven’t used your pull request as there were
a few details that I wanted to do differently. The main change is that
these changes allow both a param string and hashmap to be specified.
This commit is contained in:
Jermolene 2014-11-07 14:54:46 +00:00
parent c7971d3da3
commit 91a7c39791
4 changed files with 53 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
core/modules/startup/rootwidget.js
View File

@ -23,7 +23,7 @@ exports.startup = function() {
// Install the modal message mechanism
$tw.modal = new $tw.utils.Modal($tw.wiki);
$tw.rootWidget.addEventListener("tm-modal",function(event) {
$tw.modal.display(event.param);
$tw.modal.display(event.param,{variables: event.paramObject});
});
// Install the notification mechanism
$tw.notifier = new $tw.utils.Notifier($tw.wiki);

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

@ -35,6 +35,8 @@ Modal.prototype.display = function(title,options) {
if(!tiddler) {
return;
}
// Create the variables
var variables = $tw.utils.extend({currentTiddler: title},options.variables);
// Create the wrapper divs
var wrapper = document.createElement("div"),
modalBackdrop = document.createElement("div"),
@ -76,7 +78,8 @@ Modal.prototype.display = function(title,options) {
value: title
}}}],
parentWidget: $tw.rootWidget,
document: document
document: document,
variables: variables
});
headerWidgetNode.render(headerTitle,null);
this.wiki.addEventListener("change",function(changes) {
@ -85,7 +88,8 @@ Modal.prototype.display = function(title,options) {
// Render the body of the message
var bodyWidgetNode = this.wiki.makeTranscludeWidget(title,{
parentWidget: $tw.rootWidget,
document: document
document: document,
variables: variables
});
bodyWidgetNode.render(modalBody,null);
this.wiki.addEventListener("change",function(changes) {
@ -125,7 +129,8 @@ Modal.prototype.display = function(title,options) {
}}}
]}],
parentWidget: $tw.rootWidget,
document: document
document: document,
variables: variables
});
footerWidgetNode.render(modalFooterButtons,null);
this.wiki.addEventListener("change",function(changes) {

12
editions/prerelease/tiddlers/SampleModal.tid Normal file
View File

@ -0,0 +1,12 @@
created: 20140912145537860
footer: <$button message="tm-close-tiddler">Close</$button>
modified: 20140912145537861
subtitle: This is a modal created especially for <<yourName>>
title: SampleModal
type: text/vnd.tiddlywiki
! Hello, <<yourName>>
This is an example modal containing the following message:
<<yourMessage>>

32
editions/prerelease/tiddlers/WidgetMessage_ tm-modal.tid Normal file
View File

@ -0,0 +1,32 @@
created: 20140811112133701
modified: 20141107142803042
tags: Messages
title: WidgetMessage: tm-modal
type: text/vnd.tiddlywiki
caption: tm-modal
The modal message displays a specified tiddler in a modal overlay that dims the main page. It requires the following properties on the `event` object:
|!Name |!Description |
|param |Title of the tiddler to be displayed |
|paramObject |Hashmap of variables to be provided to the modal |
The "currentTiddler" variable is set to the title of the modal tiddler, but can be overridden by specifying a different value in `paramObject`.
The modal message is usually generated with the ButtonWidget. The modal message is handled by the TiddlyWiki core.
! Example
Here is an example of displaying a modal and passing parameters to it:
<$macrocall $name='wikitext-example-without-html'
src='Your name: <$edit-text tiddler="$:/temp/yourName" tag="input" default="Your name"/>
Your message:
<$edit-text tiddler="$:/temp/yourMessage" default="Your message"/>
<$button>
<$action-sendmessage $message="tm-modal" $param="SampleModal" yourName={{$:/temp/yourName}} yourMessage={{$:/temp/yourMessage}}/>
Click me!
</$button>'/>