Added a 'plays' page to list all plays

This commit is contained in:
Yarne Coppens 2024-08-14 08:49:46 +02:00
parent 41441db75d
commit e0443811b1
3 changed files with 92 additions and 1 deletions

6
app.py
View file

@ -17,4 +17,8 @@ def get_boardgame():
@app.get('/statistics') @app.get('/statistics')
def get_statistics(): def get_statistics():
return render_template('statistics.jinja') return render_template('statistics.jinja')
@app.get('/plays')
def get_plays():
return render_template('plays.jinja')

View file

@ -195,4 +195,68 @@ async function loadGame() {
$('#boardgame_link').attr('href', 'https://boardgamegeek.com/boardgame/' + boardgame_id) $('#boardgame_link').attr('href', 'https://boardgamegeek.com/boardgame/' + boardgame_id)
}
async function loadPlays() {
function createPlayCard(play){
const card_div = document.createElement('div')
card_div.className = "card"
const card_image = document.createElement('img')
card_image.src = play.boardgame.image_url
const card_body = document.createElement('div')
card_body.className = 'card-body'
const card_title = document.createElement('h4')
card_title.innerHTML = play.boardgame.name
const player_names = document.createElement('div')
for (let player_index in play.players){
const player = play.players[player_index]
const player_div = document.createElement('div')
player_div.innerHTML = player.name
if (player.has_won) {
player_div.style.color = "green"
}
player_names.appendChild(player_div)
}
card_body.appendChild(card_title)
card_body.appendChild(player_names)
card_div.appendChild(card_image)
card_div.appendChild(card_body)
return card_div
}
const all_plays = await makeRequest(api_url + '/plays?filter_expansions_out=true')
const MAX_COLUMNS = 4
const column_width = 12 / MAX_COLUMNS
const rows_needed = Math.ceil(all_plays.length / MAX_COLUMNS)
for (let row_number = 0; row_number < rows_needed; row_number++){
const row_div = document.createElement('div')
row_div.className = 'row'
for (let column_number = 0; column_number < MAX_COLUMNS; column_number++) {
const column_div = document.createElement('div')
column_div.className = "col-sm-" + column_width
const play_card = createPlayCard(all_plays[(row_number * MAX_COLUMNS) + column_number])
column_div.appendChild(play_card)
row_div.appendChild(column_div)
}
document.body.appendChild(row_div)
}
} }

23
templates/plays.jinja Normal file
View file

@ -0,0 +1,23 @@
{% extends "base.jinja" %}
{% block body %}
<body onload="loadPlays()">
{# <div class="row">
<div class="col-sm-2">
<div class="card">
<img id="boardgame_image">
<div class="card-body">
<h4 class="card-title" id="boardgame_name">John Doe</h4>
<p class="card-text" id="boardgame_description">Some example text.</p>
<a href="#" id="boardgame_link" class="btn btn-primary">Bekijk op BGG</a>
</div>
</div>
</div>
<div class="col-sm-10"><p id="boardgame_weight"></p></div>
</div> #}
</body>
{% endblock body %}