artalk.pug(檔案已創建)
| @@ -0,0 +1,98 @@ | |||
| 1 | + | // 请使用该文件替换“[root]\themes\butterfly\layout\includes\third-party\comments\artalk.pug” | |
| 2 | + | - const { server, site, option } = theme.artalk | |
| 3 | + | - const { use, lazyload } = theme.comments | |
| 4 | + | ||
| 5 | + | script. | |
| 6 | + | (() => { | |
| 7 | + | let artalkItem = null | |
| 8 | + | const option = !{JSON.stringify(option)} | |
| 9 | + | const isShuoshuo = GLOBAL_CONFIG_SITE.pageType === 'shuoshuo' | |
| 10 | + | ||
| 11 | + | const destroyArtalk = () => { | |
| 12 | + | if (artalkItem) { | |
| 13 | + | artalkItem.destroy() | |
| 14 | + | artalkItem = null | |
| 15 | + | } | |
| 16 | + | } | |
| 17 | + | ||
| 18 | + | const artalkChangeMode = theme => artalkItem && artalkItem.setDarkMode(theme === 'dark') | |
| 19 | + | ||
| 20 | + | const initArtalk = (el = document, pageKey = location.pathname) => { | |
| 21 | + | artalkItem = Artalk.init({ | |
| 22 | + | el: el.querySelector('#artalk-wrap'), | |
| 23 | + | server: '!{server}', | |
| 24 | + | site: '!{site}', | |
| 25 | + | darkMode: document.documentElement.getAttribute('data-theme') === 'dark', | |
| 26 | + | ...option, | |
| 27 | + | pageKey: isShuoshuo ? pageKey : (option && option.pageKey) || pageKey, | |
| 28 | + | ||
| 29 | + | imgUploader: function(file) { | |
| 30 | + | token = "Bearer " + "你的token"; | |
| 31 | + | api = "https://lsky.pro.example/api/v1/upload" | |
| 32 | + | ||
| 33 | + | let headers = new Headers(); | |
| 34 | + | headers.set('Accept', 'application/json'); | |
| 35 | + | headers.set('Authorization', token); | |
| 36 | + | ||
| 37 | + | let formData = new FormData(); | |
| 38 | + | formData.append('file', file); | |
| 39 | + | ||
| 40 | + | // 发起请求，上传图片 | |
| 41 | + | return fetch(api, { | |
| 42 | + | method: 'POST', | |
| 43 | + | body: formData, | |
| 44 | + | headers: headers | |
| 45 | + | }).then((resp) => resp.json()) | |
| 46 | + | .then((resp) => resp.data.links.url) | |
| 47 | + | .catch((error) => { | |
| 48 | + | console.error('Image upload failed:', error); | |
| 49 | + | return null; | |
| 50 | + | }); | |
| 51 | + | }, | |
| 52 | + | }) | |
| 53 | + | ||
| 54 | + | if (GLOBAL_CONFIG.lightbox === 'null') return | |
| 55 | + | artalkItem.on('list-loaded', () => { | |
| 56 | + | artalkItem.ctx.get('list').getCommentNodes().forEach(comment => { | |
| 57 | + | const $content = comment.getRender().$content | |
| 58 | + | btf.loadLightbox($content.querySelectorAll('img:not([atk-emoticon])')) | |
| 59 | + | }) | |
| 60 | + | }) | |
| 61 | + | ||
| 62 | + | if (isShuoshuo) { | |
| 63 | + | window.shuoshuoComment.destroyArtalk = () => { | |
| 64 | + | destroyArtalk() | |
| 65 | + | if (el.children.length) { | |
| 66 | + | el.innerHTML = '' | |
| 67 | + | el.classList.add('no-comment') | |
| 68 | + | } | |
| 69 | + | } | |
| 70 | + | } | |
| 71 | + | ||
| 72 | + | btf.addGlobalFn('pjaxSendOnce', destroyArtalk, 'destroyArtalk') | |
| 73 | + | btf.addGlobalFn('themeChange', artalkChangeMode, 'artalk') | |
| 74 | + | } | |
| 75 | + | ||
| 76 | + | const loadArtalk = async (el, pageKey) => { | |
| 77 | + | if (typeof Artalk === 'object') initArtalk(el, pageKey) | |
| 78 | + | else { | |
| 79 | + | await btf.getCSS('!{theme.asset.artalk_css}') | |
| 80 | + | await btf.getScript('!{theme.asset.artalk_js}') | |
| 81 | + | initArtalk(el, pageKey) | |
| 82 | + | } | |
| 83 | + | } | |
| 84 | + | ||
| 85 | + | if (isShuoshuo) { | |
| 86 | + | '!{use[0]}' === 'Artalk' | |
| 87 | + | ? window.shuoshuoComment = { loadComment: loadArtalk } | |
| 88 | + | : window.loadOtherComment = loadArtalk | |
| 89 | + | return | |
| 90 | + | } | |
| 91 | + | ||
| 92 | + | if ('!{use[0]}' === 'Artalk' || !!{lazyload}) { | |
| 93 | + | if (!{lazyload}) btf.loadComment(document.getElementById('artalk-wrap'), loadArtalk) | |
| 94 | + | else setTimeout(loadArtalk, 100) | |
| 95 | + | } else { | |
| 96 | + | window.loadOtherComment = loadArtalk | |
| 97 | + | } | |
| 98 | + | })() | |
上一頁
下一頁