Extend button widget to allow navigating to a tiddler

Fixes #327
This commit is contained in:
Jermolene 2014-02-22 16:13:16 +00:00
parent ec606c89d2
commit 2ab0facf3a
4 changed files with 13 additions and 6 deletions

View File

@ -53,6 +53,10 @@ ButtonWidget.prototype.render = function(parent,nextSibling) {
// Add a click event handler
domNode.addEventListener("click",function (event) {
var handled = false;
if(self.to) {
self.dispatchEvent({type: "tw-navigate", navigateTo: self.to, tiddlerTitle: self.getVariable("currentTiddler")});
handled = true;
}
if(self.message) {
self.dispatchMessage(event);
handled = true;
@ -110,6 +114,7 @@ Compute the internal state of the widget
*/
ButtonWidget.prototype.execute = function() {
// Get attributes
this.to = this.getAttribute("to");
this.message = this.getAttribute("message");
this.param = this.getAttribute("param");
this.set = this.getAttribute("set");
@ -129,7 +134,7 @@ Selectively refreshes the widget if needed. Returns true if the widget or any of
*/
ButtonWidget.prototype.refresh = function(changedTiddlers) {
var changedAttributes = this.computeAttributes();
if(changedAttributes.message || changedAttributes.param || changedAttributes.set || changedAttributes.setTo || changedAttributes.popup || changedAttributes.hover || changedAttributes["class"] || changedAttributes.selectedClass || changedAttributes.style || (this.set && changedTiddlers[this.set]) || (this.popup && changedTiddlers[this.popup])) {
if(changedAttributes.to || changedAttributes.message || changedAttributes.param || changedAttributes.set || changedAttributes.setTo || changedAttributes.popup || changedAttributes.hover || changedAttributes["class"] || changedAttributes.selectedClass || changedAttributes.style || (this.set && changedTiddlers[this.set]) || (this.popup && changedTiddlers[this.popup])) {
this.refreshSelf();
return true;
}

View File

@ -1,4 +1,4 @@
title: $:/core/ui/PageControls/control-panel
tags: $:/tags/PageControls
<$link to="$:/ControlPanel">{{$:/core/images/options-button}}</$link>
<$button to="$:/ControlPanel" class="btn-invisible">{{$:/core/images/options-button}}</$button>

View File

@ -3,10 +3,10 @@ title: $:/snippets/autosavestatus
\define lingo-base() $:/language/ControlPanel/Saving/
<$reveal type="match" state="$:/config/AutoSave" text="yes">
<<lingo AutoSave/Enabled/Prompt>>
<$linkcatcher to="$:/config/AutoSave"><$link to="no"><<lingo AutoSave/Enabled/Button>>
</$link></$linkcatcher>
<$linkcatcher to="$:/config/AutoSave"><$button to="no"><<lingo AutoSave/Enabled/Button>>
</$button></$linkcatcher>
</$reveal>
<$reveal type="nomatch" state="$:/config/AutoSave" text="yes">
<<lingo AutoSave/Disabled/Prompt>>
<$linkcatcher to="$:/config/AutoSave"><$link to="yes"><<lingo AutoSave/Disabled/Button>></$link></$linkcatcher>
<$linkcatcher to="$:/config/AutoSave"><$button to="yes"><<lingo AutoSave/Disabled/Button>></$button></$linkcatcher>
</$reveal>

View File

@ -1,12 +1,13 @@
title: ButtonWidget
created: 201310241419
modified: 201310300837
modified: 201402220837
tags: widget
! Introduction
The button widget displays an HTML `<button>` element that can perform a combination optional actions when clicked:
* Navigate to a specified tiddler
* Dispatch a user defined [[widget message|WidgetMessages]]
* Trigger a user defined [[popup|PopupMechanism]]
* Assign new text to a specified tiddler
@ -16,6 +17,7 @@ The button widget displays an HTML `<button>` element that can perform a combina
The content of the `<$button>` widget is displayed within the button.
|!Attribute |!Description |
|to |The title of the tiddler to navigate to |
|message |The name of the [[widget message|WidgetMessages]] to send when the button is clicked |
|param |The optional parameter to the message |
|set |The title of a tiddler to which a new value will be assigned |