refactor(layout): search and share to jsx
This commit is contained in:
parent
e03c3ca572
commit
725bce4cd5
|
@ -7,7 +7,7 @@ class ChangeYan extends Component {
|
||||||
render() {
|
render() {
|
||||||
const { appId, conf, path } = this.props;
|
const { appId, conf, path } = this.props;
|
||||||
if (!appId || !conf) {
|
if (!appId || !conf) {
|
||||||
return <div class="notification is-danger">
|
return <div className="notification is-danger">
|
||||||
You forgot to set the <code>appid</code> or <code>conf</code> for Changyan.
|
You forgot to set the <code>appid</code> or <code>conf</code> for Changyan.
|
||||||
Please set it in <code>_config.yml</code>.
|
Please set it in <code>_config.yml</code>.
|
||||||
</div>;
|
</div>;
|
||||||
|
|
|
@ -7,7 +7,7 @@ class Disqus extends Component {
|
||||||
render() {
|
render() {
|
||||||
const { shortname, disqusId, path, permalink } = this.props;
|
const { shortname, disqusId, path, permalink } = this.props;
|
||||||
if (!shortname) {
|
if (!shortname) {
|
||||||
return <div class="notification is-danger">
|
return <div className="notification is-danger">
|
||||||
You forgot to set the <code>shortname</code> for Disqus.
|
You forgot to set the <code>shortname</code> for Disqus.
|
||||||
Please set it in <code>_config.yml</code>.
|
Please set it in <code>_config.yml</code>.
|
||||||
</div>;
|
</div>;
|
||||||
|
|
|
@ -14,7 +14,7 @@ class Facebook extends Component {
|
||||||
fjs.parentNode.insertBefore(js, fjs);
|
fjs.parentNode.insertBefore(js, fjs);
|
||||||
}(document, 'script', 'facebook-jssdk'));`;
|
}(document, 'script', 'facebook-jssdk'));`;
|
||||||
return <Fragment>
|
return <Fragment>
|
||||||
<div class="fb-comments" data-width="100%" data-href={permalink} data-num-posts="5"></div>
|
<div className="fb-comments" data-width="100%" data-href={permalink} data-num-posts="5"></div>
|
||||||
<script dangerouslySetInnerHTML={{ __html: js }}></script>
|
<script dangerouslySetInnerHTML={{ __html: js }}></script>
|
||||||
</Fragment>;
|
</Fragment>;
|
||||||
}
|
}
|
||||||
|
|
|
@ -20,7 +20,7 @@ class Gitalk extends Component {
|
||||||
} = this.props;
|
} = this.props;
|
||||||
|
|
||||||
if (!id || !repo || !owner || !admin || !clientId || !clientSecret) {
|
if (!id || !repo || !owner || !admin || !clientId || !clientSecret) {
|
||||||
return <div class="notification is-danger">
|
return <div className="notification is-danger">
|
||||||
You forgot to set the <code>owner</code>, <code>admin</code>, <code>repo</code>,
|
You forgot to set the <code>owner</code>, <code>admin</code>, <code>repo</code>,
|
||||||
<code>client_id</code>, or <code>client_secret</code> for Gittalk.
|
<code>client_id</code>, or <code>client_secret</code> for Gittalk.
|
||||||
Please set it in <code>_config.yml</code>.
|
Please set it in <code>_config.yml</code>.
|
||||||
|
|
|
@ -15,7 +15,7 @@ class Gitment extends Component {
|
||||||
} = this.props;
|
} = this.props;
|
||||||
|
|
||||||
if (!id || !repo || !owner || !clientId || !clientSecret) {
|
if (!id || !repo || !owner || !clientId || !clientSecret) {
|
||||||
return <div class="notification is-danger">
|
return <div className="notification is-danger">
|
||||||
You forgot to set the <code>owner</code>, <code>repo</code>, <code>client_id</code>,
|
You forgot to set the <code>owner</code>, <code>repo</code>, <code>client_id</code>,
|
||||||
or <code>client_secret</code> for Gitment.
|
or <code>client_secret</code> for Gitment.
|
||||||
Please set it in <code>_config.yml</code>.
|
Please set it in <code>_config.yml</code>.
|
||||||
|
|
|
@ -7,7 +7,7 @@ class Isso extends Component {
|
||||||
render() {
|
render() {
|
||||||
const { url } = this.props;
|
const { url } = this.props;
|
||||||
if (!url) {
|
if (!url) {
|
||||||
return <div class="notification is-danger">
|
return <div className="notification is-danger">
|
||||||
You forgot to set the <code>url</code> for Isso.
|
You forgot to set the <code>url</code> for Isso.
|
||||||
Please set it in <code>_config.yml</code>.
|
Please set it in <code>_config.yml</code>.
|
||||||
</div>;
|
</div>;
|
||||||
|
|
|
@ -7,7 +7,7 @@ class LiveRe extends Component {
|
||||||
render() {
|
render() {
|
||||||
const { uid } = this.props;
|
const { uid } = this.props;
|
||||||
if (!uid) {
|
if (!uid) {
|
||||||
return <div class="notification is-danger">
|
return <div className="notification is-danger">
|
||||||
You forgot to set the <code>uid</code> for LiveRe.
|
You forgot to set the <code>uid</code> for LiveRe.
|
||||||
Please set it in <code>_config.yml</code>.
|
Please set it in <code>_config.yml</code>.
|
||||||
</div>;
|
</div>;
|
||||||
|
|
|
@ -7,7 +7,7 @@ class Valine extends Component {
|
||||||
render() {
|
render() {
|
||||||
const { appId, appKey, notify, verify, placeholder } = this.props;
|
const { appId, appKey, notify, verify, placeholder } = this.props;
|
||||||
if (!appId || !appKey) {
|
if (!appId || !appKey) {
|
||||||
return <div class="notification is-danger">
|
return <div className="notification is-danger">
|
||||||
You forgot to set the <code>app_id</code> or <code>app_key</code> for Valine.
|
You forgot to set the <code>app_id</code> or <code>app_key</code> for Valine.
|
||||||
Please set it in <code>_config.yml</code>.
|
Please set it in <code>_config.yml</code>.
|
||||||
</div>;
|
</div>;
|
||||||
|
@ -21,7 +21,7 @@ class Valine extends Component {
|
||||||
placeholder: '${placeholder}'
|
placeholder: '${placeholder}'
|
||||||
});`;
|
});`;
|
||||||
return <Fragment>
|
return <Fragment>
|
||||||
<div id="valine-thread" class="content"></div>
|
<div id="valine-thread" className="content"></div>
|
||||||
<script src="//cdn1.lncld.net/static/js/3.0.4/av-min.js"></script>
|
<script src="//cdn1.lncld.net/static/js/3.0.4/av-min.js"></script>
|
||||||
<script src='//unpkg.com/valine/dist/Valine.min.js'></script>
|
<script src='//unpkg.com/valine/dist/Valine.min.js'></script>
|
||||||
<script dangerouslySetInnerHTML={{ __html: js }}></script>
|
<script dangerouslySetInnerHTML={{ __html: js }}></script>
|
||||||
|
|
|
@ -7,17 +7,17 @@ class Alipay extends Component {
|
||||||
render() {
|
render() {
|
||||||
const { type, qrcode, __, url_for } = this.props;
|
const { type, qrcode, __, url_for } = this.props;
|
||||||
if (!qrcode) {
|
if (!qrcode) {
|
||||||
return <div class="notification is-danger">
|
return <div className="notification is-danger">
|
||||||
You forgot to set the <code>qrcode</code> for Alipay.
|
You forgot to set the <code>qrcode</code> for Alipay.
|
||||||
Please set it in <code>_config.yml</code>.
|
Please set it in <code>_config.yml</code>.
|
||||||
</div>;
|
</div>;
|
||||||
}
|
}
|
||||||
return <a class="button is-info donate">
|
return <a className="button is-info donate">
|
||||||
<span class="icon is-small">
|
<span className="icon is-small">
|
||||||
<i class="fab fa-alipay"></i>
|
<i className="fab fa-alipay"></i>
|
||||||
</span>
|
</span>
|
||||||
<span>{__('donate.' + type)}</span>
|
<span>{__('donate.' + type)}</span>
|
||||||
<span class="qrcode"><img src={url_for(qrcode)} alt={__('donate.' + type)} /></span>
|
<span className="qrcode"><img src={url_for(qrcode)} alt={__('donate.' + type)} /></span>
|
||||||
</a>;
|
</a>;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -7,14 +7,14 @@ class Patreon extends Component {
|
||||||
render() {
|
render() {
|
||||||
const { type, url, __, url_for } = this.props;
|
const { type, url, __, url_for } = this.props;
|
||||||
if (!url) {
|
if (!url) {
|
||||||
return <div class="notification is-danger">
|
return <div className="notification is-danger">
|
||||||
You forgot to set the <code>url</code> Patreon.
|
You forgot to set the <code>url</code> Patreon.
|
||||||
Please set it in <code>_config.yml</code>.
|
Please set it in <code>_config.yml</code>.
|
||||||
</div>;
|
</div>;
|
||||||
}
|
}
|
||||||
return <a class="button is-danger donate" href={url_for(url)} target="_blank" rel="noopener">
|
return <a className="button is-danger donate" href={url_for(url)} target="_blank" rel="noopener">
|
||||||
<span class="icon is-small">
|
<span className="icon is-small">
|
||||||
<i class="fab fa-patreon"></i>
|
<i className="fab fa-patreon"></i>
|
||||||
</span>
|
</span>
|
||||||
<span>{__('donate.' + type)}</span>
|
<span>{__('donate.' + type)}</span>
|
||||||
</a>;
|
</a>;
|
||||||
|
|
|
@ -7,15 +7,15 @@ class Paypal extends Component {
|
||||||
render() {
|
render() {
|
||||||
const { type, business, currencyCode, __ } = this.props;
|
const { type, business, currencyCode, __ } = this.props;
|
||||||
if (!business || !currencyCode) {
|
if (!business || !currencyCode) {
|
||||||
return <div class="notification is-danger">
|
return <div className="notification is-danger">
|
||||||
You forgot to set the <code>business</code> or <code>currency_code</code> for Paypal.
|
You forgot to set the <code>business</code> or <code>currency_code</code> for Paypal.
|
||||||
Please set it in <code>_config.yml</code>.
|
Please set it in <code>_config.yml</code>.
|
||||||
</div>;
|
</div>;
|
||||||
}
|
}
|
||||||
return <Fragment>
|
return <Fragment>
|
||||||
<a class="button is-warning donate" onclick="document.getElementById('paypal-donate-form').submit()">
|
<a className="button is-warning donate" onclick="document.getElementById('paypal-donate-form').submit()">
|
||||||
<span class="icon is-small">
|
<span className="icon is-small">
|
||||||
<i class="fab fa-paypal"></i>
|
<i className="fab fa-paypal"></i>
|
||||||
</span>
|
</span>
|
||||||
<span>{__('donate.' + type)}</span>
|
<span>{__('donate.' + type)}</span>
|
||||||
</a>
|
</a>
|
||||||
|
|
|
@ -7,17 +7,17 @@ class Wechat extends Component {
|
||||||
render() {
|
render() {
|
||||||
const { type, qrcode, __, url_for } = this.props;
|
const { type, qrcode, __, url_for } = this.props;
|
||||||
if (!qrcode) {
|
if (!qrcode) {
|
||||||
return <div class="notification is-danger">
|
return <div className="notification is-danger">
|
||||||
You forgot to set the <code>qrcode</code> for Wechat.
|
You forgot to set the <code>qrcode</code> for Wechat.
|
||||||
Please set it in <code>_config.yml</code>.
|
Please set it in <code>_config.yml</code>.
|
||||||
</div>;
|
</div>;
|
||||||
}
|
}
|
||||||
return <a class="button is-info donate">
|
return <a className="button is-info donate">
|
||||||
<span class="icon is-small">
|
<span className="icon is-small">
|
||||||
<i class="fab fa-weixin"></i>
|
<i className="fab fa-weixin"></i>
|
||||||
</span>
|
</span>
|
||||||
<span>{__('donate.' + type)}</span>
|
<span>{__('donate.' + type)}</span>
|
||||||
<span class="qrcode"><img src={url_for(qrcode)} alt={__('donate.' + type)} /></span>
|
<span className="qrcode"><img src={url_for(qrcode)} alt={__('donate.' + type)} /></span>
|
||||||
</a>;
|
</a>;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,29 +0,0 @@
|
||||||
<%- _css('css/search') %>
|
|
||||||
<div class="searchbox">
|
|
||||||
<div class="searchbox-container">
|
|
||||||
<div class="searchbox-input-wrapper">
|
|
||||||
<form class="search-form">
|
|
||||||
<input name="wd" type="text" class="searchbox-input" placeholder="<%= __('search.hint') %>" />
|
|
||||||
<span class="searchbox-close searchbox-selectable"><i class="fa fa-times-circle"></i></span>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<script>
|
|
||||||
(function ($) {
|
|
||||||
$('.search-form').on('submit', function (e) {
|
|
||||||
var keyword = $('.searchbox-input[name="wd"]').val();
|
|
||||||
window.location = 'https://www.baidu.com/s?wd=site:<%= config.url.replace(/http(s)*:\/\//, "") %> ' + keyword;
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
})(jQuery);
|
|
||||||
(function (document, $) {
|
|
||||||
$(document).on('click', '.navbar-main .search', function () {
|
|
||||||
$('.searchbox').toggleClass('show');
|
|
||||||
}).on('click', '.searchbox .searchbox-mask', function () {
|
|
||||||
$('.searchbox').removeClass('show');
|
|
||||||
}).on('click', '.searchbox-close', function () {
|
|
||||||
$('.searchbox').removeClass('show');
|
|
||||||
});
|
|
||||||
})(document, jQuery);
|
|
||||||
</script>
|
|
|
@ -0,0 +1,50 @@
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
const { Component, Fragment } = require('inferno');
|
||||||
|
const { cacheComponent } = require('../util/cache');
|
||||||
|
|
||||||
|
class Baidu extends Component {
|
||||||
|
render() {
|
||||||
|
const { url, __, url_for } = this.props;
|
||||||
|
|
||||||
|
const js = `(function ($) {
|
||||||
|
$('.search-form').on('submit', function (e) {
|
||||||
|
var keyword = $('.searchbox-input[name="wd"]').val();
|
||||||
|
window.location = 'https://www.baidu.com/s?wd=site:${url.replace(/http(s)*:\/\//, '')} ' + keyword;
|
||||||
|
return false;
|
||||||
|
});
|
||||||
|
})(jQuery);
|
||||||
|
(function (document, $) {
|
||||||
|
$(document).on('click', '.navbar-main .search', function () {
|
||||||
|
$('.searchbox').toggleClass('show');
|
||||||
|
}).on('click', '.searchbox .searchbox-mask', function () {
|
||||||
|
$('.searchbox').removeClass('show');
|
||||||
|
}).on('click', '.searchbox-close', function () {
|
||||||
|
$('.searchbox').removeClass('show');
|
||||||
|
});
|
||||||
|
})(document, jQuery);`;
|
||||||
|
|
||||||
|
return <Fragment>
|
||||||
|
<link rel="stylesheet" href={url_for('/css/search.css')} />
|
||||||
|
<div className="searchbox">
|
||||||
|
<div className="searchbox-container">
|
||||||
|
<div className="searchbox-input-wrapper">
|
||||||
|
<form className="search-form">
|
||||||
|
<input name="wd" type="text" className="searchbox-input" placeholder={__('search.hint')} />
|
||||||
|
<span className="searchbox-close searchbox-selectable"><i className="fa fa-times-circle"></i></span>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<script dangerouslySetInnerHTML={{ __html: js }}></script>
|
||||||
|
</Fragment>;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = cacheComponent(Baidu, 'search.baidu', props => {
|
||||||
|
return {
|
||||||
|
url: props.config.url,
|
||||||
|
__: props.__,
|
||||||
|
url_for: props.url_for
|
||||||
|
};
|
||||||
|
});
|
|
@ -1,3 +0,0 @@
|
||||||
module.exports = (ctx, locals) => {
|
|
||||||
return locals;
|
|
||||||
}
|
|
|
@ -1,67 +0,0 @@
|
||||||
<%- _css('css/search') %>
|
|
||||||
<div class="searchbox google-cse-search">
|
|
||||||
<div class="searchbox-container">
|
|
||||||
<div class="searchbox-input-wrapper">
|
|
||||||
<input type="text" class="searchbox-input" placeholder="<%= __('search.hint') %>" />
|
|
||||||
<span class="searchbox-close searchbox-selectable"><i class="fa fa-times-circle"></i></span>
|
|
||||||
</div>
|
|
||||||
<% if (has_config('search.cx')) { %>
|
|
||||||
<div class="searchbox-result-wrapper">
|
|
||||||
<gcse:searchresults-only></gcse:searchresults-only>
|
|
||||||
</div>
|
|
||||||
<% } else { %>
|
|
||||||
<div class="notification is-danger">
|
|
||||||
It seems that you forget to set the <code>cx</code> value for the Google CSE. Please set it in <code>_config.yml</code>.
|
|
||||||
</div>
|
|
||||||
<% } %>
|
|
||||||
</div>
|
|
||||||
<% if (has_config('search.cx')) { %>
|
|
||||||
<script>
|
|
||||||
(function() {
|
|
||||||
var cx = '<%= get_config('search.cx') %>';
|
|
||||||
var gcse = document.createElement('script');
|
|
||||||
gcse.type = 'text/javascript';
|
|
||||||
gcse.async = true;
|
|
||||||
gcse.src = 'https://cse.google.com/cse.js?cx=' + cx;
|
|
||||||
var s = document.getElementsByTagName('script')[0];
|
|
||||||
s.parentNode.insertBefore(gcse, s);
|
|
||||||
})();
|
|
||||||
</script>
|
|
||||||
<% } %>
|
|
||||||
</div>
|
|
||||||
<script>
|
|
||||||
(function (document, $) {
|
|
||||||
function debounce(func, wait, immediate) {
|
|
||||||
var timeout;
|
|
||||||
return function() {
|
|
||||||
var context = this, args = arguments;
|
|
||||||
var later = function() {
|
|
||||||
timeout = null;
|
|
||||||
if (!immediate) func.apply(context, args);
|
|
||||||
};
|
|
||||||
var callNow = immediate && !timeout;
|
|
||||||
clearTimeout(timeout);
|
|
||||||
timeout = setTimeout(later, wait);
|
|
||||||
if (callNow) func.apply(context, args);
|
|
||||||
};
|
|
||||||
};
|
|
||||||
|
|
||||||
$(document).on('click', '.navbar-main .search', function () {
|
|
||||||
$('.searchbox').toggleClass('show');
|
|
||||||
}).on('click', '.searchbox .searchbox-mask', function () {
|
|
||||||
$('.searchbox').removeClass('show');
|
|
||||||
}).on('click', '.searchbox-close', function () {
|
|
||||||
$('.searchbox').removeClass('show');
|
|
||||||
}).on('keydown', '.searchbox-input', debounce(function () {
|
|
||||||
var value = $(this).val();
|
|
||||||
try {
|
|
||||||
var element = google.search.cse.element.getElement('searchresults-only0');
|
|
||||||
if (value.trim() === '') {
|
|
||||||
element.clearAllResults();
|
|
||||||
} else {
|
|
||||||
element.execute(value);
|
|
||||||
}
|
|
||||||
} catch (e) {}
|
|
||||||
}, 300));
|
|
||||||
})(document, jQuery);
|
|
||||||
</script>
|
|
|
@ -0,0 +1,88 @@
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
const { Component, Fragment } = require('inferno');
|
||||||
|
const { cacheComponent } = require('../util/cache');
|
||||||
|
|
||||||
|
class Google extends Component {
|
||||||
|
render() {
|
||||||
|
const { cx, __, url_for } = this.props;
|
||||||
|
|
||||||
|
const js1 = `(function() {
|
||||||
|
var cx = '${cx}';
|
||||||
|
var gcse = document.createElement('script');
|
||||||
|
gcse.type = 'text/javascript';
|
||||||
|
gcse.async = true;
|
||||||
|
gcse.src = 'https://cse.google.com/cse.js?cx=' + cx;
|
||||||
|
var s = document.getElementsByTagName('script')[0];
|
||||||
|
s.parentNode.insertBefore(gcse, s);
|
||||||
|
})();`;
|
||||||
|
|
||||||
|
const js2 = `(function (document, $) {
|
||||||
|
function debounce(func, wait, immediate) {
|
||||||
|
var timeout;
|
||||||
|
return function() {
|
||||||
|
var context = this, args = arguments;
|
||||||
|
var later = function() {
|
||||||
|
timeout = null;
|
||||||
|
if (!immediate) func.apply(context, args);
|
||||||
|
};
|
||||||
|
var callNow = immediate && !timeout;
|
||||||
|
clearTimeout(timeout);
|
||||||
|
timeout = setTimeout(later, wait);
|
||||||
|
if (callNow) func.apply(context, args);
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
|
$(document).on('click', '.navbar-main .search', function () {
|
||||||
|
$('.searchbox').toggleClass('show');
|
||||||
|
}).on('click', '.searchbox .searchbox-mask', function () {
|
||||||
|
$('.searchbox').removeClass('show');
|
||||||
|
}).on('click', '.searchbox-close', function () {
|
||||||
|
$('.searchbox').removeClass('show');
|
||||||
|
}).on('keydown', '.searchbox-input', debounce(function () {
|
||||||
|
var value = $(this).val();
|
||||||
|
try {
|
||||||
|
var element = google.search.cse.element.getElement('searchresults-only0');
|
||||||
|
if (value.trim() === '') {
|
||||||
|
element.clearAllResults();
|
||||||
|
} else {
|
||||||
|
element.execute(value);
|
||||||
|
}
|
||||||
|
} catch (e) {}
|
||||||
|
}, 300));
|
||||||
|
})(document, jQuery);`;
|
||||||
|
|
||||||
|
return <Fragment>
|
||||||
|
<link rel="stylesheet" href={url_for('/css/search.css')} />
|
||||||
|
<div className="searchbox google-cse-search">
|
||||||
|
<div className="searchbox-container">
|
||||||
|
<div className="searchbox-input-wrapper">
|
||||||
|
<input type="text" className="searchbox-input" placeholder={__('search.hint')} />
|
||||||
|
<span className="searchbox-close searchbox-selectable"><i className="fa fa-times-circle"></i></span>
|
||||||
|
</div>
|
||||||
|
{(() => {
|
||||||
|
if (cx) {
|
||||||
|
const innerHtml = '<gcse:searchresults-only></gcse:searchresults-only>';
|
||||||
|
return <div className="searchbox-result-wrapper" dangerouslySetInnerHTML={{ __html: innerHtml }}></div>;
|
||||||
|
}
|
||||||
|
return <div className="notification is-danger">
|
||||||
|
It seems that you forget to set the <code>cx</code> value for the Google CSE.
|
||||||
|
Please set it in <code>_config.yml</code>.
|
||||||
|
</div>;
|
||||||
|
|
||||||
|
})()}
|
||||||
|
</div>
|
||||||
|
{cx ? <script dangerouslySetInnerHTML={{ __html: js1 }}></script> : null}
|
||||||
|
</div>
|
||||||
|
<script dangerouslySetInnerHTML={{ __html: js2 }}></script>
|
||||||
|
</Fragment>;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = cacheComponent(Google, 'search.google', props => {
|
||||||
|
return {
|
||||||
|
cx: props.cx,
|
||||||
|
__: props.__,
|
||||||
|
url_for: props.url_for
|
||||||
|
};
|
||||||
|
});
|
|
@ -1,3 +0,0 @@
|
||||||
module.exports = (ctx, locals) => {
|
|
||||||
return locals;
|
|
||||||
}
|
|
|
@ -1,29 +0,0 @@
|
||||||
<div class="searchbox ins-search">
|
|
||||||
<div class="searchbox-container ins-search-container">
|
|
||||||
<div class="searchbox-input-wrapper">
|
|
||||||
<input type="text" class="searchbox-input ins-search-input" placeholder="<%= __('insight.hint') %>" />
|
|
||||||
<span class="searchbox-close ins-close ins-selectable"><i class="fa fa-times-circle"></i></span>
|
|
||||||
</div>
|
|
||||||
<div class="searchbox-result-wrapper ins-section-wrapper">
|
|
||||||
<div class="ins-section-container"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<script>
|
|
||||||
(function (window) {
|
|
||||||
var INSIGHT_CONFIG = {
|
|
||||||
TRANSLATION: {
|
|
||||||
POSTS: '<%= __("insight.posts") %>',
|
|
||||||
PAGES: '<%= __("insight.pages") %>',
|
|
||||||
CATEGORIES: '<%= __("insight.categories") %>',
|
|
||||||
TAGS: '<%= __("insight.tags") %>',
|
|
||||||
UNTITLED: '<%= __("insight.untitled") %>',
|
|
||||||
},
|
|
||||||
CONTENT_URL: '<%- url_for("/content.json")%>',
|
|
||||||
};
|
|
||||||
window.INSIGHT_CONFIG = INSIGHT_CONFIG;
|
|
||||||
})(window);
|
|
||||||
</script>
|
|
||||||
<%- _js('js/insight', true) %>
|
|
||||||
<%- _css('css/search') %>
|
|
||||||
<%- _css('css/insight') %>
|
|
|
@ -0,0 +1,49 @@
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
const { Component, Fragment } = require('inferno');
|
||||||
|
const { cacheComponent } = require('../util/cache');
|
||||||
|
|
||||||
|
class Insight extends Component {
|
||||||
|
render() {
|
||||||
|
const { __, url_for } = this.props;
|
||||||
|
|
||||||
|
const js = `(function (window) {
|
||||||
|
var INSIGHT_CONFIG = {
|
||||||
|
TRANSLATION: {
|
||||||
|
POSTS: '${__('insight.posts')}',
|
||||||
|
PAGES: '${__('insight.pages')}',
|
||||||
|
CATEGORIES: '${__('insight.categories')}',
|
||||||
|
TAGS: '${__('insight.tags')}',
|
||||||
|
UNTITLED: '${__('insight.untitled')}',
|
||||||
|
},
|
||||||
|
CONTENT_URL: '${url_for('/content.json')}',
|
||||||
|
};
|
||||||
|
window.INSIGHT_CONFIG = INSIGHT_CONFIG;
|
||||||
|
})(window);`;
|
||||||
|
|
||||||
|
return <Fragment>
|
||||||
|
<link rel="stylesheet" href={url_for('/css/search.css')} />
|
||||||
|
<link rel="stylesheet" href={url_for('/css/insight.css')} />
|
||||||
|
<div className="searchbox ins-search">
|
||||||
|
<div className="searchbox-container ins-search-container">
|
||||||
|
<div className="searchbox-input-wrapper">
|
||||||
|
<input type="text" className="searchbox-input ins-search-input" placeholder={__('insight.hint')} />
|
||||||
|
<span className="searchbox-close ins-close ins-selectable"><i className="fa fa-times-circle"></i></span>
|
||||||
|
</div>
|
||||||
|
<div className="searchbox-result-wrapper ins-section-wrapper">
|
||||||
|
<div className="ins-section-container"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<script dangerouslySetInnerHTML={{ __html: js }}></script>
|
||||||
|
<script src={url_for('/js/insight.js')} defer={true}></script>
|
||||||
|
</Fragment>;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = cacheComponent(Insight, 'search.insight', props => {
|
||||||
|
return {
|
||||||
|
__: props.__,
|
||||||
|
url_for: props.url_for
|
||||||
|
};
|
||||||
|
});
|
|
@ -1,3 +0,0 @@
|
||||||
module.exports = (ctx, locals) => {
|
|
||||||
return locals;
|
|
||||||
}
|
|
|
@ -1,8 +0,0 @@
|
||||||
<% if (!has_config('share.install_url')) { %>
|
|
||||||
<div class="notification is-danger">
|
|
||||||
You need to set <code>install_url</code> to use AddThis. Please set it in <code>_config.yml</code>.
|
|
||||||
</div>
|
|
||||||
<% } else { %>
|
|
||||||
<div class="addthis_inline_share_toolbox"></div>
|
|
||||||
<script type="text/javascript" src="<%= get_config('share.install_url') %>"></script>
|
|
||||||
<% } %>
|
|
|
@ -0,0 +1,26 @@
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
const { Component, Fragment } = require('inferno');
|
||||||
|
const { cacheComponent } = require('../util/cache');
|
||||||
|
|
||||||
|
class AddThis extends Component {
|
||||||
|
render() {
|
||||||
|
const { installUrl } = this.props;
|
||||||
|
if (!installUrl) {
|
||||||
|
return <div className="notification is-danger">
|
||||||
|
You need to set <code>install_url</code> to use AddThis.
|
||||||
|
Please set it in <code>_config.yml</code>.
|
||||||
|
</div>;
|
||||||
|
}
|
||||||
|
return <Fragment>
|
||||||
|
<div className="addthis_inline_share_toolbox"></div>
|
||||||
|
<script src={installUrl} async={true}></script>
|
||||||
|
</Fragment>;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = cacheComponent(AddThis, 'share.addthis', props => {
|
||||||
|
return {
|
||||||
|
installUrl: props.install_url
|
||||||
|
};
|
||||||
|
});
|
|
@ -1,3 +0,0 @@
|
||||||
module.exports = (ctx, locals) => {
|
|
||||||
return locals;
|
|
||||||
}
|
|
|
@ -1,11 +0,0 @@
|
||||||
<!-- AddToAny BEGIN -->
|
|
||||||
<div class="a2a_kit a2a_kit_size_32 a2a_default_style">
|
|
||||||
<a class="a2a_dd" href="https://www.addtoany.com/share"></a>
|
|
||||||
<a class="a2a_button_facebook"></a>
|
|
||||||
<a class="a2a_button_twitter"></a>
|
|
||||||
<a class="a2a_button_telegram"></a>
|
|
||||||
<a class="a2a_button_whatsapp"></a>
|
|
||||||
<a class="a2a_button_reddit"></a>
|
|
||||||
</div>
|
|
||||||
<script async src="https://static.addtoany.com/menu/page.js"></script>
|
|
||||||
<!-- AddToAny END -->
|
|
|
@ -0,0 +1,24 @@
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
const { Component, Fragment } = require('inferno');
|
||||||
|
const { cacheComponent } = require('../util/cache');
|
||||||
|
|
||||||
|
class AddToAny extends Component {
|
||||||
|
render() {
|
||||||
|
return <Fragment>
|
||||||
|
<div className="a2a_kit a2a_kit_size_32 a2a_default_style">
|
||||||
|
<a className="a2a_dd" href="https://www.addtoany.com/share"></a>
|
||||||
|
<a className="a2a_button_facebook"></a>
|
||||||
|
<a className="a2a_button_twitter"></a>
|
||||||
|
<a className="a2a_button_telegram"></a>
|
||||||
|
<a className="a2a_button_whatsapp"></a>
|
||||||
|
<a className="a2a_button_reddit"></a>
|
||||||
|
</div>
|
||||||
|
<script src="https://static.addtoany.com/menu/page.js" async={true}></script>
|
||||||
|
</Fragment>;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = cacheComponent(AddToAny, 'share.addtoany', props => {
|
||||||
|
return {};
|
||||||
|
});
|
|
@ -1,3 +0,0 @@
|
||||||
module.exports = (ctx, locals) => {
|
|
||||||
return locals;
|
|
||||||
}
|
|
|
@ -1,9 +0,0 @@
|
||||||
<div class="bdsharebuttonbox">
|
|
||||||
<a href="#" class="bds_more" data-cmd="more"></a>
|
|
||||||
<a href="#" class="bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
|
|
||||||
<a href="#" class="bds_tsina" data-cmd="tsina" title="分享到新浪微博"></a>
|
|
||||||
<a href="#" class="bds_tqq" data-cmd="tqq" title="分享到腾讯微博"></a>
|
|
||||||
<a href="#" class="bds_renren" data-cmd="renren" title="分享到人人网"></a>
|
|
||||||
<a href="#" class="bds_weixin" data-cmd="weixin" title="分享到微信"></a>
|
|
||||||
</div>
|
|
||||||
<script>window._bd_share_config = { "common": { "bdSnsKey": {}, "bdText": "", "bdMini": "2", "bdPic": "", "bdStyle": "0", "bdSize": "16" }, "share": {} }; with (document) 0[(getElementsByTagName('head')[0] || body).appendChild(createElement('script')).src = 'http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion=' + ~(-new Date() / 36e5)];</script>
|
|
|
@ -0,0 +1,25 @@
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
const { Component, Fragment } = require('inferno');
|
||||||
|
const { cacheComponent } = require('../util/cache');
|
||||||
|
|
||||||
|
class BdShare extends Component {
|
||||||
|
render() {
|
||||||
|
const js = `window._bd_share_config = { "common": { "bdSnsKey": {}, "bdText": "", "bdMini": "2", "bdPic": "", "bdStyle": "0", "bdSize": "16" }, "share": {} }; with (document) 0[(getElementsByTagName('head')[0] || body).appendChild(createElement('script')).src = 'http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion=' + ~(-new Date() / 36e5)];`;
|
||||||
|
return <Fragment>
|
||||||
|
<div className="bdsharebuttonbox">
|
||||||
|
<a href="#" className="bds_more" data-cmd="more"></a>
|
||||||
|
<a href="#" className="bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
|
||||||
|
<a href="#" className="bds_tsina" data-cmd="tsina" title="分享到新浪微博"></a>
|
||||||
|
<a href="#" className="bds_tqq" data-cmd="tqq" title="分享到腾讯微博"></a>
|
||||||
|
<a href="#" className="bds_renren" data-cmd="renren" title="分享到人人网"></a>
|
||||||
|
<a href="#" className="bds_weixin" data-cmd="weixin" title="分享到微信"></a>
|
||||||
|
</div>
|
||||||
|
<script dangerouslySetInnerHTML={{ __html: js }}></script>
|
||||||
|
</Fragment>;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = cacheComponent(BdShare, 'share.bdshare', props => {
|
||||||
|
return {};
|
||||||
|
});
|
|
@ -1,3 +0,0 @@
|
||||||
module.exports = (ctx, locals) => {
|
|
||||||
return locals;
|
|
||||||
}
|
|
|
@ -1,3 +0,0 @@
|
||||||
<div class="social-share"></div>
|
|
||||||
<%- _css(cdn('social-share.js', '1.0.16', 'dist/css/share.min.css')) %>
|
|
||||||
<%- _js(cdn('social-share.js', '1.0.16', 'dist/js/social-share.min.js')) %>
|
|
|
@ -0,0 +1,23 @@
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
const { Component, Fragment } = require('inferno');
|
||||||
|
const { cacheComponent } = require('../util/cache');
|
||||||
|
|
||||||
|
class ShareJs extends Component {
|
||||||
|
render() {
|
||||||
|
const { cdn } = this.props;
|
||||||
|
return <Fragment>
|
||||||
|
<link rel="stylesheet" href={cdn('social-share.js', '1.0.16', 'dist/css/share.min.css')} />
|
||||||
|
<div class="social-share"></div>
|
||||||
|
<script src={cdn('social-share.js', '1.0.16', 'dist/js/social-share.min.js')}></script>
|
||||||
|
</Fragment>;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = cacheComponent(ShareJs, 'share.sharejs', props => {
|
||||||
|
return {
|
||||||
|
cdn: props.cdn,
|
||||||
|
// for cache purpose only
|
||||||
|
_providers: props.providers.cdn
|
||||||
|
};
|
||||||
|
});
|
|
@ -1,9 +0,0 @@
|
||||||
module.exports = (ctx, locals) => {
|
|
||||||
const { get_config } = ctx;
|
|
||||||
return Object.assign(locals, {
|
|
||||||
// just for diff detection
|
|
||||||
_providers: {
|
|
||||||
_cdn: get_config('providers.cdn')
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
|
@ -1,8 +0,0 @@
|
||||||
<% if (!has_config('share.install_url')) { %>
|
|
||||||
<div class="notification is-danger">
|
|
||||||
You need to set <code>install_url</code> to use ShareThis. Please set it in <code>_config.yml</code>.
|
|
||||||
</div>
|
|
||||||
<% } else { %>
|
|
||||||
<div class="sharethis-inline-share-buttons"></div>
|
|
||||||
<script type='text/javascript' src='<%= get_config('share.install_url') %>' async='async'></script>
|
|
||||||
<% } %>
|
|
|
@ -0,0 +1,26 @@
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
const { Component, Fragment } = require('inferno');
|
||||||
|
const { cacheComponent } = require('../util/cache');
|
||||||
|
|
||||||
|
class ShareThis extends Component {
|
||||||
|
render() {
|
||||||
|
const { installUrl } = this.props;
|
||||||
|
if (!installUrl) {
|
||||||
|
return <div className="notification is-danger">
|
||||||
|
You need to set <code>install_url</code> to use ShareThis.
|
||||||
|
Please set it in <code>_config.yml</code>.
|
||||||
|
</div>;
|
||||||
|
}
|
||||||
|
return <Fragment>
|
||||||
|
<div class="sharethis-inline-share-buttons"></div>
|
||||||
|
<script src={installUrl} async={true}></script>
|
||||||
|
</Fragment>;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = cacheComponent(ShareThis, 'share.sharethis', props => {
|
||||||
|
return {
|
||||||
|
installUrl: props.install_url
|
||||||
|
};
|
||||||
|
});
|
|
@ -1,3 +0,0 @@
|
||||||
module.exports = (ctx, locals) => {
|
|
||||||
return locals;
|
|
||||||
}
|
|
Loading…
Reference in New Issue