Migrate to new EJS CDN, and save state tweaks (#264)

* Saved game icon now displays on game cover art in library

* Fixed casing error on save state download icon

* Migrate EJS from submodule to 7z download during docker build

* Updated README and gitignore

* Resized library search buttons

* Export to JSON now triggers the download rather than display of a formatted platform map

gaseous-server/wwwroot/pages/dialogs/emulatorloadstate.html

@@ -102,7 +102,7 @@
                     stateControlsDownload.id = 'stateControlsDownload_' + result[i].id;
                     stateControlsDownload.className = 'saved_state_buttonlink';
                     stateControlsDownload.href = '/api/v1.1/StateManager/' + modalVariables.romId + '/' + result[i].id + '/State/savestate.state?IsMediaGroup=' + modalVariables.IsMediaGroup;
-                    stateControlsDownload.innerHTML = '<img src="/images/Download.svg" class="banner_button_image" alt="Download" title="Download" />';
+                    stateControlsDownload.innerHTML = '<img src="/images/download.svg" class="banner_button_image" alt="Download" title="Download" />';
                     stateControls.appendChild(stateControlsDownload);
 
                     var stateControlsDelete = document.createElement('span');

gaseous-server/wwwroot/pages/emulator.html

@@ -55,7 +55,7 @@
 
         switch (getQueryString('engine', 'string')) {
             case 'EmulatorJS':
-                $('#emulator').load('/pages/EmulatorJS.html?v=' + AppVersion);
+                $('#emulator').load('/emulators/EmulatorJS.html?v=' + AppVersion);
                 break;
         }
     });

gaseous-server/wwwroot/pages/game.html

@@ -500,8 +500,7 @@
                                     "mediagroup": 1,
                                     "rompath": romPath
                                 };
-                                saveStatesButton = document.createElement('a');
-                                saveStatesButton.href = '#';
+                                saveStatesButton = document.createElement('div');
                                 saveStatesButton.setAttribute('onclick', 'showDialog("emulatorloadstate", ' + JSON.stringify(modalVariables) + ');');
                                 saveStatesButton.innerHTML = '<img src="/images/SaveStates.png" class="savedstateicon" />';
                             }
@@ -672,8 +671,7 @@
                                         "mediagroup": 0,
                                         "rompath": romPath
                                     };
-                                    saveStatesButton = document.createElement('a');
-                                    saveStatesButton.href = '#';
+                                    saveStatesButton = document.createElement('div');
                                     saveStatesButton.setAttribute('onclick', 'showDialog("emulatorloadstate", ' + JSON.stringify(modalVariables) + ');');
                                     saveStatesButton.innerHTML = '<img src="/images/SaveStates.png" class="savedstateicon" />';
                                 }

gaseous-server/wwwroot/pages/settings/mapping.html

@@ -72,7 +72,7 @@
     }
 
     function DownloadJSON() {
-        window.open('/api/v1.1/PlatformMaps', '_blank');
+        window.location = '/api/v1.1/PlatformMaps/PlatformMap.json';
     }
 
     document.getElementById('importjson').addEventListener('click', openDialog);

gaseous-server/wwwroot/scripts/filterformating.js

@@ -21,6 +21,14 @@ function formatFilterPanel(containerElement, result) {
     containerPanelSearchField.id = 'filter_panel_search';
     containerPanelSearchField.type = 'text';
     containerPanelSearchField.placeholder = 'Search';
+    containerPanelSearchField.addEventListener("keypress", function(event) {
+        if (event.key === "Enter") {
+            // Cancel the default action, if needed
+            event.preventDefault();
+            // Trigger the button element with a click
+            executeFilter1_1();
+        }
+    });
     containerPanelSearch.appendChild(containerPanelSearchField);
 
     panel.appendChild(containerPanelSearch);
@@ -73,6 +81,8 @@ function formatFilterPanel(containerElement, result) {
 
     panel.appendChild(containerPanelUserRating);
 
+    buildFilterPanel(panel, 'settings', 'Settings', [{ "id": "savestatesavailable", "name": "Game has save states avaialble", "gameCount": 0 }], true, true);
+
     if (result.platforms) {
         buildFilterPanel(panel, 'platform', 'Platforms', result.platforms, true, true);
     }
@@ -350,6 +360,9 @@ function executeFilter1_1(pageNumber, pageSize) {
     setCookie('games_library_orderby_direction_select', orderByDirectionSelect);
 
     if (existingSearchModel == undefined || freshSearch == true) {
+        // search name
+        setCookie('filter_panel_search', document.getElementById('filter_panel_search').value);
+
         // user ratings
         var userRatingEnabled = document.getElementById('filter_panel_userrating_enabled');
 
@@ -386,6 +399,9 @@ function executeFilter1_1(pageNumber, pageSize) {
             setCookie("filter_panel_userrating_enabled", true);
         }
 
+        // save cookies for settings
+        GetFilterQuery1_1('settings');
+
         // build filter model
         var ratingAgeGroups = GetFilterQuery1_1('agegroupings');
         var ratingIncludeUnrated = false;
@@ -395,6 +411,7 @@ function executeFilter1_1(pageNumber, pageSize) {
 
         model = {
             "Name": document.getElementById('filter_panel_search').value,
+            "HasSavedGame": document.getElementById('filter_panel_item_settings_checkbox_savestatesavailable').checked,
             "Platform": GetFilterQuery1_1('platform'),
             "Genre": GetFilterQuery1_1('genre'),
             "GameMode": GetFilterQuery1_1('gamemode'),

gaseous-server/wwwroot/scripts/gamesformating.js

@@ -283,6 +283,14 @@ function renderGameIcon(gameObject, showTitle, showRatings, showClassification,
         }
     }
 
+    // add save game icon
+    if (gameObject.hasSavedGame == true) {
+        var gameSaveIcon = document.createElement('img');
+        gameSaveIcon.src = '/images/SaveStates.png';
+        gameSaveIcon.className = 'game_tile_box_savedgame savedstateicon';
+        gameImageBox.appendChild(gameSaveIcon);
+    }
+
     if (gameObject.totalRating || displayClassification == true) {
         var gameImageRatingBanner = document.createElement('div');
         gameImageRatingBanner.className = 'game_tile_box_ratingbanner';

gaseous-server/wwwroot/styles/style.css

@@ -213,13 +213,13 @@ h3 {
     position: -webkit-sticky;
     bottom: 0;
     width: 180px;
-    height: 18px;
+    height: 15px;
     padding: 10px;
     background-color: #352879;
     color: white;
     text-align: center;
     font-family: Commodore64;
-    font-size: 16px;
+    font-size: 13px;
 }
 
 #games_library_searchbutton:hover {
@@ -232,13 +232,13 @@ h3 {
     position: -webkit-sticky;
     bottom: 0;
     width: 180px;
-    height: 18px;
+    height: 15px;
     padding: 10px;
     background-color: #646464;
     color: white;
     text-align: center;
     font-family: Commodore64;
-    font-size: 16px;
+    font-size: 13px;
 }
 
 #games_library_resetbutton:hover {
@@ -557,6 +557,12 @@ input[id='filter_panel_userrating_max'] {
     -webkit-backdrop-filter: blur(8px);
 }
 
+.game_tile_box_savedgame {
+    position: absolute;
+    top: 1px;
+    right: 5px;
+}
+
 .game_tile_image {
     max-width: 200px;
     min-width: 150px;
@@ -804,6 +810,7 @@ table .romrow:nth-child(odd) {
     height: 24px;
     width: 24px;
     margin-top: 4px;
+    cursor: pointer;
 }
 
 th {