From 05cf0d481cd8a080481c08a7f07e8ac7c5721324 Mon Sep 17 00:00:00 2001
From: Stefan Dej <meteyou@gmail.com>
Date: Tue, 13 Sep 2022 23:31:00 +0200
Subject: [PATCH 1/9] feat: add manual_probe dialog

Signed-off-by: Stefan Dej <meteyou@gmail.com>
---
 .../panels/ToolheadControlPanel.vue           |   3 +
 .../ToolheadControls/ManualProbeDialog.vue    | 204 ++++++++++++++++++
 src/locales/en.json                           |   7 +
 3 files changed, 214 insertions(+)
 create mode 100644 src/components/panels/ToolheadControls/ManualProbeDialog.vue

diff --git a/src/components/panels/ToolheadControlPanel.vue b/src/components/panels/ToolheadControlPanel.vue
index 46dd5df02..8d83e4911 100644
--- a/src/components/panels/ToolheadControlPanel.vue
+++ b/src/components/panels/ToolheadControlPanel.vue
@@ -118,6 +118,7 @@
                 command="M220"
                 attribute-name="S"></tool-slider>
         </v-container>
+        <manual-probe-dialog />
     </panel>
 </template>
 
@@ -132,6 +133,7 @@ import MoveToControl from '@/components/panels/ToolheadControls/MoveToControl.vu
 import Panel from '@/components/ui/Panel.vue'
 import ToolSlider from '@/components/inputs/ToolSlider.vue'
 import ZoffsetControl from '@/components/panels/ToolheadControls/ZoffsetControl.vue'
+import ManualProbeDialog from '@/components/panels/ToolheadControls/ManualProbeDialog.vue'
 import { mdiDotsVertical, mdiEngineOff, mdiGamepad, mdiSpeedometer, mdiMenuDown, mdiRestore } from '@mdi/js'
 
 @Component({
@@ -143,6 +145,7 @@ import { mdiDotsVertical, mdiEngineOff, mdiGamepad, mdiSpeedometer, mdiMenuDown,
         Panel,
         ToolSlider,
         ZoffsetControl,
+        ManualProbeDialog,
     },
 })
 export default class ToolheadControlPanel extends Mixins(BaseMixin, ControlMixin) {
diff --git a/src/components/panels/ToolheadControls/ManualProbeDialog.vue b/src/components/panels/ToolheadControls/ManualProbeDialog.vue
new file mode 100644
index 000000000..760449242
--- /dev/null
+++ b/src/components/panels/ToolheadControls/ManualProbeDialog.vue
@@ -0,0 +1,204 @@
+<template>
+    <v-dialog :value="showDialog" width="600" persistent :fullscreen="isMobile">
+        <panel
+            :title="$t('Panels.ToolheadControlPanel.ManualProbe.Headline').toString()"
+            :icon="mdiArrowCollapseDown"
+            card-class="manual_probe-dialog"
+            :margin-bottom="false"
+            style="overflow: hidden"
+            :height="isMobile ? 0 : 548">
+            <v-card-text>
+                <v-row>
+                    <v-col class="v-subheader text--secondary">
+                        <span class="font-weight-bold">
+                            {{ $t('Panels.ToolheadControlPanel.ManualProbe.Current') }}: {{ z_position }}
+                        </span>
+                        <v-spacer />
+                        <span>
+                            {{
+                                $t('Panels.ToolheadControlPanel.ManualProbe.MinMax', {
+                                    min: z_position_lower,
+                                    max: z_position_upper,
+                                })
+                            }}
+                        </span>
+                    </v-col>
+                </v-row>
+                <v-row>
+                    <v-col>
+                        <v-item-group class="_btn-group">
+                            <v-btn
+                                v-for="(offset, index) in offsetsZ"
+                                :key="`offsetsUp-${index}`"
+                                small
+                                class="_btn-qs flex-grow-1 px-1"
+                                @click="sendTestZ(offset.toString())">
+                                <v-icon v-if="index === 0" left small class="mr-1 ml-n1">
+                                    {{ mdiArrowCollapseUp }}
+                                </v-icon>
+                                <span>&plus;{{ offset }}</span>
+                            </v-btn>
+                        </v-item-group>
+                    </v-col>
+                </v-row>
+                <v-row class="mt-0">
+                    <v-col>
+                        <v-item-group class="_btn-group">
+                            <v-btn class="_btn-qs flex-grow-1 px-1" color="primary" @click="sendTestZ('--')">
+                                <span>&minus;&minus;</span>
+                            </v-btn>
+                            <v-btn class="_btn-qs flex-grow-1 px-1" color="primary" @click="sendTestZ('-')">
+                                <span>&minus;</span>
+                            </v-btn>
+                        </v-item-group>
+                    </v-col>
+                    <v-col></v-col>
+                    <v-col>
+                        <v-item-group class="_btn-group">
+                            <v-btn class="_btn-qs flex-grow-1 px-1" color="primary" @click="sendTestZ('+')">
+                                <span>&plus;</span>
+                            </v-btn>
+                            <v-btn class="_btn-qs flex-grow-1 px-1" color="primary" @click="sendTestZ('++')">
+                                <span>&plus;&plus;</span>
+                            </v-btn>
+                        </v-item-group>
+                    </v-col>
+                </v-row>
+                <v-row class="mt-0">
+                    <v-col>
+                        <v-item-group class="_btn-group">
+                            <v-btn
+                                v-for="(offset, index) in offsetsZ"
+                                :key="`offsetsDown-${index}`"
+                                small
+                                class="_btn-qs flex-grow-1 px-1"
+                                @click="sendTestZ((offset * -1).toString())">
+                                <v-icon v-if="index === 0" left small class="mr-1 ml-n1">
+                                    {{ mdiArrowCollapseDown }}
+                                </v-icon>
+                                <span>&minus;{{ offset }}</span>
+                            </v-btn>
+                        </v-item-group>
+                    </v-col>
+                </v-row>
+            </v-card-text>
+            <v-card-actions>
+                <v-spacer></v-spacer>
+                <v-btn text @click="sendAbort">{{ $t('Panels.ToolheadControlPanel.ManualProbe.Abort') }}</v-btn>
+                <v-btn color="primary" text @click="sendAccept">
+                    {{ $t('Panels.ToolheadControlPanel.ManualProbe.Accept') }}
+                </v-btn>
+            </v-card-actions>
+        </panel>
+    </v-dialog>
+</template>
+
+<script lang="ts">
+import { Component, Mixins } from 'vue-property-decorator'
+import BaseMixin from '@/components/mixins/base'
+import Panel from '@/components/ui/Panel.vue'
+import Responsive from '@/components/ui/Responsive.vue'
+
+import { mdiArrowCollapseDown, mdiArrowCollapseUp, mdiInformation } from '@mdi/js'
+@Component({
+    components: { Panel, Responsive },
+})
+export default class ManualProbeDialog extends Mixins(BaseMixin) {
+    mdiArrowCollapseDown = mdiArrowCollapseDown
+    mdiArrowCollapseUp = mdiArrowCollapseUp
+    mdiInformation = mdiInformation
+
+    get showDialog() {
+        return this.$store.state.printer.manual_probe?.is_active ?? false
+    }
+
+    get offsetsZ() {
+        const offsets = [...(this.$store.state.gui.control.offsetsZ ?? [])]
+        const mustHaves = [0.1, 1]
+
+        mustHaves.forEach((mustHave) => {
+            if (offsets.findIndex((offset: number) => offset == mustHave) === -1) offsets.push(mustHave)
+        })
+
+        return offsets.sort()
+    }
+
+    get z_position() {
+        return (this.$store.state.printer.manual_probe?.z_position ?? 0).toFixed(3)
+    }
+
+    get z_position_lower() {
+        return (this.$store.state.printer.manual_probe?.z_position_lower ?? 0).toFixed(3)
+    }
+
+    get z_position_upper() {
+        return (this.$store.state.printer.manual_probe?.z_position_upper ?? 0).toFixed(3)
+    }
+
+    sendGcode(gcode: string) {
+        this.$store.dispatch('server/addEvent', { message: gcode, type: 'command' })
+        this.$socket.emit('printer.gcode.script', { script: gcode })
+    }
+
+    sendTestZ(offset: string) {
+        const gcode = `TESTZ Z=${offset}`
+        this.sendGcode(gcode)
+    }
+
+    sendAbort() {
+        const gcode = `ABORT`
+        this.sendGcode(gcode)
+    }
+
+    sendAccept() {
+        const gcode = `ACCEPT`
+        this.sendGcode(gcode)
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+.v-btn-toggle {
+    width: 100%;
+}
+
+._btn-group {
+    border-radius: 4px;
+    display: inline-flex;
+    flex-wrap: nowrap;
+    max-width: 100%;
+    min-width: 100%;
+    width: 100%;
+
+    .v-btn {
+        border-radius: 0;
+        border-color: rgba(255, 255, 255, 0.12) !important;
+        border-style: solid;
+        border-width: thin;
+        box-shadow: none;
+        height: 28px;
+        opacity: 0.8;
+        min-width: auto !important;
+    }
+
+    .v-btn:first-child {
+        border-top-left-radius: inherit;
+        border-bottom-left-radius: inherit;
+    }
+
+    .v-btn:last-child {
+        border-top-right-radius: inherit;
+        border-bottom-right-radius: inherit;
+    }
+
+    .v-btn:not(:first-child) {
+        border-left-width: 0;
+    }
+}
+
+._btn-qs {
+    font-size: 0.8rem !important;
+    font-weight: 400;
+    max-height: 28px;
+}
+</style>
diff --git a/src/locales/en.json b/src/locales/en.json
index c243288f7..d984df092 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -603,6 +603,13 @@
             "ALL": "ALL",
             "Headline": "Toolhead",
             "Invalid": "Invalid",
+            "ManualProbe": {
+                "Abort": "abort",
+                "Accept": "accept",
+                "Current": "current",
+                "Headline": "Manual Probe",
+                "MinMax": "min: {min} / max: {max}"
+            },
             "OutOfRange": "Out of range!",
             "PleaseConfigureSteps": "Please configure steps",
             "Position": "Position",

From 03d96e708e86397cc0a80999a9a231fba544967a Mon Sep 17 00:00:00 2001
From: Stefan Dej <meteyou@gmail.com>
Date: Tue, 13 Sep 2022 23:33:56 +0200
Subject: [PATCH 2/9] feat: add loading function to abort & accept buttons

Signed-off-by: Stefan Dej <meteyou@gmail.com>
---
 .../ToolheadControls/ManualProbeDialog.vue    | 24 ++++++++++++-------
 1 file changed, 16 insertions(+), 8 deletions(-)

diff --git a/src/components/panels/ToolheadControls/ManualProbeDialog.vue b/src/components/panels/ToolheadControls/ManualProbeDialog.vue
index 760449242..7cb8cbc63 100644
--- a/src/components/panels/ToolheadControls/ManualProbeDialog.vue
+++ b/src/components/panels/ToolheadControls/ManualProbeDialog.vue
@@ -84,8 +84,10 @@
             </v-card-text>
             <v-card-actions>
                 <v-spacer></v-spacer>
-                <v-btn text @click="sendAbort">{{ $t('Panels.ToolheadControlPanel.ManualProbe.Abort') }}</v-btn>
-                <v-btn color="primary" text @click="sendAccept">
+                <v-btn text :loading="loadingAbort" @click="sendAbort">
+                    {{ $t('Panels.ToolheadControlPanel.ManualProbe.Abort') }}
+                </v-btn>
+                <v-btn color="primary" text :loading="loadingAccept" @click="sendAccept">
                     {{ $t('Panels.ToolheadControlPanel.ManualProbe.Accept') }}
                 </v-btn>
             </v-card-actions>
@@ -135,24 +137,30 @@ export default class ManualProbeDialog extends Mixins(BaseMixin) {
         return (this.$store.state.printer.manual_probe?.z_position_upper ?? 0).toFixed(3)
     }
 
-    sendGcode(gcode: string) {
-        this.$store.dispatch('server/addEvent', { message: gcode, type: 'command' })
-        this.$socket.emit('printer.gcode.script', { script: gcode })
+    get loadingAbort() {
+        return this.loadings.includes('manualProbeAbort')
+    }
+
+    get loadingAccept() {
+        return this.loadings.includes('manualProbeAccept')
     }
 
     sendTestZ(offset: string) {
         const gcode = `TESTZ Z=${offset}`
-        this.sendGcode(gcode)
+        this.$store.dispatch('server/addEvent', { message: gcode, type: 'command' })
+        this.$socket.emit('printer.gcode.script', { script: gcode })
     }
 
     sendAbort() {
         const gcode = `ABORT`
-        this.sendGcode(gcode)
+        this.$store.dispatch('server/addEvent', { message: gcode, type: 'command' })
+        this.$socket.emit('printer.gcode.script', { script: gcode }, { loading: 'manualProbeAbort' })
     }
 
     sendAccept() {
         const gcode = `ACCEPT`
-        this.sendGcode(gcode)
+        this.$store.dispatch('server/addEvent', { message: gcode, type: 'command' })
+        this.$socket.emit('printer.gcode.script', { script: gcode }, { loading: 'manualProbeAccept' })
     }
 }
 </script>

From 28caca276b75ea57ba827c51bf0d4f1328a47752 Mon Sep 17 00:00:00 2001
From: Stefan Dej <meteyou@gmail.com>
Date: Sat, 17 Sep 2022 23:25:32 +0200
Subject: [PATCH 3/9] refactor: rework manual probe dialog

Signed-off-by: Stefan Dej <meteyou@gmail.com>
---
 .../ToolheadControls/ManualProbeDialog.vue    | 152 ++++++++++--------
 1 file changed, 85 insertions(+), 67 deletions(-)

diff --git a/src/components/panels/ToolheadControls/ManualProbeDialog.vue b/src/components/panels/ToolheadControls/ManualProbeDialog.vue
index 7cb8cbc63..7c1f161b0 100644
--- a/src/components/panels/ToolheadControls/ManualProbeDialog.vue
+++ b/src/components/panels/ToolheadControls/ManualProbeDialog.vue
@@ -1,5 +1,5 @@
 <template>
-    <v-dialog :value="showDialog" width="600" persistent :fullscreen="isMobile">
+    <v-dialog :value="showDialog" width="400" persistent :fullscreen="isMobile">
         <panel
             :title="$t('Panels.ToolheadControlPanel.ManualProbe.Headline').toString()"
             :icon="mdiArrowCollapseDown"
@@ -9,76 +9,76 @@
             :height="isMobile ? 0 : 548">
             <v-card-text>
                 <v-row>
-                    <v-col class="v-subheader text--secondary">
-                        <span class="font-weight-bold">
-                            {{ $t('Panels.ToolheadControlPanel.ManualProbe.Current') }}: {{ z_position }}
-                        </span>
-                        <v-spacer />
-                        <span>
-                            {{
-                                $t('Panels.ToolheadControlPanel.ManualProbe.MinMax', {
-                                    min: z_position_lower,
-                                    max: z_position_upper,
-                                })
-                            }}
-                        </span>
+                    <v-col class="d-flex align-center justify-center">
+                        <span class="text-h5">{{ z_position_lower }}</span>
+                        <v-icon class="mx-2">{{ mdiChevronTripleRight }}</v-icon>
+                        <span class="text-h4">{{ z_position }}</span>
+                        <v-icon class="mx-2">{{ mdiChevronTripleLeft }}</v-icon>
+                        <span class="text-h5">{{ z_position_upper }}</span>
                     </v-col>
                 </v-row>
                 <v-row>
-                    <v-col>
-                        <v-item-group class="_btn-group">
-                            <v-btn
-                                v-for="(offset, index) in offsetsZ"
-                                :key="`offsetsUp-${index}`"
-                                small
-                                class="_btn-qs flex-grow-1 px-1"
-                                @click="sendTestZ(offset.toString())">
-                                <v-icon v-if="index === 0" left small class="mr-1 ml-n1">
-                                    {{ mdiArrowCollapseUp }}
-                                </v-icon>
-                                <span>&plus;{{ offset }}</span>
-                            </v-btn>
-                        </v-item-group>
+                    <v-col class="text-center">
+                        <v-btn class="" color="primary" @click="sendTestZ('--')">
+                            <v-icon small>{{ mdiMinusThick }}</v-icon>
+                            <v-icon small>{{ mdiMinusThick }}</v-icon>
+                        </v-btn>
                     </v-col>
-                </v-row>
-                <v-row class="mt-0">
-                    <v-col>
-                        <v-item-group class="_btn-group">
-                            <v-btn class="_btn-qs flex-grow-1 px-1" color="primary" @click="sendTestZ('--')">
-                                <span>&minus;&minus;</span>
-                            </v-btn>
-                            <v-btn class="_btn-qs flex-grow-1 px-1" color="primary" @click="sendTestZ('-')">
-                                <span>&minus;</span>
-                            </v-btn>
-                        </v-item-group>
+                    <v-col class="text-center">
+                        <v-btn class="" color="primary" @click="sendTestZ('-')">
+                            <v-icon small>{{ mdiMinusThick }}</v-icon>
+                        </v-btn>
                     </v-col>
-                    <v-col></v-col>
-                    <v-col>
-                        <v-item-group class="_btn-group">
-                            <v-btn class="_btn-qs flex-grow-1 px-1" color="primary" @click="sendTestZ('+')">
-                                <span>&plus;</span>
-                            </v-btn>
-                            <v-btn class="_btn-qs flex-grow-1 px-1" color="primary" @click="sendTestZ('++')">
-                                <span>&plus;&plus;</span>
-                            </v-btn>
-                        </v-item-group>
+                    <v-col class="text-center">
+                        <v-btn class="" color="primary" @click="sendTestZ('+')">
+                            <v-icon small>{{ mdiPlusThick }}</v-icon>
+                        </v-btn>
+                    </v-col>
+                    <v-col class="text-center">
+                        <v-btn class="" color="primary" @click="sendTestZ('++')">
+                            <v-icon small>{{ mdiPlusThick }}</v-icon>
+                            <v-icon small>{{ mdiPlusThick }}</v-icon>
+                        </v-btn>
                     </v-col>
                 </v-row>
-                <v-row class="mt-0">
+                <v-row>
                     <v-col>
-                        <v-item-group class="_btn-group">
-                            <v-btn
-                                v-for="(offset, index) in offsetsZ"
-                                :key="`offsetsDown-${index}`"
-                                small
-                                class="_btn-qs flex-grow-1 px-1"
-                                @click="sendTestZ((offset * -1).toString())">
-                                <v-icon v-if="index === 0" left small class="mr-1 ml-n1">
-                                    {{ mdiArrowCollapseDown }}
-                                </v-icon>
-                                <span>&minus;{{ offset }}</span>
-                            </v-btn>
-                        </v-item-group>
+                        <sub-panel title="Advanced" sub-panel-class="manual-probe-dialog-advanced">
+                            <v-row>
+                                <v-col>
+                                    <v-item-group class="_btn-group">
+                                        <v-btn
+                                            v-for="(offset, index) in offsetsZ"
+                                            :key="`offsetsUp-${index}`"
+                                            small
+                                            class="_btn-qs flex-grow-1 px-1"
+                                            @click="sendTestZ(offset.toString())">
+                                            <v-icon v-if="index === 0" left small class="mr-1 ml-n1">
+                                                {{ mdiArrowExpandUp }}
+                                            </v-icon>
+                                            <span>&plus;{{ offset }}</span>
+                                        </v-btn>
+                                    </v-item-group>
+                                </v-col>
+                            </v-row>
+                            <v-row class="mt-0">
+                                <v-col>
+                                    <v-item-group class="_btn-group">
+                                        <v-btn
+                                            v-for="(offset, index) in offsetsZ"
+                                            :key="`offsetsDown-${index}`"
+                                            small
+                                            class="_btn-qs flex-grow-1 px-1"
+                                            @click="sendTestZ((offset * -1).toString())">
+                                            <v-icon v-if="index === 0" left small class="mr-1 ml-n1">
+                                                {{ mdiArrowCollapseDown }}
+                                            </v-icon>
+                                            <span>&minus;{{ offset }}</span>
+                                        </v-btn>
+                                    </v-item-group>
+                                </v-col>
+                            </v-row>
+                        </sub-panel>
                     </v-col>
                 </v-row>
             </v-card-text>
@@ -101,14 +101,26 @@ import BaseMixin from '@/components/mixins/base'
 import Panel from '@/components/ui/Panel.vue'
 import Responsive from '@/components/ui/Responsive.vue'
 
-import { mdiArrowCollapseDown, mdiArrowCollapseUp, mdiInformation } from '@mdi/js'
+import {
+    mdiArrowCollapseDown,
+    mdiArrowExpandUp,
+    mdiInformation,
+    mdiPlusThick,
+    mdiMinusThick,
+    mdiChevronTripleLeft,
+    mdiChevronTripleRight,
+} from '@mdi/js'
 @Component({
     components: { Panel, Responsive },
 })
 export default class ManualProbeDialog extends Mixins(BaseMixin) {
     mdiArrowCollapseDown = mdiArrowCollapseDown
-    mdiArrowCollapseUp = mdiArrowCollapseUp
+    mdiArrowExpandUp = mdiArrowExpandUp
     mdiInformation = mdiInformation
+    mdiPlusThick = mdiPlusThick
+    mdiMinusThick = mdiMinusThick
+    mdiChevronTripleLeft = mdiChevronTripleLeft
+    mdiChevronTripleRight = mdiChevronTripleRight
 
     get showDialog() {
         return this.$store.state.printer.manual_probe?.is_active ?? false
@@ -130,11 +142,17 @@ export default class ManualProbeDialog extends Mixins(BaseMixin) {
     }
 
     get z_position_lower() {
-        return (this.$store.state.printer.manual_probe?.z_position_lower ?? 0).toFixed(3)
+        const value = this.$store.state.printer.manual_probe?.z_position_lower
+        if (value === null) return '??????'
+
+        return value.toFixed(3)
     }
 
     get z_position_upper() {
-        return (this.$store.state.printer.manual_probe?.z_position_upper ?? 0).toFixed(3)
+        const value = this.$store.state.printer.manual_probe?.z_position_upper
+        if (value === null) return '??????'
+
+        return value.toFixed(3)
     }
 
     get loadingAbort() {

From d585110bbee3c105233f150fff324d3b0496dad5 Mon Sep 17 00:00:00 2001
From: Stefan Dej <meteyou@gmail.com>
Date: Sat, 17 Sep 2022 23:44:32 +0200
Subject: [PATCH 4/9] refactor: rework manual probe dialog

Signed-off-by: Stefan Dej <meteyou@gmail.com>
---
 .../ToolheadControls/ManualProbeDialog.vue    | 100 +++++++++---------
 src/locales/en.json                           |   1 +
 2 files changed, 49 insertions(+), 52 deletions(-)

diff --git a/src/components/panels/ToolheadControls/ManualProbeDialog.vue b/src/components/panels/ToolheadControls/ManualProbeDialog.vue
index 7c1f161b0..5c2587408 100644
--- a/src/components/panels/ToolheadControls/ManualProbeDialog.vue
+++ b/src/components/panels/ToolheadControls/ManualProbeDialog.vue
@@ -7,7 +7,7 @@
             :margin-bottom="false"
             style="overflow: hidden"
             :height="isMobile ? 0 : 548">
-            <v-card-text>
+            <v-container>
                 <v-row>
                     <v-col class="d-flex align-center justify-center">
                         <span class="text-h5">{{ z_position_lower }}</span>
@@ -18,70 +18,71 @@
                     </v-col>
                 </v-row>
                 <v-row>
-                    <v-col class="text-center">
+                    <v-col class="text-left">
                         <v-btn class="" color="primary" @click="sendTestZ('--')">
                             <v-icon small>{{ mdiMinusThick }}</v-icon>
                             <v-icon small>{{ mdiMinusThick }}</v-icon>
                         </v-btn>
                     </v-col>
-                    <v-col class="text-center">
+                    <v-col class="text-left">
                         <v-btn class="" color="primary" @click="sendTestZ('-')">
                             <v-icon small>{{ mdiMinusThick }}</v-icon>
                         </v-btn>
                     </v-col>
-                    <v-col class="text-center">
+                    <v-col class="text-right">
                         <v-btn class="" color="primary" @click="sendTestZ('+')">
                             <v-icon small>{{ mdiPlusThick }}</v-icon>
                         </v-btn>
                     </v-col>
-                    <v-col class="text-center">
+                    <v-col class="text-right">
                         <v-btn class="" color="primary" @click="sendTestZ('++')">
                             <v-icon small>{{ mdiPlusThick }}</v-icon>
                             <v-icon small>{{ mdiPlusThick }}</v-icon>
                         </v-btn>
                     </v-col>
                 </v-row>
-                <v-row>
-                    <v-col>
-                        <sub-panel title="Advanced" sub-panel-class="manual-probe-dialog-advanced">
-                            <v-row>
-                                <v-col>
-                                    <v-item-group class="_btn-group">
-                                        <v-btn
-                                            v-for="(offset, index) in offsetsZ"
-                                            :key="`offsetsUp-${index}`"
-                                            small
-                                            class="_btn-qs flex-grow-1 px-1"
-                                            @click="sendTestZ(offset.toString())">
-                                            <v-icon v-if="index === 0" left small class="mr-1 ml-n1">
-                                                {{ mdiArrowExpandUp }}
-                                            </v-icon>
-                                            <span>&plus;{{ offset }}</span>
-                                        </v-btn>
-                                    </v-item-group>
-                                </v-col>
-                            </v-row>
-                            <v-row class="mt-0">
-                                <v-col>
-                                    <v-item-group class="_btn-group">
-                                        <v-btn
-                                            v-for="(offset, index) in offsetsZ"
-                                            :key="`offsetsDown-${index}`"
-                                            small
-                                            class="_btn-qs flex-grow-1 px-1"
-                                            @click="sendTestZ((offset * -1).toString())">
-                                            <v-icon v-if="index === 0" left small class="mr-1 ml-n1">
-                                                {{ mdiArrowCollapseDown }}
-                                            </v-icon>
-                                            <span>&minus;{{ offset }}</span>
-                                        </v-btn>
-                                    </v-item-group>
-                                </v-col>
-                            </v-row>
-                        </sub-panel>
-                    </v-col>
-                </v-row>
-            </v-card-text>
+            </v-container>
+            <sub-panel
+                :title="$t('Panels.ToolheadControlPanel.ManualProbe.Advanced')"
+                sub-panel-class="manual-probe-dialog-advanced"
+                class="mb-n2">
+                <v-container>
+                    <v-row>
+                        <v-col>
+                            <v-item-group class="_btn-group">
+                                <v-btn
+                                    v-for="(offset, index) in offsetsZ"
+                                    :key="`offsetsUp-${index}`"
+                                    small
+                                    class="_btn-qs flex-grow-1 px-1"
+                                    @click="sendTestZ(offset.toString())">
+                                    <v-icon v-if="index === 0" left small class="mr-1 ml-n1">
+                                        {{ mdiArrowExpandUp }}
+                                    </v-icon>
+                                    <span>&plus;{{ offset }}</span>
+                                </v-btn>
+                            </v-item-group>
+                        </v-col>
+                    </v-row>
+                    <v-row class="mt-0">
+                        <v-col>
+                            <v-item-group class="_btn-group">
+                                <v-btn
+                                    v-for="(offset, index) in offsetsZ"
+                                    :key="`offsetsDown-${index}`"
+                                    small
+                                    class="_btn-qs flex-grow-1 px-1"
+                                    @click="sendTestZ((offset * -1).toString())">
+                                    <v-icon v-if="index === 0" left small class="mr-1 ml-n1">
+                                        {{ mdiArrowCollapseDown }}
+                                    </v-icon>
+                                    <span>&minus;{{ offset }}</span>
+                                </v-btn>
+                            </v-item-group>
+                        </v-col>
+                    </v-row>
+                </v-container>
+            </sub-panel>
             <v-card-actions>
                 <v-spacer></v-spacer>
                 <v-btn text :loading="loadingAbort" @click="sendAbort">
@@ -127,12 +128,7 @@ export default class ManualProbeDialog extends Mixins(BaseMixin) {
     }
 
     get offsetsZ() {
-        const offsets = [...(this.$store.state.gui.control.offsetsZ ?? [])]
-        const mustHaves = [0.1, 1]
-
-        mustHaves.forEach((mustHave) => {
-            if (offsets.findIndex((offset: number) => offset == mustHave) === -1) offsets.push(mustHave)
-        })
+        const offsets = [1, 0.1, 0.05, 0.01, 0.005]
 
         return offsets.sort()
     }
diff --git a/src/locales/en.json b/src/locales/en.json
index d0d15f4ea..12571ed78 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -608,6 +608,7 @@
             "ManualProbe": {
                 "Abort": "abort",
                 "Accept": "accept",
+                "Advanced": "Advanced",
                 "Current": "current",
                 "Headline": "Manual Probe",
                 "MinMax": "min: {min} / max: {max}"

From 5bd3bdc10fbd1c7286393f283db981a4aad93a34 Mon Sep 17 00:00:00 2001
From: Stefan Dej <meteyou@gmail.com>
Date: Sat, 17 Sep 2022 23:49:03 +0200
Subject: [PATCH 5/9] refactor: remove row/cols in sub-panel

Signed-off-by: Stefan Dej <meteyou@gmail.com>
---
 .../ToolheadControls/ManualProbeDialog.vue    | 60 ++++++++-----------
 1 file changed, 26 insertions(+), 34 deletions(-)

diff --git a/src/components/panels/ToolheadControls/ManualProbeDialog.vue b/src/components/panels/ToolheadControls/ManualProbeDialog.vue
index 5c2587408..2c8ff1210 100644
--- a/src/components/panels/ToolheadControls/ManualProbeDialog.vue
+++ b/src/components/panels/ToolheadControls/ManualProbeDialog.vue
@@ -47,40 +47,32 @@
                 sub-panel-class="manual-probe-dialog-advanced"
                 class="mb-n2">
                 <v-container>
-                    <v-row>
-                        <v-col>
-                            <v-item-group class="_btn-group">
-                                <v-btn
-                                    v-for="(offset, index) in offsetsZ"
-                                    :key="`offsetsUp-${index}`"
-                                    small
-                                    class="_btn-qs flex-grow-1 px-1"
-                                    @click="sendTestZ(offset.toString())">
-                                    <v-icon v-if="index === 0" left small class="mr-1 ml-n1">
-                                        {{ mdiArrowExpandUp }}
-                                    </v-icon>
-                                    <span>&plus;{{ offset }}</span>
-                                </v-btn>
-                            </v-item-group>
-                        </v-col>
-                    </v-row>
-                    <v-row class="mt-0">
-                        <v-col>
-                            <v-item-group class="_btn-group">
-                                <v-btn
-                                    v-for="(offset, index) in offsetsZ"
-                                    :key="`offsetsDown-${index}`"
-                                    small
-                                    class="_btn-qs flex-grow-1 px-1"
-                                    @click="sendTestZ((offset * -1).toString())">
-                                    <v-icon v-if="index === 0" left small class="mr-1 ml-n1">
-                                        {{ mdiArrowCollapseDown }}
-                                    </v-icon>
-                                    <span>&minus;{{ offset }}</span>
-                                </v-btn>
-                            </v-item-group>
-                        </v-col>
-                    </v-row>
+                    <v-item-group class="_btn-group">
+                        <v-btn
+                            v-for="(offset, index) in offsetsZ"
+                            :key="`offsetsUp-${index}`"
+                            small
+                            class="_btn-qs flex-grow-1 px-1"
+                            @click="sendTestZ(offset.toString())">
+                            <v-icon v-if="index === 0" left small class="mr-1 ml-n1">
+                                {{ mdiArrowExpandUp }}
+                            </v-icon>
+                            <span>&plus;{{ offset }}</span>
+                        </v-btn>
+                    </v-item-group>
+                    <v-item-group class="_btn-group mt-3">
+                        <v-btn
+                            v-for="(offset, index) in offsetsZ"
+                            :key="`offsetsDown-${index}`"
+                            small
+                            class="_btn-qs flex-grow-1 px-1"
+                            @click="sendTestZ((offset * -1).toString())">
+                            <v-icon v-if="index === 0" left small class="mr-1 ml-n1">
+                                {{ mdiArrowCollapseDown }}
+                            </v-icon>
+                            <span>&minus;{{ offset }}</span>
+                        </v-btn>
+                    </v-item-group>
                 </v-container>
             </sub-panel>
             <v-card-actions>

From b15317bc096c8fdc387d361451667fb1210b7870 Mon Sep 17 00:00:00 2001
From: Stefan Dej <meteyou@gmail.com>
Date: Sat, 17 Sep 2022 23:54:27 +0200
Subject: [PATCH 6/9] refactor: add close button in the manual probe panel

Signed-off-by: Stefan Dej <meteyou@gmail.com>
---
 .../panels/ToolheadControls/ManualProbeDialog.vue          | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/src/components/panels/ToolheadControls/ManualProbeDialog.vue b/src/components/panels/ToolheadControls/ManualProbeDialog.vue
index 2c8ff1210..45bb79814 100644
--- a/src/components/panels/ToolheadControls/ManualProbeDialog.vue
+++ b/src/components/panels/ToolheadControls/ManualProbeDialog.vue
@@ -7,6 +7,11 @@
             :margin-bottom="false"
             style="overflow: hidden"
             :height="isMobile ? 0 : 548">
+            <template #buttons>
+                <v-btn icon tile @click="sendAbort">
+                    <v-icon>{{ mdiCloseThick }}</v-icon>
+                </v-btn>
+            </template>
             <v-container>
                 <v-row>
                     <v-col class="d-flex align-center justify-center">
@@ -102,6 +107,7 @@ import {
     mdiMinusThick,
     mdiChevronTripleLeft,
     mdiChevronTripleRight,
+    mdiCloseThick,
 } from '@mdi/js'
 @Component({
     components: { Panel, Responsive },
@@ -114,6 +120,7 @@ export default class ManualProbeDialog extends Mixins(BaseMixin) {
     mdiMinusThick = mdiMinusThick
     mdiChevronTripleLeft = mdiChevronTripleLeft
     mdiChevronTripleRight = mdiChevronTripleRight
+    mdiCloseThick = mdiCloseThick
 
     get showDialog() {
         return this.$store.state.printer.manual_probe?.is_active ?? false

From 781871b8e6c5751ee042ed69c5f2b8220a83b858 Mon Sep 17 00:00:00 2001
From: Stefan Dej <meteyou@gmail.com>
Date: Sun, 18 Sep 2022 00:02:38 +0200
Subject: [PATCH 7/9] refactor: move ManualProbe from ToolheadControlPanel to
 App.vue

Signed-off-by: Stefan Dej <meteyou@gmail.com>
---
 src/App.vue                                      |  3 +++
 .../TheManualProbeDialog.vue}                    | 13 +++++--------
 src/components/panels/ToolheadControlPanel.vue   |  3 ---
 src/locales/en.json                              | 16 ++++++++--------
 4 files changed, 16 insertions(+), 19 deletions(-)
 rename src/components/{panels/ToolheadControls/ManualProbeDialog.vue => dialogs/TheManualProbeDialog.vue} (93%)

diff --git a/src/App.vue b/src/App.vue
index 45bd13d51..f103c65ad 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -39,6 +39,7 @@
             <the-timelapse-rendering-snackbar></the-timelapse-rendering-snackbar>
             <the-fullscreen-upload></the-fullscreen-upload>
             <the-upload-snackbar></the-upload-snackbar>
+            <the-manual-probe-dialog />
         </template>
         <the-select-printer-dialog v-else-if="instancesDB !== 'moonraker'"></the-select-printer-dialog>
         <the-connecting-dialog v-else></the-connecting-dialog>
@@ -59,6 +60,7 @@ import { panelToolbarHeight, topbarHeight, navigationItemHeight } from '@/store/
 import TheTimelapseRenderingSnackbar from '@/components/TheTimelapseRenderingSnackbar.vue'
 import TheFullscreenUpload from '@/components/TheFullscreenUpload.vue'
 import TheUploadSnackbar from '@/components/TheUploadSnackbar.vue'
+import TheManualProbeDialog from '@/components/dialogs/TheManualProbeDialog.vue'
 
 @Component({
     components: {
@@ -71,6 +73,7 @@ import TheUploadSnackbar from '@/components/TheUploadSnackbar.vue'
         TheSidebar,
         TheFullscreenUpload,
         TheUploadSnackbar,
+        TheManualProbeDialog,
     },
     metaInfo() {
         const title = this.$store.getters['getTitle']
diff --git a/src/components/panels/ToolheadControls/ManualProbeDialog.vue b/src/components/dialogs/TheManualProbeDialog.vue
similarity index 93%
rename from src/components/panels/ToolheadControls/ManualProbeDialog.vue
rename to src/components/dialogs/TheManualProbeDialog.vue
index 45bb79814..e9bf8dc84 100644
--- a/src/components/panels/ToolheadControls/ManualProbeDialog.vue
+++ b/src/components/dialogs/TheManualProbeDialog.vue
@@ -1,7 +1,7 @@
 <template>
     <v-dialog :value="showDialog" width="400" persistent :fullscreen="isMobile">
         <panel
-            :title="$t('Panels.ToolheadControlPanel.ManualProbe.Headline').toString()"
+            :title="$t('ManualProbe.Headline').toString()"
             :icon="mdiArrowCollapseDown"
             card-class="manual_probe-dialog"
             :margin-bottom="false"
@@ -47,10 +47,7 @@
                     </v-col>
                 </v-row>
             </v-container>
-            <sub-panel
-                :title="$t('Panels.ToolheadControlPanel.ManualProbe.Advanced')"
-                sub-panel-class="manual-probe-dialog-advanced"
-                class="mb-n2">
+            <sub-panel :title="$t('ManualProbe.Advanced')" sub-panel-class="manual-probe-dialog-advanced" class="mb-n2">
                 <v-container>
                     <v-item-group class="_btn-group">
                         <v-btn
@@ -83,10 +80,10 @@
             <v-card-actions>
                 <v-spacer></v-spacer>
                 <v-btn text :loading="loadingAbort" @click="sendAbort">
-                    {{ $t('Panels.ToolheadControlPanel.ManualProbe.Abort') }}
+                    {{ $t('ManualProbe.Abort') }}
                 </v-btn>
                 <v-btn color="primary" text :loading="loadingAccept" @click="sendAccept">
-                    {{ $t('Panels.ToolheadControlPanel.ManualProbe.Accept') }}
+                    {{ $t('ManualProbe.Accept') }}
                 </v-btn>
             </v-card-actions>
         </panel>
@@ -112,7 +109,7 @@ import {
 @Component({
     components: { Panel, Responsive },
 })
-export default class ManualProbeDialog extends Mixins(BaseMixin) {
+export default class TheManualProbeDialog extends Mixins(BaseMixin) {
     mdiArrowCollapseDown = mdiArrowCollapseDown
     mdiArrowExpandUp = mdiArrowExpandUp
     mdiInformation = mdiInformation
diff --git a/src/components/panels/ToolheadControlPanel.vue b/src/components/panels/ToolheadControlPanel.vue
index 8d83e4911..46dd5df02 100644
--- a/src/components/panels/ToolheadControlPanel.vue
+++ b/src/components/panels/ToolheadControlPanel.vue
@@ -118,7 +118,6 @@
                 command="M220"
                 attribute-name="S"></tool-slider>
         </v-container>
-        <manual-probe-dialog />
     </panel>
 </template>
 
@@ -133,7 +132,6 @@ import MoveToControl from '@/components/panels/ToolheadControls/MoveToControl.vu
 import Panel from '@/components/ui/Panel.vue'
 import ToolSlider from '@/components/inputs/ToolSlider.vue'
 import ZoffsetControl from '@/components/panels/ToolheadControls/ZoffsetControl.vue'
-import ManualProbeDialog from '@/components/panels/ToolheadControls/ManualProbeDialog.vue'
 import { mdiDotsVertical, mdiEngineOff, mdiGamepad, mdiSpeedometer, mdiMenuDown, mdiRestore } from '@mdi/js'
 
 @Component({
@@ -145,7 +143,6 @@ import { mdiDotsVertical, mdiEngineOff, mdiGamepad, mdiSpeedometer, mdiMenuDown,
         Panel,
         ToolSlider,
         ZoffsetControl,
-        ManualProbeDialog,
     },
 })
 export default class ToolheadControlPanel extends Mixins(BaseMixin, ControlMixin) {
diff --git a/src/locales/en.json b/src/locales/en.json
index 12571ed78..9042871dc 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -458,6 +458,14 @@
             "UpToDate": "up-to-date"
         }
     },
+    "ManualProbe": {
+        "Abort": "abort",
+        "Accept": "accept",
+        "Advanced": "Advanced",
+        "Current": "current",
+        "Headline": "Manual Probe",
+        "MinMax": "min: {min} / max: {max}"
+    },
     "Panels": {
         "ExtruderControlPanel": {
             "Allowed": "Allowed",
@@ -605,14 +613,6 @@
             "ALL": "ALL",
             "Headline": "Toolhead",
             "Invalid": "Invalid",
-            "ManualProbe": {
-                "Abort": "abort",
-                "Accept": "accept",
-                "Advanced": "Advanced",
-                "Current": "current",
-                "Headline": "Manual Probe",
-                "MinMax": "min: {min} / max: {max}"
-            },
             "OutOfRange": "Out of range!",
             "PleaseConfigureSteps": "Please configure steps",
             "Position": "Position",

From d6985b07813ea37330c9ee21a72dbfd2b1698acd Mon Sep 17 00:00:00 2001
From: Stefan Dej <meteyou@gmail.com>
Date: Sun, 18 Sep 2022 00:24:41 +0200
Subject: [PATCH 8/9] locale(en): remove unused keys

Signed-off-by: Stefan Dej <meteyou@gmail.com>
---
 src/locales/en.json | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/src/locales/en.json b/src/locales/en.json
index 9042871dc..1ee743a6e 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -462,9 +462,7 @@
         "Abort": "abort",
         "Accept": "accept",
         "Advanced": "Advanced",
-        "Current": "current",
-        "Headline": "Manual Probe",
-        "MinMax": "min: {min} / max: {max}"
+        "Headline": "Manual Probe"
     },
     "Panels": {
         "ExtruderControlPanel": {

From 606f070a90354a8f6d1c4aaf2e77343f3465b4cd Mon Sep 17 00:00:00 2001
From: Stefan Dej <meteyou@gmail.com>
Date: Sun, 18 Sep 2022 00:24:52 +0200
Subject: [PATCH 9/9] locale(de): add DE locale

Signed-off-by: Stefan Dej <meteyou@gmail.com>
---
 src/locales/de.json | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/src/locales/de.json b/src/locales/de.json
index f2f363f00..fae95c673 100644
--- a/src/locales/de.json
+++ b/src/locales/de.json
@@ -458,6 +458,12 @@
             "UpToDate": "aktuell"
         }
     },
+    "ManualProbe": {
+        "Abort": "abbrechen",
+        "Accept": "akzeptieren",
+        "Advanced": "Erweitert",
+        "Headline": "Manuelle Messung"
+    },
     "Panels": {
         "ExtruderControlPanel": {
             "Allowed": "Erlaubt",