使用情况与管理面板见上图，可以在所见即所得模式正常插入表情包，支持自定义图片大小。

使用面板支持到处拖动，管理面板不行；，表情包的编辑、删除、导入导出功能只能在管理面板使用。

不过目前使用面板的唯一入口在管理面板右上角的“使用表情包”XD，因为盐一直不知道该在哪里放入口XD

导入表情包的格式非常随性，详见https://github.com/Salt-lovely/saltMCBBS/blob/main/doc.md。
有多随性？只在细节上讲格式。点开下面折叠内容看看就知道了：
导出功能会导出格式看起来很像JSON的文本，这是出于兼容性考虑。

仔细看的话你会发现，表情包说明中允许有HTML代码；盐做了防XSS功能，应该可以挡住常见的恶意HTML代码（如<script>）。

盐真是个天才(o゜▽゜)o☆

---

为什么盐要做这个功能呢，，，，因为盐看到了极光的未开源脚本。

没有源码，那就自己琢磨功能ヾ(•ω•`)o。

---

管理面板先不提，主要工程在于使用面板。

显示一个一个表情的部分，盐用了grid布局+padding，使得每个小块都是正方形，且自动适应宽度变化。

同时在小块内部，img外部添加一个div缓冲，用translate制作垂直居中，用伪元素制作表情名字显示。

更换表情包功能则封装成一个方法，调用即可。

整个逻辑中最迷惑的地方莫过于插入表情方法。

首先是得知用户在编辑哪个文本框——document.activeElement

但是，很多情况下无法用document.activeElement获取正确的文本框

，因此我需要去猜（；´д｀）ゞ

如果是编辑框模式，那么只需要检测用户是出于纯文本还是所见即所得模式即可

但是，快速回复栏、点击楼层中的回复按钮出现的回复栏等无法简单获取

我给HTMLElement原型添加了allInViewport方法，判断元素是否整个出现在视野内

在以上所有方法是过一遍之后，没有获取到文本框的话，就检查哪个文本框在用户可视范围内

整个过程花了好几天的晚上爸妈睡觉后可以用于逛B站的时间

啊啊，今天写了100+行代码了，好累啊，休息一下吧(/▽＼)

---

表情包管理功能将在SaltMCBBS 0.1.8实装。你也可以尝试一下最新的预发布版

另外再送一个论坛兔斯基表情包导入文字(oﾟvﾟ)ノ：
碎碎念：年纪大了，开始觉得颜文字不适合自己了

---

* 注：召唤阵是将一大群一脸懵逼的小伙伴直接召唤来的神秘阵法（大雾）

---

还有一件事：

编程大佬，新年快乐

希望盐的插件在新的一年里越做越好～

盐真是个天才(o゜▽゜)o☆(雨月也是个天才(o゜▽゜)o☆
saltMCBBS又迎来一波更新！
鱼月要被煎糊了

大佬佩服佩服，新年快乐

强的一批！支持楼主！