| docs/images | ||
| node_modules | ||
| src | ||
| esbuild.config.mjs | ||
| LICENSE | ||
| main.js | ||
| manifest.json | ||
| package-lock.json | ||
| package.json | ||
| proto.html | ||
| prototype.js | ||
| README.md | ||
| styles.css | ||
| tsconfig.json | ||
| version-bump.mjs | ||
| versions.json | ||
Obsidian X86 Flow Graph
What is this?
This is a plugin for Obsidian, that converts x86 assembly into a flow diagram using Obsidian Canvases
Usage
This plugin adds a command called x86-create-flow-diagram. To use this plugin you must highlight a valid x86 code block (without the ``` at the start and end) and run the command.
This plugin requires a specific format for the assembly in order to properly generate nodes and edges for the flow graph.
The key format features are as a follows:
- All instructions must be indeneted
- Location for jumps must have no spaces before the location name
- jmp instruction must be used for unconditional jumps (1 branch)
- any other instruction beginning with a j is treated as a conditional jump (2 branches)
This is an example of a valid x86 code block for use with this plugin
cmp [ebp+var_8], 1
jz loc_401027
cmp [ebp+var_8], 2
jz loc_40103D
cmp [ebp+var_8], 3
jz loc_401053
jmp loc_401058
loc_401027
Code for case 1
jmp loc_401058
loc_40103D
Code for case 2
jmp loc_401058
loc_401053
Code for case 3
loc_401058
Program end
running x86-create-flow-diagram on the above codeblock would result in the following graph being produced:
Changing the palette
To add colors to the palette open the plugin settings, and click the + button. Then use the color picker to select the color, and input a name for the color. Afterwards it will appear in the Set color modal. You can add as many colors as you need.
Compatibility
This plugin has been tested with a few other community plugins:
- Icon Folder
- Should work out of the box, and colors should automatically be applied to the icons as well.
- Folder Note
-
Will also work out of the box, however the underlines added to the files will not be colored.
-
Personally I use the following CSS snippet locally:
.nav-folder.alx-folder-with-note>.nav-folder-title>.nav-folder-title-content { text-decoration-style: dotted; text-decoration-color: inherit; }Which will make make the underline use the colors defined by this plugin. The result looks something like this:
-


