diff --git a/static/js/lib/biz/MyBiz.js b/static/js/lib/biz/MyBiz.js
index b2debbb..e5ec0fe 100644
--- a/static/js/lib/biz/MyBiz.js
+++ b/static/js/lib/biz/MyBiz.js
@@ -23,7 +23,7 @@ export class MyBiz {
newParagraph.setAttribute("id", uuid)
newParagraph.setAttribute("data-order", curOrder)
newParagraph.onkeydown = window.myEdit.eventListener.KeydownListener
- newParagraph.innerHTML = "
"
+ // newParagraph.innerHTML = "
"
//添加一行
window.myEdit.utils.AddNewParagraph(newParagraph);
}
@@ -247,46 +247,58 @@ export class MyBiz {
let curP = window.myEdit.utils.GetEventTarget(event);
let myDocItem = new MyDocItem(curP);
let inputLength = curP.innerText.length
+ console.log("emptyKeyWorkHandler :", curP, " _'", curP.innerHTML, "'_'", curP.innerText, "'_",
+ "\neq00", curP.innerHTML.startsWith(" # "),
+ "\neq01", curP.innerHTML.startsWith(" # "),
+ "\neq1", curP.innerText.startsWith("# "),
+ "\neq2", curP.innerText.startsWith("#"),
+ "\neq3", curP.innerHTML.startsWith("# "),
+ "\neq4", curP.innerHTML.startsWith("# "))
/**
* h1 ~ h6
*/
- if (curP.innerText.startsWith("#") && curP.innerHTML.endsWith(" ")) {
+ if (curP.innerText.startsWith("#")) {
let curNo = myDocItem.parseOrder();
let mapNode = window.myEdit.ctx.MyDocMap.get(curNo);
-
- // console.log(curP, " - ", curP.innerHTML, curP.innerHTML.startsWith("# "))
- if (curP.innerHTML.startsWith("# ") || curP.innerHTML.startsWith("# ")) {
- mapNode.getStyle().setNodeType("h1")
- this.becomeAnotherElement(curP, "h1", onkeydownHandle)
- } else if (curP.innerHTML.startsWith("## ")) {
- mapNode.getStyle().setNodeType("h2")
- this.becomeAnotherElement(curP, "h2", onkeydownHandle)
- } else if (curP.innerHTML.startsWith("### ")) {
- mapNode.getStyle().setNodeType("h3")
- this.becomeAnotherElement(curP, "h3", onkeydownHandle)
- } else if (curP.innerHTML.startsWith("#### ")) {
- mapNode.getStyle().setNodeType("h4")
- this.becomeAnotherElement(curP, "h4", onkeydownHandle)
- } else if (curP.innerHTML.startsWith("##### ")) {
- mapNode.getStyle().setNodeType("h5")
- this.becomeAnotherElement(curP, "h5", onkeydownHandle)
- } else {
+ if (curP.innerHTML.startsWith("######")) {
mapNode.getStyle().setNodeType("h6")
- this.becomeAnotherElement(curP, "h6", onkeydownHandle)
+ curP.innerHTML=curP.innerHTML.replace("######","")
+ this.becomeAnotherElement(curP, "h6")
+ } else if (curP.innerHTML.startsWith("#####")) {
+ mapNode.getStyle().setNodeType("h5")
+ curP.innerHTML=curP.innerHTML.replace("#####","")
+ this.becomeAnotherElement(curP, "h5")
+ } else if (curP.innerHTML.startsWith("####")) {
+ mapNode.getStyle().setNodeType("h4")
+ curP.innerHTML=curP.innerHTML.replace("####","")
+ this.becomeAnotherElement(curP, "h4")
+ } else if (curP.innerHTML.startsWith("###")) {
+ mapNode.getStyle().setNodeType("h3")
+ curP.innerHTML=curP.innerHTML.replace("###","")
+ this.becomeAnotherElement(curP, "h3")
+ } else if (curP.innerHTML.startsWith("##")) {
+ mapNode.getStyle().setNodeType("h2")
+ curP.innerHTML=curP.innerHTML.replace("##","")
+ this.becomeAnotherElement(curP, "h2")
+ } else {
+ mapNode.getStyle().setNodeType("h1")
+ curP.innerHTML=curP.innerHTML.replace("#","")
+ this.becomeAnotherElement(curP, "h1")
}
}
/**
* 无序列表效果
*/
- if (inputLength === 2 && curP.innerText.startsWith("-") && curP.innerHTML.endsWith(" ")) {
+ if (curP.innerText.startsWith("-")) {
let curNo = myDocItem.parseOrder();
let mapNode = window.myEdit.ctx.MyDocMap.get(curNo);
mapNode.getStyle().setPreStyle("ul", true)
//clean
- curP.innerHTML = ""
- mapNode.setSource("")
+ let historyContent = curP.innerHTML.replace("-", "");
+ curP.innerHTML = historyContent
+ mapNode.setSource(curP.innerText)
//根据上一层级元素动态选择 todo
curP.setAttribute("style", "padding-left: 1rem;")
@@ -297,12 +309,6 @@ export class MyBiz {
newParagraph.innerHTML = "∙ "
curP.append(newParagraph)
- //添加一个选区
- var selObj = window.myEdit.utils.GetSelection();
- var rangeObj = document.createRange()
- rangeObj.selectNode(curP)
- selObj.addRange(rangeObj)
-
//收起选区到一个点，光标落在一个可编辑元素上
window.myEdit.utils.GetSelection().collapse(curP, true)
}
@@ -310,7 +316,8 @@ export class MyBiz {
/**
* 有序列表效果
*/
- if (inputLength > 2 && inputLength <= 5 && isNum(curP.innerText.substring(0, inputLength - 2)) && curP.innerHTML.endsWith(". ")) {
+ let preContent = curP.innerText.split(" ")[0]
+ if (window.myEdit.utils.IsNum(preContent)) {
let num = curP.innerText.substring(0, inputLength - 2)
console.log(curP.innerText, num)
@@ -319,8 +326,9 @@ export class MyBiz {
mapNode.getStyle().setPreStyle("ol", num)
//clean
- curP.innerHTML = ""
- mapNode.setSource("")
+ let historyContent = curP.innerHTML.replace("-", "");
+ curP.innerHTML = historyContent
+ mapNode.setSource(curP.innerText)
//todo
curP.setAttribute("style", "padding-left: 1rem;")
//新增元素
@@ -340,29 +348,30 @@ export class MyBiz {
* 变成另一个元素
* @param {*} elementName
*/
- becomeAnotherElement(elementName) {
+ becomeAnotherElement(curP, elementName) {
let newParagraph = document.createElement(elementName)
newParagraph.setAttribute("contenteditable", "true")
- newParagraph.setAttribute("data-id", this.self.getAttribute("data-id"))
- newParagraph.setAttribute("id", this.self.getAttribute("data-id"))
- newParagraph.setAttribute("data-order", this.self.getAttribute("data-order"))
- newParagraph.onkeydown = onkeydownHandle
+ newParagraph.setAttribute("data-id", curP.getAttribute("data-id"))
+ newParagraph.setAttribute("id", curP.getAttribute("data-id"))
+ newParagraph.setAttribute("data-order", curP.getAttribute("data-order"))
+ newParagraph.onkeydown = window.myEdit.eventListener.KeydownListener
//todo 支持 有数据的行 在行首输入 #
// if()
// switch (elementName){
// case "h1":
// }
- newParagraph.innerHTML = "
"
+ newParagraph.innerHTML = curP.innerHTML
- window.myEdit.utils.InsertAfter(newParagraph, this.self)
- this.self.remove();
- this.self = newParagraph;
+ window.myEdit.utils.InsertAfter(curP, newParagraph)
+ curP.remove();
+ curP = newParagraph;
//matData
- let curNo = parseOrder(this.self)
- let mapNode = utils.MyDocMap.get(curNo)
- mapNode.setSource("")
+ let myP = new MyDocItem(curP);
+ let curNo = myP.parseOrder();
+ let mapNode = window.myEdit.ctx.getMapItem(curNo)
+ mapNode.setSource(curP.innerText)
//收起选区到一个点，光标落在一个可编辑元素上
window.myEdit.utils.GetSelection().setPosition(newParagraph, 0)
@@ -377,8 +386,9 @@ export class MyBiz {
let curS = window.myEdit.utils.GetSelection();
let curP = window.myEdit.utils.GetEventTarget(event);
let styleName = curP.getAttribute("data-value");
- if (styleName === undefined) {
- styleName = curP.parentNode.getAttribute("data-value");
+ if (styleName === undefined || styleName === null) {
+ styleName = curP.closest("span").getAttribute("data-value");
+ console.log("closest: ", curP, curP.closest("span"))
}
let className = this.parseStyleName2ClassName(styleName)
//todo 只对 nodeType = p 执行
diff --git a/static/js/lib/event/MyEventListener.js b/static/js/lib/event/MyEventListener.js
index 3aafbe5..798f791 100644
--- a/static/js/lib/event/MyEventListener.js
+++ b/static/js/lib/event/MyEventListener.js
@@ -6,6 +6,11 @@
export class MyEventListener {
constructor(styleClass) {
+ //这里监听鼠标按下事件
+ document.getElementById("_style_utils").addEventListener("mousedown", function (e) {
+ const event = window.myEdit.utils.ParseEvent(e);
+ window.myEdit.utils.ProhibitDefaultEvent(event);
+ },true)
//样式事件
let styleList = document.getElementsByClassName(styleClass);
@@ -93,6 +98,7 @@ export class MyEventListener {
*/
InputListener(e) {
const event = window.myEdit.utils.ParseEvent(e);
+ console.log("input : ",event)
window.myEdit.biz.inputHandle(event);
}
@@ -113,6 +119,7 @@ export class MyEventListener {
*/
CompositionendListener(e) {
const event = window.myEdit.utils.ParseEvent(e);
+ console.log("Compositionend : ",event)
window.myEdit.biz.compositionendHandle(event);
}
@@ -132,12 +139,6 @@ export class MyEventListener {
*/
MouseUp(e) {
let styleUtils = document.getElementById("_style_utils");
-
- styleUtils.addEventListener("mousedown", function (e) {
- const event = window.myEdit.utils.ParseEvent(e);
- window.myEdit.utils.ProhibitDefaultEvent(event);
- })
-
if (window.myEdit.utils.GetSelection().isCollapsed) {
styleUtils.style.display = "none";
return
diff --git a/static/js/lib/todolist b/static/js/lib/todolist
new file mode 100644
index 0000000..b17b4e8
--- /dev/null
+++ b/static/js/lib/todolist
@@ -0,0 +1,2 @@
+选择文字 第一次添加样式的时候 丢失选区问题
+
diff --git a/static/yanxuelu.html b/static/yanxuelu.html
index 142aec6..7d58265 100644
--- a/static/yanxuelu.html
+++ b/static/yanxuelu.html
@@ -10,7 +10,7 @@
-
+