enhance requests queries for posts; integrate backend with search

8 files changed, 70 insertions, 24 deletions

diff --git a/controllers/home.go b/controllers/home.go
index 9fd0d33..dfa5d13 100644
--- a/controllers/home.go
+++ b/controllers/home.go
@@ -9,5 +9,12 @@ import (
 
 func HomePageController(ctx *fiber.Ctx) error {
 	ctx.Locals("Title", config.PT_HOME)
-	return shortcuts.Render(ctx, config.TEMPLATE_HOME, nil)
+	queryRatings := map[string]bool{
+		"safe":         true,
+		"questionable": true,
+		"sensitive":    true,
+	}
+	return shortcuts.Render(ctx, config.TEMPLATE_HOME, fiber.Map{
+		"QueryRatings": queryRatings,
+	})
 }
diff --git a/controllers/posts.go b/controllers/posts.go
index 03535c7..c14d793 100644
--- a/controllers/posts.go
+++ b/controllers/posts.go
@@ -11,17 +11,40 @@ import (
 

 func PostsPageController(ctx *fiber.Ctx) error {

 	ctx.Locals("Title", config.PT_POST_LIST)

-	preferences := ctx.Locals("Preferences")

-	prefs, ok := preferences.(config.SitePreferences)

+	preferences, ok := ctx.Locals("Preferences").(config.SitePreferences)

 	if !ok {

 		return fiber.NewError(fiber.StatusInternalServerError, "Invalid preferences type")

 	}

 

-	posts, err := database.GetPosts(prefs.PostsPerPage)

+	request, ok := ctx.Locals("Request").(config.Request)

+	if !ok {

+		return fiber.NewError(fiber.StatusInternalServerError, "Invalid request type")

+	}

+

+	queryTags := ""

+	queryRatings := map[string]bool{}

+	for _, param := range request.Query {

+		switch param.Key {

+		case "tags":

+			queryTags = param.Value

+		case "rating":

+			queryRatings[param.Value] = true

+		}

+	}

+

+	if len(queryRatings) == 0 {

+		for _, rating := range []string{"safe", "questionable", "sensitive"} {

+			queryRatings[rating] = true

+		}

+	}

+

+	posts, err := database.GetPosts(preferences.PostsPerPage)

 

 	return shortcuts.Render(ctx, config.TEMPLATE_POST_LIST, fiber.Map{

-		"Posts": posts,

-		"Error": err,

+		"Posts":        posts,

+		"Error":        err,

+		"QueryTags":    queryTags,

+		"QueryRatings": queryRatings,

 	})

 }

 

diff --git a/processors/request.go b/processors/request.go
index 173b29d..a3ea20a 100644
--- a/processors/request.go
+++ b/processors/request.go
@@ -8,9 +8,10 @@ import (
 
 func RequestContextProcessor(ctx *fiber.Ctx) error {
 	queryParams := []config.QueryParam{}
-	for k, v := range ctx.Queries() {
-		queryParams = append(queryParams, config.QueryParam{Key: k, Value: v})
-	}
+	queryArgs := ctx.Request().URI().QueryArgs()
+	queryArgs.VisitAll(func(key, value []byte) {
+		queryParams = append(queryParams, config.QueryParam{Key: string(key), Value: string(value)})
+	})
 
 	routeParams := []config.QueryParam{}
 	for k, v := range ctx.AllParams() {
diff --git a/static/css/main.css b/static/css/main.css
index 55b4fa1..51d2206 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -167,7 +167,15 @@ main {
     border: 1px solid #6666cc;
     padding: 8px;
     text-align: center;
-    margin-top: 16px;
+}
+
+.search-container input[type="text"] {
+    width: 100%;
+    flex: 1;
+}
+
+.centered-main>.search-container {
+    width: 768px;
 }
 
 .search-container form {
@@ -183,8 +191,7 @@ input[type="number"] {
     background-color: #1a0033;
     border: 1px solid #9999ff;
     color: #ccccff;
-    padding: 2px 4px;
-    width: 250px;
+    padding: 3px 5px;
 }
 
 input[type="text"]:focus,
@@ -228,8 +235,8 @@ input[type="submit"]:hover {
 }
 
 .checkbox-custom {
-    width: 16px;
-    height: 16px;
+    width: 24px;
+    height: 24px;
     border: 2px solid #666;
     background-color: #1a0033;
     transition: all 0.2s ease;
diff --git a/templates/home.django b/templates/home.django
index 148dbce..c0cacb7 100644
--- a/templates/home.django
+++ b/templates/home.django
@@ -3,7 +3,7 @@
   <div class="centered-main">
     <img src="/static/images/opwevhieia8ikwltpfgf.webp" alt="Main Image" class="main-img" />
     <h1>Welcome to {{ Appname }}!</h1>
-    <p>～ 個人的な画像ボード ～</p>
+    <p style="margin-bottom: 16px;">～ 個人的な画像ボード ～</p>
     {% include 'partials/search.django' %}
   </div>
 {% endblock %}
diff --git a/templates/partials/search.django b/templates/partials/search.django
index ae67017..75f8368 100644
--- a/templates/partials/search.django
+++ b/templates/partials/search.django
@@ -1,26 +1,34 @@
 <div class="search-container">
-  <form action="/" method="GET">
+  <form action="/posts" method="GET">
     <h3>« Search Posts »</h3>
-    <input type="text" name="tags" placeholder="enter some tags..." value="{{ SearchQuery }}" />
+    <input type="text" name="tags" class="search-tags-input" placeholder="enter some tags..." value="{{ QueryTags|default_if_none:'' }}" autocomplete="off" aria-label="Search tags" />
     <input type="submit" value="Search" />
-    <input type="button" value="Clear" onclick="this.form.reset();" />
+    <input type="button" value="Clear" onclick="this.form.tags.value='';" />
     <div class="rating-toggles">
       <label class="rating-checkbox">
-        <input type="checkbox" name="rating" value="safe" checked />
+        <input type="checkbox" name="rating" value="safe" {{ QueryRatings.safe|yesno:'checked,' }} />
         <span class="checkbox-custom safe"></span>
       </label>
       <label class="rating-checkbox">
-        <input type="checkbox" name="rating" value="questionable" checked />
+        <input type="checkbox" name="rating" value="questionable" {{ QueryRatings.questionable|yesno:'checked,' }} />
         <span class="checkbox-custom questionable"></span>
       </label>
       <label class="rating-checkbox">
-        <input type="checkbox" name="rating" value="sensitive" checked />
+        <input type="checkbox" name="rating" value="sensitive" {{ QueryRatings.sensitive|yesno:'checked,' }} />
         <span class="checkbox-custom sensitive"></span>
       </label>
       <label class="rating-checkbox">
-        <input type="checkbox" name="rating" value="explicit" checked />
+        <input type="checkbox" name="rating" value="explicit" {{ QueryRatings.explicit|yesno:'checked,' }} />
         <span class="checkbox-custom explicit"></span>
       </label>
     </div>
+    <a href="/help" style="height: 24px;">
+      <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-help">
+        <path stroke="none" d="M0 0h24v24H0z" fill="none" />
+        <path d="M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0" />
+        <path d="M12 17l0 .01" />
+        <path d="M12 13.5a1.5 1.5 0 0 1 1 -1.5a2.6 2.6 0 1 0 -3 -4" />
+      </svg>
+    </a>
   </form>
 </div>
diff --git a/templates/posts/list.django b/templates/posts/list.django
index d4f933b..2dc5d03 100644
--- a/templates/posts/list.django
+++ b/templates/posts/list.django
@@ -1,11 +1,11 @@
 {% extends 'layouts/main.django' %}
-{% include 'partials/search.django' %}
 {% block content %}
   {% if Error %}
     <div class="centered-main">
       <div class="error">{{ Error }}</div>
     </div>
   {% endif %}
+  {% include 'partials/search.django' %}
   {% if Posts %}
     Will Show posts here
   {% else %}
diff --git a/templates/preferences.django b/templates/preferences.django
index bb489f9..d8a153e 100644
--- a/templates/preferences.django
+++ b/templates/preferences.django
@@ -68,5 +68,5 @@
   </div>
 {% endblock %}
 {% block scripts %}
-  <script src="/static/scripts/preferences.js" type="text/javascript"></script>
+  <script type="text/javascript" src="/static/scripts/preferences.js" defer></script>
 {% endblock %}