更新
This commit is contained in:
parent
840b1989b2
commit
fb1d635e4f
1
assets/js/joe.extend.js
Normal file
1
assets/js/joe.extend.js
Normal file
@ -0,0 +1 @@
|
||||
(function(e){e.fn.extend({insertContent:function(t,n){var a=e(this)[0];if(document.selection){this.focus();var s=document.selection.createRange();s.text=t,this.focus(),s.moveStart("character",-i);var c=s.text.length;if(2==arguments.length){var i=a.value.length;s.moveEnd("character",c+n),n<=0?s.moveStart("character",c-2*n-t.length):s.moveStart("character",c-n-t.length),s.select()}}else if(a.selectionStart||"0"==a.selectionStart){var o=a.selectionStart,r=a.selectionEnd,l=a.scrollTop;a.value=a.value.substring(0,o)+t+a.value.substring(r,a.value.length),this.focus(),a.selectionStart=o+t.length,a.selectionEnd=o+t.length,a.scrollTop=l,2==arguments.length&&(a.setSelectionRange(o-n,a.selectionEnd+n),this.focus())}else this.value+=t,this.focus()},selectionRange:function(e,t){var n="",a=this[0];if(void 0===e)n=/input|textarea/i.test(a.tagName)&&/firefox/i.test(navigator.userAgent)?a.value.substring(a.selectionStart,a.selectionEnd):document.selection?document.selection.createRange().text:document.getSelection().toString();else{if(!/input|textarea/.test(a.tagName.toLowerCase()))return!1;if(void 0===t&&(t=e),a.setSelectionRange)a.setSelectionRange(e,t),this.focus();else{var s=a.createTextRange();s.move("character",e),s.moveEnd("character",t-e),s.select()}}return void 0===e?n:this}})})(jQuery);
|
@ -457,7 +457,48 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
/* 初始化表情功能 */
|
||||
{
|
||||
if ($('.joe_owo__contain').length > 0 && $('.joe_owo__target').length > 0) {
|
||||
new JoeOwO();
|
||||
$.ajax({
|
||||
url: 'https://cdn.jsdelivr.net/gh/HaoOuBa/Joe@master/assets/json/joe.owo.json',
|
||||
success(res) {
|
||||
let barStr = '';
|
||||
let scrollStr = '';
|
||||
for (let key in res) {
|
||||
barStr += `<div class="item" data-index="${res[key].index}">${key}</div>`;
|
||||
scrollStr += `
|
||||
<ul class="scroll" data-index="${res[key].index}">
|
||||
${res[key].container.map(_ => `<li class="item" data-text="${_.data}">${_.icon}</li>`).join('')}
|
||||
</ul>
|
||||
`;
|
||||
}
|
||||
$(".joe_owo__contain").html(`
|
||||
<div class="seat">OωO</div>
|
||||
<div class="box">
|
||||
${scrollStr}
|
||||
<div class="bar">${barStr}</div>
|
||||
</div>
|
||||
`)
|
||||
$(document).on('click', function () {
|
||||
$('.joe_owo__contain .box').stop().slideUp('fast');
|
||||
});
|
||||
$('.joe_owo__contain .seat').on('click', function (e) {
|
||||
e.stopPropagation();
|
||||
$(this).siblings('.box').stop().slideToggle('fast')
|
||||
});
|
||||
$('.joe_owo__contain .box .bar .item').on('click', function (e) {
|
||||
e.stopPropagation();
|
||||
$(this).addClass('active').siblings().removeClass('active');
|
||||
const scrollIndx = '.joe_owo__contain .box .scroll[data-index="' + $(this).attr('data-index') + '"]';
|
||||
$(scrollIndx).show().siblings('.scroll').hide();
|
||||
});
|
||||
/* 点击表情,向文本框插入内容 */
|
||||
$('.joe_owo__contain .scroll .item').on('click', function () {
|
||||
const text = $(this).attr('data-text');
|
||||
$('.joe_owo__target').insertContent(text);
|
||||
});
|
||||
/* 默认激活第一个 */
|
||||
$('.joe_owo__contain .box .bar .item').first().click();
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
@ -1 +0,0 @@
|
||||
function _instanceof(t,n){return null!=n&&"undefined"!=typeof Symbol&&n[Symbol.hasInstance]?!!n[Symbol.hasInstance](t):t instanceof n}function _classCallCheck(t,n){if(!_instanceof(t,n))throw new TypeError("Cannot call a class as a function")}function _defineProperties(t,n){for(var e=0;e<n.length;e++){var i=n[e];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}function _createClass(t,n,e){return n&&_defineProperties(t.prototype,n),e&&_defineProperties(t,e),t}var JoeOwO=function(){"use strict";function t(n){var e=this;_classCallCheck(this,t);var i={contain:".joe_owo__contain",target:".joe_owo__target",seat:"OωO",api:"https://cdn.jsdelivr.net/gh/HaoOuBa/Joe@master/assets/json/joe.owo.json"};this.options=Object.assign(i,n),$.ajax({url:this.options.api,type:"get",dataType:"json",success:function(t){return e.initHtml(t)}})}return _createClass(t,[{key:"initHtml",value:function(t){var n="",e="";for(var i in t)n+='<div class="item" data-index="'.concat(t[i].index,'">').concat(i,"</div>"),e+='\n <ul class="scroll" data-index="'.concat(t[i].index,'">\n ').concat(t[i].container.map(function(t){return'<li class="item" data-text="'.concat(t.data,'">').concat(t.icon,"</li>")}).join("")," \n </ul>\n ");$(this.options.contain).html('\n <div class="seat">'.concat(this.options.seat,'</div>\n <div class="box">\n ').concat(e,'\n <div class="bar">').concat(n,"</div>\n </div>\n ")),this.initEvent()}},{key:"initEvent",value:function(){var t=this.options.contain;$(document).on("click",function(){var n=t+" .box";$(n).stop().slideUp("fast")});var n=t+" .seat";$(n).on("click",function(t){t.stopPropagation(),$(this).siblings(".box").stop().slideToggle("fast")});var e=t+" .box .bar .item";$(e).on("click",function(n){n.stopPropagation(),$(this).addClass("active").siblings().removeClass("active");var e=t+' .box .scroll[data-index="'+$(this).attr("data-index")+'"]';$(e).show().siblings(".scroll").hide()});var i=t+" .scroll .item",o=$(this.options.target)[0];$(i).on("click",function(){var t=$(this).attr("data-text"),n=o.selectionEnd,e=o.value;o.value=e.slice(0,n)+t+e.slice(n),o.focus()}),$(e).first().click()}}]),t}();"undefined"!=typeof module&&void 0!==module.exports?module.exports=JoeOwO:window.JoeOwO=JoeOwO;
|
@ -11,7 +11,6 @@ class Editor
|
||||
{
|
||||
echo "<link rel='stylesheet' href='" . Helper::options()->themeUrl . '/typecho/editor/joe.editor.css' . "'>";
|
||||
echo "<script src='" . Helper::options()->themeUrl . '/typecho/editor/joe.extend.js' . "'></script>";
|
||||
echo "<script src='" . Helper::options()->themeUrl . '/typecho/editor/joe.owo.js' . "'></script>";
|
||||
echo "<script src='" . Helper::options()->themeUrl . '/typecho/editor/joe.editor.js' . "'></script>";
|
||||
}
|
||||
}
|
||||
|
@ -66,7 +66,7 @@
|
||||
<script src="https://cdn.jsdelivr.net/gh/HaoOuBa/Joe@master/plugin/sketchpad/joe.sketchpad.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/@fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/gh/HaoOuBa/Joe@master/plugin/qmsg/qmsg.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/gh/HaoOuBa/Joe@master/assets/js/joe.owo.js"></script>
|
||||
<script src="<?php $this->options->themeUrl('assets/js/joe.extend.js'); ?>"></script>
|
||||
<script src="<?php $this->options->themeUrl('assets/js/joe.global.js'); ?>"></script>
|
||||
<!-- 异步加载的JS -->
|
||||
<script async src="https://cdn.jsdelivr.net/gh/HaoOuBa/Joe@master/plugin/smooth/joe.smooth.js"></script>
|
||||
|
@ -1 +1 @@
|
||||
table.typecho-list-table textarea[name='fields[thumb]'],table.typecho-list-table textarea[name='fields[abstract]'],table.typecho-list-table textarea[name='fields[description]'],table.typecho-list-table textarea[name='fields[video]']{width:100%;height:80px}table.typecho-list-table input[name='fields[keywords]']{width:100%}#wmd-button-row{height:auto}#wmd-button-row .wmd-button .icon{width:20px;height:20px;vertical-align:middle;fill:#9b9b9b}.joe_owo__contain{position:relative}.joe_owo__contain *{box-sizing:border-box}.joe_owo__contain .seat{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer}.joe_owo__contain .box{position:absolute;left:0;width:300px;background:#fff;box-shadow:0px 0px 20px -5px rgba(158,158,158,0.22);border-radius:4px;overflow:hidden;visibility:hidden;-webkit-transform:scale(0.5);transform:scale(0.5);opacity:0;transition:visibility, 0.35s, opacity 0.35s, -webkit-transform 0.35s;transition:visibility, 0.35s, opacity 0.35s, transform 0.35s;transition:visibility, 0.35s, opacity 0.35s, transform 0.35s, -webkit-transform 0.35s}.joe_owo__contain .box.show{visibility:visible;-webkit-transform:scale(1);transform:scale(1);opacity:1}.joe_owo__contain .box .scroll{display:none;max-height:200px;overflow-y:auto;-ms-scroll-chaining:none;overscroll-behavior:none;padding:5px}.joe_owo__contain .box .scroll::-webkit-scrollbar{width:8px;height:8px}.joe_owo__contain .box .scroll::-webkit-scrollbar-thumb{border-radius:4px;background:#c0c4cc}.joe_owo__contain .box .scroll::-webkit-scrollbar-track{background:transparent}.joe_owo__contain .box .scroll:nth-child(3) .item{text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:50%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.joe_owo__contain .box .scroll .item{width:20%;display:inline-block;padding:5px;cursor:pointer;border-radius:4px;transition:background 0.25s;margin:0}.joe_owo__contain .box .scroll .item img{max-width:100%;max-height:100%}.joe_owo__contain .box .scroll .item:hover{background:#f2f6fc}.joe_owo__contain .box .bar{display:flex;align-items:center;border-top:1px solid #f2f6fc}.joe_owo__contain .box .bar .item{line-height:30px;padding:0 10px;cursor:pointer;color:var(--routine);transition:background 0.25s}.joe_owo__contain .box .bar .item.active{background:#f2f6fc}
|
||||
table.typecho-list-table textarea[name='fields[thumb]'],table.typecho-list-table textarea[name='fields[abstract]'],table.typecho-list-table textarea[name='fields[description]'],table.typecho-list-table textarea[name='fields[video]']{width:100%;height:80px}table.typecho-list-table input[name='fields[keywords]']{width:100%}#wmd-button-row{height:auto}#wmd-button-row .wmd-button .icon{width:20px;height:20px;vertical-align:middle;fill:#9b9b9b}.joe_owo__contain{position:relative}.joe_owo__contain *{box-sizing:border-box}.joe_owo__contain .seat{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer}.joe_owo__contain .box{position:absolute;top:30px;left:0;width:300px;background:#fff;box-shadow:0px 0px 20px -5px rgba(158,158,158,0.22);border-radius:4px;overflow:hidden;visibility:hidden;-webkit-transform:scale(0.5);transform:scale(0.5);opacity:0;transition:visibility, 0.35s, opacity 0.35s, -webkit-transform 0.35s;transition:visibility, 0.35s, opacity 0.35s, transform 0.35s;transition:visibility, 0.35s, opacity 0.35s, transform 0.35s, -webkit-transform 0.35s}.joe_owo__contain .box.show{visibility:visible;-webkit-transform:scale(1);transform:scale(1);opacity:1}.joe_owo__contain .box .scroll{display:none;max-height:200px;overflow-y:auto;-ms-scroll-chaining:none;overscroll-behavior:none;padding:5px}.joe_owo__contain .box .scroll::-webkit-scrollbar{width:8px;height:8px}.joe_owo__contain .box .scroll::-webkit-scrollbar-thumb{border-radius:4px;background:#c0c4cc}.joe_owo__contain .box .scroll::-webkit-scrollbar-track{background:transparent}.joe_owo__contain .box .scroll:nth-child(3) .item{text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:50%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.joe_owo__contain .box .scroll .item{width:20%;display:inline-block;padding:5px;cursor:pointer;border-radius:4px;transition:background 0.25s;margin:0}.joe_owo__contain .box .scroll .item img{max-width:100%;max-height:100%}.joe_owo__contain .box .scroll .item:hover{background:#f2f6fc}.joe_owo__contain .box .bar{display:flex;align-items:center;border-top:1px solid #f2f6fc}.joe_owo__contain .box .bar .item{line-height:30px;padding:0 10px;cursor:pointer;color:var(--routine);transition:background 0.25s}.joe_owo__contain .box .bar .item.active{background:#f2f6fc}
|
||||
|
@ -164,13 +164,50 @@ $(function () {
|
||||
item.on('mousedown', () => $('#text').insertContent(getInsertTextById(_.id)));
|
||||
$('#wmd-button-row').append(item);
|
||||
});
|
||||
|
||||
$('#wmd-button-row').append(`
|
||||
<li class="wmd-button joe_owo__contain" title="插入表情"></li>
|
||||
`);
|
||||
|
||||
new JoeOwO({
|
||||
target: '#text',
|
||||
seat: '<svg class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 160c194.4 0 352 157.6 352 352s-157.6 352-352 352S160 706.4 160 512 317.6 160 512 160z m0 64a288 288 0 1 0 0 576 288 288 0 0 0 0-576z m122.08 326.624l61.024 19.264a191.488 191.488 0 0 1-28.736 56.288A191.744 191.744 0 0 1 512 704a191.744 191.744 0 0 1-179.648-124.096l-3.456-10.016 61.024-19.264c4.256 13.44 10.72 26.112 19.136 37.44A127.744 127.744 0 0 0 512 640a127.744 127.744 0 0 0 119.264-81.408l2.816-8zM400 352a48 48 0 1 1 0 96 48 48 0 0 1 0-96z m224 0a48 48 0 1 1 0 96 48 48 0 0 1 0-96z" p-id="2401" fill="#9b9b9b"></path></svg>'
|
||||
$.ajax({
|
||||
url: 'https://cdn.jsdelivr.net/gh/HaoOuBa/Joe@master/assets/json/joe.owo.json',
|
||||
success(res) {
|
||||
let barStr = '';
|
||||
let scrollStr = '';
|
||||
for (let key in res) {
|
||||
barStr += `<div class="item" data-index="${res[key].index}">${key}</div>`;
|
||||
scrollStr += `
|
||||
<ul class="scroll" data-index="${res[key].index}">
|
||||
${res[key].container.map(_ => `<li class="item" data-text="${_.data}">${_.icon}</li>`).join('')}
|
||||
</ul>
|
||||
`;
|
||||
}
|
||||
$('#wmd-button-row').append(`
|
||||
<li class="wmd-button joe_owo__contain" title="插入表情">
|
||||
<div class="seat">
|
||||
<svg class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 160c194.4 0 352 157.6 352 352s-157.6 352-352 352S160 706.4 160 512 317.6 160 512 160z m0 64a288 288 0 1 0 0 576 288 288 0 0 0 0-576z m122.08 326.624l61.024 19.264a191.488 191.488 0 0 1-28.736 56.288A191.744 191.744 0 0 1 512 704a191.744 191.744 0 0 1-179.648-124.096l-3.456-10.016 61.024-19.264c4.256 13.44 10.72 26.112 19.136 37.44A127.744 127.744 0 0 0 512 640a127.744 127.744 0 0 0 119.264-81.408l2.816-8zM400 352a48 48 0 1 1 0 96 48 48 0 0 1 0-96z m224 0a48 48 0 1 1 0 96 48 48 0 0 1 0-96z" p-id="2401" fill="#9b9b9b"></path></svg>
|
||||
</div>
|
||||
<div class="box">
|
||||
${scrollStr}
|
||||
<div class="bar">${barStr}</div>
|
||||
</div>
|
||||
</li>
|
||||
`);
|
||||
$(document).on('click', function () {
|
||||
$('.joe_owo__contain .box').removeClass('show');
|
||||
});
|
||||
$('.joe_owo__contain .seat').on('click', function (e) {
|
||||
e.stopPropagation();
|
||||
$(this).siblings('.box').toggleClass('show');
|
||||
});
|
||||
$('.joe_owo__contain .box .bar .item').on('click', function (e) {
|
||||
e.stopPropagation();
|
||||
$(this).addClass('active').siblings().removeClass('active');
|
||||
const scrollIndx = '.joe_owo__contain .box .scroll[data-index="' + $(this).attr('data-index') + '"]';
|
||||
$(scrollIndx).show().siblings('.scroll').hide();
|
||||
});
|
||||
/* 点击表情,向文本框插入内容 */
|
||||
$('.joe_owo__contain .scroll .item').on('click', function () {
|
||||
const text = $(this).attr('data-text');
|
||||
$('#text').insertContent(text);
|
||||
});
|
||||
/* 默认激活第一个 */
|
||||
$('.joe_owo__contain .box .bar .item').first().click();
|
||||
}
|
||||
});
|
||||
});
|
||||
|
@ -34,6 +34,7 @@ table.typecho-list-table {
|
||||
}
|
||||
.box {
|
||||
position: absolute;
|
||||
top: 30px;
|
||||
left: 0;
|
||||
width: 300px;
|
||||
background: #fff;
|
||||
|
@ -1,127 +0,0 @@
|
||||
function _instanceof(left, right) {
|
||||
if (right != null && typeof Symbol !== 'undefined' && right[Symbol.hasInstance]) {
|
||||
return !!right[Symbol.hasInstance](left);
|
||||
} else {
|
||||
return left instanceof right;
|
||||
}
|
||||
}
|
||||
|
||||
function _classCallCheck(instance, Constructor) {
|
||||
if (!_instanceof(instance, Constructor)) {
|
||||
throw new TypeError('Cannot call a class as a function');
|
||||
}
|
||||
}
|
||||
|
||||
function _defineProperties(target, props) {
|
||||
for (var i = 0; i < props.length; i++) {
|
||||
var descriptor = props[i];
|
||||
descriptor.enumerable = descriptor.enumerable || false;
|
||||
descriptor.configurable = true;
|
||||
if ('value' in descriptor) descriptor.writable = true;
|
||||
Object.defineProperty(target, descriptor.key, descriptor);
|
||||
}
|
||||
}
|
||||
|
||||
function _createClass(Constructor, protoProps, staticProps) {
|
||||
if (protoProps) _defineProperties(Constructor.prototype, protoProps);
|
||||
if (staticProps) _defineProperties(Constructor, staticProps);
|
||||
return Constructor;
|
||||
}
|
||||
|
||||
var JoeOwO = /*#__PURE__*/ (function () {
|
||||
'use strict';
|
||||
|
||||
function JoeOwO(options) {
|
||||
var _this = this;
|
||||
|
||||
_classCallCheck(this, JoeOwO);
|
||||
|
||||
var defaultOption = {
|
||||
contain: '.joe_owo__contain',
|
||||
target: '.joe_owo__target',
|
||||
seat: 'OωO',
|
||||
api: 'https://cdn.jsdelivr.net/gh/HaoOuBa/Joe@master/assets/json/joe.owo.json'
|
||||
};
|
||||
this.options = Object.assign(defaultOption, options);
|
||||
$.ajax({
|
||||
url: this.options.api,
|
||||
type: 'get',
|
||||
dataType: 'json',
|
||||
success: function success(res) {
|
||||
return _this.initHtml(res);
|
||||
}
|
||||
});
|
||||
}
|
||||
/* 初始化 */
|
||||
|
||||
_createClass(JoeOwO, [
|
||||
{
|
||||
key: 'initHtml',
|
||||
value: function initHtml(res) {
|
||||
var barStr = '';
|
||||
var scrollStr = '';
|
||||
|
||||
for (var key in res) {
|
||||
barStr += '<div class="item" data-index="'.concat(res[key].index, '">').concat(key, '</div>');
|
||||
scrollStr += '\n <ul class="scroll" data-index="'.concat(res[key].index, '">\n ').concat(
|
||||
res[key].container
|
||||
.map(function (_) {
|
||||
return '<li class="item" data-text="'.concat(_.data, '">').concat(_.icon, '</li>');
|
||||
})
|
||||
.join(''),
|
||||
' \n </ul>\n '
|
||||
);
|
||||
}
|
||||
|
||||
$(this.options.contain).html('\n <div class="seat">'.concat(this.options.seat, '</div>\n <div class="box">\n ').concat(scrollStr, '\n <div class="bar">').concat(barStr, '</div>\n </div>\n '));
|
||||
this.initEvent();
|
||||
}
|
||||
},
|
||||
{
|
||||
key: 'initEvent',
|
||||
value: function initEvent() {
|
||||
/* 容器 */
|
||||
var contain = this.options.contain;
|
||||
var height = $(contain).height();
|
||||
/* 点击页面关闭 */
|
||||
|
||||
$(document).on('click', function () {
|
||||
$(contain + ' .box').removeClass('show');
|
||||
});
|
||||
/* 点击占位符,显示表情弹窗 */
|
||||
|
||||
var seat = contain + ' .seat';
|
||||
$(seat).on('click', function (e) {
|
||||
e.stopPropagation();
|
||||
$(this).siblings('.box').css('top', height).toggleClass('show');
|
||||
});
|
||||
/* 点击tab栏,切换表情类型 */
|
||||
|
||||
var barItem = contain + ' .box .bar .item';
|
||||
$(barItem).on('click', function (e) {
|
||||
e.stopPropagation();
|
||||
$(this).addClass('active').siblings().removeClass('active');
|
||||
var scrollIndx = contain + ' .box .scroll[data-index="' + $(this).attr('data-index') + '"]';
|
||||
$(scrollIndx).show().siblings('.scroll').hide();
|
||||
});
|
||||
/* 点击表情,向文本框插入内容 */
|
||||
|
||||
var items = contain + ' .scroll .item';
|
||||
var textarea = $(this.options.target);
|
||||
$(items).on('click', function () {
|
||||
textarea.insertContent($(this).attr('data-text'));
|
||||
});
|
||||
/* 默认激活第一个 */
|
||||
$(barItem).first().click();
|
||||
}
|
||||
}
|
||||
]);
|
||||
|
||||
return JoeOwO;
|
||||
})();
|
||||
|
||||
if (typeof module !== 'undefined' && typeof module.exports !== 'undefined') {
|
||||
module.exports = JoeOwO;
|
||||
} else {
|
||||
window.JoeOwO = JoeOwO;
|
||||
}
|
Loading…
Reference in New Issue
Block a user