Add stuff

Co-authored-by: dudleycu <dudleyc.twitch@gmail.com>

src/App.js

@@ -965,6 +965,13 @@ function App() {
 	const [weaponUp2,setWeaponUp2] = useState(0.241)
 	const [weaponUp3,setWeaponUp3] = useState(0.241)
 	const [damageResist,setDamageResist] = useState(0.18)
+	const [burnResist,setburnResist] = useState(0)
+	const [shockResist,setshockResist] = useState(0)
+	const [panicResist,setpanicResist] = useState(0)
+	const [stunResist,setstunResist] = useState(0)
+	const [freezeResist,setfreezeResist] = useState(0)
+	const [blindResist,setblindResist] = useState(0)
+	const [poisonResist,setpoisonResist] = useState(0)
 	
 	const [effectList,setEffectList] = useState([
 		"Food Boost Effect",
@@ -1052,6 +1059,13 @@ function App() {
 					weaponUp2={weaponUp2} 
 					weaponUp3={weaponUp3} 
 					damageResist={damageResist}
+					burnResist={burnResist} 
+					shockResist={shockResist} 
+					panicResist={panicResist} 
+					stunResist={stunResist} 
+					freezeResist={freezeResist} 
+					blindResist={blindResist} 
+					poisonResist={poisonResist} 
 					statDisplayAtk={statDisplayAtk} 
 					GetData={GetData}
 					/>

src/TestPanel.js

@@ -286,14 +286,14 @@ useEffect(()=>{
                   <div className="equipPaletteSlot"><h3>Armor 3</h3><div className="equipPaletteSlotWrapper"><img alt="" className="r3" src="https://i.imgur.com/GtusK2X.png" /></div></div>
                 </div>
               </div>
+
               <div className="box">
               <div className="boxTitleBar">
               <h1>Equipped Weapon</h1></div>
               <h2 className="rifle">Resurgir Rifle+40</h2>
-<PageControl pages={6} currentPage={weaponPage} setCurrentPage={setWeaponPage}/>
+              <PageControl pages={3} currentPage={weaponPage} setCurrentPage={setWeaponPage}/>
               <div className="equipDetails">
               <div className="equipAugs">
-<h3>Abilitiy Details</h3>
               {weaponPage===1?
                 <ul>
                   <li><ExpandTooltip mouseOverText={<img alt="" src={process.env.PUBLIC_URL+"/icons/aug_plus.png"} />} tooltip={<>Potency +20%/<br />Critical Hit Rage +15% for 30 seconds after a successful sidestep</>}/><span className="pot">Dynamo Unit Lv.3</span></li>
@@ -305,30 +305,7 @@ useEffect(()=>{
                   <li className="addAug"><img alt="" src={process.env.PUBLIC_URL+"/icons/aug_plus.png"} /></li>
                 </ul>  
               :
-  <ul>
-     <li className="addAug"><img alt="" src={process.env.PUBLIC_URL+"/icons/aug_plus.png"} /></li>
-     <li className="addAug"><img alt="" src={process.env.PUBLIC_URL+"/icons/aug_plus.png"} /></li>
-     <li className="addAug"><img alt="" src={process.env.PUBLIC_URL+"/icons/aug_plus.png"} /></li>
-     <li className="addAug"><img alt="" src={process.env.PUBLIC_URL+"/icons/aug_plus.png"} /></li>
-     <li className="addAug"><img alt="" src={process.env.PUBLIC_URL+"/icons/aug_plus.png"} /></li>
-     <li className="addAug"><img alt="" src={process.env.PUBLIC_URL+"/icons/aug_plus.png"} /></li>
-     <li className="addAug"><img alt="" src={process.env.PUBLIC_URL+"/icons/aug_plus.png"} /></li>
-</ul>
-}
-</div>
-<div className="pr">
-<h3>Properties</h3>
-{weaponPage===1?
-  <ul>
-    <li>Enhancement Lv.&emsp;<span>+35</span></li>
-    <li>Multi-Weapon&emsp;<span>-</span></li>
-    <li>Element&emsp;<span>-</span></li>
-  </ul>:
-  <ul>
-    <li>Enhancement Lv.&emsp;<span>-</span></li>
-    <li>Multi-Weapon&emsp;<span>-</span></li>
-    <li>Element&emsp;<span>-</span></li>
-  </ul>
+              <>hi</>
               }
             </div>
           </div>
@@ -373,13 +350,22 @@ useEffect(()=>{
         </tr>
         <tr>
           <td>Ailment Resist.</td>
-    <td>{p.damageResist}</td>
-    <td>&nbsp;</td>
+          <td>
+            <img alt="" src={process.env.PUBLIC_URL+"/icons/status/burn.png"} /> {(p.burnResist*100).toFixed(1)}%<br />
+            <img alt="" src={process.env.PUBLIC_URL+"/icons/status/shock.png"} /> {(p.shockResist*100).toFixed(1)}%<br />
+            <img alt="" src={process.env.PUBLIC_URL+"/icons/status/panic.png"} /> {(p.panicResist*100).toFixed(1)}%<br />
+            <img alt="" src={process.env.PUBLIC_URL+"/icons/status/stun.png"} /> {(p.stunResist*100).toFixed(1)}%<br />
+          </td>
+          <td>
+            <img alt="" src={process.env.PUBLIC_URL+"/icons/status/freeze.png"} /> {(p.freezeResist*100).toFixed(1)}%<br />
+            <img alt="" src={process.env.PUBLIC_URL+"/icons/status/blind.png"} /> {(p.blindResist*100).toFixed(1)}%<br />
+            <img alt="" src={process.env.PUBLIC_URL+"/icons/status/poison.png"} /> {(p.poisonResist*100).toFixed(1)}%<br />
+          </td>
           <td>&nbsp;</td>
       </tr>
           <tr>
           <td>Damage Resist.</td>
-    <td>{p.damageResist}</td>
+          <td>{(p.damageResist*100).toFixed(1)}%</td>
           <td>&nbsp;</td>
           <td>&nbsp;</td>
       </tr>
@@ -451,7 +437,14 @@ useEffect(()=>{
         var weapon_type=p.GetData("weapon_type",we.weapon_type_id,undefined,true)
         var weapon=p.GetData("weapon",we.weapon_id,undefined,true)
         var potential=p.GetData("potential",weapon.potential_id,undefined,true)
-        return [weapon_type,weapon,potential]
+        var potential_all=p.GetData("potential_data")
+        var potential_tooltip=[]
+        for (var pot in potential_all) {
+          if (pot.includes(potential.name)) {
+            potential_tooltip.push(p.GetData("potential_data",pot))
+          }
+        }
+        return [weapon_type,weapon,potential,potential_tooltip]
       }):[]
   }}
   filterFunction={(page,item)=>{
@@ -471,7 +464,9 @@ useEffect(()=>{
       default:return 0
     }  
   }}
-  displayFunction={(item)=><li className={"itemwep r"+item[1].rarity}><img className="itemimg" alt="" src="64px-NGSUIItemPrimmRifle.png" /><em className="rifle">{item[1].name} {item[0].name}</em><br /><span className="atk">{item[1].atk}</span>					<span className="pot tooltip">{item[2].name}<span>Lv.4: Potency +24%/<br />20% chance of Restasigne not being consumed on use. Effect starts 10 sec after equip</span></span></li>}
+  displayFunction={(item)=>{
+  return <li className={"itemwep r"+item[1].rarity}><img className="itemimg" alt="" src="64px-NGSUIItemPrimmRifle.png" /><em className="rifle">{item[1].name} {item[0].name}</em><br /><span className="atk">{item[1].atk}</span>					<span className="pot tooltip">{item[2].name} <span>{item[3].map((pot,i)=><>{(i!==0)&&<br/>}{pot.name}: {pot.description.replace("\\n","\n")}</>)}</span></span></li>}}
+  
   />
 
 </>

src/style.css

@@ -970,37 +970,30 @@ button{
     background: linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.8));
 	display: grid;
 	justify-items: stretch;
-	justify-content: stretch;    
+	align-items: center;    
 	grid-template-columns: minmax(10px, 1fr) minmax(200px, 580px) minmax(10px, 1fr);
 	grid-template-rows: 10px minmax(0, 1fr) 10px;
-	animation: fadeIn 0.15s;
-}
-  @keyframes fadeIn {
-	0% {opacity:0;top:-30px;}
-	100% {opacity:1;top:0;}
 }
 .modal {
 	outline: 0;
 	grid-column: 2;
 	grid-row: 2;
+
   }
 .boxModal {
+	animation: fadeIn 0.15s;
 	max-width: 580px;
 	margin: 0 auto;
 	box-shadow: 0 10px 16px 0 rgba(0,0,0,0.5), 0 6px 20px 0  rgba(0,0,0,0.5) !important;
 	outline: 1px solid rgba(54,255,255,1);	
 }
-.boxModal .boxTitleBar {
-	background: linear-gradient(45deg, rgba(47,153,193,1),rgba(46,94,137,1) 30%,rgba(46,94,137,1) 70%, rgba(47,153,193,1));
-}
-/* box hover, save bcuz i will use this in popup menu
-.box:hover {
-	outline: 1px solid rgba(54,255,255,1);
+@keyframes fadeIn {
+	0% {opacity:0;margin-bottom:30px;}
+	100% {opacity:1;margin-bottom:0;}
   }
-.box:hover .boxTitleBar  {
+.boxModal .boxTitleBar {
 	background: linear-gradient(45deg, rgba(47,153,193,1),rgba(46,94,137,1) 30%,rgba(46,94,137,1) 70%, rgba(47,153,193,1));
 }
-*/
 .modalItemListContainer {
 		overflow-y: auto;
 		overflow-x: hidden;