Commit 2af36d10 authored by Markus Shepherd's avatar Markus Shepherd

first version of BGA view

parent 627e3a1a
......@@ -101,6 +101,7 @@
<script src="/js/news.js" type="text/javascript"></script>
<script src="/js/about.js" type="text/javascript"></script>
<script src="/js/faq.js" type="text/javascript"></script>
<script src="/js/bga.js" type="text/javascript"></script>
<link rel="apple-touch-icon" sizes="180x180" href="/assets/apple-touch-icon.png" />
<link rel="icon" type="image/png" sizes="32x32" href="/assets/favicon-32x32.png" />
......
......@@ -50,6 +50,9 @@ ludojApp.config(function (
}).when('/faq', {
templateUrl: '/partials/faq.html',
controller: 'FaqController'
}).when('/bga', {
templateUrl: '/partials/bga.html',
controller: 'BgaController'
}).when('/', {
templateUrl: '/partials/list.html',
controller: 'ListController'
......
/*jslint browser: true, nomen: true, stupid: true, todo: true */
/*jshint -W097 */
/*global ludojApp, _, $ */
'use strict';
ludojApp.controller('BgaController', function BgaController(
$location,
$log,
$http,
$q,
$route,
$routeParams,
$scope,
API_URL,
filterService,
gamesService,
toastr
) {
var users = {};
function fetchGames(page) {
toastr.clear();
page = _.parseInt(page) || $scope.page || $scope.nextPage || 1;
var append = page > 1,
url = API_URL + 'games/recommend_bga/',
userName = $routeParams.for || null,
params = {'page': page},
promise,
bgaParams,
games;
if (!userName) {
promise = $q.resolve(params);
} else if (users[userName]) {
params.user = users[userName];
promise = $q.resolve(params);
} else {
bgaParams = {
'client_id': 'SB1VGnDv7M',
'username': userName,
'limit': 1
};
promise = $http.get('https://www.boardgameatlas.com/api/reviews', {'params': bgaParams})
.then(function (response) {
var user = _.get(response, 'data.reviews[0].user.id') || null;
if (user) {
users[userName] = user;
params.user = user;
}
return params;
});
}
return promise
.then(function (params) {
$log.debug('query parameters', params);
return $http.get(url, {'params': params});
})
.then(function (response) {
response = response.data;
page = response.page || page;
$scope.currPage = page;
$scope.prevPage = response.previous ? page - 1 : null;
$scope.nextPage = response.next ? page + 1 : null;
$scope.total = response.count;
$scope.currUser = userName;
games = response.results;
var ids = _.map(games, 'bga_id');
bgaParams = {
'client_id': 'SB1VGnDv7M',
'ids': _.join(ids)
};
return $http.get('https://www.boardgameatlas.com/api/search', {'params': bgaParams});
})
.then(function (response) {
var bgaObj = _(response.data.games)
.map(function (game) {
return [game.id, game];
})
.fromPairs()
.value();
games = _(games)
.map(function (rg) {
var bga = bgaObj[rg.bga_id];
if (!bga || rg.bga_id !== bga.id) {
return null;
}
rg.rec_rank = rg.rank;
rg.rec_rating = rg.score;
rg.rec_stars = rg.stars;
rg.image_url = [bga.image_url];
rg.name = rg.name || bga.name;
rg.year = bga.year_published;
return rg;
})
.filter()
.value();
games = append && !_.isEmpty($scope.games) ? _.concat($scope.games, games) : games;
$scope.games = games;
$scope.empty = _.isEmpty(games) && !$scope.nextPage;
return games;
})
.catch(function (response) {
$log.error(response);
$scope.empty = false;
$scope.total = null;
toastr.error(
'Sorry, there was an error. Tap to try again...',
'Error loading games',
{'onTap': function onTap() {
return fetchGames(page);
}}
);
})
.then(function () {
$(function () {
$('.tooltip').remove();
$('[data-toggle~="tooltip"]').tooltip();
$('[data-toggle-tooltip~="tooltip"]').tooltip();
});
});
}
$scope.user = $routeParams.for;
$scope.similarity = $routeParams.similarity;
$scope.fetchGames = fetchGames;
$scope.empty = false;
$scope.total = null;
$scope.hideScore = $routeParams.for && $routeParams.similarity;
$scope.updateParams = function updateParams() {
$route.updateParams({'for': $scope.user || null});
};
$scope.clearField = function clearField(field, id) {
$scope[field] = null;
id = id || field;
$('#' + id).focus();
};
fetchGames(1);
gamesService.setTitle();
gamesService.setCanonicalUrl($location.path(), filterService.getParams($routeParams));
gamesService.setImage();
gamesService.setDescription();
});
<!DOCTYPE html>
<section xmlns="http://www.w3.org/1999/xhtml"
id="games-list">
<h1>Board Game Atlas recommendations</h1>
<form ng-submit="updateParams()"
id="fetch-game-form"
name="fetch-game-form"
novalidate="novalidate"
role="form"
aria-labelledby="bgg-tab"
class="form mb-3">
<label for="user"
id="bgg-user-label"
class="{{ user ? 'text-success' : 'text-muted' }} mb-0">
Personal recommendations for:
</label>
<div class="input-group">
<input type="search"
id="user"
name="user"
ng-model="user"
ng-required="true"
class="form-control"
placeholder="Board Game Atlas user name"
aria-describedby="bgg-user-label" />
<div class="input-group-append">
<button type="button"
ng-disabled="!user"
ng-click="clearField('user')"
class="btn btn-outline-secondary">
<i class="fas fa-times"></i>
</button>
<button type="submit"
ng-disabled="!user"
class="btn btn-primary">
<i class="fas fa-dice"></i>
</button>
</div>
</div>
</form>
<h2 ng-if="currUser">
Recommended games for <strong>
<a ng-href="https://www.boardgameatlas.com/u/{{ currUser }}"
target="_blank">{{ currUser }} <i class="fas fa-external-link-alt"></i></a>
</strong>
</h2>
<div ng-if="empty"
class="alert alert-warning"
role="alert">
<h4 class="alert-heading">No games found</h4>
<p class="mb-0">
No games could be loaded.
</p>
</div>
<div class="row">
<a ng-repeat="game in games"
game-square=""
game="game"
show-ranking="true"
hide-score="hideScore"
ng-href="https://www.boardgameatlas.com/search/game/{{ game.bga_id }}"
target="_blank"
class="col-lg-3 col-md-4 col-sm-6"></a>
<div ng-if="nextPage"
ng-click="fetchGames(nextPage)"
class="col-lg-3 col-md-4 col-sm-6">
<div class="game game-more">
<div>
<h2 class="game-title">
More...
<small ng-if="total"
class="text-secondary">
({{ total }} games in total)
</small>
</h2>
</div>
</div>
</div>
</div>
<script type="application/ld+json">
{
"@context": "http://schema.org",
"@type": "WebSite",
"url": "https://recommend.games/",
"potentialAction": [{
"@type": "SearchAction",
"target": "https://recommend.games/#/?search={search_term_string}",
"query-input": "required name=search_term_string"
}]
}
</script>
</section>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment