diff --git a/static/javascript/statistics.js b/static/javascript/statistics.js index e970c8f..cf512ef 100644 --- a/static/javascript/statistics.js +++ b/static/javascript/statistics.js @@ -66,7 +66,15 @@ async function create_games_over_time_chart(){ $("#overtimechartname").text(games_over_time_statistic.name) } -async function create_bar_chart(url){ +async function create_bar_chart(statistic_data, name=''){ + + statistic_data = await statistic_data + + if (name == ""){ + statistic_name = statistic_data.name + }else{ + statistic_name = name + } const card_to_fill = create_statistic_card() @@ -78,9 +86,7 @@ async function create_bar_chart(url){ chart_canvas.classList.add('chart_visual') chart_canvas_container.appendChild(chart_canvas) - - let statistic_data = await makeRequest(url) - + const highest_bar_value = Math.max(...Object.values(statistic_data.result)) let grid_offset = 0 @@ -126,7 +132,7 @@ async function create_bar_chart(url){ const card_footer = document.createElement('div') card_footer.classList.add('card-header') card_footer.classList.add('text-muted') - card_footer.innerHTML = statistic_data.name + card_footer.innerHTML = statistic_name card_to_fill.appendChild(card_footer) card_to_fill.appendChild(chart_canvas_container) @@ -134,7 +140,7 @@ async function create_bar_chart(url){ } -async function create_multiple_boardgame_chart(url, footer_attribute = '', footer_preamble = ''){ +async function create_multiple_boardgame_chart(statistic_data, name = '', footer_attribute = '', footer_preamble = ''){ function create_boardgame_image_grid_row(boardgames, footer_data = []){ const row_container = document.createElement('div') @@ -203,16 +209,22 @@ async function create_multiple_boardgame_chart(url, footer_attribute = '', foote return footer_attribute_to_value(obj[properties.shift()], properties.join('.')) } - const card_to_fill = create_statistic_card() + statistic_data = await statistic_data - const statistic_data = await makeRequest(url) + if (name == ""){ + statistic_name = statistic_data.name + }else{ + statistic_name = name + } + + const card_to_fill = create_statistic_card() const card_header = document.createElement('div') card_header.classList.add('card-header') const card_footer_text = document.createElement('div') card_footer_text.classList.add('text-muted') - card_footer_text.innerHTML = statistic_data.name + card_footer_text.innerHTML = statistic_name card_header.appendChild(card_footer_text) card_to_fill.appendChild(card_header) @@ -247,16 +259,22 @@ async function create_multiple_boardgame_chart(url, footer_attribute = '', foote } -async function create_basic_statistic_chart(url){ +async function create_basic_statistic_chart(statistic_data, name=''){ + + statistic_data = await statistic_data + + if (name == ""){ + statistic_name = statistic_data.name + }else{ + statistic_name = name + } const card_to_fill = create_statistic_card() - const statistic_data = await makeRequest(url) - const card_header = document.createElement('div') card_header.classList.add('card-header') card_header.classList.add('text-muted') - card_header.innerHTML = statistic_data.name + card_header.innerHTML = statistic_name card_to_fill.appendChild(card_header) @@ -276,15 +294,33 @@ async function create_basic_statistic_chart(url){ async function loadStatistics(){ + const names_to_show = ['Yarne', 'Lore', 'Lucas', 'Louize', 'Ruben'] + const winrate_statistic_data = await makeRequest(api_url + '/statistics/winrate') + for (let player_name in winrate_statistic_data.result){ + if (!names_to_show.includes(player_name)){ + delete winrate_statistic_data.result[player_name] + }else{ + winrate_statistic_data.result[player_name] *= 100 + } + } + create_bar_chart(winrate_statistic_data, 'Winrate van spelers') + //Seperate because of multiple data create_games_over_time_chart() - create_bar_chart(api_url + '/statistics/games_played_per_year?filter_expansions_out=true') - create_basic_statistic_chart(api_url+'/statistics/total_collection_cost') - create_basic_statistic_chart(api_url+'/statistics/amount_of_games') + const games_played_per_year_statistic_data_promise = makeRequest(api_url + '/statistics/games_played_per_year?filter_expansions_out=true') + create_bar_chart(games_played_per_year_statistic_data_promise, 'Spellen gespeeld per jaar') - create_multiple_boardgame_chart(api_url + '/statistics/most_expensive_games?top_amount=6', 'owned_info.price_paid', '\u20AC ') + const total_collection_cost_statistic_data_promise = makeRequest(api_url+'/statistics/total_collection_cost') + create_basic_statistic_chart(total_collection_cost_statistic_data_promise, 'Totale kost van spellen in bezit') - create_multiple_boardgame_chart(api_url + '/statistics/shelf_of_shame') + const amount_of_games_statistic_data_promise = makeRequest(api_url+'/statistics/amount_of_games') + create_basic_statistic_chart(amount_of_games_statistic_data_promise, 'Spellen in bezit') + + const most_expensive_games_statistic_data_promise = makeRequest(api_url+'/statistics/most_expensive_games?top_amount=6') + create_multiple_boardgame_chart(most_expensive_games_statistic_data_promise, 'Duurste spellen', 'owned_info.price_paid', '\u20AC ') + + const shelf_of_shame_statistic_data_promise = makeRequest(api_url + '/statistics/shelf_of_shame') + create_multiple_boardgame_chart(shelf_of_shame_statistic_data_promise) } \ No newline at end of file