feat: added company info support

gaseous-server/wwwroot/pages/game.html

@@ -1,8 +1,11 @@
-<div id="bgImage"></div>
+<div id="bgImage">
+    <div id="bgImage_Opacity"></div>
+</div>
 
 <div id="gamepage">
     <div id="gametitle">
         <h1 id="gametitle_label"></h1>
+        <p id="gamedeveloper_label"></p>
         <p id="gametitle_alts">
             <span>Also known as: </span><span id="gametitle_alts_label"></span>
         </p>
@@ -11,6 +14,15 @@
 
     <div id="gamesummary">
         <div id="gamesummary_cover"></div>
+        <div id="gamesumarry_genres">
+            <h3>Genres</h3>
+        </div>
+        <div id="gamesummary_developer">
+            <h3>Developers</h3>
+        </div>
+        <div id="gamesummary_publishers">
+            <h3>Publishers</h3>
+        </div>
         <div id="gamesummary_ratings">
             <h3>Age Ratings</h3>
         </div>
@@ -97,7 +109,8 @@
         // load artwork
         if (result.artworks) {
             artworks = result.artworks.ids;
-            artworksPostition = 0;
+            var startPos = randomIntFromInterval(0, result.artworks.ids.length);
+            artworksPosition = startPos;
             rotateBackground();
         } else {
             if (result.cover) {
@@ -106,6 +119,52 @@
             }
         }
 
+        // load companies
+        var gameHeaderDeveloperLabel = document.getElementById('gamedeveloper_label');
+        var gameHeaderDeveloperLogo = document.getElementById('gamedev_logo');
+        var gameDeveloperLabel = document.getElementById('gamesummary_developer');
+        var gamePublisherLabel = document.getElementById('gamesummary_publishers');
+        var gameDeveloperLoaded = false;
+        var gamePublisherLoaded = false;
+        if (result.involvedCompanies) {
+            ajaxCall('/api/v1/games/' + gameId + '/companies', 'GET', function (result) {
+                for (var i = 0; i < result.length; i++) {
+                    var companyLabel = document.createElement('span');
+                    companyLabel.className = 'gamegenrelabel';
+                    companyLabel.innerHTML = result[i].company.name;
+
+                    if (result[i].involvement.developer == true) {
+                        if (gameHeaderDeveloperLabel.innerHTML.length > 0) {
+                            gameHeaderDeveloperLabel += ", ";
+                        }
+                        gameHeaderDeveloperLabel.innerHTML += result[i].company.name;
+
+                        gameDeveloperLabel.appendChild(companyLabel);
+
+                        gameDeveloperLoaded = true;
+                    } else {
+                        if (result[i].involvement.publisher == true) {
+                            gamePublisherLabel.appendChild(companyLabel);
+                            gamePublisherLoaded = true;
+                        }
+                    }
+                }
+
+                if (gameDeveloperLoaded == false) {
+                    gameHeaderDeveloperLabel.setAttribute('style', 'display: none;');
+                    gameDeveloperLabel.setAttribute('style', 'display: none;');
+                }
+                if (gamePublisherLoaded == false) {
+                    gamePublisherLabel.setAttribute('style', 'display: none;');
+                }
+            });
+        } else {
+            gameHeaderDeveloperLabel.setAttribute('style', 'display: none;');
+            gameHeaderDeveloperLogo.setAttribute('style', 'display: none;');
+            gameDeveloperLabel.setAttribute('style', 'display: none;');
+            gamePublisherLabel.setAttribute('style', 'display: none;');
+        }
+
         // load cover
         var gameSummaryCover = document.getElementById('gamesummary_cover');
         var gameImage = document.createElement('img');
@@ -133,6 +192,22 @@
             gameSummaryRatings.setAttribute('style', 'display: none;');
         }
 
+        // load genres
+        var gameSummaryGenres = document.getElementById('gamesumarry_genres');
+        if (result.genres) {
+            ajaxCall('/api/v1/Games/' + gameId + '/genre', 'GET', function (result) {
+                for (var i = 0; i < result.length; i++) {
+                    var genreLabel = document.createElement('span');
+                    genreLabel.className = 'gamegenrelabel';
+                    genreLabel.innerHTML = result[i].name;
+
+                    gameSummaryGenres.appendChild(genreLabel);
+                }
+            });
+        } else {
+            gameSummaryGenres.setAttribute('style', 'display: none;');
+        }
+
         // load screenshots
         var gameScreenshots = document.getElementById('gamescreenshots');
         if (result.screenshots || result.videos) {

gaseous-server/wwwroot/scripts/main.js

@@ -70,4 +70,9 @@ function showDialog(dialogPage, variables) {
     modalVariables = variables;
 
     $('#modal-content').load('/pages/dialogs/' + dialogPage + '.html');
+}
+
+function randomIntFromInterval(min, max) { // min and max included 
+    var rand = Math.floor(Math.random() * (max - min + 1) + min);
+    return rand;
 }

gaseous-server/wwwroot/styles/style.css

@@ -240,6 +240,16 @@ input[id='filter_panel_search'] {
     z-index: -100;
 }
 
+#bgImage_Opacity {
+    background: rgba(56, 56, 56, 0.7);
+    position: fixed;
+    top: 0px;
+    left: 0px;
+    right: 0px;
+    bottom: 0px;
+    z-index: -90;
+}
+
 #gamepage {
     top: 0px;
     bottom: 0;
@@ -255,7 +265,6 @@ input[id='filter_panel_search'] {
     padding-left: 20px;
     padding-right: 20px;
     padding-bottom: 20px;
-    background: rgba(56, 56, 56, 0.7);
 }
 
 #mainbody {
@@ -275,6 +284,11 @@ input[id='filter_panel_search'] {
     width: 100%;
 }
 
+.gamegenrelabel {
+    display: block;
+    white-space: pre;
+}
+
 .rating_image {
     display: inline-block;
     max-width: 64px;
@@ -420,4 +434,13 @@ th {
     color: white;
     text-decoration: underline;
     cursor: pointer;
+}
+
+#gamedev_logo {
+    float: right;
+    max-height: 48px;
+}
+
+#gamedeveloper_label {
+    font-size: 16px;
 }