wowtoken-app/wowtoken.app
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Compare commits

base: wowtoken-app:feature/candlestick
Branches Tags
wowtoken-app:main wowtoken-app:classic wowtoken-app:feature/candlestick
..
compare: wowtoken-app:8f6cbbc75dd8837f4dc6276ffaf86dac179e676f
Branches Tags
wowtoken-app:classic wowtoken-app:main wowtoken-app:feature/candlestick

10 Commits
feature/ca ... 8f6cbbc75d

Author SHA1 Message Date
Emily Doherty
8f6cbbc75d Fix bad merge from cherry-pick of main 2023-10-15 01:35:26 -07:00
Emily Doherty
354381936d Changes to advanced options and styling in prep for future work 2023-10-15 01:27:40 -07:00
Emily Doherty
214910aa25 Remove Cash dependency, refactor event registration 
(cherry picked from commit 8cd9a2ddeb)
 2023-10-15 01:19:47 -07:00
Emily Doherty
ac12a9c55d Update dependencies 
(cherry picked from commit 702ca8c4d3)
 2023-10-15 01:18:30 -07:00
Emily Doherty
fa21b50b28 Remove weekly aggregation options for now 2023-06-05 19:46:47 -07:00
Emily Doherty
ae789181f4 Enable 1 month 2023-06-05 19:17:10 -07:00
Emily Doherty
a1b1dc63ff Remove extraneous time selections, enable 14d 2023-05-30 03:49:54 -07:00
Emily Doherty
249f9e281f Textual updates 2023-05-23 19:14:30 -07:00
Emily Doherty
bda9edf3df Bump node version 2023-05-23 18:27:53 -07:00
Emily Doherty
e090a93605 Initial branch and changes for Classic token 2023-05-23 18:19:06 -07:00
5 changed files with 31 additions and 97 deletions
Expand all files Collapse all files

2
README.md
View File

@@ -2,6 +2,6 @@
These are the public assets for the [wowtoken.app](https://wowtoken.app) website, served off Amazon S3 behind CloudFront. These are the public assets for the [wowtoken.app](https://wowtoken.app) website, served off Amazon S3 behind CloudFront.
This project gets picked up by CodePipeline, built via CodeBuild, and deployed. This project gets picked up by CodePipline, built via CodeBuild, and deployed.
![Build Status](https://codebuild.us-east-1.amazonaws.com/badges?uuid=eyJlbmNyeXB0ZWREYXRhIjoiblpRUnlNUzVmNU9sK1VBRVl1bVI1U1ZrWHJFSDVPYjFpTC9WVzZuSk1hd0lsUU5NekdDZTl4M2t4Uy9EWFdaY3JSNU1mYTFtaVI0VXN6ZGQvNE9BUWpvPSIsIml2UGFyYW1ldGVyU3BlYyI6InZNcHhHanNTODQ0b2lwbkkiLCJtYXRlcmlhbFNldFNlcmlhbCI6MX0%3D&branch=main) ![Build Status](https://codebuild.us-east-1.amazonaws.com/badges?uuid=eyJlbmNyeXB0ZWREYXRhIjoiblpRUnlNUzVmNU9sK1VBRVl1bVI1U1ZrWHJFSDVPYjFpTC9WVzZuSk1hd0lsUU5NekdDZTl4M2t4Uy9EWFdaY3JSNU1mYTFtaVI0VXN6ZGQvNE9BUWpvPSIsIml2UGFyYW1ldGVyU3BlYyI6InZNcHhHanNTODQ0b2lwbkkiLCJtYXRlcmlhbFNldFNlcmlhbCI6MX0%3D&branch=main)

2
buildspec.yml
View File

@@ -3,7 +3,7 @@ version: 0.2
phases: phases:
install: install:
runtime-versions: runtime-versions:
nodejs: 16 nodejs: 18
commands: commands:
- echo Installing dependencies... - echo Installing dependencies...
- npm install - npm install

25
src/index.html
View File

@@ -1,18 +1,18 @@
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<title>WoW Historical Token Prices Tracker</title> <title>WoW Classic Historical Token Prices Tracker</title>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <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 or tracking, ever."> <meta name="description" content="Track current and historical gold price trends for the World of Warcraft (WoW) Classic 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="preconnect" href="https://data.wowtoken.app">
<link rel="dns-prefetch" 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"> <link rel="preload" href="https://data.wowtoken.app/classic/token/current.json" as="fetch" type="application/json" crossorigin="anonymous">
<link rel="preload" href="https://data.wowtoken.app/token/history/us/72h.json" as="fetch" type="application/json" crossorigin="anonymous"> <link rel="preload" href="https://data.wowtoken.app/classic/token/history/us/72h.json" as="fetch" type="application/json" crossorigin="anonymous">
</head> </head>
<body> <body>
<div class="flex-container"> <div class="flex-container">
<div><h1>1 Token = <u id="token">0</u> Gold</h1></div> <div><h1>1 Classic Token = <u id="token">0</u> Gold</h1></div>
<div id="chart-frame"> <div id="chart-frame">
<div class="lds-ripple" id="loader"><div></div><div></div></div> <div class="lds-ripple" id="loader"><div></div><div></div></div>
<canvas id="token-chart"></canvas> <canvas id="token-chart"></canvas>
@@ -36,9 +36,6 @@
<option value="336h">14 Days</option> <option value="336h">14 Days</option>
<option value="720h">1 Month</option> <option value="720h">1 Month</option>
<option value="90d">3 Months</option> <option value="90d">3 Months</option>
<option value="6m">6 Months</option>
<option value="1y">1 Year</option>
<option value="2y">2 Years</option>
<option value="all">All Available</option> <option value="all">All Available</option>
</select> </select>
</div> </div>
@@ -70,7 +67,7 @@
</fieldset> </fieldset>
<fieldset id="y-start-options"> <fieldset id="y-start-options">
<label for="y-start">Start y-axis at 0:</label> <label for="y-start">Start y-axis at 0:</label>
<input type="checkbox" id="y-start" name="y-start"/> <input type="checkbox" id="y-start" name="y-start" value="enable" disabled/>
</fieldset> </fieldset>
</fieldset> </fieldset>
@@ -81,12 +78,12 @@
</button> </button>
</div> </div>
<div> <div>
<p><em>Looking for the classic WoW Token price? Find it <a href="https://classic.wowtoken.app">here!</a></em></p> <p><em>Looking for the retail WoW Token price? Find it <a href="https://wowtoken.app">here!</a></em></p>
</div> </div>
</div> </div>
<details id="about"> <details id="about">
<summary>About this Site</summary> <summary>About this Site</summary>
This is a site developed to track the value of the World of Warcraft Token from various This is a site developed to track the value of the World of Warcraft Classic Token from various
regions over time. I developed it because I wanted a quick and simple way to track the regions over time. I developed it because I wanted a quick and simple way to track the
cost without being advertised to or tracked, and to play around with various "serverless" cost without being advertised to or tracked, and to play around with various "serverless"
technologies. As such, my promise to you is never to use any tracking Javascript, and the technologies. As such, my promise to you is never to use any tracking Javascript, and the
@@ -94,10 +91,10 @@
</details> </details>
<details id="what-is"> <details id="what-is">
<summary>What is the WoW Token</summary> <summary>What is the WoW Token</summary>
The World of Warcraft Token is a first-party system developed by Blizzard to allow you The World of Warcraft Classic Token is a first-party system developed by Blizzard to allow you
to either spend currency (local denomination or Blizzard Balance) and convert it to gold to either spend currency (local denomination or Blizzard Balance) and convert it to gold
in retail World of Warcraft, or use gold to buy game time or Blizzard Balance. To find out in classic World of Warcraft, or use gold to buy game time.
more, visit the support article on Blizzard's website To find out more, visit the support article on Blizzard's website
<a href="https://us.battle.net/support/en/article/31218">here</a>. <a href="https://us.battle.net/support/en/article/31218">here</a>.
</details> </details>
<div id="source"> <div id="source">

81
src/index.js
View File

@@ -28,7 +28,6 @@ Chart.register(
let currentRegionSelection = ''; let currentRegionSelection = '';
let currentTimeSelection = ''; let currentTimeSelection = '';
let currentAggregateSelection = ''; let currentAggregateSelection = '';
let startYAtZero = false;
const currentPriceHash = { const currentPriceHash = {
us: 0, us: 0,
eu: 0, eu: 0,
@@ -67,7 +66,7 @@ function populateChart() {
data: { data: {
datasets: [{ datasets: [{
borderColor: 'gold', borderColor: 'gold',
label: currentRegionSelection.toUpperCase() + " WoW Token Price", label: currentRegionSelection.toUpperCase() + " WoW Classic Token Price",
data: chartJsData, data: chartJsData,
cubicInterpolationMode: 'monotone', cubicInterpolationMode: 'monotone',
pointRadius: 0 pointRadius: 0
@@ -80,51 +79,16 @@ function populateChart() {
}, },
scales: { scales: {
x: { x: {
type: 'time', type: 'time'
grid: {
color: '#625f62',
},
ticks: {
color: '#a7a4ab',
font: {
size: 18,
}
},
time: {
unit: lookupTimeUnit(currentTimeSelection)
}
},
y: {
beginAtZero: startYAtZero,
grid: {
color: '#2f2c2f',
},
ticks: {
color: '#a7a4ab',
font: {
size: 18,
}
}
} }
}, },
} }
}); });
} }
function lookupTimeUnit(query){
const lookup = {
'h': 'day',
'd': 'week',
'm': 'month',
'y': 'month',
'l': 'year'
}
return lookup[query.charAt(query.length - 1)]
}
async function callUpdateURL() { async function callUpdateURL() {
let resp = await fetch("https://data.wowtoken.app/token/current.json"); let resp = await fetch("https://data.wowtoken.app/classic/token/current.json");
let data = await resp.json(); let data = await resp.json();
updateTokens(data); updateTokens(data);
} }
@@ -239,16 +203,8 @@ function toggleAdvancedSetting() {
} }
} }
function toggleStartYAtZero(){
startYAtZero = document.getElementById('y-start').checked;
if (tokenChart){
tokenChart.options.scales.y.beginAtZero = startYAtZero;
tokenChart.update();
}
}
function urlBuilder() { function urlBuilder() {
let url = "https://data.wowtoken.app/token/history/"; let url = "https://data.wowtoken.app/classic/token/history/";
if (currentAggregateSelection !== 'none') { if (currentAggregateSelection !== 'none') {
url += `${currentAggregateSelection}/` url += `${currentAggregateSelection}/`
} }
@@ -288,7 +244,7 @@ function detectRegionQuery(urlSearchParams) {
} }
} }
} else { } else {
console.warn("An incorrect or malformed region selection was made in the query string"); console.log("An incorrect or malformed region selection was made in the query string");
} }
} }
@@ -306,7 +262,7 @@ function detectTimeQuery(urlSearchParams) {
} }
} }
} else { } else {
console.warn("An incorrect or malformed time selection was made in the query string"); console.log("An incorrect or malformed time selection was made in the query string");
} }
} }
@@ -322,20 +278,10 @@ function detectAggregateQuery(urlSearchParams) {
} }
aggregateFunctionToggle(); aggregateFunctionToggle();
} else { } else {
console.warn("An incorrect or malformed aggregate selection was made in the query string"); console.log("An incorrect or malformed aggregate selection was made in the query string");
} }
} }
function detectZeroQuery(urlSearchParams) {
startYAtZero = urlSearchParams.get('startAtZero') === 'true';
let advOptions = document.getElementById('enable-advanced');
let startAtZeroOption = document.getElementById('y-start');
advOptions.checked = startYAtZero;
startAtZeroOption.checked = startYAtZero;
toggleAdvancedSetting();
toggleStartYAtZero();
}
function detectURLQuery() { function detectURLQuery() {
const urlSearchParams = new URLSearchParams(window.location.search); const urlSearchParams = new URLSearchParams(window.location.search);
if (urlSearchParams.has('region')) { if (urlSearchParams.has('region')) {
@@ -347,13 +293,10 @@ function detectURLQuery() {
if (urlSearchParams.has('aggregate')) { if (urlSearchParams.has('aggregate')) {
detectAggregateQuery(urlSearchParams); detectAggregateQuery(urlSearchParams);
} }
if (urlSearchParams.has('startAtZero')) {
detectZeroQuery(urlSearchParams)
}
} }
function buildDeepLinksURL() { function buildDeepLinksURL() {
let url = "https://wowtoken.app/?" let url = "https://classic.wowtoken.app/?"
if (currentTimeSelection !== '72h'){ if (currentTimeSelection !== '72h'){
url += `time=${currentTimeSelection}&` url += `time=${currentTimeSelection}&`
} }
@@ -361,10 +304,7 @@ function buildDeepLinksURL() {
url += `region=${currentRegionSelection}&` url += `region=${currentRegionSelection}&`
} }
if (currentAggregateSelection !== '' && currentAggregateSelection !== 'none'){ if (currentAggregateSelection !== '' && currentAggregateSelection !== 'none'){
url += `aggregate=${currentAggregateSelection}&` url += `aggregate=${currentAggregateSelection}`
}
if (startYAtZero !== false){
url += `startAtZero=${startYAtZero}&`
} }
return url return url
} }
@@ -396,9 +336,6 @@ function registerAdvancedHandlers() {
document.getElementById('enable-advanced').addEventListener('change', () => { document.getElementById('enable-advanced').addEventListener('change', () => {
toggleAdvancedSetting(); toggleAdvancedSetting();
}) })
document.getElementById('y-start').addEventListener('change', () => {
toggleStartYAtZero();
})
} }
function registerCopyHandlers() { function registerCopyHandlers() {

18
src/style.css
View File

@@ -173,8 +173,8 @@ h6 {
font-weight: 700; font-weight: 700;
} }
html { html {
background-color: #073642; background-color: #6b4233;
color: #839496; color: #b7b7b7;
margin: 1em; margin: 1em;
} }
/*body { /*body {
@@ -194,7 +194,7 @@ a:hover {
color: #cb4b16; color: #cb4b16;
} }
h1 { h1 {
color: #d33682; color: #ffd5e9;
} }
h2, h2,
h3, h3,
@@ -206,7 +206,7 @@ h6 {
pre { pre {
background-color: #002b36; background-color: #002b36;
color: #839496; color: #839496;
border: 1pt solid #586e75; border: 1pt solid #000000;
padding: 1em; padding: 1em;
box-shadow: 5pt 5pt 8pt #073642; box-shadow: 5pt 5pt 8pt #073642;
} }
@@ -301,10 +301,10 @@ h6 {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
background-color: #002b36; background-color: #2f201e;
margin: 0 auto; margin: 0 auto;
max-width: 85%; max-width: 85%;
border: 1pt solid #586e75; border: 1pt solid #000000;
padding: 1em; padding: 1em;
} }
@@ -341,8 +341,8 @@ p {
} }
details { details {
background-color: #073642; background-color: #6b4233;
border: 1px solid #aaa; border: 1px solid #000000;
border-radius: 4px; border-radius: 4px;
padding: 0.5em 0.5em 0; padding: 0.5em 0.5em 0;
font-size: 17px; font-size: 17px;
@@ -363,7 +363,7 @@ details[open] {
} }
details[open] summary { details[open] summary {
border-bottom: 1px solid #aaa; border-bottom: 1px solid #000000;
margin-bottom: 0.5em; margin-bottom: 0.5em;
} }