js代码更新
之前给大家说的在joe主题编辑器添加按钮,传送门:【Typecho】joe主题编辑器增加wxfans插件快捷加密文章内容按钮 这次添加了两个按钮,网某云新版歌单和单首歌曲,主要是引入了meting.js文件,配合Aplayer.js就可以解决原joe主题获取不了音乐的Bug。
joe-edit-button.js更新
// 优化后的代码:
document.addEventListener('DOMContentLoaded', () => {
// 统一按钮配置
const buttons = [
{
title: '公众号圈粉',
icon: `<div class="cm-tools-item" title="公众号圈粉"><svg t="1705652256817" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1495" width="20" height="20"><path d="M670.023548 368.251062c10.259668 0 20.38119 0.787946 30.53648 1.902326-27.361161-127.435391-163.538657-222.082004-319.066873-222.082004-173.813674 0-316.202639 118.450762-316.202639 268.934079 0 86.831624 47.341215 158.128437 126.509299 213.512838l-31.583323 95.101985 110.560048-55.386448c39.524179 7.748475 71.228251 15.809057 110.716614 15.809057 9.930163 0 19.771299-0.451278 29.473265-1.187035-6.123464-21.147646-9.771551-43.274596-9.771551-66.340941C401.265478 480.380862 519.85234 368.251062 670.023548 368.251062L670.023548 368.251062zM500.047272 282.537911c23.887037 0 39.591717 15.70468 39.591717 39.470967 0 23.679305-15.705704 39.542598-39.591717 39.542598-23.627117 0-47.410799-15.863293-47.410799-39.542598C452.636472 298.17403 476.366943 282.537911 500.047272 282.537911L500.047272 282.537911zM278.751167 361.551476c-23.731494 0-47.619554-15.863293-47.619554-39.542598 0-23.76731 23.88806-39.470967 47.619554-39.470967s39.488363 15.636119 39.488363 39.470967C318.23953 345.688183 302.482661 361.551476 278.751167 361.551476L278.751167 361.551476zM278.751167 361.551476" fill="#bfbfbf" p-id="1496"></path><path d="M958.709483 614.70822c0-126.403898-126.543068-229.42832-268.652669-229.42832-150.485363 0-268.915659 103.09503-268.915659 229.42832 0 126.753869 118.498858 229.462089 268.915659 229.462089 31.514761 0 63.272046-7.886621 94.89016-15.809057l86.690408 47.567365-23.76731-79.048357C911.351895 749.174748 958.709483 686.041872 958.709483 614.70822L958.709483 614.70822zM602.842473 575.132876c-15.70468 0-31.618115-15.633049-31.618115-31.618115 0-15.739473 15.914458-31.583323 31.618115-31.583323 24.010857 0 39.576367 15.84385 39.576367 31.583323C642.41884 559.499827 626.853329 575.132876 602.842473 575.132876L602.842473 575.132876zM776.78099 575.132876c-15.565511 0-31.445176-15.633049-31.445176-31.618115 0-15.739473 15.809057-31.583323 31.445176-31.583323 23.801079 0 39.576367 15.84385 39.576367 31.583323C816.356334 559.499827 800.581046 575.132876 776.78099 575.132876L776.78099 575.132876zM776.78099 575.132876" fill="#bfbfbf" p-id="1497"></path></svg>`, // 保持原有SVG代码
content: '<!--wxfans start-->请输入加密内容<!--wxfans end-->'
},
{
title: '新版单首网易云',
icon: `<svg t="1742209614129" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6440" width="30" height="30"><path d="M 837.766 364.816 c -50.8284 -54.1074 -111.313 -91.1997 -187.245 -98.7056 c -7.3237 -0.728725 -18.9833 -5.02822 -20.4042 -9.98353 c -6.59494 -23.064 -12.8255 -46.7841 -14.2831 -70.5404 c -1.63964 -26.5986 20.3678 -44.7435 46.7478 -39.4241 c 16.7243 3.38857 32.392 12.3883 48.2779 19.457 c 10.9673 4.88245 20.9872 12.3883 32.3188 15.9225 c 27.4727 8.48961 53.3788 -7.7245 58.5894 -35.7804 c 4.40882 -23.6837 -4.40882 -42.9219 -22.1535 -58.1522 c -28.8575 -24.7762 -62.998 -37.7482 -100.054 -44.7435 c -70.9775 -13.4083 -152.74 38.7681 -169.648 108.908 c -8.45318 35.0885 -1.7125 68.7549 10.4572 101.511 c 6.48563 17.5259 1.96755 24.5946 -16.0319 30.8615 c -118.308 41.3188 -182.508 155.436 -154.49 276.075 c 16.5056 71.1232 59.4641 121.733 131.862 138.604 c 74.4393 17.3438 136.818 -7.94311 182.62 -69.1919 c 37.0555 -49.5168 39.1322 -105.519 23.9754 -163.197 c -7.94311 -30.2422 -17.198 -60.1564 -26.6714 -92.9479 c 5.57476 1.09309 7.39653 1.20239 9.03612 1.78537 c 125.486 45.4361 188.959 183.858 125.232 318.813 c -63.9091 135.325 -211.911 183.348 -344.362 155.072 c -166.259 -35.5254 -278.955 -210.93 -245.286 -377.62 c 23.6108 -116.924 91.5644 -198.319 200.253 -246.342 c 8.27102 -3.68006 16.7971 -7.25083 24.2667 -12.2789 c 15.5945 -10.5301 24.8857 -25.6876 23.064 -44.6341 c -1.9311 -19.9306 -11.8782 -37.9297 -32.1367 -42.0112 c -16.2141 -3.27924 -36.0353 -3.68006 -50.7191 2.69627 c -166.223 72.1072 -260.848 197.994 -272.869 379.884 c -18.6555 282.566 246.128 504.023 521.296 440.882 c 171.833 -39.4241 293.167 -182.179 303.986 -330.804 c 7.10506 -97.2478 -18.619 -182.763 -85.6253 -254.109 Z m -309.05 234.651 c -39.0595 3.35212 -71.2327 -23.8295 -77.6089 -65.5484 c -11.1131 -72.5441 19.8943 -127.162 85.4791 -151.94 c 12.6069 -4.77315 18.1815 -2.91492 21.9347 10.858 c 8.74466 32.1003 19.4934 63.6176 28.6751 95.6091 c 3.13347 10.9309 3.97156 22.5539 5.8298 33.8857 c -0.218618 42.9219 -25.5779 73.8196 -64.3095 77.1353 Z" fill="#d81e06" p-id="6441"></path></svg>`, // 保持原有SVG代码
content: '<meting-js server="netease" type="song" id="这里填音乐id"></meting-js>'
},
{
title: '新版歌单网易云',
icon: `<svg t="1742211828254" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7669" width="30" height="30"><path d="M106.666667 213.333333A64 64 0 0 1 170.666667 149.333333h682.666666a64 64 0 0 1 0 128H170.666667A64 64 0 0 1 106.666667 213.333333z m724.992 131.157334c-22.869333-5.674667-45.994667-3.626667-62.890667 5.461333-17.152 9.130667-26.88 24.448-26.88 42.112v286.293333c-13.013333-13.056-39.082667-30.72-78.165333-30.72-71.936 0-130.389333 55.722667-130.389334 124.16 0 68.522667 58.453333 124.202667 130.389334 124.202667 71.893333 0 130.346667-55.68 130.346666-124.16v-298.282667l118.869334 29.013334c8.448 2.218667 22.272 3.114667 30.464 3.114666 48.426667 0 59.264-32.341333 59.264-72.234666 0-26.026667-25.472-48.682667-59.264-56.917334l-111.786667-32.042666zM170.666667 448a64 64 0 0 0 0 128h405.333333a64 64 0 0 0 0-128H170.666667z m0 298.666667a64 64 0 0 0 0 128h234.666666a64 64 0 0 0 0-128H170.666667z" p-id="7670"></path></svg>`, // 保持原有SVG代码
content: '<meting-js server="netease" type="playlist" id="这里填音乐id"></meting-js>'
}
];
// 统一创建按钮
function createEditorButton(config) {
const $toolbar = $(".cm-tools");
if ($toolbar.length === 0) return;
const button = $(
`<div class="cm-tools-item joe-dynamic-btn" title="${config.title}">
${config.icon}
</div>`
);
// 防止重复添加
if (!$toolbar.find(`[title="${config.title}"]`).length) {
$toolbar.append(button);
}
}
// 统一事件处理
function handleButtonClick(e) {
const title = $(this).attr('title');
const config = buttons.find(btn => btn.title === title);
if (!config) return;
// 获取编辑器实例(根据实际编辑器调整)
const editor = document.querySelector('.cm-content');
if (editor && editor.CodeMirror) {
// 使用编辑器API插入内容
editor.CodeMirror.replaceSelection(config.content);
} else {
// 备用方案:直接插入内容
const $activeLine = $(".cm-content .cm-activeLine");
if ($activeLine.length) {
$activeLine.append(config.content);
} else {
console.warn('找不到活动编辑器行');
}
}
// 关闭模态框
$('.cm-modal').removeClass('active');
}
// 初始化
buttons.forEach(createEditorButton);
// 使用事件委托绑定动态元素
$(document).on('click', '.cm-tools-item.joe-dynamic-btn', handleButtonClick);
// console.log('编辑器按钮初始化完成,共加载', buttons.length, '个按钮');
});
评论