Feature: Custom sidebar display behavior. hexojs#20, hexojs#74, hexoj…

…s#142.
zhipengyan · May 12, 2015 · e2cb7d8 · e2cb7d8
1 parent 99d5fa5
commit e2cb7d8
Show file tree

Hide file tree

Showing 6 changed files with 42 additions and 7 deletions.
diff --git a/README.md b/README.md
@@ -134,11 +134,13 @@ menu:
   tags: /tags
   #about: /about
 
+
 # Favicon
 # 从`Next 0.2`起，favicon将不再放置于主题之内。
 # 请将你的favicon放置在`hexo-site/source/`目录下。
 favicon: /favicon.ico
 
+
 # 设置为`false`不显示`rss`链接
 # 留空，并且通过`hexo-site-feed`插件配置使用默认的feed
 # 设置成特定的`url`，适用于通过第三方服务定制feed的情况。
@@ -157,18 +159,30 @@ icon_font: default
 # available: normal | night | night eighties | night blue | night bright
 highlight_theme: normal
 
+
 # MathJax support
 # 开启数学公式渲染支持，默认关闭。设置为 `true` 开启。
 mathjax:
 
 
 # Mist
+# 使用 Mist 主题
 #scheme: Mist
 
 
+# Sidebar 侧栏行为，可选值有
+#  - post   默认值，在文章页面自动展开侧栏
+#  - always 在所有页面自动展开侧栏
+#  - hide   在手动点击侧栏的开关按钮时展开
+sidebar: post
+#sidebar: always
+#sidebar: hide
+
+
 # `阅读全文` 按钮跳转之后是否自动滚动页面到设置 `<!-- more -->` 的地方。
 scroll_to_more: true
 
+
 # 是否为侧边栏文章的目录自动添加索引，默认开启。设置为 `false` 关闭。
 toc_list_number: true
 ```

diff --git a/_config.yml b/_config.yml
@@ -39,6 +39,15 @@ mathjax:
 #scheme: Mist
 
 
+# Sidebar, available value:
+#  - post    expand on posts automatically. Default.
+#  - always  expand for all pages automatically
+#  - hide    expand only when click on the sidebar toggle icon.
+sidebar: post
+#sidebar: always
+#sidebar: hide
+
+
 # Automatically scroll page to section which is under <!-- more --> mark.
 scroll_to_more: true
 

diff --git a/layout/_layout.swig b/layout/_layout.swig
@@ -53,6 +53,15 @@
 
   {% block script_extra %}{% endblock %}
 
+  <script type="text/javascript">
+    var HEXO_SIDEBAR_CONFIGURATION = '{{ theme.sidebar }}';
+    $(document).ready(function () {
+      if (HEXO_SIDEBAR_CONFIGURATION === 'always') {
+        displaySidebar();
+      }
+    });
+  </script>
+
   {% include '_scripts/mathjax.swig' %}
   {% block comment_system %}{% endblock %}
 

diff --git a/layout/_scripts/helpers.swig b/layout/_scripts/helpers.swig
@@ -22,4 +22,10 @@
   function escapeSelector (selector) {
     return selector.replace(/[!"$%&'()*+,.\/:;<=>?@[\\\]^`{|}~]/g, "\\$&")
   }
+
+  function displaySidebar () {
+    setTimeout(function () {
+      $('.sidebar-toggle').trigger('click');
+    }, 800);
+  }
 </script>
diff --git a/layout/_scripts/motion/global.swig b/layout/_scripts/motion/global.swig
@@ -26,7 +26,7 @@
     var sidebarToogleLine3rdStatusClose = {width: '100%', rotateZ: '45deg', top: '-5px'};
 
     LogoAndMenuMotion();
-    sidebatToggleMotion();
+    sidebarToggleMotion();
     postsListMotion();
     backToTopMotion();
 
@@ -103,7 +103,7 @@
       $('.post').velocity('transition.slideDownIn', postMotionOptions);
     }
 
-    function sidebatToggleMotion () {
+    function sidebarToggleMotion () {
       sidebarToggle.on('click', function () {
         isSidebarVisible ? sidebarHideMotion() : sidebarShowMotion();
         isSidebarVisible = !isSidebarVisible;

diff --git a/layout/_scripts/pages/post-details.swig b/layout/_scripts/pages/post-details.swig
@@ -125,11 +125,8 @@
       });
 
       // Expand sidebar on post detail page by default, when post has a toc.
-      var $tocContent = $('.post-toc-content');
-      if ($tocContent.length > 0 && $tocContent.html().trim().length > 0 && isDesktop()) {
-        setTimeout(function () {
-          $('.sidebar-toggle').trigger('click');
-        }, 800);
+      if (isDesktop() && HEXO_SIDEBAR_CONFIGURATION === 'post') {
+        displaySidebar();
       }
     });
   </script>