forked from jerryc127/hexo-theme-butterfly
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
11 changed files
with
146 additions
and
138 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,21 +1,18 @@ | ||
- const { host, siteId, language, option } = theme.remark42 | ||
- const { host, siteId, option } = theme.remark42 | ||
|
||
script. | ||
let nowTheme = document.documentElement.getAttribute('data-theme') === 'dark' ? 'dark' : 'light' | ||
var remark_config = Object.assign({ | ||
host: '!{host}', | ||
site_id: '!{siteId}', | ||
components: ['counter'] | ||
(()=>{ | ||
window.remark_config = Object.assign({ | ||
host: '!{host}', | ||
site_id: '!{siteId}', | ||
},!{JSON.stringify(option)}) | ||
|
||
script. | ||
function loadRemark42(){ | ||
!function(e,r){ | ||
for(var o=r.head||r.body,n=0;n<e.length;n++){ | ||
var t=r.createElement("script"),m="noModule"in t,c=m?".mjs":".js"; | ||
m&&(t.type="module"),t.async=!0,t.defer=!0,t.src=remark_config.host+"/web/"+e[n]+c,o.appendChild(t) | ||
} | ||
}(remark_config.components||["embed"],document) | ||
function getCount () { | ||
const s = document.createElement('script') | ||
s.src = remark_config.host + '/web/counter.js' | ||
s.defer = true | ||
document.head.appendChild(s) | ||
} | ||
|
||
window.pjax ? loadRemark42() : window.addEventListener('load', loadRemark42) | ||
window.pjax ? getCount() : window.addEventListener('load', getCount) | ||
})() |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,43 +1,67 @@ | ||
- const { host, siteId, language, option } = theme.remark42 | ||
- const { host, siteId, option } = theme.remark42 | ||
script. | ||
let nowTheme = document.documentElement.getAttribute('data-theme') === 'dark' ? 'dark' : 'light' | ||
var remark_config = Object.assign({ | ||
host: '!{host}', | ||
site_id: '!{siteId}', | ||
components: ['embed','counter'], | ||
locale: '!{language}', | ||
},!{JSON.stringify(option)}) | ||
var remark_config = Object.assign({ | ||
host: '!{host}', | ||
site_id: '!{siteId}', | ||
components: ['embed'], | ||
theme: document.documentElement.getAttribute('data-theme') === 'dark' ? 'dark' : 'light' | ||
},!{JSON.stringify(option)}) | ||
|
||
script. | ||
function loadRemark42(){ | ||
!(function (e, n) { | ||
for (var o = 0; o < e.length; o++) { | ||
var r = n.createElement('script'), | ||
c = '.js', | ||
d = n.head || n.body | ||
'noModule' in r ? ((r.type = 'module'), (c = '.mjs')) : (r.async = !0), | ||
(r.defer = !0), | ||
(r.src = remark_config.host + '/web/' + e[o] + c), | ||
d.appendChild(r) | ||
} | ||
})(remark_config.components || ['embed'], document) | ||
function addRemark42(){ | ||
for (let i = 0; i < remark_config.components.length; i++) { | ||
const s = document.createElement('script') | ||
s.src = remark_config.host + '/web/' + remark_config.components[i] + '.js' | ||
s.defer = true | ||
document.head.appendChild(s) | ||
} | ||
} | ||
|
||
function initRemark42() { | ||
if (window.REMARK42) { | ||
if (this.remark42Instance) { | ||
this.remark42Instance.destroy() | ||
} | ||
|
||
function changeRemark42Theme(){ | ||
let theme = document.documentElement.getAttribute('data-theme') === 'dark' ? 'light' : 'dark' | ||
window.REMARK42.changeTheme(theme) | ||
this.remark42Instance = window.REMARK42.createInstance({ | ||
...remark_config | ||
}) | ||
} | ||
} | ||
|
||
let themeBtn = document.getElementById('darkmode') | ||
themeBtn.addEventListener('click',()=>{ | ||
changeRemark42Theme() | ||
}) | ||
function getCount () { | ||
const ele = document.querySelector('.remark42__counter') | ||
if (ele) { | ||
const s = document.createElement('script') | ||
s.src = remark_config.host + '/web/counter.js' | ||
s.defer = true | ||
document.head.appendChild(s) | ||
} | ||
} | ||
|
||
if ('!{theme.comments.use[0]}' === 'Remark42' || !!{theme.comments.lazyload}) { | ||
if (!{theme.comments.lazyload}) btf.loadComment(document.getElementById('remark42'), loadRemark42) | ||
else loadRemark42() | ||
function loadRemark42 () { | ||
if (window.REMARK42) { | ||
this.initRemark42() | ||
getCount() | ||
} else { | ||
function loadOtherComment () { | ||
loadRemark42() | ||
} | ||
} | ||
addRemark42() | ||
window.addEventListener('REMARK42::ready', () => { | ||
this.initRemark42() | ||
getCount() | ||
}) | ||
} | ||
} | ||
|
||
document.getElementById('darkmode').addEventListener('click',()=>{ | ||
if (!window.REMARK42) return | ||
let theme = document.documentElement.getAttribute('data-theme') === 'dark' ? 'light' : 'dark' | ||
window.REMARK42.changeTheme(theme) | ||
}) | ||
|
||
if ('!{theme.comments.use[0]}' === 'Remark42' || !!{theme.comments.lazyload}) { | ||
if (!{theme.comments.lazyload}) btf.loadComment(document.getElementById('remark42'), loadRemark42) | ||
else loadRemark42() | ||
} else { | ||
function loadOtherComment () { | ||
loadRemark42() | ||
} | ||
} |
142 changes: 65 additions & 77 deletions
142
layout/includes/third-party/newest-comments/remark42.pug
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,92 +1,80 @@ | ||
- const { host, siteId } = theme.remark42 | ||
- const { limit } = theme.newest_comments | ||
|
||
script. | ||
window.addEventListener('load', () => { | ||
const api = ['!{host}','/api/v1/last/','!{limit}','?site=','!{siteId}'].join('') | ||
window.addEventListener('load', () => { | ||
const changeContent = (content) => { | ||
if (content === '') return content | ||
|
||
const changeContent = (content) => { | ||
if (content === '') return content | ||
content = content.replace(/<img.*?src="(.*?)"?[^\>]+>/ig, '[!{_p("aside.card_newest_comments.image")}]') // replace image link | ||
content = content.replace(/<a[^>]+?href=["']?([^"']+)["']?[^>]*>([^<]+)<\/a>/gi, '[!{_p("aside.card_newest_comments.link")}]') // replace url | ||
content = content.replace(/<pre><code>.*?<\/pre>/gi, '[!{_p("aside.card_newest_comments.code")}]') // replace code | ||
content = content.replace(/<[^>]+>/g,"") // remove html tag | ||
|
||
content = content.replace(/<img.*?src="(.*?)"?[^\>]+>/ig, '[!{_p("aside.card_newest_comments.image")}]') // replace image link | ||
content = content.replace(/<a[^>]+?href=["']?([^"']+)["']?[^>]*>([^<]+)<\/a>/gi, '[!{_p("aside.card_newest_comments.link")}]') // replace url | ||
content = content.replace(/<pre><code>.*?<\/pre>/gi, '[!{_p("aside.card_newest_comments.code")}]') // replace code | ||
content = content.replace(/<[^>]+>/g,"") // remove html tag | ||
if (content.length > 150) { | ||
content = content.substring(0,150) + '...' | ||
} | ||
return content | ||
} | ||
|
||
if (content.length > 150) { | ||
content = content.substring(0,150) + '...' | ||
} | ||
return content | ||
} | ||
const generateHtml = array => { | ||
let result = '' | ||
|
||
const getComment = () => { | ||
try { | ||
let request = new XMLHttpRequest() | ||
request.open("GET",api) | ||
request.send(null) | ||
request.onload = () => { | ||
if (request.status == 200) { | ||
const commentsData = JSON.parse(request.responseText) | ||
const commentsArray = commentsData.map(k => { | ||
return { | ||
'content': changeContent(k.text), //Maybe we can use e.orig | ||
'avatar': k.user.picture, | ||
'nick': k.user.name, | ||
'url': k.locator.url, | ||
'date': new Date(k.time).toISOString() | ||
} | ||
}) | ||
if (array.length) { | ||
for (let i = 0; i < array.length; i++) { | ||
result += '<div class=\'aside-list-item\'>' | ||
|
||
saveToLocal.set('remark42-newest-comments', JSON.stringify(commentsArray), !{theme.newest_comments.storage}/(60*24)) | ||
generateHtml(commentsArray) | ||
} else { | ||
throw Error("Request to Remark42 Failed") | ||
} | ||
} | ||
} catch(e) { | ||
const $dom = document.querySelector('#card-newest-comments .aside-list') | ||
$dom.innerHTML= "!{_p('aside.card_newest_comments.error')}" | ||
} | ||
} | ||
if (!{theme.newest_comments.avatar}) { | ||
const name = '!{theme.lazyload.enable ? "data-lazy-src" : "src"}' | ||
result += `<a href='${array[i].url}' class='thumbnail'><img ${name}='${array[i].avatar}' alt='${array[i].nick}'></a>` | ||
} | ||
|
||
const generateHtml = array => { | ||
let result = '' | ||
result += `<div class='content'> | ||
<a class='comment' href='${array[i].url}' title='${array[i].content}'>${array[i].content}</a> | ||
<div class='name'><span>${array[i].nick} / </span><time datetime="${array[i].date}">${btf.diffDate(array[i].date, true)}</time></div> | ||
</div></div>` | ||
} | ||
} else { | ||
result += '!{_p("aside.card_newest_comments.zero")}' | ||
} | ||
|
||
if (array.length) { | ||
for (let i = 0; i < array.length; i++) { | ||
result += '<div class=\'aside-list-item\'>' | ||
let $dom = document.querySelector('#card-newest-comments .aside-list') | ||
$dom.innerHTML= result | ||
window.lazyLoadInstance && window.lazyLoadInstance.update() | ||
window.pjax && window.pjax.refresh($dom) | ||
} | ||
|
||
if (!{theme.newest_comments.avatar}) { | ||
const name = '!{theme.lazyload.enable ? "data-lazy-src" : "src"}' | ||
result += `<a href='${array[i].url}' class='thumbnail'><img ${name}='${array[i].avatar}' alt='${array[i].nick}'></a>` | ||
} | ||
|
||
result += `<div class='content'> | ||
<a class='comment' href='${array[i].url}' title='${array[i].content}'>${array[i].content}</a> | ||
<div class='name'><span>${array[i].nick} / </span><time datetime="${array[i].date}">${btf.diffDate(array[i].date, true)}</time></div> | ||
</div></div>` | ||
} | ||
} else { | ||
result += '!{_p("aside.card_newest_comments.zero")}' | ||
const getComment = () => { | ||
fetch('!{host}/api/v1/last/!{theme.newest_comments.limit}?site=!{siteId}') | ||
.then(response => response.json()) | ||
.then(data => { | ||
const remark42 = data.map(function (e) { | ||
return { | ||
'avatar': e.user.picture, | ||
'content': changeContent(e.text), | ||
'nick': e.user.name, | ||
'url': e.locator.url, | ||
'date': e.time, | ||
} | ||
}) | ||
saveToLocal.set('remark42-newest-comments', JSON.stringify(remark42), !{theme.newest_comments.storage}/(60*24)) | ||
generateHtml(remark42) | ||
}).catch(e => { | ||
const $dom = document.querySelector('#card-newest-comments .aside-list') | ||
$dom.innerHTML= "!{_p('aside.card_newest_comments.error')}" | ||
}) | ||
} | ||
|
||
let $dom = document.querySelector('#card-newest-comments .aside-list') | ||
$dom.innerHTML= result | ||
window.lazyLoadInstance && window.lazyLoadInstance.update() | ||
window.pjax && window.pjax.refresh($dom) | ||
} | ||
|
||
const newestCommentInit = () => { | ||
if (document.querySelector('#card-newest-comments .aside-list')) { | ||
const data = saveToLocal.get('remark42-newest-comments') | ||
if (data) { | ||
generateHtml(JSON.parse(data)) | ||
} else { | ||
getComment() | ||
} | ||
} | ||
const newestCommentInit = () => { | ||
if (document.querySelector('#card-newest-comments .aside-list')) { | ||
const data = saveToLocal.get('valine-newest-comments') | ||
if (data) { | ||
generateHtml(JSON.parse(data)) | ||
} else { | ||
getComment() | ||
} | ||
} | ||
} | ||
|
||
newestCommentInit() | ||
document.addEventListener('pjax:complete', newestCommentInit) | ||
}) | ||
newestCommentInit() | ||
document.addEventListener('pjax:complete', newestCommentInit) | ||
}) |