Skip to content

Commit

Permalink
🐛 fix #85
Browse files Browse the repository at this point in the history
  • Loading branch information
@Vanessa219
Vanessa219 committed Jan 31, 2020
1 parent cf4e740 commit b14f043
Show file tree
Hide file tree
Showing 4 changed files with 81 additions and 33 deletions.
4 changes: 2 additions & 2 deletions CHANGELOG.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,15 +40,15 @@
* [55](https://github.com/Vanessa219/vditor/issues/55) 链接引用不转换为内联链接 `改进功能`
* [81](https://github.com/Vanessa219/vditor/issues/81) 链接和图片嵌套问题 `修复缺陷`

### v2.1.6 / 2020-01-29
### v2.1.6 / 2020-01-31

* [96](https://github.com/Vanessa219/vditor/issues/96) 所见即所得模式下的任务列表Bug `修复缺陷`
* [95](https://github.com/Vanessa219/vditor/issues/95) setVaule 和 初始化时，不触发 input 事件 `改进功能`
* [93](https://github.com/Vanessa219/vditor/issues/93) Headers with = and - `修复缺陷`
* [92](https://github.com/Vanessa219/vditor/issues/92) 空行回车可以逐层跳出引用 `改进功能`
* [88](https://github.com/Vanessa219/vditor/issues/88) Bold `修复缺陷`
* [87](https://github.com/Vanessa219/vditor/issues/87) inside cell `修复缺陷`
* [85](https://github.com/Vanessa219/vditor/issues/85) after ctrl+z `修复缺陷`
* [85](https://github.com/Vanessa219/vditor/issues/85) ctrl-z & 重写缩进 `修复缺陷`
* [84](https://github.com/Vanessa219/vditor/issues/84) 光标在 emoji 后的空格后无法对其进行删除 `修复缺陷`
* [83](https://github.com/Vanessa219/vditor/issues/83) 所见即所得从菜单插入链接用对话框 `改进功能`
* [82](https://github.com/Vanessa219/vditor/issues/82) 文字拖动 `修复缺陷`
Expand Down
62 changes: 54 additions & 8 deletions src/ts/wysiwyg/highlightToolbar.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ import {
hasTopClosestByTag,
} from "../util/hasClosest";
import {updateHotkeyTip} from "../util/updateHotkeyTip";
import {addP2Li} from "./addP2Li";
import {afterRenderEvent} from "./afterRenderEvent";
import {processCodeRender} from "./processCodeRender";
import {setRangeByWbr} from "./setRangeByWbr";
Expand Down Expand Up @@ -95,7 +96,7 @@ export const highlightToolbar = (vditor: IVditor) => {
// list popover
const topOlElement = hasTopClosestByTag(typeElement, "OL");
const topUlElement = hasTopClosestByTag(typeElement, "UL");
let topListElement = topUlElement;
let topListElement = topUlElement as HTMLElement;
if (topOlElement && (!topUlElement || (topUlElement && topOlElement.contains(topUlElement)))) {
topListElement = topOlElement;
}
Expand All @@ -108,7 +109,42 @@ export const highlightToolbar = (vditor: IVditor) => {
updateHotkeyTip("<⌘-⇧-s>"));
outdent.className = "vditor-icon vditor-tooltipped vditor-tooltipped__n";
outdent.onclick = () => {
document.execCommand("outdent", false);
if (!liElement) {
return;
}
const liParentLiElement = hasClosestByMatchTag(liElement.parentElement, "LI");
if (liParentLiElement) {
vditor.wysiwyg.element.querySelectorAll("wbr").forEach((wbr) => {
wbr.remove();
});
range.insertNode(document.createElement("wbr"));

const liParentElement = liElement.parentElement;
const liParentAfterElement = liParentElement.cloneNode() as HTMLElement;

let isMatch = false;
let afterHTML = "";
liParentElement.querySelectorAll("li").forEach((item) => {
if (isMatch) {
afterHTML += item.outerHTML;
item.remove();
}
if (item.isEqualNode(liElement)) {
isMatch = true;
}
});
liParentAfterElement.innerHTML = afterHTML;

liParentLiElement.insertAdjacentElement("afterend", liElement);
liElement.insertAdjacentElement("beforeend", liParentAfterElement);

addP2Li(topListElement);
topListElement.outerHTML = vditor.lute.SpinVditorDOM(topListElement.outerHTML);

afterRenderEvent(vditor);
setRangeByWbr(vditor.wysiwyg.element, range);
highlightToolbar(vditor);
}
};

const indent = document.createElement("button");
Expand All @@ -118,12 +154,22 @@ export const highlightToolbar = (vditor: IVditor) => {
updateHotkeyTip("<⌘-⇧-e>"));
indent.className = "vditor-icon vditor-tooltipped vditor-tooltipped__n";
indent.onclick = () => {
// const liElement = hasClosestByMatchTag(range.startContainer, "LI");
// // fix 空列表缩进光标会飘逸
// if (liElement && liElement.innerHTML === "") {
// liElement.innerHTML = "\n";
// }
// document.execCommand("indent", false);
if (liElement && liElement.previousElementSibling) {
vditor.wysiwyg.element.querySelectorAll("wbr").forEach((wbr) => {
wbr.remove();
});
range.insertNode(document.createElement("wbr"));
const parentTagName = liElement.parentElement.tagName;
liElement.previousElementSibling.insertAdjacentHTML("beforeend",
`<${parentTagName} data-block="0"><li>${liElement.innerHTML}</li></${parentTagName}>`);
liElement.remove();

addP2Li(topListElement);
topListElement.outerHTML = vditor.lute.SpinVditorDOM(topListElement.outerHTML);
afterRenderEvent(vditor);
setRangeByWbr(vditor.wysiwyg.element, range);
highlightToolbar(vditor);
}
};

vditor.wysiwyg.popover.insertAdjacentElement("beforeend", outdent);
Expand Down
4 changes: 2 additions & 2 deletions src/ts/wysiwyg/input.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -74,9 +74,9 @@ export const input = (event: IHTMLInputEvent, vditor: IVditor, range: Range) =>
vditorHTML = blockElement.innerHTML;
} else {
vditorHTML = blockElement.outerHTML;
let listElement = hasClosestByMatchTag(range.startContainer, "UL");
let listElement = hasClosestByMatchTag(topListElement || range.startContainer, "UL");
if (!listElement) {
listElement = hasClosestByMatchTag(range.startContainer, "OL");
listElement = hasClosestByMatchTag(topListElement || range.startContainer, "OL");
}
if (listElement) {
const listPrevElement = listElement.previousElementSibling;
Expand Down
44 changes: 23 additions & 21 deletions src/ts/wysiwyg/listToggle.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,21 +14,24 @@ export const listToggle = (vditor: IVditor, range: Range, type: string, cancel =
} else {
if (!itemElement) {
// 添加
const blockElement = hasClosestByAttribute(range.startContainer, "data-block", "0");
if (blockElement) {
if (type === "check") {
blockElement.insertAdjacentHTML("beforebegin",
`<ul data-block="0"><li class="vditor-task"><input type="checkbox" /> ${blockElement.innerHTML}</li></ul>`);
blockElement.remove();
} else if (type === "list") {
blockElement.insertAdjacentHTML("beforebegin",
`<ul data-block="0"><li>${blockElement.innerHTML}</li></ul>`);
blockElement.remove();
} else if (type === "ordered-list") {
blockElement.insertAdjacentHTML("beforebegin",
`<ol data-block="0"><li>${blockElement.innerHTML}</li></ol>`);
blockElement.remove();
}
let blockElement = hasClosestByAttribute(range.startContainer, "data-block", "0");
if (!blockElement) {
vditor.wysiwyg.element.querySelector("wbr").remove();
blockElement = vditor.wysiwyg.element.querySelector("p");
blockElement.innerHTML = "<wbr>";
}
if (type === "check") {
blockElement.insertAdjacentHTML("beforebegin",
`<ul data-block="0"><li class="vditor-task"><input type="checkbox" /> ${blockElement.innerHTML}</li></ul>`);
blockElement.remove();
} else if (type === "list") {
blockElement.insertAdjacentHTML("beforebegin",
`<ul data-block="0"><li>${blockElement.innerHTML}</li></ul>`);
blockElement.remove();
} else if (type === "ordered-list") {
blockElement.insertAdjacentHTML("beforebegin",
`<ol data-block="0"><li>${blockElement.innerHTML}</li></ol>`);
blockElement.remove();
}
} else {
// 切换
Expand All @@ -44,10 +47,9 @@ export const listToggle = (vditor: IVditor, range: Range, type: string, cancel =
item.classList.remove("vditor-task");
});
}
let element
let element;
if (type === "list") {
element = document.createElement("ul");

} else {
element = document.createElement("ol");
}
Expand All @@ -61,13 +63,13 @@ export const listToggle = (vditor: IVditor, range: Range, type: string, cancel =

const list2p = (listElement: HTMLElement) => {
let pHTML = "";
listElement.querySelectorAll("li").forEach((item) => {
const inputElement = item.querySelector("input");
for (let i = 0; i < listElement.childElementCount; i++) {
const inputElement = listElement.children[i].querySelector("input");
if (inputElement) {
inputElement.remove();
}
pHTML += `<p data-block="0">${item.innerHTML.trimLeft()}</p>`;
});
pHTML += `<p data-block="0">${listElement.children[i].innerHTML.trimLeft()}</p>`;
}
listElement.insertAdjacentHTML("beforebegin", pHTML);
listElement.remove();
};

0 comments on commit b14f043

Please sign in to comment.