Add new filter type theme_inject (#868)

* Add theme_inject filter * Fix QA * Move to merge-config.js and add default injects * fix config * Fix QA * Fix file function args * Add new injectType * Fix QA * Update config file * Format. remove inject_name * Format * Fix QA * Add a new inject point `footer` * Add warn log * Update doc * Add `postMeta` and `postBodyEnd`
theme-next · Jul 10, 2019 · 0764d51 · 0764d51
1 parent 69ca043
commit 0764d51
Show file tree

Hide file tree

Showing 19 changed files with 167 additions and 49 deletions.
diff --git a/_config.yml b/_config.yml
@@ -13,20 +13,19 @@ override: false
 cache:
   enable: true
 
-# Redefine custom file paths. Introduced in NexT v6.0.2. If commented, will be used default custom file paths.
+# Define custom file paths. If commented, will be used default custom file paths.
 # For example, you want to put your custom styles file outside theme directory in root `source/_data`, set `styles: source/_data/styles.styl`
-#custom_file_path:
-  # Default paths: layout/_custom/*
+custom_file_path:
   #head: source/_data/head.swig
   #header: source/_data/header.swig
   #sidebar: source/_data/sidebar.swig
-
-  # Default path: source/css/_variables/custom.styl
-  #variables: source/_data/variables.styl
-  # Default path: source/css/_mixins/custom.styl
-  #mixins: source/_data/mixins.styl
-  # Default path: source/css/_custom/custom.styl
-  #styles: source/_data/styles.styl
+  #postMeta: source/_data/post-meta.swig
+  #postBodyEnd: source/_data/post-body-end.swig
+  #footer: source/_data/footer.swig
+  #bodyEnd: source/_data/body-end.swig
+  #variable: source/_data/variables.styl
+  #mixin: source/_data/mixins.styl
+  #style: source/_data/styles.styl
 
 
 # ---------------------------------------------------------------

diff --git a/layout/_custom/head.swig b/layout/_custom/head.swig
diff --git a/layout/_custom/header.swig b/layout/_custom/header.swig
diff --git a/layout/_custom/sidebar.swig b/layout/_custom/sidebar.swig
diff --git a/layout/_layout.swig b/layout/_layout.swig
@@ -122,5 +122,10 @@
   {% include '_third-party/copy-code.swig' %}
   {% include '_third-party/chatra.swig' %}
   {% include '_third-party/tidio.swig' %}
+
+  {% for inject_item in theme.injects.bodyEnd %}
+    {{ partial(inject_item.layout, inject_item.locals, inject_item.options) }}
+  {% endfor %}
+
 </body>
 </html>
diff --git a/layout/_macro/post.swig b/layout/_macro/post.swig
@@ -201,6 +201,12 @@
             </span>
           {% endif %}
 
+          {% for inject_item in theme.injects.postMeta %}
+            <span class="post-meta-item">
+              {{ partial(inject_item.layout, inject_item.locals, inject_item.options) }}
+            </span>
+          {% endfor %}
+
           {% if theme.symbols_count_time.separated_meta %}<br/>{% endif %}
           {% if config.symbols_count_time.symbols %}
             <span class="post-meta-item">
@@ -314,6 +320,12 @@
       {% include '../_partials/post/post-related.swig' with { post: post } %}
     {% endif %}
 
+    {% if not is_index %}
+      {% for inject_item in theme.injects.postBodyEnd %}
+        {{ partial(inject_item.layout, inject_item.locals, inject_item.options) }}
+      {% endfor %}
+    {% endif %}
+
     {#####################}
     {### END POST BODY ###}
     {#####################}

diff --git a/layout/_macro/sidebar.swig b/layout/_macro/sidebar.swig
@@ -165,12 +165,9 @@
             </div>
           {% endif %}
 
-          {% if theme.custom_file_path.sidebar %}
-            {% set custom_sidebar = '../../../../' + theme.custom_file_path.sidebar %}
-          {% else %}
-            {% set custom_sidebar = '../_custom/sidebar.swig' %}
-          {% endif %}
-          {% include custom_sidebar %}
+          {% for inject_item in theme.injects.sidebar %}
+            {{ partial(inject_item.layout, inject_item.locals, inject_item.options) }}
+          {% endfor %}
         </div>
       </div>
 

diff --git a/layout/_partials/footer.swig b/layout/_partials/footer.swig
@@ -55,8 +55,6 @@
 #}</div>
 {% endif %}
 
-{% if theme.footer.custom_text %}
-  <div class="footer-custom">{#
-  #}{{ theme.footer.custom_text }}{#
-#}</div>
-{% endif %}
+{% for inject_item in theme.injects.footer %}
+  {{ partial(inject_item.layout, inject_item.locals, inject_item.options) }}
+{% endfor %}
diff --git a/layout/_partials/head/head.swig b/layout/_partials/head/head.swig
@@ -112,9 +112,6 @@
   };
 </script>
 
-{% if theme.custom_file_path.head %}
-  {% set custom_head = '../../../../../' + theme.custom_file_path.head %}
-{% else %}
-  {% set custom_head = '../../_custom/head.swig' %}
-{% endif %}
-{% include custom_head %}
+{% for inject_item in theme.injects.head %}
+  {{ partial(inject_item.layout, inject_item.locals, inject_item.options) }}
+{% endfor %}
diff --git a/layout/_partials/header/index.swig b/layout/_partials/header/index.swig
@@ -1,9 +1,6 @@
 {{ partial('_partials/header/brand.swig', {}, {cache: theme.cache.enable}) }}
 {% include 'menu.swig' %}
 
-{% if theme.custom_file_path.header %}
-  {% set custom_header = '../../../../../' + theme.custom_file_path.header %}
-{% else %}
-  {% set custom_header = '../../_custom/header.swig' %}
-{% endif %}
-{% include custom_header %}
+{% for inject_item in theme.injects.header %}
+  {{ partial(inject_item.layout, inject_item.locals, inject_item.options) }}
+{% endfor %}
diff --git a/scripts/filters/default-injects.js b/scripts/filters/default-injects.js
@@ -0,0 +1,36 @@
+/* global hexo */
+
+'use strict';
+
+const points = require('./../injects-point');
+
+hexo.extend.filter.register('theme_inject', (injects) => {
+  let filePath = hexo.theme.config.custom_file_path;
+
+  points.views.forEach((key) => {
+    if (filePath[key]) {
+      injects[key].file('custom', filePath[key]);
+    }
+  });
+
+  points.styles.forEach((key) => {
+    if (filePath[key]) {
+      injects[key].push(filePath[key]);
+    }
+    // Compatible, but like head header etc, it shouldn't add 's' suffix.
+    let oldKey = key + 's';
+    if (filePath[oldKey]) {
+      injects[key].push(filePath[oldKey]);
+      hexo.log.warn(`WARNING: Format. Please use 'custom_file_path.${key}' instead 'custom_file_path.${oldKey}'.`);
+    }
+  });
+
+  // Compatible, but please use custom_file_path.
+  if (hexo.theme.config.footer.custom_text) {
+    injects.footer.raw('custom-text', `
+    <div class="footer-custom">{{ theme.footer.custom_text }}</div>
+    `, {}, {cache: true});
+    hexo.log.warn(`WARNING: 'footer.custom_text' will not longer be supported. Please use 'custom_file_path.footer' instead`);
+  }
+
+}, 99);
diff --git a/scripts/injects-point.js b/scripts/injects-point.js
@@ -0,0 +1,6 @@
+'use strict';
+
+module.exports = {
+  views: ['head', 'header', 'sidebar', 'postMeta', 'postBodyEnd', 'footer', 'bodyEnd'],
+  styles: ['variable', 'mixin', 'style']
+};
diff --git a/scripts/injects.js b/scripts/injects.js
@@ -0,0 +1,74 @@
+'use strict';
+
+const fs = require('fs');
+const path = require('path');
+const points = require('./injects-point');
+
+// Defining stylus types
+class StylusInject {
+  constructor() {
+    this.files = [];
+  }
+  push(file) {
+    this.files.push(file);
+  }
+}
+
+// Defining view types
+class ViewInject {
+  constructor() {
+    this.raws = [];
+  }
+  raw(name, raw, ...args) {
+    this.raws.push({
+      name,
+      raw,
+      args
+    });
+  }
+  file(name, file, ...args) {
+    this.raw.apply(this, [name, fs.readFileSync(file).toString()].concat(args));
+  }
+}
+
+// Init injects
+function initInject() {
+  let injects = {};
+  points.styles.forEach((item) => {
+    injects[item] = new StylusInject();
+  });
+  points.views.forEach((item) => {
+    injects[item] = new ViewInject();
+  });
+  return injects;
+}
+
+module.exports = function(hexo) {
+  // Exec theme_inject filter
+  let injects = initInject();
+  hexo.execFilterSync('theme_inject', injects);
+  hexo.theme.config.injects = {};
+
+  // Inject stylus, and get relative path base on hexo dir.
+  points.styles.forEach((type) => {
+    hexo.theme.config.injects[type] = injects[type].files.map((item) => path.relative(hexo.base_dir, item));
+  });
+
+  // Inject views
+  points.views.forEach((type) => {
+    hexo.theme.config.injects[type] = [];
+    injects[type].raws.forEach((injectObj) => {
+      // If there is no suffix, will add `.swig`
+      if (injectObj.name.indexOf('.') < 0) {
+        injectObj.name += '.swig';
+      }
+      let viewName = `inject/${type}/${injectObj.name}`;
+      hexo.theme.setView(viewName, injectObj.raw);
+      hexo.theme.config.injects[type].push({
+        layout: viewName,
+        locals: injectObj.args[0],
+        options: injectObj.args[1]
+      });
+    });
+  });
+};
diff --git a/scripts/merge-configs.js b/scripts/merge-configs.js
@@ -42,4 +42,8 @@ hexo.on('generateBefore', function() {
       }
     }
   }
+
+  // Add filter type `theme_inject`
+  require('./injects')(hexo);
+
 });
diff --git a/source/css/_custom/custom.styl b/source/css/_custom/custom.styl
diff --git a/source/css/_mixins/custom.styl b/source/css/_mixins/custom.styl
diff --git a/source/css/_schemes/Gemini/index.styl b/source/css/_schemes/Gemini/index.styl
@@ -16,7 +16,7 @@
 // In `source/css/_variables/base.styl` there are variables for other resolutions:
 // $content-tablet-padding           = 10px;
 // $content-mobile-padding           = 8px;
-// P.S. If u want to change this paddings u may set this variables into `source/css/_variables/custom.styl`.
+// P.S. If u want to change this paddings u may set this variables into `custom_file_path.variable` (in theme _config.yml).
 
 // So, it will 12px in Desktop, 10px in Tablets and 8px in Mobiles for all possible paddings.
 // =================================================

diff --git a/source/css/_variables/custom.styl b/source/css/_variables/custom.styl
diff --git a/source/css/main.styl b/source/css/main.styl
@@ -3,25 +3,23 @@
 
 $scheme    = hexo-config('scheme') ? hexo-config('scheme') : 'Muse';
 
-$custom_styles = hexo-config('custom_file_path.styles') ? "../../../../../" + hexo-config('custom_file_path.styles') : custom;
-$custom_mixins = hexo-config('custom_file_path.mixins') ? "../../../../../" + hexo-config('custom_file_path.mixins') : custom;
-$custom_variables = hexo-config('custom_file_path.variables') ? "../../../../../" + hexo-config('custom_file_path.variables') : custom;
-
-$variables = base $scheme $custom_variables;
-$mixins    = base $scheme $custom_mixins;
+$variables = base $scheme;
+$mixins    = base $scheme;
 
 
 // Variables Layer
 // --------------------------------------------------
 for $variable in $variables
   @import "_variables/" + $variable;
-
+for $inject_variable in hexo-config('injects.variable')
+  @import "../../../../" + $inject_variable;
 
 // Mixins Layer
 // --------------------------------------------------
 for $mixin in $mixins
   @import "_mixins/" + $mixin;
-
+for $inject_mixin in hexo-config('injects.mixin')
+  @import "../../../../" + $inject_mixin;
 
 // Common Layer
 // --------------------------------------------------
@@ -43,4 +41,5 @@ for $mixin in $mixins
 
 // Custom Layer
 // --------------------------------------------------
-@import "_custom/" + $custom_styles;
+for $inject_style in hexo-config('injects.style')
+  @import "../../../../" + $inject_style;