This commit is contained in:
杜恒 2021-04-16 17:09:40 +08:00
parent 6253deafcc
commit a85ca18e0f
16 changed files with 199 additions and 228 deletions

View File

@ -1,4 +1,59 @@
document.addEventListener('DOMContentLoaded', () => {
class JoeMtitle extends HTMLElement {
constructor() {
super();
this.innerHTML = `
<div class="joe_detail__article-mtitle">
<span class="text">
${this.getAttribute('title') || '默认标题'}
</span>
</div>`;
}
}
window.customElements.define('joe-mtitle', JoeMtitle);
class JoeDplayer extends HTMLElement {
constructor() {
super();
this.options = {
src: this.getAttribute('src'),
player: this.getAttribute('player')
};
this.render();
}
render() {
if (this.options.src) this.innerHTML = `<iframe allowfullscreen="true" class="joe_detail__article-player" src="${this.options.player + this.options.src}"></iframe>`;
else this.innerHTML = '播放地址未填写!';
}
}
window.customElements.define('joe-dplayer', JoeDplayer);
class JoeBilibili extends HTMLElement {
constructor() {
super();
this.bvid = this.getAttribute('bvid');
this.render();
}
render() {
if (this.bvid) this.innerHTML = `<iframe allowfullscreen="true" class="joe_detail__article-player" src="//player.bilibili.com/player.html?bvid=${this.bvid}"></iframe>`;
else this.innerHTML = 'Bvid未填写';
}
}
window.customElements.define('joe-bilibili', JoeBilibili);
class JoeMusic extends HTMLElement {
constructor() {
super();
this.options = {
id: this.getAttribute('id'),
width: this.getAttribute('width') || '100%',
autoplay: this.getAttribute('autoplay') ? 1 : 0
};
this.render();
}
render() {
if (this.options.id) this.innerHTML = `<iframe style="display: block; margin: 0 auto; border: 0;" width="${this.options.width}" height="86px" src="//music.163.com/outchain/player?type=2&id=${this.options.id}&auto=${this.options.autoplay}&height=66"></iframe>`;
else this.innerHTML = '网易云歌曲ID未填写';
}
}
window.customElements.define('joe-music', JoeMusic);
class JoeMlist extends HTMLElement {
constructor() {
super();
@ -10,7 +65,7 @@ document.addEventListener('DOMContentLoaded', () => {
this.render();
}
get template() {
return `<iframe allowfullscreen="true" style="display: block; margin: 0 auto; border: 0;" width="${this.options.width}" height="450px" src="//music.163.com/outchain/player?type=0&id=${this.options.id}&auto=${this.options.autoplay}&height=430"></iframe>`;
return `<iframe style="display: block; margin: 0 auto; border: 0;" width="${this.options.width}" height="450px" src="//music.163.com/outchain/player?type=0&id=${this.options.id}&auto=${this.options.autoplay}&height=430"></iframe>`;
}
render() {
if (this.options.id) this.innerHTML = this.template;
@ -18,75 +73,28 @@ document.addEventListener('DOMContentLoaded', () => {
}
}
window.customElements.define('joe-mlist', JoeMlist);
class JoeMusic extends HTMLElement {
class JoeAbtn extends HTMLElement {
constructor() {
super();
this.options = {
id: this.getAttribute('id'),
width: this.getAttribute('width') || '100%',
autoplay: this.getAttribute('autoplay') ? 1 : 0
icon: this.getAttribute('icon') || '',
color: this.getAttribute('color') || '#ff6800',
href: this.getAttribute('href') || '#',
radius: this.getAttribute('radius') || '17.5px',
content: this.getAttribute('content') || '多彩按钮'
};
this.render();
}
get template() {
return `<iframe allowfullscreen="true" style="display: block; margin: 0 auto; border: 0;" width="${this.options.width}" height="86px" src="//music.163.com/outchain/player?type=2&id=${this.options.id}&auto=${this.options.autoplay}&height=66"></iframe>`;
}
render() {
if (this.options.id) this.innerHTML = this.template;
else this.innerHTML = '网易云歌曲ID未填写';
this.innerHTML = `
<a class="joe_detail__article-abtn" style="background: ${this.options.color}; border-radius: ${this.options.radius}" href="${this.options.href}" target="_blank" rel="noopener noreferrer nofollow">
<span class="icon"><i class="${this.options.icon} fa"></i></span><span class="content">${this.options.content}</span>
</a>
`;
}
}
window.customElements.define('joe-music', JoeMusic);
class JoeBilibili extends HTMLElement {
constructor() {
super();
this.options = {
bvid: this.getAttribute('bvid')
};
this.render();
}
get template() {
return `<iframe allowfullscreen="true" class="joe_detail__article-player" style="display: block; margin: 0 auto; border: 0;" width="100%" height="180px" src="//player.bilibili.com/player.html?bvid=${this.options.bvid}"></iframe>`;
}
render() {
if (this.options.bvid) this.innerHTML = this.template;
else this.innerHTML = 'Bvid未填写';
}
}
window.customElements.define('joe-bilibili', JoeBilibili);
class JoeDplayer extends HTMLElement {
constructor() {
super();
this.options = {
src: this.getAttribute('src'),
player: this.getAttribute('player')
};
this.render();
}
get template() {
return `<iframe allowfullscreen="true" class="joe_detail__article-player" style="display: block; margin: 0 auto; border: 0;" width="100%" height="180px" src="${this.options.player + this.options.src}"></iframe>`;
}
render() {
if (this.options.src) this.innerHTML = this.template;
else this.innerHTML = '播放地址未填写!';
}
}
window.customElements.define('joe-dplayer', JoeDplayer);
class JoeMtitle extends HTMLElement {
constructor() {
super();
this.options = {
title: this.getAttribute('title') || '默认标题'
};
this.innerHTML = this.template;
}
get template() {
return `<div class="joe_detail__article-mtitle"><span class="text">${this.options.title}</span></div>`;
}
}
window.customElements.define('joe-mtitle', JoeMtitle);
window.customElements.define('joe-abtn', JoeAbtn);
/*
------------------------以下未测试------------------------------------------
*/
/* 便条按钮 */
class JoeAnote extends HTMLElement {
@ -112,31 +120,6 @@ document.addEventListener('DOMContentLoaded', () => {
}
}
window.customElements.define('joe-anote', JoeAnote);
/* 多彩按钮 */
class JoeAbtn extends HTMLElement {
constructor() {
super();
this.options = {
icon: this.getAttribute('icon') || '',
color: this.getAttribute('color') || '#ff6800',
href: this.getAttribute('href') || '#',
radius: this.getAttribute('radius') || '17.5px',
content: this.innerHTML.trim().replace(/^(<br>)|(<br>)$/g, '') || '多彩按钮'
};
this.render();
}
get template() {
return `
<a class="joe_detail__article-abtn" style="background: ${this.options.color}; border-radius: ${this.options.radius}" href="${this.options.href}" target="_blank" rel="noopener noreferrer nofollow">
<span class="icon"><i class="${this.options.icon} fa"></i></span><span class="content">${this.options.content}</span>
</a>
`;
}
render() {
this.innerHTML = this.template;
}
}
window.customElements.define('joe-abtn', JoeAbtn);
/* 点击复制 */
class JoeCopy extends HTMLElement {
constructor() {
@ -221,18 +204,6 @@ document.addEventListener('DOMContentLoaded', () => {
}
}
window.customElements.define('joe-show', JoeShow);
/* 时间轴 */
class JoeTimeline extends HTMLElement {}
/*
*
*
* *
* 私有化组件
* *
*
*
*/
/* 回复可见 - 隐藏状态 */
class JoeHide extends HTMLElement {
constructor() {

File diff suppressed because one or more lines are too long

View File

@ -42,7 +42,8 @@ class Editor
{
?>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/prismjs@1.23.0/themes/prism-tomorrow.min.css">
<link rel="stylesheet" href="<?php Helper::options()->themeUrl('typecho/write/css/joe.write.min.css') ?>">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="<?php Helper::options()->themeUrl('typecho/write/css/joe.write.min.css?v=20210416') ?>">
<script>
window.JoeConfig = {
uploadAPI: '<?php Helper::security()->index('/action/upload'); ?>',
@ -55,9 +56,9 @@ class Editor
}
</script>
<script src="https://cdn.jsdelivr.net/npm/typecho-joe-next@6.2.4/plugin/prism/prism.min.js"></script>
<script src="<?php Helper::options()->themeUrl('typecho/write/js/joe.short.min.js?v=20210402') ?>"></script>
<script src="<?php Helper::options()->themeUrl('typecho/write/js/joe.parse.min.js?v=20210402') ?>"></script>
<script src="<?php Helper::options()->themeUrl('typecho/write/js/joe.write.chunk.js?v=20210402') ?>"></script>
<script src="<?php Helper::options()->themeUrl('assets/js/joe.short.min.js?v=20210416') ?>"></script>
<script src="<?php Helper::options()->themeUrl('typecho/write/js/joe.parse.min.js?v=20210416') ?>"></script>
<script src="<?php Helper::options()->themeUrl('typecho/write/js/joe.write.chunk.js?v=20210416') ?>"></script>
<?php
}
}

View File

@ -2,7 +2,7 @@
/* 获取主题当前版本号 */
function _getVersion()
{
return "6.3.9";
return "6.4.0";
};
/* 判断是否是手机 */

View File

@ -25,6 +25,9 @@ function _parseContent($post, $login)
if (strpos($content, '{mtitle') !== false) {
$content = preg_replace('/{mtitle([^}]*)\/}/SU', '<joe-mtitle $1></joe-mtitle>', $content);
}
if (strpos($content, '{abtn') !== false) {
$content = preg_replace('/{abtn([^}]*)\/}/SU', '<joe-abtn $1></joe-abtn>', $content);
}
@ -60,11 +63,7 @@ function _parseContent($post, $login)
$content = preg_replace('/{anote(.*)}/SU', '<joe-anote $1>', $content);
$content = preg_replace('/{\/anote}/SU', '</joe-anote>', $content);
}
/* 多彩按钮 */
if (strpos($content, '{abtn') !== false) {
$content = preg_replace('/{abtn(.*)}/SU', '<joe-abtn $1>', $content);
$content = preg_replace('/{\/abtn}/SU', '</joe-abtn>', $content);
}
/* 多彩按钮 */
if (strpos($content, '{timeline') !== false) {
$content = strtr($content, array("{timeline}" => '<joe-timeline>', "{/timeline}" => '</joe-timeline>'));

View File

@ -1,6 +1,6 @@
{
"name": "typecho-joe-next",
"version": "6.3.9",
"version": "6.4.0",
"description": "A Theme Of Typecho",
"main": "index.php",
"keywords": [

View File

@ -39,5 +39,5 @@
<script src="<?php $this->options->themeUrl('assets/cursor/' . $this->options->JCursorEffects); ?>" async></script>
<?php endif; ?>
<script src="<?php $this->options->themeUrl('assets/js/joe.global.min.js?v=202104141445'); ?>"></script>
<script src="<?php $this->options->themeUrl('assets/js/joe.short.min.js?v=20210402'); ?>"></script>
<script src="<?php $this->options->themeUrl('assets/js/joe.short.min.js?v=20210416'); ?>"></script>
<?php $this->options->JCustomHeadEnd() ?>

File diff suppressed because one or more lines are too long

View File

@ -398,7 +398,7 @@ body.fullscreen {
max-height: 26px;
vertical-align: top;
}
a {
a:not(.joe_detail__article-anote):not(.joe_detail__article-abtn) {
display: inline-block;
line-height: 26px;
color: #409eff;
@ -680,6 +680,42 @@ body.fullscreen {
}
}
.joe_detail__article-player {
width: 100%;
height: 180px;
border: none;
}
.joe_detail__article-abtn {
display: inline-block;
color: #fff;
height: 35px;
line-height: 35px;
padding: 0 15px;
.icon {
display: inline-block;
vertical-align: top;
text-align: center;
.fa {
color: #fff;
}
[class^='fa-'] {
margin-right: 8px;
}
}
.content {
display: inline-block;
vertical-align: top;
max-width: 200px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
&:hover {
color: #fff;
}
}
@media (max-width: 768px) {
.cm-modal__wrapper {
width: 90%;

View File

@ -476,4 +476,41 @@ export default class JoeAction {
this._replaceSelection(cm, str);
cm.focus();
}
handleAbtn(cm) {
this._openModal({
title: '多彩按钮',
innerHtml: `
<div class="fitem">
<label>按钮图标</label>
<input autocomplete="off" name="icon" placeholder="请输入fa图标fa-download"/>
</div>
<div class="fitem">
<label>按钮颜色</label>
<input style="width: 44px;padding: 0 2px;flex: none" autocomplete="off" value="#ff6800" name="color" type="color"/>
</div>
<div class="fitem">
<label>跳转链接</label>
<input autocomplete="off" name="href" placeholder="请输入跳转链接"/>
</div>
<div class="fitem">
<label>按钮圆角</label>
<input autocomplete="off" name="radius" placeholder="请输入按钮圆角17.5px"/>
</div>
<div class="fitem">
<label>按钮内容</label>
<input autocomplete="off" name="content" placeholder="请输入按钮内容"/>
</div>
`,
confirm: () => {
const icon = $(".cm-modal input[name='icon']").val();
const color = $(".cm-modal input[name='color']").val();
const href = $(".cm-modal input[name='href']").val();
const radius = $(".cm-modal input[name='radius']").val();
const content = $(".cm-modal input[name='content']").val();
const str = ` {abtn icon="${icon}" color="${color}" href="${href}" radius="${radius}" content="${content}"/} `;
this._replaceSelection(cm, str);
cm.focus();
}
});
}
}

View File

@ -16,21 +16,12 @@ export default function createPreviewHtml(str) {
$1 = encodeURI($1).replace(/%/g, '');
return `<img class="owo" src="${window.JoeConfig.themeURL}assets/owo/aru/${$1}_2x.png" />`;
});
/* 网易云 - 歌单 */
str = str.replace(/{music-list([^}]*)\/}/g, '<joe-mlist $1></joe-mlist>');
/* 网易云 - 歌曲 */
str = str.replace(/{music([^}]*)\/}/g, '<joe-music $1></joe-music>');
/* BiliBili */
str = str.replace(/{bilibili([^}]*)\/}/g, '<joe-bilibili $1></joe-bilibili>');
/* dplayer */
str = str.replace(/{dplayer([^}]*)\/}/g, '<joe-dplayer player="' + player + '" $1></joe-dplayer>');
/* mtitle */
str = str.replace(/{mtitle([^}]*)\/}/g, '<joe-mtitle $1></joe-mtitle>');
str = str.replace(/{dplayer([^}]*)\/}/g, '<joe-dplayer player="' + player + '" $1></joe-dplayer>');
str = str.replace(/{bilibili([^}]*)\/}/g, '<joe-bilibili $1></joe-bilibili>');
str = str.replace(/{music-list([^}]*)\/}/g, '<joe-mlist $1></joe-mlist>');
str = str.replace(/{music([^}]*)\/}/g, '<joe-music $1></joe-music>');
str = str.replace(/{abtn([^}]*)\/}/g, '<joe-abtn $1></joe-abtn>');
$('.cm-preview-content').html(str);
$('.cm-preview-content pre code').each((i, el) => Prism.highlightElement(el));

View File

@ -125,6 +125,11 @@ export default [
title: 'M3U8/MP4视频',
innerHTML: '<svg viewBox="0 0 1170 1024" xmlns="http://www.w3.org/2000/svg" width="18" height="18"><path d="M508.197 298.642c-39.278-20.919-69.34-5.12-69.34 35.109v211.822c0 40.301 29.989 56.027 69.12 34.889L698.88 477.257c38.985-21.065 39.57-55.442.293-76.361L508.197 298.642z"/><path d="M1060.571 877.714H109.714C49.225 877.714 0 828.562 0 768V109.714C0 49.225 49.225 0 109.714 0h950.857c60.416 0 109.715 49.225 109.715 109.714V768c0 60.562-49.299 109.714-109.715 109.714zM109.714 73.143a36.571 36.571 0 0 0-36.571 36.571V768c0 20.114 16.457 36.571 36.571 36.571h950.857c20.115 0 36.572-16.457 36.572-36.571V109.714a36.571 36.571 0 0 0-36.572-36.571H109.714zM219.43 950.857h731.428V1024H219.43v-73.143z"/></svg>'
},
{
type: 'bilibili',
title: '哔哩哔哩视频',
innerHTML: '<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="18" height="18"><path d="M1023.488 344.064c-3.072-143.36-128-170.496-128-170.496s-97.28-.512-224.256-1.536l92.16-89.088s14.336-18.432-10.24-38.912-26.624-11.264-34.816-6.144c-7.68 5.632-117.76 113.664-137.216 133.12-50.176 0-102.4-.512-153.088-.512h17.92s-132.096-130.56-140.8-136.192-9.728-14.336-34.816 6.144c-24.576 20.48-10.24 38.912-10.24 38.912l94.208 91.648c-102.4 0-190.464.512-231.424 2.048C-9.728 210.944.512 344.064.512 344.064s1.536 285.696 0 429.568c14.336 144.384 125.44 167.424 125.44 167.424s44.032 1.024 76.8 1.024c3.072 9.216 6.144 54.272 56.32 54.272s56.32-54.272 56.32-54.272 369.152-1.536 399.872-1.536c1.536 15.872 9.216 57.344 59.904 56.32 50.176-1.024 53.76-59.904 53.76-59.904s17.408-1.536 68.608 0C1017.344 914.944 1024 774.656 1024 774.656s-2.048-287.232-.512-430.592zM920.576 800.768c0 22.528-17.92 40.96-39.936 40.96H153.6c-22.016 0-39.936-18.432-39.936-40.96V318.464c0-22.528 17.92-40.96 39.936-40.96h727.04c22.016 0 39.936 18.432 39.936 40.96v482.304z"/><path d="M403.968 414.208l-214.016 40.96 18.432 80.384 211.456-40.96-15.872-80.384zm115.2 212.48c-52.224 112.128-99.328 27.648-99.328 27.648l-34.816 22.528s69.12 94.208 134.656 22.528c77.312 71.68 136.704-23.04 136.704-23.04l-31.744-20.48c0-.512-55.808 79.872-105.472-29.184zM624.64 494.08l211.968 40.96 17.92-80.384-213.504-40.96-16.384 80.384z"/></svg>'
},
{
type: 'netease-list',
title: '网易云列表',
@ -136,9 +141,9 @@ export default [
innerHTML: '<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="20" height="20"><path d="M837.766 364.816c-50.828-54.107-111.313-91.2-187.245-98.706-7.324-.728-18.983-5.028-20.404-9.983-6.595-23.064-12.826-46.784-14.283-70.54-1.64-26.6 20.368-44.744 46.748-39.425 16.724 3.389 32.392 12.389 48.277 19.457 10.968 4.883 20.988 12.389 32.32 15.923 27.472 8.49 53.378-7.725 58.589-35.78 4.408-23.684-4.41-42.922-22.154-58.153-28.857-24.776-62.998-37.748-100.054-44.743-70.977-13.409-152.74 38.768-169.648 108.908-8.453 35.088-1.712 68.755 10.457 101.51 6.486 17.527 1.968 24.595-16.032 30.862-118.308 41.32-182.508 155.436-154.49 276.075 16.506 71.123 59.465 121.733 131.862 138.604 74.44 17.344 136.818-7.943 182.62-69.192 37.056-49.516 39.133-105.519 23.976-163.197-7.943-30.242-17.198-60.156-26.672-92.948 5.575 1.094 7.397 1.203 9.037 1.786 125.486 45.436 188.959 183.858 125.232 318.813-63.91 135.325-211.911 183.348-344.362 155.072-166.26-35.526-278.955-210.93-245.286-377.62 23.61-116.924 91.564-198.32 200.253-246.342 8.27-3.68 16.797-7.251 24.266-12.28 15.595-10.53 24.886-25.687 23.064-44.633-1.93-19.93-11.878-37.93-32.136-42.011-16.215-3.28-36.036-3.68-50.72 2.696-166.223 72.107-260.848 197.994-272.869 379.884-18.655 282.566 246.128 504.023 521.296 440.882 171.833-39.424 293.167-182.18 303.986-330.804 7.105-97.248-18.619-182.763-85.625-254.11zm-309.05 234.651c-39.06 3.352-71.233-23.83-77.609-65.548-11.113-72.545 19.894-127.162 85.48-151.94 12.606-4.774 18.18-2.915 21.934 10.858 8.745 32.1 19.493 63.617 28.675 95.609 3.133 10.93 3.972 22.554 5.83 33.885-.219 42.922-25.578 73.82-64.31 77.136z"/></svg>'
},
{
type: 'bilibili',
title: '哔哩哔哩视频',
innerHTML: '<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="18" height="18"><path d="M1023.488 344.064c-3.072-143.36-128-170.496-128-170.496s-97.28-.512-224.256-1.536l92.16-89.088s14.336-18.432-10.24-38.912-26.624-11.264-34.816-6.144c-7.68 5.632-117.76 113.664-137.216 133.12-50.176 0-102.4-.512-153.088-.512h17.92s-132.096-130.56-140.8-136.192-9.728-14.336-34.816 6.144c-24.576 20.48-10.24 38.912-10.24 38.912l94.208 91.648c-102.4 0-190.464.512-231.424 2.048C-9.728 210.944.512 344.064.512 344.064s1.536 285.696 0 429.568c14.336 144.384 125.44 167.424 125.44 167.424s44.032 1.024 76.8 1.024c3.072 9.216 6.144 54.272 56.32 54.272s56.32-54.272 56.32-54.272 369.152-1.536 399.872-1.536c1.536 15.872 9.216 57.344 59.904 56.32 50.176-1.024 53.76-59.904 53.76-59.904s17.408-1.536 68.608 0C1017.344 914.944 1024 774.656 1024 774.656s-2.048-287.232-.512-430.592zM920.576 800.768c0 22.528-17.92 40.96-39.936 40.96H153.6c-22.016 0-39.936-18.432-39.936-40.96V318.464c0-22.528 17.92-40.96 39.936-40.96h727.04c22.016 0 39.936 18.432 39.936 40.96v482.304z"/><path d="M403.968 414.208l-214.016 40.96 18.432 80.384 211.456-40.96-15.872-80.384zm115.2 212.48c-52.224 112.128-99.328 27.648-99.328 27.648l-34.816 22.528s69.12 94.208 134.656 22.528c77.312 71.68 136.704-23.04 136.704-23.04l-31.744-20.48c0-.512-55.808 79.872-105.472-29.184zM624.64 494.08l211.968 40.96 17.92-80.384-213.504-40.96-16.384 80.384z"/></svg>'
type: 'abtn',
title: '多彩按钮',
innerHTML: '<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="22" height="22"><path d="M856.73 796.7h-690c-57.9 0-105-47.1-105-105v-360c0-57.9 47.1-105 105-105h690c57.9 0 105 47.1 105 105v360c0 57.89-47.1 105-105 105zm-690-500.01c-19.3 0-35 15.7-35 35v360c0 19.3 15.7 35 35 35h690c19.3 0 35-15.7 35-35v-360c0-19.3-15.7-35-35-35h-690z"/><path d="M233.16 431.69H790.3v160H233.16z"/></svg>'
},
/* --------------------------- 短代码结束 --------------------------- */
{

View File

@ -1,92 +0,0 @@
document.addEventListener('DOMContentLoaded', () => {
class JoeMlist extends HTMLElement {
constructor() {
super();
this.options = {
id: this.getAttribute('id'),
width: this.getAttribute('width') || '100%',
autoplay: this.getAttribute('autoplay') ? 1 : 0
};
this.render();
}
get template() {
return `<iframe allowfullscreen="true" style="display: block; margin: 0 auto; border: 0;" width="${this.options.width}" height="450px" src="//music.163.com/outchain/player?type=0&id=${this.options.id}&auto=${this.options.autoplay}&height=430"></iframe>`;
}
render() {
if (this.options.id) this.innerHTML = this.template;
else this.innerHTML = '网易云歌单ID未填写';
}
}
window.customElements.define('joe-mlist', JoeMlist);
class JoeMusic extends HTMLElement {
constructor() {
super();
this.options = {
id: this.getAttribute('id'),
width: this.getAttribute('width') || '100%',
autoplay: this.getAttribute('autoplay') ? 1 : 0
};
this.render();
}
get template() {
return `<iframe allowfullscreen="true" style="display: block; margin: 0 auto; border: 0;" width="${this.options.width}" height="86px" src="//music.163.com/outchain/player?type=2&id=${this.options.id}&auto=${this.options.autoplay}&height=66"></iframe>`;
}
render() {
if (this.options.id) this.innerHTML = this.template;
else this.innerHTML = '网易云歌曲ID未填写';
}
}
window.customElements.define('joe-music', JoeMusic);
class JoeBilibili extends HTMLElement {
constructor() {
super();
this.options = {
bvid: this.getAttribute('bvid')
};
this.render();
}
get template() {
return `<iframe allowfullscreen="true" class="joe_detail__article-player" style="display: block; margin: 0 auto; border: 0;" width="100%" height="180px" src="//player.bilibili.com/player.html?bvid=${this.options.bvid}"></iframe>`;
}
render() {
if (this.options.bvid) this.innerHTML = this.template;
else this.innerHTML = 'Bvid未填写';
}
}
window.customElements.define('joe-bilibili', JoeBilibili);
class JoeDplayer extends HTMLElement {
constructor() {
super();
this.options = {
src: this.getAttribute('src'),
player: this.getAttribute('player')
};
this.render();
}
get template() {
return `<iframe allowfullscreen="true" class="joe_detail__article-player" style="display: block; margin: 0 auto; border: 0;" width="100%" height="180px" src="${this.options.player + this.options.src}"></iframe>`;
}
render() {
if (this.options.src) this.innerHTML = this.template;
else this.innerHTML = '播放地址未填写!';
}
}
window.customElements.define('joe-dplayer', JoeDplayer);
class JoeMtitle extends HTMLElement {
constructor() {
super();
this.options = {
title: this.getAttribute('title') || '默认标题'
};
this.innerHTML = this.template;
}
get template() {
return `<div class="joe_detail__article-mtitle"><span class="text">${this.options.title}</span></div>`;
}
}
window.customElements.define('joe-mtitle', JoeMtitle);
});

View File

@ -1 +0,0 @@
document.addEventListener("DOMContentLoaded",()=>{class t extends HTMLElement{constructor(){super(),this.options={id:this.getAttribute("id"),width:this.getAttribute("width")||"100%",autoplay:this.getAttribute("autoplay")?1:0},this.render()}get template(){return`<iframe allowfullscreen="true" style="display: block; margin: 0 auto; border: 0;" width="${this.options.width}" height="450px" src="//music.163.com/outchain/player?type=0&id=${this.options.id}&auto=${this.options.autoplay}&height=430"></iframe>`}render(){this.options.id?this.innerHTML=this.template:this.innerHTML="网易云歌单ID未填写"}}window.customElements.define("joe-mlist",t);class e extends HTMLElement{constructor(){super(),this.options={id:this.getAttribute("id"),width:this.getAttribute("width")||"100%",autoplay:this.getAttribute("autoplay")?1:0},this.render()}get template(){return`<iframe allowfullscreen="true" style="display: block; margin: 0 auto; border: 0;" width="${this.options.width}" height="86px" src="//music.163.com/outchain/player?type=2&id=${this.options.id}&auto=${this.options.autoplay}&height=66"></iframe>`}render(){this.options.id?this.innerHTML=this.template:this.innerHTML="网易云歌曲ID未填写"}}window.customElements.define("joe-music",e);class i extends HTMLElement{constructor(){super(),this.options={bvid:this.getAttribute("bvid")},this.render()}get template(){return`<iframe allowfullscreen="true" class="joe_detail__article-player" style="display: block; margin: 0 auto; border: 0;" width="100%" height="180px" src="//player.bilibili.com/player.html?bvid=${this.options.bvid}"></iframe>`}render(){this.options.bvid?this.innerHTML=this.template:this.innerHTML="Bvid未填写"}}window.customElements.define("joe-bilibili",i);class s extends HTMLElement{constructor(){super(),this.options={src:this.getAttribute("src"),player:this.getAttribute("player")},this.render()}get template(){return`<iframe allowfullscreen="true" class="joe_detail__article-player" style="display: block; margin: 0 auto; border: 0;" width="100%" height="180px" src="${this.options.player+this.options.src}"></iframe>`}render(){this.options.src?this.innerHTML=this.template:this.innerHTML="播放地址未填写!"}}window.customElements.define("joe-dplayer",s);class r extends HTMLElement{constructor(){super(),this.options={title:this.getAttribute("title")||"默认标题"},this.innerHTML=this.template}get template(){return`<div class="joe_detail__article-mtitle"><span class="text">${this.options.title}</span></div>`}}window.customElements.define("joe-mtitle",r)});

File diff suppressed because one or more lines are too long

View File

@ -280,6 +280,9 @@ class Joe extends JoeAction {
case 'html':
super.handleHtml(this.cm);
break;
case 'abtn':
super.handleAbtn(this.cm);
break;
}
});
$('.cm-tools').append(el);