Added some more commands and mades some quality of life improvements
All checks were successful
Build / build (push) Successful in 4m27s

This commit is contained in:
Leon Mika 2026-01-25 11:00:40 +11:00
parent 3a23118036
commit 3cb5795ca5
17 changed files with 432 additions and 75 deletions

View file

@ -6,21 +6,18 @@
<title>dequoter</title>
</head>
<body>
<div id="app"></div>
<div id="app">
<div class="editor-mountpoint"></div>
<div class="status-bar deemphasized" data-controller="status">Cmd+P: open command palette. Shift+Cmd+P: rerun last command.</div>
</div>
<dialog id="command-dialog" data-controller="commands"
data-action="dq-showcommands@window->commands#showCommands">
data-action="dq-showcommands@window->commands#showCommands dq-rerunlastcommand@window->commands#rerunLastCommand">
<div class="dialog-body">
<div class="command-input">
<input data-commands-target="commandInput" type="text" placeholder="Enter command"
data-action="keyup.enter->commands#runCommand keydown.esc->commands#dismissDialog keyup->commands#handleKeyup">
data-action="keyup.enter->commands#runCommand keyup.down->commands#focusSelect keydown.esc->commands#dismissDialog keyup->commands#handleKeyup">
</div>
<select multiple class="command-options" data-commands-target="commandSelect">
<option value="format-json"><span class="option-label">JSON: Format</span></option>
<option value="lorem-ipsum"><span class="option-label">Lorem Ipsum: Generate</span></option>
<option value="lower-case"><span class="option-label">Lower Case</span></option>
<option value="unquote"><span class="option-label">Unquote</span></option>
<option value="upper-case"><span class="option-label">Upper Case</span></option>
</select>
<select multiple class="command-options" data-commands-target="commandSelect" data-action="keyup.enter->commands#runCommand"></select>
</div>
</dialog>
<script src="./src/main.js" type="module"></script>

View file

@ -1,3 +1,26 @@
#app {
display: flex;
flex-direction: column;
}
.editor-mountpoint {
flex-grow: 1;
flex-shrink: 1;
}
.status-bar {
height: 2em;
background-color: rgb(245, 245, 245);
border-top: solid thin rgb(200, 200, 200);
align-content: center;
padding-inline: 8px;
}
.status-bar.deemphasized {
opacity: 0.5;
}
.cm-editor {
height: 100%;
width: 100%;

View file

@ -37,4 +37,12 @@ export const commandPalette = keymap.of([{
return true;
}
}]);
}, {
key: "Cmd-P",
run: () => {
let event = new CustomEvent('dq-rerunlastcommand');
window.dispatchEvent(event);
return true;
}
}]);

View file

@ -1,3 +1,5 @@
import {ListProcessors} from "../../wailsjs/go/main/App";
import { Controller } from "@hotwired/stimulus"
import { textProcessor } from "../services.js";
@ -8,7 +10,16 @@ export class CommandsController extends Controller {
"commandSelect",
];
connect() {
async connect() {
this._lastCommand = null;
let processors = await ListProcessors();
processors.forEach((processor) => {
let option = document.createElement("option");
option.value = processor.name;
option.text = processor.label;
this.commandSelectTarget.appendChild(option);
});
this._options = Array.from(this.commandSelectTarget.options);
}
@ -29,13 +40,29 @@ export class CommandsController extends Controller {
this.element.close();
}
focusSelect(ev) {
this.commandSelectTarget.focus();
}
runCommand(ev) {
ev.preventDefault();
textProcessor.runTextCommand(this.commandSelectTarget.value);
this._lastCommand = this.commandSelectTarget.value;
this.element.close();
}
rerunLastCommand(ev) {
ev.preventDefault();
if (this._lastCommand === null) {
return;
}
textProcessor.runTextCommand(this._lastCommand);
}
_filterOptions(filterText) {
let inputText = filterText.toLowerCase();

View file

@ -0,0 +1,14 @@
import { Controller } from "@hotwired/stimulus"
export class StatusController extends Controller {
connect() {
window.runtime.EventsOn("set-statusbar-message", (data) => {
this._setStatusbarMessage(data.message);
});
}
_setStatusbarMessage(message) {
this.element.textContent = message;
this.element.classList.remove("deemphasized");
}
}

View file

@ -7,11 +7,13 @@ import {Application} from "@hotwired/stimulus";
import {textProcessor} from "./services.js";
import {multiCursorKeymap, commandPalette} from "./cmplugins.js";
import {StatusController} from "./controllers/status_controller.js";
import {CommandsController} from "./controllers/commands_controller.js";
const view = new EditorView({
parent: document.querySelector("#app"),
parent: document.querySelector("#app .editor-mountpoint"),
doc: "",
extensions: [
basicSetup,
@ -23,6 +25,7 @@ const view = new EditorView({
window.Stimulus = Application.start()
Stimulus.register("commands", CommandsController);
Stimulus.register("status", StatusController);
textProcessor.setCodeMirrorEditor(view);

View file

@ -4,11 +4,21 @@ class TextProcessor {
setCodeMirrorEditor(editor) {
this._editor = editor;
window.runtime.EventsOn("process-text-response", (data) => {
const changes = data.output.map(span => ({
from: span.pos,
to: span.pos + span.len,
insert: span.text,
}));
const changes = data.output.map(span => {
if (span.append) {
return {
from: span.pos + span.len,
to: span.pos + span.len,
insert: span.text,
};
} else {
return {
from: span.pos,
to: span.pos + span.len,
insert: span.text,
};
}
});
this._editor.dispatch({ changes: changes });
});
}

View file

@ -2,4 +2,6 @@
// This file is automatically generated. DO NOT EDIT
import {main} from '../models';
export function ListProcessors():Promise<Array<main.ListProcessorsResponse>>;
export function ProcessText(arg1:main.ProcessTextRequest):Promise<void>;

View file

@ -2,6 +2,10 @@
// Cynhyrchwyd y ffeil hon yn awtomatig. PEIDIWCH Â MODIWL
// This file is automatically generated. DO NOT EDIT
export function ListProcessors() {
return window['go']['main']['App']['ListProcessors']();
}
export function ProcessText(arg1) {
return window['go']['main']['App']['ProcessText'](arg1);
}

View file

@ -1,9 +1,24 @@
export namespace main {
export class ListProcessorsResponse {
name: string;
label: string;
static createFrom(source: any = {}) {
return new ListProcessorsResponse(source);
}
constructor(source: any = {}) {
if ('string' === typeof source) source = JSON.parse(source);
this.name = source["name"];
this.label = source["label"];
}
}
export class TextSpan {
text: string;
pos: number;
len: number;
append: boolean;
static createFrom(source: any = {}) {
return new TextSpan(source);
@ -14,6 +29,7 @@ export namespace main {
this.text = source["text"];
this.pos = source["pos"];
this.len = source["len"];
this.append = source["append"];
}
}
export class ProcessTextRequest {