♻️ refactor(maud): rewrite the frontend code with maud html framework (#302)

src/templates/views/about.rs

@@ -0,0 +1,39 @@
+//!
+
+use maud::{html, Markup};
+
+use crate::templates::partials::{footer::footer, header::header};
+
+///
+pub fn about(colorscheme: &str, theme: &str) -> Markup {
+    html!(
+        (header(colorscheme, theme))
+        main class="about-container"{
+         article {
+             div{
+                h1{"Websurfx"}
+                hr size="4" width="100%" color="#a6e3a1"{}
+             }
+             p{"A modern-looking, lightning-fast, privacy-respecting, secure meta search engine written in Rust. It provides a fast and secure search experience while respecting user privacy."br{}" It aggregates results from multiple search engines and presents them in an unbiased manner, filtering out trackers and ads."
+             }
+
+             h2{"Some of the Top Features:"}
+
+             ul{strong{"Lightning fast "}"- Results load within milliseconds for an instant search experience."}
+
+             ul{strong{"Secure search"}" - All searches are performed over an encrypted connection to prevent snooping."}
+
+             ul{strong{"Ad free results"}" - All search results are ad free and clutter free for a clean search experience."}
+
+             ul{strong{"Privacy focused"}" - Websurfx does not track, store or sell your search data. Your privacy is our priority."}
+
+             ul{strong{"Free and Open source"}" - The entire project's code is open source and available for free on "{a href="https://github.com/neon-mmd/websurfx"{"GitHub"}}" under an GNU Affero General Public License."}
+
+             ul{strong{"Highly customizable"}" - Websurfx comes with 9 built-in color themes and supports creating custom themes effortlessly."}
+         }
+
+         h3{"Devoloped by: "{a href="https://github.com/neon-mmd/websurfx"{"Websurfx team"}}}
+        }
+        (footer())
+    )
+}

src/templates/views/index.rs

@@ -0,0 +1,19 @@
+//!
+
+use maud::{html, Markup, PreEscaped};
+
+use crate::templates::partials::{bar::bar, footer::footer, header::header};
+
+///
+pub fn index(colorscheme: &str, theme: &str, query: &str) -> Markup {
+    html!(
+        (header(colorscheme, theme))
+        main class="search-container"{
+            img src="../images/websurfx_logo.png" alt="Websurfx meta-search engine logo";
+            (bar(query))
+            (PreEscaped("</div>"))
+        }
+        script src="static/index.js"{}
+        (footer())
+    )
+}

src/templates/views/mod.rs

@@ -0,0 +1,7 @@
+//!
+
+pub mod about;
+pub mod index;
+pub mod not_found;
+pub mod settings;
+pub mod search;

src/templates/views/not_found.rs

@@ -0,0 +1,20 @@
+//!
+
+use crate::templates::partials::{footer::footer, header::header};
+use maud::{html, Markup};
+
+///
+pub fn not_found(colorscheme: &str, theme: &str) -> Markup {
+    html!(
+        (header(colorscheme, theme))
+        main class="error_container"{
+         img src="images/robot-404.svg" alt="Image of broken robot.";
+         div class="error_content"{
+          h1{"Aw! snap"}
+          h2{"404 Page Not Found!"}
+          p{"Go to "{a href="/"{"search page"}}}
+         }
+        }
+        (footer())
+    )
+}

src/templates/views/search.rs

@@ -0,0 +1,111 @@
+//!
+
+use maud::{html, Markup, PreEscaped};
+
+use crate::{
+    models::aggregation_models::SearchResults,
+    templates::partials::{footer::footer, header::header, search_bar::search_bar},
+};
+
+///
+pub fn search(
+    colorscheme: &str,
+    theme: &str,
+    query: &str,
+    search_results: &SearchResults,
+) -> Markup {
+    html!(
+        (header(colorscheme, theme))
+        main class="results"{
+           (search_bar(&search_results.engine_errors_info, search_results.safe_search_level, query))
+           .results_aggregated{
+              @if !search_results.results.is_empty() {
+                  @for result in search_results.results.iter(){
+                      .result {
+                         h1{a href=(result.url){(PreEscaped(&result.title))}}
+                         small{(result.url)}
+                         p{(PreEscaped(&result.description))}
+                         .upstream_engines{
+                            @for name in result.clone().engine{
+                               span{(name)}
+                            }
+                         }
+                      }
+                  }
+              }
+              @else if search_results.disallowed{
+                 .result_disallowed{
+                    .description{
+                       p{
+                          "Your search - "{span class="user_query"{(query)}}" -
+                          has been disallowed."
+                       }
+                       p class="description_paragraph"{"Dear user,"}
+                       p class="description_paragraph"{
+                          "The query - "{span class="user_query"{(query)}}" - has
+                          been blacklisted via server configuration and hence disallowed by the
+                          server. Henceforth no results could be displayed for your query."
+                       }
+                    }
+                    img src="./images/barricade.png" alt="Image of a Barricade";
+                 }
+              }
+              @else if search_results.filtered {
+                 .result_filtered{
+                    .description{
+                       p{
+                          "Your search - "{span class="user_query"{(query)}}" -
+                          has been filtered."
+                       }
+                       p class="description_paragraph"{"Dear user,"}
+                       p class="description_paragraph"{
+                          "All the search results contain results that has been configured to be
+                          filtered out via server configuration and henceforth has been
+                          completely filtered out."
+                       }
+                    }
+                    img src="./images/filter.png" alt="Image of a paper inside a funnel";
+                 }
+              }
+              @else if search_results.no_engines_selected {
+                 .result_engine_not_selected{
+                    .description{
+                       p{
+                          "No results could be fetched for your search '{span class="user_query"{(query)}}'."
+                       }
+                       p class="description_paragraph"{"Dear user,"}
+                       p class="description_paragraph"{
+                          "No results could be retrieved from the upstream search engines as no
+                          upstream search engines were selected from the settings page."
+                       }
+                    }
+                    img src="./images/no_selection.png" alt="Image of a white cross inside a red circle";
+                 }
+              }
+              @else{
+                 .result_not_found {
+                    p{"Your search - "{(query)}" - did not match any documents."}
+                    p class="suggestions"{"Suggestions:"}
+                    ul{
+                       li{"Make sure that all words are spelled correctly."}
+                       li{"Try different keywords."}
+                       li{"Try more general keywords."}
+                    }
+                    img src="./images/no_results.gif" alt="Man fishing gif";
+                 }
+              }
+            }
+            .page_navigation {
+               button type="button" onclick="navigate_backward()"{
+                   (PreEscaped("←")) "previous"
+               }
+               button type="button" onclick="navigate_forward()"{"next" (PreEscaped("→"))}
+            }
+        }
+        script src="static/index.js"{}
+        script src="static/search_area_options.js"{}
+        script src="static/pagination.js"{}
+        script src="static/error_box.js"{}
+        (footer())
+    )
+}

src/templates/views/settings.rs

@@ -0,0 +1,45 @@
+//!
+
+use maud::{html, Markup};
+
+use crate::templates::partials::{
+    footer::footer,
+    header::header,
+    settings_tabs::{
+        cookies::cookies, engines::engines, general::general, user_interface::user_interface,
+    },
+};
+
+///
+pub fn settings(
+    colorscheme: &str,
+    theme: &str,
+    engine_names: &[&String],
+) -> Result<Markup, Box<dyn std::error::Error>> {
+    Ok(html!(
+        (header(colorscheme, theme))
+        main class="settings"{
+           h1{"Settings"}
+           hr;
+           .settings_container{
+              .sidebar{
+                  div class="btn active" onclick="setActiveTab(this)"{"general"}
+                  .btn onclick="setActiveTab(this)"{"user interface"}
+                  .btn onclick="setActiveTab(this)"{"engines"}
+                  .btn onclick="setActiveTab(this)"{"cookies"}
+              }
+              .main_container{
+                  (general())
+                  (user_interface()?)
+                  (engines(engine_names))
+                  (cookies())
+                  p class="message"{}
+                  button type="submit" onclick="setClientSettings()"{"Save"}
+              }
+           }
+        }
+        script src="static/settings.js"{}
+        script src="static/cookies.js"{}
+        (footer())
+    ))
+}