Skip to content

Commit

Permalink
hide analytics
Browse files Browse the repository at this point in the history
  • Loading branch information
muckelba committed Nov 9, 2023
1 parent 68d289b commit 93e62c1
Show file tree
Hide file tree
Showing 6 changed files with 119 additions and 104 deletions.
2 changes: 1 addition & 1 deletion src/app.scss
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ $body-overflow-y: auto;

$notification-padding-ltr: 0.8rem 1.5rem 0.8rem 1.5rem;
$modal-content-width: 66%;

$card-radius: $radius-large;
$orange-invert: findColorInvert($orange);

$custom-colors: (
Expand Down
206 changes: 108 additions & 98 deletions src/lib/components/Analytics.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -13,9 +13,10 @@
wrongInputCount,
crouchTooLateCount,
gradientArray,
analyticsHidden,
} from "$lib/stores";
import { percentageColor, toggleSharingModal } from "$lib/util";
import { percentageColor, toggleSharingModal, toggleAnalytics } from "$lib/util";
let historydiv;
Expand Down Expand Up @@ -47,119 +48,128 @@
});
</script>

<div class="level has-text-centered">
<p class="title is-3 level-item">
<span class="icon-text"><span class="icon"><i class="fas fa-chart-bar" /></span>&nbsp;<span>Analytics</span></span>
</p>
</div>
<div class="columns">
<div class="column">
<p class="has-text-weight-bold is-size-5">
Overall superglide consistency: <code class="has-text-{computedPercentageColor}">{superglideConsistency.toFixed(2)}%</code>
</p>
<div class="divider" />
<p>
Attempts: <code class="has-text-white"> {$attempts.length}</code>
</p>
<p>
Potential superglides: <code class="has-text-white">{potentialSuperglidesPercentage.toFixed(2)}%</code>
</p>
<p>
Average successful chance: <code class="has-text-white">{potentialAvg.toFixed(2)}%</code>
</p>
<br />
<!-- <p>You got <code>0%</code> because:</p> -->
<p>
Wrong input first: <code>{wrongInputPercentage.toFixed(2)}%</code>
</p>
<p>
Crouch too late: <code>{crouchTooLatePercentage.toFixed(2)}%</code>
<div class="card">
<!-- svelte-ignore a11y-click-events-have-key-events -->
<!-- svelte-ignore a11y-missing-attribute -->
<a class="card-header" on:click={() => toggleAnalytics(!$analyticsHidden)}>
<button class="button card-header-icon is-large" aria-label="collapse helpful tips">
<i class="fa fa-angle-{$analyticsHidden ? 'down' : 'up'}" />
</button>
<p class="card-header-title title is-3 is-centered">
<span class="icon-text"><span class="icon"><i class="fas fa-chart-bar" /></span>&nbsp;<span>Analytics</span></span>
</p>
<!-- <br />
</a>
<div class="card-content {$analyticsHidden ? 'is-hidden' : ''}">
<div class="columns">
<div class="column">
<p class="has-text-weight-bold is-size-5">
Overall superglide consistency: <code class="has-text-{computedPercentageColor}">{superglideConsistency.toFixed(2)}%</code>
</p>
<div class="divider" />
<p>
Attempts: <code class="has-text-white"> {$attempts.length}</code>
</p>
<p>
Potential superglides: <code class="has-text-white">{potentialSuperglidesPercentage.toFixed(2)}%</code>
</p>
<p>
Average successful chance: <code class="has-text-white">{potentialAvg.toFixed(2)}%</code>
</p>
<br />
<!-- <p>You got <code>0%</code> because:</p> -->
<p>
Wrong input first: <code>{wrongInputPercentage.toFixed(2)}%</code>
</p>
<p>
Crouch too late: <code>{crouchTooLatePercentage.toFixed(2)}%</code>
</p>
<!-- <br />
<p>
On a potential superglide your crouch is too
late by
<code>0.0134</code> ms or <code>0.4</code> FPS on
average
</p> -->
<div class="divider" />
<div class="notification">
<p>READ THE FAQ!!!</p>
<p>Seriously if you can't hit them,</p>
<p>
<strong>READ THE TIPS AND FAQ!!!</strong>
</p>
<p>ALL OF IT!</p>
</div>
<button class="button is-fullwidth" on:click={toggleSharingModal}>Show all stats</button>
</div>
<div class="divider is-vertical" />
<div class="column history" bind:this={historydiv}>
{#each $history as { line, color, finished }}
<p>
<span class="tag is-{color}">{line}</span>
</p>
{#if finished}
<div class="divider" />
{/if}
{/each}
</div>
</div>

<div class:is-active={$sharingModalActive} class="modal">
<!-- svelte-ignore a11y-click-events-have-key-events -->
<div class="modal-background" on:click={toggleSharingModal} />
<div class="modal-content">
<div class="box">
<p class="title has-text-centered">Statistics</p>
<div class="columns">
<div class="column">
<p class="has-text-weight-bold is-size-5">
Overall superglide consistency: <code class="has-text-{computedPercentageColor}">{superglideConsistency.toFixed(2)}%</code>
</p>
<p>
Attempts: <code class="has-text-white"> {$attempts.length}</code>
</p>
<p>
Potential superglides: <code class="has-text-white">{potentialSuperglidesPercentage.toFixed(2)}%</code>
</p>
<div class="notification">
<p>READ THE FAQ!!!</p>
<p>Seriously if you can't hit them,</p>
<p>
Average successful chance: <code class="has-text-white">{potentialAvg.toFixed(2)}%</code>
</p>
<br />
<p>
Wrong input first: <code>{wrongInputPercentage.toFixed(2)}%</code>
<strong>READ THE TIPS AND FAQ!!!</strong>
</p>
<p>ALL OF IT!</p>
</div>
<button class="button is-fullwidth" on:click={toggleSharingModal}>Show all stats</button>
</div>
<div class="divider is-vertical" />
<div class="column history" bind:this={historydiv}>
{#each $history as { line, color, finished }}
<p>
Crouch too late: <code>{crouchTooLatePercentage.toFixed(2)}%</code>
<span class="tag is-{color}">{line}</span>
</p>
<div class="divider" />
{#if $isController}
<p>
Your browser is limiting our timing precision to <code class="has-text-white">{$loopDelayAvg.toFixed(2)}ms</code>. Your current FPS
setting is
<code class="has-text-white">{$settings.fps}</code>
</p>
<p class="has-text-weight-bold is-size-5">
Result: the % numbers we show you are wrong by an average of <code class="has-text-white">{averageErrorPerPoll.toFixed(2)}</code>%
</p>
{#if finished}
<div class="divider" />
{/if}
</div>
<div class="column history is-one-third">
{#each $history as { line, color, finished }}
<p>
<span class="tag is-{color}">{line}</span>
</p>
{#if finished}
{/each}
</div>
</div>

<div class:is-active={$sharingModalActive} class="modal">
<!-- svelte-ignore a11y-click-events-have-key-events -->
<div class="modal-background" on:click={toggleSharingModal} />
<div class="modal-content">
<div class="box">
<p class="title has-text-centered">Statistics</p>
<div class="columns">
<div class="column">
<p class="has-text-weight-bold is-size-5">
Overall superglide consistency: <code class="has-text-{computedPercentageColor}">{superglideConsistency.toFixed(2)}%</code>
</p>
<p>
Attempts: <code class="has-text-white"> {$attempts.length}</code>
</p>
<p>
Potential superglides: <code class="has-text-white">{potentialSuperglidesPercentage.toFixed(2)}%</code>
</p>
<p>
Average successful chance: <code class="has-text-white">{potentialAvg.toFixed(2)}%</code>
</p>
<br />
<p>
Wrong input first: <code>{wrongInputPercentage.toFixed(2)}%</code>
</p>
<p>
Crouch too late: <code>{crouchTooLatePercentage.toFixed(2)}%</code>
</p>
<div class="divider" />
{/if}
{/each}
{#if $isController}
<p>
Your browser is limiting our timing precision to <code class="has-text-white">{$loopDelayAvg.toFixed(2)}ms</code>. Your current FPS
setting is
<code class="has-text-white">{$settings.fps}</code>
</p>
<p class="has-text-weight-bold is-size-5">
Result: the % numbers we show you are wrong by an average of <code class="has-text-white">{averageErrorPerPoll.toFixed(2)}</code>%
</p>
{/if}
</div>
<div class="column history is-one-third">
{#each $history as { line, color, finished }}
<p>
<span class="tag is-{color}">{line}</span>
</p>
{#if finished}
<div class="divider" />
{/if}
{/each}
</div>
</div>
<div class="box" style="background: linear-gradient(90deg, {$gradientArray.join(',')});" />
<footer>
<button class="button" on:click={toggleSharingModal}>Close</button>
</footer>
</div>
</div>
<div class="box" style="background: linear-gradient(90deg, {$gradientArray.join(',')});" />
<footer>
<button class="button" on:click={toggleSharingModal}>Close</button>
</footer>
</div>
</div>
</div>
1 change: 1 addition & 0 deletions src/lib/stores.js
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,7 @@ export let isController = writable(false);
export let loopDelayAvg = writable(0);

// Stat stores
export let analyticsHidden = writable(true);
export let attempts = writable([]);
export let potentialSuperglides = writable([]);
export let wrongInputCount = writable(0);
Expand Down
7 changes: 6 additions & 1 deletion src/lib/util.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { history, trainingActive, sharingModalActive, gradientArray } from "$lib/stores";
import { history, trainingActive, sharingModalActive, gradientArray, analyticsHidden } from "$lib/stores";
import { colorScheme } from "$lib/config";

export function percentageColor(value) {
Expand Down Expand Up @@ -29,3 +29,8 @@ export function toggleSharingModal() {
trainingActive.set(false);
sharingModalActive.update((value) => !value);
}

// Either toggle the variable if state is not passed or set it to the value of state
export function toggleAnalytics(state) {
analyticsHidden.update(() => state);
}
7 changes: 3 additions & 4 deletions src/routes/superglidetrainer/+page.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
import { onMount } from "svelte";
import { siteTitle } from "$lib/config";
import { percentageColor, updateHistory, toggleSharingModal } from "$lib/util";
import { percentageColor, updateHistory, toggleSharingModal, toggleAnalytics } from "$lib/util";
import {
settings,
Expand Down Expand Up @@ -254,6 +254,7 @@
function toggleTraining() {
$trainingActive = !$trainingActive;
toggleAnalytics(!$trainingActive);
message = "";
superglideText = "";
Expand Down Expand Up @@ -716,9 +717,7 @@
</div>
</div>
<div class="column">
<div class="box">
<Analytics />
</div>
<Analytics />
</div>
</div>
</div>
Expand Down
Binary file modified static/button_bg.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.

0 comments on commit 93e62c1

Please sign in to comment.