Add action-popup widget

Fixes #4185

core/modules/widgets/action-popup.js

@@ -0,0 +1,79 @@
+/*\
+title: $:/core/modules/widgets/action-popup.js
+type: application/javascript
+module-type: widget
+
+Action widget to trigger a popup.
+
+\*/
+(function(){
+
+/*jslint node: true, browser: true */
+/*global $tw: false */
+"use strict";
+
+var Widget = require("$:/core/modules/widgets/widget.js").widget;
+
+var ActionPopupWidget = function(parseTreeNode,options) {
+	this.initialise(parseTreeNode,options);
+};
+
+/*
+Inherit from the base widget class
+*/
+ActionPopupWidget.prototype = new Widget();
+
+/*
+Render this widget into the DOM
+*/
+ActionPopupWidget.prototype.render = function(parent,nextSibling) {
+	this.computeAttributes();
+	this.execute();
+};
+
+/*
+Compute the internal state of the widget
+*/
+ActionPopupWidget.prototype.execute = function() {
+	this.actionState = this.getAttribute("$state");
+	this.actionCoords = this.getAttribute("$coords");
+};
+
+/*
+Refresh the widget by ensuring our attributes are up to date
+*/
+ActionPopupWidget.prototype.refresh = function(changedTiddlers) {
+	var changedAttributes = this.computeAttributes();
+	if(changedAttributes["$state"] || changedAttributes["$coords"]) {
+		this.refreshSelf();
+		return true;
+	}
+	return this.refreshChildren(changedTiddlers);
+};
+
+/*
+Invoke the action associated with this widget
+*/
+ActionPopupWidget.prototype.invokeAction = function(triggeringWidget,event) {
+	// Trigger the popup
+	var popupLocationRegExp = /^\((-?[0-9\.E]+),(-?[0-9\.E]+),(-?[0-9\.E]+),(-?[0-9\.E]+)\)$/,
+		match = popupLocationRegExp.exec(this.actionCoords);
+	if(match) {
+		$tw.popup.triggerPopup({
+			domNode: null,
+			domNodeRect: {
+				left: parseFloat(match[1]),
+				top: parseFloat(match[2]),
+				width: parseFloat(match[3]),
+				height: parseFloat(match[4])
+			},
+			title: this.actionState,
+			wiki: this.wiki
+		});
+	}
+	return true; // Action was invoked
+};
+
+exports["action-popup"] = ActionPopupWidget;
+
+})();

editions/tw5.com/tiddlers/widgets/ActionPopupWidget.tid

@@ -0,0 +1,29 @@
+caption: action-popup
+created: 20200303114556528
+modified: 20200303114556528
+tags: Widgets ActionWidgets
+title: ActionPopupWidget
+type: text/vnd.tiddlywiki
+
+! Introduction
+
+The ''action-popup'' widget is an [[action widget|ActionWidgets]] that triggers the display of a popup defined via a state tiddler. ActionWidgets are used within triggering widgets such as the ButtonWidget.
+
+! Content and Attributes
+
+The ''action-popup'' widget is invisible. Any content within it is ignored.
+
+|!Attribute |!Description |
+|$state |The title of the state tiddler for the popup |
+|$coords |Optional coordinates for the handle to which popup is positioned (in the format `(x,y,w,h)`) |
+
+! Examples
+
+Here is an example of button that triggers the "more" button in the sidebar "Tools" tab
+
+<$macrocall $name='wikitext-example-without-html'
+src='<$button>
+<$action-setfield $tiddler="$:/state/tab/sidebar-1206596165" $value="$:/core/ui/SideBar/Tools"/>
+<$action-popup $state="$:/state/popup/more-435115636" $coords="(0,20,0,0)"/>
+Click me!
+</$button>'/>