web editor overview - magemonkeystudio/fabled GitHub Wiki

πŸ–₯️ Web Editor Overview

The Fabled Web Editor lets you create skills, classes, and attributes visually from your browser β€” no YAML or coding required.

πŸ”— Editor URL:

https://fabled.magemonkey.studio

🧩 What You Can Create

  • Classes β€” Set XP scaling, mana/health progression, skill trees, and icons.
  • Skills β€” Add triggers, targets, conditions, mechanics, costs, cooldowns, and messages.
  • Attributes β€” Define stats like Strength, Dexterity, or Willpower with scaling formulas and icons.

All output is fully compatible with the Fabled plugin and Codex core system.

🧭 Navigation & UI Overview

The web editor is organized with:

  • Tabs across the top: Skills, Classes, Attributes
  • Folder sidebar on the left for organizing content
  • Main editor panel on the right for form-based (or block-based) editing
  • Floating Action Buttons (bottom right corner):
    • πŸ’Ύ Save β€” Save the current item locally
    • ☁️ Save to Server β€” Upload the current item to the trusted server
    • πŸ“€ Upload All to Server β€” Push all YAML to the server
    • πŸ” Reload Fabled β€” Run /fabled reload remotely
    • βš™οΈ Settings β€” Opens the settings modal

βš™οΈ Editor Settings (βš™οΈ Floating Gear Button)

Access the settings by clicking the βš™οΈ gear icon at the bottom right of the screen.

Available Options:

  • Server Version

    • Choose your server version (e.g., 1.16, 1.18, 1.20) for compatibility.

  • Use Symbols

    • Toggle between text-based labels and visual icons for mechanics/conditions.

  • Show Summary Items

    • Display compact summaries for mechanics and conditions in skill view.

  • Waterfall Animation

    • Cosmetic toggle for folder sidebar transitions.

  • Blockly Mode

    • Enable drag-and-drop Blockly editing for skills.

  • Clear Data

    • Wipes all browser-stored skill/class/attribute data.
    • Does not affect your server or downloaded files.

⚠️ Data is stored locally unless exported or sent to a trusted server. Always export to back up your work.

🧱 Editing Skills

Each skill includes tabs for:

  • Main β€” Skill name, description, icon, cooldown, cost
  • Triggers β€” Events that activate the skill
  • Targets β€” Defines who or what is affected
  • Conditions β€” Checks before mechanics run
  • Mechanics β€” The actual effects like damage, teleport, etc.

You can build skills using:

  • The standard form-based editor (default)
  • Or enable Blockly Mode in settings to use visual drag-and-drop blocks

Tip: Double-click a block in Blockly Mode to collapse or expand.

🧠 Blockly Mode

Blockly Mode must be enabled manually in the βš™οΈ settings menu.

  • Uses blocks to visually define skill logic
  • Great for complex or multi-layered skills
  • Saves the same YAML structure as the form editor

πŸ“€ Exporting Files

There are two ways to export:

  • Save Button (πŸ’Ύ) β€” Saves the currently selected skill, class, or attribute.
  • Upload All to Server (πŸ“€) β€” Exports all entries at once.

Once exported:

  1. Download the .yml files for:

    • skills.yml
    • classes.yml
    • attributes.yml

  2. Place them in your server’s plugins/Fabled/ folder.

  3. Run:

    /fabled reload

πŸ§ͺ Tips & Best Practices

  • Use folders in the sidebar to stay organized.
  • If you're working offline, always export before closing the tab.
  • Use {attr:*} and {req:*} placeholders to display dynamic values in skill descriptions.
  • You can copy/export individual entries or do a full export for batch changes.

πŸ”— Related Pages