refactor search index

Author: zdenko

Cakefile

@@ -179,11 +179,11 @@ buildDocs = (watch = no) ->
   sectionsSourceFolder = 'documentation/sections'
   examplesSourceFolder = 'documentation/examples'
   outputFolder         = "docs/v#{majorVersion}"
-  {structure}          = require "./documentation/structure.coffee"
+  cheerio              = require "cheerio"
 
-  searchCollections =
-    docs: []
-    changelogs: []
+  searchCollection =
+    tree: {}
+    data: []
 
   # Helpers
   releaseHeader = (date, version, prevVersion) ->
@@ -193,8 +193,8 @@ buildDocs = (watch = no) ->
       </h3>
     """
 
-  monthNames = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']
   formatDate = (date) ->
+    monthNames = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']
     date.replace /^(\d\d\d\d)-(\d\d)-(\d\d)$/, (match, $1, $2, $3) ->
       "#{monthNames[$2 - 1]} #{+$3}, #{$1}"
 
@@ -213,12 +213,7 @@ buildDocs = (watch = no) ->
   """
   # Template for search result item.
   searchResultsList = """
-    <div class="cs-docsearch-suggestion--wrapper searchWrapper" data-href="<%= href %>">
-      <div class="cs-docsearch-suggestion--subcategory-column">
-        <span class="cs-docsearch-suggestion--subcategory-column-text">
-          <%= subsection %>
-        </span>
-      </div>
+    <div class="cs-docsearch-suggestion--wrapper searchWrapper" data-href="<%= section %>">
       <div class="cs-docsearch-suggestion--content">
         <div class="cs-docsearch-suggestion--title">
           <%= title %>
@@ -230,39 +225,46 @@ buildDocs = (watch = no) ->
   searchResultsTemplate = _.template(searchResults).source
   searchResultsListTemplate = _.template(searchResultsList).source
 
-  # Remove markup from content used for search collections
-  clean = (content) ->
-    content
-      .replace /<[^>]*>/g, " "                  # remove HTML tags
-      .replace /\[([^\]]+)\]\([^\)]+\)/g, "$1"  # remove URL link
-      .replace /\*[^\S]+/g, ""                  # remove list markup
-      .replace /\*\*?|__?|#+?/g, ""             # remove Markdown format
-      .replace /\t|\n/g, " "
-      .replace /^\s+/g, " "
-
   # Build search catalog.
-  searchCatalog = (mdDoc, section, data) ->
-    return unless match = /^(#+?)\s+([^\n]+)\s+([\s\S]+)/.exec mdDoc
-    [, level, title, body] = match
-    content = clean body
-    unless section is "changelog"
-      content = content.replace /```[^\`]+```/g, ""
-      weight = level.length
-      {parent, href} = data
-      searchCollections.docs.push {section, title, weight, content, parent, href}
-    else
-      # Break changelogs into (release) chunks.
-      releaseLogs = content.split /```\s*releaseHeader\(([^\)]+)\)\s*```/
-      for rlog, ix in releaseLogs when ix % 2 isnt 0
-        data = rlog.replace(/\\?'/g, "").split /,\s*/
-        date = formatDate data[0]
-        release = data[1]
-        searchCollections.changelogs.push
-          section: "Changelogs"
-          title: "#{release} &mdash; #{date}"
-          content: releaseLogs[ix + 1]
-          parent: "Changelogs"
-          href: "##{release}"
+  buildSearchCatalog = (html) ->
+    $ = cheerio.load html
+    parseSectionContent = (section, level) ->
+      sectionId = $(section).attr "id"
+      header = "> h#{level + 1}"
+      # Chagelogs subsections, e.g. <a>2.3.0</a> - <time>May 21, 2018</time>
+      version = $("#{header} a", section).text()
+      date = $("#{header} span time", section).text()
+      title = if version and date then "#{version} - #{date}" else $(header, section).text()
+      dataLevel = $(section).data("level") or no
+      content = $(":not(section)", section).text()
+                  .replace ///^#{title}///, ""    # Remove title from the content.
+                  .replace /\n+/g, " "            # Convertnewlines into spaces.
+                  .replace /^(?:\t|\s)+/g, " "    # Remove extra spaces.
+      {section:sectionId, title, content, dataLevel}
+
+    addCollection = ({el, level, parent=no}) ->
+      {section, title, dataLevel} = data = Object.assign {}, parseSectionContent(el, level), {level, parent}
+      if not dataLevel and parent
+        dataLevel = searchCollection.tree[parent].dataLevel
+      searchCollection.tree[section] = {title, parent, dataLevel}
+      searchCollection.data.push Object.assign {}, data, {dataLevel}
+      section
+
+    parseSections = (sections, level=1, parent=no) ->
+      # Level 1, e.g. main > section
+      sections.each (i, el) ->
+        section = addCollection {el, level, parent}
+        # Level 2, e.g. main > section > section
+        subSections = $("section", el)
+        if subSections?.length > 1
+          parseSections subSections, level + 1, section
+
+    parseSections $("main.main > section")
+    """
+      window.searchResultTemplate = #{searchResultsTemplate};
+      window.searchResultsListTemplate = #{searchResultsListTemplate};
+      window.searchCollection = #{JSON.stringify searchCollection};
+    """
 
   htmlFor = ->
     hljs = require 'highlight.js'
@@ -293,7 +295,6 @@ buildDocs = (watch = no) ->
       md = md.replace /<%= releaseHeader %>/g, releaseHeader
       md = md.replace /<%= majorVersion %>/g, majorVersion
       md = md.replace /<%= fullVersion %>/g, CoffeeScript.VERSION
-      searchCatalog md, file, searchData
       html = markdownRenderer.render md
       html = _.template(html)
         codeFor: codeFor()
@@ -307,64 +308,6 @@ buildDocs = (watch = no) ->
       code = transpile code
       code
 
-  # Build body HTML.
-  buildBody = ->
-    sectionTemplate = """
-      <section id="<%= id %>">
-        <%= sectionBody %>
-      </section>
-    """
-    body = []
-    sectionTemplate = _.template sectionTemplate
-    buildSection = (section) ->
-      sectionTemplate section
-
-    for section in structure when section.html and section.html.length > 0
-      {id, title, html, href = no, children = []} = section
-      href = "##{id}" unless href
-      sectionBody = (@htmlFor(h, {parent: title, href}) for h in html)
-      if children.length > 0
-        for child in children when child.html and child.html.length > 0
-          cHref = "##{child.id}" unless child.href
-          childBody = (@htmlFor(h, {parent: title, href:cHref}) for h in child.html)
-          sectionBody.push buildSection {id: child.id, sectionBody: childBody.join("")}
-      body.push buildSection {id: section.id, sectionBody: sectionBody.join("")}
-
-    body.join ""
-
-  # Build sidebar HTML.
-  buildSidebar = ->
-    link = """
-       <a href="<%= href %>" class="nav-link<%= className %>" data-action="sidebar-nav"><%= title %></a>
-    """
-    nav = """
-      <nav class="nav flex-column">
-      <%= links %>
-      </nav>
-    """
-    sidebar = []
-    linkTemplate = _.template link
-    navTemplate = _.template nav
-    buildNav = (links) ->
-      navTemplate links
-    buildLink = (link) ->
-      link.className = " #{link.className}" unless link.className is ""
-      linkTemplate link
-
-    for section in structure
-      {id, title, href = no, className = "", children = []} = section
-      href = "##{id}" unless href
-      sidebar.push buildLink {title, href, className}
-      if children.length > 0
-        childLinks = []
-        for child in children
-          {id:cId, title:cTitle, href:cHref = no, className:cClassName = ""} = child
-          cHref = "##{cId}" unless cHref
-          childLinks.push buildLink {title: cTitle, href: cHref, className: cClassName}
-        sidebar.push buildNav {links: childLinks.join ""}
-
-    buildNav links: sidebar.join ""
-
   include = ->
     (file) ->
       file = "#{siteSourceFolder}/#{file}" unless '/' in file
@@ -376,25 +319,17 @@ buildDocs = (watch = no) ->
           majorVersion: majorVersion
           fullVersion: CoffeeScript.VERSION
           htmlFor: htmlFor()
-          buildBody: buildBody
-          buildSidebar: buildSidebar
           codeFor: codeFor()
           include: include()
           includeScript: includeScript()
       output
 
   do renderIndex = ->
     render = _.template fs.readFileSync(indexFile, 'utf-8')
-    output = render
-      include: include()
-    searchIdx = """
-      window.searchResultTemplate = #{searchResultsTemplate};
-      window.searchResultsListTemplate = #{searchResultsListTemplate};
-      window.searchCollections = #{JSON.stringify searchCollections};
-      window.initializeSearch();
-    """
-    fs.writeFileSync "#{outputFolder}/search-index.js", searchIdx
-    log 'output', green, "#{outputFolder}/search-index.js"
+    output = render include: include()
+    searchIndex = buildSearchCatalog output
+    fs.writeFileSync "#{outputFolder}/search-index.js", searchIndex
+    log 'compiled', green, "search index → #{outputFolder}/search-index.js"
     fs.writeFileSync "#{outputFolder}/index.html", output
     log 'compiled', green, "#{indexFile} → #{outputFolder}/index.html"
   try