mirror of
https://github.com/dwolfe884/obsidian-x86-flow-graph.git
synced 2026-07-22 07:30:26 +00:00
Updating the docs and stuff
This commit is contained in:
parent
69f188411d
commit
9edcf419c1
4 changed files with 40 additions and 45 deletions
44
README.md
44
README.md
|
|
@ -1,15 +1,49 @@
|
||||||
# Obsidian File Color
|
# Obsidian X86 Flow Graph
|
||||||
|
|
||||||

|

|
||||||
|
|
||||||
## What is this?
|
## What is this?
|
||||||
This is a plugin for [Obsidian](https://obsidian.md), which allows you to select colors for your files and folders in the file explorer.
|
|
||||||
|
This is a plugin for [Obsidian](https://obsidian.md), that converts x86 assembly into a flow diagram using Obsidian Canvases
|
||||||
|
|
||||||
## Usage
|
## Usage
|
||||||
|
|
||||||
Setting the color for a file or folder is done by right clicking on the file in the file explorer and selecting `Set color`. This opens a modal where you can select all the colors defined in the plugin palette.
|
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:
|
||||||
|
|
||||||
|
1. All instructions must be indeneted
|
||||||
|
2. Location for jumps must have no spaces before the location name
|
||||||
|
3. jmp instruction must be used for unconditional jumps (1 branch)
|
||||||
|
4. 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
|
||||||
|
|
||||||
|
```x86
|
||||||
|
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
|
### Changing the palette
|
||||||
|
|
||||||
|
|
|
||||||
BIN
docs/images/graph1.png
Normal file
BIN
docs/images/graph1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 70 KiB |
BIN
docs/images/x86.png
Normal file
BIN
docs/images/x86.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
41
src/index.ts
41
src/index.ts
|
|
@ -26,18 +26,6 @@ export default class MyPlugin extends Plugin {
|
||||||
async onload() {
|
async onload() {
|
||||||
await this.loadSettings();
|
await this.loadSettings();
|
||||||
|
|
||||||
// This creates an icon in the left ribbon.
|
|
||||||
const ribbonIconEl = this.addRibbonIcon('dice', 'Sample Plugin', (evt: MouseEvent) => {
|
|
||||||
// Called when the user clicks the icon.
|
|
||||||
new Notice('This is a notice!');
|
|
||||||
});
|
|
||||||
// Perform additional things with the ribbon
|
|
||||||
ribbonIconEl.addClass('my-plugin-ribbon-class');
|
|
||||||
|
|
||||||
// This adds a status bar item to the bottom of the app. Does not work on mobile apps.
|
|
||||||
const statusBarItemEl = this.addStatusBarItem();
|
|
||||||
statusBarItemEl.setText('Status Bar Text');
|
|
||||||
|
|
||||||
// This adds a simple command that can be triggered anywhere
|
// This adds a simple command that can be triggered anywhere
|
||||||
/*this.addCommand({
|
/*this.addCommand({
|
||||||
id: 'run-x86-parser',
|
id: 'run-x86-parser',
|
||||||
|
|
@ -80,7 +68,7 @@ export default class MyPlugin extends Plugin {
|
||||||
});*/
|
});*/
|
||||||
// This adds an editor command that can perform some operation on the current editor instance
|
// This adds an editor command that can perform some operation on the current editor instance
|
||||||
this.addCommand({
|
this.addCommand({
|
||||||
id: 'create-flow-diagram',
|
id: 'x86-create-flow-diagram',
|
||||||
name: 'Convert x86 assembly into a flow diagram on a canvas',
|
name: 'Convert x86 assembly into a flow diagram on a canvas',
|
||||||
editorCallback: (editor: Editor, view: MarkdownView) => {
|
editorCallback: (editor: Editor, view: MarkdownView) => {
|
||||||
console.log(editor.getSelection());
|
console.log(editor.getSelection());
|
||||||
|
|
@ -118,37 +106,10 @@ export default class MyPlugin extends Plugin {
|
||||||
console.log("{ \"nodes\":"+JSON.stringify(nodes) + ",\"edges\":" + JSON.stringify(edges) + "}")
|
console.log("{ \"nodes\":"+JSON.stringify(nodes) + ",\"edges\":" + JSON.stringify(edges) + "}")
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
// This adds a complex command that can check whether the current state of the app allows execution of the command
|
|
||||||
this.addCommand({
|
|
||||||
id: 'open-sample-modal-complex',
|
|
||||||
name: 'Open sample modal (complex)',
|
|
||||||
checkCallback: (checking: boolean) => {
|
|
||||||
// Conditions to check
|
|
||||||
const markdownView = this.app.workspace.getActiveViewOfType(MarkdownView);
|
|
||||||
if (markdownView) {
|
|
||||||
// If checking is true, we're simply "checking" if the command can be run.
|
|
||||||
// If checking is false, then we want to actually perform the operation.
|
|
||||||
if (!checking) {
|
|
||||||
new SampleModal(this.app).open();
|
|
||||||
}
|
|
||||||
|
|
||||||
// This command will only show up in Command Palette when the check function returns true
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// This adds a settings tab so the user can configure various aspects of the plugin
|
// This adds a settings tab so the user can configure various aspects of the plugin
|
||||||
this.addSettingTab(new SampleSettingTab(this.app, this));
|
this.addSettingTab(new SampleSettingTab(this.app, this));
|
||||||
|
|
||||||
// If the plugin hooks up any global DOM events (on parts of the app that doesn't belong to this plugin)
|
|
||||||
// Using this function will automatically remove the event listener when this plugin is disabled.
|
|
||||||
//this.registerDomEvent(document, 'click', (evt: MouseEvent) => {
|
|
||||||
// console.log('click1', evt);
|
|
||||||
//});
|
|
||||||
|
|
||||||
// When registering intervals, this function will automatically clear the interval when the plugin is disabled.
|
|
||||||
this.registerInterval(window.setInterval(() => console.log('setInterval'), 5 * 60 * 1000));
|
|
||||||
}
|
}
|
||||||
|
|
||||||
onunload() {
|
onunload() {
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue