diff --git a/frontend/src/ts/controllers/route-controller.ts b/frontend/src/ts/controllers/route-controller.ts index a704fa59c514..ea890d27d29b 100644 --- a/frontend/src/ts/controllers/route-controller.ts +++ b/frontend/src/ts/controllers/route-controller.ts @@ -183,8 +183,6 @@ export async function navigate( important: true, }, ); - //todo: figure out if this was ever used - // event?.preventDefault(); return; } diff --git a/frontend/src/ts/elements/result-batches.ts b/frontend/src/ts/elements/result-batches.ts deleted file mode 100644 index 8aaa953162f8..000000000000 --- a/frontend/src/ts/elements/result-batches.ts +++ /dev/null @@ -1,128 +0,0 @@ -import * as DB from "../db"; -import * as ServerConfiguration from "../ape/server-configuration"; -import { blendTwoHexColors } from "../utils/colors"; -import { mapRange } from "@monkeytype/util/numbers"; -import { getTheme } from "../states/theme"; -import { qs } from "../utils/dom"; - -//TODO -export function hide(): void { - qs(".pageAccount .resultBatches")?.hide(); -} - -export function show(): void { - qs(".pageAccount .resultBatches")?.show(); -} - -export async function update(): Promise { - //TODO fix or delete? - const results: string[] | undefined = []; - - if (results === undefined) { - console.error( - "(Result batches) Results are missing but they should be available at the time of drawing the account page?", - ); - hide(); - return; - } - - enableButton(); - - const completedTests = DB.getSnapshot()?.typingStats?.completedTests ?? 0; - const percentageDownloaded = Math.round( - (results.length / completedTests) * 100, - ); - const limits = ServerConfiguration.get()?.results.limits ?? { - regularUser: 0, - premiumUser: 0, - }; - const currentLimit = DB.getSnapshot()?.isPremium - ? limits.premiumUser - : limits.regularUser; - const percentageLimit = Math.round((results?.length / currentLimit) * 100); - - const barsWrapper = qs(".pageAccount .resultBatches .bars"); - - const bars = { - downloaded: { - fill: barsWrapper?.qs(".downloaded .fill"), - rightText: barsWrapper?.qs(".downloaded.rightText"), - }, - limit: { - fill: barsWrapper?.qs(".limit .fill"), - rightText: barsWrapper?.qs(".limit.rightText"), - }, - }; - - bars.downloaded.fill?.setStyle({ - width: `${Math.min(percentageDownloaded, 100)}%`, - }); - bars.downloaded.rightText?.setText( - `${results?.length} / ${completedTests} (${percentageDownloaded}%)`, - ); - - const colors = getTheme(); - - bars.limit.fill?.setStyle({ - width: `${Math.min(percentageLimit, 100)}%`, - background: blendTwoHexColors( - colors.sub, - colors.error, - mapRange(percentageLimit, 50, 100, 0, 1), - ), - }); - bars.limit.rightText?.setText( - `${results?.length} / ${currentLimit} (${percentageLimit}%)`, - ); - - const text = qs(".pageAccount .resultBatches > .text"); - text?.setText(""); - - if (results.length >= completedTests) { - disableButton(); - updateButtonText("all results loaded"); - } - - if (results.length >= currentLimit) { - disableButton(); - updateButtonText("limit reached"); - - // if (DB.getSnapshot()?.isPremium === false) { - // text.html( - // `
Want to load up to ${limits?.premiumUser} results and gain access to more perks? Join Monkeytype Premium.
` - // ); - // } - } -} - -export function disableButton(): void { - qs(".pageAccount .resultBatches button")?.disable(); -} - -export function enableButton(): void { - qs(".pageAccount .resultBatches button")?.enable(); -} - -export function updateButtonText(text: string): void { - qs(".pageAccount .resultBatches button")?.setText(text); -} - -export function showOrHideIfNeeded(): void { - //for now, just hide if not premium - will show this to everyone later - const isPremium = DB.getSnapshot()?.isPremium ?? false; - if (!isPremium) { - hide(); - return; - } - - const completed = DB.getSnapshot()?.typingStats?.completedTests ?? 0; - const batchSize = ServerConfiguration.get()?.results.maxBatchSize ?? 0; - - //no matter if premium or not, if the user is below the initial batch, hide the element - if (completed <= batchSize) { - hide(); - return; - } - - show(); -} diff --git a/frontend/src/ts/test/result.ts b/frontend/src/ts/test/result.ts index 27a98d5d9e88..f2ccd6df4f87 100644 --- a/frontend/src/ts/test/result.ts +++ b/frontend/src/ts/test/result.ts @@ -1,4 +1,3 @@ -//TODO: use Format import { Chart, type PluginChartOptions } from "chart.js"; import { Config } from "../config/store"; @@ -290,9 +289,10 @@ export async function updateChartPBLine(): Promise { const localPbWpm = localPb?.wpm ?? 0; if (localPbWpm === 0) return; const typingSpeedUnit = getTypingSpeedUnit(Config.typingSpeedUnit); - const chartlpb = Numbers.roundTo2( + const chartlpb = Format.decimals( typingSpeedUnit.fromWpm(localPbWpm), - ).toFixed(2); + { showDecimalPlaces: true }, + ); resultAnnotation.push({ display: true, type: "line", @@ -345,18 +345,18 @@ function updateWpmAndAcc(): void { if (Config.typingSpeedUnit !== "wpm") { qs("#result .stats .wpm .bottom")?.setAttribute( "aria-label", - `${result.wpm.toFixed(2)} wpm`, + `${Format.decimals(result.wpm, { showDecimalPlaces: true, suffix: " wpm" })}`, ); qs("#result .stats .raw .bottom")?.setAttribute( "aria-label", - `${result.rawWpm.toFixed(2)} wpm`, + `${Format.decimals(result.rawWpm, { showDecimalPlaces: true, suffix: " wpm" })}`, ); } else { qs("#result .stats .wpm .bottom")?.removeAttribute("aria-label"); qs("#result .stats .raw .bottom")?.removeAttribute("aria-label"); } - let time = `${Numbers.roundTo2(result.testDuration).toFixed(2)}s`; + let time = `${Format.decimals(result.testDuration, { showDecimalPlaces: true, suffix: "s" })}`; if (result.testDuration > 61) { time = DateTime.secondsToString(Numbers.roundTo2(result.testDuration)); } @@ -377,8 +377,8 @@ function updateWpmAndAcc(): void { let rawWpmHover = Format.typingSpeed(result.rawWpm, decimalsAndSuffix); if (Config.typingSpeedUnit !== "wpm") { - wpmHover += ` (${result.wpm.toFixed(2)} wpm)`; - rawWpmHover += ` (${result.rawWpm.toFixed(2)} wpm)`; + wpmHover += ` (${Format.decimals(result.wpm, { showDecimalPlaces: true, suffix: " wpm" })})`; + rawWpmHover += ` (${Format.decimals(result.rawWpm, { showDecimalPlaces: true, suffix: " wpm" })})`; } qs("#result .stats .wpm .bottom")?.setAttribute("aria-label", wpmHover); @@ -437,7 +437,7 @@ function updateTime(): void { ); if (Config.alwaysShowDecimalPlaces) { - let time = `${Numbers.roundTo2(result.testDuration).toFixed(2)}s`; + let time = `${Format.decimals(result.testDuration, { showDecimalPlaces: true, suffix: "s" })}`; if (result.testDuration > 61) { time = DateTime.secondsToString(Numbers.roundTo2(result.testDuration)); } @@ -743,9 +743,10 @@ async function updateTags(dontSave: boolean): Promise { position: annotationSide, xAdjust: labelAdjust, display: true, - content: `${tag.name} PB: ${Numbers.roundTo2( + content: `${tag.name} PB: ${Format.decimals( typingSpeedUnit.fromWpm(tpb), - ).toFixed(2)}`, + { showDecimalPlaces: true }, + )}`, }, }); if (annotationSide === "start") {