sendnrw/gaseous-server
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Hide favourite icon in similar games list + minor UI tweaks and fixes

Browse Source
This commit is contained in:
Michael Green
2024-10-02 13:08:19 +10:00
parent 32f6a86dc9
commit 4a76436223
5 changed files with 76 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
gaseous-server/wwwroot/index.html
View File

@@ -61,8 +61,6 @@
<script type="text/javascript">
// Gaseous Games - Main Application Script
let APIVersion = "v1.1";
// start the application
let AppVersion = "0.0.0";
let DBSchemaVersion = "1000";

2
gaseous-server/wwwroot/pages/game.js
View File

@@ -388,7 +388,7 @@ function SetupPage() {
var gameSummarySimilarContent = document.getElementById('gamesummarysimilarcontent');
for (var i = 0; i < result.games.length; i++) {
var similarObject = renderGameIcon(result.games[i], true, true, true, GetRatingsBoards(), false, true);
var similarObject = renderGameIcon(result.games[i], true, true, true, GetRatingsBoards(), false, true, false);
gameSummarySimilarContent.appendChild(similarObject);
}

2
gaseous-server/wwwroot/pages/home.js
View File

@@ -55,7 +55,7 @@ class HomePageGameRow {
let gameItem = document.createElement("li");
gameItem.classList.add("homegame-item");
let gameIcon = renderGameIcon(game, true, showRatings, showClassification, classificationDisplayOrder, true, false);
let gameIcon = renderGameIcon(game, true, showRatings, showClassification, classificationDisplayOrder, true, false, true);
gameItem.appendChild(gameIcon);
scroller.appendChild(gameItem);
}

96
gaseous-server/wwwroot/scripts/gamesformating.js
View File

@@ -181,7 +181,7 @@ function formatGamesPanel(targetElement, result, pageNumber, pageSize, forceScro
}
for (let i = 0; i < result.games.length; i++) {
let game = renderGameIcon(result.games[i], showTitle, showRatings, showClassification, classificationDisplayOrder, false, listView);
let game = renderGameIcon(result.games[i], showTitle, showRatings, showClassification, classificationDisplayOrder, false, listView, true);
switch (pageMode) {
case "paged":
targetElement.appendChild(game);
@@ -396,11 +396,15 @@ function IsInView() {
}
}
function renderGameIcon(gameObject, showTitle, showRatings, showClassification, classificationDisplayOrder, useSmallCover, listView) {
function renderGameIcon(gameObject, showTitle, showRatings, showClassification, classificationDisplayOrder, useSmallCover, listView, showFavourite) {
if (listView == undefined) {
listView = false;
}
if (showFavourite == undefined) {
showFavourite = true;
}
let classes = getViewModeClasses(listView);
let gameBox = document.createElement('div');
@@ -464,49 +468,6 @@ function renderGameIcon(gameObject, showTitle, showRatings, showClassification,
gameImageBox.appendChild(gameSaveIcon);
}
// add favourite game icon
let gameFavIconBox = document.createElement('div');
gameFavIconBox.classList.add(...classes['game_tile_box_favouritegame']);
let gameFavIcon = document.createElement('img');
gameFavIcon.classList.add(...classes['favouriteicon']);
if (gameObject.isFavourite == true) {
gameFavIcon.src = '/images/favourite-filled.svg';
gameFavIconBox.classList.add('favourite-filled');
} else {
gameFavIcon.src = '/images/favourite-empty.svg';
gameFavIconBox.classList.add('favourite-empty');
}
gameFavIconBox.appendChild(gameFavIcon);
gameFavIconBox.addEventListener('click', (e) => {
e.stopPropagation();
if (gameFavIconBox.classList.contains('favourite-filled')) {
gameFavIcon.src = '/images/favourite-empty.svg';
gameFavIconBox.classList.remove('favourite-filled');
gameFavIconBox.classList.add('favourite-empty');
gameObject.isFavourite = false;
} else {
gameFavIcon.src = '/images/favourite-filled.svg';
gameFavIconBox.classList.remove('favourite-empty');
gameFavIconBox.classList.add('favourite-filled');
gameObject.isFavourite = true;
}
fetch('/api/v1.1/Games/' + gameObject.id + '/favourite?favourite=' + gameObject.isFavourite, {
method: 'POST'
}).then(response => {
if (response.ok) {
// console.log('Favourite status updated');
} else {
// console.log('Failed to update favourite status');
}
});
});
gameImageBox.appendChild(gameFavIconBox);
// add ratings banner
if (gameObject.totalRating || displayClassification == true) {
let gameImageRatingBanner = document.createElement('div');
@@ -538,6 +499,51 @@ function renderGameIcon(gameObject, showTitle, showRatings, showClassification,
}
gameBox.appendChild(gameImageBox);
// add favourite game icon
if (showFavourite == true) {
let gameFavIconBox = document.createElement('div');
gameFavIconBox.classList.add(...classes['game_tile_box_favouritegame']);
let gameFavIcon = document.createElement('img');
gameFavIcon.classList.add(...classes['favouriteicon']);
if (gameObject.isFavourite == true) {
gameFavIcon.src = '/images/favourite-filled.svg';
gameFavIconBox.classList.add('favourite-filled');
} else {
gameFavIcon.src = '/images/favourite-empty.svg';
gameFavIconBox.classList.add('favourite-empty');
}
gameFavIconBox.appendChild(gameFavIcon);
gameFavIconBox.addEventListener('click', (e) => {
e.stopPropagation();
if (gameFavIconBox.classList.contains('favourite-filled')) {
gameFavIcon.src = '/images/favourite-empty.svg';
gameFavIconBox.classList.remove('favourite-filled');
gameFavIconBox.classList.add('favourite-empty');
gameObject.isFavourite = false;
} else {
gameFavIcon.src = '/images/favourite-filled.svg';
gameFavIconBox.classList.remove('favourite-empty');
gameFavIconBox.classList.add('favourite-filled');
gameObject.isFavourite = true;
}
fetch('/api/v1.1/Games/' + gameObject.id + '/favourite?favourite=' + gameObject.isFavourite, {
method: 'POST'
}).then(response => {
if (response.ok) {
// console.log('Favourite status updated');
} else {
// console.log('Failed to update favourite status');
}
});
});
gameImageBox.appendChild(gameFavIconBox);
}
if (showTitle == true) {
let gameBoxTitle = document.createElement('div');
gameBoxTitle.classList.add(...classes['game_tile_label']);

23
gaseous-server/wwwroot/styles/style.css
View File

@@ -1109,6 +1109,7 @@ input[name='filter_panel_range_max'] {
position: absolute;
display: inline-block;
top: 30%;
padding-top: 7px;
right: 10px;
}
@@ -1138,6 +1139,28 @@ input[name='filter_panel_range_max'] {
display: inline-block;
top: 30%;
right: 50px;
width: 30px;
height: 30px;
text-align: center;
padding-top: 5px;
padding-left: 4px;
padding-right: 3px;
padding-bottom: 5px;
border-color: transparent;
border-width: 1px;
border-style: solid;
border-radius: var(--standard-radius);
z-index: +1;
}
.game_tile_box_row:hover>.game_tile_box_favouritegame_row {
border-color: var(--input-border);
background-color: var(--fancybutton-background);
}
.game_tile_box_row:hover>.game_tile_box_favouritegame_row:hover {
border-color: var(--input-border-hover);
background-color: var(--fancybutton-background-hover);
}
.game_tile_image {