moby/views/layout.jade

An open-source website (and CLI) for searching the largest thesaurus in the English language.

mixin form(q)
  form(method="get" action="/search")
    input(name="q" id="q" value=q type="text" placeholder="Find synonyms" autocapitalize="off" autocorrect="off" autofocus x-webkit-speech)

doctype html
html
  head
    title
      if q
        = "Synonyms for '" + q + "' in the Moby Thesaurus"
      else
        = "Moby Thesaurus"

    meta(name="viewport" content="width=device-width, initial-scale=1")
    meta(name="description" content="A free and open-source website for searching the largest thesaurus in the English language.")

    link(href='//fonts.googleapis.com/css?family=PT+Sans:400,700' rel='stylesheet' type='text/css')
    link(rel="shortcut icon" href="/images/favicon.ico" type="image/x-icon")
    link(rel="apple-touch-icon" href="/images/apple-touch-icon.png")
    link(rel="apple-touch-icon" sizes="57x57" href="/images/apple-touch-icon-57x57.png")
    link(rel="apple-touch-icon" sizes="72x72" href="/images/apple-touch-icon-72x72.png")
    link(rel="apple-touch-icon" sizes="76x76" href="/images/apple-touch-icon-76x76.png")
    link(rel="apple-touch-icon" sizes="114x114" href="/images/apple-touch-icon-114x114.png")
    link(rel="apple-touch-icon" sizes="120x120" href="/images/apple-touch-icon-120x120.png")
    link(rel="apple-touch-icon" sizes="144x144" href="/images/apple-touch-icon-144x144.png")
    link(rel="apple-touch-icon" sizes="152x152" href="/images/apple-touch-icon-152x152.png")

    link(rel='stylesheet', type='text/css', href='/styles.css')

    script(src='//cdnjs.cloudflare.com/ajax/libs/store.js/1.3.14/store.min.js')

    script.
      window.analytics=window.analytics||[],window.analytics.methods=["identify","group","track","page","pageview","alias","ready","on","once","off","trackLink","trackForm","trackClick","trackSubmit"],window.analytics.factory=function(t){return function(){var a=Array.prototype.slice.call(arguments);return a.unshift(t),window.analytics.push(a),window.analytics}};for(var i=0;i<window.analytics.methods.length;i++){var key=window.analytics.methods[i];window.analytics[key]=window.analytics.factory(key)}window.analytics.load=function(t){if(!document.getElementById("analytics-js")){var a=document.createElement("script");a.type="text/javascript",a.id="analytics-js",a.async=!0,a.src=("https:"===document.location.protocol?"https://":"http://")+"cdn.segment.io/analytics.js/v1/"+t+"/analytics.min.js";var n=document.getElementsByTagName("script")[0];n.parentNode.insertBefore(a,n)}},window.analytics.SNIPPET_VERSION="2.0.9",
      window.analytics.load("7yxiqtbj6t");
      window.analytics.page();

      document.addEventListener("DOMContentLoaded", function(event) {

        document.querySelector("#q").focus()

        // Toggle view mode
        if (document.querySelector("#mode_switcher")) {
          document.querySelector("#mode_switcher").addEventListener('click', function(event) {
            event.preventDefault();
            document.body.classList.toggle('list-mode')
          })
        }

        // Save query history in localStorage
        var query = document.querySelector("#q").value
        var queries = store.get("queries")
        if (!queries) queries = {}

        if (query) {
          queries[Date.now()] = query
          store.set("queries", queries)
        }

        if (location.hash === "#show-queries") {
          var recentQueryLinks = Object.keys(queries).reverse().map(function(key) {
            return "<li><a href=\"/search?q=" + queries[key] + "\">" + queries[key] + "</a><li>"
          }).join("")
          //- console.log(recentQueryLinks);
          document.querySelector("#queries")
            .insertAdjacentHTML('afterend', "<h2>Your recent queries:</h2> <ul class='results'>" + recentQueryLinks + "</ul>")
        }

      })

    block head

  body

    header
      section
        if !q
          h1 moby
        +form(q)

    section
      block content

    footer