refactor: guhhh guhh build please work

This commit is contained in:
afn 2022-11-25 12:30:31 -05:00
parent 7e234bb754
commit 1fab3db151
2 changed files with 23 additions and 19 deletions

View File

@ -36,7 +36,7 @@
padding: 1.5rem; padding: 1.5rem;
width: 100%; width: 100%;
transition: all 0.3s var(--bezier-one); transition: all 0.3s var(--bezier-one);
border-radius: 4px; border-radius: 8px;
display: flex; display: flex;
gap: 1.5rem; gap: 1.5rem;
background-color: var(--grey-six); background-color: var(--grey-six);

View File

@ -1,29 +1,31 @@
<script lang="ts"> <script lang="ts">
import LogoOption from '$lib/components/atoms/LogoOption.svelte';
import Button from '$lib/components/atoms/Button.svelte';
import { onMount } from 'svelte'; import { onMount } from 'svelte';
import { fly } from 'svelte/transition'; import { fly } from 'svelte/transition';
import { expoOut } from 'svelte/easing'; import { expoOut } from 'svelte/easing';
import LogoOption from '$lib/components/atoms/LogoOption.svelte';
import Button from '$lib/components/atoms/Button.svelte';
let selected: Array<string> = []; let selected: Array<string> = [];
let logos = []; let logos = [];
let logoAmount = 4; let logoAmount = 4;
let currentPage = 1; let transitionDirection = 5;
let currentPage = 0;
let maxPages = 1; let maxPages = 1;
let min = 0; let min = 0;
let max = 4; let max = logoAmount;
let transitionDirection = 5;
// you will never see shittier code tm // you will never see shittier code tm
// will refactor later maybe idk // will refactor later maybe idk
onMount(async () => { onMount(async () => {
const response = await fetch('https://poll.revanced.app/logos'); const response = await fetch('https://poll.revanced.app/logos');
const json = await response.json(); const json = await response.json();
currentPage = localStorage.getItem("currentPage"); currentPage = localStorage.getItem('currentPage');
min = (currentPage - 1) * logoAmount; selected = JSON.parse(localStorage.getItem('selected'));
min = currentPage * logoAmount;
max = min + logoAmount; max = min + logoAmount;
selected = JSON.parse(localStorage.getItem("selected"));
// guh // guh
for (const name of Object.keys(json)) { for (const name of Object.keys(json)) {
logos.push({ name, ...json[name] }); logos.push({ name, ...json[name] });
@ -34,20 +36,20 @@
}); });
function previousPage() { function previousPage() {
if (currentPage <= 1) return null; if (currentPage <= 0) return null;
currentPage--; currentPage--;
min = (currentPage - 1) * logoAmount; min = currentPage * logoAmount;
max = min + logoAmount; max = min + logoAmount;
localStorage.setItem("currentPage", currentPage.toString()); localStorage.setItem('currentPage', currentPage.toString());
transitionDirection = -5; transitionDirection = -5;
} }
function nextPage() { function nextPage() {
if (currentPage >= maxPages) return null; if (currentPage + 1 >= maxPages) return null;
currentPage++; currentPage++;
min = (currentPage - 1) * logoAmount; min = currentPage * logoAmount;
max = min + logoAmount; max = min + logoAmount;
localStorage.setItem("currentPage", currentPage.toString()); localStorage.setItem('currentPage', currentPage.toString());
transitionDirection = 5; transitionDirection = 5;
} }
</script> </script>
@ -62,7 +64,7 @@
<div class="wrapper"> <div class="wrapper">
<div class="top-container"> <div class="top-container">
<h1>ReVanced Logo Poll</h1> <h1>ReVanced Logo Poll</h1>
<h2>{selected.length}/{logos.length} selected · Page {currentPage}/{maxPages}</h2> <h2>{selected.length}/{logos.length} selected · Page {Number(currentPage) + 1}/{maxPages}</h2>
<div class="top-custom-button-container"> <div class="top-custom-button-container">
<a href="https://hhh.com" target="_blank" rel="noreferrer"><button>Help</button></a> <a href="https://hhh.com" target="_blank" rel="noreferrer"><button>Help</button></a>
<a href="https://revanced.app" target="_blank" rel="noreferrer"><button>Website</button></a> <a href="https://revanced.app" target="_blank" rel="noreferrer"><button>Website</button></a>
@ -87,8 +89,10 @@
</div> </div>
<div class="buttons-container"> <div class="buttons-container">
<Button on:click={previousPage} unclickable={currentPage <= 1}>Previous</Button> <Button on:click={previousPage} unclickable={currentPage <= 0}>Previous</Button>
<Button kind="primary" on:click={nextPage} unclickable={currentPage >= maxPages}>Next</Button> <Button kind="primary" on:click={nextPage} unclickable={currentPage + 1 >= maxPages}
>Next</Button
>
</div> </div>
</div> </div>
</main> </main>