Ddoc: in-site (Ddox-like) search

css/ddox.css

@@ -53,52 +53,6 @@ a.inherited:after { content: url(../images/ddox/inherited.png); padding-left: 3p
 
 #symbolSearch { width: 112pt; }
 
-#symbolSearchResults {
-	background: #F5F5F5;
-	border: 1px solid #CCC;
-	font-size: small;
-	list-style: none;
-	margin: 0;
-	margin-top: 5px;
-	padding: 0.3em;
-	position: absolute;
-	right: -1px;
-	top: 100%;
-	width: 100%;
-	z-index: 1000;
-}
-
-#symbolSearchResults li {
-	background-repeat: no-repeat;
-	background-position: left center;
-	padding-left: 18px;
-}
-
-#top #symbolSearchResults li a {
-	color: #B03931;
-	height: auto;
-	padding: 0;
-}
-#symbolSearchResults li a:hover
-{
-	background: transparent;
-	color: #742620;
-	text-decoration: underline;
-}
-
-#symbolSearchResults .deprecated a { color: gray; }
-#symbolSearchResults .module { background-image: url(../images/ddox/module.png); }
-#symbolSearchResults .functiondeclaration { background-image: url(../images/ddox/function.png); }
-#symbolSearchResults .classdeclaration { background-image: url(../images/ddox/class.png); }
-#symbolSearchResults .interfacedeclaration { background-image: url(../images/ddox/interface.png); }
-#symbolSearchResults .structdeclaration { background-image: url(../images/ddox/struct.png); }
-#symbolSearchResults .variabledeclaration { background-image: url(../images/ddox/variable.png); }
-#symbolSearchResults .property { background-image: url(../images/ddox/property.png); }
-#symbolSearchResults .enumdeclaration { background-image: url(../images/ddox/enum.png); }
-#symbolSearchResults .enummemberdeclaration { background-image: url(../images/ddox/enummember.png); }
-#symbolSearchResults .aliasdeclaration { background-image: url(../images/ddox/alias.png); }
-#symbolSearchResults .templatedeclaration { background-image: url(../images/ddox/template.png); }
-
 /* Don't show simple handcrafted cheat sheets. DDOX does a good job generating
  * them. */
 table.simple-cheatsheet { display: none; }

css/style.css

@@ -2134,3 +2134,53 @@ Custom modifications to the navigation menu
     margin-bottom: 1em;
     padding-top: 0.5em;
 }
+
+/**
+In-site documentation search box and its results.
+*/
+
+#symbolSearchResults {
+	background: #F5F5F5;
+	border: 1px solid #CCC;
+	font-size: small;
+	list-style: none;
+	margin: 0;
+	margin-top: 5px;
+	padding: 0.3em;
+	position: absolute;
+	right: -1px;
+	top: 100%;
+	width: 100%;
+	z-index: 1000;
+}
+
+#symbolSearchResults li {
+	background-repeat: no-repeat;
+	background-position: left center;
+	padding-left: 18px;
+}
+
+#top #symbolSearchResults li a {
+	color: #B03931;
+	height: auto;
+	padding: 0;
+}
+#symbolSearchResults li a:hover
+{
+	background: transparent;
+	color: #742620;
+	text-decoration: underline;
+}
+
+#symbolSearchResults .deprecated a { color: gray; }
+#symbolSearchResults .module { background-image: url(../images/ddox/module.png); }
+#symbolSearchResults .functiondeclaration { background-image: url(../images/ddox/function.png); }
+#symbolSearchResults .classdeclaration { background-image: url(../images/ddox/class.png); }
+#symbolSearchResults .interfacedeclaration { background-image: url(../images/ddox/interface.png); }
+#symbolSearchResults .structdeclaration { background-image: url(../images/ddox/struct.png); }
+#symbolSearchResults .variabledeclaration { background-image: url(../images/ddox/variable.png); }
+#symbolSearchResults .property { background-image: url(../images/ddox/property.png); }
+#symbolSearchResults .enumdeclaration { background-image: url(../images/ddox/enum.png); }
+#symbolSearchResults .enummemberdeclaration { background-image: url(../images/ddox/enummember.png); }
+#symbolSearchResults .aliasdeclaration { background-image: url(../images/ddox/alias.png); }
+#symbolSearchResults .templatedeclaration { background-image: url(../images/ddox/template.png); }

dlang.org.ddoc

@@ -36,8 +36,10 @@ COMMON_SCRIPTS =
     $(COMMON_SCRIPTS_DLANG)
 _=
 COMMON_SCRIPTS_DLANG =
-    $(SCRIPTLOAD $(STATIC js/codemirror-compressed.js))
+    $(SCRIPTLOAD $(STATIC js/codemirror-compressed.js), async)
     $(SCRIPTLOAD $(STATIC js/run.js))
+    $(SCRIPTLOAD $(STATIC library/symbols.js), async)
+    $(SCRIPTLOAD $(STATIC js/ddox.js), async)
 _=
 
 COMPATIBILITY_BOX_DEPRECATED = $(MESSAGE_BOX red, $(B Deprecated) - $0)
@@ -417,6 +419,7 @@ SEARCH_BOX=
                 </select>
             ))$(SPANID search-submit, <button type="submit"><i class="fa fa-search"></i><span>go</span></button>)
         </form>
+        <ul id="symbolSearchResults" class="symbolList" style="display: none"></ul>
     )
 SEARCH_OPTIONS_EXTRA=
 _=

js/ddox.js

@@ -34,7 +34,10 @@ function performSymbolSearch(maxlen)
 {
 	if (maxlen === 'undefined') maxlen = 26;
 
-	var searchstring = $("#symbolSearch").val().toLowerCase();
+	var el = $("#symbolSearch");
+	if (el.length  === 0) el = $("#q");
+
+	var searchstring = el.val().toLowerCase();
 
 	if (searchstring == lastSearchString) return;
 	lastSearchString = searchstring;
@@ -118,7 +121,20 @@ function performSymbolSearch(maxlen)
 			if (np > 0) shortname = ".." + shortname;
 			else shortname = shortname.substr(1);
 
-			el.append('<a href="'+symbolSearchRootDir+sym.path+'" title="'+name+'" tabindex="1001">'+shortname+'</a>');
+			if (typeof(symbolSearchRootDir) === "undefined") {
+				// translate ddox path into ddoc path -  this is a big messy
+				var module = ddoxSymbolToDdocModule(sym);
+				var path;
+				if (sym.kind === "module") {
+					path = module;
+				} else {
+					var symbol = ddoxSymbolToDdocSymbol(sym);
+					path = module + "#" + symbol; // combine module + symbol, e.g. core_atomic.html#testCAS
+				}
+				el.append('<a href="'+path+'" title="'+name+'" tabindex="1001">'+shortname+'</a>');
+			} else {
+				el.append('<a href="'+symbolSearchRootDir+sym.path+'" title="'+name+'" tabindex="1001">'+shortname+'</a>');
+			}
 			$('#symbolSearchResults').append(el);
 		}
 
@@ -129,6 +145,40 @@ function performSymbolSearch(maxlen)
 	$('#symbolSearchResults').show();
 }
 
+function ddoxSymbolToDdocModule(sym)
+{
+	// sym.path: ./core/atomic/test_cas.html
+	// ddoc has an individual page for each top-level symbol, so we need to go one level higher to get the actual module name
+	if (sym.kind === "module")
+		return sym.name.split(".").join("_") + ".html";
+
+	var path = sym.path.slice(0, -5); // strip the html extension from the path, e.g. ./core/atomic/test_cas
+	path = path.replace(/(.*)\/(.*)$/g, "$1.html"); // the module is one level higher, e.g. ./core/atomic.html
+	path = path.replace(/\//g, "_"); // ddoc uses _ to divide modules, e.g. ._core_atomic.html
+	path = path.replace("._", ""); // remove the beginning excess, e.g. core_atomic.html
+	return path;
+}
+
+function ddoxSymbolToDdocSymbol(sym)
+{
+	var pathBaseName = sym.path.replace(/.*?([^\/]*)[.]html(.*)/g, "$1$2"); // the basename on the HTML, e.g. socket_option_level.html#IP
+	if (sym.path.indexOf("#") >= 0 || pathBaseName.indexOf(".") >= 0) {
+		// sym.name: std.socket.SocketOptionLevel.IP, sym.path: "./std/socket/socket_option_level.html#IP -> SocketOptionLevel.IP
+		// this is the difficult case where the symbol is nested
+		// strategy: take the last two portions of the package name and hope for the best
+		var parts = sym.name.split(".").slice(-2);
+		if (parts[0] === parts[1]) {
+			// an eponymous template
+			return parts[0];
+		} else {
+		return "." + parts.join(".");
+		}
+	} else {
+		// sym.name: core.atomic.testCAS
+		return sym.name.replace(/(.*)[.](.*)$/g, "$2") // testCAS
+	}
+}
+
 $(function(){
   $("#search-box form").on("submit", function(e) {
     var searchResults = $('#symbolSearchResults').children();

js/dlang.js

@@ -74,5 +74,20 @@
                 elem.show();
             }
         });
+
+      // wire the search box to the ddox search
+      // only for ddoc pages for now
+      if ($('body').hasClass("std"))
+      {
+        var search = $("#q")
+        search.attr("placeholder", "API Search");
+        search.attr("autocomplete", "off");
+        var onChange = function(){
+          performSymbolSearch(80);
+        };
+        search.on("change", onChange);
+        search.on("keypress", onChange);
+        search.on("input", onChange);
+      }
     });
 })(jQuery);