diff --git a/src/PersonObjects/formulas/skill.ts b/src/PersonObjects/formulas/skill.ts index 2aa52bff4..c320cc526 100644 --- a/src/PersonObjects/formulas/skill.ts +++ b/src/PersonObjects/formulas/skill.ts @@ -17,6 +17,17 @@ export function calculateSkillProgress(exp: number, mult = 1): ISkillProgress { if (nextExperience < 0) nextExperience = 0; const normalize = (value: number): number => ((value - baseExperience) * 100) / (nextExperience - baseExperience); + let progress = (nextExperience - baseExperience !== 0) ? normalize(exp) : 99.99; + + // Clamp progress: When sleeves are working out, the player gets way too much progress + if (progress < 0) progress = 0 + if (progress > 100) progress = 100; + + // Clamp floating point imprecisions + let currentExperience = exp - baseExperience; + let remainingExperience = nextExperience - exp; + if (currentExperience < 0) currentExperience = 0; + if (remainingExperience < 0) remainingExperience = 0; return { currentSkill, @@ -24,7 +35,9 @@ export function calculateSkillProgress(exp: number, mult = 1): ISkillProgress { baseExperience, experience: exp, nextExperience, - progress: (nextExperience - baseExperience !== 0) ? normalize(exp) : 99.99 + currentExperience, + remainingExperience, + progress } } @@ -34,6 +47,8 @@ export interface ISkillProgress { baseExperience: number; experience: number; nextExperience: number; + currentExperience: number; + remainingExperience: number; progress: number; } @@ -41,6 +56,7 @@ export function getEmptySkillProgress(): ISkillProgress { return { currentSkill: 0, nextSkill: 0, baseExperience: 0, experience: 0, nextExperience: 0, + currentExperience: 0, remainingExperience: 0, progress: 0, }; } diff --git a/src/ui/React/StatsProgressBar.tsx b/src/ui/React/StatsProgressBar.tsx index 085d5afca..1e583a7d5 100644 --- a/src/ui/React/StatsProgressBar.tsx +++ b/src/ui/React/StatsProgressBar.tsx @@ -9,6 +9,7 @@ interface IProgressProps { min: number; max: number; current: number; + remaining: number; progress: number; color?: React.CSSProperties["color"]; } @@ -18,14 +19,14 @@ interface IStatsOverviewCellProps { color?: React.CSSProperties["color"]; } -export function StatsProgressBar({ min, max, current, progress, color }: IProgressProps): React.ReactElement { +export function StatsProgressBar({ min, max, current, remaining, progress, color }: IProgressProps): React.ReactElement { const tooltip = ( Progress:  - {numeralWrapper.formatExp(current - min)} / {numeralWrapper.formatExp(max - min)} + {numeralWrapper.formatExp(current)} / {numeralWrapper.formatExp(max - min)}
Remaining:  - {numeralWrapper.formatExp(max - current)} ({progress.toFixed(2)}%) + {numeralWrapper.formatExp(remaining)} ({progress.toFixed(2)}%)
); @@ -58,7 +59,8 @@ export function StatsProgressOverviewCell({ progress: skill, color }: IStatsOver