fix: tool selection in extruder panel (#842)

Co-authored-by: Stefan Dej <meteyou@gmail.com>

src/components/panels/ExtruderControlPanel.vue

@@ -117,22 +117,17 @@
         <responsive :breakpoints="{ large: (el) => el.width >= 640 }">
             <template #default="{ el }">
                 <!-- TOOL SELECTOR BUTTONS -->
-                <v-container v-if="extruders.length > 1" class="pb-1">
+                <v-container v-if="toolchangeMacros.length > 1" class="pb-1">
                     <v-item-group class="_btn-group py-0">
                         <v-btn
-                            v-for="extruder in extruders"
-                            :key="extruder.key"
-                            :class="extruder.key === activeExtruder ? 'primary--text' : {}"
-                            :value="extruder.key"
+                            v-for="tool in toolchangeMacros"
+                            :key="tool.name"
+                            :class="tool.active ? 'primary--text' : {}"
                             :disabled="isPrinting"
                             dense
                             class="flex-grow-1 px-0"
-                            @click="activateExtruder(extruder.key)">
-                            {{
-                                toolchangeMacros.length === extruders.length
-                                    ? toolchangeMacros[extruders.indexOf(extruder)]
-                                    : extruder.name
-                            }}
+                            @click="doSend(tool.name)">
+                            {{ tool.name }}
                         </v-btn>
                     </v-item-group>
                 </v-container>
@@ -367,8 +362,9 @@ import {
     mdiDotsVertical,
 } from '@mdi/js'
 import { Component, Mixins, Watch } from 'vue-property-decorator'
-import { PrinterStateExtruder } from '@/store/printer/types'
+import { PrinterStateExtruder, PrinterStateToolchangeMacro } from '@/store/printer/types'
 import BaseMixin from '../mixins/base'
+import ControlMixin from '../mixins/control'
 import NumberInput from '@/components/inputs/NumberInput.vue'
 import Panel from '@/components/ui/Panel.vue'
 import PressureAdvanceSettings from '@/components/panels/MachineSettings/PressureAdvanceSettings.vue'
@@ -384,7 +380,7 @@ import ToolSlider from '@/components/inputs/ToolSlider.vue'
         ToolSlider,
     },
 })
-export default class ExtruderControlPanel extends Mixins(BaseMixin) {
+export default class ExtruderControlPanel extends Mixins(BaseMixin, ControlMixin) {
     mdiArrowUpBold = mdiArrowUpBold
     mdiArrowDownBold = mdiArrowDownBold
     mdiPrinter3dNozzle = mdiPrinter3dNozzle
@@ -397,14 +393,8 @@ export default class ExtruderControlPanel extends Mixins(BaseMixin) {
         return ['printing'].includes(this.printer_state)
     }
 
-    get toolchangeMacros(): string[] {
-        let tools: string[] = []
-        for (let i = 0; i < this.extruders.length; i++) {
-            this.$store.getters['printer/getMacros'].forEach((m: any) => {
-                if (`T${i}`.includes(m.name.toUpperCase())) tools.push(`T${i}`)
-            })
-        }
-        return tools
+    get toolchangeMacros(): PrinterStateToolchangeMacro[] {
+        return this.$store.getters['printer/getToolchangeMacros']
     }
 
     get filamentChangeMacros(): boolean {
@@ -512,22 +502,6 @@ export default class ExtruderControlPanel extends Mixins(BaseMixin) {
         }
     }
 
-    activateExtruder(extruder: string): void {
-        /**
-         * If toolchange macros in the form of T{n} are found, use those
-         * otherwise use the regular 'ACTIVATE_EXTRUDER' Klipper command
-         */
-        let gcode: string
-        if (this.toolchangeMacros.length === this.extruders.length) {
-            gcode = `T${this.extruders.findIndex((ex: any) => ex.key === extruder)}`
-        } else {
-            gcode = `ACTIVATE_EXTRUDER EXTRUDER=${extruder}`
-        }
-
-        this.$store.dispatch('server/addEvent', { message: gcode, type: 'command' })
-        this.$socket.emit('printer.gcode.script', { script: gcode })
-    }
-
     sendRetract(): void {
         const gcode = `M83\nG1 E-${this.feedamount} F${this.feedrate * 60}`
         this.$store.dispatch('server/addEvent', { message: gcode, type: 'command' })

src/store/printer/getters.ts

@@ -18,6 +18,7 @@ import {
     PrinterStateMacro,
     PrinterStateTemperatureObject,
     PrinterStateTemperatureSensor,
+    PrinterStateToolchangeMacro,
 } from '@/store/printer/types'
 import { caseInsensitiveSort, formatFrequency, getMacroParams } from '@/plugins/helpers'
 import { RootState } from '@/store/types'
@@ -69,11 +70,14 @@ export const getters: GetterTree<PrinterState, RootState> = {
                     !('rename_existing' in state.configfile.config[prop]) &&
                     !(hiddenMacros.indexOf(prop.replace('gcode_macro ', '').toLowerCase()) > -1)
                 ) {
+                    const variables = state[prop] ?? {}
+
                     array.push({
                         name: prop.replace('gcode_macro ', ''),
                         description: state.configfile.config[prop].description ?? null,
                         prop: state.configfile.config[prop],
                         params: getMacroParams(state.configfile.config[prop]),
+                        variables,
                     })
                 }
             })
@@ -461,11 +465,14 @@ export const getters: GetterTree<PrinterState, RootState> = {
                 !prop.startsWith('gcode_macro _') &&
                 !Object.hasOwnProperty.call(state.configfile.config[prop], 'rename_existing')
             ) {
+                const variables = state[prop] ?? {}
+
                 array.push({
                     name: prop.replace('gcode_macro ', ''),
                     description: state.configfile.config[prop].description ?? null,
                     prop: state.configfile.config[prop],
                     params: getMacroParams(state.configfile.config[prop]),
+                    variables,
                 })
             }
         })
@@ -674,7 +681,7 @@ export const getters: GetterTree<PrinterState, RootState> = {
         const extruders: PrinterStateExtruder[] = []
         if (state.configfile?.settings) {
             Object.keys(state.configfile?.settings)
-                .filter((key) => key.startsWith('extruder'))
+                .filter((key) => key.match(/^(extruder)\d?$/g))
                 .sort()
                 .forEach((key: string) => {
                     const extruder = state.configfile?.settings[key]
@@ -847,6 +854,22 @@ export const getters: GetterTree<PrinterState, RootState> = {
         return 0
     },
 
+    getToolchangeMacros: (state, getters) => {
+        const macros = getters['getMacros']
+        const tools: PrinterStateToolchangeMacro[] = []
+
+        macros
+            .filter((macro: any) => macro.name.toUpperCase().match(/^T\d+/))
+            .forEach((macro: any) =>
+                tools.push({
+                    name: macro.name,
+                    active: macro.variables.active ?? false,
+                })
+            )
+
+        return tools
+    },
+
     existsQGL: (state) => {
         if (!state.configfile?.settings) return false
 

src/store/printer/types.ts

@@ -169,6 +169,10 @@ export interface PrinterStateMacro {
         // eslint-disable-next-line
         [key: string]: any
     }
+    variables: {
+        // eslint-disable-next-line
+        [key: string]: any
+    }
     params: PrinterStateMacroParams
 }
 
@@ -213,11 +217,7 @@ export interface PrinterStateExtruder {
     maxExtrudeOnlyDistance: number
 }
 
-export interface PrinterStateExtruder {
-    key: string
+export interface PrinterStateToolchangeMacro {
     name: string
-    filamentDiameter: number
-    minExtrudeTemp: number
-    nozzleDiameter: number
-    maxExtrudeOnlyDistance: number
+    active: boolean
 }