import React, { useEffect,useState,useRef } from 'react'; import Tooltip from 'react-simple-tooltip' //Mess with all tooltip props here: https://cedricdelpoux.github.io/react-simple-tooltip/ /** * Hook that alerts clicks outside of the passed ref */ function useOutsideAlerter(ref,setEdit) { useEffect(() => { /** * Alert if clicked on outside of element */ function handleClickOutside(event) { if (ref.current && !ref.current.contains(event.target)) { setEdit(false) } } // Bind the event listener document.addEventListener("mousedown", handleClickOutside); return () => { // Unbind the event listener on clean up document.removeEventListener("mousedown", handleClickOutside); }; }, [ref,setEdit]); } function EditBox(p) { useEffect(()=>{ var timer1 = setTimeout(()=>{ document.getElementById("editBoxInput").focus() document.getElementById("editBoxInput").select() },100) return () => { clearTimeout(timer1); }; },[p.edit]) return { if (e.key==="Enter") {p.setEdit(false)} else if (e.key==="Escape") {p.setEdit(false)} }} maxLength={p.maxlength?p.maxlength:20} onBlur={()=>{p.setEdit(false)}} value={p.value} onChange={(f)=>{f.currentTarget.value.length>0?p.setName(f.currentTarget.value):p.setName(p.originalName)}}> } function EditBoxInput(p) { const [edit,setEdit] = useState(false) useEffect(()=>{ if (p.callback) { p.callback() } },[edit,p]) return <>
{setEdit(true)}}> {edit? :<>{p.prefix}{p.data}}
} function ExpandTooltip(p) { return {p.mouseOverText} } function TestPanel(p) { const [bpGraphMax,setbpGraphMax] = useState(1000) const [hpGraphMax,sethpGraphMax] = useState(1000) const [ppGraphMax,setppGraphMax] = useState(1000) const [atkGraphMax,setatkGraphMax] = useState(1000) const [defGraphMax,setdefGraphMax] = useState(1000) const [author,setauthor] = useState("Player") const [buildName,setbuildName] = useState("Character") const [className,setclassName] = useState("Hunter") const [subclassName,setsubclassName] = useState("Force") const [level,setLevel] = useState(20) const [secondaryLevel,setsecondaryLevel] = useState(20) const [effectPage,setEffectPage]=useState(1) const [weaponPage,setWeaponPage]=useState(1) const [statsPage,setStatsPage]=useState(1) function Class(p) { const CLASSES = p.GetData("class") const class_obj = CLASSES[p.name] return class_obj?<>{class_obj.name}:<> } function ClassSelector(p){ const CLASSES = p.GetData("class") const wrapperRef = useRef(null); useOutsideAlerter(wrapperRef,p.setEdit); return
Class Selector
{Object.keys(CLASSES).map((cl,i)=>{ return })}
} function EditableClass(p){ const [edit,setEdit] = useState(false) return <>
{setEdit(!edit)}}>
{edit&&} } function PageControlButton(p) { return
  • {p.setCurrentPage(p.page)}} className={(p.currentPage===p.page)?"selected":""}>{p.pageName?p.pageName:p.page}
    • } function PageControl(p) { var pages = [] for (var i=0;i) } return } useEffect(()=>{ if (p.bp>1000) { setbpGraphMax(3000) sethpGraphMax(3000) setppGraphMax(3000) setatkGraphMax(3000) setdefGraphMax(3000) } else { setbpGraphMax(1000) sethpGraphMax(1000) setppGraphMax(1000) setatkGraphMax(1000) setdefGraphMax(1000) } },[p.bp]) //console.log(p.GetData("class",p.className,"icon")) return ( //Futasuke is a genius

    Basic Information

    Author
    Build Name
    Class {if (level<1) {setLevel(1)} else if (level>20) {setLevel(20)}}} prefix="Lv." setData={setLevel} data={level} type="number"/>
    Sub-Class {if (level<1) {setLevel(1)} else if (level>20) {setLevel(20)}}} prefix="Lv." setData={setsecondaryLevel} data={secondaryLevel} type="number"/>

    Current Effects

    Effect Name

      { effectPage===1?<>
    • Food Bost Effect
      •  [Meat] Potency +10.0%
      •  [Crisp] Potency to Weak Point +5.0%
    • Shifta / Deband
      •  Potency +5.0%
      •  Damage Resistance +10.0%
    • Region Mag Boost
      •  Potency +5.0%
      • :<> }

    Equip

    Weapons

    1

    Armor 1

    Armor 2

    Armor 3

    Equipped Weapon

    Resurgir Rifle+40

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6

    Abilitiy Details

    • } tooltip={<>Potency +20%/
      Critical Hit Rage +15% for 30 seconds after a successful sidestep}/>Dynamo Unit Lv.3
    • } tooltip={<>Potency +4%}/>Fixa Attack Lv.3
    • } tooltip={<>PP +5
      Ranged Weapon Potency +2.0%}/>Pettas Soul II
    • } tooltip={<>HP -10, Potency +1.5%,
      Potency Floor Increase +1.5%
      Damage Resistance -1.5%}/>Alts Secreta II
    • } tooltip={<>HP +10
      Ranged Weapon Potency +2.0%}/>Gigas Precision II
    • } tooltip={<>Ranged Weapon Potency +2.0%}/>Precision III

    Properties

    • Enhancement Lv. +35
    • Multi-Weapon -
    • Element -

    Basic Stats

    Battle Power {p.bp}
     
    HP {p.hp}
     
    PP {p.pp}
     
    Attack {p.statDisplayAtk}
     
    Defense {p.def}
     
    Weapon Up  +{(p.weaponUp1*100).toFixed(1)}%
     +{(p.weaponUp3*100).toFixed(1)}%    		  +{(p.weaponUp2*100).toFixed(1)}%  
    Ailment Resist. {p.damageResist}    
    Damage Resist. {p.damageResist}    

    Damage Stats

    • 1
    • 2
    • 3
    Critical Hit Rate 5%
    Critical Multiplier 120%
    Midrange 126
    Critcal 152
    Effective 127
    ) } export default TestPanel;