github/hexo-theme-next
1
0
Fork 0
mirror of https://github.com/next-theme/hexo-theme-next.git synced 2026-01-20 19:02:33 +00:00
Code Issues Packages Projects Releases Wiki Activity

Separate inline scripts and styles into single files (#226)

Browse Source
This commit is contained in:
滑 2021-04-01 15:44:51 +08:00 committed by GitHub
parent 59d3ae71fc
commit 6b23d42930
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
21 changed files with 164 additions and 117 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
layout/_layout.njk
View File

@ -3,9 +3,12 @@
<head> <head>
{{ partial('_partials/head/head.njk', {}, {cache: theme.cache.enable}) }} {{ partial('_partials/head/head.njk', {}, {cache: theme.cache.enable}) }}
{%- include '_partials/head/head-unique.njk' -%} {%- include '_partials/head/head-unique.njk' -%}
{{- next_js('load-config.js', true) }}
<title>{% block title %}{% endblock %}</title> <title>{% block title %}{% endblock %}</title>
{{ partial('_third-party/analytics/index.njk', {}, {cache: theme.cache.enable}) }} {{ partial('_third-party/analytics/index.njk', {}, {cache: theme.cache.enable}) }}
{{ partial('_scripts/noscript.njk', {}, {cache: theme.cache.enable}) }} <noscript>
<link rel="stylesheet" href="{{ url_for(theme.css) }}/noscript.css">
</noscript>
</head> </head>
<body itemscope itemtype="http://schema.org/WebPage"{% if theme.motion.enable %} class="use-motion"{% endif %}> <body itemscope itemtype="http://schema.org/WebPage"{% if theme.motion.enable %} class="use-motion"{% endif %}>

48
layout/_partials/comments.njk
View File

@ -14,31 +14,7 @@
{{ partial(inject_item.layout, inject_item.locals, inject_item.options) }} {{ partial(inject_item.layout, inject_item.locals, inject_item.options) }}
</div> </div>
{%- endfor %} {%- endfor %}
<script{{ pjax }}> {{- next_js('comments-buttons.js', true) }}
(function() {
const commentButton = document.querySelectorAll('.comment-button');
commentButton.forEach(element => {
const commentClass = element.classList[2];
element.addEventListener('click', () => {
commentButton.forEach(active => active.classList.toggle('active', active === element));
document.querySelectorAll('.comment-position').forEach(active => active.classList.toggle('active', active.classList.contains(commentClass)));
if (CONFIG.comments.storage) {
localStorage.setItem('comments_active', commentClass);
}
});
});
let { activeClass } = CONFIG.comments;
if (CONFIG.comments.storage) {
activeClass = localStorage.getItem('comments_active') || activeClass;
}
if (activeClass) {
const activeButton = document.querySelector(`.comment-button.${activeClass}`);
if (activeButton) {
activeButton.click();
}
}
})();
</script>
{%- elif theme.comments.style == 'tabs' %} {%- elif theme.comments.style == 'tabs' %}
<div class="tabs tabs-comment"> <div class="tabs tabs-comment">
<ul class="nav-tabs"> <ul class="nav-tabs">
@ -58,24 +34,4 @@
{%- endif %} {%- endif %}
{%- endif %} {%- endif %}
<script> {{- next_js('comments.js') }}
window.addEventListener('tabs:register', () => {
let { activeClass } = CONFIG.comments;
if (CONFIG.comments.storage) {
activeClass = localStorage.getItem('comments_active') || activeClass;
}
if (activeClass) {
const activeTab = document.querySelector(`a[href="#comment-${activeClass}"]`);
if (activeTab) {
activeTab.click();
}
}
});
if (CONFIG.comments.storage) {
window.addEventListener('tabs:click', event => {
if (!event.target.matches('.tabs-comment .tab-content .tab-pane')) return;
const commentClass = event.target.classList[1];
localStorage.setItem('comments_active', commentClass);
});
}
</script>

6
layout/_partials/footer.njk
View File

@ -2,7 +2,7 @@
<div class="beian"> <div class="beian">
{{- next_url('https://beian.miit.gov.cn', theme.footer.beian.icp + ' ') }} {{- next_url('https://beian.miit.gov.cn', theme.footer.beian.icp + ' ') }}
{%- if theme.footer.beian.gongan_icon_url %} {%- if theme.footer.beian.gongan_icon_url %}
<img src="{{ url_for(theme.footer.beian.gongan_icon_url) }}" style="display: inline-block;"> <img src="{{ url_for(theme.footer.beian.gongan_icon_url) }}">
{%- endif %} {%- endif %}
{%- if theme.footer.beian.gongan_id and theme.footer.beian.gongan_num %} {%- if theme.footer.beian.gongan_id and theme.footer.beian.gongan_num %}
{{- next_url('http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=' + theme.footer.beian.gongan_id, theme.footer.beian.gongan_num + ' ') }} {{- next_url('http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=' + theme.footer.beian.gongan_id, theme.footer.beian.gongan_num + ' ') }}
@ -51,7 +51,7 @@
{%- if theme.busuanzi_count.enable %} {%- if theme.busuanzi_count.enable %}
<div class="busuanzi-count"> <div class="busuanzi-count">
{%- if theme.busuanzi_count.total_visitors %} {%- if theme.busuanzi_count.total_visitors %}
<span class="post-meta-item" id="busuanzi_container_site_uv" style="display: none;"> <span class="post-meta-item" id="busuanzi_container_site_uv">
<span class="post-meta-item-icon"> <span class="post-meta-item-icon">
<i class="{{ theme.busuanzi_count.total_visitors_icon }}"></i> <i class="{{ theme.busuanzi_count.total_visitors_icon }}"></i>
</span> </span>
@ -62,7 +62,7 @@
{%- endif %} {%- endif %}
{%- if theme.busuanzi_count.total_views %} {%- if theme.busuanzi_count.total_views %}
<span class="post-meta-item" id="busuanzi_container_site_pv" style="display: none;"> <span class="post-meta-item" id="busuanzi_container_site_pv">
<span class="post-meta-item-icon"> <span class="post-meta-item-icon">
<i class="{{ theme.busuanzi_count.total_views_icon }}"></i> <i class="{{ theme.busuanzi_count.total_views_icon }}"></i>
</span> </span>

22
layout/_partials/head/head-unique.njk
View File

@ -8,14 +8,18 @@
<link rel="canonical" href="{{ canonical }}"> <link rel="canonical" href="{{ canonical }}">
{# Exports some front-matter variables to Front-End #} {# Exports some front-matter variables to Front-End #}
<script{{ pjax }} class="page-configurations"> {# https://hexo.io/docs/variables.html #}
// https://hexo.io/docs/variables.html <meta name="hexo-config-page" content="{{
CONFIG.page = { {
sidebar: {{ page.sidebar | safedump }}, sidebar: page.sidebar or '',
isHome : {{ is_home() }}, isHome : is_home(),
isPost : {{ is_post() }}, isPost : is_post(),
lang : '{{ page.lang }}' lang : page.lang
}; } | safedump | escape
</script> }}">
<meta name="hexo-config-calendar" content="{{
theme.calendar | safedump | escape
if page.type === 'schedule' and not page.title
}}">
{{- next_inject('head') }} {{- next_inject('head') }}

2
layout/_partials/head/head.njk
View File

@ -53,4 +53,4 @@
<script src="{{ theme.vendors.nprogress_js }}"></script> <script src="{{ theme.vendors.nprogress_js }}"></script>
{%- endif %} {%- endif %}
{{ next_config() }} <meta name="hexo-config" content="{{ next_config() | safedump | escape }}">

3
layout/_partials/page/schedule.njk
View File

@ -1,6 +1,3 @@
<div class="event-list"> <div class="event-list">
</div> </div>
<script{{ pjax }}>
CONFIG.calendar = {{ theme.calendar | safedump }};
</script>
{{- next_js('schedule.js', true) }} {{- next_js('schedule.js', true) }}

2
layout/_partials/post/post-meta.njk
View File

@ -72,7 +72,7 @@
{%- endif %} {%- endif %}
{%- if not is_index and theme.busuanzi_count.enable and theme.busuanzi_count.post_views %} {%- if not is_index and theme.busuanzi_count.enable and theme.busuanzi_count.post_views %}
<span class="post-meta-item" title="{{ __('post.views') }}" id="busuanzi_container_page_pv" style="display: none;"> <span class="post-meta-item" title="{{ __('post.views') }}" id="busuanzi_container_page_pv">
<span class="post-meta-item-icon"> <span class="post-meta-item-icon">
<i class="{{ theme.busuanzi_count.post_views_icon }}"></i> <i class="{{ theme.busuanzi_count.post_views_icon }}"></i>
</span> </span>

2
layout/_scripts/index.njk
View File

@ -14,5 +14,5 @@
{{- next_js('bookmark.js') }} {{- next_js('bookmark.js') }}
{%- endif %} {%- endif %}
{%- if theme.pjax %} {%- if theme.pjax %}
{%- include 'pjax.njk' -%} {{- next_js('pjax.js') }}
{%- endif %} {%- endif %}

34
layout/_scripts/noscript.njk
View File

@ -1,34 +0,0 @@
<noscript>
<style>
body { margin-top: 2rem; }
.use-motion .menu-item,
.use-motion .sidebar,
.use-motion .post-block,
.use-motion .pagination,
.use-motion .comments,
.use-motion .post-header,
.use-motion .post-body,
.use-motion .collection-header {
visibility: visible;
}
.use-motion .header,
.use-motion .site-brand-container .toggle,
.use-motion .footer { opacity: initial; }
.use-motion .site-title,
.use-motion .site-subtitle,
.use-motion .custom-logo-image {
opacity: initial;
top: initial;
}
.use-motion .logo-line {
transform: scaleX(1);
}
.search-pop-overlay, .sidebar-nav { display: none; }
.sidebar-panel { display: block; }
</style>
</noscript>

8
scripts/filters/minify.js
View File

@ -26,6 +26,14 @@ hexo.extend.filter.register('after_generate', () => {
hexo.route.remove('js/local-search.js'); hexo.route.remove('js/local-search.js');
} }
if (!theme.pjax) {
hexo.route.remove('js/pjax.js');
}
if (theme.comments.style !== 'buttons') {
hexo.route.remove('js/comments-buttons.js');
}
if (theme.scheme === 'Pisces' || theme.scheme === 'Gemini') { if (theme.scheme === 'Pisces' || theme.scheme === 'Gemini') {
hexo.route.remove('js/schemes/muse.js'); hexo.route.remove('js/schemes/muse.js');
} }

7
scripts/helpers/next-config.js
View File

@ -5,7 +5,7 @@
const { parse } = require('url'); const { parse } = require('url');
/** /**
* Export theme config to js * Export theme config
*/ */
hexo.extend.helper.register('next_config', function() { hexo.extend.helper.register('next_config', function() {
const { config, theme, url_for, __ } = this; const { config, theme, url_for, __ } = this;
@ -45,8 +45,5 @@ hexo.extend.helper.register('next_config', function() {
exportConfig.path = url_for(config.search.path); exportConfig.path = url_for(config.search.path);
exportConfig.localsearch = theme.local_search; exportConfig.localsearch = theme.local_search;
} }
return `<script class="hexo-configurations"> return exportConfig;
var NexT = window.NexT || {};
var CONFIG = ${JSON.stringify(exportConfig)};
</script>`;
}); });

2
scripts/tags/link-grid.js
View File

@ -9,7 +9,7 @@ module.exports = function([image = '/images/avatar.gif', delimiter = '|', commen
const item = line.split(delimiter).map(arg => arg.trim()); const item = line.split(delimiter).map(arg => arg.trim());
if (item[0][0] === comment) return ''; if (item[0][0] === comment) return '';
return `<div class="link-grid-container"> return `<div class="link-grid-container">
<div class="link-grid-image" style="background-image: url(${item[3] || image});"></div> <object class="link-grid-image" data="${item[3] || image}"></object>
<p>${item[0]}</p><p>${item[2] || item[1]}</p> <p>${item[0]}</p><p>${item[2] || item[1]}</p>
<a href="${item[1]}"></a> <a href="${item[1]}"></a>
</div>`; </div>`;

6
source/css/_common/components/post/post-header.styl
View File

@ -109,3 +109,9 @@
display: none; display: none;
} }
} }
if (hexo-config('busuanzi_count.enable') and hexo-config('busuanzi_count.post_views')) {
#busuanzi_container_page_pv {
display: none;
}
}

22
source/css/_common/outline/footer/index.styl
View File

@ -74,3 +74,25 @@
animation: icon-animate 1.33s ease-in-out infinite; animation: icon-animate 1.33s ease-in-out infinite;
} }
} }
if (hexo-config('footer.beian.enable') && hexo-config('footer.beian.gongan_icon_url')) {
.beian img {
display: inline-block;
}
}
if (hexo-config('busuanzi_count.enable')) {
.busuanzi-count {
if (hexo-config('busuanzi_count.total_visitors')) {
#busuanzi_container_site_uv {
display: none;
}
}
if (hexo-config('busuanzi_count.total_views')) {
#busuanzi_container_site_pv {
display: none;
}
}
}
}

3
source/css/_common/scaffolding/tags/link-grid.styl
View File

@ -32,9 +32,6 @@
} }
.link-grid-image { .link-grid-image {
background-clip: content-box;
background-origin: content-box;
background-size: cover;
border: 1px solid $grey-lighter; border: 1px solid $grey-lighter;
border-radius: 50%; border-radius: 50%;
box-sizing: border-box; box-sizing: border-box;

30
source/css/noscript.styl Normal file
View File

@ -0,0 +1,30 @@
body { margin-top: 2rem; }
.use-motion .menu-item,
.use-motion .sidebar,
.use-motion .post-block,
.use-motion .pagination,
.use-motion .comments,
.use-motion .post-header,
.use-motion .post-body,
.use-motion .collection-header {
visibility: visible;
}
.use-motion .header,
.use-motion .site-brand-container .toggle,
.use-motion .footer { opacity: initial; }
.use-motion .site-title,
.use-motion .site-subtitle,
.use-motion .custom-logo-image {
opacity: initial;
top: initial;
}
.use-motion .logo-line {
transform: scaleX(1);
}
.search-pop-overlay, .sidebar-nav { display: none; }
.sidebar-panel { display: block; }

25
source/js/comments-buttons.js Normal file
View File

@ -0,0 +1,25 @@
/* global CONFIG */
(function() {
const commentButton = document.querySelectorAll('.comment-button');
commentButton.forEach(element => {
const commentClass = element.classList[2];
element.addEventListener('click', () => {
commentButton.forEach(active => active.classList.toggle('active', active === element));
document.querySelectorAll('.comment-position').forEach(active => active.classList.toggle('active', active.classList.contains(commentClass)));
if (CONFIG.comments.storage) {
localStorage.setItem('comments_active', commentClass);
}
});
});
let { activeClass } = CONFIG.comments;
if (CONFIG.comments.storage) {
activeClass = localStorage.getItem('comments_active') || activeClass;
}
if (activeClass) {
const activeButton = document.querySelector(`.comment-button.${activeClass}`);
if (activeButton) {
activeButton.click();
}
}
})();

21
source/js/comments.js Normal file
View File

@ -0,0 +1,21 @@
/* global CONFIG */
window.addEventListener('tabs:register', () => {
let { activeClass } = CONFIG.comments;
if (CONFIG.comments.storage) {
activeClass = localStorage.getItem('comments_active') || activeClass;
}
if (activeClass) {
const activeTab = document.querySelector(`a[href="#comment-${activeClass}"]`);
if (activeTab) {
activeTab.click();
}
}
});
if (CONFIG.comments.storage) {
window.addEventListener('tabs:click', event => {
if (!event.target.matches('.tabs-comment .tab-content .tab-pane')) return;
const commentClass = event.target.classList[1];
localStorage.setItem('comments_active', commentClass);
});
}

15
source/js/load-config.js Normal file
View File

@ -0,0 +1,15 @@
if (!window.NexT) window.NexT = {};
if (!window.CONFIG) {
window.CONFIG = JSON.parse(
document.querySelector('meta[name="hexo-config"]').content || '{}'
);
}
(() => {
document.querySelectorAll('meta[name^="hexo-config-"]')
.forEach(configMeta => {
const key = configMeta.name.slice('hexo-config-'.length);
window.CONFIG[key] = JSON.parse(configMeta.content || '{}');
});
})();

14
layout/_scripts/pjax.njk → source/js/pjax.js
View File

@ -1,17 +1,18 @@
<script> /* global NexT, CONFIG, Pjax */
var pjax = new Pjax({
const pjax = new Pjax({
selectors: [ selectors: [
'head title', 'head title',
'.page-configurations', 'head meta[name^="hexo-config-"]',
'.main-inner', '.main-inner',
'.post-toc-wrap', '.post-toc-wrap',
'.languages', '.languages',
'.pjax' '.pjax'
], ],
analytics: false, analytics : false,
cacheBust: false, cacheBust : false,
scrollRestoration: false, scrollRestoration: false,
scrollTo: !CONFIG.bookmark.enable scrollTo : !CONFIG.bookmark.enable
}); });
document.addEventListener('pjax:success', () => { document.addEventListener('pjax:success', () => {
@ -30,4 +31,3 @@ document.addEventListener('pjax:success', () => {
document.querySelector(hasTOC ? '.sidebar-nav-toc' : '.sidebar-nav-overview').click(); document.querySelector(hasTOC ? '.sidebar-nav-toc' : '.sidebar-nav-overview').click();
NexT.utils.updateSidebarPosition(); NexT.utils.updateSidebarPosition();
}); });
</script>

4
test/tags/link-grid.js
View File

@ -3,11 +3,11 @@
require('chai').should(); require('chai').should();
const result = `<div class="link-grid"><div class="link-grid-container"> const result = `<div class="link-grid"><div class="link-grid-container">
<div class="link-grid-image" style="background-image: url(/images/sample.png);"></div> <object class="link-grid-image" data="/images/sample.png"></object>
<p>Theme NexT</p><p>Stay Simple. Stay NexT.</p> <p>Theme NexT</p><p>Stay Simple. Stay NexT.</p>
<a href="https://theme-next.js.org/"></a> <a href="https://theme-next.js.org/"></a>
</div><div class="link-grid-container"> </div><div class="link-grid-container">
<div class="link-grid-image" style="background-image: url(/images/sample.png);"></div> <object class="link-grid-image" data="/images/sample.png"></object>
<p>Theme NexT</p><p>Stay Simple. Stay NexT.</p> <p>Theme NexT</p><p>Stay Simple. Stay NexT.</p>
<a href="https://theme-next.js.org/"></a> <a href="https://theme-next.js.org/"></a>
</div></div>`; </div></div>`;