From 1b339e17bc0c67ff7eb3e8f7f299588ecf8848ee Mon Sep 17 00:00:00 2001
From: Tobias Beer <beertobias@gmail.com>
Date: Fri, 13 Jan 2017 19:17:19 +0100
Subject: [PATCH] Add "tag" attribute to keyboard widget (#2593)

* allows to define the tag for keyboard widget

* added from 5.1.14 to docs
---
 core/modules/widgets/keyboard.js                     | 9 +++++++--
 editions/tw5.com/tiddlers/widgets/KeyboardWidget.tid | 3 ++-
 2 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/core/modules/widgets/keyboard.js b/core/modules/widgets/keyboard.js
index 8d2c105a7..f253d864a 100644
--- a/core/modules/widgets/keyboard.js
+++ b/core/modules/widgets/keyboard.js
@@ -33,8 +33,12 @@ KeyboardWidget.prototype.render = function(parent,nextSibling) {
 	// Compute attributes and execute state
 	this.computeAttributes();
 	this.execute();
+	var tag = this.parseTreeNode.isBlock ? "div" : "span";
+	if(this.tag && $tw.config.htmlUnsafeElements.indexOf(this.tag) === -1) {
+		tag = this.tag;
+	}
 	// Create element
-	var domNode = this.document.createElement("div");
+	var domNode = this.document.createElement(tag);
 	// Assign classes
 	var classes = (this["class"] || "").split(" ");
 	classes.push("tc-keyboard");
@@ -72,6 +76,7 @@ KeyboardWidget.prototype.execute = function() {
 	this.message = this.getAttribute("message");
 	this.param = this.getAttribute("param");
 	this.key = this.getAttribute("key");
+	this.tag = this.getAttribute("tag");
 	this.keyInfoArray = $tw.keyboardManager.parseKeyDescriptors(this.key);
 	this["class"] = this.getAttribute("class");
 	// Make child widgets
@@ -83,7 +88,7 @@ Selectively refreshes the widget if needed. Returns true if the widget or any of
 */
 KeyboardWidget.prototype.refresh = function(changedTiddlers) {
 	var changedAttributes = this.computeAttributes();
-	if(changedAttributes.message || changedAttributes.param || changedAttributes.key || changedAttributes["class"]) {
+	if(changedAttributes.message || changedAttributes.param || changedAttributes.key || changedAttributes["class"] || changedAttributes.tag) {
 		this.refreshSelf();
 		return true;
 	}
diff --git a/editions/tw5.com/tiddlers/widgets/KeyboardWidget.tid b/editions/tw5.com/tiddlers/widgets/KeyboardWidget.tid
index 41a38c6c8..b38786f28 100644
--- a/editions/tw5.com/tiddlers/widgets/KeyboardWidget.tid
+++ b/editions/tw5.com/tiddlers/widgets/KeyboardWidget.tid
@@ -1,6 +1,6 @@
 caption: keyboard
 created: 20140302192136805
-modified: 20160429175258940
+modified: 20161003114634019
 tags: Widgets
 title: KeyboardWidget
 type: text/vnd.tiddlywiki
@@ -19,6 +19,7 @@ The content of the `<$keyboard>` widget is rendered normally. The keyboard short
 |param |The parameter to be passed with the [[WidgetMessage|Messages]] |
 |key |Key string identifying the key(s) to be trapped (see below) |
 |class |A CSS class to be assigned to the generated HTML DIV element |
+|tag|<<.from-version "5.1.14">> The html element the widget creates to capture the keyboard event, defaults to:<br>» `span` when parsed in inline-mode<br>» `div` when parsed in block-mode|
 
 ! Key Strings