Macrame/public/assets/MacrosView-Bf1eb3go.js

1419 lines
54 KiB
JavaScript

import { a as createVueComponent, _ as _export_sfc, r as reactive, b as onMounted, d as axios, e as appUrl, c as createElementBlock, f as createBaseVNode, F as Fragment, g as renderList, o as openBlock, h as createVNode, w as withCtx, i as createTextVNode, u as unref, I as IconKeyboard, t as toDisplayString, j as withModifiers, k as isLocal, A as AuthCall, l as defineStore, m as ref, n as onUpdated, p as createCommentVNode, q as normalizeClass, s as createBlock, v as renderSlot, x as withDirectives, y as vModelText } from "./index-GNAKlyBz.js";
import { _ as _sfc_main$h, a as _sfc_main$i } from "./DialogComp-Ba5-BUTe.js";
/**
* @license @tabler/icons-vue v3.30.0 - MIT
*
* This source code is licensed under the MIT license.
* See the LICENSE file in the root directory of this source tree.
*/
var IconAlarm = createVueComponent("outline", "alarm", "IconAlarm", [["path", { "d": "M12 13m-7 0a7 7 0 1 0 14 0a7 7 0 1 0 -14 0", "key": "svg-0" }], ["path", { "d": "M12 10l0 3l2 0", "key": "svg-1" }], ["path", { "d": "M7 4l-2.75 2", "key": "svg-2" }], ["path", { "d": "M17 4l2.75 2", "key": "svg-3" }]]);
/**
* @license @tabler/icons-vue v3.30.0 - MIT
*
* This source code is licensed under the MIT license.
* See the LICENSE file in the root directory of this source tree.
*/
var IconArrowLeftCircle = createVueComponent("outline", "arrow-left-circle", "IconArrowLeftCircle", [["path", { "d": "M17 12h-14", "key": "svg-0" }], ["path", { "d": "M6 9l-3 3l3 3", "key": "svg-1" }], ["path", { "d": "M19 12m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0", "key": "svg-2" }]]);
/**
* @license @tabler/icons-vue v3.30.0 - MIT
*
* This source code is licensed under the MIT license.
* See the LICENSE file in the root directory of this source tree.
*/
var IconArrowRightCircle = createVueComponent("outline", "arrow-right-circle", "IconArrowRightCircle", [["path", { "d": "M18 15l3 -3l-3 -3", "key": "svg-0" }], ["path", { "d": "M5 12m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0", "key": "svg-1" }], ["path", { "d": "M7 12h14", "key": "svg-2" }]]);
/**
* @license @tabler/icons-vue v3.30.0 - MIT
*
* This source code is licensed under the MIT license.
* See the LICENSE file in the root directory of this source tree.
*/
var IconDeviceFloppy = createVueComponent("outline", "device-floppy", "IconDeviceFloppy", [["path", { "d": "M6 4h10l4 4v10a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12a2 2 0 0 1 2 -2", "key": "svg-0" }], ["path", { "d": "M12 14m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0", "key": "svg-1" }], ["path", { "d": "M14 4l0 4l-6 0l0 -4", "key": "svg-2" }]]);
/**
* @license @tabler/icons-vue v3.30.0 - MIT
*
* This source code is licensed under the MIT license.
* See the LICENSE file in the root directory of this source tree.
*/
var IconPencil = createVueComponent("outline", "pencil", "IconPencil", [["path", { "d": "M4 20h4l10.5 -10.5a2.828 2.828 0 1 0 -4 -4l-10.5 10.5v4", "key": "svg-0" }], ["path", { "d": "M13.5 6.5l4 4", "key": "svg-1" }]]);
/**
* @license @tabler/icons-vue v3.30.0 - MIT
*
* This source code is licensed under the MIT license.
* See the LICENSE file in the root directory of this source tree.
*/
var IconPlus = createVueComponent("outline", "plus", "IconPlus", [["path", { "d": "M12 5l0 14", "key": "svg-0" }], ["path", { "d": "M5 12l14 0", "key": "svg-1" }]]);
/**
* @license @tabler/icons-vue v3.30.0 - MIT
*
* This source code is licensed under the MIT license.
* See the LICENSE file in the root directory of this source tree.
*/
var IconRestore = createVueComponent("outline", "restore", "IconRestore", [["path", { "d": "M3.06 13a9 9 0 1 0 .49 -4.087", "key": "svg-0" }], ["path", { "d": "M3 4.001v5h5", "key": "svg-1" }], ["path", { "d": "M12 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", "key": "svg-2" }]]);
/**
* @license @tabler/icons-vue v3.30.0 - MIT
*
* This source code is licensed under the MIT license.
* See the LICENSE file in the root directory of this source tree.
*/
var IconTimeDuration15 = createVueComponent("outline", "time-duration-15", "IconTimeDuration15", [["path", { "d": "M12 15h2a1 1 0 0 0 1 -1v-1a1 1 0 0 0 -1 -1h-2v-3h3", "key": "svg-0" }], ["path", { "d": "M9 9v6", "key": "svg-1" }], ["path", { "d": "M3 12v.01", "key": "svg-2" }], ["path", { "d": "M12 21v.01", "key": "svg-3" }], ["path", { "d": "M7.5 4.2v.01", "key": "svg-4" }], ["path", { "d": "M16.5 19.8v.01", "key": "svg-5" }], ["path", { "d": "M7.5 19.8v.01", "key": "svg-6" }], ["path", { "d": "M4.2 16.5v.01", "key": "svg-7" }], ["path", { "d": "M19.8 16.5v.01", "key": "svg-8" }], ["path", { "d": "M4.2 7.5v.01", "key": "svg-9" }], ["path", { "d": "M21 12a9 9 0 0 0 -9 -9", "key": "svg-10" }]]);
/**
* @license @tabler/icons-vue v3.30.0 - MIT
*
* This source code is licensed under the MIT license.
* See the LICENSE file in the root directory of this source tree.
*/
var IconTrash = createVueComponent("outline", "trash", "IconTrash", [["path", { "d": "M4 7l16 0", "key": "svg-0" }], ["path", { "d": "M10 11l0 6", "key": "svg-1" }], ["path", { "d": "M14 11l0 6", "key": "svg-2" }], ["path", { "d": "M5 7l1 12a2 2 0 0 0 2 2h8a2 2 0 0 0 2 -2l1 -12", "key": "svg-3" }], ["path", { "d": "M9 7v-3a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v3", "key": "svg-4" }]]);
/**
* @license @tabler/icons-vue v3.30.0 - MIT
*
* This source code is licensed under the MIT license.
* See the LICENSE file in the root directory of this source tree.
*/
var IconPlayerRecordFilled = createVueComponent("filled", "player-record-filled", "IconPlayerRecordFilled", [["path", { "d": "M8 5.072a8 8 0 1 1 -3.995 7.213l-.005 -.285l.005 -.285a8 8 0 0 1 3.995 -6.643z", "key": "svg-0" }]]);
/**
* @license @tabler/icons-vue v3.30.0 - MIT
*
* This source code is licensed under the MIT license.
* See the LICENSE file in the root directory of this source tree.
*/
var IconPlayerStopFilled = createVueComponent("filled", "player-stop-filled", "IconPlayerStopFilled", [["path", { "d": "M17 4h-10a3 3 0 0 0 -3 3v10a3 3 0 0 0 3 3h10a3 3 0 0 0 3 -3v-10a3 3 0 0 0 -3 -3z", "key": "svg-0" }]]);
const _hoisted_1$d = { class: "macro-overview mcrm-block block__dark" };
const _hoisted_2$b = { class: "macro-overview__list" };
const _sfc_main$g = {
__name: "MacroOverview",
setup(__props) {
const macros = reactive({
list: []
});
onMounted(() => {
axios.post(appUrl() + "/macro/list").then((data) => {
if (data.data.length > 0) macros.list = data.data;
});
});
function runMacro(macro) {
const data = isLocal() ? { macro } : AuthCall({ macro });
axios.post(appUrl() + "/macro/play", data).then((data2) => {
console.log(data2);
});
}
return (_ctx, _cache) => {
return openBlock(), createElementBlock("div", _hoisted_1$d, [
_cache[0] || (_cache[0] = createBaseVNode("h4", { class: "border-b-2 border-transparent" }, "Saved Macros", -1)),
createBaseVNode("div", _hoisted_2$b, [
(openBlock(true), createElementBlock(Fragment, null, renderList(macros.list, (macro, i) => {
return openBlock(), createElementBlock("div", {
class: "macro-item",
key: i
}, [
createVNode(_sfc_main$h, {
variant: "dark",
class: "w-full",
size: "sm",
onClick: withModifiers(($event) => runMacro(macro), ["prevent"])
}, {
default: withCtx(() => [
createVNode(unref(IconKeyboard)),
createTextVNode(" " + toDisplayString(macro), 1)
]),
_: 2
}, 1032, ["onClick"])
]);
}), 128))
])
]);
};
}
};
const MacroOverview = /* @__PURE__ */ _export_sfc(_sfc_main$g, [["__scopeId", "data-v-f9a187e3"]]);
const keyMap = {
// Modifier keys
Control: "Ctrl",
Shift: "Shift",
Alt: "Alt",
Meta: "Win",
CapsLock: "Caps",
// Special keys
PageUp: "PgUp",
PageDown: "PgDn",
ScrollLock: "Scr Lk",
Insert: "Ins",
Delete: "Del",
Escape: "Esc",
Space: "Space",
// Symbol keys
Backquote: "`",
Backslash: "\\",
BracketLeft: "[",
BracketRight: "]",
Comma: ",",
Equal: "=",
Minus: "-",
Period: ".",
Quote: "'",
Semicolon: ";",
Slash: "/",
// Arrow keys
ArrowUp: "▲",
ArrowRight: "▶",
ArrowDown: "▼",
ArrowLeft: "◀",
// Media keys
MediaPlayPause: "Play",
MediaStop: "Stop",
MediaTrackNext: "Next",
MediaTrackPrevious: "Prev",
MediaVolumeDown: "Down",
MediaVolumeUp: "Up",
AudioVolumeMute: "Mute",
AudioVolumeDown: "Down",
AudioVolumeUp: "Up"
};
const filterKey = (e) => {
const k = {};
if (e.location === 1) k.loc = "left";
if (e.location === 2) k.loc = "right";
if (e.location === 3) k.loc = "num";
if (e.key.includes("Media") || e.key.includes("Audio")) k.loc = mediaPrefix(e);
if (keyMap[e.code] || keyMap[e.key]) {
k.str = keyMap[e.code] || keyMap[e.key];
} else {
k.str = e.key.toLowerCase();
}
return k;
};
const mediaPrefix = (e) => {
switch (e.key) {
case "MediaPlayPause":
case "MediaStop":
case "MediaTrackNext":
case "MediaTrackPrevious":
return "Media";
case "MediaVolumeDown":
case "MediaVolumeUp":
case "AudioVolumeDown":
case "AudioVolumeUp":
case "AudioVolumeMute":
return "Volume";
}
};
const isRepeat = (lastStep, e, direction) => {
return lastStep && lastStep.type === "key" && lastStep.code === e.code && lastStep.direction === direction;
};
const invalidMacro = (steps) => {
const downKeys = [];
const upKeys = [];
Object.keys(steps).forEach((stepKey) => {
const step = steps[stepKey];
if (step.type !== "key") return;
if (step.direction == "down") downKeys.push(step.key);
if (step.direction == "up") {
if (!downKeys.includes(step.key)) upKeys.push(step.key);
else downKeys.splice(downKeys.indexOf(step.key), 1);
}
});
if (upKeys.length === 0 && downKeys.length === 0) return false;
return { down: downKeys, up: upKeys };
};
const useMacroRecorderStore = defineStore("macrorecorder", () => {
const state = ref({
record: false,
edit: false,
editKey: false,
editDelay: false,
validationErrors: false
});
const macroName = ref("");
const steps = ref([]);
const delay = ref({
start: 0,
fixed: false
});
const getEditKey = () => steps.value[state.value.editKey];
const getAdjacentKey = (pos, includeDelay = false) => {
let returnVal = false;
const mod = pos == "before" ? -1 : 1;
const keyIndex = state.value.editKey + 2 * mod;
const delayIndex = includeDelay ? state.value.editKey + 1 * mod : false;
if (steps.value[keyIndex]) returnVal = steps.value[keyIndex];
if (delayIndex && steps.value[delayIndex])
returnVal = {
delay: steps.value[delayIndex],
key: steps.value[keyIndex],
delayIndex
};
return returnVal;
};
const getEditDelay = () => steps.value[state.value.editDelay];
const recordStep = (e, direction = false, key = false) => {
const lastStep = steps.value[steps.value.length - 1];
let stepVal = {};
if (typeof e === "object" && !isRepeat(lastStep, e, direction)) {
if (key === false) recordDelay();
stepVal = {
type: "key",
key: e.key,
code: e.code,
location: e.location,
direction,
keyObj: filterKey(e)
};
} else if (direction && key !== false) {
stepVal = steps.value[key];
stepVal.direction = direction;
} else if (typeof e === "number") {
stepVal = { type: "delay", value: parseFloat(e.toFixed()) };
}
if (key !== false) steps.value[key] = stepVal;
else steps.value.push(stepVal);
};
const recordDelay = () => {
if (delay.value.fixed !== false)
recordStep(delay.value.fixed);
else if (delay.value.start == 0)
delay.value.start = performance.now();
else {
recordStep(performance.now() - delay.value.start);
delay.value.start = performance.now();
}
};
const insertKey = (e, direction, adjacentDelayIndex) => {
let min, max, newKeyIndex, newDelayIndex;
if (adjacentDelayIndex === null) {
min = state.value.editKey == 0 ? 0 : state.value.editKey;
max = state.value.editKey == 0 ? 1 : false;
newKeyIndex = max === false ? min + 2 : min;
newDelayIndex = min + 1;
} else if (state.value.editKey < adjacentDelayIndex) {
min = state.value.editKey;
max = adjacentDelayIndex;
newKeyIndex = min + 2;
newDelayIndex = min + 1;
} else {
min = adjacentDelayIndex;
max = state.value.editKey;
newKeyIndex = min + 1;
newDelayIndex = min + 2;
}
if (max !== false) {
for (let i = Object.keys(steps.value).length - 1; i >= max; i--) {
steps.value[i + 2] = steps.value[i];
}
}
recordStep(e, direction, newKeyIndex);
recordStep(10, false, newDelayIndex);
state.value.editKey = false;
};
const deleteEditKey = () => {
if (state.value.editKey === 0) steps.value.splice(state.value.editKey, 2);
else steps.value.splice(state.value.editKey - 1, 2);
state.value.editKey = false;
};
const restartDelay = () => {
delay.value.start = performance.now();
};
const changeName = (name) => {
macroName.value = name;
console.log(macroName.value);
};
const changeDelay = (fixed) => {
delay.value.fixed = fixed;
formatDelays();
};
const formatDelays = () => {
steps.value = steps.value.map((step) => {
if (step.type === "delay" && delay.value.fixed !== false) step.value = delay.value.fixed;
return step;
});
};
const toggleEdit = (type, key) => {
if (type === "key") {
state.value.editKey = key;
state.value.editDelay = false;
}
if (type === "delay") {
state.value.editKey = false;
state.value.editDelay = key;
}
};
const resetEdit = () => {
state.value.edit = false;
state.value.editKey = false;
state.value.editDelay = false;
};
const reset = () => {
state.value.record = false;
delay.value.start = 0;
steps.value = [];
if (state.value.edit) resetEdit();
};
const save = () => {
state.value.validationErrors = invalidMacro(steps.value);
if (state.value.validationErrors) return false;
axios.post(appUrl() + "/macro/record", { name: macroName.value, steps: steps.value }).then((data) => {
console.log(data);
});
return true;
};
return {
state,
steps,
delay,
getEditKey,
getAdjacentKey,
getEditDelay,
recordStep,
insertKey,
deleteEditKey,
restartDelay,
changeName,
changeDelay,
toggleEdit,
resetEdit,
reset,
save
};
});
const _hoisted_1$c = { key: 0 };
const _hoisted_2$a = ["innerHTML"];
const _hoisted_3$6 = { class: "dir" };
const _hoisted_4$4 = { key: 1 };
const _sfc_main$f = {
__name: "MacroKey",
props: {
keyObj: Object,
direction: String,
active: Boolean,
empty: Boolean
},
setup(__props) {
const props = __props;
const dir = reactive({
value: false
});
onMounted(() => {
if (props.empty) return;
setDirection();
});
onUpdated(() => {
setDirection();
});
const setDirection = () => {
if (props.direction) dir.value = props.direction;
else dir.value = props.keyObj.direction;
};
return (_ctx, _cache) => {
return openBlock(), createElementBlock("kbd", {
class: normalizeClass(`${__props.active ? "active" : ""} ${__props.empty ? "empty" : ""}`)
}, [
__props.keyObj ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
__props.keyObj.loc ? (openBlock(), createElementBlock("sup", _hoisted_1$c, toDisplayString(__props.keyObj.loc), 1)) : createCommentVNode("", true),
createBaseVNode("span", {
innerHTML: __props.keyObj.str
}, null, 8, _hoisted_2$a),
createBaseVNode("span", _hoisted_3$6, toDisplayString(dir.value === "down" ? "↓" : "↑"), 1)
], 64)) : __props.empty ? (openBlock(), createElementBlock("span", _hoisted_4$4, "[ ]")) : createCommentVNode("", true)
], 2);
};
}
};
const _sfc_main$e = {
__name: "DelaySpan",
props: {
value: Number,
active: Boolean,
preset: Boolean
},
setup(__props) {
return (_ctx, _cache) => {
return openBlock(), createElementBlock("span", {
class: normalizeClass(`delay ${__props.active ? "active" : ""} ${__props.preset ? "preset" : ""}`)
}, [
__props.value < 1e4 ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
createTextVNode(toDisplayString(__props.value) + " ", 1),
_cache[0] || (_cache[0] = createBaseVNode("i", null, "ms", -1))
], 64)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
_cache[1] || (_cache[1] = createTextVNode(" >10 ")),
_cache[2] || (_cache[2] = createBaseVNode("i", null, "s", -1))
], 64))
], 2);
};
}
};
const DelaySpan = /* @__PURE__ */ _export_sfc(_sfc_main$e, [["__scopeId", "data-v-05e04cbb"]]);
const _sfc_main$d = {
__name: "RecorderOutput",
setup(__props) {
const macroRecorder = useMacroRecorderStore();
return (_ctx, _cache) => {
return openBlock(), createElementBlock("div", {
class: normalizeClass(`macro-recorder__output ${unref(macroRecorder).state.record && "record"} ${unref(macroRecorder).state.edit && "edit"}`)
}, [
(openBlock(true), createElementBlock(Fragment, null, renderList(unref(macroRecorder).steps, (step, key) => {
return openBlock(), createElementBlock(Fragment, null, [
step.type === "key" ? (openBlock(), createBlock(_sfc_main$f, {
key,
"key-obj": step.keyObj,
direction: step.direction,
active: unref(macroRecorder).state.editKey === key,
onClick: ($event) => unref(macroRecorder).state.edit ? unref(macroRecorder).toggleEdit("key", key) : false
}, null, 8, ["key-obj", "direction", "active", "onClick"])) : step.type === "delay" ? (openBlock(), createBlock(DelaySpan, {
key,
value: step.value,
active: unref(macroRecorder).state.editDelay === key,
onClick: ($event) => unref(macroRecorder).toggleEdit("delay", key)
}, null, 8, ["value", "active", "onClick"])) : createCommentVNode("", true),
_cache[0] || (_cache[0] = createBaseVNode("hr", { class: "spacer" }, null, -1))
], 64);
}), 256))
], 2);
};
}
};
const RecorderOutput = /* @__PURE__ */ _export_sfc(_sfc_main$d, [["__scopeId", "data-v-33cbf1af"]]);
const _sfc_main$c = {
__name: "RecorderInput",
setup(__props) {
const macroInput = ref(null);
const macroRecorder = useMacroRecorderStore();
onUpdated(() => {
if (macroRecorder.state.record) {
macroInput.value.focus();
if (macroRecorder.delay.start !== 0) macroRecorder.restartDelay();
}
});
return (_ctx, _cache) => {
return openBlock(), createElementBlock("div", {
class: normalizeClass(`recorder-input__container ${unref(macroRecorder).state.record && "record"}`)
}, [
unref(macroRecorder).state.record ? (openBlock(), createElementBlock("input", {
key: 0,
class: normalizeClass(`macro-recorder__input ${unref(macroRecorder).state.record && "record"}`),
type: "text",
ref_key: "macroInput",
ref: macroInput,
onFocus: _cache[0] || (_cache[0] = ($event) => console.log("focus")),
onKeydown: _cache[1] || (_cache[1] = withModifiers(($event) => unref(macroRecorder).recordStep($event, "down"), ["prevent"])),
onKeyup: _cache[2] || (_cache[2] = withModifiers(($event) => unref(macroRecorder).recordStep($event, "up"), ["prevent"]))
}, null, 34)) : createCommentVNode("", true)
], 2);
};
}
};
const RecorderInput = /* @__PURE__ */ _export_sfc(_sfc_main$c, [["__scopeId", "data-v-9a99c4ac"]]);
const _hoisted_1$b = { class: "context-menu" };
const _sfc_main$b = {
__name: "ContextMenu",
props: {
open: Boolean
},
setup(__props, { expose: __expose }) {
__expose({ toggle });
const props = __props;
const menuOpen = ref(false);
onMounted(() => {
menuOpen.value = props.open;
});
function toggle() {
console.log("toggle");
menuOpen.value = !menuOpen.value;
}
return (_ctx, _cache) => {
return openBlock(), createElementBlock("div", _hoisted_1$b, [
createBaseVNode("div", {
class: "context-menu__trigger",
onClick: toggle
}, [
renderSlot(_ctx.$slots, "trigger")
]),
createBaseVNode("div", {
class: normalizeClass(`context-menu__content ${menuOpen.value ? "open" : ""}`)
}, [
renderSlot(_ctx.$slots, "content")
], 2)
]);
};
}
};
const _hoisted_1$a = {
type: "number",
step: "10",
min: "0",
max: "3600000",
ref: "customDelayInput",
placeholder: "100"
};
const _hoisted_2$9 = { class: "flex justify-end" };
const _sfc_main$a = {
__name: "FixedDelayMenu",
setup(__props) {
const macroRecorder = useMacroRecorderStore();
const ctxtMenu = ref();
function changeDelay(num) {
macroRecorder.changeDelay(num);
ctxtMenu.value.toggle();
}
return (_ctx, _cache) => {
return openBlock(), createBlock(_sfc_main$b, {
ref_key: "ctxtMenu",
ref: ctxtMenu
}, {
trigger: withCtx(() => [
createVNode(_sfc_main$h, {
variant: "secondary",
size: "sm"
}, {
default: withCtx(() => [
createVNode(unref(IconTimeDuration15)),
_cache[5] || (_cache[5] = createTextVNode("Fixed delay "))
]),
_: 1
})
]),
content: withCtx(() => [
createBaseVNode("ul", null, [
createBaseVNode("li", {
onClick: _cache[0] || (_cache[0] = ($event) => changeDelay(0))
}, "0ms"),
createBaseVNode("li", {
onClick: _cache[1] || (_cache[1] = ($event) => changeDelay(15))
}, "15ms"),
createBaseVNode("li", {
onClick: _cache[2] || (_cache[2] = ($event) => changeDelay(50))
}, "50ms"),
createBaseVNode("li", {
onClick: _cache[3] || (_cache[3] = ($event) => changeDelay(100))
}, "100ms"),
createBaseVNode("li", null, [
createVNode(_sfc_main$i, null, {
trigger: withCtx(() => _cache[6] || (_cache[6] = [
createBaseVNode("span", null, "Custom delay", -1)
])),
content: withCtx(() => [
_cache[9] || (_cache[9] = createBaseVNode("h4", { class: "text-slate-50 mb-4" }, "Custom delay", -1)),
createBaseVNode("form", {
class: "grid gap-4 w-44",
onSubmit: _cache[4] || (_cache[4] = withModifiers(($event) => changeDelay(parseInt(_ctx.$refs.customDelayInput.value)), ["prevent"]))
}, [
createBaseVNode("div", null, [
createBaseVNode("input", _hoisted_1$a, null, 512),
_cache[7] || (_cache[7] = createBaseVNode("span", null, "ms", -1))
]),
createBaseVNode("div", _hoisted_2$9, [
createVNode(_sfc_main$h, {
variant: "primary",
size: "sm"
}, {
default: withCtx(() => _cache[8] || (_cache[8] = [
createTextVNode("Set custom delay")
])),
_: 1
})
])
], 32)
]),
_: 1
})
])
])
]),
_: 1
}, 512);
};
}
};
const FixedDelayMenu = /* @__PURE__ */ _export_sfc(_sfc_main$a, [["__scopeId", "data-v-597b5d4a"]]);
const _hoisted_1$9 = {
id: "edit-key-dialog",
class: "dialog__content"
};
const _hoisted_2$8 = {
class: "grid gap-4",
"submit.prevent": ""
};
const _hoisted_3$5 = { class: "flex gap-2 justify-center" };
const _hoisted_4$3 = { class: "flex justify-end" };
const _sfc_main$9 = {
__name: "EditKeyDialog",
setup(__props) {
const editable = reactive({
key: {},
newKey: {}
});
const macroRecorder = useMacroRecorderStore();
const newKeyInput = ref(null);
onMounted(() => {
editable.key = macroRecorder.getEditKey();
editable.newKey.direction = editable.key.direction;
});
const handleNewKey = (e) => {
editable.newKey.e = e;
editable.newKey.keyObj = filterKey(e);
};
const handleNewDirection = (direction) => {
editable.newKey.direction = direction;
editable.newKey.keyObj = filterKey(editable.key);
};
const changeKey = () => {
macroRecorder.recordStep(
editable.newKey.e,
editable.newKey.direction,
macroRecorder.state.editKey
);
macroRecorder.state.editKey = false;
};
return (_ctx, _cache) => {
return openBlock(), createElementBlock("div", _hoisted_1$9, [
_cache[9] || (_cache[9] = createBaseVNode("h4", { class: "text-slate-50 mb-4" }, "Press a key", -1)),
createBaseVNode("div", {
class: "flex justify-center",
onClick: _cache[0] || (_cache[0] = ($event) => _ctx.$refs.newKeyInput.focus())
}, [
editable.key.keyObj ? (openBlock(), createBlock(_sfc_main$f, {
key: 0,
"key-obj": editable.key.keyObj,
direction: editable.key.direction
}, null, 8, ["key-obj", "direction"])) : createCommentVNode("", true),
typeof editable.newKey.keyObj === "object" ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
_cache[5] || (_cache[5] = createBaseVNode("span", { class: "px-4 flex items-center text-white" }, " >>> ", -1)),
createVNode(_sfc_main$f, {
"key-obj": editable.newKey.keyObj,
direction: editable.newKey.direction
}, null, 8, ["key-obj", "direction"])
], 64)) : createCommentVNode("", true)
]),
createBaseVNode("form", _hoisted_2$8, [
createBaseVNode("input", {
class: "size-0 opacity-0",
type: "text",
min: "0",
max: "1",
ref_key: "newKeyInput",
ref: newKeyInput,
placeholder: "New key",
autofocus: "",
onKeydown: _cache[1] || (_cache[1] = withModifiers(($event) => handleNewKey($event), ["prevent"]))
}, null, 544),
createBaseVNode("div", _hoisted_3$5, [
createVNode(_sfc_main$h, {
variant: "secondary",
class: normalizeClass(editable.newKey.direction === "down" ? "selected" : ""),
size: "sm",
onClick: _cache[2] || (_cache[2] = withModifiers(($event) => handleNewDirection("down"), ["prevent"]))
}, {
default: withCtx(() => _cache[6] || (_cache[6] = [
createTextVNode(" ↓ Down ")
])),
_: 1
}, 8, ["class"]),
createVNode(_sfc_main$h, {
variant: "secondary",
class: normalizeClass(editable.newKey.direction === "up" ? "selected" : ""),
size: "sm",
onClick: _cache[3] || (_cache[3] = withModifiers(($event) => handleNewDirection("up"), ["prevent"]))
}, {
default: withCtx(() => _cache[7] || (_cache[7] = [
createTextVNode(" ↑ Up ")
])),
_: 1
}, 8, ["class"])
]),
createBaseVNode("div", _hoisted_4$3, [
createVNode(_sfc_main$h, {
variant: "primary",
size: "sm",
onClick: _cache[4] || (_cache[4] = withModifiers(($event) => changeKey(), ["prevent"]))
}, {
default: withCtx(() => _cache[8] || (_cache[8] = [
createTextVNode(" Change key ")
])),
_: 1
})
])
])
]);
};
}
};
const EditKeyDialog = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__scopeId", "data-v-601167b6"]]);
const _hoisted_1$8 = {
id: "edit-delay-dialog",
class: "dialog__content"
};
const _hoisted_2$7 = {
key: 0,
class: "flex justify-center"
};
const _hoisted_3$4 = {
class: "grid gap-4 mt-6",
"submit.prevent": ""
};
const _hoisted_4$2 = { key: 0 };
const _hoisted_5$2 = { class: "flex justify-end" };
const _sfc_main$8 = {
__name: "EditDelayDialog",
setup(__props) {
const macroRecorder = useMacroRecorderStore();
const editable = reactive({
delay: {},
newDelay: { value: 0 }
});
onMounted(() => {
editable.delay = macroRecorder.getEditDelay();
editable.newDelay.value = editable.delay.value;
console.log(editable);
});
const changeDelay = () => {
if (!editable.newDelay.value) return;
macroRecorder.recordStep(editable.newDelay.value, false, macroRecorder.state.editDelay);
macroRecorder.state.editDelay = false;
};
return (_ctx, _cache) => {
return openBlock(), createElementBlock("div", _hoisted_1$8, [
_cache[4] || (_cache[4] = createBaseVNode("h4", { class: "text-slate-50 mb-4" }, "Edit delay", -1)),
editable.delay.value ? (openBlock(), createElementBlock("div", _hoisted_2$7, [
createVNode(DelaySpan, {
class: "!text-lg",
value: editable.delay.value
}, null, 8, ["value"])
])) : createCommentVNode("", true),
createBaseVNode("form", _hoisted_3$4, [
editable.newDelay.value ? (openBlock(), createElementBlock("div", _hoisted_4$2, [
withDirectives(createBaseVNode("input", {
type: "number",
min: "0",
max: "3600000",
step: "10",
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => editable.newDelay.value = $event),
autofocus: ""
}, null, 512), [
[vModelText, editable.newDelay.value]
]),
_cache[2] || (_cache[2] = createBaseVNode("span", null, "ms", -1))
])) : createCommentVNode("", true),
createBaseVNode("div", _hoisted_5$2, [
createVNode(_sfc_main$h, {
variant: "primary",
size: "sm",
onClick: _cache[1] || (_cache[1] = withModifiers(($event) => changeDelay(), ["prevent"]))
}, {
default: withCtx(() => _cache[3] || (_cache[3] = [
createTextVNode(" Change delay ")
])),
_: 1
})
])
])
]);
};
}
};
const EditDelayDialog = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["__scopeId", "data-v-d4c82ec9"]]);
const _hoisted_1$7 = {
id: "delete-key-dialog",
class: "dialog__content"
};
const _hoisted_2$6 = { class: "flex justify-center w-full mb-4" };
const _hoisted_3$3 = { class: "flex justify-end gap-2 mt-6" };
const _sfc_main$7 = {
__name: "DeleteKeyDialog",
setup(__props) {
const macroRecorder = useMacroRecorderStore();
const keyObj = ref(null);
onMounted(() => {
keyObj.value = filterKey(macroRecorder.getEditKey());
});
return (_ctx, _cache) => {
return openBlock(), createElementBlock("div", _hoisted_1$7, [
_cache[2] || (_cache[2] = createBaseVNode("h4", { class: "text-slate-50 mb-4" }, "Delete key", -1)),
createBaseVNode("div", _hoisted_2$6, [
keyObj.value ? (openBlock(), createBlock(_sfc_main$f, {
key: 0,
"key-obj": keyObj.value
}, null, 8, ["key-obj"])) : createCommentVNode("", true)
]),
_cache[3] || (_cache[3] = createBaseVNode("p", { class: "text-sm text-slate-300" }, "Are you sure you want to delete this key?", -1)),
createBaseVNode("div", _hoisted_3$3, [
createVNode(_sfc_main$h, {
variant: "danger",
size: "sm",
onClick: _cache[0] || (_cache[0] = ($event) => unref(macroRecorder).deleteEditKey())
}, {
default: withCtx(() => _cache[1] || (_cache[1] = [
createTextVNode(" Delete key ")
])),
_: 1
})
])
]);
};
}
};
const DeleteKeyDialog = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["__scopeId", "data-v-7dc19ba4"]]);
const _hoisted_1$6 = {
id: "insert-key-dialog",
class: "dialog__content w-96"
};
const _hoisted_2$5 = { class: "text-slate-50 mb-4" };
const _hoisted_3$2 = {
key: 0,
class: "text-center"
};
const _hoisted_4$1 = { class: "insert-key__direction" };
const _hoisted_5$1 = { class: "flex justify-end" };
const _sfc_main$6 = {
__name: "InsertKeyDialog",
props: {
position: String
},
setup(__props) {
const props = __props;
const macroRecorder = useMacroRecorderStore();
const keyObjs = reactive({
selected: null,
insert: null,
insertEvent: null,
insertDirection: "down",
adjacent: null,
adjacentDelay: null,
adjacentDelayIndex: null
});
const insertKeyInput = ref(null);
const inputFocus = ref(false);
onMounted(() => {
keyObjs.selected = filterKey(macroRecorder.getEditKey());
const adjacentKey = macroRecorder.getAdjacentKey(props.position, true);
if (adjacentKey) keyObjs.adjacent = filterKey(adjacentKey.key);
if (adjacentKey.delay) {
keyObjs.adjacentDelay = adjacentKey.delay;
keyObjs.adjacentDelayIndex = adjacentKey.delayIndex;
}
});
const handleInsertKey = (e) => {
keyObjs.insert = filterKey(e);
keyObjs.insertEvent = e;
};
const insertKey = () => {
macroRecorder.insertKey(keyObjs.insertEvent, keyObjs.insertDirection, keyObjs.adjacentDelayIndex);
};
return (_ctx, _cache) => {
return openBlock(), createElementBlock("div", _hoisted_1$6, [
createBaseVNode("h4", _hoisted_2$5, "Insert key " + toDisplayString(__props.position), 1),
inputFocus.value ? (openBlock(), createElementBlock("p", _hoisted_3$2, "[Press a key]")) : createCommentVNode("", true),
createBaseVNode("input", {
class: "size-0 opacity-0",
type: "text",
min: "0",
max: "1",
ref_key: "insertKeyInput",
ref: insertKeyInput,
placeholder: "New key",
onFocusin: _cache[0] || (_cache[0] = ($event) => inputFocus.value = true),
onFocusout: _cache[1] || (_cache[1] = ($event) => inputFocus.value = false),
onKeydown: _cache[2] || (_cache[2] = withModifiers(($event) => handleInsertKey($event), ["prevent"])),
autofocus: ""
}, null, 544),
createBaseVNode("div", {
class: normalizeClass(["insert-output", __props.position == "before" ? "flex-row-reverse" : ""])
}, [
keyObjs.selected ? (openBlock(), createBlock(_sfc_main$f, {
key: 0,
"key-obj": keyObjs.selected
}, null, 8, ["key-obj"])) : createCommentVNode("", true),
_cache[10] || (_cache[10] = createBaseVNode("hr", { class: "spacer" }, null, -1)),
createVNode(DelaySpan, {
preset: true,
value: 10
}),
_cache[11] || (_cache[11] = createBaseVNode("hr", { class: "spacer" }, null, -1)),
keyObjs.insert ? (openBlock(), createBlock(_sfc_main$f, {
key: 1,
class: "insert",
"key-obj": keyObjs.insert,
direction: keyObjs.insertDirection,
onClick: _cache[3] || (_cache[3] = ($event) => insertKeyInput.value.focus())
}, null, 8, ["key-obj", "direction"])) : createCommentVNode("", true),
!keyObjs.insert ? (openBlock(), createBlock(_sfc_main$f, {
key: 2,
empty: true,
onClick: _cache[4] || (_cache[4] = ($event) => insertKeyInput.value.focus())
})) : createCommentVNode("", true),
keyObjs.adjacentDelay ? (openBlock(), createElementBlock(Fragment, { key: 3 }, [
_cache[8] || (_cache[8] = createBaseVNode("hr", { class: "spacer" }, null, -1)),
createVNode(DelaySpan, {
value: keyObjs.adjacentDelay.value
}, null, 8, ["value"])
], 64)) : createCommentVNode("", true),
keyObjs.adjacent ? (openBlock(), createElementBlock(Fragment, { key: 4 }, [
_cache[9] || (_cache[9] = createBaseVNode("hr", { class: "spacer" }, null, -1)),
createVNode(_sfc_main$f, {
"key-obj": keyObjs.adjacent
}, null, 8, ["key-obj"])
], 64)) : createCommentVNode("", true)
], 2),
createBaseVNode("div", _hoisted_4$1, [
createVNode(_sfc_main$h, {
variant: "secondary",
class: normalizeClass(keyObjs.insertDirection === "down" ? "selected" : ""),
size: "sm",
onClick: _cache[5] || (_cache[5] = withModifiers(($event) => keyObjs.insertDirection = "down", ["prevent"]))
}, {
default: withCtx(() => _cache[12] || (_cache[12] = [
createTextVNode(" ↓ Down ")
])),
_: 1
}, 8, ["class"]),
createVNode(_sfc_main$h, {
variant: "secondary",
class: normalizeClass(keyObjs.insertDirection === "up" ? "selected" : ""),
size: "sm",
onClick: _cache[6] || (_cache[6] = withModifiers(($event) => keyObjs.insertDirection = "up", ["prevent"]))
}, {
default: withCtx(() => _cache[13] || (_cache[13] = [
createTextVNode(" ↑ Up ")
])),
_: 1
}, 8, ["class"])
]),
createBaseVNode("div", _hoisted_5$1, [
createVNode(_sfc_main$h, {
variant: "primary",
size: "sm",
onClick: _cache[7] || (_cache[7] = ($event) => insertKey())
}, {
default: withCtx(() => _cache[14] || (_cache[14] = [
createTextVNode("Insert key")
])),
_: 1
})
])
]);
};
}
};
const InsertKeyDialog = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["__scopeId", "data-v-d2aab140"]]);
const _hoisted_1$5 = {
key: 0,
class: "macro-edit__dialogs"
};
const _hoisted_2$4 = {
key: 0,
class: "flex gap-2"
};
const _sfc_main$5 = {
__name: "EditDialogs",
setup(__props) {
const macroRecorder = useMacroRecorderStore();
const insert = reactive({ position: null });
const ctxtMenu = ref();
onMounted(() => {
macroRecorder.$subscribe((mutation) => {
if (mutation.events && mutation.events.key == "editKey" && mutation.events.newValue === false) {
insert.position = null;
}
});
});
function onOpenDialog() {
if (insert.position !== null) ctxtMenu.value.toggle();
}
function onCloseDialog() {
macroRecorder.state.editKey = false;
macroRecorder.state.editDelay = false;
insert.position = null;
}
return (_ctx, _cache) => {
return unref(macroRecorder).state.edit !== false ? (openBlock(), createElementBlock("div", _hoisted_1$5, [
unref(macroRecorder).state.editKey !== false && typeof unref(macroRecorder).getEditKey() === "object" ? (openBlock(), createElementBlock("div", _hoisted_2$4, [
createVNode(_sfc_main$b, {
ref_key: "ctxtMenu",
ref: ctxtMenu
}, {
trigger: withCtx(() => [
createVNode(_sfc_main$h, {
variant: "dark",
size: "sm"
}, {
default: withCtx(() => [
createVNode(unref(IconPlus)),
_cache[2] || (_cache[2] = createTextVNode(" Insert "))
]),
_: 1
})
]),
content: withCtx(() => [
createBaseVNode("ul", null, [
createBaseVNode("li", {
onClick: _cache[0] || (_cache[0] = ($event) => insert.position = "before")
}, [
createVNode(unref(IconArrowLeftCircle)),
_cache[3] || (_cache[3] = createTextVNode(" Before"))
]),
createBaseVNode("li", {
onClick: _cache[1] || (_cache[1] = ($event) => insert.position = "after")
}, [
createVNode(unref(IconArrowRightCircle)),
_cache[4] || (_cache[4] = createTextVNode(" After"))
])
])
]),
_: 1
}, 512),
insert.position !== null ? (openBlock(), createBlock(_sfc_main$i, {
key: 0,
open: insert.position !== null,
onOnOpen: onOpenDialog,
onOnClose: onCloseDialog
}, {
content: withCtx(() => [
createVNode(InsertKeyDialog, {
position: insert.position
}, null, 8, ["position"])
]),
_: 1
}, 8, ["open"])) : createCommentVNode("", true),
createVNode(_sfc_main$i, {
id: `edit-key-${unref(macroRecorder).state.editKey}`,
onOnOpen: onOpenDialog,
onOnClose: onCloseDialog
}, {
trigger: withCtx(() => [
createVNode(_sfc_main$h, {
variant: "secondary",
size: "sm"
}, {
default: withCtx(() => [
createVNode(unref(IconPencil)),
_cache[5] || (_cache[5] = createTextVNode("Edit "))
]),
_: 1
})
]),
content: withCtx(() => [
createVNode(EditKeyDialog)
]),
_: 1
}, 8, ["id"]),
createVNode(_sfc_main$i, {
onOnOpen: onOpenDialog,
onOnClose: onCloseDialog
}, {
trigger: withCtx(() => [
createVNode(_sfc_main$h, {
size: "sm",
variant: "danger"
}, {
default: withCtx(() => [
createVNode(unref(IconTrash)),
_cache[6] || (_cache[6] = createTextVNode("Delete "))
]),
_: 1
})
]),
content: withCtx(() => [
createVNode(DeleteKeyDialog)
]),
_: 1
})
])) : createCommentVNode("", true),
unref(macroRecorder).state.editDelay !== false && typeof unref(macroRecorder).getEditDelay() === "object" ? (openBlock(), createBlock(_sfc_main$i, {
key: 1,
onOnOpen: onOpenDialog,
onOnClose: onCloseDialog
}, {
trigger: withCtx(() => [
createVNode(_sfc_main$h, {
variant: "secondary",
size: "sm"
}, {
default: withCtx(() => [
createVNode(unref(IconAlarm)),
_cache[7] || (_cache[7] = createTextVNode("Edit "))
]),
_: 1
})
]),
content: withCtx(() => [
createVNode(EditDelayDialog)
]),
_: 1
})) : createCommentVNode("", true)
])) : createCommentVNode("", true);
};
}
};
const EditDialogs = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-bf9e32be"]]);
const _hoisted_1$4 = { class: "macro-recorder__header" };
const _hoisted_2$3 = { class: "w-full grid grid-cols-[auto_1fr_auto] gap-2" };
const _sfc_main$4 = {
__name: "RecorderHeader",
setup(__props) {
const macroRecorder = useMacroRecorderStore();
const nameSet = ref(false);
function changeName(name) {
macroRecorder.changeName(name);
nameSet.value = name.length > 0;
}
return (_ctx, _cache) => {
return openBlock(), createElementBlock("div", _hoisted_1$4, [
createBaseVNode("div", _hoisted_2$3, [
_cache[7] || (_cache[7] = createBaseVNode("h4", { class: "" }, "Name:", -1)),
createBaseVNode("input", {
id: "macro-name",
type: "text",
onInput: _cache[0] || (_cache[0] = withModifiers(($event) => changeName($event.target.value), ["prevent"])),
placeholder: "New macro"
}, null, 32),
createBaseVNode("div", {
class: normalizeClass(`recording__buttons ${!nameSet.value || unref(macroRecorder).state.edit ? "disabled" : ""}`)
}, [
createTextVNode(toDisplayString(unref(macroRecorder).name) + " ", 1),
!unref(macroRecorder).state.record ? (openBlock(), createBlock(_sfc_main$h, {
key: 0,
variant: "primary",
size: "sm",
onClick: _cache[1] || (_cache[1] = ($event) => unref(macroRecorder).state.record = true)
}, {
default: withCtx(() => [
createVNode(unref(IconPlayerRecordFilled), { class: "text-red-500" }),
_cache[5] || (_cache[5] = createTextVNode("Record "))
]),
_: 1
})) : createCommentVNode("", true),
unref(macroRecorder).state.record ? (openBlock(), createBlock(_sfc_main$h, {
key: 1,
variant: "danger",
size: "sm",
onClick: _cache[2] || (_cache[2] = ($event) => unref(macroRecorder).state.record = false)
}, {
default: withCtx(() => [
createVNode(unref(IconPlayerStopFilled), { class: "text-white" }),
_cache[6] || (_cache[6] = createTextVNode("Stop "))
]),
_: 1
})) : createCommentVNode("", true)
], 2)
]),
unref(macroRecorder).steps.length > 0 ? (openBlock(), createElementBlock("div", {
key: 0,
class: normalizeClass(`edit__buttons ${unref(macroRecorder).state.record ? "disabled" : ""}`)
}, [
createBaseVNode("div", null, [
!unref(macroRecorder).state.edit ? (openBlock(), createBlock(_sfc_main$h, {
key: 0,
variant: "secondary",
size: "sm",
onClick: _cache[3] || (_cache[3] = ($event) => unref(macroRecorder).state.edit = true)
}, {
default: withCtx(() => [
createVNode(unref(IconPencil)),
_cache[8] || (_cache[8] = createTextVNode("Edit "))
]),
_: 1
})) : createCommentVNode("", true),
unref(macroRecorder).state.edit ? (openBlock(), createBlock(_sfc_main$h, {
key: 1,
variant: "danger",
size: "sm",
onClick: _cache[4] || (_cache[4] = ($event) => unref(macroRecorder).resetEdit())
}, {
default: withCtx(() => [
createVNode(unref(IconPlayerStopFilled)),
_cache[9] || (_cache[9] = createTextVNode("Stop "))
]),
_: 1
})) : createCommentVNode("", true)
]),
unref(macroRecorder).state.edit ? (openBlock(), createBlock(FixedDelayMenu, { key: 0 })) : createCommentVNode("", true),
createVNode(EditDialogs)
], 2)) : createCommentVNode("", true)
]);
};
}
};
const RecorderHeader = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__scopeId", "data-v-19251359"]]);
const _hoisted_1$3 = {
id: "validation-error__dialog",
class: "dialog__content"
};
const _hoisted_2$2 = {
key: 0,
class: "grid gap-4"
};
const _hoisted_3$1 = { key: 0 };
const _hoisted_4 = { key: 1 };
const _hoisted_5 = { class: "flex justify-end mt-4" };
const _sfc_main$3 = {
__name: "ValidationErrorDialog",
setup(__props) {
const macroRecorder = useMacroRecorderStore();
const errors = reactive({
up: [],
down: []
});
onMounted(() => {
macroRecorder.$subscribe((mutation) => {
if (mutation.events && mutation.events.key == "validationErrors") {
errors.up = mutation.events.newValue !== false ? macroRecorder.state.validationErrors.up : [];
errors.down = mutation.events.newValue !== false ? macroRecorder.state.validationErrors.down : [];
}
console.log(mutation);
});
});
return (_ctx, _cache) => {
return openBlock(), createElementBlock("div", _hoisted_1$3, [
_cache[4] || (_cache[4] = createBaseVNode("h4", { class: "text-slate-50 mb-4" }, "There's an error in your macro", -1)),
errors && errors.up.length > 0 || errors.down.length > 0 ? (openBlock(), createElementBlock("div", _hoisted_2$2, [
errors.down.length > 0 ? (openBlock(), createElementBlock("div", _hoisted_3$1, [
_cache[1] || (_cache[1] = createBaseVNode("p", null, [
createTextVNode(" The following keys have been "),
createBaseVNode("strong", null, "pressed"),
createTextVNode(" down, but "),
createBaseVNode("strong", null, "not released"),
createTextVNode(". ")
], -1)),
createBaseVNode("ul", null, [
(openBlock(true), createElementBlock(Fragment, null, renderList(errors.down, (key) => {
return openBlock(), createElementBlock("li", { key }, toDisplayString(key.toUpperCase()), 1);
}), 128))
])
])) : createCommentVNode("", true),
errors.up.length > 0 ? (openBlock(), createElementBlock("div", _hoisted_4, [
_cache[2] || (_cache[2] = createBaseVNode("p", null, [
createTextVNode(" The following keys have been "),
createBaseVNode("strong", null, "released"),
createTextVNode(", but "),
createBaseVNode("strong", null, "not pressed"),
createTextVNode(" down. ")
], -1)),
createBaseVNode("ul", null, [
(openBlock(true), createElementBlock(Fragment, null, renderList(errors.up, (key) => {
return openBlock(), createElementBlock("li", { key }, toDisplayString(key.toUpperCase()), 1);
}), 128))
])
])) : createCommentVNode("", true)
])) : createCommentVNode("", true),
createBaseVNode("div", _hoisted_5, [
createVNode(_sfc_main$h, {
size: "sm",
variant: "danger",
onClick: _cache[0] || (_cache[0] = ($event) => unref(macroRecorder).state.validationErrors = false)
}, {
default: withCtx(() => _cache[3] || (_cache[3] = [
createTextVNode(" Close ")
])),
_: 1
})
])
]);
};
}
};
const ValidationErrorDialog = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-ff532573"]]);
const _hoisted_1$2 = { class: "macro-recorder__footer" };
const _sfc_main$2 = {
__name: "RecorderFooter",
setup(__props) {
const macroRecorder = useMacroRecorderStore();
const errorDialog = ref();
onMounted(() => {
macroRecorder.$subscribe((mutation) => {
if (mutation.events && mutation.events.key == "validationErrors") {
errorDialog.value.toggleDialog(mutation.events.newValue !== false);
}
});
});
const toggleSave = () => {
if (!macroRecorder.save()) errorDialog.value.toggleDialog(true);
};
return (_ctx, _cache) => {
return openBlock(), createElementBlock("div", _hoisted_1$2, [
unref(macroRecorder).steps.length > 0 ? (openBlock(), createBlock(_sfc_main$h, {
key: 0,
variant: "danger",
size: "sm",
onClick: _cache[0] || (_cache[0] = ($event) => unref(macroRecorder).reset())
}, {
default: withCtx(() => [
createVNode(unref(IconRestore)),
_cache[2] || (_cache[2] = createTextVNode(" Reset "))
]),
_: 1
})) : createCommentVNode("", true),
createVNode(_sfc_main$i, {
ref_key: "errorDialog",
ref: errorDialog
}, {
content: withCtx(() => [
createVNode(ValidationErrorDialog)
]),
_: 1
}, 512),
unref(macroRecorder).steps.length > 0 ? (openBlock(), createBlock(_sfc_main$h, {
key: 1,
disabled: unref(macroRecorder).state.record || unref(macroRecorder).state.edit,
variant: "success",
size: "sm",
onClick: _cache[1] || (_cache[1] = ($event) => toggleSave())
}, {
default: withCtx(() => [
createVNode(unref(IconDeviceFloppy)),
_cache[3] || (_cache[3] = createTextVNode(" Save "))
]),
_: 1
}, 8, ["disabled"])) : createCommentVNode("", true)
]);
};
}
};
const RecorderFooter = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-fec5e8b6"]]);
const _hoisted_1$1 = { class: "macro-recorder mcrm-block block__light" };
const _hoisted_2$1 = { class: "recorder-interface" };
const _sfc_main$1 = {
__name: "MacroRecorder",
setup(__props) {
const macroRecorder = useMacroRecorderStore();
return (_ctx, _cache) => {
return openBlock(), createElementBlock("div", _hoisted_1$1, [
createBaseVNode("div", _hoisted_2$1, [
createVNode(RecorderHeader),
createBaseVNode("div", {
class: normalizeClass(`recorder-interface__container ${unref(macroRecorder).state.record && "record"} ${unref(macroRecorder).state.edit && "edit"}`)
}, [
createVNode(RecorderOutput),
createVNode(RecorderInput)
], 2),
createVNode(RecorderFooter)
])
]);
};
}
};
const _hoisted_1 = {
id: "macros",
class: "panel"
};
const _hoisted_2 = { class: "panel__content !p-0" };
const _hoisted_3 = { class: "macro-panel__content" };
const _sfc_main = {
__name: "MacrosView",
setup(__props) {
ref(false);
ref(null);
onMounted(() => {
});
return (_ctx, _cache) => {
return openBlock(), createElementBlock("div", _hoisted_1, [
_cache[0] || (_cache[0] = createBaseVNode("h1", { class: "panel__title" }, "Macros", -1)),
createBaseVNode("div", _hoisted_2, [
createBaseVNode("div", _hoisted_3, [
createVNode(MacroOverview),
createVNode(_sfc_main$1)
])
])
]);
};
}
};
const MacrosView = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-c7be9772"]]);
export {
MacrosView as default
};