obgnail
[功能合集]大纲标题拖拽、代码块行号颜色、历史光标前进后退、可同名标题
大纲标题拖拽改变节点内容
规则： 目的标题不能是源标题的子标题，否则会提示。 源标题(及其子标题)会根据拖拽插入目的标题的节点下。
- 测试了以下数据，没什么问题：
一级标题1 一级标题正文1
二级标题1.1 二级标题正文1.1
三级标题1.1.1 三级标题正文1.1.1
一级标题2 一级标题正文2.1
二级标题2.1 二级标题正文2.1
三级标题2.1.1 三级标题2.1.2 三级标题正文2.1.2
代码块内解析函数调用关系
-
规则：===>会变色 ，<===会还原颜色
-
功能背景是：我经常需要记录代码流程，比如函数之间的跳转关系。 其实，Uml的类图应该比较合适描述函数之间关系 所以做了这个功能，相同颜色表示同一个函数的代码，不同颜色表示不同函数的代码。
-
？？有个问题就是：代码块内单击某行会恢复某行原本的代码样式，这个有点烦，不知道怎么解决
-
测试了代码块内容，没什么内容：
const onClick = () => { this.utils.scrollByCid(cid, -1, true); ===>进入scrollByCid static scrollByCid = (cid, height = -1, moveCursor = false, showHiddenElement = true) => { const $target = File.editor.findElemById(cid) ===>进入scroll static scroll = ($target, height = -1, moveCursor = false, showHiddenElement = true) => { if ($target instanceof Element) { <===返回scrollByCid const $target = File.editor.findElemById(cid) this.scroll($target, height, moveCursor, showHiddenElement) } <===返回onClick } else if (icon) { }
历史光标前进后退
光标历史记录，就是cid的历史记录，有点像书签功能，主要是为了方便文内的超链接跳转
可同名标题跳转
由斜杠命令生成H1-H6，解决重命名标题的问题，方便标题改名不会影响文内超链接正常跳转
@wgy981930674
你好，我看了半天，没想到你更新代码了。浪费了不少时间。
关于在 fence_enhance 里注释中的 ？？？
Typora 的代码块是基于 codeMirror 的，因此我们最好通过 File.editor.fences.queue[cid] 来获取 codeMirror 的实例对象，接着调用实例对象的方法实现功能。
比如 let gutterArr = fence.querySelectorAll('.CodeMirror-linenumber') 就可以改成如下代码：
linenumColor = (ev, button) => {
const fence = btn.closest(".md-fences")
const cid = fence.getAttribute("cid")
const cm = File.editor.fences.queue[cid]
const gutterArr = cm.display.view.map(v => v.lineNumber)
}
codemirror 的功能很完善，基本不需要我们手动操作 DOM，都可以通过 cm 自带方法实现，既方便又安全。
比如可以通过 cm.lastLine()+1 即可获取到代码块的总行数。
我不是很了解代码架构，就是第一次可能比较粗糙的写，你更新之后，我再看代码就知道怎么写了，下次估计会写的好一点 我发的压缩包，你用对比软件，beyong compare比较好用对比文件。
你可以试着通过 cm 对象的方法/属性 改造 linenumColor 函数。
比如 cont.split(breakStr) 获取每行内容的实现就比较野，比较 foolproof 的方案应该是调用 cm.getLine(lineNumber-1) (减一是由于从 0 计数)
同时，我感觉这个功能应该加一个 rollback 逻辑。第一次点击添加颜色，第二次点击 rollback 回原始状态。
@wgy981930674
关于历史光标前进后退问题，其实是可以监听 cursorChange 事件的，我们可以在回调函数里存储 cursor 的状态，这样效率更高
const cursorStates = []
$('#write').on("cursorChange", function (ev, t) {
console.log(t.cursor) // t.cursor 是一个 rangy 对象，可以用此纪录光标的位置
cursorStates.push(t)
})
- t.cursor 是一个 rangy 对象，具体使用可以看库的教程，也可以在现有的插件搜索 rangy 关键字，就能知道该怎么使用
- 你可以先学习一下如何操作光标: Selection 对象，Range 对象
简单示例：
见 相关 issue
// 功能：在框选文字的左右两侧添加引号
() => {
const {node, bookmark, range} = this.utils.getRangy();
const ele = File.editor.findElemById(node.cid);
const rangyText = ele.rawText().substring(bookmark.start, bookmark.end);
// 如果rangyText不为空，也就是当选中文本时
if (rangyText !== "") {
const insertText = "“" + rangyText + "”";
File.editor.UserOp.pasteHandler(File.editor, insertText, true, true, true); // 替换
File.editor.undo.addSnap(node.cid, File.editor.undo.UndoManager.SnapFlag.REPLACE); // 添加一个快照，支持ctrl+Z撤回
setTimeout(() => {
const {range, bookmark} = this.utils.getRangy();
bookmark.start -= insertText.length - 1;
bookmark.end -= 1
range.moveToBookmark(bookmark);
range.select();
});
}
}
配置文件custom_plugin.user.toml [cursorHistory] name = "光标历史记录" enable = true hide = false order = 1 maxLimitNum = 100 maxLimitTime = 3600000
第2次提交typora_plugin-master请对比版本1_14_3 本次主要修改了 ：
- 拖拽大纲对块状对象、带格式文本的错误修复
- 历史光标的重做，精确到光标而不是行(块状对象并未精确到行)，已知bug：文本中含有html代码时，光标不准确，跟光标事件提供的偏移数据有关
- 行号变色，增加到15中颜色，超过就不会变色了，可以自己多添加几种即可解决
第2次提交typora_plugin-master请对比版本1_14_3.zip
第3次提交typora_plugin-master请对比版本1_14_3.zip
第三次修改：
- 拖拽大纲：基本都toc.headers来遍历，空行优化了。但是拖拽时候出现禁止图标还是搞不定(你给的代码也试了)
- 历史光标：使用了File.editor.selection.buildUndo()来修正文中的html引起的便宜错误
- 代码块行号变色：修复自动换行上色失败bug
- 可同名标题：使用了his.randomString(); 替代this.getUUID()，因为UUID太长了