From b2f3b8f22750e920c82335e3a753ecd8e7e3b01e Mon Sep 17 00:00:00 2001 From: Stefan Dej Date: Tue, 22 Oct 2024 23:45:46 +0200 Subject: [PATCH 1/3] feat(Console): Change from Helplist to Printer.Gcode Signed-off-by: Stefan Dej --- .../{ => console}/CommandHelpModal.vue | 69 +++++++------------ .../console/CommandHelpModalEntry.vue | 41 +++++++++++ src/components/console/ConsoleTable.vue | 2 +- src/components/inputs/ConsoleTextarea.vue | 7 +- src/components/mixins/console.ts | 9 ++- src/components/panels/MiniconsolePanel.vue | 2 +- src/locales/en.json | 1 + src/pages/Console.vue | 2 +- src/plugins/webSocketClient.ts | 4 +- src/store/printer/actions.ts | 63 ++++++++--------- src/store/printer/mutations.ts | 30 ++++---- src/store/printer/types.ts | 12 ---- src/store/server/actions.ts | 1 + 13 files changed, 129 insertions(+), 114 deletions(-) rename src/components/{ => console}/CommandHelpModal.vue (55%) create mode 100644 src/components/console/CommandHelpModalEntry.vue diff --git a/src/components/CommandHelpModal.vue b/src/components/console/CommandHelpModal.vue similarity index 55% rename from src/components/CommandHelpModal.vue rename to src/components/console/CommandHelpModal.vue index b7712c16f..98fa921af 100644 --- a/src/components/CommandHelpModal.vue +++ b/src/components/console/CommandHelpModal.vue @@ -33,42 +33,24 @@ + dense /> - + - - - - - - - {{ cmd.command }} - - - {{ cmd.description }} - - - - - - + + + @@ -77,15 +59,15 @@ diff --git a/src/components/console/CommandHelpModalEntry.vue b/src/components/console/CommandHelpModalEntry.vue new file mode 100644 index 000000000..ceb00aa35 --- /dev/null +++ b/src/components/console/CommandHelpModalEntry.vue @@ -0,0 +1,41 @@ + + + diff --git a/src/components/console/ConsoleTable.vue b/src/components/console/ConsoleTable.vue index 284d5570d..917976c59 100644 --- a/src/components/console/ConsoleTable.vue +++ b/src/components/console/ConsoleTable.vue @@ -13,7 +13,7 @@ :key="index" class="consoleTableRow" :event="event" - @command-click="commandClick"> + @command-click="commandClick" /> diff --git a/src/components/inputs/ConsoleTextarea.vue b/src/components/inputs/ConsoleTextarea.vue index 8663a9286..604772121 100644 --- a/src/components/inputs/ConsoleTextarea.vue +++ b/src/components/inputs/ConsoleTextarea.vue @@ -100,8 +100,8 @@ export default class ConsoleTextarea extends Mixins(BaseMixin, ConsoleMixin) { const lastNewlineIndex = beforeCursor.lastIndexOf('\n') const currentLine = beforeCursor.substring(lastNewlineIndex + 1) - const currentLineLowerCase = currentLine.toLowerCase() - const commands = this.helplist.filter((element) => element.commandLow.startsWith(currentLineLowerCase)) + const currentLineUpperCase = currentLine.toUpperCase() + const commands = this.helplist.filter((element) => element.command.startsWith(currentLineUpperCase)) if (commands.length === 0) return @@ -116,8 +116,7 @@ export default class ConsoleTextarea extends Mixins(BaseMixin, ConsoleMixin) { let output = '' commands.forEach( - (command) => - (output += `${command.command}: ${command.description}
`) + (command) => (output += `${command.command}: ${command.help}
`) ) this.$store.dispatch('server/addEvent', { message: output, type: 'autocomplete' }) diff --git a/src/components/mixins/console.ts b/src/components/mixins/console.ts index 1709f6e89..679c2e987 100644 --- a/src/components/mixins/console.ts +++ b/src/components/mixins/console.ts @@ -6,7 +6,14 @@ import { GuiConsoleStateFilter } from '@/store/gui/console/types' @Component export default class ConsoleMixin extends Vue { get helplist(): CommandHelp[] { - return this.$store.state.printer.helplist ?? [] + const commands = this.$store.state.printer.gcode?.commands ?? {} + const helplist: { command: string; help: string } = [] + + for (const [key, values] of Object.entries(commands)) { + helplist.push({ command: key, help: values.help ?? '' }) + } + + return helplist } get consoleDirection() { diff --git a/src/components/panels/MiniconsolePanel.vue b/src/components/panels/MiniconsolePanel.vue index 98c6499d7..93178fad7 100644 --- a/src/components/panels/MiniconsolePanel.vue +++ b/src/components/panels/MiniconsolePanel.vue @@ -91,7 +91,7 @@ import BaseMixin from '@/components/mixins/base' import ConsoleTable from '@/components/console/ConsoleTable.vue' import Panel from '@/components/ui/Panel.vue' import { mdiCog, mdiConsoleLine, mdiTrashCan } from '@mdi/js' -import CommandHelpModal from '@/components/CommandHelpModal.vue' +import CommandHelpModal from '@/components/console/CommandHelpModal.vue' import ConsoleMixin from '@/components/mixins/console' import ConsoleTextarea from '@/components/inputs/ConsoleTextarea.vue' diff --git a/src/locales/en.json b/src/locales/en.json index d12f4e76e..36717a632 100644 --- a/src/locales/en.json +++ b/src/locales/en.json @@ -164,6 +164,7 @@ "Empty": "Empty", "HideTemperatures": "Hide temperatures", "HideTimelapse": "Hide Timelapse", + "Search": "Search", "SendCode": "Send code...", "SetupConsole": "Setup Console" }, diff --git a/src/pages/Console.vue b/src/pages/Console.vue index a9ca31d6d..a567ac320 100644 --- a/src/pages/Console.vue +++ b/src/pages/Console.vue @@ -83,7 +83,7 @@ import { Component, Mixins, Ref, Watch } from 'vue-property-decorator' import BaseMixin from '@/components/mixins/base' import ConsoleTable from '@/components/console/ConsoleTable.vue' -import CommandHelpModal from '@/components/CommandHelpModal.vue' +import CommandHelpModal from '@/components/console/CommandHelpModal.vue' import { mdiCog, mdiTrashCan } from '@mdi/js' import ConsoleMixin from '@/components/mixins/console' import ConsoleTextarea from '@/components/inputs/ConsoleTextarea.vue' diff --git a/src/plugins/webSocketClient.ts b/src/plugins/webSocketClient.ts index e1618eac5..e69d5c823 100644 --- a/src/plugins/webSocketClient.ts +++ b/src/plugins/webSocketClient.ts @@ -179,7 +179,7 @@ export class WebSocketClient { ) } - async emitAndWait(method: string, params: Params, options: emitOptions = {}): Promise { + async emitAndWait(method: string, params: Params | null, options: emitOptions = {}): Promise { return new Promise((resolve, reject) => { if (this.instance?.readyState !== WebSocket.OPEN) reject() @@ -200,7 +200,7 @@ export class WebSocketClient { JSON.stringify({ jsonrpc: '2.0', method, - params, + params: params ?? undefined, id, }) ) diff --git a/src/store/printer/actions.ts b/src/store/printer/actions.ts index 646953616..02e0a75bf 100644 --- a/src/store/printer/actions.ts +++ b/src/store/printer/actions.ts @@ -16,14 +16,13 @@ export const actions: ActionTree = { dispatch('socket/addInitModule', 'printer/info', { root: true }) dispatch('socket/addInitModule', 'printer/initSubscripts', { root: true }) - dispatch('socket/addInitModule', 'printer/initHelpList', { root: true }) dispatch('socket/addInitModule', 'printer/initTempHistory', { root: true }) dispatch('socket/addInitModule', 'server/gcode_store', { root: true }) Vue.$socket.emit('printer.info', {}, { action: 'printer/getInfo' }) - Vue.$socket.emit('printer.objects.list', {}, { action: 'printer/initSubscripts' }) - Vue.$socket.emit('printer.gcode.help', {}, { action: 'printer/initHelpList' }) Vue.$socket.emit('server.gcode_store', {}, { action: 'server/getGcodeStore' }) + + dispatch('initSubscripts') }, getInfo({ commit, dispatch }, payload) { @@ -46,7 +45,9 @@ export const actions: ActionTree = { dispatch('socket/removeInitModule', 'printer/info', { root: true }) }, - initSubscripts({ dispatch }, payload) { + async initSubscripts({ dispatch }) { + const payload = await Vue.$socket.emitAndWait('printer.objects.list', null, {}) + let subscripts = {} const blocklist = ['menu'] @@ -56,31 +57,25 @@ export const actions: ActionTree = { if (!blocklist.includes(nameSplit[0])) subscripts = { ...subscripts, [key]: null } }) - if (Object.keys(subscripts).length > 0) - Vue.$socket.emit('printer.objects.subscribe', { objects: subscripts }, { action: 'printer/getInitData' }) - else - Vue.$socket.emit( - 'server.temperature_store', - { include_monitors: true }, - { action: 'printer/tempHistory/init' } - ) + if (Object.keys(subscripts).length > 0) { + const result = await Vue.$socket.emitAndWait('printer.objects.subscribe', { objects: subscripts }, {}) - dispatch('socket/removeInitModule', 'printer/initSubscripts', { root: true }) - }, + // reset screws_tilt_adjust if it exists + if ('screws_tilt_adjust' in result.status) { + result.status.screws_tilt_adjust.error = false + result.status.screws_tilt_adjust.results = {} + } - getInitData({ dispatch }, payload) { - if ('screws_tilt_adjust' in payload.status) { - payload.status.screws_tilt_adjust.error = false - payload.status.screws_tilt_adjust.results = {} - } + dispatch('getData', result) - dispatch('getData', payload) + setTimeout(() => { + dispatch('initExtruderCanExtrude') + }, 200) + } Vue.$socket.emit('server.temperature_store', { include_monitors: true }, { action: 'printer/tempHistory/init' }) - setTimeout(() => { - dispatch('initExtruderCanExtrude') - }, 200) + dispatch('socket/removeInitModule', 'printer/initSubscripts', { root: true }) }, getData({ commit, dispatch, state }, payload) { @@ -135,7 +130,13 @@ export const actions: ActionTree = { commit('setData', payload) }, - initExtruderCanExtrude({ state }) { + async initGcodes({ commit }) { + const gcodes = await Vue.$socket.emitAndWait('printer.objects.query', { objects: { gcode: ['commands'] } }, {}) + + commit('setData', gcodes.status) + }, + + async initExtruderCanExtrude({ dispatch, state }) { const extruderList: string[] = Object.keys(state).filter((name) => name.startsWith('extruder')) const reInitList: { [key: string]: string[] } = {} @@ -143,13 +144,8 @@ export const actions: ActionTree = { reInitList[extruderName] = ['can_extrude'] }) - Vue.$socket.emit('printer.objects.query', { objects: reInitList }, { action: 'printer/getData' }) - }, - - initHelpList({ commit, dispatch }, payload) { - commit('setHelplist', payload) - - dispatch('socket/removeInitModule', 'printer/initHelpList', { root: true }) + const result = await Vue.$socket.emitAndWait('printer.objects.query', { objects: reInitList }, {}) + dispatch('getData', result.status) }, getEndstopStatus({ commit }, payload) { @@ -165,9 +161,10 @@ export const actions: ActionTree = { if (payload.toLowerCase().trim() === 'm112') { Vue.$socket.emit('printer.emergency_stop', {}, { loading: 'sendGcode' }) - } else { - Vue.$socket.emit('printer.gcode.script', { script: payload }, { loading: 'sendGcode' }) + return } + + Vue.$socket.emit('printer.gcode.script', { script: payload }, { loading: 'sendGcode' }) }, clearScrewsTiltAdjust({ commit }) { diff --git a/src/store/printer/mutations.ts b/src/store/printer/mutations.ts index 77a1b0232..19e3100d4 100644 --- a/src/store/printer/mutations.ts +++ b/src/store/printer/mutations.ts @@ -2,7 +2,6 @@ import Vue from 'vue' import { getDefaultState } from './index' import { MutationTree } from 'vuex' import { PrinterState } from '@/store/printer/types' -import { setDataDeep } from '@/plugins/helpers' export const mutations: MutationTree = { reset(state) { @@ -20,7 +19,20 @@ export const mutations: MutationTree = { }, setData(state, payload) { - setDataDeep(state, payload) + Object.keys(payload).forEach((key) => { + const value = payload[key] + + if (typeof value !== 'object' || value === null || !(key in state)) { + Vue.set(state, key, value) + return + } + + if (typeof value === 'object') { + Object.keys(value).forEach((subkey) => { + Vue.set(state[key], subkey, value[subkey]) + }) + } + }) }, setBedMeshProfiles(state, payload) { @@ -29,20 +41,6 @@ export const mutations: MutationTree = { } }, - setHelplist(state, payload) { - const helplist = [] - - for (const [command, description] of Object.entries(payload)) { - helplist.push({ - commandLow: command.toLowerCase(), - command: command, - description: description, - }) - } - - Vue.set(state, 'helplist', helplist) - }, - clearCurrentFile(state) { Vue.set(state, 'current_file', {}) }, diff --git a/src/store/printer/types.ts b/src/store/printer/types.ts index 6b08e5410..6ebc84717 100644 --- a/src/store/printer/types.ts +++ b/src/store/printer/types.ts @@ -6,21 +6,9 @@ export interface VTextareaType extends HTMLInputElement { } } -export interface CommandHelp { - command: string - commandLow: string - description?: string | Record -} - -export interface ConsoleCommandHelp { - command: CommandHelp | null - original: string -} - export interface PrinterState { // eslint-disable-next-line [key: string]: any - helplist?: CommandHelp[] tempHistory?: PrinterTempHistoryState } diff --git a/src/store/server/actions.ts b/src/store/server/actions.ts index a32a32a2b..a1423fd2a 100644 --- a/src/store/server/actions.ts +++ b/src/store/server/actions.ts @@ -170,6 +170,7 @@ export const actions: ActionTree = { dispatch('stopKlippyConnectedInterval') commit('setKlippyConnected') + dispatch('printer/initGcodes', null, { root: true }) dispatch('checkKlippyState', { state: payload.klippy_state, state_message: null }) }, From 2eb5c4b6352d0f29beb2ab6b56ba1dda366b41ea Mon Sep 17 00:00:00 2001 From: Stefan Dej Date: Tue, 5 Nov 2024 23:25:04 +0100 Subject: [PATCH 2/3] fix: fix types in ConsoleMixin Signed-off-by: Stefan Dej --- src/components/mixins/console.ts | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/src/components/mixins/console.ts b/src/components/mixins/console.ts index 679c2e987..e337bb658 100644 --- a/src/components/mixins/console.ts +++ b/src/components/mixins/console.ts @@ -1,13 +1,12 @@ import Vue from 'vue' import Component from 'vue-class-component' -import { CommandHelp } from '@/store/printer/types' import { GuiConsoleStateFilter } from '@/store/gui/console/types' @Component export default class ConsoleMixin extends Vue { - get helplist(): CommandHelp[] { - const commands = this.$store.state.printer.gcode?.commands ?? {} - const helplist: { command: string; help: string } = [] + get helplist() { + const commands: { [key: string]: { help?: string } } = this.$store.state.printer.gcode?.commands ?? {} + const helplist: { command: string; help: string }[] = [] for (const [key, values] of Object.entries(commands)) { helplist.push({ command: key, help: values.help ?? '' }) From d6e18cc2e2b23fa86333af7601e9811a275078dc Mon Sep 17 00:00:00 2001 From: Stefan Dej Date: Tue, 5 Nov 2024 23:54:43 +0100 Subject: [PATCH 3/3] refactor: remove null and set undefined as fallback for params in emitAndWait Signed-off-by: Stefan Dej --- src/plugins/webSocketClient.ts | 4 ++-- src/store/printer/actions.ts | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/plugins/webSocketClient.ts b/src/plugins/webSocketClient.ts index e69d5c823..8f423b8dc 100644 --- a/src/plugins/webSocketClient.ts +++ b/src/plugins/webSocketClient.ts @@ -179,7 +179,7 @@ export class WebSocketClient { ) } - async emitAndWait(method: string, params: Params | null, options: emitOptions = {}): Promise { + async emitAndWait(method: string, params: Params | undefined = undefined, options: emitOptions = {}): Promise { return new Promise((resolve, reject) => { if (this.instance?.readyState !== WebSocket.OPEN) reject() @@ -200,7 +200,7 @@ export class WebSocketClient { JSON.stringify({ jsonrpc: '2.0', method, - params: params ?? undefined, + params, id, }) ) diff --git a/src/store/printer/actions.ts b/src/store/printer/actions.ts index 02e0a75bf..eea47a360 100644 --- a/src/store/printer/actions.ts +++ b/src/store/printer/actions.ts @@ -46,7 +46,7 @@ export const actions: ActionTree = { }, async initSubscripts({ dispatch }) { - const payload = await Vue.$socket.emitAndWait('printer.objects.list', null, {}) + const payload = await Vue.$socket.emitAndWait('printer.objects.list') let subscripts = {} const blocklist = ['menu']