<title>Document</title>
<script src="https://cdn.jsdelivr.net/npm/web3@latest/dist/web3.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/moralis.js"></script>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/moment.min.js"></script>
<script>
Moralis.start({ serverUrl: "https://df5k1zindehv.usemoralis.com:2053/server", appId: "pYoxD4y9gigKtUDjWGl829pMmXPJpxbXVLyRRXLA"});
</script>
<button id="btn-login">Moralis Login</button>
<button id="btn-logout">Moralis Logout</button>
<input type="radio" name="time" id="week" value=7 checked>7</input>
<input type="radio" name="time" id="2week" value=14 >14</input>
<input type="radio" name="time" id="4week" value=30 >30</input>
<select id="list"></select>
<div>
<canvas id="myChart"></canvas>
</div>
<script>
let toks = [];
async function launch(){
let response = await fetch("https://gateway.ipfs.io/ipns/tokens.uniswap.org")
let names = await response.json()
toks = names.tokens;
toks.forEach((e,i) =>
document.getElementById("list").add(new Option(e.symbol, i))
)
priceHistory()
}
launch()
async function priceHistory() {
let days = document.querySelector('input[name="time"]:checked').value;
let i = document.getElementById("list").value
let addrs = toks[i].address
let sym = toks[i].symbol
let dates = ["2021-09-30","2021-10-01","2021-10-02"];
let blocks = [13321721,13331721,13341721];
let prices = [4,6,3];
let dates1 = Array(Number(days)).fill().map((e,i) =>
moment().substract(i, "d").format("YYYY-MM-DD")
).reverse()
let blocks1 = await Promise.all(dates1.map(async(e,i) =>
await Moralis.Web3API.native.getDateToBlock({date:e})
))
let prices1 = await Promise.all(blocks1.map(async(e,i) =>
await Moralis.Web3API.token.getTokenPrice({address: addrs, to_block:e.block})
))
prices1 = prices1.map(e => e.usdPrice)
console.log(prices1)
const data = {
labels: dates1,
datasets: [{
label: sym,
backgroundColor: 'rgb(255, 99, 132',
borderColor: 'rgb(255, 99, 132',
data:prices1,
}]
};
const config = {
type: 'line',
data: data,
options: {}
};
if(window.myChart instanceof Chart){
myChart.destroy()
}
window.myChart = new Chart(
document.getElementById("myChart"),
config
);
}
</script>
