jekyll-text-theme 1.4.3 → 1.5.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 93c347fb53eec2e1bda0852209a9049932e2d60e
-  data.tar.gz: ddaee6e856ae386f598f4ae358b7346caeef4c26
+  metadata.gz: cb89dc720f2e68655d150b10f7fb344b63ab461e
+  data.tar.gz: 89cc55c17ce994c93f655cdee03d873cfda5fc34
 SHA512:
-  metadata.gz: 912a7e1d30414c5af48861d85be7be7fba4284eb8c5b169b9d0e83922b8b1a5c91137995c7276694af268a0568376e49d7e1f9c6a0d783ec4ff2727f60fac783
-  data.tar.gz: 92667fb44eebd026105e1f4e1cd46eb0af28b9cd40eea63193e40830e843c6d760128c5572f91d17452f48f08adef21ef42366dd65767453bd60808c94df57f1
+  metadata.gz: cb737051b2a6a944797be9c0d7e93db7beb512768f4dbbcb460bad57a19d2f5959efd9e843cd11d06cce5ad0a5e8fbfcd41f243e504015bce12e3ffe22b2a13a
+  data.tar.gz: d0cba3d8ccf1fe07c48f3d2bfeed33cdb6e38f7e7599dafa1d6b2f44e325c45d6cc429ec23ab234ccabfe6824f186c9326af6dd6f298dd3816e48a5fcaf04739

data/README.md

@@ -4,13 +4,11 @@
 [![license](https://img.shields.io/github/license/kitian616/jekyll-TeXt-theme.svg)](https://github.com/kitian616/jekyll-TeXt-theme/blob/master/LICENSE)
 [![Travis](https://img.shields.io/travis/kitian616/jekyll-TeXt-theme.svg)](https://travis-ci.org/kitian616/jekyll-TeXt-theme)
 
-**==> [English (Beta)](https://github.com/kitian616/jekyll-TeXt-theme/blob/master/README-en.md) <==**
-
 ![TeXt Theme](https://raw.githubusercontent.com/kitian616/jekyll-TeXt-theme/master/screenshots/TeXt-home.png)
 
 ![TeXt Theme Details](https://raw.githubusercontent.com/kitian616/jekyll-TeXt-theme/master/screenshots/TeXt-details.png)
 
-**==> [English (Beta)](https://github.com/kitian616/jekyll-TeXt-theme/blob/master/README-en.md) <==**
+[Demo](https://tianqi.name/jekyll-TeXt-theme/) | [English (Beta)](https://github.com/kitian616/jekyll-TeXt-theme/blob/master/README-en.md)
 
 TeXt is a succinct theme for blogging.
 
@@ -20,8 +18,9 @@ TeXt 是针对博客的一款简洁的主题，它虽然简洁但并不简单。
 
 - 响应式
 - 分页（[jekyll-paginate](https://github.com/jekyll/jekyll-paginate)）
-- 文章目录（[TOC](http://projects.jga.me/toc/)）
+- 文章目录
 - 文章标签
+- 搜索（标题）
 - 阅读次数统计（[LeanCloud](https://leancloud.cn/)）
 - Emoji（[Jemoji](https://github.com/jekyll/jemoji)）
 - 评论（[Disqus](https://disqus.com/), [gitalk](https://gitalk.github.io/)）
@@ -32,6 +31,7 @@ TeXt 是针对博客的一款简洁的主题，它虽然简洁但并不简单。
 - Color Theme
 - 数学公式（[MathJax](https://www.mathjax.org/)）
 - 流程图， 序列图，甘特图（[mermaid](https://mermaidjs.github.io/)）
+- 柱状图，折线图，饼图，雷达图（[chartjs](http://www.chartjs.org/)）
 - RSS（[jekyll-feed](https://github.com/jekyll/jekyll-feed)）
 - 多语言支持（English | 简体中文 | 繁體中文）
 
@@ -111,7 +111,7 @@ bundle exec jekyll serve -H 0.0.0.0
 
 ### Color Theme
 
-颜色主题位于文件夹 ./\_sass/colors 中，修改 ./\_sass/settings/colors.scss 的 `@import` 路径即可修改主题，默认主题为 default。
+颜色主题位于文件夹 ./\_sass/colors 中，修改 ./\_config.yml 中的 text_color_theme 项为以下值即可更换颜色主题，默认主题为 default。
 
 | `default` | `dark` | `forest` |
 | --- |  --- | --- |
@@ -171,10 +171,11 @@ bundle exec jekyll serve -H 0.0.0.0
 | ---           | ---           | --- |
 | key           |               | 评论系统和阅读量统计使用的文章标识符，如果未设置则评论和统计无效。可用字符集：`字母`、`数字` 及 `- _ : .` |
 | lang          | en/zh/zh-Hans/zh-Hant | 该文章的语言，其优先级高于  ./\_config.yml 中设置的值 |
-| picture_frame | shadow        | 该文章的图片框样式，如果为 `shadow` 则图片带有阴影边框 |
 | modify_date   |               | 该文章的修改时间，不影响首页文章排序（`date` 代表发表时间，会影响文章排序） |
 | comment       | true/false    | 该文章是否能够评论，默认为 true（当然你也可以通过不设置 key 来实现，但是这样的话统计也失效了） |
 | mathjax       | true/false    | 该文章是否需要使用 MathJax 公式，默认为 false（此时只会在该文章页面中解析 MathJax 公式。当然你也可以配置 _config.yml 中的 `mathjax` 项为 true，让网站全局支持 MathJax 公式） |
+| mermaid       | true/false    | 该文章是否需要使用 Mermaid 绘制流程图 |
+| chart         | true/false    | 该文章是否需要使用 Chart 绘制图标 |
 
 ### 其他资源
 

data/_data/locale.yml

@@ -5,7 +5,7 @@ NAV:
     zh-Hans: "主页"
     zh-Hant: "主頁"
   ALL:
-    en:      "All"
+    en:      "Archive"
     zh:      "归档"
     zh-Hans: "归档"
     zh-Hant: "歸檔"
@@ -21,7 +21,11 @@ READMORE:
   zh-Hans: "点我阅读更多..."
   zh-Hant: "「點我閱讀更多」"
 
-COPYRIGHT_DATES: "2018"
+VIEWS:
+  en:      "views"
+  zh:      "阅读"
+  zh-Hans: "阅读"
+  zh-Hant: "閱讀"
 
 LAST_UPDATED:
   en:      "Last updated"
@@ -29,6 +33,18 @@ LAST_UPDATED:
   zh-Hans: "更新于"
   zh-Hant: "更新於"
 
+PREVIOUS:
+  en:      "PREVIOUS"
+  zh:      "上篇"
+  zh-Hans: "上篇"
+  zh-Hant: "上篇"
+
+NEXT:
+  en:      "NEXT"
+  zh:      "下篇"
+  zh-Hans: "下篇"
+  zh-Hant: "下篇"
+
 ARTICLE_DATE_FORMAT:
   en:      "%b %d, %Y"
   zh:      "%Y年 %m月%d日"
@@ -75,4 +91,6 @@ EMAIL_ME:
   en:      "Send me Email."
   zh:      "给我发邮件。"
   zh-Hans: "给我发邮件。"
-  zh-Hant: "給我發郵件。"
+  zh-Hant: "給我發郵件。"
+
+COPYRIGHT_DATES: "2018"

data/_data/variables.yml

@@ -0,0 +1,31 @@
+default:
+  text_color_theme: default
+  paths:
+    base: /
+    home: /
+    all:  /all.html
+    rss:  /feed.xml
+  lang: zh
+  sources: bootcss
+  toc:
+    selectors: 'h1,h2,h3'
+
+sources:
+  bootcss:
+    jquery: 'https://cdn.bootcss.com/jquery/3.1.1/jquery.min.js'
+    leancloud_js_sdk: '//cdn1.lncld.net/static/js/3.4.1/av-min.js'
+    chart: 'https://cdn.bootcss.com/Chart.js/2.7.1/Chart.bundle.min.js'
+    gitalk:
+      js: 'https://cdn.bootcss.com/gitalk/1.2.2/gitalk.min.js'
+      css: 'https://cdn.bootcss.com/gitalk/1.2.2/gitalk.min.css'
+    mathjax: 'https://cdn.bootcss.com/mathjax/2.7.2/MathJax.js?config=TeX-MML-AM_CHTML'
+    mermaid: 'https://cdn.bootcss.com/mermaid/7.1.2/mermaid.min.js'
+  unpkg:
+    jquery: 'https://unpkg.com/jquery@3.3.1/dist/jquery.min.js'
+    leancloud_js_sdk: '//cdn1.lncld.net/static/js/3.4.1/av-min.js'
+    chart: 'https://unpkg.com/chart.js@2.7.1/dist/Chart.min.js'
+    gitalk:
+      js: 'https://unpkg.com/gitalk@1.2.2/dist/gitalk.min.js'
+      css: 'https://unpkg.com/gitalk@1.2.2/dist/gitalk.css'
+    mathjax: 'https://unpkg.com/mathjax@2.7.3/unpacked/MathJax.js?config=TeX-MML-AM_CHTML'
+    mermaid: 'https://unpkg.com/mermaid@7.1.2/dist/mermaid.min.js'

data/_includes/{blog → components}/article-data.html

@@ -15,7 +15,7 @@
     {%- assign cur_page = page -%}
 	{%- endif -%}
 	{%- if cur_page.tags[0] -%}
-    <ul class="inline-list tag-wrapper">
+    <ul class="tag-wrapper">
       {%- if site.paths.all -%}
         {%- assign all_path = site.paths.all -%}
       {%- else -%}
@@ -33,9 +33,11 @@
 	{%- endif -%}
   <div class="other-wrapper">
     {%- if site.leancloud.app_id and site.leancloud.app_key and site.leancloud.app_class -%}
+      {%- assign __locale = site.data.locale.VIEWS } -%}
+      {%- include snippets/locale-to-string.html -%}
       <div class="view-wrapper">
         <span class="article-view" id="post-key-{{ cur_page.key }}">0
-        </span> views
+        </span> {{ __return }}
       </div>
     {%- endif -%}
     <div class="date-wrapper">

data/_includes/{info → components}/follow-me.html

@@ -1,7 +1,7 @@
 <div class="follow-me">
   {%- assign __locale = site.data.locale.FOLLOW_ME -%}
   {%- include snippets/locale-to-string.html -%}
-  <ul class="inline-list" itemscope itemtype="http://schema.org/Person">
+  <ul itemscope itemtype="http://schema.org/Person">
     <meta itemprop="name" content="{{ site.author.name }}">
     <link itemprop="url" href="{{ '/' | prepend: site.url }}">
     {%- if site.author.weibo -%}

data/_includes/{blog → components}/footer.html

@@ -1,6 +1,6 @@
 <div class="m-page-footer js-page-footer">
   <div class="main">
-    <aside> {%- include info/follow-me.html -%} </aside>
+    <aside> {%- include components/follow-me.html -%} </aside>
     <footer class="site-info">
       <p>© {{ site.title }} {{ site.data.locale.COPYRIGHT_DATES }}</p>
       <p>Powered by <a title="Jekyll is a simple, blog-aware, static site generator." href="http://jekyllrb.com/">Jekyll</a> & <a

data/_includes/components/header.html

@@ -0,0 +1,42 @@
+<header class="m-page-header">
+  <div class="main clearfix">
+    <div class='site-logo'>
+    {%- include logo/logo.svg -%}
+    {%- assign __path = site.paths.base | default: site.data.variables.default.paths.base  -%}
+    {%- include snippets/get-nav-url.html -%}
+    {%- if site.title -%}
+      <a title="{%- if site.description -%}{{ site.description }}{%- endif -%}" href="{{ __return }}">{{ site.title }}</a>
+    {%- endif -%}
+    </div>
+    <nav>
+      <ul>
+        {%- assign __path = site.paths.home | default: site.data.variables.default.paths.home -%}
+        {%- include snippets/get-nav-url.html -%}
+        {%- assign href = __return -%}
+        {%- assign __locale = site.data.locale.NAV.HOME -%}
+        {%- include snippets/locale-to-string.html -%}
+        <li><a href="{{ href }}">{{ __return }}</a></li>
+        {%- assign __path = site.paths.all | default: site.data.variables.default.paths.all -%}
+        {%- include snippets/get-nav-url.html -%}
+        {%- assign href = __return -%}
+        {%- assign __locale = site.data.locale.NAV.ALL -%}
+        {%- include snippets/locale-to-string.html -%}
+        <li><a href="{{ href }}">{{ __return }}</a></li>
+        {%- for list in site.nav_lists -%}
+          {%- assign __path = list.url -%}
+          {%- include snippets/get-nav-url.html -%}
+          {%- assign href = __return -%}
+          {%- assign __locale = list.titles -%}
+          {%- include snippets/locale-to-string.html -%}
+          <li><a href="{{ href }}">{%- if list.title -%}{{ list.title }}{%- else -%}{{ __return }}{%- endif -%}</a></li>
+        {%- endfor -%}
+        {%- assign __path = site.paths.rss | default: site.data.variables.default.paths.rss -%}
+        {%- include snippets/get-nav-url.html -%}
+        {%- assign href = __return -%}
+        {%- assign __locale = site.data.locale.NAV.RSS -%}
+        {%- include snippets/locale-to-string.html -%}
+        <li><a type="application/rss+xml" href="{{ href }}">{{ __return }}</a></li>
+      </ul>
+    </nav>
+  </div>
+</header>

data/_includes/{blog → components}/tags.html

@@ -15,11 +15,11 @@
 {%- if gap_size < 1 -%}
   {%- assign gap_size = 1 -%}
 {%- endif -%}
-<div class="m-tags">
-  <ul class="inline-list">
+<div class="m-tags js-tags">
+  <ul>
     <li>
-      <button type="button" class="js-article-tag js-tag-show-all all pill-button" onclick="tagSelect('')">Show All
-        <div class="tag-count">{{ site.posts | size }}</div>
+      <button type="button" class="js-article-tag js-tag-show-all all pill-button inactive" data-encode="">
+        Show All<div class="tag-count">{{ site.posts | size }}</div>
       </button>
     </li>
     {%- for tag in _tags -%}
@@ -43,8 +43,7 @@
       {%- else -%}
         {%- assign c_index = 4 -%}
       {%- endif -%}
-      <li><button type="button" class="js-article-tag tag-{{ c_index }} pill-button"
-        data-tag="{{ tag[0] | strip | url_encode }}" onclick="tagSelect('{{ tag[0] | strip | url_encode }}')">
+      <li><button type="button" class="js-article-tag tag-{{ c_index }} pill-button inactive" data-encode="{{ tag[0] | strip | url_encode }}">
           <span>{{ tag[0] | strip }}</span><div class="tag-count">{{ tag[1].size }}</div>
         </button>
       </li>

data/_includes/icon/clear.svg

@@ -0,0 +1,3 @@
+<svg fill="#000000" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg">
+    <path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/>
+</svg>

data/_includes/icon/link.svg

@@ -0,0 +1 @@
+<svg fill="#000000" width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>

data/_includes/icon/omit.svg

@@ -0,0 +1 @@
+<svg fill="#000000" width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M6 10c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm12 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm-6 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/></svg>

data/_includes/icon/search.svg

@@ -0,0 +1,3 @@
+<svg fill="#000000" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg">
+    <path d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"/>
+</svg>

data/_includes/scripts/all.html

@@ -0,0 +1,244 @@
+{%- include snippets/page-title.html -%}
+{%- assign _title = __return -%}
+{%- include snippets/get-sources.html -%}
+{%- assign _sources = __return -%}
+{%- assign __path = '/search.json' -%}
+{%- include snippets/prepend-baseurl.html -%}
+{%- assign _search_path = __return -%}
+<script>
+  (function() {
+    function queryString() {
+      // This function is anonymous, is executed immediately and
+      // the return value is assigned to QueryString!
+      var i = 0,
+        queryObj = {},
+        pair;
+      var queryStr = window.location.search.substring(1);
+      var queryArr = queryStr.split('&');
+      for (i = 0; i < queryArr.length; i++) {
+        pair = queryArr[i].split('=');
+        // If first entry with this name
+        if (typeof queryObj[pair[0]] === 'undefined') {
+          queryObj[pair[0]] = pair[1];
+          // If second entry with this name
+        } else if (typeof queryObj[pair[0]] === 'string') {
+          queryObj[pair[0]] = [queryObj[pair[0]], pair[1]];
+          // If third or later entry with this name
+        } else {
+          queryObj[pair[0]].push(pair[1]);
+        }
+      }
+      return queryObj;
+    }
+
+    function decodeUrl(str) {
+      return str ? decodeURIComponent(str.replace(/\+/g, '%20')) : '';
+    }
+
+    function memorize(f) {
+      var cache = {};
+      return function () {
+        var key = Array.prototype.join.call(arguments, ',');
+        if (key in cache) return cache[key];
+        else return cache[key] = f.apply(this, arguments);
+      };
+    };
+    function initData(json) {
+      var _data = JSON.parse(json), i, j, cur, _tags;
+      Object.keys(_data).forEach(function(year) {
+        for (i = 0; i < _data[year].length; i++) {
+          cur = _data[year][i], _tags = cur.tags;
+          cur.title = decodeUrl(cur.title);
+          if (_tags && _tags.length > 0) {
+            for (j = 0; j < _tags.length; j++) {
+              _tags[j] = decodeUrl(_tags[j]);
+            }
+          }
+        }
+      });
+      return _data;
+    }
+
+    var setUrlQuery = (function() {
+      var baseUrl =  window.location.href.split('?')[0];
+      return function(query) {
+        if (typeof query === 'string') {
+          window.history.replaceState(null, '', baseUrl + query);
+        } else {
+          window.history.replaceState(null, '', baseUrl);
+        }
+      }
+    })();
+
+    var data = initData('{%- include scripts/data.html -%}');
+
+    var searchByTag = memorize(function(tag) {
+      var i, j, cur, _tags, _tag, _data = {};
+      Object.keys(data).forEach(function(year) {
+        for (i = 0; i < data[year].length; i++) {
+          cur = data[year][i], _tags = cur.tags;
+          if (_tags && _tags.length > 0) {
+            for (j = 0; j < _tags.length; j++) {
+              _tag = _tags[j];
+              if (_tag === tag) {
+                if (!_data[year]) {
+                  _data[year] = []
+                }
+                _data[year].push(cur);
+                break;
+              }
+            }
+          }
+        }
+      });
+      return _data;
+    });
+
+    var searchByQuery = function(query) {
+      var i, j, cur, _title, _data = { _: [] };
+      Object.keys(data).forEach(function(year) {
+        for (i = 0; i < data[year].length; i++) {
+          cur = data[year][i], _title = cur.title;
+          if (_title.toLowerCase().indexOf(query.toLowerCase()) >= 0) {
+            _data._.push(cur);
+          }
+        }
+      });
+      return _data;
+    };
+
+    window.Lazyload.js('{{ _sources.jquery }}', function() {
+      var $root = $('.js-all');
+      var $searchBox = $('.js-search-box');
+      var $searchInput = $searchBox.children('input');
+      var $searchClear = $searchBox.children('.icon-clear');
+      var $tags = $('.js-tags');
+      var $articleTags = $('.js-article-tag');
+      var $tagShowAll = $('.js-tag-show-all');
+      var $result = $('.js-result');
+      var $lastFocusButton = null;
+
+      function addClass(dom, className) {
+        dom.hasClass(className) || dom.addClass(className);
+      }
+      function removeClass(dom, className) {
+        dom.hasClass(className) && dom.removeClass(className);
+      }
+
+      var renderHeading = memorize(function (year) {
+        return $('<h2 class="year">' + year + '</h2>');
+      });
+      var renderItem = memorize(function (key, title, date, url, tags) {
+        return $('<li><span class="date">' + date + '</span><a class="link" href="' + url + '">' + title + '</a></li>');
+      });
+      function render(data) {
+        var $dom = $('<div></div>'), $section, $ul, i, cur, date;
+        Object.keys(data).sort(function(a, b) {
+          return b.localeCompare(a);
+        }).forEach(function(year) {
+          $section = $('<section></section>'), $ul = $('<ul></ul>');
+          (year === '_') || $section.append(renderHeading(year));
+          for (i = 0; i < data[year].length; i++) {
+            cur = data[year][i];
+            $ul.append(renderItem(cur.key, cur.title, cur.date, cur.url, cur.tags));
+          }
+          $dom.append($section.append($ul));
+        })
+        return $dom;
+      }
+
+      function searchButtonsByTag(_tag/*raw tag*/) {
+        if (!_tag) {
+          return $tagShowAll;
+        }
+        var _buttons = $articleTags.filter('[data-encode="' + _tag + '"]');
+        if (_buttons.length === 0) {
+          return $tagShowAll;
+        }
+        return _buttons;
+      }
+      function buttonFoucs(target) {
+        if (target) {
+          addClass(target, 'focus');
+          $lastFocusButton && !$lastFocusButton.is(target) && removeClass($lastFocusButton, 'focus');
+          $lastFocusButton = target;
+        }
+      }
+
+      function setIsSearch() {
+        addClass($root, 'search');
+      }
+      function setNotSearch() {
+        removeClass($root, 'search');
+      }
+      function setIsEmpty() {
+        removeClass($searchBox, 'not-empty');
+      }
+      function setNotEmpty() {
+        addClass($searchBox, 'not-empty');
+      }
+      function setSearchBoxVal(val) {
+        ($searchInput.val() === val) || $searchInput.val(val);
+      }
+      function clearSearchBox() {
+        setSearchBoxVal(''); queryInput('');
+      }
+
+      function showAll() {
+        setNotSearch(); setIsEmpty(); buttonFoucs($tagShowAll); setUrlQuery();
+        $result.html(render(data));
+      }
+      function tagSelect(tag/*decode tag*/, target) {
+        var _data, _tag;
+        if (tag === '' || tag === undefined) {
+          showAll();
+        } else {
+          $result.html(render(searchByTag(tag)));
+        }
+        if (target) {
+          buttonFoucs(target);
+          _tag = target.data('encode');
+          if (_tag === '' || typeof _tag !== 'string') {
+            setUrlQuery();
+          } else {
+            setUrlQuery('?tag=' + _tag)
+          }
+        }
+      }
+      function queryInput(query) {
+        var _data;
+        if (query === '' || typeof query !== 'string') {
+          showAll();
+        } else {
+          $result.html(render(searchByQuery(query))); setIsSearch(); setNotEmpty(); setUrlQuery('?q=' + query);
+
+        }
+      }
+
+      (function() {
+        $articleTags.removeClass('inactive');
+        var query = queryString(), _tag = query.tag, _q = query.q;
+        if (_tag !== undefined) {
+          query.tag === undefined || (_tag = query.tag);
+          tagSelect(decodeUrl(_tag));
+          buttonFoucs(searchButtonsByTag(_tag));
+        } else if (_q !== undefined) {
+          queryInput(_q); setSearchBoxVal(_q);
+        } else {
+          showAll();
+        }
+      })();
+
+      $tags.on('click', 'button', function() {
+        tagSelect($(this).children('span').text(), $(this));
+      });
+
+      $searchInput.on('input', window.throttle(function() {
+        queryInput($(this).val());
+      }, 400));
+      $searchClear.on('click', function() {
+        clearSearchBox();
+      });
+    });
+  })();
+</script>