From aab7860d827792fdede139d44c5db074a2304e24 Mon Sep 17 00:00:00 2001
From: PAJohnson <pajohns4@ncsu.edu>
Date: Tue, 15 Sep 2020 00:48:17 -0400
Subject: [PATCH] Started work on tooltips for wizard choices. Tried out some
 prepackaged components - too complicated! Going to make a custom one.

---
 GUI/src/assets/images/temp.png           | Bin 0 -> 1866 bytes
 GUI/src/assets/wizard/wizard.js          |  69 ++++++++++++++++-------
 GUI/src/components/wizard/wizardPage.vue |   6 +-
 GUI/src/main.js                          |   3 +-
 4 files changed, 55 insertions(+), 23 deletions(-)
 create mode 100644 GUI/src/assets/images/temp.png

diff --git a/GUI/src/assets/images/temp.png b/GUI/src/assets/images/temp.png
new file mode 100644
index 0000000000000000000000000000000000000000..ff8084cf628a9f11d8624522f147ee99336bd047
GIT binary patch
literal 1866
zcmeHI|5MTj82(t<Ohfa`nPqX=%G>hGsi~>pCrf9v89OaE=XcYrMDa_TFg}2nUSv7R
z!zt;I-MPzcCa7d$A}l>5HSt;|8pS6>AoEO+6GQ=re?`Ca-aYre&->f+ym#+Y^WFIb
zg!6u9000n}vvElP;NZUnr)~C)5$Ww~Zw}>238w*$)Mvp?b`-=W#sWY$-NlmQXy?01
z&Zd?Ffa~xU93=R^@&I5bjERfAK*(H@=cLH_+bW-@db#AHAKaYiVhZ=(sIS7&Fj`34
zZ?b)x7vHmr$a!TmxSXxolj~c}bUJ+O^sP_hNAjWIwr<tTUT(ElRwm3j6C)6!$ij^t
zO2J%_w?(dW#B+ltn<fRWB7WdoL(hUQ7{C*e5hRM0a8=i9)3&h4YmaWq<Dp2Q=K&WA
zTW=i6eA6cxyjSoIn(GnI=cuO%Bf?f&PBMJ?P5)ey)acBSEd`Z*S-da&P6^36P{^;P
z3j5#cQhfZ^ObvZUZ4f=Qi3pCc;4BZNc;y0hkJ5zc3!GhBUT+`pP1hW{Y5iiTDh&D|
z!$7DOb#krdLlKq$@7B;E^+JY_iNLNK)Eh_AHPA1q$C@*FQML|lGJZMB734Mtl;u)q
zAnW28>j~(hz&~fzP|95KbFVwz&nmlg7=%^2cxZFQBa&F{H9XGtQ-5%3DhyH?>!x*z
zCk-UtZX+#GM!inZ7Fzn;g>om&bF{)rkj`1$&$liNVu|<k<Qd~^Gh6(3g4?@+*>zeN
zuIO6${FX8Tvz)l`1g#*NYt}Gpwy~))^-og=+cmnG+DmwZte8AS8(pWlgqu#JY1`bT
zUqN~F4jB0}TUztGtzt+S(WJho@KT1rAy-tVT(vsgjKxy<p&56z_hIkoAH!+g-CFUy
z6?`ZeCK2~*YfIiQnqg06$d!GeVEyoH4C*BHT_xqm82o>-3PvogFIT7zVwjMy$^^bb
z_lk}Vy>yR85xvHlFYhkY`$&yO==&GDgz`7z*=7MI3r^g5P;tA>5v$nTPC^Oj?PW$M
zF7@Jk)ckwhe5Z7=QC;~fQc&@pvSD^$?QVHM<!6^;dBJW8d{HBNsg#gU^76ZG+YAmZ
z^-&%~xUxfPW1^xr*DLETFCwSA!t}VOxPN}Da-7uIMOWZdP#l3=lz-Bh)JXT1EElXj
zb;x)&4W<WY4e>{~k#2ag;+*Xc=;w3)wTR*8JG5BX#x)gqAlSV0nAVZ;@llwW+L<$0
zZSwTjcunBN)8}kFQE;eG(EaBN^Y{_Vhq48k+(5i9$-_%4kmU%O6r#MfWrmMMGB>V~
zd)$h}ECxplmC#jc#svGW6CO1v@HxSMOgTx301p(We-=YH1>)ie`bX>arU?^O-$gwh
zSmpLPs>SdeT_?k%ZzM<NS7U=V=*7zoC=eM=h<u!;)v8)x1*n!suV(QOqN2o<U?I`t
zU$Mjl&+g}J|9YTr&dShkUhRLze>FYEBE6<$4)0(r+0XA=y@~zwBR_6HB#9_iH*B)r
V7?HNO!=8TtCjNXJ=XCas{{b;pFMI$1

literal 0
HcmV?d00001

diff --git a/GUI/src/assets/wizard/wizard.js b/GUI/src/assets/wizard/wizard.js
index 62794773..200dcf2b 100644
--- a/GUI/src/assets/wizard/wizard.js
+++ b/GUI/src/assets/wizard/wizard.js
@@ -21,11 +21,13 @@ export let pages = {
                 imageURL: require("../images/24v_300x300.png"),
                 text: "ODrive v3.6 24V",
                 hooks: [],
+                tooltip: null,
             },
             {
                 imageURL: require("../images/56v_300x300.png"),
                 text: "ODrive v3.6 56V",
                 hooks: [],
+                tooltip: null,
             },
         ],
         customComponents: [],
@@ -44,6 +46,8 @@ export let pages = {
                 component: "wizardBrake",
                 id: 0,
                 data: {},
+                tooltip: "When you slow down a motor, the energy has to go somewhere.\n\r \
+                            It either goes to the brake resistor or back to your power supply."
             }
         ],
     },
@@ -73,6 +77,7 @@ export let pages = {
                         },
                     },
                 },
+                tooltip: null,
             },
             {
                 imageURL: require("../images/D6374_300x300.png"),
@@ -92,6 +97,7 @@ export let pages = {
                         },
                     },
                 },
+                tooltip: null,
             },
         ],
         customComponents: [
@@ -100,7 +106,8 @@ export let pages = {
                 id: 0,
                 data: {
                     axis: "axis0",
-                }
+                },
+                tooltip: null,
             },
         ],
         pageComponents: [
@@ -143,6 +150,7 @@ export let pages = {
                         }
                     }
                 },
+                tooltip: null,
             },
             {
                 imageURL: require("../images/hall_effect_300x300.png"),
@@ -165,6 +173,7 @@ export let pages = {
                         }
                     }
                 },
+                tooltip: null,
             },
         ],
         customComponents: [
@@ -173,14 +182,16 @@ export let pages = {
                 id: 0,
                 data: {
                     axis: "axis0",
-                }
+                },
+                tooltip: null,
             },
             {
                 component: "wizardEncoderIncrementalIndex",
                 id: 1,
                 data: {
                     axis: "axis0",
-                }
+                },
+                tooltip: null,
             },
         ],
         pageComponents: [
@@ -212,7 +223,7 @@ export let pages = {
         requirements: [],
         choices: [
             {
-                imageURL: "",
+                imageURL: require("../images/temp.png"),
                 text: "Position Control",
                 hooks: [],
                 configStub: {
@@ -224,9 +235,10 @@ export let pages = {
                         },
                     },
                 },
+                tooltip: "Use this mode to control the position of the motor"
             },
             {
-                imageURL: "",
+                imageURL: require("../images/temp.png"),
                 text: "Velocity Control",
                 hooks: [],
                 configStub: {
@@ -238,9 +250,10 @@ export let pages = {
                         },
                     },
                 },
+                tooltip: "Use this mode to control the velocity of the motor"
             },
             {
-                imageURL: "",
+                imageURL: require("../images/temp.png"),
                 text: "Torque Control",
                 hooks: [],
                 configStub: {
@@ -252,9 +265,10 @@ export let pages = {
                         },
                     },
                 },
+                tooltip: "Use this mode to control the torque output of the motor"
             },
             {
-                imageURL: "",
+                imageURL: require("../images/temp.png"),
                 text: "Voltage Control",
                 hooks: [],
                 configStub: {
@@ -266,6 +280,7 @@ export let pages = {
                         },
                     },
                 },
+                tooltip: "This mode is used for gimbal motors"
             },
         ],
         customComponents: [],
@@ -285,7 +300,8 @@ export let pages = {
                 id: 0,
                 data: {
                     axis: "axis0",
-                }
+                },
+                tooltip: null,
             },
         ],
         pageComponents: [],
@@ -315,6 +331,7 @@ export let pages = {
                         },
                     },
                 },
+                tooltip: null,
             },
             {
                 imageURL: require("../images/D6374_300x300.png"),
@@ -333,6 +350,7 @@ export let pages = {
                         },
                     },
                 },
+                tooltip: null,
             },
         ],
         customComponents: [
@@ -341,7 +359,8 @@ export let pages = {
                 id: 0,
                 data: {
                     axis: "axis1",
-                }
+                },
+                tooltip: null,
             },
         ],
         pageComponents: [
@@ -384,6 +403,7 @@ export let pages = {
                         }
                     }
                 },
+                tooltip: null,
             },
             {
                 imageURL: require("../images/hall_effect_300x300.png"),
@@ -406,6 +426,7 @@ export let pages = {
                         }
                     }
                 },
+                tooltip: null,
             },
         ],
         customComponents: [
@@ -414,14 +435,16 @@ export let pages = {
                 id: 0,
                 data: {
                     axis: "axis1",
-                }
+                },
+                tooltip: null,
             },
             {
                 component: "wizardEncoderIncrementalIndex",
                 id: 1,
                 data: {
                     axis: "axis1",
-                }
+                },
+                tooltip: null,
             },
         ],
         pageComponents: [
@@ -452,11 +475,11 @@ export let pages = {
         requirements: [],
         choices: [
             {
-                imageURL: "",
+                imageURL: require("../images/temp.png"),
                 text: "Position Control",
                 hooks: [],
                 configStub: {
-                    axis0: {
+                    axis1: {
                         controller: {
                             config: {
                                 control_mode: odriveEnums.CONTROL_MODE_POSITION_CONTROL,
@@ -464,13 +487,14 @@ export let pages = {
                         },
                     },
                 },
+                tooltip: "Use this mode to control the position of the motor"
             },
             {
-                imageURL: "",
+                imageURL: require("../images/temp.png"),
                 text: "Velocity Control",
                 hooks: [],
                 configStub: {
-                    axis0: {
+                    axis1: {
                         controller: {
                             config: {
                                 control_mode: odriveEnums.CONTROL_MODE_VELOCITY_CONTROL,
@@ -478,13 +502,14 @@ export let pages = {
                         },
                     },
                 },
+                tooltip: "Use this mode to control the velocity of the motor"
             },
             {
-                imageURL: "",
+                imageURL: require("../images/temp.png"),
                 text: "Torque Control",
                 hooks: [],
                 configStub: {
-                    axis0: {
+                    axis1: {
                         controller: {
                             config: {
                                 control_mode: odriveEnums.CONTROL_MODE_TORQUE_CONTROL,
@@ -492,13 +517,14 @@ export let pages = {
                         },
                     },
                 },
+                tooltip: "Use this mode to control the torque output of the motor"
             },
             {
-                imageURL: "",
+                imageURL: require("../images/temp.png"),
                 text: "Voltage Control",
                 hooks: [],
                 configStub: {
-                    axis0: {
+                    axis1: {
                         controller: {
                             config: {
                                 control_mode: odriveEnums.CONTROL_MODE_VOLTAGE_CONTROL,
@@ -506,6 +532,7 @@ export let pages = {
                         },
                     },
                 },
+                tooltip: "This mode is used for gimbal motors"
             },
         ],
         customComponents: [],
@@ -525,7 +552,8 @@ export let pages = {
                 id: 0,
                 data: {
                     axis: "axis1",
-                }
+                },
+                tooltip: null,
             },
         ],
         pageComponents: [],
@@ -542,6 +570,7 @@ export let pages = {
             {
                 component: "wizardEnd",
                 id: 0,
+                tooltip: null,
             }
         ],
         pageComponents: [],
diff --git a/GUI/src/components/wizard/wizardPage.vue b/GUI/src/components/wizard/wizardPage.vue
index 10becca9..81ed183d 100644
--- a/GUI/src/components/wizard/wizardPage.vue
+++ b/GUI/src/components/wizard/wizardPage.vue
@@ -38,6 +38,7 @@
 </template>
 
 <script>
+import Tooltip from "vue-directive-tooltip";
 import wizardChoice from "./choices/wizardChoice.vue";
 import wizardMisc from "./choices/wizardMisc.vue";
 import wizardMotor from "./choices/wizardMotor.vue";
@@ -70,6 +71,7 @@ export default {
     wizardMotorMeasure,
     wizardEncoderCal,
     wizardBrake,
+    Tooltip,
   },
   data: function () {
     return {
@@ -82,8 +84,8 @@ export default {
       this.$emit("choice", e);
     },
     pageCompEvent(e) {
-      this.$emit('page-comp-event',e);
-    }
+      this.$emit("page-comp-event", e);
+    },
   },
 };
 </script>
diff --git a/GUI/src/main.js b/GUI/src/main.js
index 4b4ad3a5..6879204d 100644
--- a/GUI/src/main.js
+++ b/GUI/src/main.js
@@ -1,6 +1,7 @@
 import Vue from 'vue'
 import App from './App.vue'
-import store from './store';
+import store from './store'
+
 
 Vue.config.productionTip = false