让拖动图标时不能放置到另一个图标内

This commit is contained in:
枫谷剑仙 2025-05-13 02:37:08 +08:00
parent 5a2e6dad91
commit 47a58ef67b
4 changed files with 31 additions and 17 deletions

View File

@ -1247,10 +1247,10 @@ function cardN(id) {
const monOuterDom = document.createElement("span");
monOuterDom.className = "detail-mon";
const monDom = createCardA({noBoxCount: true});
monOuterDom.appendChild(monDom);
monOuterDom.monDom = monDom;
monOuterDom.monDom.onclick = cardNClick
monDom.onclick = cardNClick
changeid({ id: id }, monDom);
monOuterDom.monDom = monDom;
monOuterDom.appendChild(monDom);
return monOuterDom;
}
@ -1320,7 +1320,6 @@ function createIndexedIcon(type, index) {
let icon;
if (type == 'card') {//卡片头像
icon = cardN(index);
icon.onclick = richTextCardNClick;
} else {
icon = document.createElement("icon");
switch(type) {

View File

@ -3779,9 +3779,26 @@ function initialize() {
event.preventDefault();
const range = getCaretRange(event); //插入点
if (range) {
let dragIcon = event?.target?.closest('.drag-able-icon');
if (dragIcon) { //如果插入点在另一个图标上,不允许放入,进行特殊处理
//被放置物体内放手时鼠标的位置因为角色头像会被缩小1/2但是X的值是原始大小的位置所以这里要除2
const offsetX = event.offsetX / (dragIcon.classList.contains("detail-mon") ? 2 : 1);
//被放置物体框的宽度
const clientWidth = dragIcon.clientWidth;
//再物体内左右的比例
const posPercentX = offsetX / clientWidth;
//比例小于1/2放到左边大于1/2放到右边
if (posPercentX < 0.5) {
range.setStartBefore(dragIcon);
range.setEndBefore(dragIcon);
} else {
range.setStartAfter(dragIcon);
range.setEndAfter(dragIcon);
}
}
range.insertNode(newIcon);
} else {
event.target.insertAdjacentElement('afterbegin', newIcon);
event.target.insertAdjacentElement('beforeend', newIcon);
}
indexedIconFocusSelf.call(newIcon); //拖拽后选中这里不传event因为不希望这里的ctrl影响到移动或复制

View File

@ -48283,11 +48283,11 @@ const cachesMap = new Map([
],
[
"script-universal_function.js",
"badccac0015ffb68514f04ac8caf6daf"
"89578559749c3ed863cfdd28dc9659a0"
],
[
"script.js",
"059a9d5f7ef859e8475205e260996f66"
"96bc99fdba238684c9c1c10c0f88e2ed"
],
[
"solo.html",
@ -48303,7 +48303,7 @@ const cachesMap = new Map([
],
[
"style.css",
"e3a1984eeff54b563884d64f9d4f8141"
"dc5d1c6286169242de7e3bd8982b7ecc"
],
[
"temp.js",

View File

@ -268,7 +268,7 @@ label[for="siwtch-code-mode"]::after {
margin: calc(-36px * (1 - (32 / 36)) / 2);
}
#rich-text-tools>ul icon {
cursor: pointer;
cursor: grab;
}
#rich-text-tools>ul {
margin-top: 10px;
@ -1826,7 +1826,6 @@ label[for="search-string"] {
.rich-text .detail-mon .monster{
transform: scale(0.5);
margin: calc(-100px * (1 - 0.5) / 2);
pointer-events: none;
}
.custom-addition .detail-mon .monster{
transform: scale(0.35);
@ -1861,17 +1860,16 @@ label[for="search-string"] {
padding: 2px;
font-size: 23px;
}
.rich-text .drag-able-icon {
.rich-text .detail-mon .monster * {
pointer-events: none;
}
.rich-text [draggable="true"] {
cursor: grab;
/* 禁止文本选中 */
user-select: none;
}
.rich-text .drag-able-icon * {
pointer-events: none;
user-select: none;
}
.rich-text .drag-able-icon:active,
.rich-text .drag-able-icon:focus
.rich-text [draggable="true"]:active,
.rich-text [draggable="true"]:focus
{
outline-width: 1px;
outline-offset: 2px;