更新
This commit is contained in:
杜恒
parent
a9dfd567fb
commit
2cc0e38f92
2
assets/css/joe.global.min.css
vendored
2
assets/css/joe.global.min.css
vendored
File diff suppressed because one or more lines are too long
@ -1952,6 +1952,20 @@
|
|||||||
color: var(--routine);
|
color: var(--routine);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
&-hide {
|
||||||
|
background: repeating-linear-gradient(145deg, var(--classD), var(--classD) 15px, var(--background) 0, var(--background) 25px);
|
||||||
|
padding: 15px 0;
|
||||||
|
text-align: center;
|
||||||
|
position: relative;
|
||||||
|
user-select: none;
|
||||||
|
line-height: normal;
|
||||||
|
i {
|
||||||
|
position: relative;
|
||||||
|
font-style: normal;
|
||||||
|
cursor: pointer;
|
||||||
|
color: var(--theme);
|
||||||
|
}
|
||||||
|
}
|
||||||
&-message {
|
&-message {
|
||||||
position: relative;
|
position: relative;
|
||||||
border-left-width: 4px;
|
border-left-width: 4px;
|
||||||
|
|||||||
@ -1,255 +1,215 @@
|
|||||||
document.addEventListener('DOMContentLoaded', () => {
|
document.addEventListener('DOMContentLoaded', () => {
|
||||||
class JoeMtitle extends HTMLElement {
|
class JoeMtitle extends HTMLElement {
|
||||||
constructor() {
|
constructor() {
|
||||||
super();
|
super();
|
||||||
this.innerHTML = `
|
this.innerHTML = `
|
||||||
<div class="joe_detail__article-mtitle">
|
<div class="joe_detail__article-mtitle">
|
||||||
<span class="text">
|
<span class="text">
|
||||||
${this.getAttribute('title') || '默认标题'}
|
${this.getAttribute('title') || '默认标题'}
|
||||||
</span>
|
</span>
|
||||||
</div>`;
|
</div>`;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
window.customElements.define('joe-mtitle', JoeMtitle);
|
window.customElements.define('joe-mtitle', JoeMtitle);
|
||||||
class JoeDplayer extends HTMLElement {
|
class JoeDplayer extends HTMLElement {
|
||||||
constructor() {
|
constructor() {
|
||||||
super();
|
super();
|
||||||
this.options = {
|
this.options = {
|
||||||
src: this.getAttribute('src'),
|
src: this.getAttribute('src'),
|
||||||
player: this.getAttribute('player')
|
player: this.getAttribute('player')
|
||||||
};
|
};
|
||||||
this.render();
|
this.render();
|
||||||
}
|
}
|
||||||
render() {
|
render() {
|
||||||
if (this.options.src) this.innerHTML = `<iframe allowfullscreen="true" class="joe_detail__article-player" src="${this.options.player + this.options.src}"></iframe>`;
|
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 = '播放地址未填写！';
|
else this.innerHTML = '播放地址未填写！';
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
window.customElements.define('joe-dplayer', JoeDplayer);
|
window.customElements.define('joe-dplayer', JoeDplayer);
|
||||||
class JoeBilibili extends HTMLElement {
|
class JoeBilibili extends HTMLElement {
|
||||||
constructor() {
|
constructor() {
|
||||||
super();
|
super();
|
||||||
this.bvid = this.getAttribute('bvid');
|
this.bvid = this.getAttribute('bvid');
|
||||||
this.render();
|
this.render();
|
||||||
}
|
}
|
||||||
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>`;
|
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未填写！';
|
else this.innerHTML = 'Bvid未填写！';
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
window.customElements.define('joe-bilibili', JoeBilibili);
|
window.customElements.define('joe-bilibili', JoeBilibili);
|
||||||
class JoeMusic extends HTMLElement {
|
class JoeMusic extends HTMLElement {
|
||||||
constructor() {
|
constructor() {
|
||||||
super();
|
super();
|
||||||
this.options = {
|
this.options = {
|
||||||
id: this.getAttribute('id'),
|
id: this.getAttribute('id'),
|
||||||
width: this.getAttribute('width') || '100%',
|
width: this.getAttribute('width') || '100%',
|
||||||
autoplay: this.getAttribute('autoplay') ? 1 : 0
|
autoplay: this.getAttribute('autoplay') ? 1 : 0
|
||||||
};
|
};
|
||||||
this.render();
|
this.render();
|
||||||
}
|
}
|
||||||
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>`;
|
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未填写！';
|
else this.innerHTML = '网易云歌曲ID未填写！';
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
window.customElements.define('joe-music', JoeMusic);
|
window.customElements.define('joe-music', JoeMusic);
|
||||||
class JoeMlist extends HTMLElement {
|
class JoeMlist extends HTMLElement {
|
||||||
constructor() {
|
constructor() {
|
||||||
super();
|
super();
|
||||||
this.options = {
|
this.options = {
|
||||||
id: this.getAttribute('id'),
|
id: this.getAttribute('id'),
|
||||||
width: this.getAttribute('width') || '100%',
|
width: this.getAttribute('width') || '100%',
|
||||||
autoplay: this.getAttribute('autoplay') ? 1 : 0
|
autoplay: this.getAttribute('autoplay') ? 1 : 0
|
||||||
};
|
};
|
||||||
this.render();
|
this.render();
|
||||||
}
|
}
|
||||||
get template() {
|
get template() {
|
||||||
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>`;
|
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() {
|
render() {
|
||||||
if (this.options.id) this.innerHTML = this.template;
|
if (this.options.id) this.innerHTML = this.template;
|
||||||
else this.innerHTML = '网易云歌单ID未填写！';
|
else this.innerHTML = '网易云歌单ID未填写！';
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
window.customElements.define('joe-mlist', JoeMlist);
|
window.customElements.define('joe-mlist', JoeMlist);
|
||||||
class JoeAbtn extends HTMLElement {
|
class JoeAbtn extends HTMLElement {
|
||||||
constructor() {
|
constructor() {
|
||||||
super();
|
super();
|
||||||
this.options = {
|
this.options = {
|
||||||
icon: this.getAttribute('icon') || '',
|
icon: this.getAttribute('icon') || '',
|
||||||
color: this.getAttribute('color') || '#ff6800',
|
color: this.getAttribute('color') || '#ff6800',
|
||||||
href: this.getAttribute('href') || '#',
|
href: this.getAttribute('href') || '#',
|
||||||
radius: this.getAttribute('radius') || '17.5px',
|
radius: this.getAttribute('radius') || '17.5px',
|
||||||
content: this.getAttribute('content') || '多彩按钮'
|
content: this.getAttribute('content') || '多彩按钮'
|
||||||
};
|
};
|
||||||
this.innerHTML = `
|
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">
|
<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>
|
<span class="icon"><i class="${this.options.icon} fa"></i></span><span class="content">${this.options.content}</span>
|
||||||
</a>
|
</a>
|
||||||
`;
|
`;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
window.customElements.define('joe-abtn', JoeAbtn);
|
window.customElements.define('joe-abtn', JoeAbtn);
|
||||||
class JoeAnote extends HTMLElement {
|
class JoeAnote extends HTMLElement {
|
||||||
constructor() {
|
constructor() {
|
||||||
super();
|
super();
|
||||||
this.options = {
|
this.options = {
|
||||||
icon: this.getAttribute('icon') || 'fa-download',
|
icon: this.getAttribute('icon') || 'fa-download',
|
||||||
href: this.getAttribute('href') || '#',
|
href: this.getAttribute('href') || '#',
|
||||||
type: /^secondary$|^success$|^warning$|^error$|^info$/.test(this.getAttribute('type')) ? this.getAttribute('type') : 'secondary',
|
type: /^secondary$|^success$|^warning$|^error$|^info$/.test(this.getAttribute('type')) ? this.getAttribute('type') : 'secondary',
|
||||||
content: this.getAttribute('content') || '标签按钮'
|
content: this.getAttribute('content') || '标签按钮'
|
||||||
};
|
};
|
||||||
this.innerHTML = `
|
this.innerHTML = `
|
||||||
<a class="joe_detail__article-anote ${this.options.type}" href="${this.options.href}" target="_blank" rel="noopener noreferrer nofollow">
|
<a class="joe_detail__article-anote ${this.options.type}" href="${this.options.href}" target="_blank" rel="noopener noreferrer nofollow">
|
||||||
<span class="icon"><i class="fa ${this.options.icon}"></i></span><span class="content">${this.options.content}</span>
|
<span class="icon"><i class="fa ${this.options.icon}"></i></span><span class="content">${this.options.content}</span>
|
||||||
</a>
|
</a>
|
||||||
`;
|
`;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
window.customElements.define('joe-anote', JoeAnote);
|
window.customElements.define('joe-anote', JoeAnote);
|
||||||
class JoeDotted extends HTMLElement {
|
class JoeDotted extends HTMLElement {
|
||||||
constructor() {
|
constructor() {
|
||||||
super();
|
super();
|
||||||
this.startColor = this.getAttribute('startColor') || '#ff6c6c';
|
this.startColor = this.getAttribute('startColor') || '#ff6c6c';
|
||||||
this.endColor = this.getAttribute('endColor') || '#1989fa';
|
this.endColor = this.getAttribute('endColor') || '#1989fa';
|
||||||
this.innerHTML = `
|
this.innerHTML = `
|
||||||
<div class="joe_detail__article-dotted" style="background-image: repeating-linear-gradient(-45deg, ${this.startColor} 0, ${this.startColor} 20%, transparent 0, transparent 25%, ${this.endColor} 0, ${this.endColor} 45%, transparent 0, transparent 50%)"></div>
|
<div class="joe_detail__article-dotted" style="background-image: repeating-linear-gradient(-45deg, ${this.startColor} 0, ${this.startColor} 20%, transparent 0, transparent 25%, ${this.endColor} 0, ${this.endColor} 45%, transparent 0, transparent 50%)"></div>
|
||||||
`;
|
`;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
window.customElements.define('joe-dotted', JoeDotted);
|
window.customElements.define('joe-dotted', JoeDotted);
|
||||||
|
class JoeHide extends HTMLElement {
|
||||||
|
constructor() {
|
||||||
|
super();
|
||||||
|
this.render();
|
||||||
|
}
|
||||||
|
render() {
|
||||||
|
this.innerHTML = '<div class="joe_detail__article-hide">此处内容作者设置了 <i>回复</i> 可见</div>';
|
||||||
|
this.$button = this.querySelector('i');
|
||||||
|
const $comment = document.querySelector('.joe_comment');
|
||||||
|
const $header = document.querySelector('.joe_header');
|
||||||
|
if (!$comment || !$header) return;
|
||||||
|
this.$button.addEventListener('click', () => {
|
||||||
|
const top = $comment.offsetTop - $header.offsetHeight - 15;
|
||||||
|
window.scrollTo({ top, behavior: 'smooth' });
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
window.customElements.define('joe-hide', JoeHide);
|
||||||
|
|
||||||
/*
|
/*
|
||||||
------------------------以下未测试------------------------------------------
|
------------------------以下未测试------------------------------------------
|
||||||
*/
|
*/
|
||||||
|
|
||||||
/* 点击复制 */
|
/* 点击复制 */
|
||||||
class JoeCopy extends HTMLElement {
|
class JoeCopy extends HTMLElement {
|
||||||
constructor() {
|
constructor() {
|
||||||
super();
|
super();
|
||||||
this.options = {
|
this.options = {
|
||||||
text: this.getAttribute('text') || '默认文本',
|
text: this.getAttribute('text') || '默认文本',
|
||||||
content: this.innerHTML.trim().replace(/^(<br>)|(<br>)$/g, '') || '点击复制'
|
content: this.innerHTML.trim().replace(/^(<br>)|(<br>)$/g, '') || '点击复制'
|
||||||
};
|
};
|
||||||
this.render();
|
this.render();
|
||||||
}
|
}
|
||||||
get template() {
|
get template() {
|
||||||
return `<span class="joe_detail__article-copy">${this.options.content}</span>`;
|
return `<span class="joe_detail__article-copy">${this.options.content}</span>`;
|
||||||
}
|
}
|
||||||
render() {
|
render() {
|
||||||
this.innerHTML = this.template;
|
this.innerHTML = this.template;
|
||||||
this.event();
|
this.event();
|
||||||
}
|
}
|
||||||
event() {
|
event() {
|
||||||
this.$copy = this.querySelector('.joe_detail__article-copy');
|
this.$copy = this.querySelector('.joe_detail__article-copy');
|
||||||
new ClipboardJS(this.$copy, { text: () => this.options.text }).on('success', () => Qmsg.success('复制成功！'));
|
new ClipboardJS(this.$copy, { text: () => this.options.text }).on('success', () => Qmsg.success('复制成功！'));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
window.customElements.define('joe-copy', JoeCopy);
|
window.customElements.define('joe-copy', JoeCopy);
|
||||||
/* 消息提示 */
|
/* 消息提示 */
|
||||||
class JoeMessage extends HTMLElement {
|
class JoeMessage extends HTMLElement {
|
||||||
constructor() {
|
constructor() {
|
||||||
super();
|
super();
|
||||||
this.options = {
|
this.options = {
|
||||||
type: /^success$|^info$|^warning$|^error$/.test(this.getAttribute('type')) ? this.getAttribute('type') : 'info',
|
type: /^success$|^info$|^warning$|^error$/.test(this.getAttribute('type')) ? this.getAttribute('type') : 'info',
|
||||||
content: this.innerHTML.trim().replace(/^(<br>)|(<br>)$/g, '') || '提示内容'
|
content: this.innerHTML.trim().replace(/^(<br>)|(<br>)$/g, '') || '提示内容'
|
||||||
};
|
};
|
||||||
this.render();
|
this.render();
|
||||||
}
|
}
|
||||||
get template() {
|
get template() {
|
||||||
return `
|
return `
|
||||||
<div class="joe_detail__article-message ${this.options.type}">
|
<div class="joe_detail__article-message ${this.options.type}">
|
||||||
<div class="icon"></div>
|
<div class="icon"></div>
|
||||||
<div class="content">${this.options.content}</div>
|
<div class="content">${this.options.content}</div>
|
||||||
</div>
|
</div>
|
||||||
`;
|
`;
|
||||||
}
|
}
|
||||||
render() {
|
render() {
|
||||||
this.innerHTML = this.template;
|
this.innerHTML = this.template;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
window.customElements.define('joe-message', JoeMessage);
|
window.customElements.define('joe-message', JoeMessage);
|
||||||
/* 默认卡片 */
|
/* 默认卡片 */
|
||||||
class JoeCard extends HTMLElement {
|
class JoeCard extends HTMLElement {
|
||||||
constructor() {
|
constructor() {
|
||||||
super();
|
super();
|
||||||
this.options = {
|
this.options = {
|
||||||
width: this.getAttribute('width') || '100%',
|
width: this.getAttribute('width') || '100%',
|
||||||
label: this.getAttribute('label') || '默认标题',
|
label: this.getAttribute('label') || '默认标题',
|
||||||
content: this.innerHTML.trim().replace(/^(<br>)|(<br>)$/g, '') || '默认内容'
|
content: this.innerHTML.trim().replace(/^(<br>)|(<br>)$/g, '') || '默认内容'
|
||||||
};
|
};
|
||||||
this.render();
|
this.render();
|
||||||
}
|
}
|
||||||
get template() {
|
get template() {
|
||||||
return `
|
return `
|
||||||
<div class="joe_detail__article-card" style="width: ${this.options.width}">
|
<div class="joe_detail__article-card" style="width: ${this.options.width}">
|
||||||
<div class="title">${this.options.label}</div>
|
<div class="title">${this.options.label}</div>
|
||||||
<div class="content">${this.options.content}</div>
|
<div class="content">${this.options.content}</div>
|
||||||
</div>
|
</div>
|
||||||
`;
|
`;
|
||||||
}
|
}
|
||||||
render() {
|
render() {
|
||||||
this.innerHTML = this.template;
|
this.innerHTML = this.template;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
window.customElements.define('joe-card', JoeCard);
|
window.customElements.define('joe-card', JoeCard);
|
||||||
/* 回复可见 - 显示状态 */
|
|
||||||
class JoeShow extends HTMLElement {
|
|
||||||
constructor() {
|
|
||||||
super();
|
|
||||||
this.options = {
|
|
||||||
content: this.innerHTML.trim().replace(/^(<br>)|(<br>)$/g, '') || '默认隐藏的内容'
|
|
||||||
};
|
|
||||||
this.render();
|
|
||||||
}
|
|
||||||
render() {
|
|
||||||
this.innerHTML = this.options.content;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
window.customElements.define('joe-show', JoeShow);
|
|
||||||
/* 回复可见 - 隐藏状态 */
|
|
||||||
class JoeHide extends HTMLElement {
|
|
||||||
constructor() {
|
|
||||||
super();
|
|
||||||
this.render();
|
|
||||||
}
|
|
||||||
get template() {
|
|
||||||
return `
|
|
||||||
<style>
|
|
||||||
.container {
|
|
||||||
background: repeating-linear-gradient(145deg, var(--classD), var(--classD) 15px, var(--background) 0, var(--background) 25px);
|
|
||||||
padding: 15px 0;
|
|
||||||
text-align: center;
|
|
||||||
position: relative;
|
|
||||||
user-select: none;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
.container i {
|
|
||||||
position: relative;
|
|
||||||
font-style: normal;
|
|
||||||
cursor: pointer;
|
|
||||||
color: var(--theme);
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
<div class="container">
|
|
||||||
此处内容作者设置了 <i>回复</i> 可见
|
|
||||||
</div>
|
|
||||||
`;
|
|
||||||
}
|
|
||||||
render() {
|
|
||||||
this.innerHTML = '';
|
|
||||||
this._shadowRoot = this.attachShadow({ mode: 'closed' });
|
|
||||||
this._shadowRoot.innerHTML = this.template;
|
|
||||||
this.event();
|
|
||||||
}
|
|
||||||
event() {
|
|
||||||
this.$button = this._shadowRoot.querySelector('i');
|
|
||||||
this.$button.addEventListener('click', () => {
|
|
||||||
const top = $('.joe_comment').offset().top - $('.joe_header').height() - 15;
|
|
||||||
window.scrollTo({ top, behavior: 'smooth' });
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
window.customElements.define('joe-hide', JoeHide);
|
|
||||||
});
|
});
|
||||||
|
|||||||
2
assets/js/joe.short.min.js
vendored
2
assets/js/joe.short.min.js
vendored
File diff suppressed because one or more lines are too long
@ -2,7 +2,7 @@
|
|||||||
/* 获取主题当前版本号 */
|
/* 获取主题当前版本号 */
|
||||||
function _getVersion()
|
function _getVersion()
|
||||||
{
|
{
|
||||||
return "6.4.4";
|
return "6.4.5";
|
||||||
};
|
};
|
||||||
|
|
||||||
/* 判断是否是手机 */
|
/* 判断是否是手机 */
|
||||||
|
|||||||
@ -34,6 +34,15 @@ function _parseContent($post, $login)
|
|||||||
if (strpos($content, '{dotted') !== false) {
|
if (strpos($content, '{dotted') !== false) {
|
||||||
$content = preg_replace('/{dotted([^}]*)\/}/SU', '<joe-dotted $1></joe-dotted>', $content);
|
$content = preg_replace('/{dotted([^}]*)\/}/SU', '<joe-dotted $1></joe-dotted>', $content);
|
||||||
}
|
}
|
||||||
|
if (strpos($content, '{hide') !== false) {
|
||||||
|
$db = Typecho_Db::get();
|
||||||
|
$hasComment = $db->fetchAll($db->select()->from('table.comments')->where('cid = ?', $post->cid)->where('mail = ?', $post->remember('mail', true))->limit(1));
|
||||||
|
if ($hasComment || $login) {
|
||||||
|
$content = strtr($content, array("{hide}" => "", "{/hide}" => ""));
|
||||||
|
} else {
|
||||||
|
$content = preg_replace('/{hide[^}]*}(.*?){\/hide}/', '<joe-hide></joe-hide>', $content);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -43,16 +52,7 @@ function _parseContent($post, $login)
|
|||||||
$content = preg_replace('/{card-default(.*)}/SU', '<joe-card $1>', $content);
|
$content = preg_replace('/{card-default(.*)}/SU', '<joe-card $1>', $content);
|
||||||
$content = preg_replace('/{\/card-default}/SU', '</joe-card>', $content);
|
$content = preg_replace('/{\/card-default}/SU', '</joe-card>', $content);
|
||||||
}
|
}
|
||||||
/* 过滤回复可见 */
|
|
||||||
if (strpos($content, '{hide') !== false) {
|
|
||||||
$db = Typecho_Db::get();
|
|
||||||
$hasComment = $db->fetchAll($db->select()->from('table.comments')->where('cid = ?', $post->cid)->where('mail = ?', $post->remember('mail', true))->limit(1));
|
|
||||||
if ($hasComment || $login) {
|
|
||||||
$content = strtr($content, array("{hide}" => "<joe-show>", "{/hide}" => "</joe-show>"));
|
|
||||||
} else {
|
|
||||||
$content = strtr($content, array("{hide}" => "<joe-hide>", "{/hide}" => "</joe-hide>"));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
/* 过滤复制粘贴功能 */
|
/* 过滤复制粘贴功能 */
|
||||||
if (strpos($content, '{copy') !== false) {
|
if (strpos($content, '{copy') !== false) {
|
||||||
$content = preg_replace('/{copy(.*)}/SU', '<joe-copy $1>', $content);
|
$content = preg_replace('/{copy(.*)}/SU', '<joe-copy $1>', $content);
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "typecho-joe-next",
|
"name": "typecho-joe-next",
|
||||||
"version": "6.4.4",
|
"version": "6.4.5",
|
||||||
"description": "A Theme Of Typecho",
|
"description": "A Theme Of Typecho",
|
||||||
"main": "index.php",
|
"main": "index.php",
|
||||||
"keywords": [
|
"keywords": [
|
||||||
|
|||||||
2
typecho/write/css/joe.write.min.css
vendored
2
typecho/write/css/joe.write.min.css
vendored
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
@ -1,7 +1,7 @@
|
|||||||
import { undo, redo } from '@codemirror/history';
|
import { undo, redo } from '@codemirror/history';
|
||||||
export default class JoeAction {
|
export default class JoeAction {
|
||||||
constructor() {
|
constructor() {
|
||||||
$('body').append(`
|
$('body').append(`
|
||||||
<div class="cm-modal">
|
<div class="cm-modal">
|
||||||
<div class="cm-modal__wrapper">
|
<div class="cm-modal__wrapper">
|
||||||
<div class="cm-modal__wrapper-header">
|
<div class="cm-modal__wrapper-header">
|
||||||
@ -16,186 +16,186 @@ export default class JoeAction {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
`);
|
`);
|
||||||
$('.cm-modal__wrapper-footer--cancle, .cm-modal__wrapper-header--close').on('click', () => $('.cm-modal').removeClass('active'));
|
$('.cm-modal__wrapper-footer--cancle, .cm-modal__wrapper-header--close').on('click', () => $('.cm-modal').removeClass('active'));
|
||||||
$('.cm-modal__wrapper-footer--confirm').on('click', () => {
|
$('.cm-modal__wrapper-footer--confirm').on('click', () => {
|
||||||
this.options.confirm();
|
this.options.confirm();
|
||||||
$('.cm-modal').removeClass('active');
|
$('.cm-modal').removeClass('active');
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
_openModal(options = {}) {
|
_openModal(options = {}) {
|
||||||
const _options = {
|
const _options = {
|
||||||
title: '提示',
|
title: '提示',
|
||||||
innerHtml: '内容',
|
innerHtml: '内容',
|
||||||
hasFooter: true,
|
hasFooter: true,
|
||||||
confirm: () => {},
|
confirm: () => {},
|
||||||
handler: () => {}
|
handler: () => {}
|
||||||
};
|
};
|
||||||
this.options = Object.assign(_options, options);
|
this.options = Object.assign(_options, options);
|
||||||
$('.cm-modal__wrapper-header--text').html(this.options.title);
|
$('.cm-modal__wrapper-header--text').html(this.options.title);
|
||||||
$('.cm-modal__wrapper-bodyer').html(this.options.innerHtml);
|
$('.cm-modal__wrapper-bodyer').html(this.options.innerHtml);
|
||||||
this.options.hasFooter ? $('.cm-modal__wrapper-footer').show() : $('.cm-modal__wrapper-footer').hide();
|
this.options.hasFooter ? $('.cm-modal__wrapper-footer').show() : $('.cm-modal__wrapper-footer').hide();
|
||||||
$('.cm-modal').addClass('active');
|
$('.cm-modal').addClass('active');
|
||||||
this.options.handler();
|
this.options.handler();
|
||||||
}
|
}
|
||||||
_getLineCh(cm) {
|
_getLineCh(cm) {
|
||||||
const head = cm.state.selection.main.head;
|
const head = cm.state.selection.main.head;
|
||||||
const line = cm.state.doc.lineAt(head);
|
const line = cm.state.doc.lineAt(head);
|
||||||
return head - line.from;
|
return head - line.from;
|
||||||
}
|
}
|
||||||
_replaceSelection(cm, str) {
|
_replaceSelection(cm, str) {
|
||||||
cm.dispatch(cm.state.replaceSelection(str));
|
cm.dispatch(cm.state.replaceSelection(str));
|
||||||
}
|
}
|
||||||
_setCursor(cm, pos) {
|
_setCursor(cm, pos) {
|
||||||
cm.dispatch({ selection: { anchor: pos } });
|
cm.dispatch({ selection: { anchor: pos } });
|
||||||
}
|
}
|
||||||
_getSelection(cm) {
|
_getSelection(cm) {
|
||||||
return cm.state.sliceDoc(cm.state.selection.main.from, cm.state.selection.main.to);
|
return cm.state.sliceDoc(cm.state.selection.main.from, cm.state.selection.main.to);
|
||||||
}
|
}
|
||||||
_insetAmboText(cm, str) {
|
_insetAmboText(cm, str) {
|
||||||
const cursor = cm.state.selection.main.head;
|
const cursor = cm.state.selection.main.head;
|
||||||
const selection = this._getSelection(cm);
|
const selection = this._getSelection(cm);
|
||||||
this._replaceSelection(cm, ` ${str + selection + str} `);
|
this._replaceSelection(cm, ` ${str + selection + str} `);
|
||||||
if (selection === '') this._setCursor(cm, cursor + str.length + 1);
|
if (selection === '') this._setCursor(cm, cursor + str.length + 1);
|
||||||
cm.focus();
|
cm.focus();
|
||||||
}
|
}
|
||||||
_createTableLists(cm, url, activeTab = '', modalTitle) {
|
_createTableLists(cm, url, activeTab = '', modalTitle) {
|
||||||
$.ajax({
|
$.ajax({
|
||||||
url,
|
url,
|
||||||
dataType: 'json',
|
dataType: 'json',
|
||||||
success: res => {
|
success: res => {
|
||||||
let tabbarStr = '';
|
let tabbarStr = '';
|
||||||
let listsStr = '';
|
let listsStr = '';
|
||||||
for (let key in res) {
|
for (let key in res) {
|
||||||
const arr = res[key].split(' ');
|
const arr = res[key].split(' ');
|
||||||
tabbarStr += `<div class="tabbar-item ${key === activeTab ? 'active' : ''}" data-show="${key}">${key}</div>`;
|
tabbarStr += `<div class="tabbar-item ${key === activeTab ? 'active' : ''}" data-show="${key}">${key}</div>`;
|
||||||
listsStr += `<div class="lists ${key === activeTab ? 'active' : ''}" data-show="${key}">${arr.map(item => `<div class="lists-item" data-text="${item}">${item}</div>`).join(' ')}</div>`;
|
listsStr += `<div class="lists ${key === activeTab ? 'active' : ''}" data-show="${key}">${arr.map(item => `<div class="lists-item" data-text="${item}">${item}</div>`).join(' ')}</div>`;
|
||||||
}
|
}
|
||||||
this._openModal({
|
this._openModal({
|
||||||
title: modalTitle,
|
title: modalTitle,
|
||||||
hasFooter: false,
|
hasFooter: false,
|
||||||
innerHtml: `<div class="tabbar">${tabbarStr}</div>${listsStr}`,
|
innerHtml: `<div class="tabbar">${tabbarStr}</div>${listsStr}`,
|
||||||
handler: () => {
|
handler: () => {
|
||||||
$('.cm-modal__wrapper-bodyer .tabbar-item').on('click', function () {
|
$('.cm-modal__wrapper-bodyer .tabbar-item').on('click', function () {
|
||||||
const activeTab = $(this);
|
const activeTab = $(this);
|
||||||
const show = activeTab.attr('data-show');
|
const show = activeTab.attr('data-show');
|
||||||
const tabbar = $('.cm-modal__wrapper-bodyer .tabbar');
|
const tabbar = $('.cm-modal__wrapper-bodyer .tabbar');
|
||||||
activeTab.addClass('active').siblings().removeClass('active');
|
activeTab.addClass('active').siblings().removeClass('active');
|
||||||
tabbar.stop().animate({
|
tabbar.stop().animate({
|
||||||
scrollLeft: activeTab[0].offsetLeft - tabbar[0].offsetWidth / 2 + activeTab[0].offsetWidth / 2 - 15
|
scrollLeft: activeTab[0].offsetLeft - tabbar[0].offsetWidth / 2 + activeTab[0].offsetWidth / 2 - 15
|
||||||
});
|
});
|
||||||
$('.cm-modal__wrapper-bodyer .lists').removeClass('active');
|
$('.cm-modal__wrapper-bodyer .lists').removeClass('active');
|
||||||
$(".cm-modal__wrapper-bodyer .lists[data-show='" + show + "']").addClass('active');
|
$(".cm-modal__wrapper-bodyer .lists[data-show='" + show + "']").addClass('active');
|
||||||
});
|
});
|
||||||
const _this = this;
|
const _this = this;
|
||||||
$('.cm-modal__wrapper-bodyer .lists-item').on('click', function () {
|
$('.cm-modal__wrapper-bodyer .lists-item').on('click', function () {
|
||||||
const text = $(this).attr('data-text');
|
const text = $(this).attr('data-text');
|
||||||
_this._replaceSelection(cm, ` ${text} `);
|
_this._replaceSelection(cm, ` ${text} `);
|
||||||
$('.cm-modal').removeClass('active');
|
$('.cm-modal').removeClass('active');
|
||||||
cm.focus();
|
cm.focus();
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
handleFullScreen(el) {
|
handleFullScreen(el) {
|
||||||
el.toggleClass('active');
|
el.toggleClass('active');
|
||||||
$('body').toggleClass('fullscreen');
|
$('body').toggleClass('fullscreen');
|
||||||
$('.cm-container').toggleClass('fullscreen');
|
$('.cm-container').toggleClass('fullscreen');
|
||||||
$('.cm-preview').width(0);
|
$('.cm-preview').width(0);
|
||||||
}
|
}
|
||||||
handlePublish() {
|
handlePublish() {
|
||||||
$('#btn-submit').click();
|
$('#btn-submit').click();
|
||||||
}
|
}
|
||||||
handleUndo(cm) {
|
handleUndo(cm) {
|
||||||
undo(cm);
|
undo(cm);
|
||||||
cm.focus();
|
cm.focus();
|
||||||
}
|
}
|
||||||
handleRedo(cm) {
|
handleRedo(cm) {
|
||||||
redo(cm);
|
redo(cm);
|
||||||
cm.focus();
|
cm.focus();
|
||||||
}
|
}
|
||||||
handleIndent(cm) {
|
handleIndent(cm) {
|
||||||
this._replaceSelection(cm, ' ');
|
this._replaceSelection(cm, ' ');
|
||||||
cm.focus();
|
cm.focus();
|
||||||
}
|
}
|
||||||
handleTime(cm) {
|
handleTime(cm) {
|
||||||
const time = new Date();
|
const time = new Date();
|
||||||
const _Year = time.getFullYear();
|
const _Year = time.getFullYear();
|
||||||
const _Month = String(time.getMonth() + 1).padStart(2, 0);
|
const _Month = String(time.getMonth() + 1).padStart(2, 0);
|
||||||
const _Date = String(time.getDate()).padStart(2, 0);
|
const _Date = String(time.getDate()).padStart(2, 0);
|
||||||
const _Hours = String(time.getHours()).padStart(2, 0);
|
const _Hours = String(time.getHours()).padStart(2, 0);
|
||||||
const _Minutes = String(time.getMinutes()).padStart(2, 0);
|
const _Minutes = String(time.getMinutes()).padStart(2, 0);
|
||||||
const _Seconds = String(time.getSeconds()).padStart(2, 0);
|
const _Seconds = String(time.getSeconds()).padStart(2, 0);
|
||||||
const _Day = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'][time.getDay()];
|
const _Day = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'][time.getDay()];
|
||||||
const _time = `${this._getLineCh(cm) ? '\n' : ''}${_Year}-${_Month}-${_Date} ${_Hours}:${_Minutes}:${_Seconds} ${_Day}\n`;
|
const _time = `${this._getLineCh(cm) ? '\n' : ''}${_Year}-${_Month}-${_Date} ${_Hours}:${_Minutes}:${_Seconds} ${_Day}\n`;
|
||||||
this._replaceSelection(cm, _time);
|
this._replaceSelection(cm, _time);
|
||||||
cm.focus();
|
cm.focus();
|
||||||
}
|
}
|
||||||
handleHr(cm) {
|
handleHr(cm) {
|
||||||
const str = `${this._getLineCh(cm) ? '\n' : ''}\n------------\n\n`;
|
const str = `${this._getLineCh(cm) ? '\n' : ''}\n------------\n\n`;
|
||||||
this._replaceSelection(cm, str);
|
this._replaceSelection(cm, str);
|
||||||
cm.focus();
|
cm.focus();
|
||||||
}
|
}
|
||||||
handleClean(cm) {
|
handleClean(cm) {
|
||||||
cm.dispatch({ changes: { from: 0, to: cm.state.doc.length, insert: '' } });
|
cm.dispatch({ changes: { from: 0, to: cm.state.doc.length, insert: '' } });
|
||||||
cm.focus();
|
cm.focus();
|
||||||
}
|
}
|
||||||
handleOrdered(cm) {
|
handleOrdered(cm) {
|
||||||
const selection = this._getSelection(cm);
|
const selection = this._getSelection(cm);
|
||||||
if (selection === '') {
|
if (selection === '') {
|
||||||
const str = (this._getLineCh(cm) ? '\n\n' : '') + '1. ';
|
const str = (this._getLineCh(cm) ? '\n\n' : '') + '1. ';
|
||||||
this._replaceSelection(cm, str);
|
this._replaceSelection(cm, str);
|
||||||
} else {
|
} else {
|
||||||
const selectionText = selection.split('\n');
|
const selectionText = selection.split('\n');
|
||||||
for (let i = 0, len = selectionText.length; i < len; i++) {
|
for (let i = 0, len = selectionText.length; i < len; i++) {
|
||||||
selectionText[i] = selectionText[i] === '' ? '' : i + 1 + '. ' + selectionText[i];
|
selectionText[i] = selectionText[i] === '' ? '' : i + 1 + '. ' + selectionText[i];
|
||||||
}
|
}
|
||||||
const str = (this._getLineCh(cm) ? '\n' : '') + selectionText.join('\n');
|
const str = (this._getLineCh(cm) ? '\n' : '') + selectionText.join('\n');
|
||||||
this._replaceSelection(cm, str);
|
this._replaceSelection(cm, str);
|
||||||
}
|
}
|
||||||
cm.focus();
|
cm.focus();
|
||||||
}
|
}
|
||||||
handleUnordered(cm) {
|
handleUnordered(cm) {
|
||||||
const selection = this._getSelection(cm);
|
const selection = this._getSelection(cm);
|
||||||
if (selection === '') {
|
if (selection === '') {
|
||||||
const str = (this._getLineCh(cm) ? '\n' : '') + '- ';
|
const str = (this._getLineCh(cm) ? '\n' : '') + '- ';
|
||||||
this._replaceSelection(cm, str);
|
this._replaceSelection(cm, str);
|
||||||
} else {
|
} else {
|
||||||
const selectionText = selection.split('\n');
|
const selectionText = selection.split('\n');
|
||||||
for (let i = 0, len = selectionText.length; i < len; i++) {
|
for (let i = 0, len = selectionText.length; i < len; i++) {
|
||||||
selectionText[i] = selectionText[i] === '' ? '' : '- ' + selectionText[i];
|
selectionText[i] = selectionText[i] === '' ? '' : '- ' + selectionText[i];
|
||||||
}
|
}
|
||||||
const str = (this._getLineCh(cm) ? '\n' : '') + selectionText.join('\n');
|
const str = (this._getLineCh(cm) ? '\n' : '') + selectionText.join('\n');
|
||||||
this._replaceSelection(cm, str);
|
this._replaceSelection(cm, str);
|
||||||
}
|
}
|
||||||
cm.focus();
|
cm.focus();
|
||||||
}
|
}
|
||||||
handleQuote(cm) {
|
handleQuote(cm) {
|
||||||
const selection = this._getSelection(cm);
|
const selection = this._getSelection(cm);
|
||||||
if (selection === '') {
|
if (selection === '') {
|
||||||
this._replaceSelection(cm, `${this._getLineCh(cm) ? '\n' : ''}> `);
|
this._replaceSelection(cm, `${this._getLineCh(cm) ? '\n' : ''}> `);
|
||||||
} else {
|
} else {
|
||||||
const selectionText = selection.split('\n');
|
const selectionText = selection.split('\n');
|
||||||
for (let i = 0, len = selectionText.length; i < len; i++) {
|
for (let i = 0, len = selectionText.length; i < len; i++) {
|
||||||
selectionText[i] = selectionText[i] === '' ? '' : '> ' + selectionText[i];
|
selectionText[i] = selectionText[i] === '' ? '' : '> ' + selectionText[i];
|
||||||
}
|
}
|
||||||
const str = (this._getLineCh(cm) ? '\n' : '') + selectionText.join('\n');
|
const str = (this._getLineCh(cm) ? '\n' : '') + selectionText.join('\n');
|
||||||
this._replaceSelection(cm, str);
|
this._replaceSelection(cm, str);
|
||||||
}
|
}
|
||||||
cm.focus();
|
cm.focus();
|
||||||
}
|
}
|
||||||
handleDownload(cm) {
|
handleDownload(cm) {
|
||||||
const title = $('#title').val() || '新文章';
|
const title = $('#title').val() || '新文章';
|
||||||
const aTag = document.createElement('a');
|
const aTag = document.createElement('a');
|
||||||
let blob = new Blob([cm.state.doc.toString()]);
|
let blob = new Blob([cm.state.doc.toString()]);
|
||||||
aTag.download = title + '.md';
|
aTag.download = title + '.md';
|
||||||
aTag.href = URL.createObjectURL(blob);
|
aTag.href = URL.createObjectURL(blob);
|
||||||
aTag.click();
|
aTag.click();
|
||||||
URL.revokeObjectURL(blob);
|
URL.revokeObjectURL(blob);
|
||||||
}
|
}
|
||||||
handleTitle(cm, tool) {
|
handleTitle(cm, tool) {
|
||||||
const item = $(`
|
const item = $(`
|
||||||
<div class="cm-tools-item" title="${tool.title}">
|
<div class="cm-tools-item" title="${tool.title}">
|
||||||
${tool.innerHTML}
|
${tool.innerHTML}
|
||||||
<div class="cm-tools__dropdown">
|
<div class="cm-tools__dropdown">
|
||||||
@ -208,26 +208,26 @@ export default class JoeAction {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
`);
|
`);
|
||||||
item.on('click', function (e) {
|
item.on('click', function (e) {
|
||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
$(this).toggleClass('active');
|
$(this).toggleClass('active');
|
||||||
});
|
});
|
||||||
const _this = this;
|
const _this = this;
|
||||||
item.on('click', '.cm-tools__dropdown-item', function (e) {
|
item.on('click', '.cm-tools__dropdown-item', function (e) {
|
||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
const text = $(this).attr('data-text');
|
const text = $(this).attr('data-text');
|
||||||
if (_this._getLineCh(cm)) _this._replaceSelection(cm, '\n\n' + text);
|
if (_this._getLineCh(cm)) _this._replaceSelection(cm, '\n\n' + text);
|
||||||
else _this._replaceSelection(cm, text);
|
else _this._replaceSelection(cm, text);
|
||||||
item.removeClass('active');
|
item.removeClass('active');
|
||||||
cm.focus();
|
cm.focus();
|
||||||
});
|
});
|
||||||
$(document).on('click', () => item.removeClass('active'));
|
$(document).on('click', () => item.removeClass('active'));
|
||||||
$('.cm-tools').append(item);
|
$('.cm-tools').append(item);
|
||||||
}
|
}
|
||||||
handleLink(cm) {
|
handleLink(cm) {
|
||||||
this._openModal({
|
this._openModal({
|
||||||
title: '插入链接',
|
title: '插入链接',
|
||||||
innerHtml: `
|
innerHtml: `
|
||||||
<div class="fitem">
|
<div class="fitem">
|
||||||
<label>链接标题</label>
|
<label>链接标题</label>
|
||||||
<input autocomplete="off" name="title" placeholder="请输入链接标题"/>
|
<input autocomplete="off" name="title" placeholder="请输入链接标题"/>
|
||||||
@ -237,18 +237,18 @@ export default class JoeAction {
|
|||||||
<input autocomplete="off" name="url" placeholder="请输入链接地址"/>
|
<input autocomplete="off" name="url" placeholder="请输入链接地址"/>
|
||||||
</div>
|
</div>
|
||||||
`,
|
`,
|
||||||
confirm: () => {
|
confirm: () => {
|
||||||
const title = $(".cm-modal input[name='title']").val() || 'Test';
|
const title = $(".cm-modal input[name='title']").val() || 'Test';
|
||||||
const url = $(".cm-modal input[name='url']").val() || 'http://';
|
const url = $(".cm-modal input[name='url']").val() || 'http://';
|
||||||
this._replaceSelection(cm, ` [${title}](${url}) `);
|
this._replaceSelection(cm, ` [${title}](${url}) `);
|
||||||
cm.focus();
|
cm.focus();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
handleImage(cm) {
|
handleImage(cm) {
|
||||||
this._openModal({
|
this._openModal({
|
||||||
title: '插入图片',
|
title: '插入图片',
|
||||||
innerHtml: `
|
innerHtml: `
|
||||||
<div class="fitem">
|
<div class="fitem">
|
||||||
<label>图片名称</label>
|
<label>图片名称</label>
|
||||||
<input autocomplete="off" name="title" placeholder="请输入图片名称"/>
|
<input autocomplete="off" name="title" placeholder="请输入图片名称"/>
|
||||||
@ -258,18 +258,18 @@ export default class JoeAction {
|
|||||||
<input autocomplete="off" name="url" placeholder="请输入图片地址"/>
|
<input autocomplete="off" name="url" placeholder="请输入图片地址"/>
|
||||||
</div>
|
</div>
|
||||||
`,
|
`,
|
||||||
confirm: () => {
|
confirm: () => {
|
||||||
const title = $(".cm-modal input[name='title']").val() || 'Test';
|
const title = $(".cm-modal input[name='title']").val() || 'Test';
|
||||||
const url = $(".cm-modal input[name='url']").val() || 'http://';
|
const url = $(".cm-modal input[name='url']").val() || 'http://';
|
||||||
this._replaceSelection(cm, `  `);
|
this._replaceSelection(cm, `  `);
|
||||||
cm.focus();
|
cm.focus();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
handleTable(cm) {
|
handleTable(cm) {
|
||||||
this._openModal({
|
this._openModal({
|
||||||
title: '插入表格',
|
title: '插入表格',
|
||||||
innerHtml: `
|
innerHtml: `
|
||||||
<div class="fitem">
|
<div class="fitem">
|
||||||
<label>表格行</label>
|
<label>表格行</label>
|
||||||
<input style="width: 50px; flex: none; margin-right: 10px;" value="3" autocomplete="off" name="row"/>
|
<input style="width: 50px; flex: none; margin-right: 10px;" value="3" autocomplete="off" name="row"/>
|
||||||
@ -277,40 +277,40 @@ export default class JoeAction {
|
|||||||
<input style="width: 50px; flex: none;" value="3" autocomplete="off" name="column"/>
|
<input style="width: 50px; flex: none;" value="3" autocomplete="off" name="column"/>
|
||||||
</div>
|
</div>
|
||||||
`,
|
`,
|
||||||
confirm: () => {
|
confirm: () => {
|
||||||
let row = $(".cm-modal input[name='row']").val();
|
let row = $(".cm-modal input[name='row']").val();
|
||||||
let column = $(".cm-modal input[name='column']").val();
|
let column = $(".cm-modal input[name='column']").val();
|
||||||
if (isNaN(row)) row = 3;
|
if (isNaN(row)) row = 3;
|
||||||
if (isNaN(column)) column = 3;
|
if (isNaN(column)) column = 3;
|
||||||
let rowStr = '';
|
let rowStr = '';
|
||||||
let rangeStr = '';
|
let rangeStr = '';
|
||||||
let columnlStr = '';
|
let columnlStr = '';
|
||||||
for (let i = 0; i < column; i++) {
|
for (let i = 0; i < column; i++) {
|
||||||
rowStr += '| 表头 ';
|
rowStr += '| 表头 ';
|
||||||
rangeStr += '| :--: ';
|
rangeStr += '| :--: ';
|
||||||
}
|
}
|
||||||
for (let i = 0; i < row; i++) {
|
for (let i = 0; i < row; i++) {
|
||||||
for (let j = 0; j < column; j++) columnlStr += '| 表格 ';
|
for (let j = 0; j < column; j++) columnlStr += '| 表格 ';
|
||||||
columnlStr += '|\n';
|
columnlStr += '|\n';
|
||||||
}
|
}
|
||||||
const htmlStr = `${rowStr}|\n${rangeStr}|\n${columnlStr}\n`;
|
const htmlStr = `${rowStr}|\n${rangeStr}|\n${columnlStr}\n`;
|
||||||
if (this._getLineCh(cm)) this._replaceSelection(cm, '\n\n' + htmlStr);
|
if (this._getLineCh(cm)) this._replaceSelection(cm, '\n\n' + htmlStr);
|
||||||
else this._replaceSelection(cm, htmlStr);
|
else this._replaceSelection(cm, htmlStr);
|
||||||
cm.focus();
|
cm.focus();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
handleCodeBlock(cm) {
|
handleCodeBlock(cm) {
|
||||||
const language = 'rss+atom+ssml+mathml+svg+html+markup+css+clike+javascript+abap+abnf+actionscript+ada+agda+al+antlr4+apacheconf+apex+apl+applescript+aql+arduino+arff+asciidoc+aspnet+asm6502+autohotkey+autoit+bash+basic+batch+bbcode+birb+bison+bnf+brainfuck+brightscript+bro+bsl+c+csharp+cpp+cfscript+chaiscript+cil+clojure+cmake+cobol+coffeescript+concurnas+csp+coq+crystal+css-extras+csv+cypher+d+dart+dataweave+dax+dhall+diff+django+dns-zone-file+docker+dot+ebnf+editorconfig+eiffel+ejs+elixir+elm+etlua+erb+erlang+excel-formula+fsharp+factor+false+firestore-security-rules+flow+fortran+ftl+gml+gcode+gdscript+gedcom+gherkin+git+glsl+go+graphql+groovy+haml+handlebars+haskell+haxe+hcl+hlsl+http+hpkp+hsts+ichigojam+icon+icu-message-format+idris+ignore+inform7+ini+io+j+java+javadoc+javadoclike+javastacktrace+jexl+jolie+jq+jsdoc+js-extras+json+json5+jsonp+jsstacktrace+js-templates+julia+keyman+kotlin+kumir+latex+latte+less+lilypond+liquid+lisp+livescript+llvm+log+lolcode+lua+makefile+markdown+markup-templating+matlab+mel+mizar+mongodb+monkey+moonscript+n1ql+n4js+nand2tetris-hdl+naniscript+nasm+neon+nevod+nginx+nim+nix+nsis+objectivec+ocaml+opencl+openqasm+oz+parigp+parser+pascal+pascaligo+psl+pcaxis+peoplecode+perl+php+phpdoc+php-extras+plsql+powerquery+powershell+processing+prolog+promql+properties+protobuf+pug+puppet+pure+purebasic+purescript+python+qsharp+q+qml+qore+r+racket+jsx+tsx+reason+regex+rego+renpy+rest+rip+roboconf+robotframework+ruby+rust+sas+sass+scss+scala+scheme+shell-session+smali+smalltalk+smarty+sml+solidity+solution-file+soy+sparql+splunk-spl+sqf+sql+squirrel+stan+iecst+stylus+swift+t4-templating+t4-cs+t4-vb+tap+tcl+tt2+textile+toml+turtle+twig+typescript+typoscript+unrealscript+uri+v+vala+vbnet+velocity+verilog+vhdl+vim+visual-basic+warpscript+wasm+wiki+xeora+xml-doc+xojo+xquery+yaml+yang+zig';
|
const language = 'rss+atom+ssml+mathml+svg+html+markup+css+clike+javascript+abap+abnf+actionscript+ada+agda+al+antlr4+apacheconf+apex+apl+applescript+aql+arduino+arff+asciidoc+aspnet+asm6502+autohotkey+autoit+bash+basic+batch+bbcode+birb+bison+bnf+brainfuck+brightscript+bro+bsl+c+csharp+cpp+cfscript+chaiscript+cil+clojure+cmake+cobol+coffeescript+concurnas+csp+coq+crystal+css-extras+csv+cypher+d+dart+dataweave+dax+dhall+diff+django+dns-zone-file+docker+dot+ebnf+editorconfig+eiffel+ejs+elixir+elm+etlua+erb+erlang+excel-formula+fsharp+factor+false+firestore-security-rules+flow+fortran+ftl+gml+gcode+gdscript+gedcom+gherkin+git+glsl+go+graphql+groovy+haml+handlebars+haskell+haxe+hcl+hlsl+http+hpkp+hsts+ichigojam+icon+icu-message-format+idris+ignore+inform7+ini+io+j+java+javadoc+javadoclike+javastacktrace+jexl+jolie+jq+jsdoc+js-extras+json+json5+jsonp+jsstacktrace+js-templates+julia+keyman+kotlin+kumir+latex+latte+less+lilypond+liquid+lisp+livescript+llvm+log+lolcode+lua+makefile+markdown+markup-templating+matlab+mel+mizar+mongodb+monkey+moonscript+n1ql+n4js+nand2tetris-hdl+naniscript+nasm+neon+nevod+nginx+nim+nix+nsis+objectivec+ocaml+opencl+openqasm+oz+parigp+parser+pascal+pascaligo+psl+pcaxis+peoplecode+perl+php+phpdoc+php-extras+plsql+powerquery+powershell+processing+prolog+promql+properties+protobuf+pug+puppet+pure+purebasic+purescript+python+qsharp+q+qml+qore+r+racket+jsx+tsx+reason+regex+rego+renpy+rest+rip+roboconf+robotframework+ruby+rust+sas+sass+scss+scala+scheme+shell-session+smali+smalltalk+smarty+sml+solidity+solution-file+soy+sparql+splunk-spl+sqf+sql+squirrel+stan+iecst+stylus+swift+t4-templating+t4-cs+t4-vb+tap+tcl+tt2+textile+toml+turtle+twig+typescript+typoscript+unrealscript+uri+v+vala+vbnet+velocity+verilog+vhdl+vim+visual-basic+warpscript+wasm+wiki+xeora+xml-doc+xojo+xquery+yaml+yang+zig';
|
||||||
const languageArr = language.split('+').sort((a, b) => a.localeCompare(b));
|
const languageArr = language.split('+').sort((a, b) => a.localeCompare(b));
|
||||||
const sessionStorageType = sessionStorage.getItem('selectType') || '';
|
const sessionStorageType = sessionStorage.getItem('selectType') || '';
|
||||||
let htmlStr = '';
|
let htmlStr = '';
|
||||||
languageArr.forEach(item => {
|
languageArr.forEach(item => {
|
||||||
htmlStr += `<option ${sessionStorageType === item ? 'selected' : ''} value="${item}">${item.toUpperCase()}</option>`;
|
htmlStr += `<option ${sessionStorageType === item ? 'selected' : ''} value="${item}">${item.toUpperCase()}</option>`;
|
||||||
});
|
});
|
||||||
this._openModal({
|
this._openModal({
|
||||||
title: '插入代码块',
|
title: '插入代码块',
|
||||||
innerHtml: `
|
innerHtml: `
|
||||||
<div class="fitem">
|
<div class="fitem">
|
||||||
<label>语言类型</label>
|
<label>语言类型</label>
|
||||||
<select name="type">
|
<select name="type">
|
||||||
@ -319,39 +319,39 @@ export default class JoeAction {
|
|||||||
</select>
|
</select>
|
||||||
</div>
|
</div>
|
||||||
`,
|
`,
|
||||||
confirm: () => {
|
confirm: () => {
|
||||||
const type = $(".cm-modal select[name='type']").val();
|
const type = $(".cm-modal select[name='type']").val();
|
||||||
if (!type) return;
|
if (!type) return;
|
||||||
const htmlStr = `\`\`\`${type}\ncode here...\n\`\`\``;
|
const htmlStr = `\`\`\`${type}\ncode here...\n\`\`\``;
|
||||||
if (this._getLineCh(cm)) this._replaceSelection(cm, '\n\n' + htmlStr);
|
if (this._getLineCh(cm)) this._replaceSelection(cm, '\n\n' + htmlStr);
|
||||||
else this._replaceSelection(cm, htmlStr);
|
else this._replaceSelection(cm, htmlStr);
|
||||||
cm.focus();
|
cm.focus();
|
||||||
sessionStorage.setItem('selectType', type);
|
sessionStorage.setItem('selectType', type);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
handleAbout() {
|
handleAbout() {
|
||||||
this._openModal({
|
this._openModal({
|
||||||
title: '关于',
|
title: '关于',
|
||||||
hasFooter: false,
|
hasFooter: false,
|
||||||
innerHtml: `
|
innerHtml: `
|
||||||
<ul>
|
<ul>
|
||||||
<li>短代码功能正在开发中...</li>
|
<li>短代码功能正在开发中...</li>
|
||||||
<li>仅支持网络图片粘贴上传（截图等）</li>
|
<li>仅支持网络图片粘贴上传（截图等）</li>
|
||||||
<li>本编辑器仅供Joe主题使用，未经允许不得移植至其他主题！</li>
|
<li>本编辑器仅供Joe主题使用，未经允许不得移植至其他主题！</li>
|
||||||
</ul>
|
</ul>
|
||||||
`
|
`
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
handleTask(cm, type) {
|
handleTask(cm, type) {
|
||||||
const str = type ? '{x}' : '{ }';
|
const str = type ? '{x}' : '{ }';
|
||||||
this._replaceSelection(cm, ` ${str} `);
|
this._replaceSelection(cm, ` ${str} `);
|
||||||
cm.focus();
|
cm.focus();
|
||||||
}
|
}
|
||||||
handleNetease(cm, type) {
|
handleNetease(cm, type) {
|
||||||
this._openModal({
|
this._openModal({
|
||||||
title: type ? '网易云歌单' : '网抑云单首',
|
title: type ? '网易云歌单' : '网抑云单首',
|
||||||
innerHtml: `
|
innerHtml: `
|
||||||
<div class="fitem">
|
<div class="fitem">
|
||||||
<label>歌${type ? '单' : '曲'} ID</label>
|
<label>歌${type ? '单' : '曲'} ID</label>
|
||||||
<input autocomplete="off" name="id" placeholder="请输入歌${type ? '单' : '曲'}ID"/>
|
<input autocomplete="off" name="id" placeholder="请输入歌${type ? '单' : '曲'}ID"/>
|
||||||
@ -368,118 +368,123 @@ export default class JoeAction {
|
|||||||
</select>
|
</select>
|
||||||
</div>
|
</div>
|
||||||
`,
|
`,
|
||||||
confirm: () => {
|
confirm: () => {
|
||||||
const id = $(".cm-modal input[name='id']").val();
|
const id = $(".cm-modal input[name='id']").val();
|
||||||
const width = $(".cm-modal input[name='width']").val() || '100%';
|
const width = $(".cm-modal input[name='width']").val() || '100%';
|
||||||
const autoplay = $(".cm-modal select[name='autoplay']").val();
|
const autoplay = $(".cm-modal select[name='autoplay']").val();
|
||||||
const str = `\n{${type ? 'music-list' : 'music'} id="${id}" width="${width}" ${autoplay === '1' ? 'autoplay="autoplay"' : ''}/}\n\n`;
|
const str = `\n{${type ? 'music-list' : 'music'} id="${id}" width="${width}" ${autoplay === '1' ? 'autoplay="autoplay"' : ''}/}\n\n`;
|
||||||
if (this._getLineCh(cm)) this._replaceSelection(cm, '\n' + str);
|
if (this._getLineCh(cm)) this._replaceSelection(cm, '\n' + str);
|
||||||
else this._replaceSelection(cm, str);
|
else this._replaceSelection(cm, str);
|
||||||
cm.focus();
|
cm.focus();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
handleBilibili(cm) {
|
handleBilibili(cm) {
|
||||||
this._openModal({
|
this._openModal({
|
||||||
title: 'BiliBili视频',
|
title: 'BiliBili视频',
|
||||||
innerHtml: `
|
innerHtml: `
|
||||||
<div class="fitem">
|
<div class="fitem">
|
||||||
<label>视频Bvid</label>
|
<label>视频Bvid</label>
|
||||||
<input autocomplete="off" name="bvid" placeholder="请输入视频Bvid"/>
|
<input autocomplete="off" name="bvid" placeholder="请输入视频Bvid"/>
|
||||||
</div>
|
</div>
|
||||||
`,
|
`,
|
||||||
confirm: () => {
|
confirm: () => {
|
||||||
const bvid = $(".cm-modal input[name='bvid']").val();
|
const bvid = $(".cm-modal input[name='bvid']").val();
|
||||||
const str = `\n{bilibili bvid="${bvid}"/}\n\n`;
|
const str = `\n{bilibili bvid="${bvid}"/}\n\n`;
|
||||||
if (this._getLineCh(cm)) this._replaceSelection(cm, '\n' + str);
|
if (this._getLineCh(cm)) this._replaceSelection(cm, '\n' + str);
|
||||||
else this._replaceSelection(cm, str);
|
else this._replaceSelection(cm, str);
|
||||||
cm.focus();
|
cm.focus();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
handleDplayer(cm) {
|
handleDplayer(cm) {
|
||||||
this._openModal({
|
this._openModal({
|
||||||
title: 'M3U8/MP4视频',
|
title: 'M3U8/MP4视频',
|
||||||
innerHtml: `
|
innerHtml: `
|
||||||
<div class="fitem">
|
<div class="fitem">
|
||||||
<label>视频地址</label>
|
<label>视频地址</label>
|
||||||
<input autocomplete="off" name="src" placeholder="请输入视频地址"/>
|
<input autocomplete="off" name="src" placeholder="请输入视频地址"/>
|
||||||
</div>
|
</div>
|
||||||
`,
|
`,
|
||||||
confirm: () => {
|
confirm: () => {
|
||||||
const src = $(".cm-modal input[name='src']").val();
|
const src = $(".cm-modal input[name='src']").val();
|
||||||
const str = `\n{dplayer src="${src}"/}\n\n`;
|
const str = `\n{dplayer src="${src}"/}\n\n`;
|
||||||
if (this._getLineCh(cm)) this._replaceSelection(cm, '\n' + str);
|
if (this._getLineCh(cm)) this._replaceSelection(cm, '\n' + str);
|
||||||
else this._replaceSelection(cm, str);
|
else this._replaceSelection(cm, str);
|
||||||
cm.focus();
|
cm.focus();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
handleDraft() {
|
handleDraft() {
|
||||||
$('#btn-save').click();
|
$('#btn-save').click();
|
||||||
}
|
}
|
||||||
handleExpression(cm) {
|
handleExpression(cm) {
|
||||||
$.ajax({
|
$.ajax({
|
||||||
url: window.JoeConfig.expressionAPI,
|
url: window.JoeConfig.expressionAPI,
|
||||||
dataType: 'json',
|
dataType: 'json',
|
||||||
success: res => {
|
success: res => {
|
||||||
let tabbarStr = '';
|
let tabbarStr = '';
|
||||||
let listsStr = '';
|
let listsStr = '';
|
||||||
for (let key in res) {
|
for (let key in res) {
|
||||||
const arr = res[key];
|
const arr = res[key];
|
||||||
tabbarStr += `<div class="tabbar-item ${key === '泡泡' ? 'active' : ''}" data-show="${key}">${key}</div>`;
|
tabbarStr += `<div class="tabbar-item ${key === '泡泡' ? 'active' : ''}" data-show="${key}">${key}</div>`;
|
||||||
listsStr += `<div class="lists ${key === '泡泡' ? 'active' : ''}" data-show="${key}">${arr.map(item => `<div class="lists-item" data-text="${item.data}">${key === '颜文字' ? item.icon : `<img src="${window.JoeConfig.themeURL + item.icon}">`}</div>`).join(' ')}</div>`;
|
listsStr += `<div class="lists ${key === '泡泡' ? 'active' : ''}" data-show="${key}">${arr.map(item => `<div class="lists-item" data-text="${item.data}">${key === '颜文字' ? item.icon : `<img src="${window.JoeConfig.themeURL + item.icon}">`}</div>`).join(' ')}</div>`;
|
||||||
}
|
}
|
||||||
this._openModal({
|
this._openModal({
|
||||||
title: '普通表情',
|
title: '普通表情',
|
||||||
hasFooter: false,
|
hasFooter: false,
|
||||||
innerHtml: `<div class="tabbar">${tabbarStr}</div>${listsStr}`,
|
innerHtml: `<div class="tabbar">${tabbarStr}</div>${listsStr}`,
|
||||||
handler: () => {
|
handler: () => {
|
||||||
$('.cm-modal__wrapper-bodyer .tabbar-item').on('click', function () {
|
$('.cm-modal__wrapper-bodyer .tabbar-item').on('click', function () {
|
||||||
const show = $(this).attr('data-show');
|
const show = $(this).attr('data-show');
|
||||||
$(this).addClass('active').siblings().removeClass('active');
|
$(this).addClass('active').siblings().removeClass('active');
|
||||||
$('.cm-modal__wrapper-bodyer .lists').removeClass('active');
|
$('.cm-modal__wrapper-bodyer .lists').removeClass('active');
|
||||||
$(".cm-modal__wrapper-bodyer .lists[data-show='" + show + "']").addClass('active');
|
$(".cm-modal__wrapper-bodyer .lists[data-show='" + show + "']").addClass('active');
|
||||||
});
|
});
|
||||||
const _this = this;
|
const _this = this;
|
||||||
$('.cm-modal__wrapper-bodyer .lists-item').on('click', function () {
|
$('.cm-modal__wrapper-bodyer .lists-item').on('click', function () {
|
||||||
const text = $(this).attr('data-text');
|
const text = $(this).attr('data-text');
|
||||||
_this._replaceSelection(cm, ` ${text} `);
|
_this._replaceSelection(cm, ` ${text} `);
|
||||||
$('.cm-modal').removeClass('active');
|
$('.cm-modal').removeClass('active');
|
||||||
cm.focus();
|
cm.focus();
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
handleMtitle(cm) {
|
handleMtitle(cm) {
|
||||||
this._openModal({
|
this._openModal({
|
||||||
title: '居中标题',
|
title: '居中标题',
|
||||||
innerHtml: `
|
innerHtml: `
|
||||||
<div class="fitem">
|
<div class="fitem">
|
||||||
<label>标题内容</label>
|
<label>标题内容</label>
|
||||||
<input autocomplete="off" maxlength="10" name="text" placeholder="请输入标题内容（10字以内）"/>
|
<input autocomplete="off" maxlength="10" name="text" placeholder="请输入标题内容（10字以内）"/>
|
||||||
</div>
|
</div>
|
||||||
`,
|
`,
|
||||||
confirm: () => {
|
confirm: () => {
|
||||||
const text = $(".cm-modal input[name='text']").val();
|
const text = $(".cm-modal input[name='text']").val();
|
||||||
const str = `\n{mtitle title="${text}"/}\n\n`;
|
const str = `\n{mtitle title="${text}"/}\n\n`;
|
||||||
if (this._getLineCh(cm)) this._replaceSelection(cm, '\n' + str);
|
if (this._getLineCh(cm)) this._replaceSelection(cm, '\n' + str);
|
||||||
else this._replaceSelection(cm, str);
|
else this._replaceSelection(cm, str);
|
||||||
cm.focus();
|
cm.focus();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
}
|
||||||
|
handleHtml(cm) {
|
||||||
|
const str = `${this._getLineCh(cm) ? '\n' : ''}!!!\n<p align="center">居中</p>\n<p align="right">居右</p>\n<font size="5" color="red">颜色大小</font>\n!!!\n`;
|
||||||
|
this._replaceSelection(cm, str);
|
||||||
|
cm.focus();
|
||||||
|
}
|
||||||
|
handleHide(cm) {
|
||||||
|
const str = `${this._getLineCh(cm) ? '\n' : ''}{hide}\n需要隐藏的内容\n{/hide}\n`;
|
||||||
|
this._replaceSelection(cm, str);
|
||||||
|
cm.focus();
|
||||||
}
|
}
|
||||||
handleHtml(cm) {
|
handleAbtn(cm) {
|
||||||
const str = `${this._getLineCh(cm) ? '\n' : ''}!!!\n<p align="center">居中</p>\n<p align="right">居右</p>\n<font size="5" color="red">颜色大小</font>\n!!!\n`;
|
this._openModal({
|
||||||
this._replaceSelection(cm, str);
|
title: '多彩按钮',
|
||||||
cm.focus();
|
innerHtml: `
|
||||||
}
|
|
||||||
handleAbtn(cm) {
|
|
||||||
this._openModal({
|
|
||||||
title: '多彩按钮',
|
|
||||||
innerHtml: `
|
|
||||||
<div class="fitem">
|
<div class="fitem">
|
||||||
<label>按钮图标</label>
|
<label>按钮图标</label>
|
||||||
<input autocomplete="off" name="icon" placeholder="请输入fa图标，例：fa-download"/>
|
<input autocomplete="off" name="icon" placeholder="请输入fa图标，例：fa-download"/>
|
||||||
@ -505,22 +510,22 @@ export default class JoeAction {
|
|||||||
<input autocomplete="off" name="content" placeholder="请输入按钮内容"/>
|
<input autocomplete="off" name="content" placeholder="请输入按钮内容"/>
|
||||||
</div>
|
</div>
|
||||||
`,
|
`,
|
||||||
confirm: () => {
|
confirm: () => {
|
||||||
const icon = $(".cm-modal input[name='icon']").val();
|
const icon = $(".cm-modal input[name='icon']").val();
|
||||||
const color = $(".cm-modal input[name='color']").val();
|
const color = $(".cm-modal input[name='color']").val();
|
||||||
const href = $(".cm-modal input[name='href']").val();
|
const href = $(".cm-modal input[name='href']").val();
|
||||||
const radius = $(".cm-modal input[name='radius']").val();
|
const radius = $(".cm-modal input[name='radius']").val();
|
||||||
const content = $(".cm-modal input[name='content']").val();
|
const content = $(".cm-modal input[name='content']").val();
|
||||||
const str = ` {abtn icon="${icon}" color="${color}" href="${href}" radius="${radius}" content="${content}"/} `;
|
const str = ` {abtn icon="${icon}" color="${color}" href="${href}" radius="${radius}" content="${content}"/} `;
|
||||||
this._replaceSelection(cm, str);
|
this._replaceSelection(cm, str);
|
||||||
cm.focus();
|
cm.focus();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
handleAnote(cm) {
|
handleAnote(cm) {
|
||||||
this._openModal({
|
this._openModal({
|
||||||
title: '便条按钮',
|
title: '便条按钮',
|
||||||
innerHtml: `
|
innerHtml: `
|
||||||
<div class="fitem">
|
<div class="fitem">
|
||||||
<label>按钮图标</label>
|
<label>按钮图标</label>
|
||||||
<input autocomplete="off" name="icon" placeholder="请输入fa图标，例：fa-download"/>
|
<input autocomplete="off" name="icon" placeholder="请输入fa图标，例：fa-download"/>
|
||||||
@ -548,21 +553,21 @@ export default class JoeAction {
|
|||||||
<input autocomplete="off" name="content" placeholder="请输入按钮内容"/>
|
<input autocomplete="off" name="content" placeholder="请输入按钮内容"/>
|
||||||
</div>
|
</div>
|
||||||
`,
|
`,
|
||||||
confirm: () => {
|
confirm: () => {
|
||||||
const icon = $(".cm-modal input[name='icon']").val();
|
const icon = $(".cm-modal input[name='icon']").val();
|
||||||
const href = $(".cm-modal input[name='href']").val();
|
const href = $(".cm-modal input[name='href']").val();
|
||||||
const type = $(".cm-modal select[name='type']").val();
|
const type = $(".cm-modal select[name='type']").val();
|
||||||
const content = $(".cm-modal input[name='content']").val();
|
const content = $(".cm-modal input[name='content']").val();
|
||||||
const str = ` {anote icon="${icon}" href="${href}" type="${type}" content="${content}"/} `;
|
const str = ` {anote icon="${icon}" href="${href}" type="${type}" content="${content}"/} `;
|
||||||
this._replaceSelection(cm, str);
|
this._replaceSelection(cm, str);
|
||||||
cm.focus();
|
cm.focus();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
handleDotted(cm) {
|
handleDotted(cm) {
|
||||||
this._openModal({
|
this._openModal({
|
||||||
title: '彩色虚线',
|
title: '彩色虚线',
|
||||||
innerHtml: `
|
innerHtml: `
|
||||||
<div class="fitem">
|
<div class="fitem">
|
||||||
<label>开始颜色</label>
|
<label>开始颜色</label>
|
||||||
<input style="width: 44px;padding: 0 2px;flex: none" autocomplete="off" value="#ff6c6c" name="startColor" type="color"/>
|
<input style="width: 44px;padding: 0 2px;flex: none" autocomplete="off" value="#ff6c6c" name="startColor" type="color"/>
|
||||||
@ -572,14 +577,14 @@ export default class JoeAction {
|
|||||||
<input style="width: 44px;padding: 0 2px;flex: none" autocomplete="off" value="#1989fa" name="endColor" type="color"/>
|
<input style="width: 44px;padding: 0 2px;flex: none" autocomplete="off" value="#1989fa" name="endColor" type="color"/>
|
||||||
</div>
|
</div>
|
||||||
`,
|
`,
|
||||||
confirm: () => {
|
confirm: () => {
|
||||||
const startColor = $(".cm-modal input[name='startColor']").val();
|
const startColor = $(".cm-modal input[name='startColor']").val();
|
||||||
const endColor = $(".cm-modal input[name='endColor']").val();
|
const endColor = $(".cm-modal input[name='endColor']").val();
|
||||||
const str = `\n{dotted startColor="${startColor}" endColor="${endColor}"/}\n\n`;
|
const str = `\n{dotted startColor="${startColor}" endColor="${endColor}"/}\n\n`;
|
||||||
if (this._getLineCh(cm)) this._replaceSelection(cm, '\n' + str);
|
if (this._getLineCh(cm)) this._replaceSelection(cm, '\n' + str);
|
||||||
else this._replaceSelection(cm, str);
|
else this._replaceSelection(cm, str);
|
||||||
cm.focus();
|
cm.focus();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -24,6 +24,7 @@ export default function createPreviewHtml(str) {
|
|||||||
str = str.replace(/{abtn([^}]*)\/}/g, '<joe-abtn $1></joe-abtn>');
|
str = str.replace(/{abtn([^}]*)\/}/g, '<joe-abtn $1></joe-abtn>');
|
||||||
str = str.replace(/{anote([^}]*)\/}/g, '<joe-anote $1></joe-anote>');
|
str = str.replace(/{anote([^}]*)\/}/g, '<joe-anote $1></joe-anote>');
|
||||||
str = str.replace(/{dotted([^}]*)\/}/g, '<joe-dotted $1></joe-dotted>');
|
str = str.replace(/{dotted([^}]*)\/}/g, '<joe-dotted $1></joe-dotted>');
|
||||||
|
str = str.replace(/{hide[^}]*}(.*?){\/hide}/g, '<joe-hide></joe-hide>');
|
||||||
|
|
||||||
$('.cm-preview-content').html(str);
|
$('.cm-preview-content').html(str);
|
||||||
$('.cm-preview-content pre code').each((i, el) => Prism.highlightElement(el));
|
$('.cm-preview-content pre code').each((i, el) => Prism.highlightElement(el));
|
||||||
|
|||||||
@ -155,6 +155,11 @@ export default [
|
|||||||
title: '彩色虚线',
|
title: '彩色虚线',
|
||||||
innerHTML: '<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="20" height="20"><path d="M111.09 562.26a42.6 42.6 0 1 1 0-85.19h127.78a42.6 42.6 0 0 1 0 85.19zm340.75-3a42.59 42.59 0 1 1 0-85.18h127.78a42.59 42.59 0 1 1 0 85.18zm340.75 0a42.59 42.59 0 0 1 0-85.18h127.79a42.59 42.59 0 1 1 0 85.18zm0 0"/></svg>'
|
innerHTML: '<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="20" height="20"><path d="M111.09 562.26a42.6 42.6 0 1 1 0-85.19h127.78a42.6 42.6 0 0 1 0 85.19zm340.75-3a42.59 42.59 0 1 1 0-85.18h127.78a42.59 42.59 0 1 1 0 85.18zm340.75 0a42.59 42.59 0 0 1 0-85.18h127.79a42.59 42.59 0 1 1 0 85.18zm0 0"/></svg>'
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
type: 'hide',
|
||||||
|
title: '回复可见',
|
||||||
|
innerHTML: '<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="20" height="20"><path d="M342.016 640.512a483.328 483.328 0 0 1-126.976-63.488l-104.96 102.4a51.2 51.2 0 0 1-71.168-74.24l102.4-96.256a419.328 419.328 0 0 1-84.48-133.12 51.2 51.2 0 1 1 95.744-34.816 278.016 278.016 0 0 0 15.872 32.256 378.88 378.88 0 0 0 55.808 77.312A381.952 381.952 0 0 0 512 563.2a382.464 382.464 0 0 0 286.208-112.64 378.88 378.88 0 0 0 58.368-77.312 278.016 278.016 0 0 0 13.824-32.256 51.2 51.2 0 1 1 95.744 34.816 419.328 419.328 0 0 1-84.48 133.12l102.4 96.256a51.2 51.2 0 0 1-71.168 73.216L807.936 576a460.8 460.8 0 0 1-125.952 62.976l58.368 102.4a51.2 51.2 0 0 1-88.576 51.2l-74.752-130.048A521.728 521.728 0 0 1 512 665.6q-32.256 0-62.976-3.072l-76.8 129.536a51.2 51.2 0 0 1-88.576-51.2z"/></svg>'
|
||||||
|
},
|
||||||
/* --------------------------- 短代码结束 --------------------------- */
|
/* --------------------------- 短代码结束 --------------------------- */
|
||||||
{
|
{
|
||||||
type: 'clean',
|
type: 'clean',
|
||||||
|
|||||||
File diff suppressed because one or more lines are too long
@ -289,6 +289,9 @@ class Joe extends JoeAction {
|
|||||||
case 'dotted':
|
case 'dotted':
|
||||||
super.handleDotted(this.cm);
|
super.handleDotted(this.cm);
|
||||||
break;
|
break;
|
||||||
|
case 'hide':
|
||||||
|
super.handleHide(this.cm);
|
||||||
|
break;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
$('.cm-tools').append(el);
|
$('.cm-tools').append(el);
|
||||||
|
|||||||
@ -1,10 +1,10 @@
|
|||||||
import { nodeResolve } from '@rollup/plugin-node-resolve';
|
import { nodeResolve } from '@rollup/plugin-node-resolve';
|
||||||
import { uglify } from 'rollup-plugin-uglify';
|
import { uglify } from 'rollup-plugin-uglify';
|
||||||
export default {
|
export default {
|
||||||
input: './js/joe.write.js',
|
input: './js/joe.write.js',
|
||||||
output: {
|
output: {
|
||||||
file: './js/joe.write.chunk.js',
|
file: './js/joe.write.chunk.js',
|
||||||
format: 'iife'
|
format: 'iife'
|
||||||
},
|
},
|
||||||
plugins: [nodeResolve(), uglify()]
|
plugins: [nodeResolve(), uglify()]
|
||||||
};
|
};
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user