Search improvements

1. Extended edit macro to allow a search-styled input to be used
2. Moved search box into nav bar

core/modules/macros/edit/edit.js

@@ -17,7 +17,7 @@ exports.info = {
 	params: {
 		field: {byPos: 0, type: "text"},
 		tiddler: {byName: true, type: "tiddler"},
-		singleline: {byName: true, type: "text"},
+		type: {byName: true, type: "text"},
 		"default": {byName: true, type: "text"}
 	}
 };

core/modules/macros/edit/editors/texteditor.js

@@ -56,14 +56,29 @@ TextEditor.prototype.getChild = function() {
 		},
 		tagName,
 		content = [];
-	// Make a textarea for text fields and an input box for other fields
+	if(this.macroNode.classes) {
-	if(edit.field !== "text" || this.macroNode.hasParameter("singleline")) {
+		$tw.utils.pushTop(attributes["class"],this.macroNode.classes);
+	}
+	// Figure out what element to use for this editor
+	var type = this.macroNode.params.type;
+	if(type === undefined) {
+		type = edit.field === "text" ? "textarea" : "input";
+	}
+	switch(type) {
+		case "textarea":
+			tagName = "textarea";
+			content.push($tw.Tree.Text(edit.value));
+			break;
+		case "search":
+			tagName = "input";
+			attributes.type = "search";
+			attributes.value = edit.value;
+			break;
+		default: // "input"
 			tagName = "input";
 			attributes.type = "text";
 			attributes.value = edit.value;
-	} else {
+			break;
-		tagName = "textarea";
-		content.push($tw.Tree.Text(edit.value));
 	}
 	// Wrap the editor control in a div
 	return $tw.Tree.Element(this.macroNode.isBlock ? "div" : "span",{},[$tw.Tree.Element(tagName,attributes,content)],{

core/templates/PageTemplate.tid

@@ -24,6 +24,28 @@ title: $:/templates/PageTemplate
 * [[Docs]]
 *{{divider-vertical}}
 
+<form class="form-search">
+
+{{search-query{
+<<edit tiddler:[[$:/search/text]] type:search>>
+}}}
+
+<div style="position:absolute; z-index:1000;">
+
+<<reveal state:[[$:/search/text]] type:nomatch text:""><
+
+<div class="open">
+<div class="dropdown-menu">
+<<list filter:"[searchVia[$:/search/text]!is[shadow]sort[title]limit[10]]" template:"$:/templates/SearchResultTemplate" emptyMessage:"//No results//">>
+</div>
+</div>
+
+>>
+
+</div>
+
+</form>
+
 <!-- Full screen button -->
 <<button full-screen class:"btn btn-warning"><Full screen>>
 

core/templates/SearchResultTemplate.tid

@@ -0,0 +1,3 @@
+title: $:/templates/SearchResultTemplate
+
+<<view title link>>

tw5.com/tiddlers/Search.tid

@@ -1,21 +0,0 @@
-title: Search
-
-Search: <<edit tiddler:[[$:/search/text]]>>
-
-<div style="position:absolute; z-index:1000;">
-
-<<reveal state:[[$:/search/text]] type:nomatch text:""><
-
-<div class="open">
-<div class="dropdown-menu">
-(((
-
-[searchVia[$:/search/text]!is[shadow]sort[title]]
-
-)) <<view title link>> )
-</div>
-</div>
-
->>
-
-</div>

tw5.com/tiddlers/TiddlySpot.tid

@@ -14,7 +14,7 @@ TiddlyWiki5 isn't yet built in to TiddlySpot but you can use it by following the
 
 ! TiddlySpot details
 
-Wiki name: <<edit tiddler:[[$:/UploadName]] default:"" singleline:yes>>
+Wiki name: <<edit tiddler:[[$:/UploadName]] default:"" type:input>>
 
 Password: <<password upload>>
 
@@ -22,6 +22,6 @@ Password: <<password upload>>
 
 If you're using a server other than TiddlySpot, you can set the server URL here:
 
-Service URL: <<edit tiddler:[[$:/UploadURL]] default:"" singleline:yes>>
+Service URL: <<edit tiddler:[[$:/UploadURL]] default:"" type:input>>
 
 //(by default, the server URL is `http://<wikiname>.tiddlyspot.com/store.cgi`)//