From c24ab9831a457ca8aba66273d620335effffb73a Mon Sep 17 00:00:00 2001 From: Jai A Date: Sat, 23 May 2020 21:06:36 -0700 Subject: [PATCH] Add categories + Infinite Scroll --- src/routes/search.rs | 39 +++++++++++++------- static/css/search.css | 35 ++++++++++++++++++ static/images/icon/equipment.svg | 52 +++++++++++++++++++++++++++ static/images/icon/food.svg | 48 +++++++++++++++++++++++++ static/images/icon/forge-alt.svg | 14 ++++++++ static/images/icon/forge.jpg | Bin 5557 -> 0 bytes static/images/icon/forge.svg | 14 ++++++++ static/images/icon/storage.svg | 1 + static/images/icon/up.svg | 5 +++ static/js/search.js | 59 ++++++++++++++++++++++++++----- templates/search.hbs | 23 +++++++++--- templates/search_results.hbs | 23 +++++++++++- 12 files changed, 287 insertions(+), 26 deletions(-) create mode 100644 static/images/icon/equipment.svg create mode 100644 static/images/icon/food.svg create mode 100644 static/images/icon/forge-alt.svg delete mode 100644 static/images/icon/forge.jpg create mode 100644 static/images/icon/forge.svg create mode 100644 static/images/icon/storage.svg create mode 100644 static/images/icon/up.svg diff --git a/src/routes/search.rs b/src/routes/search.rs index 719663b78..a5ef0b2da 100644 --- a/src/routes/search.rs +++ b/src/routes/search.rs @@ -10,6 +10,7 @@ use diesel::prelude::*; use actix_web::client::Connector; use meilisearch_sdk::settings::Settings; use meilisearch_sdk::progress::SettingsUpdate; +use serde_json::from_str; #[derive(Serialize, Deserialize, Debug)] struct Attachment { @@ -44,6 +45,7 @@ struct CurseForgeMod { downloadCount: f32, categories: Vec, gameVersionLatestFiles: Vec, + dateCreated: String, dateModified: String, } @@ -59,6 +61,7 @@ struct SearchMod { page_url: String, icon_url: String, author_url: String, + date_created: String, date_modified: String, latest_version: String, empty: String, @@ -77,6 +80,7 @@ pub struct SearchRequest { q: Option, f: Option, v: Option, + o: Option, } #[post("search")] @@ -110,10 +114,11 @@ fn search(web::Query(info): web::Query) -> Vec { let mut search_query = "".to_string(); let mut filters = "".to_string(); + let mut offset = 0; match info.q { Some(q) => search_query = q, - None => search_query = "pdsaojdakdka".to_string() + None => search_query = "{}{}{}".to_string() } if let Some(f) = info.f { @@ -129,10 +134,14 @@ fn search(web::Query(info): web::Query) -> Vec { } } - let mut query = Query::new(&search_query).with_limit(10); + if let Some(o) = info.o { + offset = o.parse().unwrap(); + } + + let mut query = Query::new(&search_query).with_limit(10).with_offset(offset); if !filters.is_empty() { - query = Query::new(&search_query).with_limit(10).with_filters(&filters); + query = Query::new(&search_query).with_limit(10).with_filters(&filters).with_offset(offset); } client.get_index("mods").unwrap().search::(&query).unwrap().hits @@ -168,9 +177,10 @@ pub async fn index_mods(conn : PgConnection) { page_url: "".to_string(), icon_url: "".to_string(), author_url: "".to_string(), + date_created: "".to_string(), date_modified: "".to_string(), latest_version: "".to_string(), - empty: String::from("pdsaojdakdka") + empty: String::from("{}{}{}") }); } @@ -197,10 +207,6 @@ pub async fn index_mods(conn : PgConnection) { let mut mod_categories = vec![]; - if using_forge { - mod_categories.push(String::from("Forge")); - } - for category in curseforge_mod.categories { match &category.name[..] { "World Gen" => mod_categories.push(String::from("worldgen")), @@ -213,15 +219,16 @@ pub async fn index_mods(conn : PgConnection) { "Processing" => mod_categories.push(String::from("technology")), "Player Transport" => mod_categories.push(String::from("technology")), "Energy, Fluid, and Item Transport" => mod_categories.push(String::from("technology")), - "Farming" => mod_categories.push(String::from("technology")), + "Food" => mod_categories.push(String::from("food")), + "Farming" => mod_categories.push(String::from("food")), "Energy" => mod_categories.push(String::from("technology")), "Redstone" => mod_categories.push(String::from("technology")), "Genetics" => mod_categories.push(String::from("technology")), "Magic" => mod_categories.push(String::from("magic")), - "Storage" => mod_categories.push(String::from("technology")), + "Storage" => mod_categories.push(String::from("storage")), "API and Library" => mod_categories.push(String::from("library")), "Adventure and RPG" => mod_categories.push(String::from("adventure")), - "Map and Information" => mod_categories.push(String::from("adventure")), + "Map and Information" => mod_categories.push(String::from("utility")), "Cosmetic" => mod_categories.push(String::from("decoration")), "Addons" => mod_categories.push(String::from("misc")), "Thermal Expansion" => mod_categories.push(String::from("misc")), @@ -235,7 +242,7 @@ pub async fn index_mods(conn : PgConnection) { "Applied Energistics 2" => mod_categories.push(String::from("misc")), "CraftTweaker" => mod_categories.push(String::from("misc")), "Miscellaneous" => mod_categories.push(String::from("misc")), - "Armor, Tools, and Weapons" => mod_categories.push(String::from("technology")), + "Armor, Tools, and Weapons" => mod_categories.push(String::from("equipment")), "Server Utility" => mod_categories.push(String::from("utility")), "Fabric" => mod_categories.push(String::from("fabric")), _ => {} @@ -246,6 +253,10 @@ pub async fn index_mods(conn : PgConnection) { mod_categories.dedup(); mod_categories.truncate(3); + if using_forge { + mod_categories.push(String::from("forge")); + } + let mut mod_attachments = curseforge_mod.attachments; mod_attachments.retain(|x| x.isDefault); @@ -273,9 +284,10 @@ pub async fn index_mods(conn : PgConnection) { page_url: curseforge_mod.websiteUrl, icon_url: (mod_attachments[0].url).to_string(), author_url: (&curseforge_mod.authors[0].url).to_string(), + date_created: curseforge_mod.dateCreated.chars().take(10).collect(), date_modified: curseforge_mod.dateModified.chars().take(10).collect(), latest_version: latest_version, - empty: String::from("pdsaojdakdka") + empty: String::from("{}{}{}") }) } @@ -305,6 +317,7 @@ pub async fn index_mods(conn : PgConnection) { "page_url".to_string(), "icon_url".to_string(), "author_url".to_string(), + "date_created".to_string(), "date_modified".to_string(), "latest_version".to_string(), "empty".to_string(), diff --git a/static/css/search.css b/static/css/search.css index 05e1c2a4d..e675b5e88 100644 --- a/static/css/search.css +++ b/static/css/search.css @@ -299,4 +299,39 @@ .misc-badge { color: white; background-color: deepskyblue; +} + +.storage-badge { + color: wheat; + background-color: #e1a15a; +} + + +.food-badge { + color: white; + background-color: royalblue; +} + +.equipment-badge { + color: white; + background-color: black; +} + +.forge { + padding-top: 5px !important; +} + +.back-to-top { + position: fixed; + top: 80%; + left: 19%; + background-color: #0b75d8; + text-align: center; + padding: 20px; + display: none; +} + +.back-to-top img { + width: 50px; + height: 50px; } \ No newline at end of file diff --git a/static/images/icon/equipment.svg b/static/images/icon/equipment.svg new file mode 100644 index 000000000..50e2d08cf --- /dev/null +++ b/static/images/icon/equipment.svg @@ -0,0 +1,52 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/static/images/icon/food.svg b/static/images/icon/food.svg new file mode 100644 index 000000000..4a04a0ae1 --- /dev/null +++ b/static/images/icon/food.svg @@ -0,0 +1,48 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/static/images/icon/forge-alt.svg b/static/images/icon/forge-alt.svg new file mode 100644 index 000000000..6a15d2104 --- /dev/null +++ b/static/images/icon/forge-alt.svg @@ -0,0 +1,14 @@ + + + + + + + diff --git a/static/images/icon/forge.jpg b/static/images/icon/forge.jpg deleted file mode 100644 index 749dba107d601a6ba0f1d94a664b17cdaf3bf7a8..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 5557 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 Io{RqeACYPi3IG5A diff --git a/static/images/icon/forge.svg b/static/images/icon/forge.svg new file mode 100644 index 000000000..4f7f0495a --- /dev/null +++ b/static/images/icon/forge.svg @@ -0,0 +1,14 @@ + + + + + + + diff --git a/static/images/icon/storage.svg b/static/images/icon/storage.svg new file mode 100644 index 000000000..84c389807 --- /dev/null +++ b/static/images/icon/storage.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/icon/up.svg b/static/images/icon/up.svg new file mode 100644 index 000000000..f844e566f --- /dev/null +++ b/static/images/icon/up.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/static/js/search.js b/static/js/search.js index 1d97e1369..b83cdef60 100644 --- a/static/js/search.js +++ b/static/js/search.js @@ -9,6 +9,9 @@ let category_inputs = { "library": false, "worldgen": false, "cursed": false, + "storage": false, + "food": false, + "equipment": false, "misc": false, "forge": false, "fabric": false, @@ -93,7 +96,7 @@ function clearFilters() { } } - handleSearch(); + handleSearch(0); } function toggleVisibility(e) { @@ -124,7 +127,7 @@ function activateCategory(element) { document.getElementById(element.id + "-ghost").className = "category-ghost"; } - handleSearch(); + handleSearch(0); } function activateVersion(element) { @@ -138,16 +141,42 @@ function activateVersion(element) { element.style.boxShadow = "0 0"; } - handleSearch(); + handleSearch(0); } -function handleSearch() { +let body = document.documentElement; +let backToTop = document.getElementById("backToTop"); + +let currentlyLoadingExtra = false; +let currentOffset = 0; + +function loadExtra() { + console.log(body.scrollTop) + if (body.scrollTop > 400) { + backToTop.style.display = "block"; + } else { + backToTop.style.display = "none"; + } + + + if(!currentlyLoadingExtra) { + let scrollOffset = (body.scrollTop) / (body.scrollHeight - body.clientHeight); + + if(scrollOffset > 0.9) { + currentOffset += 10; + handleSearch(currentOffset); + currentlyLoadingExtra = true; + } + } +} + +function handleSearch(index) { let queryString = "search"; if(input.value.length > 0) { queryString += "?q=" + encodeURIComponent(input.value).replace(/%20/g,'+'); } else { - queryString += "?q=pdsaojdakdka" + queryString += "?q={}{}{}" } let filterString = ""; @@ -182,16 +211,30 @@ function handleSearch() { queryString += "&v=" + encodeURIComponent( "versions=" + versionString).replace(/%20/g,'+'); } + if(index === 0) + window.history.pushState('Search', 'Search', queryString); + else + queryString += "&o=" + index; + + console.log(queryString); + let xmlHttp = new XMLHttpRequest(); xmlHttp.onreadystatechange = function() { if (xmlHttp.readyState === 4 && xmlHttp.status === 200) { - resultContainer.innerHTML = xmlHttp.responseText; + if(index === 0) { + resultContainer.innerHTML = xmlHttp.responseText; + + currentOffset = 0; + currentlyLoadingExtra = false; + } + else { + resultContainer.innerHTML += xmlHttp.responseText; + currentlyLoadingExtra = false; + } } } xmlHttp.open("POST", queryString, true); xmlHttp.send(null); - - window.history.pushState('Search', 'Search', queryString); } \ No newline at end of file diff --git a/templates/search.hbs b/templates/search.hbs index 3c2afd28e..f5747dfc6 100644 --- a/templates/search.hbs +++ b/templates/search.hbs @@ -12,7 +12,7 @@ Search - + + + up + +