Merge with config on resource templates rendering. Support custom CSS. …

…Resolve #11. Resolve #45. Helps with #43.
KonradHoeffner · Jun 14, 2023 · 7289b93 · 7289b93
1 parent c6f5294
commit 7289b93
Show file tree

Hide file tree

Showing 8 changed files with 139 additions and 182 deletions.
diff --git a/Cargo.lock b/Cargo.lock
diff --git a/Cargo.toml b/Cargo.toml
@@ -26,6 +26,7 @@ zstd = { version = "0.12.0", features = ["zstdmt"] }
 ureq = "2.6.2"
 const-fnv1a-hash = "1.1.0"
 lazy_static = "1.4.0"
+serde_json = "1.0.96"
 
 [features]
 default = ["rdfxml", "log", "hdt"]

diff --git a/README.md b/README.md
@@ -51,6 +51,12 @@ For example, `namespace = "http://hitontology.eu/ontology/"` in `config.toml` is
 You need to provide a knowledge base in RDF Turtle or HDT format, whose default path is `data/kb.ttl`.
 If you don't, RickView will show a minimal example knowledge base.
 You can add custom HTML to the index page by adding a `data/body.html` file.
+You can add embedded CSS using the `css` environment variable.
+By default, the *Roboto* font is used which RickView hosts locally for robustness, speed and to prevent conflicts with European privacy laws.
+If this is not an issue for you and, for example, you want to display Chinese or Japanese characters, you could import a Google Font:
+
+    css = "@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300&display=swap'); body {font-family: 'Noto Sans SC', sans-serif}"
+
 Compile and run with `cargo run` and then open <http://localhost:8080> in your browser.
 
 ## Supported File Formats

diff --git a/data/about.html b/data/about.html
@@ -7,6 +7,7 @@
     <link rel="stylesheet" href="rickview.css" type="text/css" />
     <link rel="stylesheet" href="roboto.css" type="text/css" />
     <link rel="shortcut icon" href="favicon.ico" />
+    {{ if css }}<style>{css | unescaped}</style>{{ endif }}
   </head>
   <body>
     <article>
@@ -28,14 +29,10 @@ <h1>About RickView {cargo_pkg_version}</h1>
     </article>
     <footer>
       <div id="footer-left">
-        <p class="uppercase">RickView {cargo_pkg_version}</p>
-        <a href="https://github.com/konradhoeffner/rickview" class="uppercase" target="_blank" title="based on RickView">download RickView to publish your data</a>
+        <p><a href="https://github.com/konradhoeffner/rickview" class="uppercase" target="_blank" title="based on RickView">RickView {cargo_pkg_version}</a></p>
+        <p><a href="about" class="uppercase">graph stats</a></p>
       </div>
       <div id="footer-right">
-        <ul>
-          <li>
-          </li>
-        </ul>
       </div>
     </footer>
   </body>

diff --git a/data/index.html b/data/index.html
@@ -2,12 +2,13 @@
 <html lang="en">
   <head>
     <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width,initial-scale=1"/>
+    <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>{title}</title>
     <base href="{base}/">
     <link rel="stylesheet" href="rickview.css" type="text/css" />
     <link rel="stylesheet" href="roboto.css" type="text/css" />
     <link rel="shortcut icon" href="favicon.ico" />
+    {{ if css }}<style>{css | unescaped}</style>{{ endif }}
   </head>
   <body>
     <article>
@@ -39,15 +40,12 @@ <h2>{subtitle}</h2>
     </article>
     <footer>
       <div id="footer-left">
-        <p class="uppercase">RickView {cargo_pkg_version}</p>
-        <p><a href="https://github.com/konradhoeffner/rickview" class="uppercase" target="_blank" title="based on RickView">download RickView to publish your data</a></p>
-        <p><a href="about" class="uppercase">about this instance</a></p>
+        <p><a href="https://github.com/konradhoeffner/rickview" class="uppercase" target="_blank" title="based on RickView">RickView {cargo_pkg_version}</a></p>
+        <p><a href="about" class="uppercase">graph stats</a></p>
       </div>
       <div id="footer-right">
         <ul>
-          <li>
-            {{if github}}<a target="_blank" href="{github}">create Ontology issue on GitHub</a>{{ endif }}
-          </li>
+          <li>{{if github}}<a target="_blank" href="{github}">create Ontology issue on GitHub</a>{{ endif }}</li>
         </ul>
       </div>
     </footer>

diff --git a/data/resource.html b/data/resource.html
@@ -1,13 +1,14 @@
 <!DOCTYPE html>
 <html lang="en">
   <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width,initial-scale=1"/>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>{title}</title>
     <base href="{base}/">
     <link rel="stylesheet" href="rickview.css" type="text/css" />
     <link rel="stylesheet" href="roboto.css" type="text/css" />
     <link rel="shortcut icon" href="favicon.ico" />
+    {{ if css }}<style>{css | unescaped}</style>{{ endif }}
   </head>
   <body>
     <article>
@@ -72,9 +73,9 @@ <h3>inverse relations</h3>
     </article>
     <footer>
       <div id="footer-left">
-        <a href="https://github.com/konradhoeffner/rickview" class="uppercase" target="_blank" title="based on RickView">publish Linked Data with RickView</a>
-        <br>
-        {duration}
+        <p><a href="https://github.com/konradhoeffner/rickview" class="uppercase" target="_blank" title="based on RickView">RickView {cargo_pkg_version}</a></p>
+        <p><a href="about" class="uppercase">graph stats</a></p>
+        <p>{duration}</p>
       </div>
       <div id="footer-right">
         <ul>
@@ -86,9 +87,10 @@ <h3>inverse relations</h3>
           </li>
           {{ if github_issue_url }}
           <li>
-            <a target="_blank" href="{github_issue_url}">create issue on GitHub</a>
+            <a target="_blank" href="{github_issue_url}">create issue about this resource on GitHub</a>
           </li>
           {{ endif }}
+          <li>{{if github}}<a target="_blank" href="{github}">create issue about the knowledge base on GitHub</a>{{ endif }}</li>
         </ul>
       </div>
     </footer>

diff --git a/src/config.rs b/src/config.rs
@@ -33,6 +33,8 @@ pub struct Config {
     pub cargo_pkg_version: String,
     /// if data/body.html is present, it is inserted into index.html on rendering
     pub body: Option<String>,
+    // override CSS, for example the font
+    pub css: Option<String>,
     /// disable memory and CPU intensive preprocessing on large knowledge bases
     pub large: bool,
 }

diff --git a/src/main.rs b/src/main.rs
@@ -28,6 +28,7 @@ use actix_web::{get, head, web, App, HttpRequest, HttpResponse, HttpServer, Resp
 use const_fnv1a_hash::fnv1a_hash_str_32;
 use log::{debug, error, info, trace, warn};
 use serde::Deserialize;
+use serde_json::Value;
 use sophia::iri::{Iri, IriRef};
 use std::error::Error;
 use std::sync::atomic::{AtomicU32, Ordering};
@@ -125,6 +126,20 @@ struct Params {
     output: Option<String>,
 }
 
+// https://github.com/serde-rs/json/issues/377#issuecomment-341490464
+fn merge(a: &mut Value, b: &Value) {
+    match (a, b) {
+        (&mut Value::Object(ref mut a), Value::Object(b)) => {
+            for (k, v) in b {
+                merge(a.entry(k.clone()).or_insert(Value::Null), v);
+            }
+        }
+        (a, b) => {
+            *a = b.clone();
+        }
+    }
+}
+
 #[get("/{suffix:.*}")]
 async fn res_html(r: HttpRequest, suffix: web::Path<String>, params: web::Query<Params>) -> impl Responder {
     let suffix = if suffix.is_empty() { "/".to_owned().into() } else { suffix };
@@ -193,7 +208,9 @@ fn res_html_sync(r: &HttpRequest, suffix: &str, params: &web::Query<Params>) ->
                 return res_result(&prefixed, XML, rdf::serialize_rdfxml(iri.as_ref()));
             }
             if accept.contains(HTML) && output != Some(TTL) {
-                return match template().render("resource", &res) {
+                let mut config_json = serde_json::to_value(config()).unwrap();
+                merge(&mut config_json, &serde_json::to_value(res).unwrap());
+                return match template().render("resource", &config_json) {
                     Ok(html) => {
                         debug!("{} HTML {:?}", prefixed, t.elapsed());
                         HttpResponse::Ok().content_type("text/html; charset-utf-8").append_header(etag).body(add_hashes(&html))
@@ -229,7 +246,9 @@ fn index() -> HttpResponse {
 
 #[get("/about")]
 async fn about_page() -> impl Responder {
-    match template().render("about", &About::new()) {
+    let mut config_json = serde_json::to_value(config()).unwrap();
+    merge(&mut config_json, &serde_json::to_value(About::new()).unwrap());
+    match template().render("about", &config_json) {
         Ok(body) => HttpResponse::Ok().content_type("text/html").body(add_hashes(&body)),
         Err(e) => {
             let message = format!("Could not render about page: {e:?}");