Fix for #3 and maximum scan depth

List mode #5

CMakeLists.txt

@@ -23,6 +23,7 @@ if (WITH_SIST2)
             src/parsing/text.h src/parsing/text.c
             src/index/web.c src/index/web.h
             src/web/serve.c src/web/serve.h
+            src/web/auth_basic.h src/web/auth_basic.c
             src/index/elastic.c src/index/elastic.h
             src/util.c src/util.h
             src/ctx.h src/types.h src/parsing/font.c src/parsing/font.h
@@ -122,10 +123,10 @@ if (WITH_SIST2)
 
     target_compile_options(sist2
             PRIVATE
-#            -Ofast
+            -Ofast
 #                    -march=native
-#            -fno-stack-protector
+            -fno-stack-protector
-#            -fomit-frame-pointer
+            -fomit-frame-pointer
             )
 
     TARGET_LINK_LIBRARIES(

Docker/build.sh

@@ -1,3 +1,4 @@
+rm ./sist2
 cp ../sist2 .
 
 version=$(./sist2 --version)

src/cli.c

@@ -14,6 +14,9 @@
 
 scan_args_t *scan_args_create() {
     scan_args_t *args = calloc(sizeof(scan_args_t), 1);
+
+    args->depth = -1;
+
     return args;
 }
 
@@ -80,6 +83,12 @@ int scan_args_validate(scan_args_t *args, int argc, const char **argv) {
         return 1;
     }
 
+    if (args->depth < 0) {
+        args->depth = G_MAXINT32;
+    } else {
+        args->depth += 1;
+    }
+
     if (args->name == NULL) {
         args->name = g_path_get_basename(args->output);
     }
@@ -126,7 +135,12 @@ int index_args_validate(index_args_t *args, int argc, const char **argv) {
         }
 
         args->script = malloc(info.st_size + 1);
-        read(fd, args->script, info.st_size);
+        res = read(fd, args->script, info.st_size);
+        if (res == -1) {
+            fprintf(stderr, "Error reading script file '%s': %s\n", args->script_path, strerror(errno));
+            return 1;
+        }
+
         *(args->script + info.st_size) = '\0';
         close(fd);
     }
@@ -152,6 +166,12 @@ int web_args_validate(web_args_t *args, int argc, const char **argv) {
         args->port = DEFAULT_PORT;
     }
 
+    if (args->credentials != NULL) {
+        args->b64credentials = onion_base64_encode(args->credentials, (int)strlen(args->credentials));
+        //Remove trailing newline
+        *(args->b64credentials + strlen(args->b64credentials) - 1) = '\0';
+    }
+
     args->index_count = argc - 1;
     args->indices = argv + 1;
 

src/cli.h

@@ -12,6 +12,7 @@ typedef struct scan_args {
     char *output;
     char *rewrite_url;
     char *name;
+    int depth;
     char *path;
 } scan_args_t;
 
@@ -32,6 +33,8 @@ typedef struct web_args {
     char *es_url;
     char *bind;
     char *port;
+    char *credentials;
+    char *b64credentials;
     int index_count;
     const char **indices;
 } web_args_t;

src/ctx.h

@@ -15,6 +15,7 @@ struct {
     int threads;
     int content_size;
     float tn_qscale;
+    int depth;
 
     size_t stat_tn_size;
     size_t stat_index_size;
@@ -34,6 +35,7 @@ struct {
 struct {
     char *es_url;
     int index_count;
+    char* b64credentials;
     struct index_t indices[16];
 } WebCtx;
 #endif

src/index/elastic.c

@@ -131,6 +131,12 @@ void elastic_flush() {
     char bulk_url[4096];
     snprintf(bulk_url, 4096, "%s/sist2/_bulk", Indexer->es_url);
     response_t *r = web_post(bulk_url, buf, "Content-Type: application/x-ndjson");
+
+    if (r->status_code == 0) {
+        fprintf(stderr, "Could not connect to %s, make sure that elasticsearch is running!\n", IndexCtx.es_url);
+        exit(1);
+    }
+
     printf("Indexed %3d documents (%zukB) <%d>\n", count, buf_cur / 1024, r->status_code);
 
     cJSON *ret_json = cJSON_Parse(r->body);

src/io/walk.c

@@ -20,7 +20,7 @@ parse_job_t *create_parse_job(const char *filepath, const struct stat *info, int
 }
 
 int handle_entry(const char *filepath, const struct stat *info, int typeflag, struct FTW *ftw) {
-    if (typeflag == FTW_F && S_ISREG(info->st_mode)) {
+    if (ftw->level <= ScanCtx.depth && typeflag == FTW_F && S_ISREG(info->st_mode)) {
         parse_job_t *job = create_parse_job(filepath, info, ftw->base);
         tpool_add_work(ScanCtx.pool, parse, job);
     }

src/main.c

@@ -10,7 +10,7 @@
 #define EPILOG "Made by simon987 <me@simon987.net>. Released under GPL-3.0"
 
 
-static const char *const Version = "1.1.5";
+static const char *const Version = "1.1.8";
 static const char *const usage[] = {
         "sist2 scan [OPTION]... PATH",
         "sist2 index [OPTION]... INDEX",
@@ -53,6 +53,7 @@ void sist2_scan(scan_args_t *args) {
     ScanCtx.tn_size = args->size;
     ScanCtx.content_size = args->content_size;
     ScanCtx.threads = args->threads;
+    ScanCtx.depth = args->depth;
     strncpy(ScanCtx.index.path, args->output, sizeof(ScanCtx.index.path));
     strncpy(ScanCtx.index.desc.name, args->name, sizeof(ScanCtx.index.desc.name));
     strncpy(ScanCtx.index.desc.root, args->path, sizeof(ScanCtx.index.desc.root));
@@ -175,6 +176,7 @@ void sist2_web(web_args_t *args) {
 
     WebCtx.es_url = args->es_url;
     WebCtx.index_count = args->index_count;
+    WebCtx.b64credentials = args->b64credentials;
 
     for (int i = 0; i < args->index_count; i++) {
         char *abs_path = abspath(args->indices[i]);
@@ -230,6 +232,8 @@ int main(int argc, const char *argv[]) {
             OPT_STRING('o', "output", &scan_args->output, "Output directory. DEFAULT=index.sist2/"),
             OPT_STRING(0, "rewrite-url", &scan_args->rewrite_url, "Serve files from this url instead of from disk."),
             OPT_STRING(0, "name", &scan_args->name, "Index display name. DEFAULT: (name of the directory)"),
+            OPT_INTEGER(0, "depth", &scan_args->depth, "Scan up to DEPTH subdirectories deep. "
+                                                     "Use 0 to only scan files in PATH. DEFAULT: -1"),
 
             #ifndef SIST_SCAN_ONLY
             OPT_GROUP("Index options"),
@@ -243,6 +247,7 @@ int main(int argc, const char *argv[]) {
             OPT_STRING(0, "es-url", &common_es_url, "Elasticsearch url. DEFAULT=http://localhost:9200"),
             OPT_STRING(0, "bind", &web_args->bind, "Listen on this address. DEFAULT=localhost"),
             OPT_STRING(0, "port", &web_args->port, "Listen on this port. DEFAULT=4090"),
+            OPT_STRING(0, "auth", &web_args->credentials, "Basic auth in user:password format"),
             #endif
 
             OPT_END(),

src/sist.h

@@ -32,6 +32,7 @@
 #include <onion/handler.h>
 #include <onion/block.h>
 #include <onion/shortcuts.h>
+#include <onion/codecs.h>
 #include <curl/curl.h>
 #endif
 
@@ -56,6 +57,7 @@
 #include "src/index/elastic.h"
 #include "index/web.h"
 #include "web/serve.h"
+#include "web/auth_basic.h"
 #endif
 
 ;

src/tpool.c

@@ -114,12 +114,18 @@ static void *tpool_worker(void *arg) {
         pthread_mutex_unlock(&(pool->work_mutex));
 
         if (work != NULL) {
+            if (pool->stop) {
+                break;
+            }
+
             work->func(work->arg);
             free(work);
         }
 
         pthread_mutex_lock(&(pool->work_mutex));
-        pool->done_cnt++;
+        if (work != NULL) {
+            pool->done_cnt++;
+        }
 
         progress_bar_print((double) pool->done_cnt / pool->work_cnt, ScanCtx.stat_tn_size, ScanCtx.stat_index_size);
 
@@ -142,11 +148,14 @@ void tpool_wait(tpool_t *pool) {
         if (pool->done_cnt < pool->work_cnt) {
             pthread_cond_wait(&(pool->working_cond), &(pool->work_mutex));
         } else {
-            pool->stop = 1;
+            usleep(500000);
-            break;
+            if (pool->done_cnt == pool->work_cnt) {
+                pool->stop = 1;
+                break;
+            }
         }
-        progress_bar_print(100.0, ScanCtx.stat_tn_size, ScanCtx.stat_index_size);
     }
+    progress_bar_print(1.0, ScanCtx.stat_tn_size, ScanCtx.stat_index_size);
     pthread_mutex_unlock(&(pool->work_mutex));
 }
 

src/web/auth_basic.c

@@ -0,0 +1,59 @@
+#include "auth_basic.h"
+
+#define UNAUTHORIZED_TEXT "Unauthorized"
+
+typedef struct auth_basic_data {
+    onion_handler *inside;
+    const char *b64credentials;
+} auth_basic_data_t;
+
+
+int authenticate(const char *expected, const char *credentials) {
+
+    if (expected == NULL) {
+        return TRUE;
+    }
+
+    if (credentials && strncmp(credentials, "Basic ", 6) == 0) {
+        if (strcmp((credentials + 6), expected) == 0) {
+            return TRUE;
+        }
+    }
+
+    return FALSE;
+}
+
+int auth_basic_handler(auth_basic_data_t *d,
+                       onion_request *req,
+                       onion_response *res) {
+
+    const char *credentials = onion_request_get_header(req, "Authorization");
+
+    if (authenticate(d->b64credentials, credentials)) {
+        return onion_handler_handle(d->inside, req, res);
+    }
+
+    onion_response_set_header(res, "WWW-Authenticate", "Basic realm=\"sist2\"");
+    onion_response_set_code(res, HTTP_UNAUTHORIZED);
+    onion_response_write(res, UNAUTHORIZED_TEXT, sizeof(UNAUTHORIZED_TEXT));
+    onion_response_set_length(res, sizeof(UNAUTHORIZED_TEXT));
+
+    return OCS_PROCESSED;
+}
+
+void auth_basic_free(auth_basic_data_t *data) {
+    onion_handler_free(data->inside);
+    free(data);
+}
+
+onion_handler *auth_basic(const char *b64credentials, onion_handler *inside_level) {
+
+    auth_basic_data_t *privdata = malloc(sizeof(auth_basic_data_t));
+
+    privdata->b64credentials = b64credentials;
+    privdata->inside = inside_level;
+
+    return onion_handler_new((onion_handler_handler) auth_basic_handler, privdata,
+                             (onion_handler_private_data_free) auth_basic_free);
+}
+

src/web/auth_basic.h

@@ -0,0 +1,4 @@
+#include "src/sist.h"
+
+
+onion_handler *auth_basic(const char *b64credentials, onion_handler *inside_level);

src/web/serve.c

@@ -245,6 +245,8 @@ int search(void *p, onion_request *req, onion_response *res) {
 
     if (r->status_code == 200) {
         onion_response_write(res, r->body, r->size);
+    } else {
+        onion_response_set_code(res, HTTP_INTERNAL_ERROR);
     }
 
     free_response(r);
@@ -391,9 +393,11 @@ void serve(const char *hostname, const char *port) {
     onion_set_hostname(o, hostname);
     onion_set_port(o, port);
 
-    onion_url *urls = onion_root_url(o);
+    onion_url *urls = onion_url_new();
 
     // Static paths
+    onion_set_root_handler(o, auth_basic(WebCtx.b64credentials, onion_url_to_handler(urls)));
+
     onion_url_add(urls, "", search_index);
     onion_url_add(urls, "css", style);
     onion_url_add(urls, "js", javascript);
@@ -410,6 +414,7 @@ void serve(const char *hostname, const char *port) {
     onion_url_add(urls, "^f/([a-fA-F0-9]{8}-[a-fA-F0-9]{4}-[a-fA-F0-9]{4}-[a-fA-F0-9]{4}-[a-fA-F0-9]{12})$", file);
     onion_url_add(urls, "i", index_info);
 
+
     printf("Starting web server @ http://%s:%s\n", hostname, port);
 
     onion_listen(o);

web/css/dark.css

@@ -23,6 +23,20 @@ body {
     border: none;
 }
 
+.list-group-item {
+    background: #212121;
+    color: #e0e0e0;
+
+    border-top: 1px solid #424242;
+    border-bottom: none;
+    border-left: none;
+    border-right: none;
+}
+
+.list-group-item:first-child {
+    border-top: none;
+}
+
 .navbar-brand {
     font-size: 1.75rem;
     padding: 0;
@@ -93,6 +107,7 @@ body {
     white-space: nowrap;
     text-overflow: ellipsis;
     overflow: hidden;
+    color: #00BCD4;
 }
 
 .badge {
@@ -115,6 +130,15 @@ body {
     height: auto;
 }
 
+.fit-sm {
+    display: block;
+    max-width: 64px;
+    max-height: 64px;
+    margin: 0 auto 0;
+    width: auto;
+    height: auto;
+}
+
 .audio-fit {
     height: 39px;
     vertical-align: bottom;
@@ -158,6 +182,8 @@ mark {
     border: 1px solid #616161;
     border-radius: 4px;
     margin: 3px;
+    white-space: normal;
+    color: rgb(224, 224, 224);
 }
 
 .irs-single, .irs-from, .irs-to {
@@ -239,6 +265,7 @@ option {
     padding: 0.5rem;
     background: #212121;
     color: #eee;
+    margin-top: 1em;
 }
 
 .btn-xs {
@@ -279,8 +306,46 @@ option {
     margin-top: 0.5rem;
 }
 
-@media (min-width: 800px) {
+@media (max-width: 800px) {
-    .nav {
+    #treeTabs {
-        min-width: 800px;
+        flex-basis: inherit;
+        flex-grow: inherit;
     }
 }
+
+.list-group {
+    margin-top: 1em;
+}
+
+.list-group-item {
+    padding: .25rem 0.5rem;
+}
+
+.wrapper-sm {
+    min-width: 64px;
+}
+
+.media-expanded {
+    display: inherit;
+}
+
+.media-expanded .fit {
+    max-height: 250px;
+}
+
+@media (max-width: 600px) {
+    .media-expanded .fit {
+        max-height: none;
+    }
+
+    .tagline {
+        display: none;
+    }
+}
+
+.version {
+    color: #00BCD4;
+    margin-left: -18px;
+    margin-top: -14px;
+    font-size: 11px;
+}

web/css/light.css

@@ -2,7 +2,9 @@
     outline: 0;
 }
 
-body {overflow-y:scroll;}
+body {
+    overflow-y: scroll;
+}
 
 .progress {
     margin-top: 1em;
@@ -10,15 +12,19 @@ body {overflow-y:scroll;}
 
 .card {
     margin-top: 1em;
-    box-shadow: 0 .125rem .25rem rgba(0,0,0,.075) !important;
+    box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075) !important;
 }
+
 .navbar-brand {
     font-size: 1.75rem;
     padding: 0;
 }
+
 .navbar {
-    background: #F7F7F7; border-bottom: solid 1px #dfdfdf;
+    background: #F7F7F7;
+    border-bottom: solid 1px #dfdfdf;
 }
+
 .document {
     padding: 0.5rem;
 }
@@ -93,6 +99,15 @@ body {overflow-y:scroll;}
     height: auto;
 }
 
+.fit-sm {
+    display: block;
+    max-width: 64px;
+    max-height: 64px;
+    margin: 0 auto 0;
+    width: auto;
+    height: auto;
+}
+
 .audio-fit {
     height: 39px;
     vertical-align: bottom;
@@ -107,16 +122,17 @@ body {overflow-y:scroll;}
 }
 
 @media (min-width: 1500px) {
-    .container  {
+    .container {
         max-width: 1440px;
     }
+
     .card-columns {
         column-count: 5;
     }
 }
 
 @media (min-width: 1800px) {
-    .container  {
+    .container {
         max-width: 1550px;
     }
 }
@@ -128,13 +144,15 @@ mark {
 }
 
 .content-div {
-    font-family: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
+    font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
     font-size: 13px;
     padding: 1em;
     background-color: #f5f5f5;
     border: 1px solid #ccc;
     border-radius: 4px;
     margin: 3px;
+    white-space: normal;
+    color: #000;
 }
 
 .irs-single, .irs-from, .irs-to {
@@ -154,8 +172,7 @@ mark {
     margin-bottom: 1em;
 }
 
-.inspire-tree .selected > .wholerow, .inspire-tree .selected > .title-wrap:hover + .wholerow
+.inspire-tree .selected > .wholerow, .inspire-tree .selected > .title-wrap:hover + .wholerow {
-{
     background: none;
 }
 
@@ -171,6 +188,7 @@ mark {
     line-height: 1rem;
     padding: 0.5rem;
     background: #f8f9fa;
+    margin-top: 1em;
 }
 
 .btn-xs {
@@ -183,8 +201,46 @@ mark {
     margin-top: 0.5rem;
 }
 
-@media (min-width: 800px) {
+@media (max-width: 800px) {
-    .nav {
+    #treeTabs {
-        min-width: 800px;
+        flex-basis: inherit;
+        flex-grow: inherit;
     }
 }
+
+.list-group {
+    margin-top: 1em;
+}
+
+.list-group-item {
+    padding: .25rem 0.5rem;
+}
+
+.wrapper-sm {
+    min-width: 64px;
+}
+
+.media-expanded {
+    display: inherit;
+}
+
+.media-expanded .fit {
+    max-height: 250px;
+}
+
+@media (max-width: 600px) {
+    .media-expanded .fit {
+        max-height: none;
+    }
+
+    .tagline {
+        display: none;
+    }
+}
+
+.version {
+    color: #007bff;
+    margin-left: -18px;
+    margin-top: -14px;
+    font-size: 11px;
+}

web/js/dom.js

@@ -75,18 +75,84 @@ function shouldPlayVideo(hit) {
     return videoc !== "hevc" && videoc !== "mpeg2video" && videoc !== "wmv3";
 }
 
-function makePlaceholder(w, h) {
+function makePlaceholder(w, h, small) {
-    const calc = w > h
+    let calc;
-        ? (175 / w / h) >= 272
+    if (small) {
-            ? (175 * w / h)
+        calc = w > h
-            : 175
+            ? (64 / w / h) >= 100
-        : 175;
+                ? (64 * w / h)
+                : 64
+            : 64;
+    } else {
+        calc = w > h
+            ? (175 / w / h) >= 272
+                ? (175 * w / h)
+                : 175
+            : 175;
+    }
 
     const el = document.createElement("div");
     el.setAttribute("style", `height: ${calc}px`);
     return el;
 }
 
+function makeTitle(hit) {
+    let title = document.createElement("div");
+    title.setAttribute("class", "file-title");
+    let extension = hit["_source"].hasOwnProperty("extension") && hit["_source"]["extension"] !== "" ? "." + hit["_source"]["extension"] : "";
+
+    applyNameToTitle(hit, title, extension);
+
+    title.setAttribute("title", hit["_source"]["path"] + "/" + hit["_source"]["name"] + extension);
+    return title;
+}
+
+function getTags(hit, mimeCategory) {
+
+    let tags = [];
+    switch (mimeCategory) {
+        case "video":
+        case "image":
+            if (hit["_source"].hasOwnProperty("videoc")) {
+                const formatTag = document.createElement("span");
+                formatTag.setAttribute("class", "badge badge-pill badge-video");
+                formatTag.appendChild(document.createTextNode(hit["_source"]["videoc"].replace(" ", "")));
+                tags.push(formatTag);
+            }
+            break;
+        case "audio": {
+            if (hit["_source"].hasOwnProperty("audioc")) {
+                let formatTag = document.createElement("span");
+                formatTag.setAttribute("class", "badge badge-pill badge-audio");
+                formatTag.appendChild(document.createTextNode(hit["_source"]["audioc"]));
+                tags.push(formatTag);
+            }
+        }
+            break;
+    }
+    // User tags
+    if (hit["_source"].hasOwnProperty("tag")) {
+        hit["_source"]["tag"].forEach(tag => {
+            const userTag = document.createElement("span");
+            userTag.setAttribute("class", "badge badge-pill badge-user");
+
+            const tokens = tag.split("#");
+
+            if (tokens.length > 1) {
+                const bg = "#" + tokens[1];
+                const fg = lum(tokens[1]) > 40 ? "#000" : "#fff";
+                userTag.setAttribute("style", `background-color: ${bg}; color: ${fg}`);
+            }
+
+            const name = tokens[0].split(".")[tokens[0].split(".").length - 1];
+            userTag.appendChild(document.createTextNode(name));
+            tags.push(userTag);
+        })
+    }
+
+    return tags
+}
+
 /**
  *
  * @param hit
@@ -104,22 +170,13 @@ function createDocCard(hit) {
     link.setAttribute("target", "_blank");
 
     //Title
-    let title = document.createElement("p");
+    let title = makeTitle(hit);
-    title.setAttribute("class", "file-title");
-    let extension = hit["_source"].hasOwnProperty("extension") && hit["_source"]["extension"] !== "" ? "." + hit["_source"]["extension"] : "";
-
-    applyNameToTitle(hit, title, extension);
-
-    title.setAttribute("title", hit["_source"]["path"] + "/" + hit["_source"]["name"] + extension);
-    docCard.appendChild(title);
 
     let tagContainer = document.createElement("div");
     tagContainer.setAttribute("class", "card-text");
 
     if (hit["_source"].hasOwnProperty("mime") && hit["_source"]["mime"] !== null) {
 
-        let tags = [];
-        let thumbnail = null;
         let thumbnailOverlay = null;
         let imgWrapper = document.createElement("div");
         imgWrapper.setAttribute("style", "position: relative");
@@ -127,47 +184,7 @@ function createDocCard(hit) {
         let mimeCategory = hit["_source"]["mime"].split("/")[0];
 
         //Thumbnail
-        if (mimeCategory === "video" && shouldPlayVideo(hit)) {
+        let thumbnail = makeThumbnail(mimeCategory, hit, imgWrapper, false);
-            thumbnail = document.createElement("video");
-            addVidSrc("f/" + hit["_id"], hit["_source"]["mime"], thumbnail);
-
-            const placeholder = makePlaceholder(hit["_source"]["width"], hit["_source"]["height"]);
-            imgWrapper.appendChild(placeholder);
-
-            thumbnail.setAttribute("class", "fit");
-            thumbnail.setAttribute("controls", "");
-            thumbnail.setAttribute("preload", "none");
-            thumbnail.setAttribute("poster", `t/${hit["_source"]["index"]}/${hit["_id"]}`);
-            thumbnail.addEventListener("dblclick", function () {
-                thumbnail.webkitRequestFullScreen();
-            });
-            const poster = new Image();
-            poster.src = thumbnail.getAttribute('poster');
-            poster.addEventListener("load", function () {
-                placeholder.remove();
-                imgWrapper.appendChild(thumbnail);
-            });
-        } else if ((hit["_source"].hasOwnProperty("width") && hit["_source"]["width"] > 20 && hit["_source"]["height"] > 20)
-            || hit["_source"]["mime"] === "application/pdf"
-            || hit["_source"]["mime"] === "application/epub+zip"
-            || hit["_source"]["mime"] === "application/x-cbz"
-            || hit["_source"].hasOwnProperty("font_name")
-        ) {
-            thumbnail = document.createElement("img");
-            thumbnail.setAttribute("class", "card-img-top fit");
-            thumbnail.setAttribute("src", `t/${hit["_source"]["index"]}/${hit["_id"]}`);
-
-            const placeholder = makePlaceholder(hit["_source"]["width"], hit["_source"]["height"]);
-            imgWrapper.appendChild(placeholder);
-
-            thumbnail.addEventListener("error", () => {
-                imgWrapper.remove();
-            });
-            thumbnail.addEventListener("load", () => {
-                placeholder.remove();
-                imgWrapper.appendChild(thumbnail);
-            });
-        }
 
         //Thumbnail overlay
         switch (mimeCategory) {
@@ -202,26 +219,10 @@ function createDocCard(hit) {
                 }
         }
 
-        //Tags
+        // Tags
-        switch (mimeCategory) {
+        let tags = getTags(hit, mimeCategory);
-            case "video":
+        for (let i = 0; i < tags.length; i++) {
-            case "image":
+            tagContainer.appendChild(tags[i]);
-                if (hit["_source"].hasOwnProperty("videoc")) {
-                    const formatTag = document.createElement("span");
-                    formatTag.setAttribute("class", "badge badge-pill badge-video");
-                    formatTag.appendChild(document.createTextNode(hit["_source"]["videoc"].replace(" ", "")));
-                    tags.push(formatTag);
-                }
-                break;
-            case "audio": {
-                if (hit["_source"].hasOwnProperty("audioc")) {
-                    let formatTag = document.createElement("span");
-                    formatTag.setAttribute("class", "badge badge-pill badge-audio");
-                    formatTag.appendChild(document.createTextNode(hit["_source"]["audioc"]));
-                    tags.push(formatTag);
-                }
-            }
-                break;
         }
 
         //Content
@@ -253,30 +254,6 @@ function createDocCard(hit) {
         if (thumbnailOverlay !== null) {
             imgWrapper.appendChild(thumbnailOverlay);
         }
-
-        // User tags
-        if (hit["_source"].hasOwnProperty("tag")) {
-            hit["_source"]["tag"].forEach(tag => {
-                const userTag = document.createElement("span");
-                userTag.setAttribute("class", "badge badge-pill badge-user");
-
-                const tokens = tag.split("#");
-
-                if (tokens.length > 1) {
-                    const bg = "#" + tokens[1];
-                    const fg = lum(tokens[1]) > 40 ? "#000" : "#fff";
-                    userTag.setAttribute("style", `background-color: ${bg}; color: ${fg}`);
-                }
-
-                const name = tokens[0].split(".")[tokens[0].split(".").length - 1];
-                userTag.appendChild(document.createTextNode(name));
-                tags.push(userTag);
-            })
-        }
-
-        for (let i = 0; i < tags.length; i++) {
-            tagContainer.appendChild(tags[i]);
-        }
     }
 
     //Size tag
@@ -294,6 +271,139 @@ function createDocCard(hit) {
     return docCard;
 }
 
+function makeThumbnail(mimeCategory, hit, imgWrapper, small) {
+    let thumbnail;
+
+    if (mimeCategory === "video" && shouldPlayVideo(hit)) {
+        thumbnail = document.createElement("video");
+        addVidSrc("f/" + hit["_id"], hit["_source"]["mime"], thumbnail);
+
+        const placeholder = makePlaceholder(hit["_source"]["width"], hit["_source"]["height"], small);
+        imgWrapper.appendChild(placeholder);
+
+        if (small) {
+            thumbnail.setAttribute("class", "fit-sm");
+        } else {
+            thumbnail.setAttribute("class", "fit");
+        }
+        if (small) {
+            thumbnail.style.cursor = "pointer";
+            thumbnail.title = "Enlarge";
+            thumbnail.addEventListener("click", function () {
+                imgWrapper.classList.remove("wrapper-sm", "mr-1");
+                imgWrapper.parentElement.classList.add("media-expanded");
+                thumbnail.setAttribute("class", "fit");
+                thumbnail.setAttribute("controls", "");
+            });
+        } else {
+            thumbnail.setAttribute("controls", "");
+        }
+        thumbnail.setAttribute("preload", "none");
+        thumbnail.setAttribute("poster", `t/${hit["_source"]["index"]}/${hit["_id"]}`);
+        thumbnail.addEventListener("dblclick", function () {
+            thumbnail.setAttribute("controls", "");
+            if (thumbnail.webkitRequestFullScreen) {
+                thumbnail.webkitRequestFullScreen();
+            } else {
+                thumbnail.requestFullscreen();
+            }
+        });
+        const poster = new Image();
+        poster.src = thumbnail.getAttribute('poster');
+        poster.addEventListener("load", function () {
+            placeholder.remove();
+            imgWrapper.appendChild(thumbnail);
+        });
+    } else if ((hit["_source"].hasOwnProperty("width") && hit["_source"]["width"] > 32 && hit["_source"]["height"] > 32)
+        || hit["_source"]["mime"] === "application/pdf"
+        || hit["_source"]["mime"] === "application/epub+zip"
+        || hit["_source"]["mime"] === "application/x-cbz"
+        || hit["_source"].hasOwnProperty("font_name")
+    ) {
+        thumbnail = document.createElement("img");
+        if (small) {
+            thumbnail.setAttribute("class", "fit-sm");
+        } else {
+            thumbnail.setAttribute("class", "card-img-top fit");
+        }
+        thumbnail.setAttribute("src", `t/${hit["_source"]["index"]}/${hit["_id"]}`);
+
+        const placeholder = makePlaceholder(hit["_source"]["width"], hit["_source"]["height"], small);
+        imgWrapper.appendChild(placeholder);
+
+        thumbnail.addEventListener("error", () => {
+            imgWrapper.remove();
+        });
+        thumbnail.addEventListener("load", () => {
+            placeholder.remove();
+            imgWrapper.appendChild(thumbnail);
+        });
+    }
+
+    return thumbnail;
+}
+
+function createDocLine(hit) {
+
+    let mimeCategory = hit["_source"]["mime"].split("/")[0];
+    let tags = getTags(hit, mimeCategory);
+
+    let imgWrapper = document.createElement("div");
+    imgWrapper.setAttribute("class", "align-self-start mr-1 wrapper-sm");
+
+    let media = document.createElement("div");
+    media.setAttribute("class", "media");
+
+    const line = document.createElement("div");
+    line.setAttribute("class", "list-group-item flex-column align-items-start");
+
+
+    const title = makeTitle(hit);
+
+    let link = document.createElement("a");
+    link.setAttribute("href", "f/" + hit["_id"]);
+    link.setAttribute("target", "_blank");
+    link.appendChild(title);
+
+    const titleDiv = document.createElement("div");
+    titleDiv.setAttribute("class", "file-title");
+    titleDiv.appendChild(link);
+
+    line.appendChild(media);
+
+    let thumbnail = makeThumbnail(mimeCategory, hit, imgWrapper, true);
+    if (thumbnail) {
+        media.appendChild(imgWrapper);
+    }
+    media.appendChild(titleDiv);
+
+    // Content
+    let contentHl = getContentHighlight(hit);
+    if (contentHl !== undefined) {
+        const contentDiv = document.createElement("div");
+        contentDiv.setAttribute("class", "content-div");
+        contentDiv.insertAdjacentHTML('afterbegin', contentHl);
+        titleDiv.appendChild(contentDiv);
+    }
+
+    let tagContainer = document.createElement("div");
+    tagContainer.setAttribute("class", "");
+
+    for (let i = 0; i < tags.length; i++) {
+        tagContainer.appendChild(tags[i]);
+    }
+
+    //Size tag
+    let sizeTag = document.createElement("small");
+    sizeTag.appendChild(document.createTextNode(humanFileSize(hit["_source"]["size"])));
+    sizeTag.setAttribute("class", "text-muted");
+    tagContainer.appendChild(sizeTag);
+
+    titleDiv.appendChild(tagContainer);
+
+    return line;
+}
+
 function makePreloader() {
     const elem = document.createElement("div");
     elem.setAttribute("class", "progress");
@@ -318,18 +428,53 @@ function makePageIndicator(searchResult) {
 function makeStatsCard(searchResult) {
 
     let statsCard = document.createElement("div");
-    statsCard.setAttribute("class", "card");
+    statsCard.setAttribute("class", "card stat");
     let statsCardBody = document.createElement("div");
     statsCardBody.setAttribute("class", "card-body");
 
-    let stat = document.createElement("p");
+    const resultMode = document.createElement("div");
+    resultMode.setAttribute("class", "btn-group btn-group-toggle");
+    resultMode.setAttribute("data-toggle", "buttons");
+    resultMode.style.cssFloat = "right";
+
+    const listMode = document.createElement("label");
+    listMode.setAttribute("class", "btn btn-primary");
+    listMode.appendChild(document.createTextNode("List"));
+
+    const gridMode = document.createElement("label");
+    gridMode.setAttribute("class", "btn btn-primary");
+    gridMode.appendChild(document.createTextNode("Grid"));
+
+    resultMode.appendChild(gridMode);
+    resultMode.appendChild(listMode);
+
+    if (mode === "grid") {
+        gridMode.classList.add("active")
+    } else {
+        listMode.classList.add("active")
+    }
+
+    gridMode.addEventListener("click", () => {
+        mode = "grid";
+        localStorage.setItem("mode", mode);
+        searchDebounced();
+    });
+    listMode.addEventListener("click", () => {
+        mode = "list";
+        localStorage.setItem("mode", mode);
+        searchDebounced();
+    });
+
+    let stat = document.createElement("span");
     const totalHits = searchResult["hits"]["total"].hasOwnProperty("value")
         ? searchResult["hits"]["total"]["value"] : searchResult["hits"]["total"];
     stat.appendChild(document.createTextNode(totalHits + " results in " + searchResult["took"] + "ms"));
+
     statsCardBody.appendChild(stat);
+    statsCardBody.appendChild(resultMode);
 
     if (totalHits !== 0) {
-        let sizeStat = document.createElement("span");
+        let sizeStat = document.createElement("div");
         sizeStat.appendChild(document.createTextNode(humanFileSize(searchResult["aggregations"]["total_size"]["value"])));
         statsCardBody.appendChild(sizeStat);
     }
@@ -341,7 +486,11 @@ function makeStatsCard(searchResult) {
 
 function makeResultContainer() {
     let resultContainer = document.createElement("div");
-    resultContainer.setAttribute("class", "card-columns");
 
+    if (mode === "grid") {
+        resultContainer.setAttribute("class", "card-columns");
+    } else {
+        resultContainer.setAttribute("class", "list-group");
+    }
     return resultContainer;
 }

web/js/search.js

@@ -12,6 +12,13 @@ let coolingDown = false;
 let searchBusy = true;
 let selectedIndices = [];
 
+let mode;
+if (localStorage.getItem("mode") === null) {
+    mode = "grid";
+} else {
+    mode = localStorage.getItem("mode")
+}
+
 jQuery["jsonPost"] = function (url, data) {
     return jQuery.ajax({
         url: url,
@@ -211,7 +218,12 @@ new autoComplete({
 
 function insertHits(resultContainer, hits) {
     for (let i = 0; i < hits.length; i++) {
-        resultContainer.appendChild(createDocCard(hits[i]));
+
+        if (mode === "grid") {
+            resultContainer.appendChild(createDocCard(hits[i]));
+        } else {
+            resultContainer.appendChild(createDocLine(hits[i]));
+        }
         docCount++;
     }
 }

web/search.html

@@ -11,6 +11,7 @@
 
 <nav class="navbar navbar-expand-lg">
     <a class="navbar-brand" href="/">sist2</a>
+    <span class="badge badge-pill version">v1.1.8</span>
     <span class="tagline">Lightning-fast file system indexer and search tool </span>
     <a style="margin-left: auto" id="theme" class="btn" title="Toggle theme" href="/">Theme</a>
 </nav>
@@ -41,7 +42,7 @@
                     <select class="custom-select" id="indices" multiple size="6"></select>
                 </div>
 
-                <div class="col">
+                <div class="col" id="treeTabs">
                     <ul class="nav nav-tabs" role="tablist">
                         <li class="nav-item">
                             <a class="nav-link active" data-toggle="tab" href="#mime" role="tab" aria-controls="home" aria-selected="true">Mime Types</a>