Improve CircleCI Docs Search Experience (circleci#161)

FelicianoTech · FelicianoTech · commit 2ac80b552c91 · 2016-05-30T10:48:23.000-07:00
Enables full text search for docs. Search priority is title, category, URL,
then doc contents.

Also, shows "No results found" when nothing comes up. Hopefully this reduces
the number of people thinking the search box is broken.
diff --git a/jekyll/assets/css/main.scss b/jekyll/assets/css/main.scss
@@ -63,6 +63,9 @@ nav.sidebar{
 		right: 10%;
 		left: 10%;
 	}
+		#search-results li span{
+			padding: 3px 20px;
+		}
 
 
 // Article
diff --git a/jekyll/assets/js/search-index.json b/jekyll/assets/js/search-index.json
@@ -5,8 +5,9 @@ layout: null
 	{% for doc in site.docs  %}
 		"{{ doc.url | slugify }}":{
 			"title": "{{ doc.title | xml_escape }}",
-			"url": "{{ site.baseurl  }}{{ doc.url | xml_escape }}",
-			"categories": "{{ doc.categories | join: ',' | xml_escape }}"
+			"url": "{{ doc.url | xml_escape }}",
+			"categories": "{{ doc.categories | join: ',' | xml_escape }}",
+			"content": {{ doc.content | strip_html | strip_newlines | jsonify }}
 		}
 		{% unless forloop.last %},{% endunless %}
 	{% endfor %}
diff --git a/jekyll/assets/js/search.js b/jekyll/assets/js/search.js
@@ -6,8 +6,10 @@ jQuery(function(){
 	// a boost of 10 to indicate matches on it are more important.
 	window.idx = lunr(function () {
 		this.field('id');
-		this.field('title', { boost: 10 });
-		this.field('category');
+		this.field('title', { boost: 20 });
+		this.field('category', { boost: 10 });
+		this.field('url', { boost: 5 });
+		this.field('content');
 	});
 
 	// Download the data from the JSON file we generated
@@ -58,7 +60,8 @@ jQuery(function(){
 					$search_results.append(appendString);
 				});
 			}else{
-				$search_results.toggle(false);
+				$search_results.empty();
+				$search_results.append('<li><span>No results found</span></li>');
 			}
 		});
 	}

Original file line number	Diff line number	Diff line change
`@@ -63,6 +63,9 @@ nav.sidebar{`
`63`	`63`	`right: 10%;`
`64`	`64`	`left: 10%;`
`65`	`65`	`}`
	`66`	`+ #search-results li span{`
	`67`	`+ padding: 3px 20px;`
	`68`	`+ }`
`66`	`69`
`67`	`70`
`68`	`71`	`// Article`