Bommels05/Modrinth
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Search filters

Browse Source
This commit is contained in:
Jai A 2020-05-12 22:27:31 -07:00
parent a738998c2c
commit e0308a11c9
15 changed files with 493 additions and 96 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
.idea/inspectionProfiles/Project_Default.xml generated
View File

@ -1,6 +1,16 @@
<component name="InspectionProjectProfileManager">
<profile version="1.0">
<option name="myName" value="Project Default" />
<inspection_tool class="HtmlUnknownAttribute" enabled="true" level="WARNING" enabled_by_default="true">
<option name="myValues">
<value>
<list size="1">
<item index="0" class="java.lang.String" itemvalue="white" />
</list>
</value>
</option>
<option name="myCustomValuesEnabled" value="true" />
</inspection_tool>
<inspection_tool class="HtmlUnknownTag" enabled="true" level="WARNING" enabled_by_default="true">
<option name="myValues">
<value>

20
src/main.rs
View File

@ -13,7 +13,7 @@ struct ContainsHelper;
impl HelperDef for ContainsHelper {
fn call<'reg: 'rc, 'rc>(&self, h: &Helper<'reg, 'rc>, r: &'reg Handlebars<'_>, ctx: &'rc Context, rc: &mut RenderContext<'reg, 'rc>, out: &mut dyn Output) -> HelperResult {
let array = h.param(0).map(|v| serde_json::from_value::<Vec<String>>(v.value().clone()).unwrap()).ok_or(RenderError::new("Parameter not found!"))?;
let mut value = h.param(1).map(|v| v.value().as_str().unwrap()).ok_or(RenderError::new("Parameter not found!"))?;
let value = h.param(1).map(|v| v.value().as_str().unwrap()).ok_or(RenderError::new("Parameter not found!"))?;
let tmpl = if array.contains(&String::from(value)) { h.template() } else { h.inverse() };
@ -48,14 +48,16 @@ pub struct SearchRequest {
}
#[post("search")]
async fn search_post(web::Query(info): web::Query<SearchRequest>) -> HttpResponse {
async fn search_post(web::Query(info): web::Query<SearchRequest>, hb: Data<Handlebars<'_>>) -> HttpResponse {
let results = search(web::Query(info));
let data = json!({
"results": results,
});
HttpResponse::Ok().body(data)
let body = hb.render("search_results", &data).unwrap();
HttpResponse::Ok().body(body)
}
#[get("search")]
@ -126,25 +128,25 @@ async fn main() -> std::io::Result<()> {
mod_id: 0,
title: String::from("Magic Mod"),
description: String::from("An illustrious magic mod for magical wizards"),
keywords: vec![String::from("Fabric"), String::from("Magic")],
keywords: vec![String::from("fabric"), String::from("magic"), String::from("library")],
},
Mod {
mod_id: 1,
title: String::from("Tech Mod"),
description: String::from("An technological mod for complete NERDS"),
keywords: vec![String::from("Fabric"), String::from("Utility"), String::from("Technology")],
keywords: vec![String::from("fabric"), String::from("utility"), String::from("technology")],
},
Mod {
mod_id: 2,
title: String::from("Hood Mod"),
description: String::from("A hood mod to roleplay as if you were a real street person. Some adventure stuff too"),
keywords: vec![String::from("Forge"), String::from("Adventure"), String::from("Technology")]
title: String::from("Gamer Mod"),
description: String::from("A gamer mod to roleplay as if you were an epic gamer person."),
keywords: vec![String::from("cursed"), String::from("adventure"), String::from("forge")]
},
Mod {
mod_id: 3,
title: String::from("Adventure Mod"),
description: String::from("An epic gamer adventure mod for epic adventure gamers"),
keywords: vec![String::from("Forge"), String::from("Magic"), String::from("Adventure")]
keywords: vec![String::from("decoration"), String::from("utility"), String::from("worldgen")]
},
], Some("mod_id")).unwrap();

18
static/css/main.css
View File

@ -3,6 +3,16 @@
body {
margin: 0;
font-family: 'Montserrat', sans-serif;
background-color: #f3f2f0;
}
.main-flex {
display: flex;
flex-direction: row;
}
.muted {
color: gray;
}
.temp-circle-logo {
@ -15,8 +25,10 @@ body {
}
.site-header {
z-index: 2;
position: sticky;
background-color: black;
top: 0;
width: 100%;
height: 75px;
margin-bottom: 10px;
@ -45,5 +57,9 @@ body {
}
.gray-border {
border: 1px solid darkgray;
border: 1px solid #a9a9a9;
}
.green {
color: #69E781;
}

115
static/css/search.css
View File

@ -1,31 +1,102 @@
.search-container {
width: 100%;
.column {
display: flex;
align-content: center;
flex-direction: column;
width: 50%;
}
.categories-flex {
position: sticky;
width: 25%;
}
.categories {
position: relative;
top: 100px;
padding: 5px;
}
.categories-label {
color: white;
background-color: black;
padding-left: 10px;
}
.category-badge {
display: flex;
flex-direction: row;
align-items: center;
height: 25px;
padding: 2px 5px;
cursor: pointer;
width: 165px;
margin-left: auto;
margin-right: 20px;
-webkit-touch-callout: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.category-badge img {
height: 23px;
}
.category-badge p {
margin: 0 auto;
font-weight: bolder;
text-transform: capitalize;
}
.category-ghost {
margin-left: 10px;
}
.search-bar {
margin: 0 auto;
width: 56.25%;
position: -webkit-sticky !important;
position: sticky !important;
height: 2em;
margin-top: 30px;
margin-bottom: 15px;
top: 80px;
width: 100%;
}
.mod-info {
padding-top: 5px !important;
display: flex;
flex-direction: row;
align-items: center;
}
.mod-info img {
height: 12px;
padding: 0;
}
.mod-info p {
font-size: 12px;
padding: 0 15px 0 5px !important;
}
.results {
width: 75%;
width: 100%;
margin: auto;
}
.result {
display: flex;
height: 100px;
margin: 30px auto;
margin: 15px auto;
padding: 5px;
width: 75%;
width: 100%;
flex-direction: row;
align-items: center;
background-color: white;
}
.result img {
.result-image {
padding: 0 10px 0 5px;
}
@ -39,6 +110,12 @@
margin: 0;
}
.result-title {
display: flex;
flex-direction: row;
align-items: baseline;
}
.result-badges {
margin: 0 1em 20px auto;
align-self: center;
@ -64,6 +141,7 @@
.result-badge p {
margin: 0 auto;
font-weight: bolder;
text-transform: capitalize;
}
.download-badge {
@ -100,3 +178,22 @@
color: white;
background-color: orangered;
}
.decoration-badge {
color: white;
background-color: #2f92d8;
}
.world-badge {
background-color: yellow;
}
.library-badge {
color: white;
background-color: orange;
}
.cursed-badge {
color: white;
background-color: palevioletred;
}

BIN
static/images/icon/cursed.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.3 KiB

67
static/images/icon/decoration.svg Normal file
View File

@ -0,0 +1,67 @@
<?xml version="1.0" encoding="iso-8859-1"?>
<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
<path style="fill:#80C56E;" d="M408.906,45.536c2.263,6.186,27.401,79.804-24.155,166.617
c-31.315,52.729-78.861,56.218-83.517,56.434c-2.727-3.781-29.57-43.179-7.763-100.497
C329.376,73.721,402.655,47.612,408.906,45.536z"/>
<path style="fill:#66AD66;" d="M408.906,45.536L301.234,268.587l0,0c4.657-0.217,52.202-3.705,83.517-56.434
C436.308,125.34,411.169,51.722,408.906,45.536z"/>
<path style="fill:#FFFFFF;stroke:#000000;stroke-width:15;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" d="
M297.907,275.479l3.327-6.892c-0.07-0.098-0.16-0.225-0.262-0.369C298.914,273.026,297.907,275.479,297.907,275.479z"/>
<path style="fill:#80C56E;" d="M103.094,45.536c-2.263,6.186-27.401,79.804,24.155,166.617
c31.315,52.729,78.861,56.218,83.517,56.434c2.727-3.781,29.57-43.179,7.762-100.497C182.624,73.721,109.345,47.612,103.094,45.536z
"/>
<path style="fill:#66AD66;" d="M218.528,168.09C182.624,73.721,109.345,47.612,103.094,45.536
c63.67,121.61,98.013,199.506,107.934,222.682C214.849,262.756,239.774,223.93,218.528,168.09z"/>
<path style="fill:#80C56E;" d="M256,0c-7.676,7.449-96.408,97.362-82.296,260.712c8.571,99.218,75.639,137.883,82.296,141.487
c6.657-3.604,73.725-42.27,82.296-141.487C352.408,97.362,263.676,7.449,256,0z"/>
<path style="fill:#66AD66;" d="M256,0v402.199c6.657-3.604,73.725-42.27,82.296-141.487C352.408,97.362,263.676,7.449,256,0z"/>
<path style="fill:#80C56E;" d="M445.966,250.043c16.695-57.379,11.044-110.709,11.044-110.709s-32.151,14.322-112.949,66.535
C281.256,246.454,261.824,317.612,256,336.79h73.813C383.468,336.79,430.976,301.562,445.966,250.043z"/>
<path style="fill:#66AD66;" d="M457.011,139.333c0,0-83.039,164.043-201.011,197.457h73.813c53.656,0,101.163-35.228,116.154-86.747
C462.661,192.664,457.011,139.333,457.011,139.333z"/>
<path style="fill:#80C56E;" d="M66.034,250.043C49.339,192.664,54.99,139.334,54.99,139.334s32.151,14.322,112.949,66.535
C230.744,246.454,250.176,317.612,256,336.79h-73.813C128.532,336.79,81.024,301.562,66.034,250.043z"/>
<path style="fill:#66AD66;" d="M256,336.79c-5.824-19.178-25.256-90.336-88.061-130.922c-80.799-52.213-112.95-66.535-112.95-66.535
S138.028,303.377,256,336.79z"/>
<path style="fill:#FEC37D;" d="M309.376,512H202.624c-28.315,0-52.604-20.189-57.781-48.027l-22.887-123.072h268.089
l-22.887,123.072C361.98,491.811,337.691,512,309.376,512z"/>
<path style="fill:#F9AE5D;" d="M338.192,340.902l-22.887,123.072C310.128,491.811,285.838,512,257.523,512h51.853
c28.315,0,52.604-20.189,57.781-48.027l22.887-123.072h-51.852V340.902z"/>
<path style="fill:#F2A559;" d="M394.718,368.559H117.282c-11.242,0-20.356-9.114-20.356-20.356l0,0
c0-11.242,9.114-20.356,20.356-20.356h277.437c11.242,0,20.356,9.114,20.356,20.356l0,0
C415.074,359.445,405.961,368.559,394.718,368.559z"/>
<path style="fill:#EA8F3D;" d="M394.718,327.846h-32.614v40.712h32.614c11.242,0,20.356-9.114,20.356-20.356l0,0
C415.075,336.96,405.961,327.846,394.718,327.846z"/>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.4 KiB

2
static/images/icon/download.svg
View File

@ -1,2 +1,2 @@
<?xml version="1.0"?>
<svg xmlns="http://www.w3.org/2000/svg" height="512px" viewBox="0 0 512 512" width="512px"><g><path d="m256 362.667969c-8.832031 0-16-7.167969-16-16v-330.667969c0-8.832031 7.167969-16 16-16s16 7.167969 16 16v330.667969c0 8.832031-7.167969 16-16 16zm0 0" data-original="#000000" class="active-path" data-old_color="#000000" fill="#FFFFFF"/><path d="m256 362.667969c-4.097656 0-8.191406-1.558594-11.308594-4.695313l-85.332031-85.332031c-6.25-6.25-6.25-16.382813 0-22.636719 6.25-6.25 16.382813-6.25 22.636719 0l74.023437 74.027344 74.027344-74.027344c6.25-6.25 16.386719-6.25 22.636719 0 6.25 6.253906 6.25 16.386719 0 22.636719l-85.335938 85.332031c-3.15625 3.136719-7.25 4.695313-11.347656 4.695313zm0 0" data-original="#000000" class="active-path" data-old_color="#000000" fill="#FFFFFF"/><path d="m453.332031 512h-394.664062c-32.363281 0-58.667969-26.304688-58.667969-58.667969v-96c0-8.832031 7.167969-16 16-16s16 7.167969 16 16v96c0 14.699219 11.96875 26.667969 26.667969 26.667969h394.664062c14.699219 0 26.667969-11.96875 26.667969-26.667969v-96c0-8.832031 7.167969-16 16-16s16 7.167969 16 16v96c0 32.363281-26.304688 58.667969-58.667969 58.667969zm0 0" data-original="#000000" class="active-path" data-old_color="#000000" fill="#FFFFFF"/></g> </svg>
<svg xmlns="http://www.w3.org/2000/svg" height="512px" viewBox="0 0 512 512" width="512px"><g><path d="m256 362.667969c-8.832031 0-16-7.167969-16-16v-330.667969c0-8.832031 7.167969-16 16-16s16 7.167969 16 16v330.667969c0 8.832031-7.167969 16-16 16zm0 0" data-original="#000000" class="active-path" data-old_color="#000000" fill="#69E781"/><path d="m256 362.667969c-4.097656 0-8.191406-1.558594-11.308594-4.695313l-85.332031-85.332031c-6.25-6.25-6.25-16.382813 0-22.636719 6.25-6.25 16.382813-6.25 22.636719 0l74.023437 74.027344 74.027344-74.027344c6.25-6.25 16.386719-6.25 22.636719 0 6.25 6.253906 6.25 16.386719 0 22.636719l-85.335938 85.332031c-3.15625 3.136719-7.25 4.695313-11.347656 4.695313zm0 0" data-original="#000000" class="active-path" data-old_color="#000000" fill="#69E781"/><path d="m453.332031 512h-394.664062c-32.363281 0-58.667969-26.304688-58.667969-58.667969v-96c0-8.832031 7.167969-16 16-16s16 7.167969 16 16v96c0 14.699219 11.96875 26.667969 26.667969 26.667969h394.664062c14.699219 0 26.667969-11.96875 26.667969-26.667969v-96c0-8.832031 7.167969-16 16-16s16 7.167969 16 16v96c0 32.363281-26.304688 58.667969-58.667969 58.667969zm0 0" data-original="#000000" class="active-path" data-old_color="#000000" fill="#69E781"/></g> </svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.2 KiB

After

Width:  |  Height:  |  Size: 1.2 KiB

1
static/images/icon/library.svg Normal file
View File

@ -0,0 +1 @@
<svg height="512" viewBox="0 0 58 58" width="512" xmlns="http://www.w3.org/2000/svg"><g id="Page-1" fill="none" fill-rule="evenodd"><g id="030---Messy-Books" fill-rule="nonzero"><path id="Shape" d="m5.72 52.21-5.55-31.51c-.05359011-.3041252-.08699643-.6114633-.1-.92-.08248096-3.5724087 2.48267266-6.6582757 6.01-7.23l10.71-1.89-.29 41.55z" fill="#35495e"/><path id="Shape" d="m46.94 50.83c-.1857191.771023-.8094746 1.3594717-1.59 1.5l-31.52 5.56c-1.9867206.3468301-4.02657856-.1786842-5.59841615-1.4422808-1.57183758-1.2635966-2.52340318-3.1428808-2.61158385-5.1577192-.07876599-3.4155632 2.27277316-6.4084312 5.61-7.14l8.83 2.48h-.01l-7.95 1.41c-.8866555.1558432-1.656734.7009972-2.0983662 1.4854753-.44163213.7844782-.50828985 1.7256321-.1816338 2.5645247.5656214 1.3511449 2.0021594 2.1195258 3.44 1.84l24.09-4.25z" fill="#2c3e50"/><path id="Shape" d="m20.05 46.63-7.95 1.41c-.8866555.1558432-1.656734.7009972-2.0983662 1.4854753-.44163213.7844782-.50828985 1.7256321-.1816338 2.5645247.5656214 1.3511449 2.0021594 2.1195258 3.44 1.84l24.09-4.25z" fill="#f9eab0"/><path id="Shape" d="m12.826 33.171 5.557-31.514c.1989194-1.08324679 1.2310871-1.80580869 2.317-1.622l31.277 5.515c3.5298611.57216709 6.0970156 3.66000793 6.015 7.235-.0136036.3071659-.0470063.6131344-.1.916l-5.557 31.514z" fill="#e64c3c"/><path id="Shape" d="m45.438 10.474c-.0586532-.0000276-.1171977-.0050457-.175-.015l-22.651-3.994c-.5111685-.12606546-.837041-.62687769-.7452297-1.14529488.0918113-.5184172.5698565-.87685619 1.0932297-.81970512l22.65 3.989c.5108329.08948831.8684834.55465053.8237134 1.07132656-.0447699.51667604-.4771014.91338644-.9957134.91367344z" fill="#3f5c6c"/><path id="Shape" d="m40.63 14.7c-.0587024.0000849-.1172863-.0052713-.175-.016l-14.772-2.601c-.5314773-.1077828-.8801906-.6195404-.7860712-1.1536068.0941194-.5340663.5967671-.8957872 1.1330712-.8153932l14.773 2.6c.5138125.0868279.8748237.55367.8296023 1.0728015-.0452214.5191314-.4815156.9165204-1.0026023.9131985z" fill="#3f5c6c"/><rect id="Rectangle-path" fill="#ecf0f1" height="12" rx="1" transform="matrix(.985 .174 -.174 .985 4.511 -5.088)" width="23" x="19.833" y="17.234"/><path id="Shape" d="m57.99 12.78c-.0119064.3086184-.0453208.6160308-.1.92l-5.56 31.51-7.71-2.35 4.47-25.34 1.06-5.98 1.08-6.12.75.13c3.5257169.57454224 6.0894162 3.6586597 6.01 7.23z" fill="#c03a2b"/><path id="Shape" d="m46.42 37.06-31.28-5.51c-.1156046-.0199087-.2326936-.0299449-.35-.03-1.0364668.0026285-1.8991916.7966438-1.9876335 1.8293337-.088442 1.0326898.6267071 1.9618379 1.6476335 2.1406663l31.51 5.55c.8858791.1604248 1.6536061.708589 2.0929592 1.4943923.439353.7858033.5042941 1.7269044.1770408 2.5656077-.5625614 1.3481553-1.9969395 2.1134358-3.43 1.83l-31.39-5.53c-.1156046-.0199087-.2326936-.0299449-.35-.03-1.0383851-.0025575-1.9060067.7899765-1.9971986 1.8243528-.0911918 1.0343762.624383 1.9664868 1.6471986 2.1456472l31.52 5.55c1.9852737.3480364 4.0242759-.1756778 5.5960992-1.4373484 1.5718232-1.2616705 2.5242277-3.1390976 2.6139008-5.1526516.0784876-3.576507-2.4892143-6.6645738-6.02-7.24z" fill="#802f34"/><path id="Shape" d="m48.23 45.1c-.5625614 1.3481553-1.9969395 2.1134358-3.43 1.83l-31.39-5.53 1.04-5.91 31.51 5.55c.8858791.1604248 1.6536061.708589 2.0929592 1.4943923.439353.7858033.5042941 1.7269044.1770408 2.5656077z" fill="#f9eab0"/></g></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.2 KiB

18
static/images/icon/search.svg Normal file
View File

@ -0,0 +1,18 @@
<?xml version="1.0"?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve" width="512px" height="512px"><g><g>
<g>
<path d="M310,190c-5.52,0-10,4.48-10,10s4.48,10,10,10c5.52,0,10-4.48,10-10S315.52,190,310,190z" data-original="#000000" class="active-path" data-old_color="#000000" fill="#E3E9ED"/>
</g>
</g><g>
<g>
<path d="M500.281,443.719l-133.48-133.48C388.546,277.485,400,239.555,400,200C400,89.72,310.28,0,200,0S0,89.72,0,200 s89.72,200,200,200c39.556,0,77.486-11.455,110.239-33.198l36.895,36.895c0.005,0.005,0.01,0.01,0.016,0.016l96.568,96.568 C451.276,507.838,461.319,512,472,512c10.681,0,20.724-4.162,28.278-11.716C507.837,492.731,512,482.687,512,472 S507.837,451.269,500.281,443.719z M305.536,345.727c0,0.001-0.001,0.001-0.002,0.002C274.667,368.149,238.175,380,200,380 c-99.252,0-180-80.748-180-180S100.748,20,200,20s180,80.748,180,180c0,38.175-11.851,74.667-34.272,105.535 C334.511,320.988,320.989,334.511,305.536,345.727z M326.516,354.793c10.35-8.467,19.811-17.928,28.277-28.277l28.371,28.371 c-8.628,10.183-18.094,19.65-28.277,28.277L326.516,354.793z M486.139,486.139c-3.78,3.78-8.801,5.861-14.139,5.861 s-10.359-2.081-14.139-5.861l-88.795-88.795c10.127-8.691,19.587-18.15,28.277-28.277l88.798,88.798 C489.919,461.639,492,466.658,492,472C492,477.342,489.919,482.361,486.139,486.139z" data-original="#000000" class="active-path" data-old_color="#000000" fill="#E3E9ED"/>
</g>
</g><g>
<g>
<path d="M200,40c-88.225,0-160,71.775-160,160s71.775,160,160,160s160-71.775,160-160S288.225,40,200,40z M200,340 c-77.196,0-140-62.804-140-140S122.804,60,200,60s140,62.804,140,140S277.196,340,200,340z" data-original="#000000" class="active-path" data-old_color="#000000" fill="#E3E9ED"/>
</g>
</g><g>
<g>
<path d="M312.065,157.073c-8.611-22.412-23.604-41.574-43.36-55.413C248.479,87.49,224.721,80,200,80c-5.522,0-10,4.478-10,10 c0,5.522,4.478,10,10,10c41.099,0,78.631,25.818,93.396,64.247c1.528,3.976,5.317,6.416,9.337,6.416 c1.192,0,2.405-0.215,3.584-0.668C311.472,168.014,314.046,162.229,312.065,157.073z" data-original="#000000" class="active-path" data-old_color="#000000" fill="#E3E9ED"/>
</g>
</g></g> </svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.3 KiB

1
static/images/icon/updated.svg Normal file
View File

@ -0,0 +1 @@
<svg id="Capa_1" enable-background="new 0 0 512 512" height="512" viewBox="0 0 512 512" width="512" xmlns="http://www.w3.org/2000/svg"><g><circle cx="256" cy="256" fill="#fe8205" r="256"/><path d="m512 256c0-140.61-115.39-256-256-256v512c140.61 0 256-115.39 256-256z" fill="#fa5d0f"/><path d="m256 61c-107.52 0-195 87.48-195 195s87.48 196 195 196 195-88.48 195-196-87.48-195-195-195z" fill="#f0f7ff"/><path d="m451 256c0-107.52-87.48-195-195-195v391c107.52 0 195-88.48 195-196z" fill="#dfe7f4"/><path d="m256 121c-8.291 0-15 6.709-15 15v150c0 8.291 6.709 15 15 15s15-6.709 15-15v-150c0-8.291-6.709-15-15-15z" fill="#575f64"/><path d="m271 286v-150c0-8.291-6.709-15-15-15v180c8.291 0 15-6.709 15-15z" fill="#474f54"/><path d="m346 241h-90-30c-8.291 0-15 6.709-15 15s6.709 15 15 15h30 90c8.291 0 15-6.709 15-15s-6.709-15-15-15z" fill="#575f64"/><path d="m361 256c0-8.291-6.709-15-15-15h-90v30h90c8.291 0 15-6.709 15-15z" fill="#474f54"/></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 945 B

51
static/images/icon/version.svg Normal file
View File

@ -0,0 +1,51 @@
<?xml version="1.0" encoding="iso-8859-1"?>
<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 408.425 408.425" style="enable-background:new 0 0 408.425 408.425;" xml:space="preserve">
<path style="fill:#ED664C;" d="M55.737,55.725c3.7-3.7,8.7-6,14.3-6.1l131.1-3.4c8.6-0.2,16.9,3.1,23,9.2l165.2,165.2
c12.3,12.3,12.3,32.2,0,44.5l-124.2,124.2c-12.3,12.3-32.2,12.3-44.5,0l-165.2-165.2c-6.1-6.1-9.4-14.4-9.2-23l3.4-131.1
C49.737,64.425,52.038,59.325,55.737,55.725z M236.938,339.525l102.7-102.7l-89-89l-102.7,102.7L236.938,339.525z M170.538,135.225
c0-19.5-15.8-35.4-35.4-35.4s-35.4,15.9-35.4,35.4s15.9,35.4,35.4,35.4S170.538,154.725,170.538,135.225z"/>
<polygon style="fill:#FDC75B;" points="339.537,236.925 236.938,339.525 147.938,250.525 250.537,147.925 "/>
<path d="M231.137,48.325c-8-8-19-12.4-30.3-12.1l-131,3.4c-4.6,0.1-8.9,1.2-12.9,3.1l-39.9-39.8c-3.9-3.9-10.2-3.9-14.1,0
s-3.9,10.2,0,14.1l39.8,39.8c-1.9,4-3,8.4-3.1,12.9l-3.4,131.1c-0.3,11.3,4.1,22.3,12.1,30.3l165.2,165.2
c8.1,8.1,18.7,12.1,29.3,12.1c10.6,0,21.2-4,29.3-12.1l124.2-124.2l0,0c16.1-16.2,16.1-42.5,0-58.6L231.137,48.325z
M382.237,258.025l-124.2,124.2c-8.4,8.4-22,8.4-30.3,0l-165.2-165.2c-4.1-4.1-6.4-9.8-6.2-15.7l3.3-127.7l37.3,37.3
c-4.4,7-7,15.3-7,24.2c0,25,20.4,45.4,45.4,45.4s45.4-20.3,45.4-45.4c0-25-20.3-45.4-45.4-45.4c-8.9,0-17.2,2.6-24.2,7l-37.3-37.3
l127.7-3.3c0.2,0,0.3,0,0.5,0c5.7,0,11.2,2.3,15.2,6.2l165,165.4C390.537,236.025,390.537,249.625,382.237,258.025z
M109.838,135.225c0-14,11.4-25.4,25.4-25.4s25.4,11.4,25.4,25.4s-11.4,25.4-25.4,25.4
C121.238,160.525,109.838,149.225,109.838,135.225z"/>
<path d="M257.637,140.825c-3.9-3.9-10.2-3.9-14.1,0l-102.7,102.6c-3.9,3.9-3.9,10.2,0,14.1l89,88.9c1.9,1.9,4.4,2.8,7.1,2.8l0,0
c2.7,0,5.2-0.9,7.1-2.8l102.7-102.6c1.9-1.9,2.9-4.4,2.9-7s-1.1-5.2-2.9-7L257.637,140.825z M236.938,325.425l-74.8-74.9l88.5-88.5
l74.9,74.8L236.938,325.425z"/>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.2 KiB

1
static/images/icon/world.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 8.3 KiB

85
static/js/search.js
View File

@ -1,32 +1,81 @@
let input = document.getElementById("search-input");
let category_inputs = {
"technology": false,
"adventure": false,
"magic": false,
"utility": false,
"decoration": false,
"library": false,
"worldgen": false,
"cursed": false,
"forge": false,
"fabric": false,
}
let resultContainer = document.getElementById("results");
window.onload = function () {
let categories = document.getElementsByClassName("category-badge");
for (let category of categories) {
let ghost = document.createElement('div');
ghost.className = "category-ghost";
ghost.id = category.id + "-ghost";
category.appendChild(ghost);
}
}
function activateCategory(element) {
category_inputs[element.id] = !category_inputs[element.id]
if (category_inputs[element.id]) {
element.style.width = "155px";
element.style.boxShadow = "10px 0 " + element.style.color;
document.getElementById(element.id + "-ghost").className = "";
} else {
element.style.width = "165px";
element.style.boxShadow = "0 0";
document.getElementById(element.id + "-ghost").className = "category-ghost";
}
handleSearch();
}
function handleSearch() {
let safeName = encodeURIComponent(input.value).replace(/%20/g,'+');
let queryString = "search?q=" + safeName;
let filterString = "";
for (let key in category_inputs) {
if (category_inputs.hasOwnProperty(key)) {
if(category_inputs[key])
filterString += key + " AND keywords=";
}
}
let takeOffLength = " AND keywords=".length;
if(filterString.length > takeOffLength) {
filterString = filterString.substring(0, filterString.length - takeOffLength)
queryString += "&f=" + encodeURIComponent( "keywords=" + filterString).replace(/%20/g,'+');
}
let xmlHttp = new XMLHttpRequest();
xmlHttp.onreadystatechange = function() {
if (xmlHttp.readyState === 4 && xmlHttp.status === 200) {
let parsedResponse = JSON.parse(xmlHttp.responseText);
let contentToSet = "";
for (let result of parsedResponse.results) {
contentToSet += `
<div class="result gray-border rounded-border">
<img src="..." width="75px" height="75px">
<div class="result-info">
<h2>${result.title}</h2>
<p>${result.description}</p>
</div>
</div>
`
resultContainer.innerHTML = xmlHttp.responseText;
}
}
resultContainer.innerHTML = contentToSet;
}
}
xmlHttp.open("POST", "search?q=" + safeName, true);
xmlHttp.open("POST", queryString, true);
xmlHttp.send(null);
window.history.pushState('Search', 'Search', '/search?q=' + safeName);
window.history.pushState('Search', 'Search', queryString);
}

104
templates/search.hbs
View File

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
@ -25,68 +25,68 @@
</div>
</header>
<div class="search-container">
<div class="filters">
<label>
<input type="checkbox">
</label>
<div class="main-flex">
<div class="categories-flex">
<div class="categories">
<a class="categories-label category-badge category-active">
<p>CATEGORIES</p>
</a>
<a class="tech-badge category-badge category-active" id="technology" onclick="activateCategory(this)">
<img alt="tech" src="static/images/icon/tech.svg" class="result-image"/>
<p>TECH</p>
</a>
<a class="adventure-badge category-badge" id="adventure" onclick="activateCategory(this)">
<img alt="adventure" src="static/images/icon/adventure.svg" class="result-image"/>
<p>ADVENTURE</p>
</a>
<a class="magic-badge category-badge" id="magic" onclick="activateCategory(this)">
<img alt="magic" src="static/images/icon/magic.svg" class="result-image"/>
<p>MAGIC</p>
</a>
<a class="utility-badge category-badge" id="utility" onclick="activateCategory(this)">
<img alt="util" src="static/images/icon/util.svg" class="result-image"/>
<p>UTILITY</p>
</a>
<a class="decoration-badge category-badge" id="decoration" onclick="activateCategory(this)">
<img alt="decoration" src="static/images/icon/decoration.svg" class="result-image"/>
<p>DECORATION</p>
</a>
<a class="library-badge category-badge" id="library" onclick="activateCategory(this)">
<img alt="library" src="static/images/icon/library.svg" class="result-image"/>
<p>LIBRARY</p>
</a>
<a class="world-badge category-badge" id="world" onclick="activateCategory(this)">
<img alt="world" src="static/images/icon/world.svg" class="result-image"/>
<p>WORLDGEN</p>
</a>
<a class="cursed-badge category-badge" id="cursed" onclick="activateCategory(this)">
<img alt="cursed" src="static/images/icon/cursed.png" class="result-image"/>
<p>CURSED</p>
</a>
<a class="forge-badge category-badge" id="forge" onclick="activateCategory(this)">
<img alt="forge" src="static/images/icon/forge.jpg" class="result-image"/>
<p>FORGE</p>
</a>
<a class="fabric-badge category-badge" id="fabric" onclick="activateCategory(this)">
<img alt="fabric" src="static/images/icon/fabric.png" class="result-image"/>
<p>FABRIC</p>
</a>
</div>
</div>
<div class="column">
<div class="search-div">
<input class="search-bar" type="text" id="search-input" placeholder="Search for mods..." oninput="handleSearch()">
</div>
<div id="results" class="results">
{{#each results}}
<div class="result gray-border rounded-border">
<img src="..." width="75px" height="75px">
<div class="result-info">
<h2>{{this.title}}</h2>
<p>{{this.description}}</p>
</div>
<div class="result-badges">
{{#contains this.keywords "Technology"}}
<div class="tech-badge result-badge">
<img alt="tech" src="static/images/icon/tech.svg">
<p>TECH</p>
</div>
{{/contains}}
{{#contains this.keywords "Adventure"}}
<div class="adventure-badge result-badge">
<img alt="adventure" src="static/images/icon/adventure.svg">
<p>ADVENTURE</p>
</div>
{{/contains}}
{{#contains this.keywords "Magic"}}
<div class="magic-badge result-badge">
<img alt="magic" src="static/images/icon/magic.svg">
<p>MAGIC</p>
</div>
{{/contains}}
{{#contains this.keywords "Utility"}}
<div class="utility-badge result-badge">
<img alt="util" src="static/images/icon/util.svg">
<p>UTILITY</p>
</div>
{{/contains}}
{{#contains this.keywords "Forge"}}
<div class="forge-badge result-badge">
<img alt="forge" src="static/images/icon/forge.jpg">
<p>FORGE</p>
</div>
{{/contains}}
{{#contains this.keywords "Fabric"}}
<div class="fabric-badge result-badge">
<img alt="fabric" src="static/images/icon/fabric.png">
<p>FABRIC</p>
</div>
{{/contains}}
{{> search_results}}
</div>
</div>
{{/each}}
</div>
<script src="static/js/search.js"></script>
</body>
</html>

84
templates/search_results.hbs Normal file
View File

@ -0,0 +1,84 @@
{{#each results}}
<div class="result gray-border rounded-border">
<img src="..." width="75px" height="75px" class="result-image"/>
<div class="result-info">
<div class="result-title">
<h2>{{this.title}}</h2>
<p class="muted"> by {{this.author}}</p>
</div>
<p>{{this.description}}</p>
<div class="mod-info">
<img src="static/images/icon/download.svg" alt="download" title="Downloads"/>
<p title="Downloads">1.1M</p>
<img src="static/images/icon/updated.svg" alt="updated" title="Last Updated"/>
<p title="Last Updated">5/13/20</p>
<img src="static/images/icon/version.svg" alt="version" title="Version"/>
<p title="Version">1.2.3</p>
</div>
</div>
<div class="result-badges">
{{#contains this.keywords "technology"}}
<div class="tech-badge result-badge">
<img alt="tech" src="static/images/icon/tech.svg" class="result-image"/>
<p>TECH</p>
</div>
{{/contains}}
{{#contains this.keywords "adventure"}}
<div class="adventure-badge result-badge">
<img alt="adventure" src="static/images/icon/adventure.svg" class="result-image"/>
<p>ADVENTURE</p>
</div>
{{/contains}}
{{#contains this.keywords "magic"}}
<div class="magic-badge result-badge">
<img alt="magic" src="static/images/icon/magic.svg" class="result-image"/>
<p>MAGIC</p>
</div>
{{/contains}}
{{#contains this.keywords "utility"}}
<div class="utility-badge result-badge">
<img alt="util" src="static/images/icon/util.svg" class="result-image"/>
<p>UTILITY</p>
</div>
{{/contains}}
{{#contains this.keywords "decoration"}}
<div class="decoration-badge result-badge">
<img alt="decoration" src="static/images/icon/decoration.svg" class="result-image"/>
<p>DECORATION</p>
</div>
{{/contains}}
{{#contains this.keywords "library"}}
<div class="library-badge result-badge">
<img alt="library" src="static/images/icon/library.svg" class="result-image"/>
<p>LIBRARY</p>
</div>
{{/contains}}
{{#contains this.keywords "worldgen"}}
<div class="world-badge result-badge">
<img alt="world" src="static/images/icon/world.svg" class="result-image"/>
<p>WORLDGEN</p>
</div>
{{/contains}}
{{#contains this.keywords "cursed"}}
<div class="cursed-badge result-badge">
<img alt="cursed" src="static/images/icon/cursed.png" class="result-image"/>
<p>CURSED</p>
</div>
{{/contains}}
{{#contains this.keywords "forge"}}
<div class="forge-badge result-badge">
<img alt="forge" src="static/images/icon/forge.jpg" class="result-image"/>
<p>FORGE</p>
</div>
{{/contains}}
{{#contains this.keywords "fabric"}}
<div class="fabric-badge result-badge">
<img alt="fabric" src="static/images/icon/fabric.png" class="result-image"/>
<p>FABRIC</p>
</div>
{{/contains}}
</div>
</div>
{{/each}}