Made time and region selection html selects, updated about to new site

This commit is contained in:
Emily Doherty 2022-06-09 04:38:43 -04:00 committed by sneaky-emily
parent 168d58947b
commit 16511f1abd
4 changed files with 807 additions and 715 deletions

40
dist/index.html vendored
View File

@ -4,7 +4,7 @@
<title>WoW Historical Token Prices Tracker</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="description" content="Track current and historical gold price trends for the World of Warcraft (WoW) in game token, including the US, EU, TW, and KR regions. Prices updated every minute. Simple, quick, and easy info, no ads ever.">
<meta name="description" content="Track current and historical gold price trends for the World of Warcraft (WoW) in game token, including the US, EU, TW, and KR regions. Prices updated every minute. Simple, quick, and easy info, no ads or tracking, ever.">
<link rel="preconnect" href="https://data.wowtoken.app">
<link rel="dns-prefetch" href="https://data.wowtoken.app">
<link rel="preload" href="https://data.wowtoken.app/token/current.json" as="fetch" type="application/json" crossorigin="anonymous">
@ -18,29 +18,31 @@
<div>
<canvas id="token-chart"></canvas>
<div id="option_select">
<p>
Region:
<a href="javascript:updateRegionPreference('us')">US</a>
<a href="javascript:updateRegionPreference('eu')">EU</a>
<a href="javascript:updateRegionPreference('kr')">KR</a>
<a href="javascript:updateRegionPreference('tw')">TW</a>
</p>
<p>
Time Selection:
<a href="javascript:updateTimePreference('72h')">3d</a>
<a href="javascript:updateTimePreference('168h')">7d</a>
<a href="javascript:updateTimePreference('336h')">14d</a>
<a href="javascript:updateTimePreference('30d')">30d</a>
<a href="javascript:updateTimePreference('90d')">3m</a>
<a href="javascript:updateTimePreference('6m')">6m</a>
<a href="javascript:updateTimePreference('all')">all</a>
</p>
<label for="region">Region:</label>
<select name="region" id="region">
<option value="us">US</option>
<option value="eu">EU</option>
<option value="kr">KR</option>
<option value="tw">TW</option>
</select>
<br />
<label for="time">Time Selection:</label>
<select name="time" id="time">
<option value="72h">3 Days</option>
<option value="168h">7 Days</option>
<option value="336h">14 Days</option>
<option value="30d">1 Month</option>
<option value="90d">3 Months</option>
<option value="6m">6 Months</option>
<option value="1y">1 Year</option>
<option value="all">All Available</option>
</select>
</div>
<div id="source">
<p>
<a href="https://github.com/sneaky-emily/wowtoken.app">Source</a>
|
<a href="https://emilyd.xyz/projects/wowtoken-app/">About</a>
<a href="https://emily.sh/blog/2021/04/developing-a-simple-wow-token-tracker/">About</a>
</p>
</div>
</div>

1465
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -9,7 +9,7 @@
"devDependencies": {
"css-loader": "^5.2.6",
"style-loader": "^3.0.0",
"webpack": "^5.41.1",
"webpack": "^5.73.0",
"webpack-cli": "^4.7.2"
},
"dependencies": {

View File

@ -25,8 +25,8 @@ Chart.register(
Tooltip
)
var current_region_selection = 'us'
var current_time_selection = '72h'
var current_region_selection = ''
var current_time_selection = ''
var current_price_hash = {
us: 0,
eu: 0,
@ -138,7 +138,7 @@ function detectURLQuery() {
// In the future, we will allow all the times to be selected,
// once I come up with a good reduction algorithm.
// For larger time selections, it's currently hardcoded into the backend
const allowedTimes = ['72h', '167h', '336h', '30d', '90d', '6m', 'all']
const allowedTimes = ['72h', '167h', '336h', '30d', '90d', '1y', '6m', 'all']
if (urlSearchParams.has('time')) {
if (allowedTimes.includes(urlSearchParams.get('time').toLowerCase())) {
current_time_selection = urlSearchParams.get('time').toLowerCase()
@ -150,10 +150,17 @@ function detectURLQuery() {
$(document).ready(function() {
document.getElementById('region').addEventListener('change', function() {
updateRegionPreference(this.value);
});
current_region_selection = document.getElementById('region').value;
document.getElementById('time').addEventListener('change', function() {
updateTimePreference(this.value);
});
current_time_selection = document.getElementById('time').value;
detectURLQuery();
callUpdateURL();
setInterval(callUpdateURL, 60*1000);
pullChartData().then(populateChart);
setInterval(updateChartData, 15*60*1000);
});