Grasscutters/gc-tools
2
0
Fork 0
mirror of https://github.com/exzork/gc-tools.git synced 2024-11-21 14:48:33 +00:00
Code Issues Projects Releases Wiki Activity

add image artifact using impact.moe api

Browse Source
This commit is contained in:
muhammadeko 2022-05-16 14:48:23 +07:00
parent d3a4c65683
commit 4e7909ba49
No known key found for this signature in database
GPG Key ID: 51366716C10E98B1
2 changed files with 147 additions and 104 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
.idea/inspectionProfiles/Project_Default.xml
View File

@ -2,5 +2,15 @@
<profile version="1.0"> <profile version="1.0">
<option name="myName" value="Project Default" /> <option name="myName" value="Project Default" />
<inspection_tool class="Eslint" enabled="true" level="WARNING" enabled_by_default="true" /> <inspection_tool class="Eslint" enabled="true" level="WARNING" enabled_by_default="true" />
<inspection_tool class="HtmlUnknownAttribute" enabled="true" level="WARNING" enabled_by_default="true">
<option name="myValues">
<value>
<list size="1">
<item index="0" class="java.lang.String" itemvalue="src" />
</list>
</value>
</option>
<option name="myCustomValuesEnabled" value="true" />
</inspection_tool>
</profile> </profile>
</component> </component>

241
src/components/pages/Artifacts.tsx
View File

@ -11,11 +11,12 @@ interface IArtifact {
name: string; name: string;
} }
interface IPropTypeValues { interface IPropTypeValues {
[key: string]: number[]; //number is the values [key: string]: number[]; //number is the values
} }
interface ISelectedPropTypeValues{ interface ISelectedPropTypeValues {
[key: string]: number[]; //number is the ids [key: string]: number[]; //number is the ids
} }
@ -60,6 +61,11 @@ export default function Artifacts() {
setArtifactData(dataArtifact); setArtifactData(dataArtifact);
initReliquaryData(); initReliquaryData();
}); });
fetch("https://github.com/impact-moe/impact-api/wiki/Artifacts").then(res => res.json())
.then(data => {
console.log(data);
});
}, []); }, []);
useEffect(() => { useEffect(() => {
@ -69,7 +75,7 @@ export default function Artifacts() {
useEffect(() => { useEffect(() => {
handleGeneratedArtifact() handleGeneratedArtifact()
}, [uid, selectedArtifact, selectedMainStat, selectedAffixesValues , artifactEnhancements]); }, [uid, selectedArtifact, selectedMainStat, selectedAffixesValues, artifactEnhancements]);
const handleArtifactChange = (event: any, value: any) => { const handleArtifactChange = (event: any, value: any) => {
if (value !== null) { if (value !== null) {
@ -87,12 +93,12 @@ export default function Artifacts() {
return reliquaryAffixes.filter((x) => x.PropType === propType && x.PropValue === propValue)[0].Id; return reliquaryAffixes.filter((x) => x.PropType === propType && x.PropValue === propValue)[0].Id;
}; };
const getListOfIdsByPropTypeAndRequestValue = (affixName: string, requestValue: number)=>{ const getListOfIdsByPropTypeAndRequestValue = (affixName: string, requestValue: number) => {
const possibleValues = affixesValues[affixName]; const possibleValues = affixesValues[affixName];
let ids:number[] = []; let ids: number[] = [];
let closestValue = 0; let closestValue = 0;
let less:number[] = []; let less: number[] = [];
possibleValues.forEach((value) => { possibleValues.forEach((value) => {
if (value <= requestValue) { if (value <= requestValue) {
@ -104,25 +110,25 @@ export default function Artifacts() {
less.reverse(); less.reverse();
for (let i of less) { for (let i of less) {
while ((closestValue+i) <= requestValue) { while ((closestValue + i) <= requestValue) {
closestValue += i; closestValue += i;
const id = getAffixIdByPropTypeAndPropValue(affixName, i); const id = getAffixIdByPropTypeAndPropValue(affixName, i);
if (id !== undefined) { if (id !== undefined) {
ids.push(id); ids.push(id);
} }
} }
if(closestValue === requestValue) break; if (closestValue === requestValue) break;
} }
return {ids, closestValue}; return {ids, closestValue};
} }
const handleAffixChange = (event: ChangeEvent<HTMLInputElement>, affixName:string) => { const handleAffixChange = (event: ChangeEvent<HTMLInputElement>, affixName: string) => {
let affixesSelected = {...selectedAffixesValues}; let affixesSelected = {...selectedAffixesValues};
const affixValues = parseInt(event.target.value); const affixValues = parseInt(event.target.value);
if (affixValues > 0) { if (affixValues > 0) {
if (affixesSelected[affixName] === undefined) affixesSelected[affixName] = []; if (affixesSelected[affixName] === undefined) affixesSelected[affixName] = [];
if (affixName.indexOf("PERCENT") !== -1 || affixName.indexOf("CRITICAL") !== -1 || affixName.indexOf("EFFICIENCY") !== -1 || affixName.indexOf("HURT") !== -1 || affixName.indexOf("RATIO") !== -1 || affixName.indexOf("ADD") !== -1){ if (affixName.indexOf("PERCENT") !== -1 || affixName.indexOf("CRITICAL") !== -1 || affixName.indexOf("EFFICIENCY") !== -1 || affixName.indexOf("HURT") !== -1 || affixName.indexOf("RATIO") !== -1 || affixName.indexOf("ADD") !== -1) {
const {ids} = getListOfIdsByPropTypeAndRequestValue(affixName, affixValues/100); const {ids} = getListOfIdsByPropTypeAndRequestValue(affixName, affixValues / 100);
affixesSelected[affixName] = ids; affixesSelected[affixName] = ids;
} else { } else {
const {ids} = getListOfIdsByPropTypeAndRequestValue(affixName, affixValues); const {ids} = getListOfIdsByPropTypeAndRequestValue(affixName, affixValues);
@ -134,21 +140,21 @@ export default function Artifacts() {
setSelectedAffixesValues(affixesSelected); setSelectedAffixesValues(affixesSelected);
}; };
const handleGetAffixClosestValue = (event: ChangeEvent<HTMLInputElement>, affixName:string) => { const handleGetAffixClosestValue = (event: ChangeEvent<HTMLInputElement>, affixName: string) => {
const affixValues = parseInt(event.target.value); const affixValues = parseInt(event.target.value);
if (affixValues === 0) return; if (affixValues === 0) return;
const {closestValue} =getListOfIdsByPropTypeAndRequestValue(affixName, affixValues); const {closestValue} = getListOfIdsByPropTypeAndRequestValue(affixName, affixValues);
event.target.value = parseFloat(closestValue.toFixed(3)).toString(); event.target.value = parseFloat(closestValue.toFixed(3)).toString();
} }
const getPropTypeValues = (affixes:IReliquaryAffix[])=>{ const getPropTypeValues = (affixes: IReliquaryAffix[]) => {
let propTypeValues:IPropTypeValues = {}; let propTypeValues: IPropTypeValues = {};
affixes.forEach(affix=>{ affixes.forEach(affix => {
if (propTypeValues[affix.PropType] === undefined) { if (propTypeValues[affix.PropType] === undefined) {
propTypeValues[affix.PropType] = []; propTypeValues[affix.PropType] = [];
} }
if(affix.PropValue>0) propTypeValues[affix.PropType].push(affix.PropValue); if (affix.PropValue > 0) propTypeValues[affix.PropType].push(affix.PropValue);
}); });
return propTypeValues; return propTypeValues;
}; };
@ -161,115 +167,142 @@ export default function Artifacts() {
const distinctValues = Array.from(new Set(affixValues)); const distinctValues = Array.from(new Set(affixValues));
distinctValues.forEach(value => { distinctValues.forEach(value => {
const countAffixes = affixValues.filter(x => x === value).length; const countAffixes = affixValues.filter(x => x === value).length;
if (countAffixes > 1) selectedAffixesCombine.push(value+","+countAffixes); if (countAffixes > 1) selectedAffixesCombine.push(value + "," + countAffixes);
else selectedAffixesCombine.push(value); else selectedAffixesCombine.push(value);
}) })
}) })
} }
const generated = "/giveart @"+uid+" "+selectedArtifact+" "+selectedMainStat+" "+selectedAffixesCombine.join(" ")+" "+Number(artifactEnhancements+1); const generated = "/giveart @" + uid + " " + selectedArtifact + " " + selectedMainStat + " " + selectedAffixesCombine.join(" ") + " " + Number(artifactEnhancements + 1);
setGeneratedArtifact(generated); setGeneratedArtifact(generated);
}; };
const generateImageUrl = (artifactName:string)=>{
let url = "https://impact.moe/assets/img/artifact-icons/";
let artifactNameLower = artifactName.toLowerCase();
artifactNameLower = artifactNameLower.replaceAll("'", "");
artifactNameLower = artifactNameLower.replaceAll(" ", "-");
if (artifactNameLower === "wanderers-string-kettle") artifactNameLower = "wanderings-string-kettle";
return url + artifactNameLower + ".webp";
}
return ( return (
<form method="POST" className="space-y-8 divide-y divide-gray-200 bg-white p-10"> <form method="POST" className="space-y-8 divide-y divide-gray-200 bg-white p-10">
<div className="space-y-8 divide-y divide-gray-200 sm:space-y-5"> <div className="space-y-8 divide-y divide-gray-200 sm:space-y-5">
<div>
<div> <div>
<div> <p className="mt-1 max-w-2xl text-sm text-gray-500">{t('fill_details')}</p>
<p className="mt-1 max-w-2xl text-sm text-gray-500">{t('fill_details')}</p> </div>
</div> <div className="mt-6 sm:mt-5 space-y-6 sm:space-y-5">
<div className="mt-6 sm:mt-5 space-y-6 sm:space-y-5"> <div
<div className="sm:grid sm:grid-cols-3 sm:gap-4 sm:items-start sm:border-t sm:border-gray-200 sm:pt-5">
className="sm:grid sm:grid-cols-3 sm:gap-4 sm:items-start sm:border-t sm:border-gray-200 sm:pt-5"> <label htmlFor="name"
<label htmlFor="name" className="block text-sm font-medium text-gray-700 sm:mt-px sm:pt-2">
className="block text-sm font-medium text-gray-700 sm:mt-px sm:pt-2"> {t("uid")}
{t("uid")} </label>
</label> <div className="mt-1 sm:mt-0 sm:col-span-2">
<div className="mt-1 sm:mt-0 sm:col-span-2"> <input type="text" aria-label="UID" name="uid" id="uid"
<input type="text" aria-label="UID" name="uid" id="uid" className="block w-full shadow-sm focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm border-gray-300 rounded-md" onChange={(event) => setUid(parseInt(event.target.value))}/> className="block w-full shadow-sm focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm border-gray-300 rounded-md"
</div> onChange={(event) => setUid(parseInt(event.target.value))}/>
</div> </div>
<div </div>
className="sm:grid sm:grid-cols-3 sm:gap-4 sm:items-start sm:border-t sm:border-gray-200 sm:pt-5"> <div
<label htmlFor="description" className="sm:grid sm:grid-cols-3 sm:gap-4 sm:items-start sm:border-t sm:border-gray-200 sm:pt-5">
className="block text-sm font-medium leading-5 text-gray-700 sm:mt-px sm:pt-2"> <label htmlFor="description"
{t('name')} className="block text-sm font-medium leading-5 text-gray-700 sm:mt-px sm:pt-2">
</label> {t('name')}
<div className="mt-1 sm:mt-0 sm:col-span-2"> </label>
<div className="mt-1 sm:mt-0 sm:col-span-2">
<Autocomplete
aria-label="Artifact Name" id="ArtifactName"
className="block w-full shadow-sm focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm border-gray-300 rounded-md"
options={artifactData}
getOptionLabel={(option) => t(option.name)}
onChange={handleArtifactChange}
renderInput={(params) => {
return <TextField {...params} label="Artifact Name" variant="outlined"/>
}}
renderOption={(option, {name}) => {
return <li {...option}>
<img src={generateImageUrl(name)} alt={""} className="inline-block h-8 w-8 rounded-full"
style={{marginRight: '10px'}}/>
<span className="ml-2">{t(name)}</span>
</li>
}}
/>
</div>
</div>
<div
className="sm:grid sm:grid-cols-3 sm:gap-4 sm:items-start sm:border-t sm:border-gray-200 sm:pt-5">
<label htmlFor="image"
className="block text-sm font-medium text-gray-700 sm:mt-px sm:pt-2">
{t('main_stats')}
</label>
<div className="mt-1 sm:mt-0 sm:col-span-2">
<div
className="relative h-10 rounded-lg flex justify-center items-center">
<Autocomplete <Autocomplete
aria-label="Artifact Name" id="ArtifactName" aria-label="Artifact Main Stats" id="ArtifactMainStats"
className="block w-full shadow-sm focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm border-gray-300 rounded-md" className="block w-full shadow-sm focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm border-gray-300 rounded-md"
options={artifactData} options={reliquaryMains}
getOptionLabel={(option) => t(option.name)} getOptionLabel={(option) => t(option.PropType)}
onChange={handleArtifactChange} onChange={handleMainStatChange}
renderInput={(params) => <TextField {...params} label="Artifact Name" variant="outlined"/>} renderInput={(params) => <TextField {...params} label="Main Stats"
variant="outlined"/>}
/> />
</div> </div>
</div> </div>
</div>
<div
className="sm:grid sm:grid-cols-3 sm:gap-4 sm:items-start sm:border-t sm:border-gray-200 sm:pt-5">
<label htmlFor="start_date"
className="block text-sm font-medium leading-5 text-gray-700 sm:mt-px sm:pt-2">
{t('sub_stats')}
</label>
<div <div
className="sm:grid sm:grid-cols-3 sm:gap-4 sm:items-start sm:border-t sm:border-gray-200 sm:pt-5"> className="mt-1 sm:mt-0 sm:col-span-2 h-48 overflow-auto grid gap-x-10 gap-y-2 grid-cols-2">
<label htmlFor="image" {Object.keys(affixesValues).map((key, index) => {
className="block text-sm font-medium text-gray-700 sm:mt-px sm:pt-2"> return (
{t('main_stats')} <div key={index} className="flex items-center mt-1">
</label> <div className="ml-3 flex-grow ">
<div className="mt-1 sm:mt-0 sm:col-span-2"> <div className="text-sm leading-5 text-gray-900">
<div {t(key)}
className="relative h-10 rounded-lg flex justify-center items-center">
<Autocomplete
aria-label="Artifact Main Stats" id="ArtifactMainStats"
className="block w-full shadow-sm focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm border-gray-300 rounded-md"
options={reliquaryMains}
getOptionLabel={(option) => t(option.PropType)}
onChange={handleMainStatChange}
renderInput={(params) => <TextField {...params} label="Main Stats" variant="outlined"/>}
/>
</div>
</div>
</div>
<div
className="sm:grid sm:grid-cols-3 sm:gap-4 sm:items-start sm:border-t sm:border-gray-200 sm:pt-5">
<label htmlFor="start_date"
className="block text-sm font-medium leading-5 text-gray-700 sm:mt-px sm:pt-2">
{t('sub_stats')}
</label>
<div className="mt-1 sm:mt-0 sm:col-span-2 h-48 overflow-auto grid gap-x-10 gap-y-2 grid-cols-2">
{Object.keys(affixesValues).map((key, index) => {
return (
<div key={index} className="flex items-center mt-1">
<div className="ml-3 flex-grow ">
<div className="text-sm leading-5 text-gray-900">
{t(key)}
</div>
</div>
<div className="ml-auto flex-none">
<input type="number"
step={0.01}
className="block shadow-sm focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm border-gray-300 rounded-md"
id={key}
defaultValue={0}
onChange={(e)=>handleAffixChange(e,key)}
onBlur={(e)=>handleGetAffixClosestValue(e,key)}
/>
</div> </div>
</div> </div>
) <div className="ml-auto flex-none">
})} <input type="number"
</div> step={0.01}
className="block shadow-sm focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm border-gray-300 rounded-md"
id={key}
defaultValue={0}
onChange={(e) => handleAffixChange(e, key)}
onBlur={(e) => handleGetAffixClosestValue(e, key)}
/>
</div>
</div>
)
})}
</div> </div>
<div </div>
className="sm:grid sm:grid-cols-3 sm:gap-4 sm:items-start sm:border-t sm:border-gray-200 sm:pt-5"> <div
<label htmlFor="start_date" className="sm:grid sm:grid-cols-3 sm:gap-4 sm:items-start sm:border-t sm:border-gray-200 sm:pt-5">
className="block text-sm font-medium leading-5 text-gray-700 sm:mt-px sm:pt-2"> <label htmlFor="start_date"
{t('enhancement_level')} className="block text-sm font-medium leading-5 text-gray-700 sm:mt-px sm:pt-2">
</label> {t('enhancement_level')}
<div className="mt-1 sm:mt-0 sm:col-span-2"> </label>
<input type="number" defaultValue="1" min="1" max="20" className="w-full flex-none block shadow-sm focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm border-gray-300 rounded-md" onChange={(e)=>setArtifactEnhancements(Number(e.currentTarget.value))}/> <div className="mt-1 sm:mt-0 sm:col-span-2">
</div> <input type="number" defaultValue="1" min="1" max="20"
</div> className="w-full flex-none block shadow-sm focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm border-gray-300 rounded-md"
<div className="block sm:gap-4 sm:items-start sm:border-t sm:border-gray-200 sm:pt-5"> onChange={(e) => setArtifactEnhancements(Number(e.currentTarget.value))}/>
<input type="text" onClick={(e)=>{navigator.clipboard.writeText(e.currentTarget.value)}} className="block w-full shadow-sm focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm border-gray-300 rounded-md" value={generatedArtifact} readOnly/>
</div> </div>
</div> </div>
<div className="block sm:gap-4 sm:items-start sm:border-t sm:border-gray-200 sm:pt-5">
<input type="text" onClick={(e) => {
navigator.clipboard.writeText(e.currentTarget.value)
}}
className="block w-full shadow-sm focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm border-gray-300 rounded-md"
value={generatedArtifact} readOnly/>
</div>
</div> </div>
</div> </div>
</form> </div>
</form>
); );
} }