v2.7.0 Items Data Update & UI Tweaks

README.md

@@ -2,13 +2,12 @@
 
 [![MIT License](https://img.shields.io/static/v1?label=Licence&message=MIT&color=green)](https://opensource.org/licenses/) [![GitHub Release](https://img.shields.io/static/v1?label=Version&message=2.6.0&color=blue)]() [![Discord](https://img.shields.io/static/v1?label=Discord&message=Click%20to%20Join&color=purple)](https://discord.gg/k3v2fXQWJp) [![Patreon](https://img.shields.io/badge/Patreon-FFFFFF)](https://patreon.com/FrykesFiddlings)
 
-This is the repository for WakForge, coded by Fryke (fryke) on Discord.
-<br>
-Come check out the [WakForge Discord Server](https://discord.gg/k3v2fXQWJp).
+This is the repository for WakForge, coded by Fryke (fryke) on Discord. <br> Come check out the [WakForge Discord Server](https://discord.gg/k3v2fXQWJp).
 
 WakForge is a character build tool for the game Wakfu. This README will be updated with current features as the project is upgraded and added to.
 
 You can find the site at <https://wakforge.org>.<br>
+
 <!-- You can find the standalone Electron version in the [releases section](https://github.com/Tmktahu/atlas/releases). -->
 
 ## Features
@@ -42,7 +41,7 @@ If you are interested in contributing to this project, feel free to look through
 
 - Keeper of Time (sinbad) for allowing us to use his [auto-item-set](https://github.com/mikeshardmind/wakfu-utils) library on the site.
 - \<Krieg\> (fl_cl) for icon hunting and Spanish translation work.
-- Isp (_is) for bug hunting and French translation work.
+- Isp (\_is) for bug hunting and French translation work.
 - Slendy (slendycandy) for pulling together the default equipment slot icons.
 - Scour (scour.) and Liz (morgouse) for collecting data and doing the busy work no one likes.
 - Hooks (hooks0), Ruchi (ruchi), \<Krieg\> (fl_cl), Owlite (owlite), Hate (hatespawn), Soza (sozalord), Kimas (kimasage) for feature ideas and feedback.

package.json

@@ -1,6 +1,6 @@
 {
   "name": "wakfu-wizard",
-  "version": "2.6.0",
+  "version": "2.7.0",
   "private": true,
   "scripts": {
     "serve": "vite",

src/App.vue

@@ -27,7 +27,7 @@
         <!-- <span class="font-bold text-2xl block mb-2 mt-4">{{ message.header }}</span> -->
         <div class="px-2 mt-2" style="max-width: 300px">{{ message.message }}</div>
         <div class="flex justify-content-between mt-2 w-full">
-          <p-button :label="$t('tooltips.yes')" @click="acceptCallback" />
+          <p-button :label="$t('tooltips.yes')" @click="acceptCallback" autofocus />
           <p-button :label="$t('tooltips.no')" @click="rejectCallback" />
         </div>
       </div>

src/components/CharactersPage.vue

@@ -56,7 +56,7 @@
                     class="create-character-button py-1 pr-3 pl-2 ml-3"
                     @click.stop="onCreateCharacter(group)"
                   />
-                  <p-button icon="pi pi-trash" class="ml-3 py-1" @click.stop="onDeleteGroup(group)" />
+                  <p-button icon="pi pi-trash" class="delete-button ml-3 py-1" @click.stop="onDeleteGroup($event, group)" />
                 </div>
               </template>
               <div @drop="onBuildDrop($event, group)" @dragover.prevent @dragenter.prevent>
@@ -82,7 +82,7 @@
                     <div class="character-items flex-grow-1">
                       <EquipmentButtons :character="getBuildById(buildId)" read-only />
                     </div>
-                    <p-button class="at-end-delete-button delete-button py-2 px-2 mr-3" icon="pi pi-trash" @click="onDeleteCharacter($event, buildId)" />
+                    <p-button class="at-end-delete-button delete-button py-2 px-2 mr-3 h-full" icon="pi pi-trash" @click="onDeleteCharacter($event, buildId)" />
                   </div>
                 </template>
               </div>
@@ -213,12 +213,26 @@ const onCreateGroup = () => {
   });
 };
 
-const onDeleteGroup = (group) => {
+const onDeleteGroup = (event, group) => {
   if (group.buildIds.length === 0) {
     let targetIndex = masterData.groups.indexOf(group);
     masterData.groups.splice(targetIndex, 1);
   } else {
-    toast.add({ severity: 'error', summary: 'You cannot delete a group that has characters in it.', life: 3000 });
+    // toast.add({ severity: 'error', summary: 'You cannot delete a group that has characters in it.', life: 3000 });
+
+    confirm.require({
+      group: 'dialog',
+      target: event.currentTarget,
+      message: t('confirms.willDeleteCharacters'),
+      accept: () => {
+        group.buildIds.forEach((buildId) => {
+          deleteCharacter(buildId);
+        });
+
+        let targetIndex = masterData.groups.indexOf(group);
+        masterData.groups.splice(targetIndex, 1);
+      },
+    });
   }
 };
 
@@ -266,7 +280,7 @@ const gotoBuild = (event, id) => {
 const getBuildById = (buildId) => {
   let potentialCharacter = masterData.characters.find((character) => character.id === buildId);
 
-  if(potentialCharacter) {
+  if (potentialCharacter) {
     return potentialCharacter;
   } else {
     // We are trying to pull character data that does not exist.
@@ -335,6 +349,7 @@ const onBuildDrop = (event, group) => {
 
 :deep(.character-enties-wrapper) {
   overflow-y: auto;
+  flex-grow: 1;
 
   .class-name {
     min-width: 100px;
@@ -347,12 +362,12 @@ const onBuildDrop = (event, group) => {
   }
 
   .delete-button {
-    width: 40px;
-    height: 40px;
+    width: 30px;
+    height: 100%;
     background-color: var(--error-70);
 
     .p-button-icon {
-      font-size: 24px;
+      font-size: 16px;
       font-weight: 800;
       pointer-events: none;
     }

src/components/characterSheet/CharacterSheet.vue

@@ -86,7 +86,7 @@
                 class="tab-header characteristics-tab-header"
                 :class="{ error: hasCharacteristicsError, 'points-to-spend': hasCharacteristicsPointsToSpend && !hasCharacteristicsError }"
               >
-                <span>{{ $t('characterSheet.characteristics') }}</span>
+                <span>{{ $t('characterSheet.characteristicsAndSpells') }}</span>
                 <i class="points-to-spend-icon mdi mdi-arrow-up-bold ml-1" style="font-size: 20px" />
                 <i class="error-icon mdi mdi-alert-octagon-outline ml-1" style="font-size: 20px" />
               </div>
@@ -121,14 +121,14 @@
             <RunesSubsTabContent ref="runesAndSubsTabContent" />
           </p-tabPanel>
 
-          <p-tabPanel>
+          <!-- <p-tabPanel>
             <template v-slot:header>
               <div class="tab-header">
                 <span>{{ $t('characterSheet.spellsAndPassives') }}</span>
               </div>
             </template>
             <SpellTabContent />
-          </p-tabPanel>
+          </p-tabPanel> -->
         </p-tabView>
       </div>
     </div>
@@ -305,7 +305,7 @@ const onCopyBuildCode = () => {
   }
 
   .characteristics-tab-header {
-    width: 126px !important;
+    width: 173px !important;
     i {
       font-size: 1rem !important;
     }
@@ -319,7 +319,7 @@ const onCopyBuildCode = () => {
 }
 
 .characteristics-tab-header {
-  width: 158px;
+  width: 219px;
 
   .error-icon {
     display: none;