add: selectors table in setting

manifest.json

@@ -1,7 +1,7 @@
 {
  "id": "any-block",
  "name": "Any Block",
- "version": "2.0.1",
+ "version": "2.1.0",
  "minAppVersion": "0.15.0",
  "description": "You can flexibility to create a 'Block' by some means. It also provides some useful features, like `list to table`. ",
  "author": "LincZero",

src/config/ABSettingTab.ts

@@ -1,10 +1,11 @@
 import {App, PluginSettingTab, Setting, Modal} from "obsidian"
 import type AnyBlockPlugin from "../main"
-import {generateInfoTable, registerABProcessorUser, type ABProcessorSpecUser} from "src/replace/abProcessor"
+import {generateProcessorInfoTable, registerABProcessorUser, type ABProcessorSpecUser} from "src/replace/abProcessor"
 import {} from "src/replace/baseProcessor" // 加载所有处理器和选择器
 import {} from "src/replace/listProcessor" // ^
 import {} from "src/replace/decoProcessor" // ^
 import {} from "src/manager/abMdBaseSelector" // ^
+import {generateSelectorInfoTable} from "src/manager/abMdSelector" // ^
 
 /** 设置值接口 */
 export interface ABSettingInterface {
@@ -48,8 +49,9 @@ export const AB_SETTINGS: ABSettingInterface = {
 
 /** 设置值面板 */
 export class ABSettingTab extends PluginSettingTab {
- plugin: AnyBlockPlugin;
+ plugin: AnyBlockPlugin
  processorPanel: HTMLElement
+ selectorPanel: HTMLElement
 
  constructor(app: App, plugin: AnyBlockPlugin) {
  super(app, plugin);
@@ -66,126 +68,9 @@ export class ABSettingTab extends PluginSettingTab {
 
  containerEl.createEl('h2', {text: '范围管理器'});
 
- new Setting(containerEl)
- .setName('列表选择器')
- .setDesc('')
- .addDropdown((component)=>{
- component
- .addOption(ConfSelect.no, "不识别")
- .addOption(ConfSelect.ifhead, "仅识别有头部声明")
- .addOption(ConfSelect.yes, "总是识别")
- .setValue(settings.select_list)
- .onChange(async v=>{
- // @ts-ignore 这里ConfSelect必然包含v值的
- settings.select_list = ConfSelect[v] 
- await this.plugin.saveSettings(); 
- })
- })
+ this.selectorPanel = generateSelectorInfoTable(containerEl)
 
- new Setting(containerEl)
- .setName('引用块选择器')
- .setDesc('')
- .addDropdown((component)=>{
- component
- .addOption(ConfSelect.no, "不识别")
- .addOption(ConfSelect.ifhead, "仅识别有头部声明")
- .addOption(ConfSelect.yes, "总是识别")
- .setValue(settings.select_quote)
- .onChange(async v=>{
- // @ts-ignore 这里ConfSelect必然包含v值的
- settings.select_quote = ConfSelect[v] 
- await this.plugin.saveSettings(); 
- })
- })
-
- new Setting(containerEl)
- .setName('代码块选择器')
- .setDesc('')
- .addDropdown((component)=>{
- component
- .addOption(ConfSelect.no, "不识别")
- .addOption(ConfSelect.ifhead, "仅识别有头部声明")
- .addOption(ConfSelect.yes, "总是识别")
- .setValue(settings.select_code)
- .onChange(async v=>{
- // @ts-ignore 这里ConfSelect必然包含v值的
- settings.select_code = ConfSelect[v] 
- await this.plugin.saveSettings(); 
- })
- })
-
- new Setting(containerEl)
- .setName('标题层级选择器')
- .setDesc(createFragment(el => {
- el.createEl("strong", {
- text: "全局选择器"
- });
- }))
- .addDropdown((component)=>{
- component
- .addOption(ConfSelect.no, "不识别")
- .addOption(ConfSelect.ifhead, "仅识别有头部声明")
- .setValue(settings.select_heading)
- })
-
- new Setting(containerEl)
- .setName('首尾范围选择器')
- .setDesc(createFragment(el => {
- el.createEl("strong", {
- text: "全局选择器"
- });
- }))
- .addDropdown((component)=>{
- component
- .addOption(ConfSelect.no, "不识别")
- .addOption(ConfSelect.yes, "总是识别")
- .setValue(settings.select_brace)
- .onChange(async v=>{
- // @ts-ignore 这里ConfSelect必然包含v值的
- settings.select_brace = ConfSelect[v] 
- await this.plugin.saveSettings(); 
- })
- })
-
- /*new Setting(containerEl)
- .setName('智能选择器')
- .setDesc('用`%:`选择开头，自动指定结尾')
- .addToggle(component=>
- component
- .setValue(this.plugin.settings.is_range_auto)
- .onChange(value=>{this.plugin.settings.is_range_auto = value})
- )
-
- new Setting(containerEl)
- .setName('html标签选择器')
- .setDesc(
- createFragment(e => {
- const div:HTMLDivElement = e.createDiv()
- div.createSpan({text: "用"});
- div.createEl("code", {text: "`<ab>`"});
- div.createSpan({text: "和"});
- div.createEl("code", {text: "`</ab>`"});
- div.createSpan({text: "选择范围"});
- div.createEl("strong", {text: "（功能还没做，暂时无效）"});
- })
- )
- .addToggle(component=>
- component
- .setValue(this.plugin.settings.is_range_html)
- .onChange(value=>{this.plugin.settings.is_range_html = value})
- .setDisabled(true)
- )
-
- new Setting(containerEl)
- .setName('括号标签选择器')
- .setDesc('用`%{`和`%}`选择范围（渲染模式无法工作）')
- .addToggle(component=>
- component
- .setValue(this.plugin.settings.is_range_brace)
- .onChange(value=>{this.plugin.settings.is_range_brace = value})
- )*/
-
- containerEl.createEl('h2', {text: '装饰管理器'});
+ /*containerEl.createEl('h2', {text: '装饰管理器'});
 
  new Setting(containerEl)
  .setName('源码模式中启用')
@@ -232,24 +117,10 @@ export class ABSettingTab extends PluginSettingTab {
  settings.decoration_render = ConfDecoration[v] 
  await this.plugin.saveSettings(); 
  })
- })
-
- containerEl.createEl('h2', {text: '实验性功能'});
- new Setting(containerEl)
- .setName('启用负级列表')
- .setDesc(createFragment(div => {
- div.createSpan({text: "用"});
- div.createEl("code", {text: "< "});
- div.createSpan({text: "来表示负级列表。重复则叠加层级"});
- }))
- .addToggle(component=>
- component
- .setValue(this.plugin.settings.is_neg_level)
- .onChange(value=>{this.plugin.settings.is_neg_level = value})
- )
- .setDisabled(true)
+ })*/
 
  containerEl.createEl('h2', {text: '查看所有注册指令'});
+
  new Setting(containerEl)
  .setName('添加新的注册指令')
  .setDesc('@todo: 添加后要删除或修改请打开data.json文件夹')
@@ -262,11 +133,11 @@ export class ABSettingTab extends PluginSettingTab {
  settings.user_processor.push(result)
  await this.plugin.saveSettings();
  this.processorPanel.remove()
- this.processorPanel = generateInfoTable(containerEl)
+ this.processorPanel = generateProcessorInfoTable(containerEl)
  }).open()
  })
  })
- this.processorPanel = generateInfoTable(containerEl)
+ this.processorPanel = generateProcessorInfoTable(containerEl)
  }
 }
 

src/manager/abMdBaseSelector.ts

@@ -1,7 +1,7 @@
 import {ABReg} from "src/config/abReg"
 import {
  registerMdSelector, 
- type MdSelectorSpec,
+ type MdSelectorSpecSimp,
  type MdSelectorRangeSpecSimp
 } from "./abMdSelector"
 
@@ -72,7 +72,9 @@ function easySelector_headtail(
 /**
  * 首尾选择器
  */
-const mdSelector_headtail:MdSelectorSpec = {
+const mdSelector_headtail:MdSelectorSpecSimp = {
+ id: "headtail",
+ name: "头尾选择器",
  match: ABReg.reg_headtail,
  selector: (list_text, from_line)=>{
  let mdRangeTmp = easySelector_headtail(list_text, from_line, "headtail", ABReg.reg_headtail)
@@ -104,7 +106,9 @@ registerMdSelector(mdSelector_headtail)
 /**
  * 列表选择器
  */
-const mdSelector_list:MdSelectorSpec = {
+const mdSelector_list:MdSelectorSpecSimp = {
+ id: "list",
+ name: "列表选择器",
  match: ABReg.reg_list,
  selector: (list_text, from_line)=>{
  let mdRangeTmp = easySelector(list_text, from_line, "list", ABReg.reg_list)
@@ -138,7 +142,9 @@ registerMdSelector(mdSelector_list)
 /**
  * 代码块选择器
  */
-const mdSelector_code:MdSelectorSpec = {
+const mdSelector_code:MdSelectorSpecSimp = {
+ id: "code",
+ name: "代码选择器",
  match: ABReg.reg_code,
  selector: (list_text, from_line)=>{
  let mdRangeTmp = easySelector(list_text, from_line, "code", ABReg.reg_code)
@@ -170,7 +176,9 @@ registerMdSelector(mdSelector_code)
 /**
  * 引用块选择器
  */
-const mdSelector_quote:MdSelectorSpec = {
+const mdSelector_quote:MdSelectorSpecSimp = {
+ id: "quote",
+ name: "引用块选择器",
  match: ABReg.reg_quote,
  selector: (list_text, from_line)=>{
  let mdRangeTmp = easySelector(list_text, from_line, "quote", ABReg.reg_quote)
@@ -200,7 +208,9 @@ registerMdSelector(mdSelector_quote)
 /**
  * 标题选择器
  */
-const mdSelector_heading:MdSelectorSpec = {
+const mdSelector_heading:MdSelectorSpecSimp = {
+ id: "heading",
+ name: "标题选择器",
  match: ABReg.reg_heading,
  selector: (list_text, from_line)=>{
  let mdRangeTmp = easySelector(list_text, from_line, "heading", ABReg.reg_heading)
@@ -215,11 +225,11 @@ const mdSelector_heading:MdSelectorSpec = {
  const line2 = line.replace(mdRange.prefix, "") // 删掉无用前缀
  // 空行
  if (ABReg.reg_emptyline.test(line2)) {continue}
- last_nonempty = i
  // 更大的标题
  const match = line2.match(ABReg.reg_heading)
- if (!match) continue
- if (match[3].length > mdRange.levelFlag.length) {break}
+ if (!match) {last_nonempty=i; continue}
+ if (match[3].length < mdRange.levelFlag.length) {break}
+ last_nonempty=i;
  }
  mdRange.to_line = last_nonempty+1
  mdRange.content = list_text

src/manager/abMdSelector.ts

@@ -75,6 +75,31 @@ export function autoMdSelector(
  return list_mdSelectorRangeSpec
 }
 
+/** 选择器一览表 - 全部信息 */
+export function generateSelectorInfoTable(el: HTMLElement){
+ const table_p = el.createEl("div",{
+ cls: ["ab-setting","md-table-fig1"]
+ })
+ const table = table_p.createEl("table",{
+ cls: ["ab-setting","md-table-fig2"]
+ })
+ {
+ const thead = table.createEl("thead")
+ const tr = thead.createEl("tr")
+ tr.createEl("td", {text: "选择器名"})
+ tr.createEl("td", {text: "首行正则"})
+ tr.createEl("td", {text: "是否启用"})
+ }
+ const tbody = table.createEl("tbody")
+ for (let item of list_mdSelector){
+ const tr = tbody.createEl("tr")
+ tr.createEl("td", {text: item.name})
+ tr.createEl("td", {text: String(item.match)})
+ tr.createEl("td", {text: item.is_disable?"禁用":"启用"})
+ }
+ return table_p
+}
+
 /** 选择器范围 - 严格版 */
 export interface MdSelectorRangeSpec {
  from_ch: number, // 替换范围
@@ -94,18 +119,31 @@ export interface MdSelectorRangeSpecSimp {
  content: string, // 内容信息
  prefix: string,
 }
-export interface MdSelectorSpec{
+/** md选择器 - 注册版 */
+export interface MdSelectorSpecSimp{
+ id: string
+ name: string
  match: RegExp
  selector: (
  list_text: string[], // 全文
  from_line: number, // 从第几行开始搜索
  // confSelect: ConfSelect // 选择器配置
  )=>MdSelectorRangeSpecSimp|null // 返回一个MdSelectorRangeSpec。然后遍历器的行数要跳转到里面的`to`继续循环
 }
+/** md选择器 - 严格版 */
+export interface MdSelectorSpec extends MdSelectorSpecSimp{
+ is_disable: boolean
+}
 /** md选择器列表 */
 export let list_mdSelector: MdSelectorSpec[] = []
-export function registerMdSelector (mdSelectorSpec:MdSelectorSpec){
- list_mdSelector.push(mdSelectorSpec)
+export function registerMdSelector (simp:MdSelectorSpecSimp){
+ list_mdSelector.push({
+ id: simp.id,
+ name: simp.name,
+ match: simp.match,
+ selector: simp.selector,
+ is_disable: false
+ })
 }
 
 // 配置返回列表

src/replace/abProcessor.ts

@@ -96,14 +96,12 @@ export function getProcessorOptions(){
 }
 
 /** 处理器一览表 - 全部信息 */
-export function generateInfoTable(el: HTMLElement){
+export function generateProcessorInfoTable(el: HTMLElement){
  const table_p = el.createEl("div",{
- cls: ["ab-setting","md-table-fig"],
- attr: {"style": "overflow-x:scroll; transform:scaleY(-1)"}
+ cls: ["ab-setting","md-table-fig1"]
  })
  const table = table_p.createEl("table",{
- cls: ["ab-setting","setting-table"],
- attr: {"style": "overflow-x:scroll; transform:scaleY(-1); white-space: nowrap"}
+ cls: ["ab-setting","md-table-fig2"]
  })
  {
  const thead = table.createEl("thead")

styles.css

@@ -223,3 +223,14 @@
 .ab-note .ab-deco-title .ab-deco-title-title[title-type="ul"] > p {
  font-weight: bold;
 }
+
+div.md-table-fig1 {
+ overflow-x: scroll;
+ transform: scaleY(-1);
+}
+
+table.md-table-fig2 {
+ overflow-x: scroll;
+ transform: scaleY(-1);
+ white-space: nowrap;
+}