125 lines
4.7 KiB
JavaScript
125 lines
4.7 KiB
JavaScript
"use strict";
|
||
/**
|
||
* 使用样式事件
|
||
*/
|
||
define(function (require, exports, module) {
|
||
|
||
function handle(mutationList) {
|
||
for (let mutation of mutationList) {
|
||
|
||
|
||
switch (mutation.type) {
|
||
case "childList":
|
||
addNewP(mutation);
|
||
break;
|
||
case "characterData":
|
||
updateText(mutation);
|
||
break;
|
||
case "attributes":
|
||
//暂时忽略属性变化
|
||
break
|
||
default: {
|
||
other(mutation);
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
function other(mutation) {
|
||
console.log("mutation : ", mutation,
|
||
// 观察的变动类型（attributes、characterData或者childList）。
|
||
"\ntype", mutation.type,
|
||
//发生变动的DOM节点。
|
||
"\ntarget", mutation.target,
|
||
"\ntargetParent", mutation.target.parentElement, mutation.target.parentNode,
|
||
//新增的DOM节点。
|
||
"\naddedNodes", mutation.addedNodes,
|
||
//删除的DOM节点。
|
||
"\nremovedNodes", mutation.removedNodes,
|
||
//前一个同级节点，如果没有则返回null。
|
||
"\npreviousSibling", mutation.previousSibling,
|
||
//下一个同级节点，如果没有则返回null。
|
||
"\nnextSibling", mutation.nextSibling,
|
||
//发生变动的属性。如果设置了attributeFilter，则只返回预先指定的属性。
|
||
"\nattributeName", mutation.attributeName,
|
||
//变动前的值。这个属性只对attribute和characterData变动有效，如果发生childList变动，则返回null。
|
||
"\noldValue", mutation.oldValue);
|
||
}
|
||
|
||
function addNewP(mutation) {
|
||
let target = mutation.target;
|
||
// target.clone()
|
||
if (target.nodeName === "DIV" && mutation.previousSibling !== null) {
|
||
let newParagraph = mutation.previousSibling.nextSibling;
|
||
console.log(
|
||
"addNewP target: ", target,
|
||
"\nnodeType: ", target.nodeType,
|
||
"\nnodeName: ", target.nodeName,
|
||
"\ndata: ", target.value,
|
||
"\n next: ", newParagraph
|
||
)
|
||
|
||
|
||
let utils = require("../../common/utils");
|
||
let ctx = require("../../common/ctx");
|
||
if (ctx.getCurRowNo() === 0) {
|
||
return
|
||
}
|
||
if (newParagraph !== undefined && newParagraph !== null) {
|
||
newParagraph.id = utils.Uuid(ctx.usn, ctx.docType);
|
||
newParagraph.setAttribute("data-order", ctx.incrementNumThenReturn());
|
||
|
||
// let newParagraph = document.getElementById(targetP.id);
|
||
//前置 span
|
||
let preSpan = newParagraph.querySelector("span[data-flag='span_pre']");
|
||
if (preSpan === undefined || preSpan === null) {
|
||
preSpan = document.createElement("span");
|
||
preSpan.setAttribute("contenteditable", "false")
|
||
preSpan.setAttribute("data-flag", "span_pre")
|
||
newParagraph.appendChild(preSpan);
|
||
} else {
|
||
console.log("newParagraph preSpan exist ", newParagraph," ",preSpan)
|
||
}
|
||
|
||
//内置span
|
||
let spanContent = newParagraph.querySelector("span[data-flag='span_content']");
|
||
if (spanContent === undefined || spanContent === null) {
|
||
spanContent = document.createElement("span");
|
||
spanContent.append(document.createElement("br"));
|
||
spanContent.setAttribute("data-flag", "span_content")
|
||
newParagraph.appendChild(spanContent);
|
||
} else {
|
||
console.log("newParagraph preSpan spanContent ", newParagraph)
|
||
}
|
||
|
||
utils.GetSelection().setPosition(spanContent, 0);
|
||
spanContent.focus();
|
||
}
|
||
}
|
||
|
||
}
|
||
|
||
function updateText(mutation) {
|
||
let target = mutation.target;
|
||
if (target.nodeType === 3 && target.nodeName === "#text") {
|
||
// console.log(
|
||
// "target: ", target,
|
||
// "\nnodeType: ", target.nodeType,
|
||
// "\nnodeName: ", target.nodeName,
|
||
// "\ndata: ", target.value,
|
||
// "\nparentNode: ", target.parentNode,
|
||
// "\nparentNode_parentNode: ", target.parentNode.parentNode,
|
||
// )
|
||
|
||
// let curSpan = target.parentNode;
|
||
// let curP = target.parentNode.parentNode;
|
||
|
||
|
||
} else {
|
||
other(mutation);
|
||
}
|
||
}
|
||
|
||
//导出
|
||
exports.handle = handle;
|
||
}); |