refactor(layout): comment and donate to jsx
parent
46fe8e7192
commit
e03c3ca572
|
@ -1,14 +0,0 @@
|
||||||
<% if (!has_config('comment.appid') || !has_config('comment.conf')) { %>
|
|
||||||
<div class="notification is-danger">
|
|
||||||
You forgot to set the <code>appid</code> or <code>conf</code> for Changyan. Please set it in <code>_config.yml</code>.
|
|
||||||
</div>
|
|
||||||
<% } else { %>
|
|
||||||
<div id="SOHUCS" sid="<%= path %>"></div>
|
|
||||||
<script charset="utf-8" type="text/javascript" src="https://changyan.sohu.com/upload/changyan.js" ></script>
|
|
||||||
<script type="text/javascript">
|
|
||||||
window.changyan.api.config({
|
|
||||||
appid: '<%= get_config('comment.appid') %>',
|
|
||||||
conf: '<%= get_config('comment.conf') %>'
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<% } %>
|
|
|
@ -0,0 +1,30 @@
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
const { Component, Fragment } = require('inferno');
|
||||||
|
const { cacheComponent } = require('../util/cache');
|
||||||
|
|
||||||
|
class ChangeYan extends Component {
|
||||||
|
render() {
|
||||||
|
const { appId, conf, path } = this.props;
|
||||||
|
if (!appId || !conf) {
|
||||||
|
return <div class="notification is-danger">
|
||||||
|
You forgot to set the <code>appid</code> or <code>conf</code> for Changyan.
|
||||||
|
Please set it in <code>_config.yml</code>.
|
||||||
|
</div>;
|
||||||
|
}
|
||||||
|
const js = `window.changyan.api.config({appid: '${appId}',conf: '${conf}'});`;
|
||||||
|
return <Fragment>
|
||||||
|
<div id="SOHUCS" sid={path}></div>
|
||||||
|
<script charset="utf-8" src="https://changyan.sohu.com/upload/changyan.js"></script>
|
||||||
|
<script dangerouslySetInnerHTML={{ __html: js }}></script>
|
||||||
|
</Fragment>;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = cacheComponent(ChangeYan, 'comment.changyan', props => {
|
||||||
|
return {
|
||||||
|
appId: props.appid,
|
||||||
|
conf: props.conf,
|
||||||
|
path: props.page.path
|
||||||
|
};
|
||||||
|
});
|
|
@ -1,4 +0,0 @@
|
||||||
module.exports = (ctx, locals) => {
|
|
||||||
const { page } = ctx;
|
|
||||||
return Object.assign(locals, { path: page.path });
|
|
||||||
}
|
|
|
@ -1,22 +0,0 @@
|
||||||
<% if (has_config('comment.shortname')) { %>
|
|
||||||
<script>
|
|
||||||
var disqus_config = function () {
|
|
||||||
this.page.url = '<%= permalink %>';
|
|
||||||
this.page.identifier = '<%= disqusId || path %>';
|
|
||||||
};
|
|
||||||
(function() {
|
|
||||||
var d = document, s = d.createElement('script');
|
|
||||||
s.src = '//' + '<%= get_config('comment.shortname') %>' + '.disqus.com/embed.js';
|
|
||||||
s.setAttribute('data-timestamp', +new Date());
|
|
||||||
(d.head || d.body).appendChild(s);
|
|
||||||
})();
|
|
||||||
</script>
|
|
||||||
<% } %>
|
|
||||||
<div id="disqus_thread">
|
|
||||||
<% if (!has_config('comment.shortname')) { %>
|
|
||||||
<div class="notification is-danger">
|
|
||||||
You forgot to set the <code>shortname</code> for Disqus. Please set it in <code>_config.yml</code>.
|
|
||||||
</div>
|
|
||||||
<% } %>
|
|
||||||
<noscript>Please enable JavaScript to view the <a href="//disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
|
|
||||||
</div>
|
|
|
@ -0,0 +1,41 @@
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
const { Component, Fragment } = require('inferno');
|
||||||
|
const { cacheComponent } = require('../util/cache');
|
||||||
|
|
||||||
|
class Disqus extends Component {
|
||||||
|
render() {
|
||||||
|
const { shortname, disqusId, path, permalink } = this.props;
|
||||||
|
if (!shortname) {
|
||||||
|
return <div class="notification is-danger">
|
||||||
|
You forgot to set the <code>shortname</code> for Disqus.
|
||||||
|
Please set it in <code>_config.yml</code>.
|
||||||
|
</div>;
|
||||||
|
}
|
||||||
|
const js = `var disqus_config = function () {
|
||||||
|
this.page.url = '${permalink}';
|
||||||
|
this.page.identifier = '${disqusId || path}';
|
||||||
|
};
|
||||||
|
(function() {
|
||||||
|
var d = document, s = d.createElement('script');
|
||||||
|
s.src = '//' + '${shortname}' + '.disqus.com/embed.js';
|
||||||
|
s.setAttribute('data-timestamp', +new Date());
|
||||||
|
(d.head || d.body).appendChild(s);
|
||||||
|
})();`;
|
||||||
|
return <Fragment>
|
||||||
|
<div id="disqus_thread">
|
||||||
|
<noscript>Please enable JavaScript to view the <a href="//disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
|
||||||
|
</div>
|
||||||
|
<script dangerouslySetInnerHTML={{ __html: js }}></script>
|
||||||
|
</Fragment>;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = cacheComponent(Disqus, 'comment.disqus', props => {
|
||||||
|
return {
|
||||||
|
path: props.page.path,
|
||||||
|
shortname: props.shortname,
|
||||||
|
disqusId: props.page.disqusId,
|
||||||
|
permalink: props.page.permalink
|
||||||
|
};
|
||||||
|
});
|
|
@ -1,4 +0,0 @@
|
||||||
module.exports = (ctx, locals) => {
|
|
||||||
const { permalink, disqusId, path } = ctx.page;
|
|
||||||
return Object.assign(locals, { permalink, disqusId, path });
|
|
||||||
}
|
|
|
@ -1,8 +0,0 @@
|
||||||
<script>(function(d, s, id) {
|
|
||||||
var js, fjs = d.getElementsByTagName(s)[0];
|
|
||||||
if (d.getElementById(id)) return;
|
|
||||||
js = d.createElement(s); js.id = id;
|
|
||||||
js.src = "//connect.facebook.net/<%= get_config('language', 'en').split('-').join('_') %>/sdk.js#xfbml=1&version=v2.8";
|
|
||||||
fjs.parentNode.insertBefore(js, fjs);
|
|
||||||
}(document, 'script', 'facebook-jssdk'));</script>
|
|
||||||
<div class="fb-comments" data-width="100%" data-href="<%= permalink %>" data-num-posts="5"></div>
|
|
|
@ -0,0 +1,28 @@
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
const { Component, Fragment } = require('inferno');
|
||||||
|
const { cacheComponent } = require('../util/cache');
|
||||||
|
|
||||||
|
class Facebook extends Component {
|
||||||
|
render() {
|
||||||
|
const { language, permalink } = this.props;
|
||||||
|
const js = `(function(d, s, id) {
|
||||||
|
var js, fjs = d.getElementsByTagName(s)[0];
|
||||||
|
if (d.getElementById(id)) return;
|
||||||
|
js = d.createElement(s); js.id = id;
|
||||||
|
js.src = "//connect.facebook.net/${(language || 'en').split('-').join('_')}/sdk.js#xfbml=1&version=v2.8";
|
||||||
|
fjs.parentNode.insertBefore(js, fjs);
|
||||||
|
}(document, 'script', 'facebook-jssdk'));`;
|
||||||
|
return <Fragment>
|
||||||
|
<div class="fb-comments" data-width="100%" data-href={permalink} data-num-posts="5"></div>
|
||||||
|
<script dangerouslySetInnerHTML={{ __html: js }}></script>
|
||||||
|
</Fragment>;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = cacheComponent(Facebook, 'comment.facebook', props => {
|
||||||
|
return {
|
||||||
|
language: props.language,
|
||||||
|
permalink: props.page.permalink
|
||||||
|
};
|
||||||
|
});
|
|
@ -1,4 +0,0 @@
|
||||||
module.exports = (ctx, locals) => {
|
|
||||||
const { permalink } = ctx.page;
|
|
||||||
return Object.assign(locals, { permalink });
|
|
||||||
}
|
|
|
@ -1,24 +0,0 @@
|
||||||
<% if (!has_config('comment.owner') || !has_config('comment.admin') || !has_config('comment.repo') || !has_config('comment.client_id') ||
|
|
||||||
!has_config('comment.client_secret')) { %>
|
|
||||||
<div class="notification is-danger">
|
|
||||||
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.
|
|
||||||
Please set it in <code>_config.yml</code>.
|
|
||||||
</div>
|
|
||||||
<% } else { %>
|
|
||||||
<div id="comment-container"></div>
|
|
||||||
<%- _css(cdn('gitalk', '1.4.1', 'dist/gitalk.css')) %>
|
|
||||||
<%- _js(cdn('gitalk', '1.4.1', 'dist/gitalk.min.js')) %>
|
|
||||||
<script>
|
|
||||||
var gitalk = new Gitalk({
|
|
||||||
clientID: '<%= get_config('comment.client_id') %>',
|
|
||||||
clientSecret: '<%= get_config('comment.client_secret') %>',
|
|
||||||
id: '<%= md5(path) %>',
|
|
||||||
repo: '<%= get_config('comment.repo') %>',
|
|
||||||
owner: '<%= get_config('comment.owner') %>',
|
|
||||||
admin: <%- JSON.stringify(get_config('comment.admin'))%>,
|
|
||||||
createIssueManually: <%= get_config('comment.create_issue_manually', false) %>,
|
|
||||||
distractionFreeMode: <%= get_config('comment.distraction_free_mode', false) %>
|
|
||||||
})
|
|
||||||
gitalk.render('comment-container')
|
|
||||||
</script>
|
|
||||||
<% } %>
|
|
|
@ -0,0 +1,66 @@
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
const crypto = require('crypto');
|
||||||
|
const { Component, Fragment } = require('inferno');
|
||||||
|
const { cacheComponent } = require('../util/cache');
|
||||||
|
|
||||||
|
class Gitalk extends Component {
|
||||||
|
render() {
|
||||||
|
const {
|
||||||
|
id,
|
||||||
|
repo,
|
||||||
|
owner,
|
||||||
|
admin,
|
||||||
|
clientId,
|
||||||
|
clientSecret,
|
||||||
|
createIssueManually,
|
||||||
|
distractionFreeMode,
|
||||||
|
cdn,
|
||||||
|
url_for
|
||||||
|
} = this.props;
|
||||||
|
|
||||||
|
if (!id || !repo || !owner || !admin || !clientId || !clientSecret) {
|
||||||
|
return <div class="notification is-danger">
|
||||||
|
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.
|
||||||
|
Please set it in <code>_config.yml</code>.
|
||||||
|
</div>;
|
||||||
|
}
|
||||||
|
const js = `var gitalk = new Gitalk({
|
||||||
|
id: '${id}',
|
||||||
|
repo: '${repo}',
|
||||||
|
owner: '${owner}',
|
||||||
|
clientID: '${clientId}',
|
||||||
|
clientSecret: '${clientSecret}',
|
||||||
|
admin: ${JSON.stringify(admin)},
|
||||||
|
createIssueManually: ${createIssueManually || false},
|
||||||
|
distractionFreeMode: ${distractionFreeMode || false}
|
||||||
|
})
|
||||||
|
gitalk.render('comment-container')`;
|
||||||
|
return <Fragment>
|
||||||
|
<div id="comment-container"></div>
|
||||||
|
<link rel="stylesheet" href={url_for(cdn('gitalk', '1.4.1', 'dist/gitalk.css'))} />
|
||||||
|
<script src={url_for(cdn('gitalk', '1.4.1', 'dist/gitalk.min.js'))}></script>
|
||||||
|
<script dangerouslySetInnerHTML={{ __html: js }}></script>
|
||||||
|
</Fragment>;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = cacheComponent(Gitalk, 'comment.gitalk', props => {
|
||||||
|
// FIXME: config name change
|
||||||
|
const id = crypto.createHash('md5').update(props.page.path).digest('hex');
|
||||||
|
return {
|
||||||
|
id,
|
||||||
|
repo: props.repo,
|
||||||
|
owner: props.owner,
|
||||||
|
admin: props.admin,
|
||||||
|
clientId: props.clientId,
|
||||||
|
clientSecret: props.clientSecret,
|
||||||
|
createIssueManually: props.createIssueManually,
|
||||||
|
distractionFreeMode: props.distractionFreeMode,
|
||||||
|
cdn: props.cdn,
|
||||||
|
url_for: props.url_for,
|
||||||
|
// for cache purpose only
|
||||||
|
_providers: props.providers.cdn
|
||||||
|
};
|
||||||
|
});
|
|
@ -1,4 +0,0 @@
|
||||||
module.exports = (ctx, locals) => {
|
|
||||||
const { path } = ctx.page;
|
|
||||||
return Object.assign(locals, { path });
|
|
||||||
}
|
|
|
@ -1,23 +0,0 @@
|
||||||
<% if (!has_config('comment.owner') || !has_config('comment.repo') || !has_config('comment.client_id') ||
|
|
||||||
!has_config('comment.client_secret')) { %>
|
|
||||||
<div class="notification is-danger">
|
|
||||||
You forgot to set the <code>owner</code>, <code>repo</code>, <code>client_id</code>, or <code>client_secret</code> for Gitment.
|
|
||||||
Please set it in <code>_config.yml</code>.
|
|
||||||
</div>
|
|
||||||
<% } else { %>
|
|
||||||
<div id="comment-container"></div>
|
|
||||||
<link rel="stylesheet" href="https://imsun.github.io/gitment/style/default.css">
|
|
||||||
<script src="https://imsun.github.io/gitment/dist/gitment.browser.js"></script>
|
|
||||||
<script>
|
|
||||||
var gitment = new Gitment({
|
|
||||||
id: '<%= md5(path) %>',
|
|
||||||
owner: '<%= get_config('comment.owner') %>',
|
|
||||||
repo: '<%= get_config('comment.repo') %>',
|
|
||||||
oauth: {
|
|
||||||
client_id: '<%= get_config('comment.client_id') %>',
|
|
||||||
client_secret: '<%= get_config('comment.client_secret') %>',
|
|
||||||
},
|
|
||||||
})
|
|
||||||
gitment.render('comment-container')
|
|
||||||
</script>
|
|
||||||
<% } %>
|
|
|
@ -0,0 +1,52 @@
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
const crypto = require('crypto');
|
||||||
|
const { Component, Fragment } = require('inferno');
|
||||||
|
const { cacheComponent } = require('../util/cache');
|
||||||
|
|
||||||
|
class Gitment extends Component {
|
||||||
|
render() {
|
||||||
|
const {
|
||||||
|
id,
|
||||||
|
repo,
|
||||||
|
owner,
|
||||||
|
clientId,
|
||||||
|
clientSecret
|
||||||
|
} = this.props;
|
||||||
|
|
||||||
|
if (!id || !repo || !owner || !clientId || !clientSecret) {
|
||||||
|
return <div class="notification is-danger">
|
||||||
|
You forgot to set the <code>owner</code>, <code>repo</code>, <code>client_id</code>,
|
||||||
|
or <code>client_secret</code> for Gitment.
|
||||||
|
Please set it in <code>_config.yml</code>.
|
||||||
|
</div>;
|
||||||
|
}
|
||||||
|
const js = `var gitment = new Gitment({
|
||||||
|
id: '${id}',
|
||||||
|
repo: '${repo}',
|
||||||
|
owner: '${owner}',
|
||||||
|
oauth: {
|
||||||
|
client_id: '${clientId}',
|
||||||
|
client_secret: '${clientSecret}',
|
||||||
|
},
|
||||||
|
})
|
||||||
|
gitment.render('comment-container')`;
|
||||||
|
return <Fragment>
|
||||||
|
<div id="comment-container"></div>
|
||||||
|
<link rel="stylesheet" href="https://imsun.github.io/gitment/style/default.css" />
|
||||||
|
<script src="https://imsun.github.io/gitment/dist/gitment.browser.js"></script>
|
||||||
|
<script dangerouslySetInnerHTML={{ __html: js }}></script>
|
||||||
|
</Fragment>;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = cacheComponent(Gitment, 'comment.gitment', props => {
|
||||||
|
const id = crypto.createHash('md5').update(props.page.path).digest('hex');
|
||||||
|
return {
|
||||||
|
id,
|
||||||
|
repo: props.repo,
|
||||||
|
owner: props.owner,
|
||||||
|
clientId: props.client_id,
|
||||||
|
clientSecret: props.client_secret
|
||||||
|
};
|
||||||
|
});
|
|
@ -1,4 +0,0 @@
|
||||||
module.exports = (ctx, locals) => {
|
|
||||||
const { path } = ctx.page;
|
|
||||||
return Object.assign(locals, { path });
|
|
||||||
}
|
|
|
@ -1,10 +0,0 @@
|
||||||
<% if (!has_config('comment.url')) { %>
|
|
||||||
<div class="notification is-danger">
|
|
||||||
You forgot to set the <code>url</code> for Isso. Please set it in <code>_config.yml</code>.
|
|
||||||
</div>
|
|
||||||
<% } else { %>
|
|
||||||
<div id="isso-thread"></div>
|
|
||||||
<script data-isso="//<%= get_config('comment.url') %>" src="//<%= get_config('comment.url') %>/js/embed.min.js">
|
|
||||||
</script>
|
|
||||||
<% } %>
|
|
||||||
|
|
|
@ -0,0 +1,26 @@
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
const { Component, Fragment } = require('inferno');
|
||||||
|
const { cacheComponent } = require('../util/cache');
|
||||||
|
|
||||||
|
class Isso extends Component {
|
||||||
|
render() {
|
||||||
|
const { url } = this.props;
|
||||||
|
if (!url) {
|
||||||
|
return <div class="notification is-danger">
|
||||||
|
You forgot to set the <code>url</code> for Isso.
|
||||||
|
Please set it in <code>_config.yml</code>.
|
||||||
|
</div>;
|
||||||
|
}
|
||||||
|
return <Fragment>
|
||||||
|
<div id="isso-thread"></div>
|
||||||
|
<script data-isso={'//' + url} src={`//${url}/js/embed.min.js`}></script>
|
||||||
|
</Fragment>;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = cacheComponent(Isso, 'comment.isso', props => {
|
||||||
|
return {
|
||||||
|
url: props.url
|
||||||
|
};
|
||||||
|
});
|
|
@ -1,3 +0,0 @@
|
||||||
module.exports = (ctx, locals) => {
|
|
||||||
return locals;
|
|
||||||
}
|
|
|
@ -1,22 +0,0 @@
|
||||||
<% if (!has_config('comment.uid')) { %>
|
|
||||||
<div class="notification is-danger">
|
|
||||||
You forgot to set the <code>uid</code> for LiveRe. Please set it in <code>_config.yml</code>.
|
|
||||||
</div>
|
|
||||||
<% } else { %>
|
|
||||||
<div id="lv-container" data-id="city" data-uid="<%= get_config('comment.uid') %>">
|
|
||||||
<script type="text/javascript">
|
|
||||||
(function(d, s) {
|
|
||||||
var j, e = d.getElementsByTagName(s)[0];
|
|
||||||
|
|
||||||
if (typeof LivereTower === 'function') { return; }
|
|
||||||
|
|
||||||
j = d.createElement(s);
|
|
||||||
j.src = 'https://cdn-city.livere.com/js/embed.dist.js';
|
|
||||||
j.async = true;
|
|
||||||
|
|
||||||
e.parentNode.insertBefore(j, e);
|
|
||||||
})(document, 'script');
|
|
||||||
</script>
|
|
||||||
<noscript> Please activate JavaScript for write a comment in LiveRe</noscript>
|
|
||||||
</div>
|
|
||||||
<% } %>
|
|
|
@ -0,0 +1,37 @@
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
const { Component } = require('inferno');
|
||||||
|
const { cacheComponent } = require('../util/cache');
|
||||||
|
|
||||||
|
class LiveRe extends Component {
|
||||||
|
render() {
|
||||||
|
const { uid } = this.props;
|
||||||
|
if (!uid) {
|
||||||
|
return <div class="notification is-danger">
|
||||||
|
You forgot to set the <code>uid</code> for LiveRe.
|
||||||
|
Please set it in <code>_config.yml</code>.
|
||||||
|
</div>;
|
||||||
|
}
|
||||||
|
const js = `(function(d, s) {
|
||||||
|
var j, e = d.getElementsByTagName(s)[0];
|
||||||
|
|
||||||
|
if (typeof LivereTower === 'function') { return; }
|
||||||
|
|
||||||
|
j = d.createElement(s);
|
||||||
|
j.src = 'https://cdn-city.livere.com/js/embed.dist.js';
|
||||||
|
j.async = true;
|
||||||
|
|
||||||
|
e.parentNode.insertBefore(j, e);
|
||||||
|
})(document, 'script');`;
|
||||||
|
return <div id="lv-container" data-id="city" data-uid={uid}>
|
||||||
|
<script dangerouslySetInnerHTML={{ __html: js }}></script>
|
||||||
|
<noscript>Please activate JavaScript for write a comment in LiveRe</noscript>
|
||||||
|
</div>;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = cacheComponent(LiveRe, 'comment.livere', props => {
|
||||||
|
return {
|
||||||
|
uid: props.uid
|
||||||
|
};
|
||||||
|
});
|
|
@ -1,3 +0,0 @@
|
||||||
module.exports = (ctx, locals) => {
|
|
||||||
return locals;
|
|
||||||
}
|
|
|
@ -1,19 +0,0 @@
|
||||||
<% if (!has_config('comment.app_id') || !has_config('comment.app_key')) { %>
|
|
||||||
<div class="notification is-danger">
|
|
||||||
You forgot to set the <code>app_id</code> or <code>app_key</code> for Valine. Please set it in <code>_config.yml</code>.
|
|
||||||
</div>
|
|
||||||
<% } else { %>
|
|
||||||
<div id="valine-thread" class="content"></div>
|
|
||||||
<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>
|
|
||||||
new Valine({
|
|
||||||
el: '#valine-thread' ,
|
|
||||||
notify: <%= get_config('comment.notify') %>,
|
|
||||||
verify: <%= get_config('comment.verify') %>,
|
|
||||||
app_id: '<%= get_config('comment.app_id') %>',
|
|
||||||
app_key: '<%= get_config('comment.app_key') %>',
|
|
||||||
placeholder: '<%= get_config('comment.placeholder') %>'
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<% } %>
|
|
|
@ -0,0 +1,40 @@
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
const { Component, Fragment } = require('inferno');
|
||||||
|
const { cacheComponent } = require('../util/cache');
|
||||||
|
|
||||||
|
class Valine extends Component {
|
||||||
|
render() {
|
||||||
|
const { appId, appKey, notify, verify, placeholder } = this.props;
|
||||||
|
if (!appId || !appKey) {
|
||||||
|
return <div class="notification is-danger">
|
||||||
|
You forgot to set the <code>app_id</code> or <code>app_key</code> for Valine.
|
||||||
|
Please set it in <code>_config.yml</code>.
|
||||||
|
</div>;
|
||||||
|
}
|
||||||
|
const js = `new Valine({
|
||||||
|
el: '#valine-thread' ,
|
||||||
|
notify: ${notify},
|
||||||
|
verify: ${verify},
|
||||||
|
app_id: '${appId}',
|
||||||
|
app_key: '${appKey}',
|
||||||
|
placeholder: '${placeholder}'
|
||||||
|
});`;
|
||||||
|
return <Fragment>
|
||||||
|
<div id="valine-thread" class="content"></div>
|
||||||
|
<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 dangerouslySetInnerHTML={{ __html: js }}></script>
|
||||||
|
</Fragment>;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = cacheComponent(Valine, 'comment.valine', props => {
|
||||||
|
return {
|
||||||
|
appId: props.app_id,
|
||||||
|
appKey: props.app_key,
|
||||||
|
notify: props.notify,
|
||||||
|
verify: props.verify,
|
||||||
|
placeholder: props.placeholder
|
||||||
|
};
|
||||||
|
});
|
|
@ -1,3 +0,0 @@
|
||||||
module.exports = (ctx, locals) => {
|
|
||||||
return locals;
|
|
||||||
}
|
|
|
@ -1,14 +0,0 @@
|
||||||
<% const qrcode = get_config_from_obj(service, 'qrcode');
|
|
||||||
if (qrcode) { %>
|
|
||||||
<a class="button is-info donate">
|
|
||||||
<span class="icon is-small">
|
|
||||||
<i class="fab fa-alipay"></i>
|
|
||||||
</span>
|
|
||||||
<span><%= __('donate.' + type) %></span>
|
|
||||||
<div class="qrcode"><img src="<%= url_for(qrcode) %>" alt="<%= __('donate.' + type) %>"></div>
|
|
||||||
</a>
|
|
||||||
<% } else { %>
|
|
||||||
<div class="notification is-danger">
|
|
||||||
You forgot to set the <code>qrcode</code> for Alipay. Please set it in <code>_config.yml</code>.
|
|
||||||
</div>
|
|
||||||
<% } %>
|
|
|
@ -0,0 +1,32 @@
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
const { Component } = require('inferno');
|
||||||
|
const { cacheComponent } = require('../util/cache');
|
||||||
|
|
||||||
|
class Alipay extends Component {
|
||||||
|
render() {
|
||||||
|
const { type, qrcode, __, url_for } = this.props;
|
||||||
|
if (!qrcode) {
|
||||||
|
return <div class="notification is-danger">
|
||||||
|
You forgot to set the <code>qrcode</code> for Alipay.
|
||||||
|
Please set it in <code>_config.yml</code>.
|
||||||
|
</div>;
|
||||||
|
}
|
||||||
|
return <a class="button is-info donate">
|
||||||
|
<span class="icon is-small">
|
||||||
|
<i class="fab fa-alipay"></i>
|
||||||
|
</span>
|
||||||
|
<span>{__('donate.' + type)}</span>
|
||||||
|
<span class="qrcode"><img src={url_for(qrcode)} alt={__('donate.' + type)} /></span>
|
||||||
|
</a>;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = cacheComponent(Alipay, 'donate.alipay', props => {
|
||||||
|
return {
|
||||||
|
type: props.type,
|
||||||
|
qrcode: props.qrcode,
|
||||||
|
__: props.__,
|
||||||
|
url_for: props.url_for
|
||||||
|
};
|
||||||
|
});
|
|
@ -1,3 +0,0 @@
|
||||||
module.exports = (ctx, locals) => {
|
|
||||||
return locals;
|
|
||||||
}
|
|
|
@ -1,13 +0,0 @@
|
||||||
<% const url = get_config_from_obj(service, 'url');
|
|
||||||
if (url) { %>
|
|
||||||
<a class="button is-danger donate" href="<%= url_for(url) %>" target="_blank" rel="noopener">
|
|
||||||
<span class="icon is-small">
|
|
||||||
<i class="fab fa-patreon"></i>
|
|
||||||
</span>
|
|
||||||
<span><%= __('donate.' + type) %></span>
|
|
||||||
</a>
|
|
||||||
<% } else { %>
|
|
||||||
<div class="notification is-danger">
|
|
||||||
You forgot to set the <code>url</code> Patreon. Please set it in <code>_config.yml</code>.
|
|
||||||
</div>
|
|
||||||
<% } %>
|
|
|
@ -0,0 +1,31 @@
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
const { Component } = require('inferno');
|
||||||
|
const { cacheComponent } = require('../util/cache');
|
||||||
|
|
||||||
|
class Patreon extends Component {
|
||||||
|
render() {
|
||||||
|
const { type, url, __, url_for } = this.props;
|
||||||
|
if (!url) {
|
||||||
|
return <div class="notification is-danger">
|
||||||
|
You forgot to set the <code>url</code> Patreon.
|
||||||
|
Please set it in <code>_config.yml</code>.
|
||||||
|
</div>;
|
||||||
|
}
|
||||||
|
return <a class="button is-danger donate" href={url_for(url)} target="_blank" rel="noopener">
|
||||||
|
<span class="icon is-small">
|
||||||
|
<i class="fab fa-patreon"></i>
|
||||||
|
</span>
|
||||||
|
<span>{__('donate.' + type)}</span>
|
||||||
|
</a>;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = cacheComponent(Patreon, 'donate.petreon', props => {
|
||||||
|
return {
|
||||||
|
type: props.type,
|
||||||
|
url: props.url,
|
||||||
|
__: props.__,
|
||||||
|
url_for: props.url_for
|
||||||
|
};
|
||||||
|
});
|
|
@ -1,3 +0,0 @@
|
||||||
module.exports = (ctx, locals) => {
|
|
||||||
return locals;
|
|
||||||
}
|
|
|
@ -1,20 +0,0 @@
|
||||||
<!-- Visit https://www.paypal.com/donate/buttons/ to get your donate button -->
|
|
||||||
<% const business = get_config_from_obj(service, 'business');
|
|
||||||
const currency_code = get_config_from_obj(service, 'currency_code');
|
|
||||||
if (business && currency_code) { %>
|
|
||||||
<a class="button is-warning donate" onclick="<%= 'document.getElementById(\'paypal-donate-form\').submit()' %>">
|
|
||||||
<span class="icon is-small">
|
|
||||||
<i class="fab fa-paypal"></i>
|
|
||||||
</span>
|
|
||||||
<span><%= __('donate.' + type) %></span>
|
|
||||||
</a>
|
|
||||||
<form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_blank" rel="noopener" id="paypal-donate-form">
|
|
||||||
<input type="hidden" name="cmd" value="_donations" />
|
|
||||||
<input type="hidden" name="business" value="<%= business %>" />
|
|
||||||
<input type="hidden" name="currency_code" value="<%= currency_code %>" />
|
|
||||||
</form>
|
|
||||||
<% } else { %>
|
|
||||||
<div class="notification is-danger">
|
|
||||||
You forgot to set the <code>business</code> and <code>currency_code</code> for Paypal. Please set it in <code>_config.yml</code>.
|
|
||||||
</div>
|
|
||||||
<% } %>
|
|
|
@ -0,0 +1,39 @@
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
const { Component, Fragment } = require('inferno');
|
||||||
|
const { cacheComponent } = require('../util/cache');
|
||||||
|
|
||||||
|
class Paypal extends Component {
|
||||||
|
render() {
|
||||||
|
const { type, business, currencyCode, __ } = this.props;
|
||||||
|
if (!business || !currencyCode) {
|
||||||
|
return <div class="notification is-danger">
|
||||||
|
You forgot to set the <code>business</code> or <code>currency_code</code> for Paypal.
|
||||||
|
Please set it in <code>_config.yml</code>.
|
||||||
|
</div>;
|
||||||
|
}
|
||||||
|
return <Fragment>
|
||||||
|
<a class="button is-warning donate" onclick="document.getElementById('paypal-donate-form').submit()">
|
||||||
|
<span class="icon is-small">
|
||||||
|
<i class="fab fa-paypal"></i>
|
||||||
|
</span>
|
||||||
|
<span>{__('donate.' + type)}</span>
|
||||||
|
</a>
|
||||||
|
<form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_blank" rel="noopener" id="paypal-donate-form">
|
||||||
|
<input type="hidden" name="cmd" value="_donations" />
|
||||||
|
<input type="hidden" name="business" value={business} />
|
||||||
|
<input type="hidden" name="currency_code" value={currencyCode} />
|
||||||
|
</form>
|
||||||
|
</Fragment>;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = cacheComponent(Paypal, 'donate.paypal', props => {
|
||||||
|
return {
|
||||||
|
type: props.type,
|
||||||
|
business: props.business,
|
||||||
|
currencyCode: props.currency_code,
|
||||||
|
__: props.__,
|
||||||
|
url_for: props.url_for
|
||||||
|
};
|
||||||
|
});
|
|
@ -1,3 +0,0 @@
|
||||||
module.exports = (ctx, locals) => {
|
|
||||||
return locals;
|
|
||||||
}
|
|
|
@ -1,14 +0,0 @@
|
||||||
<% const qrcode = get_config_from_obj(service, 'qrcode');
|
|
||||||
if (qrcode) { %>
|
|
||||||
<a class="button is-success donate">
|
|
||||||
<span class="icon is-small">
|
|
||||||
<i class="fab fa-weixin"></i>
|
|
||||||
</span>
|
|
||||||
<span><%= __('donate.' + type) %></span>
|
|
||||||
<div class="qrcode"><img src="<%= url_for(qrcode) %>" alt="<%= __('donate.' + type) %>"></div>
|
|
||||||
</a>
|
|
||||||
<% } else { %>
|
|
||||||
<div class="notification is-danger">
|
|
||||||
You forgot to set the <code>qrcode</code> for Wechat. Please set it in <code>_config.yml</code>.
|
|
||||||
</div>
|
|
||||||
<% } %>
|
|
|
@ -0,0 +1,32 @@
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
const { Component } = require('inferno');
|
||||||
|
const { cacheComponent } = require('../util/cache');
|
||||||
|
|
||||||
|
class Wechat extends Component {
|
||||||
|
render() {
|
||||||
|
const { type, qrcode, __, url_for } = this.props;
|
||||||
|
if (!qrcode) {
|
||||||
|
return <div class="notification is-danger">
|
||||||
|
You forgot to set the <code>qrcode</code> for Wechat.
|
||||||
|
Please set it in <code>_config.yml</code>.
|
||||||
|
</div>;
|
||||||
|
}
|
||||||
|
return <a class="button is-info donate">
|
||||||
|
<span class="icon is-small">
|
||||||
|
<i class="fab fa-weixin"></i>
|
||||||
|
</span>
|
||||||
|
<span>{__('donate.' + type)}</span>
|
||||||
|
<span class="qrcode"><img src={url_for(qrcode)} alt={__('donate.' + type)} /></span>
|
||||||
|
</a>;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = cacheComponent(Wechat, 'donate.wechat', props => {
|
||||||
|
return {
|
||||||
|
type: props.type,
|
||||||
|
qrcode: props.qrcode,
|
||||||
|
__: props.__,
|
||||||
|
url_for: props.url_for
|
||||||
|
};
|
||||||
|
});
|
|
@ -1,3 +0,0 @@
|
||||||
module.exports = (ctx, locals) => {
|
|
||||||
return locals;
|
|
||||||
}
|
|
|
@ -0,0 +1,40 @@
|
||||||
|
const crypto = require('crypto');
|
||||||
|
const { Component } = require('inferno');
|
||||||
|
const { createElement } = require('inferno-create-element');
|
||||||
|
|
||||||
|
const cache = {};
|
||||||
|
|
||||||
|
function computeHash(props) {
|
||||||
|
return crypto.createHash('md5').update(JSON.stringify(props)).digest("hex");
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = {
|
||||||
|
/**
|
||||||
|
* Create cached component from a given component class.
|
||||||
|
* The cache ID is caculated from the input props.
|
||||||
|
*
|
||||||
|
* @param {Component} type JSX component class
|
||||||
|
* @param {string} prefix Cache ID prefix
|
||||||
|
* @param {Function} transform Transform the input props to target props and
|
||||||
|
* its result is used to compute cache ID
|
||||||
|
* @returns Cached JSX element if cache ID is found.
|
||||||
|
* Otherwise, create a new element and cache it if the transform function is provided.
|
||||||
|
*/
|
||||||
|
cacheComponent(type, prefix, transform) {
|
||||||
|
if (typeof transform !== 'function') {
|
||||||
|
return props => createElement(type, props);
|
||||||
|
} else {
|
||||||
|
return props => {
|
||||||
|
const targetProps = transform(props);
|
||||||
|
const cacheId = prefix + '-' + computeHash(targetProps);
|
||||||
|
if (!cacheId) {
|
||||||
|
return createElement(type, targetProps);
|
||||||
|
}
|
||||||
|
if (!cache[cacheId]) {
|
||||||
|
cache[cacheId] = createElement(type, targetProps);
|
||||||
|
}
|
||||||
|
return cache[cacheId];
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
Loading…
Reference in New Issue