Yarninator/boardgame_site_v2
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Added board game card

Browse source
This commit is contained in:
Yarne Coppens 2024-08-11 10:49:59 +02:00
parent d9fd74f422
commit d3fd938da3
2 changed files with 24 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
static/main.js
View file

@ -69,7 +69,7 @@ async function loadOwnedGames() {
],
order: [[2, 'asc']]
});
$('#boardgame_table').on('click', 'tbody tr', function() {
var boardgame_id = boardgame_datatable.row(this).data().id;
@ -80,17 +80,19 @@ async function loadOwnedGames() {
async function loadGame() {
let params = new URLSearchParams(document.location.search);
let boargame_id = params.get("id");
let boardgame_id = params.get("id");
var loadGameURL = api_url + '/boardgame/' + boargame_id
var loadGameURL = api_url + '/boardgame/' + boardgame_id
var requested_game = await makeRequest(loadGameURL)
var boardgame_image_container = document.getElementById('boardgame_image')
boardgame_image_container.src = requested_game.image_url
$('#boardgame_image').attr('src', requested_game.image_url)
var boardgame_name_container = document.getElementById('boardgame_name')
boardgame_name_container.innerHTML = requested_game.name
$('#boardgame_name').text(requested_game.name)
$('#boardgame_weight').text(requested_game.weight)
$('#boardgame_description').text(requested_game.description)
$('#boardgame_link').attr('href', 'https://boardgamegeek.com/boardgame/' + boardgame_id)
var boardgame_weight_container = document.getElementById('boardgame_weight')
boardgame_weight_container.innerHTML = requested_game.weight
}

17
templates/boardgame.jinja
View file

@ -4,10 +4,19 @@
<body onload="loadGame()">
<img id="boardgame_image">
<p id="boardgame_name"></p>
<p id="boardgame_weight"></p>
<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>