RuleEditor

A CodeMirror 6 based rule editor with Regex validation, search, and theme switching.

สคริปต์นี้ไม่ควรถูกติดตั้งโดยตรง มันเป็นคลังสำหรับสคริปต์อื่น ๆ เพื่อบรรจุด้วยคำสั่งเมทา // @require https://update.greasyfork.org/scripts/566628/1756739/RuleEditor.js

คุณจะต้องติดตั้งส่วนขยาย เช่น Tampermonkey, Greasemonkey หรือ Violentmonkey เพื่อติดตั้งสคริปต์นี้

You will need to install an extension such as Tampermonkey to install this script.

คุณจะต้องติดตั้งส่วนขยาย เช่น Tampermonkey หรือ Violentmonkey เพื่อติดตั้งสคริปต์นี้

You will need to install an extension such as Tampermonkey or Userscripts to install this script.

You will need to install an extension such as Tampermonkey to install this script.

You will need to install a user script manager extension to install this script.

(I already have a user script manager, let me install it!)

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

(I already have a user style manager, let me install it!)

ผู้เขียน
ryxel
เวอร์ชัน
1.0.0
สร้างเมื่อ
18-02-2026
อัปเดตเมื่อ
18-02-2026
Size
955 กิโลไบต์
สัญญาอนุญาต
MIT

CodeMirror 6 Rule Editor Documentation

This editor is built on CodeMirror 6, featuring custom syntax highlighting, regex validation, real-time search navigation, and multi-theme support.


Quick Start

Initialize the editor and get the control instance via the window.CodeMirror6 global object.

const container = document.getElementById('editor-container');
const editor = window.CodeMirror6.createEditor(container);


Core API

Content Operations

  • setContent(content, keepHistory)
    • Function: Sets the editor text.
    • Parameter: If keepHistory (boolean) is false, it resets the undo history and updates the sync snapshot.
  • getContent()
    • Function: Retrieves the full text string from the editor.
  • updateSnapshot()
    • Function: Manually sets the current document content as the synchronization baseline snapshot.

Theme & Search

  • setTheme(isDark)
    • Function: Toggles the visual theme. true for Dark mode, false for Light mode.
  • setSearch(term)
    • Function: Updates search keywords, triggers highlighting, and automatically jumps to the current match.
  • findNext()
    • Function: Navigates downward through the matching items.
  • findPrev()
    • Function: Navigates upward through the matching items.

Event Listeners

  • onSyncStatusChange(callback)
    • Function: Fires when the sync status between document content and snapshot changes.
    • Callback Structure: Returns isSynced (boolean).
  • onSearchUpdate(callback)
    • Function: Fires when search results are updated.
    • Callback Structure: Returns object { total, current, isExact }
      • total: Total number of matching lines.
      • current: Current match index closest to the cursor (starting from 1).
      • isExact: Whether the cursor is exactly positioned on a matching line.

Rule Parsing

  • getRules()
    • Function: Parses the syntax tree and returns structured data.
    • Return Structure: Returns object { regexps, keywords, errors }
      • regexps: List of valid regular expressions.
      • keywords: List of identified keyword strings.
      • errors: Syntax errors including text and position info.


Syntax Description

The editor supports three basic syntax elements:

  • Keywords: Plain text input used for matching specific strings.
  • Regular Expressions: Supports /pattern/flags format with real-time validity linting.
  • Comments: Content starting with # (entire line or end-of-line).


Acknowledgments & References

This project is built upon the CodeMirror 6 core library, with interactive logic and UI design inspired by uBlacklist and uBlock Origin.