diff options
| -rw-r--r-- | public/index.css | 26 | ||||
| -rw-r--r-- | src/App.svelte | 165 | ||||
| -rw-r--r-- | src/bestiary.js | 1 |
3 files changed, 144 insertions, 48 deletions
diff --git a/public/index.css b/public/index.css index 2f5d6f1..b8d18c5 100644 --- a/public/index.css +++ b/public/index.css @@ -1,4 +1,28 @@ /* Add CSS styles here! */ body { - font-family: sans-serif; + font-family: Arial, Helvetica, sans-serif; +} + +header { + margin-top: 15px; + display: flex; + flex: 0 1 auto; + justify-content: space-between; + max-width: 40em; + border-bottom: 1px solid #ccc; + padding-bottom: 10px; +} +header ul { + list-style: none; + display: flex; + padding: 0; + margin: 0 10px; +} + +header ul li { + margin: 0px 10px; +} + +.container { + margin: 20px; } diff --git a/src/App.svelte b/src/App.svelte index a68b9ee..7402b73 100644 --- a/src/App.svelte +++ b/src/App.svelte @@ -1,5 +1,5 @@ <script> - import { level, paWeather } from "./stores"; + import { level, paWeather, aWeather, hWeather, pyWeather } from "./stores"; import ew from "./ew"; import { onMount } from "svelte"; import { formatUtc } from "./times"; @@ -13,16 +13,31 @@ }); let date = new Date().getTime() * (1440 / 70); - let matches, upMatches, otherMatches, normalMatches, pagosForecast; - + let matches, + upMatches, + otherMatches, + normalMatches, + pagosForecast, + anemosForecast, + pyrosForecast, + hydatosForecast; + + newForecasts(); newMatches(); setInterval(() => { date = new Date().getTime() * (1440 / 70); }, 1000); + setInterval(() => { + newForecasts(); + newMatches(); + }, 300000); // 5 minutes $: currentEzTime = formatUtc(date); function updateWeatherStores() { paWeather.set(ew.forecast(ew.PAGOS_WEATHER)); + pyWeather.set(ew.forecast(ew.PYROS_WEATHER)); + hWeather.set(ew.forecast(ew.HYDATOS_WEATHER)); + aWeather.set(ew.forecast(ew.ANEMOS_WEATHER)); } function formatWeathers(weathers) { @@ -39,11 +54,29 @@ .join(""); } - function newMatches() { + function newForecasts() { + anemosForecast = ew.forecast(ew.ANEMOS_WEATHER); pagosForecast = ew.forecast(ew.PAGOS_WEATHER); - matches = getMatches(pagosForecast, $level).sort( - (a, b) => a.level < b.level - ); + pyrosForecast = ew.forecast(ew.PYROS_WEATHER); + hydatosForecast = ew.forecast(ew.HYDATOS_WEATHER); + paWeather.set(pagosForecast); + pyWeather.set(pyrosForecast); + hWeather.set(hydatosForecast); + aWeather.set(anemosForecast); + } + + function newMatches() { + let forecast; + if ($level >= 20 && $level < 35) { + forecast = pagosForecast; + } else if ($level >= 35 && $level < 50) { + forecast = pyrosForecast; + } else if ($level >= 50) { + forecast = hydatosForecast; + } else { + forecast = anemosForecast; + } + matches = getMatches(forecast, $level).sort((a, b) => a.level < b.level); upMatches = matches.filter((m) => m.uptime.isUp); normalMatches = matches.filter((m) => !m.special); @@ -69,46 +102,86 @@ } </script> -<div class="app"> - <h2> - Level: <input on:change={levelChanged} type="number" min="1" max="60" /> - </h2> - - Level is {$level}<br /> - - Time is {currentEzTime}<br /> - - <h5>matches</h5> - <ul> - {#each upMatches as m (m.name)} - <li> - <em>(Lv{m.level})</em> <strong>{m.name}</strong> - ({#if m.mutating}mutates{/if}{#if m.augmenting}augments{/if} in {formatWeathers( - m.uptime.weathers - )}) - </li> - {/each} - </ul> - - <h5>regular enemies</h5> +<header> <ul> - {#each normalMatches as m (m.name)} - <li><em>(Lv{m.level})</em> <strong>{m.name}</strong></li> - {/each} + <li><strong>Eureka Mark Tracker</strong></li> + <li>ET: {currentEzTime}</li> </ul> - - <h5>special enemies that do not mutate/augment right now</h5> - <ul> - {#each otherMatches as m (m.name)} - <li> - <em>(Lv{m.level})</em> <strong>{m.name}</strong> - ({#if m.mutating}mutates{/if}{#if m.augmenting}augments{/if} - {formatNextUptime(m.uptime.futureUptime)}) - </li> - {/each} - </ul> - - Pagos Weather is {pagosForecast[0].weatherName} -</div> +</header> +<main class="container"> + <div class="pure-g"> + <div class="pure-u-3-4"> + <h2> + Level: <input + bind:value={$level} + on:change={levelChanged} + type="number" + min="1" + max="60" + /> + </h2> + + <h5>matches</h5> + <ul> + {#each upMatches as m (m.name)} + <li> + <em>(Lv{m.level})</em> <strong>{m.name}</strong> + ({#if m.mutating}mutates{/if}{#if m.augmenting}augments{/if} in {formatWeathers( + m.uptime.weathers + )}) + </li> + {/each} + </ul> + + <h5>regular enemies</h5> + <ul> + {#each normalMatches as m (m.name)} + <li><em>(Lv{m.level})</em> <strong>{m.name}</strong></li> + {/each} + </ul> + + <h5>special enemies that do not mutate/augment right now</h5> + <ul> + {#each otherMatches as m (m.name)} + <li> + <em>(Lv{m.level})</em> <strong>{m.name}</strong> + ({#if m.mutating}mutates{/if}{#if m.augmenting}augments{/if} + {formatNextUptime(m.uptime.futureUptime)}) + </li> + {/each} + </ul> + </div> + <div class="pure-u-1-4"> + <div class="pure-menu"> + <ul class="pure-menu-list"> + <li class="pure-menu-item"> + Anemos: {anemosForecast[0].weatherName} + </li> + <li class="pure-menu-item">Pagos: {pagosForecast[0].weatherName}</li> + <li class="pure-menu-item">Pyros: {pyrosForecast[0].weatherName}</li> + <li class="pure-menu-item"> + Hydatos: {hydatosForecast[0].weatherName} + </li> + </ul> + </div> + <h4>What is this?</h4> + <p> + This is a website to keep track of which monsters in Eureka are mutating + or augmenting right now. Mutating/augmenting massively increases the EXP + yield, and it is therefore preferrable to go after these monsters when + levelling in Eureka. + <br /><br /> + Mutation/augmentation requirements are bound by weather, as well as time + of day. I created this so I didn't need to look through various google sheets + and cross-reference with weather forecasts. + </p> + <hr /> + <p> + Created by Raiah Belse (Twintania)<br /> + <a href="https://git.tilde.institute/anastasie/eureka-marks/">Source</a> + </p> + </div> + </div> +</main> <style></style> diff --git a/src/bestiary.js b/src/bestiary.js index 0598abb..4a061be 100644 --- a/src/bestiary.js +++ b/src/bestiary.js @@ -18,7 +18,6 @@ export function getMatches(forecast, level) { }); } }); - console.log(res); return res; } |