v1.9-rc3

CHANGELOG.md

@@ -1,3 +1,14 @@
+# v1.9 (_31-07-2023_)
+
+## Added
+ - Region and revision system is now more robust and flexible. Solves [#301](https://github.com/zurdi15/romm/issues/301). Check [tags support](https://github.com/zurdi15/romm#-tags-support)
+
+## Fixed
+ - Libraries are now paginated to improve performance in large collections. Solves [#89](https://github.com/zurdi15/romm/issues/89) and [#280](https://github.com/zurdi15/romm/issues/280)
+ - Downloads are now managed in the backend, allowing the web browser to manage the download progression and avoiding memory overload. Solves [#266](https://github.com/zurdi15/romm/issues/266)
+
+<br>
+
 # v1.8.4 (_19-05-2023_)
 
 ## Fixed

README.md

@@ -157,7 +157,7 @@ This will change over the time, adding games metadata for more platforms. Make s
   <span>
 
 | slug                    | name                                | games metadata |
-|---------------          |-------------------------------------|     :----:     |
+|-------------------------|-------------------------------------|     :----:     |
 | 3ds                     | Nintendo 3DS                        | ✅             |
 | amiga                   | Amiga                               | ✅             |
 | acpc                    | Amstrad CPC                         | ✅             |
@@ -240,13 +240,49 @@ This will change over the time, adding games metadata for more platforms. Make s
 
 ## 📑 Tags support
 
-Games can be tagged with region, revision or other tags using parenthesis in the file name. Region and revision tags must be built with the following reserved words:
-  - Region tags must be prefixed with **"reg-"**: (reg-EUR) / (reg-USA) / (reg-Japan) / (reg-whatever)
-  - Revision tags must be prefixed with **"rev-"**: (rev-1) / (rev-v2) / (rev-whatever)
+Games can be tagged with region, revision or other tags using parenthesis in the file name. 
+
+ - Regions will be detected according to the following dictionary:
+
+| shortcode | region        |
+|-----------|---------------|
+| A         | Australia     |
+| AS        | Asia          |
+| B         | Brazil        |
+| C         | Canada        |
+| CH        | China         |
+| E         | Europe        |
+| F         | France        |
+| FN        | Finland       |
+| G         | Germany       |
+| GR        | Greece        |
+| H         | Holland       |
+| HK        | Hong Kong     |
+| I         | Italy         |
+| J         | Japan         |
+| K         | Korea         |
+| NL        | Netherlands   |
+| NO        | Norway        |
+| PD        | Public Domain |
+| R         | Russia        |
+| S         | Spain         |
+| SW        | Sweden        |
+| T         | Taiwan        |
+| U         | USA           |
+| UK        | England       |
+| UNK       | Unknown       |
+| UNL       | Unlicensed    |
+| W         | World         |
+
+*Aditionally, region can be set adding **"reg-"** as prefix: (reg-E) / (reg-Spain) / (reg-USA)
+
+ - Revision tags must be prefixed with **"rev "** or with **"rev-"**: (rev v1) / (rev-v1) / (rev-whatever)
+
   - Any other tag can have any structure
-  - Example: **my_game (reg-EUR)(rev-1)(aditional_tag_1)(aditional_tag_2).gba**
 
-Tags can be used with the search bar to help to filter your library.
+  - Example: **my_game (E)(rev v1)(fav)(aditional_tag).gba**
+
+**NOTE:** Tags can be used with the search bar to help to filter your library.
 
 # ⛏ Troubleshoot
 

backend/utils/__init__.py

@@ -26,33 +26,33 @@
 ]
 
 REGIONS = [
-    ("U", "USA"),
+    ("A", "Australia"),
+    ("AS", "Asia"),
+    ("B", "Brazil"),
+    ("C", "Canada"),
+    ("CH", "China"),
     ("E", "Europe"),
+    ("F", "France"),
+    ("FN", "Finland"),
+    ("G", "Germany"),
+    ("GR", "Greece"),
+    ("H", "Holland"),
+    ("HK", "Hong Kong"),
+    ("I", "Italy"),
     ("J", "Japan"),
     ("K", "Korea"),
-    ("T", "Taiwan"),
-    ("G", "Germany"),
-    ("B", "Brazil"),
-    ("A", "Australia"),
-    ("CH", "China"),
     ("NL", "Netherlands"),
+    ("NO", "Norway"),
     ("PD", "Public Domain"),
-    ("F", "France"),
+    ("R", "Russia"),
     ("S", "Spain"),
-    ("W", "World"),
-    ("C", "Canada"),
     ("SW", "Sweden"),
-    ("FN", "Finland"),
+    ("T", "Taiwan"),
+    ("U", "USA"),
     ("UK", "England"),
-    ("GR", "Greece"),
     ("UNK", "Unknown"),
-    ("HK", "Hong Kong"),
-    ("I", "Italy"),
-    ("H", "Holland"),
     ("UNL", "Unlicensed"),
-    ("AS", "Asia"),
-    ("R", "Russia"),
-    ("NO", "Norway"),
+    ("W", "World"),
 ]
 
 REGIONS_BY_SHORTCODE = {region[0].lower(): region[1] for region in REGIONS}
@@ -77,7 +77,11 @@ def parse_tags(file_name: str) -> tuple:
         if "reg" in tag.lower():
             match = re.match("^reg[\s|-](.*)$", tag, re.IGNORECASE)
             if match:
-                reg = match.group(1)
+                reg = (
+                    REGIONS_BY_SHORTCODE[match.group(1).lower()]
+                    if match.group(1).lower() in REGIONS_BY_SHORTCODE.keys()
+                    else match.group(1)
+                )
                 continue
 
         if "rev" in tag.lower():

frontend/src/views/Gallery.vue

@@ -3,7 +3,7 @@ import { ref, inject, onMounted } from "vue";
 import { onBeforeRouteUpdate, useRoute } from "vue-router";
 import { fetchRomsApi } from "@/services/api.js";
 import socket from "@/services/socket.js";
-import { views } from "@/utils/utils.js";
+import { views, normalizeString } from "@/utils/utils.js";
 import storeGalleryFilter from "@/stores/galleryFilter.js";
 import storeGalleryView from "@/stores/galleryView.js";
 import storeScanning from "@/stores/scanning.js";
@@ -84,18 +84,6 @@ async function fetchMoreSearch() {
     });
 }
 
-function onFilterChange() {
-  searchCursor.value = "";
-  searchRoms.value = [];
-
-  if (galleryFilter.value === "") {
-    filteredRoms.value = roms.value;
-    return;
-  }
-
-  fetchMoreSearch();
-}
-
 async function fetchMoreRoms(platform) {
   if (cursor.value === null || gettingRoms.value) return;
 
@@ -114,24 +102,26 @@ async function fetchMoreRoms(platform) {
     });
 }
 
-function onListScroll({ target }) {
-  if (cursor.value === null && searchCursor.value === null) return;
+function onFilterChange() {
+  searchCursor.value = "";
+  searchRoms.value = [];
 
-  // If we are at the bottom of the page, fetch more roms
-  if (target.scrollTop + target.offsetHeight >= target.scrollHeight) {
-    galleryFilter.value
-      ? fetchMoreSearch()
-      : fetchMoreRoms(route.params.platform);
+  if (galleryFilter.value === "") {
+    filteredRoms.value = roms.value;
+    return;
   }
+
+  fetchMoreSearch();
 }
 
 function onGridScroll() {
   if (cursor.value === null && searchCursor.value === null) return;
 
   const { scrollTop, scrollHeight, clientHeight } = document.documentElement;
+  const scrollOffset = 60;
 
-  // If we are at the bottom of the page, fetch more roms
-  if (scrollTop + clientHeight >= scrollHeight) {
+  // If we are close at the bottom of the page, fetch more roms
+  if (scrollTop + clientHeight + scrollOffset >= scrollHeight) {
     galleryFilter.value
       ? fetchMoreSearch()
       : fetchMoreRoms(route.params.platform);
@@ -206,18 +196,15 @@ onBeforeRouteUpdate(async (to, _) => {
             :thickness="1"
           />
           <tbody>
-            <!-- Height has to be set and exact -->
-            <v-virtual-scroll
-              :items="filteredRoms"
-              height="calc(100vh - 122px)"
-              @scroll="onListScroll"
-            >
-              <template v-slot="{ item }">
-                <v-list-item :key="item.id" :value="item.id">
-                  <game-list-item :rom="item" />
-                </v-list-item>
-              </template>
-            </v-virtual-scroll>
+            <v-list class="bg-secondary">
+              <v-list-item
+                v-for="item in filteredRoms"
+                :key="item.id"
+                :value="item.id"
+              >
+                <game-list-item :rom="item" />
+              </v-list-item>
+            </v-list>
           </tbody>
         </v-table>
       </v-col>
@@ -232,6 +219,23 @@ onBeforeRouteUpdate(async (to, _) => {
       </div>
     </v-row>
   </template>
+
+  <template v-if="gettingRoms">
+    <v-dialog
+      :model-value="gettingRoms"
+      scroll-strategy="none"
+      width="auto"
+      :scrim="false"
+      persistent
+    >
+      <v-progress-circular
+        :width="3"
+        :size="70"
+        color="rommAccent1"
+        indeterminate
+      />
+    </v-dialog>
+  </template>
 </template>
 
 <style scoped>