Simplify web interface to execute-only, improve desktop editor UX

## Web Interface
- Remove Add/Edit functionality from web interface (execute-only now)
- Remove modal dialog and command builder
- Simplified JS from 480 to 267 lines
- Users can still create/edit macros in the desktop app

## Desktop Editor
- Fix Edit button padding (set fixed width of 50px)
- Capitalize key options for better readability (Enter, Tab, etc.)
- Display keys capitalized in command list

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
2026-01-03 17:48:21 -08:00
parent a71c1f5ec4
commit 256e8c109c
3 changed files with 15 additions and 267 deletions

View File

@@ -26,7 +26,6 @@
<span>Disconnected</span>
</div>
<button class="header-btn secondary" onclick="app.refresh()">Refresh</button>
<button class="header-btn" onclick="app.openAddModal()">+ Add</button>
</div>
</header>
@@ -42,47 +41,6 @@
</div>
</main>
<!-- Modal -->
<div class="modal-overlay" id="modal-overlay" style="display: none;">
<div class="modal">
<div class="modal-header">
<h2 id="modal-title">Add Macro</h2>
<button class="modal-close" onclick="app.closeModal()">&times;</button>
</div>
<div class="modal-body">
<div class="form-group">
<label for="macro-name">Name</label>
<input type="text" id="macro-name" placeholder="Macro name">
</div>
<div class="form-group">
<label for="macro-category">Category (optional)</label>
<input type="text" id="macro-category" placeholder="Category">
</div>
<div class="form-group">
<label>Commands</label>
<div class="command-list" id="command-list">
<div class="empty-state"><p>No commands added yet</p></div>
</div>
<div class="add-command-btns">
<button class="add-command-btn" onclick="app.addCommand('text')">+ Text</button>
<button class="add-command-btn" onclick="app.addCommand('key')">+ Key</button>
<button class="add-command-btn" onclick="app.addCommand('hotkey')">+ Hotkey</button>
<button class="add-command-btn" onclick="app.addCommand('wait')">+ Wait</button>
<button class="add-command-btn" onclick="app.addCommand('app')">+ App</button>
</div>
</div>
</div>
<div class="modal-footer">
<button class="btn btn-danger" id="delete-btn" style="display: none;"
onclick="app.deleteMacro(app.editingMacroId); app.closeModal();">
Delete
</button>
<button class="btn btn-secondary" onclick="app.closeModal()">Cancel</button>
<button class="btn btn-primary" onclick="app.saveMacro()">Save</button>
</div>
</div>
</div>
<!-- Toast Container -->
<div class="toast-container" id="toast-container"></div>