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

18
static/main.js
View file

@ -80,17 +80,19 @@ async function loadOwnedGames() {
async function loadGame() { async function loadGame() {
let params = new URLSearchParams(document.location.search); 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 requested_game = await makeRequest(loadGameURL)
var boardgame_image_container = document.getElementById('boardgame_image') $('#boardgame_image').attr('src', requested_game.image_url)
boardgame_image_container.src = requested_game.image_url
var boardgame_name_container = document.getElementById('boardgame_name') $('#boardgame_name').text(requested_game.name)
boardgame_name_container.innerHTML = 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()"> <body onload="loadGame()">
<img id="boardgame_image"> <div class="row">
<div class="col-sm-2">
<p id="boardgame_name"></p> <div class="card">
<p id="boardgame_weight"></p> <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> </body>