function loadGraph(graph, stat, minutes, interval) { let today = new Date() let start = new Date() start.setMinutes(start.getMinutes() - minutes) fetch( apiEndpoint + "/user/time_series/" + stat + "?start=" + start.toISOString() + "&end=" + today.toISOString() + "&interval=" + interval ).then(resp => { if (!resp.ok) { return Promise.reject("Error: " + resp.status); } return resp.json(); }).then(resp => { resp.timestamps.forEach((val, idx) => { let date = new Date(val); let dateStr = ("00" + (date.getMonth() + 1)).slice(-2); dateStr += "-" + ("00" + date.getDate()).slice(-2); dateStr += " " + ("00" + date.getHours()).slice(-2); dateStr += ":" + ("00" + date.getMinutes()).slice(-2); resp.timestamps[idx] = " " + dateStr + " "; // Poor man's padding }); graph.data.labels = resp.timestamps; graph.data.datasets[0].data = resp.amounts; graph.update(); document.getElementById("time_start").innerText = resp.timestamps[0]; document.getElementById("time_end").innerText = resp.timestamps.slice(-1)[0]; let total = 0 resp.amounts.forEach(e => { total += e; }); if (stat == "views") { document.getElementById("total_views").innerText = formatThousands(total); } else if (stat == "downloads") { document.getElementById("total_downloads").innerText = formatThousands(total); } else if (stat == "bandwidth") { document.getElementById("total_bandwidth").innerText = formatDataVolume(total, 3); } else if (stat == "direct_bandwidth") { document.getElementById("total_direct_bandwidth").innerText = formatDataVolume(total, 3); } }).catch(e => { console.error("Error requesting time series: " + e); }) } function loadDirectBW() { let today = new Date() let start = new Date() start.setDate(start.getDate() - 30) fetch( apiEndpoint + "/user/time_series/direct_bandwidth" + "?start=" + start.toISOString() + "&end=" + today.toISOString() + "&interval=60" ).then(resp => { if (!resp.ok) { return Promise.reject("Error: " + resp.status); } return resp.json(); }).then(resp => { let total = resp.amounts.reduce((accum, val) => accum += val, 0); document.getElementById("direct_bandwidth_progress").style.width = (total / window.user.subscription.direct_linking_bandwidth) * 100 + "%" document.getElementById("direct_bandwidth_text").innerText = formatDataVolume(total, 3) + " out of " + formatDataVolume(window.user.subscription.direct_linking_bandwidth, 3) document.getElementById("storage_progress").style.width = (window.user.storage_space_used / window.user.subscription.storage_space) * 100 + "%" document.getElementById("storage_text").innerText = formatDataVolume(window.user.storage_space_used, 3) + " out of " + formatDataVolume(window.user.subscription.storage_space, 3) }).catch(e => { console.error("Error requesting time series: " + e); }) } let graphViews = drawGraph(document.getElementById("views_chart"), "Views", "number"); let graphDownloads = drawGraph(document.getElementById("downloads_chart"), "Downloads", "number"); let graphBandwidth = drawGraph(document.getElementById("bandwidth_chart"), "Bandwidth", "bytes"); let graphDirectBandwidth = drawGraph(document.getElementById("direct_bandwidth_chart"), "Direct Bandwidth", "bytes"); let graphTimeout = null; function updateGraphs(minutes, interval, live) { if (graphTimeout !== null) { clearTimeout(graphTimeout) } if (live) { graphTimeout = setTimeout(() => { updateGraphs(minutes, interval, true) }, 10000) } loadGraph(graphViews, "views", minutes, interval); loadGraph(graphDownloads, "downloads", minutes, interval); loadGraph(graphBandwidth, "bandwidth", minutes, interval); loadGraph(graphDirectBandwidth, "direct_bandwidth", minutes, interval); loadDirectBW() } // Default updateGraphs(1440, 1, true);