some more fixes for data consistency

src-tauri/src/main.rs

@@ -87,7 +87,7 @@ fn search_move(index: i64) -> MoveSearchResult {
     let row_result = MoveSearchResult {
       id: row.read::<i64, _>("id"),
       name: row.read::<&str, _>("name").to_string(),
-      types: row.read::<&str, _>("types").to_string(),
+      types: serde_json::from_str(row.read::<&str, _>("types")).unwrap_or(vec![0]),
       power: row.read::<i64, _>("power"),
       category: row.read::<i64, _>("category"),
       priority: row.read::<i64, _>("priority"),
@@ -101,7 +101,7 @@ fn search_move(index: i64) -> MoveSearchResult {
   return MoveSearchResult {
     id: 0,
     name: "Wrong".to_string(),
-    types: "[0]".to_string(),
+    types: vec![0],
     power: 0,
     category: 0,
     priority: 0,
@@ -133,11 +133,44 @@ fn get_items() -> Vec<ItemSearchResult> {
   return items;
 }
 
+#[tauri::command]
+fn increase_attack_usage(index: i64) {
+  println!("update index: {index}");
+  let connection = sqlite::open("./pokemon.db").unwrap();
+  let query = format!("UPDATE pokemon__learnset SET usage = usage + 1 WHERE id = {index}");
+  connection.execute(query).unwrap();
+}
+
+#[tauri::command]
+fn search_learnset(index: i64) -> Vec<PokemonDataLearnset> {
+  let connection = sqlite::open("./pokemon.db").unwrap();
+  let mut learnset: Vec<PokemonDataLearnset> = vec![];
+  let move_query = "SELECT pl.id, pl.learnset_id, l.name, l.types, l.power, l.category FROM pokemon__learnset pl JOIN learnset l on pl.learnset_id = l.id WHERE pl.pokemon_id = ? ORDER BY usage DESC";
+  for row in connection
+    .prepare(move_query)
+    .unwrap()
+    .into_iter()
+    .bind((1, index))
+    .unwrap()
+    .map(|row| row.unwrap())
+  {
+    let row_result = PokemonDataLearnset {
+      id: row.read::<i64, _>("id"),
+      learnset_id: row.read::<i64, _>("learnset_id"),
+      name: row.read::<&str, _>("name").to_string(),
+      types: serde_json::from_str(row.read::<&str, _>("types")).unwrap_or(vec![0]),
+      power: row.read::<i64, _>("power"),
+      category: row.read::<i64, _>("category"),
+    };
+    learnset.push(row_result)
+  }
+  return learnset;
+}
 #[tauri::command]
 fn search(index: i64) -> SearchResult {
   let connection = sqlite::open("./pokemon.db").unwrap();
   let mut learnset: Vec<PokemonDataLearnset> = vec![];
-  let move_query = "SELECT pl.id, pl.learnset_id, l.name, l.types, l.power, l.category FROM pokemon__learnset pl JOIN learnset l on pl.learnset_id = l.id WHERE pl.pokemon_id = ? ORDER BY usage";
+  let move_query = "SELECT pl.id, pl.learnset_id, l.name, l.types, l.power, l.category FROM pokemon__learnset pl JOIN learnset l on pl.learnset_id = l.id WHERE pl.pokemon_id = ? ORDER BY usage DESC";
   for row in connection
     .prepare(move_query)
     .unwrap()
@@ -168,7 +201,7 @@ fn search(index: i64) -> SearchResult {
     let row_result = SearchResult {
       id: row.read::<i64, _>("id"),
       name: row.read::<&str, _>("name").to_string(),
-      types: row.read::<&str, _>("types").to_string(),
+      types: serde_json::from_str(row.read::<&str, _>("types")).unwrap_or(vec![0]),
       thumbnail: row.read::<&str, _>("thumbnail").to_string(),
       abilities: row.read::<&str, _>("abilities").to_string(),
       hp: row.read::<i64, _>("hp"),
@@ -184,7 +217,7 @@ fn search(index: i64) -> SearchResult {
   return SearchResult {
     id: 0,
     name: "Missigno".to_string(),
-    types: "[]".to_string(),
+    types: vec![],
     thumbnail: "".to_string(),
     abilities: "{}".to_string(),
     hp: 0,
@@ -198,7 +231,7 @@ fn search(index: i64) -> SearchResult {
 }
 fn main() {
   tauri::Builder::default()
-    .invoke_handler(tauri::generate_handler![autosearch_move, search_move, autosearch, search, get_items])
+    .invoke_handler(tauri::generate_handler![autosearch_move, search_move, autosearch, search, get_items, increase_attack_usage, search_learnset])
     .run(tauri::generate_context!())
     .expect("error while running tauri application");
 }

src-tauri/src/model.rs

@@ -4,7 +4,7 @@ use serde::{Deserialize, Serialize};
 pub struct SearchResult {
   pub id: i64,
   pub name: String,
-  pub types: String,
+  pub types: Vec<i64>,
   pub hp: i64,
   pub attack: i64,
   pub defense: i64,
@@ -29,7 +29,7 @@ pub struct PokemonDataLearnset {
 pub struct MoveSearchResult {
   pub id: i64,
   pub name: String,
-  pub types: String,
+  pub types: Vec<i64>,
   pub power: i64,
   pub category: i64,
   pub priority: i64,

src-tauri/tauri.conf.json

@@ -8,7 +8,7 @@
   },
   "package": {
     "productName": "pokemon-data-displayer",
-    "version": "0.0.4"
+    "version": "0.0.5"
   },
   "tauri": {
     "allowlist": {

src/lib/DamageCalculator.svelte

@@ -104,7 +104,7 @@
       attack_data_category: attackData.category,
 
       // 技タイプ
-      move_type: JSON.parse(attackData.types),
+      move_type: attackData.types,
       // 範囲の計算で使用する
     };
     // 計算

src/lib/DisplayData.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+  import { invoke } from "@tauri-apps/api/tauri";
   import defense_types from "../const/defense_types.json";
   import type { PokemonData } from "src/model/PokemonData";
   import type { ItemData } from "../model/ItemData";
@@ -66,73 +67,111 @@
     return d;
   }
   $: {
-    if (terastype[0] !== selected_terastype) {
-      selected_terastype = terastype[0];
+    if (pokemonData) {
+      if (pokemonData.terastype[0] !== selected_terastype) {
+        selected_terastype = pokemonData.terastype[0];
+      }
+      if (pokemonData.item !== selected_item) {
+        selected_item = pokemonData.item;
       }
       // validator
       level = level_validator(level);
-    hp_v = v_validator(hp_v);
-    atk_v = v_validator(atk_v);
-    def_v = v_validator(def_v);
-    spatk_v = v_validator(spatk_v);
-    spdef_v = v_validator(spdef_v);
-    spd_v = v_validator(spd_v);
-    hp_d = d_validator(hp_d);
-    atk_d = d_validator(atk_d);
-    def_d = d_validator(def_d);
-    spatk_d = d_validator(spatk_d);
-    spdef_d = d_validator(spdef_d);
-    spd_d = d_validator(spd_d);
+      pokemonData.hp_v = v_validator(pokemonData.hp_v);
+      pokemonData.attack_v = v_validator(pokemonData.attack_v);
+      pokemonData.defense_v = v_validator(pokemonData.defense_v);
+      pokemonData.special_attack_v = v_validator(pokemonData.special_attack_v);
+      pokemonData.special_defense_v = v_validator(
+        pokemonData.special_defense_v
+      );
+      pokemonData.speed_v = v_validator(pokemonData.speed_v);
+      pokemonData.hp_d = d_validator(pokemonData.hp_d);
+      pokemonData.attack_d = d_validator(pokemonData.attack_d);
+      pokemonData.defense_d = d_validator(pokemonData.defense_d);
+      pokemonData.special_attack_d = d_validator(pokemonData.special_attack_d);
+      pokemonData.special_defense_d = d_validator(
+        pokemonData.special_defense_d
+      );
+      pokemonData.speed_d = d_validator(pokemonData.speed_d);
       // 性格補正 0.9/1/1.1
       let atk_p = 1;
       let def_p = 1;
       let spatk_p = 1;
       let spdef_p = 1;
       let spd_p = 1;
-    if (!!atk_plus && !atk_minus) {
+      if (!!pokemonData.attack_plus && !pokemonData.attack_minus) {
         atk_p = 1.1;
-    } else if (!atk_plus && !!atk_minus) {
+      } else if (!pokemonData.attack_plus && !!pokemonData.attack_minus) {
         atk_p = 0.9;
       }
-    if (!!def_plus && !def_minus) {
+      if (!!pokemonData.defense_plus && !pokemonData.defense_minus) {
         def_p = 1.1;
-    } else if (!def_plus && !!def_minus) {
+      } else if (!pokemonData.defense_plus && !!pokemonData.defense_minus) {
         def_p = 0.9;
       }
-    if (!!spatk_plus && !spatk_minus) {
+      if (
+        !!pokemonData.special_attack_plus &&
+        !pokemonData.special_attack_minus
+      ) {
         spatk_p = 1.1;
-    } else if (!spatk_plus && !!spatk_minus) {
+      } else if (
+        !pokemonData.special_attack_plus &&
+        !!pokemonData.special_attack_minus
+      ) {
         spatk_p = 0.9;
       }
-    if (!!spdef_plus && !spdef_minus) {
+      if (
+        !!pokemonData.special_defense_plus &&
+        !pokemonData.special_defense_minus
+      ) {
         spdef_p = 1.1;
-    } else if (!spdef_plus && !!spdef_minus) {
+      } else if (
+        !pokemonData.special_defense_plus &&
+        !!pokemonData.special_defense_minus
+      ) {
         spdef_p = 0.9;
       }
-    if (!!spd_plus && !spd_minus) {
+      if (!!pokemonData.speed_plus && !pokemonData.speed_minus) {
         spd_p = 1.1;
-    } else if (!spd_plus && !!spd_minus) {
+      } else if (!pokemonData.speed_plus && !!pokemonData.speed_minus) {
         spd_p = 0.9;
       }
-    if (pokemonData) {
       abilities = Object.keys(JSON.parse(pokemonData.abilities));
       abilities_description = Object.values(JSON.parse(pokemonData.abilities));
-      hp_final = calculate_hp(pokemonData.hp, hp_v, hp_d);
-      atk_final = other_stats(pokemonData.attack, atk_v, atk_d, atk_p);
-      def_final = other_stats(pokemonData.defense, def_v, def_d, def_p);
+      hp_final = calculate_hp(
+        pokemonData.hp,
+        pokemonData.hp_v,
+        pokemonData.hp_d
+      );
+      atk_final = other_stats(
+        pokemonData.attack,
+        pokemonData.attack_v,
+        pokemonData.attack_d,
+        atk_p
+      );
+      def_final = other_stats(
+        pokemonData.defense,
+        pokemonData.defense_v,
+        pokemonData.defense_d,
+        def_p
+      );
       spatk_final = other_stats(
         pokemonData.special_attack,
-        spatk_v,
-        spatk_d,
+        pokemonData.special_attack_v,
+        pokemonData.special_attack_d,
         spatk_p
       );
       spdef_final = other_stats(
         pokemonData.special_defense,
-        spdef_v,
-        spdef_d,
+        pokemonData.special_defense_v,
+        pokemonData.special_defense_d,
         spdef_p
       );
-      spd_final = other_stats(pokemonData.speed, spd_v, spd_d, spd_p);
+      spd_final = other_stats(
+        pokemonData.speed,
+        pokemonData.speed_v,
+        pokemonData.speed_d,
+        spd_p
+      );
     }
   }
   function generate_type(types) {
@@ -217,11 +256,9 @@
     return "&nbsp;";
   }
   function generate_weakness(types) {
-    let parsed_types = JSON.parse(types);
-    console.log(parsed_types);
-    let type_compatibility = defense_types[parsed_types[0] - 1];
-    if (parsed_types.length > 1) {
-      let second_type_compatibility = defense_types[parsed_types[1] - 1];
+    let type_compatibility = defense_types[types[0] - 1];
+    if (types.length > 1) {
+      let second_type_compatibility = defense_types[types[1] - 1];
       type_compatibility = type_compatibility.map(
         (v, i) => v * second_type_compatibility[i]
       );
@@ -250,11 +287,7 @@
           break;
       }
     });
-    console.log("super_weakness", super_weakness);
-    console.log("weakness", weakness);
-    console.log("super_resist", super_resist);
-    console.log("resist", resist);
-    console.log("immune", immune);
+
     return [super_weakness, weakness, resist, super_resist, immune];
   }
   function generate_damage_value(index) {
@@ -273,20 +306,6 @@
         return "";
     }
   }
-  // 個体値 (V) 0-31
-  let hp_v = 0;
-  let atk_v = 0;
-  let def_v = 0;
-  let spatk_v = 0;
-  let spdef_v = 0;
-  let spd_v = 0;
-  // 努力値 0-252
-  let hp_d = 0;
-  let atk_d = 0;
-  let def_d = 0;
-  let spatk_d = 0;
-  let spdef_d = 0;
-  let spd_d = 0;
 
   export let hp_final = 0;
   export let atk_final = 0;
@@ -294,23 +313,10 @@
   export let spatk_final = 0;
   export let spdef_final = 0;
   export let spd_final = 0;
-  export let terastype = [0];
-  export let item;
   let level = 50;
   let selected_terastype = 0;
   let selected_item = 0;
 
-  let atk_plus = false;
-  let def_plus = false;
-  let spatk_plus = false;
-  let spdef_plus = false;
-  let spd_plus = false;
-
-  let atk_minus = false;
-  let def_minus = false;
-  let spatk_minus = false;
-  let spdef_minus = false;
-  let spd_minus = false;
   function calculate_hp(stat, v, d) {
     // floor({(種族値+個体値)×2+min(63,floor(floor(1+√努力値)÷4))}×レベル÷100)+レベル+10
     return Math.floor((stat * 2 + v + d / 4) * (level / 100) + level + 10);
@@ -343,7 +349,7 @@
             <tr>
               <td class="pokemon-title">タイプ</td>
               <td style="display: flex;"
-                >{@html generate_type(JSON.parse(pokemonData.types))}</td
+                >{@html generate_type(pokemonData.types)}</td
               >
             </tr>
             <tr>
@@ -351,7 +357,8 @@
               <td style="display: flex;">
                 <select
                   bind:value={selected_terastype}
-                  on:change={() => (terastype = [selected_terastype])}
+                  on:change={() =>
+                    (pokemonData.terastype = [selected_terastype])}
                 >
                   <option value={0}> なし </option>
                   {#each available_type as curr_type}
@@ -367,7 +374,7 @@
               <td style="display: flex;">
                 <select
                   bind:value={selected_item}
-                  on:change={() => (item = selected_item)}
+                  on:change={() => (pokemonData.item = selected_item)}
                 >
                   <option value={0}> なし </option>
                   {#each items as item}
@@ -382,7 +389,7 @@
         </AccordionItem>
         <AccordionItem open title="弱点">
           <table class="weakness">
-            {#each generate_weakness(terastype[0] === 0 ? pokemonData.types : JSON.stringify(terastype)) as row, i}
+            {#each generate_weakness(pokemonData.terastype[0] === 0 ? pokemonData.types : pokemonData.terastype) as row, i}
               <tr>
                 <td>{generate_damage_value(i)}</td>
                 <td style="display: flex; flex-wrap: wrap;">
@@ -412,7 +419,7 @@
                   ><input
                     class="vd-input"
                     type="number"
-                    bind:value={hp_v}
+                    bind:value={pokemonData.hp_v}
                     min="0"
                     max="31"
                   /></b
@@ -423,7 +430,7 @@
                   ><input
                     class="vd-input"
                     type="number"
-                    bind:value={hp_d}
+                    bind:value={pokemonData.hp_d}
                     min="0"
                     max="252"
                   /></b
@@ -441,7 +448,7 @@
                   ><input
                     class="vd-input"
                     type="number"
-                    bind:value={atk_v}
+                    bind:value={pokemonData.attack_v}
                     min="0"
                     max="31"
                   /></b
@@ -452,7 +459,7 @@
                   ><input
                     class="vd-input"
                     type="number"
-                    bind:value={atk_d}
+                    bind:value={pokemonData.attack_d}
                     min="0"
                     max="252"
                   /></b
@@ -460,10 +467,20 @@
               >
               <td class="atai-column"><b>{atk_final}</b></td>
               <td class="atai-column"
-                ><b><input type="checkbox" bind:checked={atk_plus} /></b></td
+                ><b
+                  ><input
+                    type="checkbox"
+                    bind:checked={pokemonData.attack_plus}
+                  /></b
+                ></td
               >
               <td class="atai-column"
-                ><b><input type="checkbox" bind:checked={atk_minus} /></b></td
+                ><b
+                  ><input
+                    type="checkbox"
+                    bind:checked={pokemonData.attack_minus}
+                  /></b
+                ></td
               >
             </tr>
             <tr>
@@ -474,7 +491,7 @@
                   ><input
                     class="vd-input"
                     type="number"
-                    bind:value={def_v}
+                    bind:value={pokemonData.defense_v}
                     min="0"
                     max="31"
                   /></b
@@ -485,7 +502,7 @@
                   ><input
                     class="vd-input"
                     type="number"
-                    bind:value={def_d}
+                    bind:value={pokemonData.defense_d}
                     min="0"
                     max="252"
                   /></b
@@ -493,10 +510,20 @@
               >
               <td class="atai-column"><b>{def_final}</b></td>
               <td class="atai-column"
-                ><b><input type="checkbox" bind:checked={def_plus} /></b></td
+                ><b
+                  ><input
+                    type="checkbox"
+                    bind:checked={pokemonData.defense_plus}
+                  /></b
+                ></td
               >
               <td class="atai-column"
-                ><b><input type="checkbox" bind:checked={def_minus} /></b></td
+                ><b
+                  ><input
+                    type="checkbox"
+                    bind:checked={pokemonData.defense_minus}
+                  /></b
+                ></td
               >
             </tr>
             <tr>
@@ -507,7 +534,7 @@
                   ><input
                     class="vd-input"
                     type="number"
-                    bind:value={spatk_v}
+                    bind:value={pokemonData.special_attack_v}
                     min="0"
                     max="31"
                   /></b
@@ -518,7 +545,7 @@
                   ><input
                     class="vd-input"
                     type="number"
-                    bind:value={spatk_d}
+                    bind:value={pokemonData.special_attack_d}
                     min="0"
                     max="252"
                   /></b
@@ -526,10 +553,20 @@
               >
               <td class="atai-column"><b>{spatk_final}</b></td>
               <td class="atai-column"
-                ><b><input type="checkbox" bind:checked={spatk_plus} /></b></td
+                ><b
+                  ><input
+                    type="checkbox"
+                    bind:checked={pokemonData.special_attack_plus}
+                  /></b
+                ></td
               >
               <td class="atai-column"
-                ><b><input type="checkbox" bind:checked={spatk_minus} /></b></td
+                ><b
+                  ><input
+                    type="checkbox"
+                    bind:checked={pokemonData.special_attack_minus}
+                  /></b
+                ></td
               >
             </tr>
             <tr>
@@ -540,7 +577,7 @@
                   ><input
                     class="vd-input"
                     type="number"
-                    bind:value={spdef_v}
+                    bind:value={pokemonData.special_defense_v}
                     min="0"
                     max="31"
                   /></b
@@ -551,7 +588,7 @@
                   ><input
                     class="vd-input"
                     type="number"
-                    bind:value={spdef_d}
+                    bind:value={pokemonData.special_defense_d}
                     min="0"
                     max="252"
                   /></b
@@ -559,10 +596,20 @@
               >
               <td class="atai-column"><b>{spdef_final}</b></td>
               <td class="atai-column"
-                ><b><input type="checkbox" bind:checked={spdef_plus} /></b></td
+                ><b
+                  ><input
+                    type="checkbox"
+                    bind:checked={pokemonData.special_defense_plus}
+                  /></b
+                ></td
               >
               <td class="atai-column"
-                ><b><input type="checkbox" bind:checked={spdef_minus} /></b></td
+                ><b
+                  ><input
+                    type="checkbox"
+                    bind:checked={pokemonData.special_defense_minus}
+                  /></b
+                ></td
               >
             </tr>
             <tr>
@@ -573,7 +620,7 @@
                   ><input
                     class="vd-input"
                     type="number"
-                    bind:value={spd_v}
+                    bind:value={pokemonData.speed_v}
                     min="0"
                     max="31"
                   /></b
@@ -584,7 +631,7 @@
                   ><input
                     class="vd-input"
                     type="number"
-                    bind:value={spd_d}
+                    bind:value={pokemonData.speed_d}
                     min="0"
                     max="252"
                   /></b
@@ -592,10 +639,20 @@
               >
               <td class="atai-column"><b>{spd_final}</b></td>
               <td class="atai-column"
-                ><b><input type="checkbox" bind:checked={spd_plus} /></b></td
+                ><b
+                  ><input
+                    type="checkbox"
+                    bind:checked={pokemonData.speed_plus}
+                  /></b
+                ></td
               >
               <td class="atai-column"
-                ><b><input type="checkbox" bind:checked={spd_minus} /></b></td
+                ><b
+                  ><input
+                    type="checkbox"
+                    bind:checked={pokemonData.speed_minus}
+                  /></b
+                ></td
               >
             </tr>
             <tr>
@@ -631,9 +688,11 @@
           <table class="learnset">
             {#each pokemonData.learnset as learnset}
               <tr
-                on:click={() => {
+                on:click={async () => {
                   console.log("passing" + learnset.name);
                   attackId = learnset.learnset_id;
+                  await invoke("increase_attack_usage", { index: learnset.id });
+                  pokemonData.learnset = await invoke("search_learnset", { index: pokemonData.id });
                 }}
               >
                 <td

src/lib/MainWrapper.svelte

@@ -21,28 +21,53 @@
           special_attack: r.special_attack,
           special_defense: r.special_defense,
           speed: r.speed,
+          hp_v: 31,
+          attack_v: 31,
+          defense_v: 31,
+          special_attack_v: 31,
+          special_defense_v: 31,
+          speed_v: 31,
+          hp_d: 0,
+          attack_d: 0,
+          defense_d: 0,
+          special_attack_d: 0,
+          special_defense_d: 0,
+          speed_d: 0,
           learnset: r.learnset,
           item: 0,
           terastype: [0],
+          attack_plus: false,
+          attack_minus: false,
+          defense_plus: false,
+          defense_minus: false,
+          special_attack_plus: false,
+          special_attack_minus: false,
+          special_defense_plus: false,
+          special_defense_minus: false,
+          speed_plus: false,
+          speed_minus: false,
+          attack_buff: 0,
+          defense_buff: 0,
+          special_attack_buff: 0,
+          special_defense_buff: 0,
+          speed_buff: 0,
         };
-        item = 0;
-        terastype = [0];
         pokemonDataArray[index] = pokemonData;
-        console.log(pokemonData);
+        console.log(currentValue);
+        myValue = undefined;
       });
     }
     pokemonStatus = {
-      types: pokemonData?.types ? JSON.parse(pokemonData.types) : [],
-      terastype: terastype,
+      types: pokemonData ? pokemonData.types : [],
+      terastype: pokemonData ? pokemonData.terastype : [0],
       hp: hp_final,
       atk: atk_final,
       def: def_final,
       spatk: spatk_final,
       spdef: spdef_final,
       spd: spd_final,
-      item: item,
+      item: pokemonData? pokemonData.item : 0,
     };
-    console.log(pokemonStatus);
   }
   export let attackId: number | undefined;
   export let items: ItemData[];
@@ -51,14 +76,12 @@
   let currentValue = 0;
   let pokemonData: PokemonData | undefined;
   let pokemonDataArray: PokemonData[] = [];
-  let terastype = [0];
   let hp_final = 0;
   let atk_final = 0;
   let def_final = 0;
   let spatk_final = 0;
   let spdef_final = 0;
   let spd_final = 0;
-  let item = 0;
   export let pokemonStatus: PokemonStatus = {
     types: [],
     terastype: [0],
@@ -73,7 +96,6 @@
   async function getItems(keyword) {
     try {
       let result = await invoke("autosearch", { keyword });
-      console.log(result);
       return result;
     } catch (e) {
       console.log(e);
@@ -101,10 +123,17 @@
           <tr>
             <td>
               <!-- svelte-ignore a11y-click-events-have-key-events -->
-            <div class="pokemon-button {i % 2 === 0 ? "odd" : "even"}" on:click={() => {
+              <div
+                class="pokemon-button {i == index
+                  ? 'active'
+                  : i % 2 === 0
+                  ? 'odd'
+                  : 'even'}"
+                on:click={() => {
                   index = i;
                   pokemonData = pokemonDataArray[i];
-            }}>
+                }}
+              >
                 {#if pokemonDataArray[i]}
                   <img
                     src={`data:image/png;base64,${pokemonDataArray[i].thumbnail}`}
@@ -120,11 +149,14 @@
           </tr>
         {/each}
       </table>
+      <div>
+        <button>Save</button> <button>Load</button><br />
+        <button on:click={() => {pokemonData = undefined; pokemonDataArray = []; index = 0; myValue = undefined;}}>Clear</button>
+      </div>
     </div>
     <div class="display-data">
       <DisplayData
         {pokemonData}
-        bind:terastype
         bind:hp_final
         bind:atk_final
         bind:def_final
@@ -132,7 +164,6 @@
         bind:spdef_final
         bind:spd_final
         bind:attackId
-        bind:item
         {items}
       />
     </div>
@@ -163,25 +194,37 @@
     align-items: center;
     justify-content: center;
     height: 50px;
+    -webkit-user-select: none; /* Safari */
+    -ms-user-select: none; /* IE 10 and IE 11 */
+    user-select: none; /* Standard syntax */
+    border-right: 2px solid white;
+    border-bottom: 1px solid black;
+  }
+  .active {
+    background-color: #d1be01;
+    cursor: unset;
+    color: black;
+    font-weight: bold;
+    text-shadow: 1px 1px 1px white;
   }
   .odd {
-    color: black;
-    background-color: azure;
+    color: white;
+    background-color: #f5453d;
   }
   .odd:hover {
-    color: black;
-    background-color:aquamarine;
-    transition: background-color 1s ease;
+    color: white;
+    background-color: #f7bbb8;
+    transition: background-color .5s ease;
     cursor: pointer;
   }
   .even {
-    color: black;
-    background-color: beige;
+    color: white;
+    background-color: #3d3094;
   }
   .even:hover {
-    color: black;
-    background-color:burlywood;
-    transition: background-color 1s ease;
+    color: white;
+    background-color: #b6b4ff;
+    transition: background-color .5s ease;
     cursor: pointer;
   }
 </style>

src/model/PokemonData.ts

@@ -1,7 +1,7 @@
 export interface PokemonDBData {
   id: number;
   name: string;
-  types: string;
+  types: number[];
   thumbnail: string;
   abilities: string;
   hp: number;
@@ -15,7 +15,7 @@ export interface PokemonDBData {
 export interface PokemonData {
   id: number;
   name: string;
-  types: string;
+  types: number[];
   thumbnail: string;
   abilities: string;
   hp: number;
@@ -24,6 +24,33 @@ export interface PokemonData {
   special_attack: number;
   special_defense: number;
   speed: number;
+  hp_v: number;
+  attack_v: number;
+  defense_v: number;
+  special_attack_v: number;
+  special_defense_v: number;
+  speed_v: number;
+  hp_d: number;
+  attack_d: number;
+  defense_d: number;
+  special_attack_d: number;
+  special_defense_d: number;
+  speed_d: number;
+  attack_plus: boolean;
+  attack_minus: boolean;
+  defense_plus: boolean;
+  defense_minus: boolean;
+  special_attack_plus: boolean;
+  special_attack_minus: boolean;
+  special_defense_plus: boolean;
+  special_defense_minus: boolean;
+  speed_plus: boolean;
+  speed_minus: boolean;
+  attack_buff: number;
+  defense_buff: number;
+  special_attack_buff: number;
+  special_defense_buff: number;
+  speed_buff: number;
   learnset: PokemonLearnsetDBData[];
   item: number;
   terastype: number[];