This commit is contained in:
杜恒
2021-02-19 18:09:26 +08:00
parent 36c52dfb47
commit f11b7c0afc
8 changed files with 10 additions and 411 deletions

View File

@@ -1,84 +1 @@
class JoeOwO {
constructor(options) {
const defaultOption = {
contain: '.joe_owo__contain',
target: '.joe_owo__target',
seat: 'OωO',
api: '/usr/themes/Joe/assets/json/joe.owo.json'
};
this.options = Object.assign(defaultOption, options);
$.ajax({
url: this.options.api,
type: 'get',
dataType: 'json',
success: res => this.initHtml(res)
});
}
/* 初始化 */
initHtml(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>
`;
}
$(this.options.contain).html(`
<div class="seat">${this.options.seat}</div>
<div class="box">
${scrollStr}
<div class="bar">${barStr}</div>
</div>
`);
this.initEvent();
}
initEvent() {
/* 容器 */
const contain = this.options.contain;
/* 点击页面关闭 */
$(document).on('click', function () {
const box = contain + ' .box';
$(box).stop().slideUp('fast');
});
/* 点击占位符,显示表情弹窗 */
const seat = contain + ' .seat';
$(seat).on('click', function (e) {
e.stopPropagation();
$(this).siblings('.box').stop().slideToggle('fast');
});
/* 点击tab栏切换表情类型 */
const barItem = contain + ' .box .bar .item';
$(barItem).on('click', function (e) {
e.stopPropagation();
$(this).addClass('active').siblings().removeClass('active');
const scrollIndx = contain + ' .box .scroll[data-index="' + $(this).attr('data-index') + '"]';
$(scrollIndx).show().siblings('.scroll').hide();
});
/* 点击表情,向文本框插入内容 */
const items = contain + ' .scroll .item';
const textarea = $(this.options.target)[0];
$(items).on('click', function () {
const text = $(this).attr('data-text');
const cursorPos = textarea.selectionEnd;
const areaValue = textarea.value;
textarea.value = areaValue.slice(0, cursorPos) + text + areaValue.slice(cursorPos);
textarea.focus();
});
/* 默认激活第一个 */
$(barItem).first().click();
}
}
if (typeof module !== 'undefined' && typeof module.exports !== 'undefined') {
module.exports = JoeOwO;
} else {
window.JoeOwO = JoeOwO;
}
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;

1
assets/js/joe.owo.min.js vendored Normal file
View File

@@ -0,0 +1 @@
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;