From 1204ca5a0f0035ad68e63bd27e200338afc0b94a Mon Sep 17 00:00:00 2001
From: Eugene Serb <46799701+eugene-serb@users.noreply.github.com>
Date: Wed, 3 Jan 2024 21:42:45 +0300
Subject: [PATCH 1/5] #59 refactor diagnostic app, made show mock diagnostic
 interface, when no connected gamepads, update styles

---
 src/components/molecules/MDiagnosticItem.vue | 327 +++++++++++++++----
 src/components/organisms/ODiagnostic.vue     |  22 +-
 2 files changed, 285 insertions(+), 64 deletions(-)

diff --git a/src/components/molecules/MDiagnosticItem.vue b/src/components/molecules/MDiagnosticItem.vue
index 473b224..24abe81 100644
--- a/src/components/molecules/MDiagnosticItem.vue
+++ b/src/components/molecules/MDiagnosticItem.vue
@@ -1,20 +1,22 @@
 <script setup lang="ts">
-import { defineComponent, defineProps } from 'vue';
+import { defineComponent, defineProps, computed } from 'vue';
 
 import type { PropType } from 'vue';
-import type { TVibrator } from '@/models';
 
 defineComponent({
   name: 'MDiagnosticItem',
 });
 
-defineProps({
+/**
+ * Входные параметры компонента.
+ */
+const props = defineProps({
   /**
    * Геймпад.
    */
   gamepad: {
-    type: Object as PropType<TVibrator>,
-    required: true,
+    type: Object as PropType<Gamepad | null>,
+    default: null,
   },
   /**
    * Временная метка.
@@ -27,87 +29,286 @@ defineProps({
     required: true,
   },
 });
+
+/**
+ * Индекс геймпада.
+ */
+const gamepadIndex = computed<string>(() => props.gamepad ? String(props.gamepad.index + 1) : '1');
+
+/**
+ * ID геймпада.
+ */
+const gamepadId = computed<string>(() => props.gamepad ? props.gamepad.id : 'Missing');
+
+/**
+ * Кнопка "A".
+ */
+const aButton = computed<number>(() =>
+  props.gamepad && props.gamepad.buttons[0].value
+  ? props.gamepad.buttons[0].value
+  : 0
+);
+
+/**
+ * Кнопка "B".
+ */
+const bButton = computed<number>(() =>
+  props.gamepad && props.gamepad.buttons[1].value
+  ? props.gamepad.buttons[1].value
+  : 0
+);
+
+/**
+ * Кнопка "X".
+ */
+const xButton = computed<number>(() =>
+  props.gamepad && props.gamepad.buttons[2].value
+  ? props.gamepad.buttons[2].value
+  : 0
+);
+
+/**
+ * Кнопка "Y".
+ */
+const yButton = computed<number>(() =>
+  props.gamepad && props.gamepad.buttons[3].value
+  ? props.gamepad.buttons[3].value
+  : 0
+);
+
+/**
+ * Кнопка "LB".
+ */
+const lbButton = computed<number>(() =>
+  props.gamepad && props.gamepad.buttons[4].value
+  ? props.gamepad.buttons[4].value
+  : 0
+);
+
+/**
+ * Кнопка "RB".
+ */
+const rbButton = computed<number>(() =>
+  props.gamepad && props.gamepad.buttons[5].value
+  ? props.gamepad.buttons[5].value
+  : 0
+);
+
+/**
+ * Кнопка "LT".
+ */
+const ltButton = computed<number>(() =>
+  props.gamepad && props.gamepad.buttons[6].value
+  ? props.gamepad.buttons[6].value
+  : 0
+);
+
+/**
+ * Кнопка "RT".
+ */
+const rtButton = computed<number>(() =>
+  props.gamepad && props.gamepad.buttons[7].value
+  ? props.gamepad.buttons[7].value
+  : 0
+);
+
+/**
+ * Кнопка "Back".
+ */
+const backButton = computed<number>(() =>
+  props.gamepad && props.gamepad.buttons[8].value
+  ? props.gamepad.buttons[8].value
+  : 0
+);
+
+/**
+ * Кнопка "Start".
+ */
+const startButton = computed<number>(() =>
+  props.gamepad && props.gamepad.buttons[9].value
+  ? props.gamepad.buttons[9].value
+  : 0
+);
+
+/**
+ * Кнопка "Left Stick".
+ */
+const leftStickButton = computed<number>(() =>
+  props.gamepad && props.gamepad.buttons[10].value
+  ? props.gamepad.buttons[10].value
+  : 0
+);
+
+/**
+ * Кнопка "Right Stick".
+ */
+const rightStickButton = computed<number>(() =>
+  props.gamepad && props.gamepad.buttons[11].value
+  ? props.gamepad.buttons[11].value
+  : 0
+);
+
+/**
+ * Кнопка "Forward".
+ */
+const forwardButton = computed<number>(() =>
+  props.gamepad && props.gamepad.buttons[12].value
+  ? props.gamepad.buttons[12].value
+  : 0
+);
+
+/**
+ * Кнопка "Backward".
+ */
+const backwardButton = computed<number>(() =>
+  props.gamepad && props.gamepad.buttons[13].value
+  ? props.gamepad.buttons[13].value
+  : 0
+);
+
+/**
+ * Кнопка "Left".
+ */
+const leftButton = computed<number>(() =>
+  props.gamepad && props.gamepad.buttons[14].value
+  ? props.gamepad.buttons[14].value
+  : 0
+);
+
+/**
+ * Кнопка "Right".
+ */
+const rightButton = computed<number>(() =>
+  props.gamepad && props.gamepad.buttons[15].value
+  ? props.gamepad.buttons[15].value
+  : 0
+);
+
+/**
+ * Ось "X" левого стика.
+ */
+const leftStickX = computed<number>(() =>
+  props.gamepad && props.gamepad.axes[0]
+  ? props.gamepad.axes[0]
+  : 0
+);
+
+/**
+ * Ось "Y" левого стика.
+ */
+const leftStickY = computed<number>(() =>
+  props.gamepad && props.gamepad.axes[1]
+  ? props.gamepad.axes[1]
+  : 0
+);
+
+/**
+ * Ось "X" правого стика.
+ */
+const rightStickX = computed<number>(() =>
+  props.gamepad && props.gamepad.axes[2]
+  ? props.gamepad.axes[2]
+  : 0
+);
+
+/**
+ * Ось "Y" правого стика.
+ */
+const rightStickY = computed<number>(() =>
+  props.gamepad && props.gamepad.axes[3]
+  ? props.gamepad.axes[3]
+  : 0
+);
+
+/**
+ * Наличие вибропривода.
+ */
+const vibrationActuator = computed<string>(() =>
+  props.gamepad && props.gamepad.vibrationActuator
+  ? 'Available'
+  : 'Missing'
+);
 </script>
 
 <template>
   <div class="output-gamepad">
-    <h3>#{{ gamepad.device.index + 1 }}. {{ gamepad.device.id }}</h3>
+    <h3>#{{ gamepadIndex }}. {{ gamepadId }}</h3>
     <div class="gamepad-group">
       <div>
-        <span :class="[gamepad.device.buttons[0].value === 1 ? 'pressed' : '']">
-          A: {{ gamepad.device.buttons[0].value.toFixed(2) }}
+        <span :class="[aButton ? 'pressed' : '']">
+          A: {{ aButton.toFixed(2) }}
         </span>
-        <span :class="[gamepad.device.buttons[1].value === 1 ? 'pressed' : '']">
-          B: {{ gamepad.device.buttons[1].value.toFixed(2) }}
+        <span :class="[bButton ? 'pressed' : '']">
+          B: {{ bButton.toFixed(2) }}
         </span>
-        <span :class="[gamepad.device.buttons[2].value === 1 ? 'pressed' : '']">
-          X: {{ gamepad.device.buttons[2].value.toFixed(2) }}
+        <span :class="[xButton ? 'pressed' : '']">
+          X: {{ xButton.toFixed(2) }}
         </span>
-        <span :class="[gamepad.device.buttons[3].value === 1 ? 'pressed' : '']">
-          Y: {{ gamepad.device.buttons[3].value.toFixed(2) }}
+        <span :class="[yButton ? 'pressed' : '']">
+          Y: {{ yButton.toFixed(2) }}
         </span>
       </div>
       <div>
-        <span :class="[gamepad.device.buttons[4].value === 1 ? 'pressed' : '']">
-          LB: {{ gamepad.device.buttons[4].value.toFixed(2) }}
+        <span :class="[lbButton ? 'pressed' : '']">
+          LB: {{ lbButton.toFixed(2) }}
         </span>
-        <span :class="[gamepad.device.buttons[5].value === 1 ? 'pressed' : '']">
-          RB: {{ gamepad.device.buttons[5].value.toFixed(2) }}
+        <span :class="[rbButton ? 'pressed' : '']">
+          RB: {{ rbButton.toFixed(2) }}
         </span>
-        <span :class="[gamepad.device.buttons[6].value === 1 ? 'pressed' : '']">
-          LT: {{ gamepad.device.buttons[6].value.toFixed(2) }}
+        <span :class="[ltButton ? 'pressed' : '']">
+          LT: {{ ltButton.toFixed(2) }}
         </span>
-        <span :class="[gamepad.device.buttons[7].value === 1 ? 'pressed' : '']">
-          RT: {{ gamepad.device.buttons[7].value.toFixed(2) }}
+        <span :class="[rtButton ? 'pressed' : '']">
+          RT: {{ rtButton.toFixed(2) }}
         </span>
       </div>
       <div>
-        <span :class="[gamepad.device.buttons[8].value === 1 ? 'pressed' : '']">
-          Back: {{ gamepad.device.buttons[8].value.toFixed(2) }}
+        <span :class="[backButton ? 'pressed' : '']">
+          Back: {{ backButton.toFixed(2) }}
         </span>
-        <span :class="[gamepad.device.buttons[9].value === 1 ? 'pressed' : '']">
-          Start: {{ gamepad.device.buttons[9].value.toFixed(2) }}
+        <span :class="[startButton ? 'pressed' : '']">
+          Start: {{ startButton.toFixed(2) }}
         </span>
-        <span :class="[gamepad.device.buttons[10].value === 1 ? 'pressed' : '']">
-          Left Stick: {{ gamepad.device.buttons[10].value.toFixed(2) }}
+        <span :class="[leftStickButton ? 'pressed' : '']">
+          Left Stick: {{ leftStickButton.toFixed(2) }}
         </span>
-        <span :class="[gamepad.device.buttons[11].value === 1 ? 'pressed' : '']">
-          Right Stick: {{ gamepad.device.buttons[11].value.toFixed(2) }}
+        <span :class="[rightStickButton ? 'pressed' : '']">
+          Right Stick: {{ rightStickButton.toFixed(2) }}
         </span>
       </div>
       <div>
-        <span :class="[gamepad.device.buttons[12].value === 1 ? 'pressed' : '']">
-          Forward: {{ gamepad.device.buttons[12].value.toFixed(2) }}
+        <span :class="[forwardButton ? 'pressed' : '']">
+          Forward: {{ forwardButton.toFixed(2) }}
         </span>
-        <span :class="[gamepad.device.buttons[13].value === 1 ? 'pressed' : '']">
-          Backward: {{ gamepad.device.buttons[13].value.toFixed(2) }}
+        <span :class="[backwardButton ? 'pressed' : '']">
+          Backward: {{ backwardButton.toFixed(2) }}
         </span>
-        <span :class="[gamepad.device.buttons[14].value === 1 ? 'pressed' : '']">
-          Left: {{ gamepad.device.buttons[14].value.toFixed(2) }}
+        <span :class="[leftButton ? 'pressed' : '']">
+          Left: {{ leftButton.toFixed(2) }}
         </span>
-        <span :class="[gamepad.device.buttons[15].value === 1 ? 'pressed' : '']">
-          Right: {{ gamepad.device.buttons[15].value.toFixed(2) }}
+        <span :class="[rightButton ? 'pressed' : '']">
+          Right: {{ rightButton.toFixed(2) }}
         </span>
       </div>
       <div>
         <span>
-          Left Stick X: {{ gamepad.device.axes[0] ? gamepad.device.axes[0].toFixed(2) : 'missing' }}
+          Left Stick X: {{ leftStickX ? leftStickX.toFixed(2) : 'Missing' }}
         </span>
         <span>
-          Left Stick Y: {{ gamepad.device.axes[1] ? gamepad.device.axes[1].toFixed(2) : 'missing' }}
+          Left Stick Y: {{ leftStickY ? leftStickY.toFixed(2) : 'Missing' }}
         </span>
         <span>
           Right Stick X:
-          {{ gamepad.device.axes[2] ? gamepad.device.axes[2].toFixed(2) : 'missing' }}
+          {{ rightStickX ? rightStickX.toFixed(2) : 'Missing' }}
         </span>
         <span>
           Right Stick Y:
-          {{ gamepad.device.axes[3] ? gamepad.device.axes[3].toFixed(2) : 'missing' }}
+          {{ rightStickY ? rightStickY.toFixed(2) : 'Missing' }}
         </span>
       </div>
     </div>
     <span>
-      Vibration Actuator: {{ gamepad.device.vibrationActuator ? 'Available' : 'Missing' }}
+      Vibration Actuator: {{ vibrationActuator }}
     </span>
   </div>
 </template>
@@ -122,22 +323,34 @@ defineProps({
   flex-direction: column;
   justify-content: space-between;
   gap: 16px;
-}
 
-.gamepad-group {
-  display: grid;
-  grid-template-columns: repeat(5, 1fr);
-}
+  > .gamepad-group {
+    @media only screen and (min-width: 520px) {
+      display: grid;
+      grid-template-columns: repeat(2, 1fr);
+    }
 
-.gamepad-group > div {
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-  gap: 8px;
-}
+    @media only screen and (min-width: 680px) {
+      display: grid;
+      grid-template-columns: repeat(3, 1fr);
+    }
+
+    @media only screen and (min-width: 840px) {
+      grid-template-columns: repeat(5, 1fr);
+    }
+
+    > div {
+      display: flex;
+      flex-direction: column;
+      justify-content: space-between;
+      gap: 8px;
+      margin-top: 8px;
 
-.pressed {
-  background-color: var(--color-link-hover);
-  color: var(--color-background);
+      > .pressed {
+        background-color: var(--color-link-hover);
+        color: var(--color-background);
+      }
+    }
+  }
 }
 </style>
diff --git a/src/components/organisms/ODiagnostic.vue b/src/components/organisms/ODiagnostic.vue
index d29cb29..6435867 100644
--- a/src/components/organisms/ODiagnostic.vue
+++ b/src/components/organisms/ODiagnostic.vue
@@ -8,17 +8,25 @@ defineComponent({
   name: 'ODiagnostic',
 });
 
+/**
+ * Хранилище геймпадов.
+ */
 const store = useGamepadsStore();
 const { gamepads, timestamp } = storeToRefs(store);
 </script>
 
 <template>
-  <div v-if="gamepads.length" class="content-item">
-    <MDiagnosticItem
-      v-for="gamepad in gamepads"
-      :key="gamepad.id"
-      :gamepad="gamepad"
-      :timestamp="timestamp"
-    />
+  <div class="content-item">
+    <template v-if="gamepads.length">
+      <MDiagnosticItem
+        v-for="gamepad in gamepads"
+        :key="gamepad.id"
+        :gamepad="gamepad.device"
+        :timestamp="timestamp"
+      />
+    </template>
+    <template v-else>
+      <MDiagnosticItem :timestamp="timestamp" />
+    </template>
   </div>
 </template>

From 17b75c00c53de3a0facda3e72ccbff0b14c16d3c Mon Sep 17 00:00:00 2001
From: Eugene Serb <46799701+eugene-serb@users.noreply.github.com>
Date: Wed, 3 Jan 2024 21:43:52 +0300
Subject: [PATCH 2/5] #59 add jsdoc comments

---
 src/components/molecules/MPattern.vue     | 6 ++++++
 src/components/molecules/MPatternList.vue | 3 +++
 src/components/organisms/OManual.vue      | 3 +++
 src/components/organisms/OPatterns.vue    | 3 +++
 src/layouts/LGamepad.vue                  | 3 +++
 5 files changed, 18 insertions(+)

diff --git a/src/components/molecules/MPattern.vue b/src/components/molecules/MPattern.vue
index 56795fe..177560b 100644
--- a/src/components/molecules/MPattern.vue
+++ b/src/components/molecules/MPattern.vue
@@ -8,6 +8,9 @@ defineComponent({
   name: 'MPattern',
 });
 
+/**
+ * Входные параметры компонента.
+ */
 const props = defineProps({
   /**
    * Шаблон вибрации.
@@ -39,6 +42,9 @@ const props = defineProps({
   },
 });
 
+/**
+ * События, которые может сгенерировать компонент.
+ */
 const emits = defineEmits({
   click(index: number): boolean {
     return index >= 0;
diff --git a/src/components/molecules/MPatternList.vue b/src/components/molecules/MPatternList.vue
index 1311932..8cbcd90 100644
--- a/src/components/molecules/MPatternList.vue
+++ b/src/components/molecules/MPatternList.vue
@@ -33,6 +33,9 @@ defineProps({
   },
 });
 
+/**
+ * События, которые может сгенерировать компонент.
+ */
 const emits = defineEmits({
   click(index: number): boolean {
     return index >= 0;
diff --git a/src/components/organisms/OManual.vue b/src/components/organisms/OManual.vue
index 7d03116..b1417ca 100644
--- a/src/components/organisms/OManual.vue
+++ b/src/components/organisms/OManual.vue
@@ -9,6 +9,9 @@ defineComponent({
   name: 'OManual',
 });
 
+/**
+ * Хранилище геймпадов.
+ */
 const store = useGamepadsStore();
 const { gamepads, isActive, patternMode } = storeToRefs(store);
 const { vibrate, reset } = store;
diff --git a/src/components/organisms/OPatterns.vue b/src/components/organisms/OPatterns.vue
index d892976..b9efa86 100644
--- a/src/components/organisms/OPatterns.vue
+++ b/src/components/organisms/OPatterns.vue
@@ -9,6 +9,9 @@ defineComponent({
   name: 'OPatterns',
 });
 
+/**
+ * Хранилище геймпадов.
+ */
 const store = useGamepadsStore();
 const { patternMode, isActive } = storeToRefs(store);
 const { change, patterns } = store;
diff --git a/src/layouts/LGamepad.vue b/src/layouts/LGamepad.vue
index a90af64..7871db8 100644
--- a/src/layouts/LGamepad.vue
+++ b/src/layouts/LGamepad.vue
@@ -9,6 +9,9 @@ defineComponent({
   name: 'LGamepad',
 });
 
+/**
+ * Хранилище геймпадов.
+ */
 const store = useGamepadsStore();
 const { gamepads } = storeToRefs(store);
 </script>

From 70c87bfd1281ffe4d2ae928c60da6b7df15fb864 Mon Sep 17 00:00:00 2001
From: Eugene Serb <46799701+eugene-serb@users.noreply.github.com>
Date: Wed, 3 Jan 2024 21:45:02 +0300
Subject: [PATCH 3/5] #59 update sitemaps

---
 public/sitemap-internal.xml | 14 +++++++-------
 public/sitemap.xml          |  2 +-
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/public/sitemap-internal.xml b/public/sitemap-internal.xml
index ac8de61..f831246 100644
--- a/public/sitemap-internal.xml
+++ b/public/sitemap-internal.xml
@@ -2,43 +2,43 @@
 <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
   <url>
     <loc>https://wavelovers.ru/</loc>
-    <lastmod>2024-01-01</lastmod>
+    <lastmod>2024-01-03</lastmod>
     <changefreq>weekly</changefreq>
     <priority>1.0</priority>
   </url>
   <url>
     <loc>https://wavelovers.ru/custom</loc>
-    <lastmod>2024-01-01</lastmod>
+    <lastmod>2024-01-03</lastmod>
     <changefreq>weekly</changefreq>
     <priority>1.0</priority>
   </url>
   <url>
     <loc>https://wavelovers.ru/manual</loc>
-    <lastmod>2024-01-01</lastmod>
+    <lastmod>2024-01-03</lastmod>
     <changefreq>weekly</changefreq>
     <priority>1.0</priority>
   </url>
   <url>
     <loc>https://wavelovers.ru/diagnostic</loc>
-    <lastmod>2024-01-01</lastmod>
+    <lastmod>2024-01-03</lastmod>
     <changefreq>weekly</changefreq>
     <priority>1.0</priority>
   </url>
   <url>
     <loc>https://wavelovers.ru/faq</loc>
-    <lastmod>2024-01-01</lastmod>
+    <lastmod>2024-01-03</lastmod>
     <changefreq>weekly</changefreq>
     <priority>1.0</priority>
   </url>
   <url>
     <loc>https://wavelovers.ru/about</loc>
-    <lastmod>2024-01-01</lastmod>
+    <lastmod>2024-01-03</lastmod>
     <changefreq>weekly</changefreq>
     <priority>1.0</priority>
   </url>
   <url>
     <loc>https://wavelovers.ru/donate</loc>
-    <lastmod>2024-01-01</lastmod>
+    <lastmod>2024-01-03</lastmod>
     <changefreq>weekly</changefreq>
     <priority>1.0</priority>
   </url>
diff --git a/public/sitemap.xml b/public/sitemap.xml
index fea2604..cda5d2d 100644
--- a/public/sitemap.xml
+++ b/public/sitemap.xml
@@ -2,6 +2,6 @@
 <sitemapindex xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
   <sitemap>
     <loc>https://wavelovers.ru/sitemap-internal.xml</loc>
-    <lastmod>2024-01-01</lastmod>
+    <lastmod>2024-01-03</lastmod>
   </sitemap>
 </sitemapindex>

From 86fc4c59192b5a3119c7b59d9636f9ca5a50d951 Mon Sep 17 00:00:00 2001
From: Eugene Serb <46799701+eugene-serb@users.noreply.github.com>
Date: Wed, 3 Jan 2024 21:47:37 +0300
Subject: [PATCH 4/5] #59 up version and update dependencies

---
 package-lock.json | 120 +++++++++++++++++++++++-----------------------
 package.json      |   6 +--
 2 files changed, 63 insertions(+), 63 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 3818d8e..d7b9215 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,16 +1,16 @@
 {
   "name": "wavelovers",
-  "version": "1.16.0",
+  "version": "1.17.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "wavelovers",
-      "version": "1.16.0",
+      "version": "1.17.0",
       "license": "GNU GPL v3",
       "dependencies": {
         "pinia": "^2.1.7",
-        "vue": "^3.4.3",
+        "vue": "^3.4.4",
         "vue-meta-tag-updater": "^1.1.0",
         "vue-router": "^4.2.5"
       },
@@ -30,7 +30,7 @@
         "jsdom": "^23.0.1",
         "npm-run-all2": "^6.1.1",
         "prettier": "^3.1.1",
-        "sass": "^1.69.6",
+        "sass": "^1.69.7",
         "typescript": "~5.3.0",
         "vite": "^5.0.10",
         "vitest": "^1.1.1",
@@ -1855,36 +1855,36 @@
       }
     },
     "node_modules/@vue/compiler-core": {
-      "version": "3.4.3",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.4.3.tgz",
-      "integrity": "sha512-u8jzgFg0EDtSrb/hG53Wwh1bAOQFtc1ZCegBpA/glyvTlgHl+tq13o1zvRfLbegYUw/E4mSTGOiCnAJ9SJ+lsg==",
+      "version": "3.4.4",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.4.4.tgz",
+      "integrity": "sha512-U5AdCN+6skzh2bSJrkMj2KZsVkUpgK8/XlxjSRYQZhNPcvt9/kmgIMpFEiTyK+Dz5E1J+8o8//BEIX+bakgVSw==",
       "dependencies": {
         "@babel/parser": "^7.23.6",
-        "@vue/shared": "3.4.3",
+        "@vue/shared": "3.4.4",
         "entities": "^4.5.0",
         "estree-walker": "^2.0.2",
         "source-map-js": "^1.0.2"
       }
     },
     "node_modules/@vue/compiler-dom": {
-      "version": "3.4.3",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.4.3.tgz",
-      "integrity": "sha512-oGF1E9/htI6JWj/lTJgr6UgxNCtNHbM6xKVreBWeZL9QhRGABRVoWGAzxmtBfSOd+w0Zi5BY0Es/tlJrN6WgEg==",
+      "version": "3.4.4",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.4.4.tgz",
+      "integrity": "sha512-iSwkdDULCN+Vr8z6uwdlL044GJ/nUmECxP9vu7MzEs4Qma0FwDLYvnvRcyO0ZITuu3Os4FptGUDnhi1kOLSaGw==",
       "dependencies": {
-        "@vue/compiler-core": "3.4.3",
-        "@vue/shared": "3.4.3"
+        "@vue/compiler-core": "3.4.4",
+        "@vue/shared": "3.4.4"
       }
     },
     "node_modules/@vue/compiler-sfc": {
-      "version": "3.4.3",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.4.3.tgz",
-      "integrity": "sha512-NuJqb5is9I4uzv316VRUDYgIlPZCG8D+ARt5P4t5UDShIHKL25J3TGZAUryY/Aiy0DsY7srJnZL5ryB6DD63Zw==",
+      "version": "3.4.4",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.4.4.tgz",
+      "integrity": "sha512-OTFcU6vUxUNHBcarzkp4g6d25nvcmDvFDzPRvSrIsByFFPRYN+y3b+j9HxYwt6nlWvGyFCe0roeJdJlfYxbCBg==",
       "dependencies": {
         "@babel/parser": "^7.23.6",
-        "@vue/compiler-core": "3.4.3",
-        "@vue/compiler-dom": "3.4.3",
-        "@vue/compiler-ssr": "3.4.3",
-        "@vue/shared": "3.4.3",
+        "@vue/compiler-core": "3.4.4",
+        "@vue/compiler-dom": "3.4.4",
+        "@vue/compiler-ssr": "3.4.4",
+        "@vue/shared": "3.4.4",
         "estree-walker": "^2.0.2",
         "magic-string": "^0.30.5",
         "postcss": "^8.4.32",
@@ -1892,12 +1892,12 @@
       }
     },
     "node_modules/@vue/compiler-ssr": {
-      "version": "3.4.3",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.4.3.tgz",
-      "integrity": "sha512-wnYQtMBkeFSxgSSQbYGQeXPhQacQiog2c6AlvMldQH6DB+gSXK/0F6DVXAJfEiuBSgBhUc8dwrrG5JQcqwalsA==",
+      "version": "3.4.4",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.4.4.tgz",
+      "integrity": "sha512-1DU9DflSSQlx/M61GEBN+NbT/anUki2ooDo9IXfTckCeKA/2IKNhY8KbG3x6zkd3KGrxzteC7de6QL88vEb41Q==",
       "dependencies": {
-        "@vue/compiler-dom": "3.4.3",
-        "@vue/shared": "3.4.3"
+        "@vue/compiler-dom": "3.4.4",
+        "@vue/shared": "3.4.4"
       }
     },
     "node_modules/@vue/devtools-api": {
@@ -1993,48 +1993,48 @@
       }
     },
     "node_modules/@vue/reactivity": {
-      "version": "3.4.3",
-      "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.4.3.tgz",
-      "integrity": "sha512-q5f9HLDU+5aBKizXHAx0w4whkIANs1Muiq9R5YXm0HtorSlflqv9u/ohaMxuuhHWCji4xqpQ1eL04WvmAmGnFg==",
+      "version": "3.4.4",
+      "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.4.4.tgz",
+      "integrity": "sha512-DFsuJBf6sfhd5SYzJmcBTUG9+EKqjF31Gsk1NJtnpJm9liSZ806XwGJUeNBVQIanax7ODV7Lmk/k17BgxXNuTg==",
       "dependencies": {
-        "@vue/shared": "3.4.3"
+        "@vue/shared": "3.4.4"
       }
     },
     "node_modules/@vue/runtime-core": {
-      "version": "3.4.3",
-      "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.4.3.tgz",
-      "integrity": "sha512-C1r6QhB1qY7D591RCSFhMULyzL9CuyrGc+3PpB0h7dU4Qqw6GNyo4BNFjHZVvsWncrUlKX3DIKg0Y7rNNr06NQ==",
+      "version": "3.4.4",
+      "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.4.4.tgz",
+      "integrity": "sha512-zWWwNQAj5JdxrmOA1xegJm+c4VtyIbDEKgQjSb4va5v7gGTCh0ZjvLI+htGFdVXaO9bs2J3C81p5p+6jrPK8Bw==",
       "dependencies": {
-        "@vue/reactivity": "3.4.3",
-        "@vue/shared": "3.4.3"
+        "@vue/reactivity": "3.4.4",
+        "@vue/shared": "3.4.4"
       }
     },
     "node_modules/@vue/runtime-dom": {
-      "version": "3.4.3",
-      "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.4.3.tgz",
-      "integrity": "sha512-wrsprg7An5Ec+EhPngWdPuzkp0BEUxAKaQtN9dPU/iZctPyD9aaXmVtehPJerdQxQale6gEnhpnfywNw3zOv2A==",
+      "version": "3.4.4",
+      "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.4.4.tgz",
+      "integrity": "sha512-Nlh2ap1J/eJQ6R0g+AIRyGNwpTJQACN0dk8I8FRLH8Ev11DSvfcPOpn4+Kbg5xAMcuq0cHB8zFYxVrOgETrrvg==",
       "dependencies": {
-        "@vue/runtime-core": "3.4.3",
-        "@vue/shared": "3.4.3",
+        "@vue/runtime-core": "3.4.4",
+        "@vue/shared": "3.4.4",
         "csstype": "^3.1.3"
       }
     },
     "node_modules/@vue/server-renderer": {
-      "version": "3.4.3",
-      "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.4.3.tgz",
-      "integrity": "sha512-BUxt8oVGMKKsqSkM1uU3d3Houyfy4WAc2SpSQRebNd+XJGATVkW/rO129jkyL+kpB/2VRKzE63zwf5RtJ3XuZw==",
+      "version": "3.4.4",
+      "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.4.4.tgz",
+      "integrity": "sha512-+AjoiKcC41k7SMJBYkDO9xs79/Of8DiThS9mH5l2MK+EY0to3psI0k+sElvVqQvsoZTjHMEuMz0AEgvm2T+CwA==",
       "dependencies": {
-        "@vue/compiler-ssr": "3.4.3",
-        "@vue/shared": "3.4.3"
+        "@vue/compiler-ssr": "3.4.4",
+        "@vue/shared": "3.4.4"
       },
       "peerDependencies": {
-        "vue": "3.4.3"
+        "vue": "3.4.4"
       }
     },
     "node_modules/@vue/shared": {
-      "version": "3.4.3",
-      "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.3.tgz",
-      "integrity": "sha512-rIwlkkP1n4uKrRzivAKPZIEkHiuwY5mmhMJ2nZKCBLz8lTUlE73rQh4n1OnnMurXt1vcUNyH4ZPfdh8QweTjpQ=="
+      "version": "3.4.4",
+      "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.4.tgz",
+      "integrity": "sha512-abSgiVRhfjfl3JALR/cSuBl74hGJ3SePgf1mKzodf1eMWLwHZbfEGxT2cNJSsNiw44jEgrO7bNkhchaWA7RwNw=="
     },
     "node_modules/@vue/test-utils": {
       "version": "2.4.3",
@@ -5213,9 +5213,9 @@
       "dev": true
     },
     "node_modules/sass": {
-      "version": "1.69.6",
-      "resolved": "https://registry.npmjs.org/sass/-/sass-1.69.6.tgz",
-      "integrity": "sha512-qbRr3k9JGHWXCvZU77SD2OTwUlC+gNT+61JOLcmLm+XqH4h/5D+p4IIsxvpkB89S9AwJOyb5+rWNpIucaFxSFQ==",
+      "version": "1.69.7",
+      "resolved": "https://registry.npmjs.org/sass/-/sass-1.69.7.tgz",
+      "integrity": "sha512-rzj2soDeZ8wtE2egyLXgOOHQvaC2iosZrkF6v3EUG+tBwEvhqUCzm0VP3k9gHF9LXbSrRhT5SksoI56Iw8NPnQ==",
       "dev": true,
       "dependencies": {
         "chokidar": ">=3.0.0 <4.0.0",
@@ -5962,15 +5962,15 @@
       }
     },
     "node_modules/vue": {
-      "version": "3.4.3",
-      "resolved": "https://registry.npmjs.org/vue/-/vue-3.4.3.tgz",
-      "integrity": "sha512-GjN+culMAGv/mUbkIv8zMKItno8npcj5gWlXkSxf1SPTQf8eJ4A+YfHIvQFyL1IfuJcMl3soA7SmN1fRxbf/wA==",
-      "dependencies": {
-        "@vue/compiler-dom": "3.4.3",
-        "@vue/compiler-sfc": "3.4.3",
-        "@vue/runtime-dom": "3.4.3",
-        "@vue/server-renderer": "3.4.3",
-        "@vue/shared": "3.4.3"
+      "version": "3.4.4",
+      "resolved": "https://registry.npmjs.org/vue/-/vue-3.4.4.tgz",
+      "integrity": "sha512-suZXgDVT8lRNhKmxdkwOsR0oyUi8is7mtqI18qW97JLoyorEbE9B2Sb4Ws/mR/+0AgA/JUtsv1ytlRSH3/pDIA==",
+      "dependencies": {
+        "@vue/compiler-dom": "3.4.4",
+        "@vue/compiler-sfc": "3.4.4",
+        "@vue/runtime-dom": "3.4.4",
+        "@vue/server-renderer": "3.4.4",
+        "@vue/shared": "3.4.4"
       },
       "peerDependencies": {
         "typescript": "*"
diff --git a/package.json b/package.json
index 7bfc018..fe719ca 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "wavelovers",
-  "version": "1.16.0",
+  "version": "1.17.0",
   "description": "Wavelovers is a tool that can turn your gamepad into a vibration massager or simply a gamepad vibration and buttons test tool.",
   "keywords": [
     "wavelovers",
@@ -41,7 +41,7 @@
   },
   "dependencies": {
     "pinia": "^2.1.7",
-    "vue": "^3.4.3",
+    "vue": "^3.4.4",
     "vue-meta-tag-updater": "^1.1.0",
     "vue-router": "^4.2.5"
   },
@@ -61,7 +61,7 @@
     "jsdom": "^23.0.1",
     "npm-run-all2": "^6.1.1",
     "prettier": "^3.1.1",
-    "sass": "^1.69.6",
+    "sass": "^1.69.7",
     "typescript": "~5.3.0",
     "vite": "^5.0.10",
     "vitest": "^1.1.1",

From 065ea93257366a993db970fad56e01e626efd743 Mon Sep 17 00:00:00 2001
From: Eugene Serb <46799701+eugene-serb@users.noreply.github.com>
Date: Wed, 3 Jan 2024 21:52:18 +0300
Subject: [PATCH 5/5] #59 format

---
 src/components/molecules/MDiagnosticItem.vue | 150 +++++--------------
 1 file changed, 40 insertions(+), 110 deletions(-)

diff --git a/src/components/molecules/MDiagnosticItem.vue b/src/components/molecules/MDiagnosticItem.vue
index 24abe81..1a680cb 100644
--- a/src/components/molecules/MDiagnosticItem.vue
+++ b/src/components/molecules/MDiagnosticItem.vue
@@ -33,200 +33,160 @@ const props = defineProps({
 /**
  * Индекс геймпада.
  */
-const gamepadIndex = computed<string>(() => props.gamepad ? String(props.gamepad.index + 1) : '1');
+const gamepadIndex = computed<string>(() =>
+  props.gamepad ? String(props.gamepad.index + 1) : '1',
+);
 
 /**
  * ID геймпада.
  */
-const gamepadId = computed<string>(() => props.gamepad ? props.gamepad.id : 'Missing');
+const gamepadId = computed<string>(() => (props.gamepad ? props.gamepad.id : 'Missing'));
 
 /**
  * Кнопка "A".
  */
 const aButton = computed<number>(() =>
-  props.gamepad && props.gamepad.buttons[0].value
-  ? props.gamepad.buttons[0].value
-  : 0
+  props.gamepad && props.gamepad.buttons[0].value ? props.gamepad.buttons[0].value : 0,
 );
 
 /**
  * Кнопка "B".
  */
 const bButton = computed<number>(() =>
-  props.gamepad && props.gamepad.buttons[1].value
-  ? props.gamepad.buttons[1].value
-  : 0
+  props.gamepad && props.gamepad.buttons[1].value ? props.gamepad.buttons[1].value : 0,
 );
 
 /**
  * Кнопка "X".
  */
 const xButton = computed<number>(() =>
-  props.gamepad && props.gamepad.buttons[2].value
-  ? props.gamepad.buttons[2].value
-  : 0
+  props.gamepad && props.gamepad.buttons[2].value ? props.gamepad.buttons[2].value : 0,
 );
 
 /**
  * Кнопка "Y".
  */
 const yButton = computed<number>(() =>
-  props.gamepad && props.gamepad.buttons[3].value
-  ? props.gamepad.buttons[3].value
-  : 0
+  props.gamepad && props.gamepad.buttons[3].value ? props.gamepad.buttons[3].value : 0,
 );
 
 /**
  * Кнопка "LB".
  */
 const lbButton = computed<number>(() =>
-  props.gamepad && props.gamepad.buttons[4].value
-  ? props.gamepad.buttons[4].value
-  : 0
+  props.gamepad && props.gamepad.buttons[4].value ? props.gamepad.buttons[4].value : 0,
 );
 
 /**
  * Кнопка "RB".
  */
 const rbButton = computed<number>(() =>
-  props.gamepad && props.gamepad.buttons[5].value
-  ? props.gamepad.buttons[5].value
-  : 0
+  props.gamepad && props.gamepad.buttons[5].value ? props.gamepad.buttons[5].value : 0,
 );
 
 /**
  * Кнопка "LT".
  */
 const ltButton = computed<number>(() =>
-  props.gamepad && props.gamepad.buttons[6].value
-  ? props.gamepad.buttons[6].value
-  : 0
+  props.gamepad && props.gamepad.buttons[6].value ? props.gamepad.buttons[6].value : 0,
 );
 
 /**
  * Кнопка "RT".
  */
 const rtButton = computed<number>(() =>
-  props.gamepad && props.gamepad.buttons[7].value
-  ? props.gamepad.buttons[7].value
-  : 0
+  props.gamepad && props.gamepad.buttons[7].value ? props.gamepad.buttons[7].value : 0,
 );
 
 /**
  * Кнопка "Back".
  */
 const backButton = computed<number>(() =>
-  props.gamepad && props.gamepad.buttons[8].value
-  ? props.gamepad.buttons[8].value
-  : 0
+  props.gamepad && props.gamepad.buttons[8].value ? props.gamepad.buttons[8].value : 0,
 );
 
 /**
  * Кнопка "Start".
  */
 const startButton = computed<number>(() =>
-  props.gamepad && props.gamepad.buttons[9].value
-  ? props.gamepad.buttons[9].value
-  : 0
+  props.gamepad && props.gamepad.buttons[9].value ? props.gamepad.buttons[9].value : 0,
 );
 
 /**
  * Кнопка "Left Stick".
  */
 const leftStickButton = computed<number>(() =>
-  props.gamepad && props.gamepad.buttons[10].value
-  ? props.gamepad.buttons[10].value
-  : 0
+  props.gamepad && props.gamepad.buttons[10].value ? props.gamepad.buttons[10].value : 0,
 );
 
 /**
  * Кнопка "Right Stick".
  */
 const rightStickButton = computed<number>(() =>
-  props.gamepad && props.gamepad.buttons[11].value
-  ? props.gamepad.buttons[11].value
-  : 0
+  props.gamepad && props.gamepad.buttons[11].value ? props.gamepad.buttons[11].value : 0,
 );
 
 /**
  * Кнопка "Forward".
  */
 const forwardButton = computed<number>(() =>
-  props.gamepad && props.gamepad.buttons[12].value
-  ? props.gamepad.buttons[12].value
-  : 0
+  props.gamepad && props.gamepad.buttons[12].value ? props.gamepad.buttons[12].value : 0,
 );
 
 /**
  * Кнопка "Backward".
  */
 const backwardButton = computed<number>(() =>
-  props.gamepad && props.gamepad.buttons[13].value
-  ? props.gamepad.buttons[13].value
-  : 0
+  props.gamepad && props.gamepad.buttons[13].value ? props.gamepad.buttons[13].value : 0,
 );
 
 /**
  * Кнопка "Left".
  */
 const leftButton = computed<number>(() =>
-  props.gamepad && props.gamepad.buttons[14].value
-  ? props.gamepad.buttons[14].value
-  : 0
+  props.gamepad && props.gamepad.buttons[14].value ? props.gamepad.buttons[14].value : 0,
 );
 
 /**
  * Кнопка "Right".
  */
 const rightButton = computed<number>(() =>
-  props.gamepad && props.gamepad.buttons[15].value
-  ? props.gamepad.buttons[15].value
-  : 0
+  props.gamepad && props.gamepad.buttons[15].value ? props.gamepad.buttons[15].value : 0,
 );
 
 /**
  * Ось "X" левого стика.
  */
 const leftStickX = computed<number>(() =>
-  props.gamepad && props.gamepad.axes[0]
-  ? props.gamepad.axes[0]
-  : 0
+  props.gamepad && props.gamepad.axes[0] ? props.gamepad.axes[0] : 0,
 );
 
 /**
  * Ось "Y" левого стика.
  */
 const leftStickY = computed<number>(() =>
-  props.gamepad && props.gamepad.axes[1]
-  ? props.gamepad.axes[1]
-  : 0
+  props.gamepad && props.gamepad.axes[1] ? props.gamepad.axes[1] : 0,
 );
 
 /**
  * Ось "X" правого стика.
  */
 const rightStickX = computed<number>(() =>
-  props.gamepad && props.gamepad.axes[2]
-  ? props.gamepad.axes[2]
-  : 0
+  props.gamepad && props.gamepad.axes[2] ? props.gamepad.axes[2] : 0,
 );
 
 /**
  * Ось "Y" правого стика.
  */
 const rightStickY = computed<number>(() =>
-  props.gamepad && props.gamepad.axes[3]
-  ? props.gamepad.axes[3]
-  : 0
+  props.gamepad && props.gamepad.axes[3] ? props.gamepad.axes[3] : 0,
 );
 
 /**
  * Наличие вибропривода.
  */
 const vibrationActuator = computed<string>(() =>
-  props.gamepad && props.gamepad.vibrationActuator
-  ? 'Available'
-  : 'Missing'
+  props.gamepad && props.gamepad.vibrationActuator ? 'Available' : 'Missing',
 );
 </script>
 
@@ -235,40 +195,20 @@ const vibrationActuator = computed<string>(() =>
     <h3>#{{ gamepadIndex }}. {{ gamepadId }}</h3>
     <div class="gamepad-group">
       <div>
-        <span :class="[aButton ? 'pressed' : '']">
-          A: {{ aButton.toFixed(2) }}
-        </span>
-        <span :class="[bButton ? 'pressed' : '']">
-          B: {{ bButton.toFixed(2) }}
-        </span>
-        <span :class="[xButton ? 'pressed' : '']">
-          X: {{ xButton.toFixed(2) }}
-        </span>
-        <span :class="[yButton ? 'pressed' : '']">
-          Y: {{ yButton.toFixed(2) }}
-        </span>
+        <span :class="[aButton ? 'pressed' : '']">A: {{ aButton.toFixed(2) }}</span>
+        <span :class="[bButton ? 'pressed' : '']">B: {{ bButton.toFixed(2) }}</span>
+        <span :class="[xButton ? 'pressed' : '']">X: {{ xButton.toFixed(2) }}</span>
+        <span :class="[yButton ? 'pressed' : '']">Y: {{ yButton.toFixed(2) }}</span>
       </div>
       <div>
-        <span :class="[lbButton ? 'pressed' : '']">
-          LB: {{ lbButton.toFixed(2) }}
-        </span>
-        <span :class="[rbButton ? 'pressed' : '']">
-          RB: {{ rbButton.toFixed(2) }}
-        </span>
-        <span :class="[ltButton ? 'pressed' : '']">
-          LT: {{ ltButton.toFixed(2) }}
-        </span>
-        <span :class="[rtButton ? 'pressed' : '']">
-          RT: {{ rtButton.toFixed(2) }}
-        </span>
+        <span :class="[lbButton ? 'pressed' : '']">LB: {{ lbButton.toFixed(2) }}</span>
+        <span :class="[rbButton ? 'pressed' : '']">RB: {{ rbButton.toFixed(2) }}</span>
+        <span :class="[ltButton ? 'pressed' : '']">LT: {{ ltButton.toFixed(2) }}</span>
+        <span :class="[rtButton ? 'pressed' : '']">RT: {{ rtButton.toFixed(2) }}</span>
       </div>
       <div>
-        <span :class="[backButton ? 'pressed' : '']">
-          Back: {{ backButton.toFixed(2) }}
-        </span>
-        <span :class="[startButton ? 'pressed' : '']">
-          Start: {{ startButton.toFixed(2) }}
-        </span>
+        <span :class="[backButton ? 'pressed' : '']">Back: {{ backButton.toFixed(2) }}</span>
+        <span :class="[startButton ? 'pressed' : '']">Start: {{ startButton.toFixed(2) }}</span>
         <span :class="[leftStickButton ? 'pressed' : '']">
           Left Stick: {{ leftStickButton.toFixed(2) }}
         </span>
@@ -283,20 +223,12 @@ const vibrationActuator = computed<string>(() =>
         <span :class="[backwardButton ? 'pressed' : '']">
           Backward: {{ backwardButton.toFixed(2) }}
         </span>
-        <span :class="[leftButton ? 'pressed' : '']">
-          Left: {{ leftButton.toFixed(2) }}
-        </span>
-        <span :class="[rightButton ? 'pressed' : '']">
-          Right: {{ rightButton.toFixed(2) }}
-        </span>
+        <span :class="[leftButton ? 'pressed' : '']">Left: {{ leftButton.toFixed(2) }}</span>
+        <span :class="[rightButton ? 'pressed' : '']">Right: {{ rightButton.toFixed(2) }}</span>
       </div>
       <div>
-        <span>
-          Left Stick X: {{ leftStickX ? leftStickX.toFixed(2) : 'Missing' }}
-        </span>
-        <span>
-          Left Stick Y: {{ leftStickY ? leftStickY.toFixed(2) : 'Missing' }}
-        </span>
+        <span>Left Stick X: {{ leftStickX ? leftStickX.toFixed(2) : 'Missing' }}</span>
+        <span>Left Stick Y: {{ leftStickY ? leftStickY.toFixed(2) : 'Missing' }}</span>
         <span>
           Right Stick X:
           {{ rightStickX ? rightStickX.toFixed(2) : 'Missing' }}
@@ -307,9 +239,7 @@ const vibrationActuator = computed<string>(() =>
         </span>
       </div>
     </div>
-    <span>
-      Vibration Actuator: {{ vibrationActuator }}
-    </span>
+    <span>Vibration Actuator: {{ vibrationActuator }}</span>
   </div>
 </template>