4 files changed, 54 insertions, 1 deletions
diff --git a/client/css/post-main-view.styl b/client/css/post-main-view.styl
index 5fa36c5..6b011f0 100644
--- a/client/css/post-main-view.styl
+++ b/client/css/post-main-view.styl
@@ -125,7 +125,7 @@
             order: 2
             margin-top: 1em
 
-    .relations, .similar
+    .relations, .similar, .lookalikes
         h1
             margin-bottom: 0.5em
         .thumbnail
diff --git a/client/html/post_readonly_sidebar.tpl b/client/html/post_readonly_sidebar.tpl
index 6c6cbbe..ac22580 100644
--- a/client/html/post_readonly_sidebar.tpl
+++ b/client/html/post_readonly_sidebar.tpl
@@ -88,6 +88,11 @@
             <ul></ul>
             <a href='<%- ctx.formatClientLink("posts", {query: "similar:" + ctx.post.id}) %>'>See more</a>
         </nav>
+
+        <nav class='lookalikes'>
+            <h1>Look-alikes</h1>
+            <ul></ul>
+        </nav>
     <% } %>
 
     <nav class='tags'>
diff --git a/client/js/controls/post_readonly_sidebar_control.js b/client/js/controls/post_readonly_sidebar_control.js
index 35cad8f..fc26281 100644
--- a/client/js/controls/post_readonly_sidebar_control.js
+++ b/client/js/controls/post_readonly_sidebar_control.js
@@ -50,6 +50,7 @@ class PostReadonlySidebarControl extends events.EventTarget {
             );
         }
         this._loadSimilarPosts();
+        this._loadLookalikePosts();
     }
 
     get _scoreContainerNode() {
@@ -100,6 +101,14 @@ class PostReadonlySidebarControl extends events.EventTarget {
         return this._hostNode.querySelector("nav.similar ul");
     }
 
+    get _lookalikesNode() {
+        return this._hostNode.querySelector("nav.lookalikes");
+    }
+
+    get _lookalikesListNode() {
+        return this._hostNode.querySelector("nav.lookalikes ul");
+    }
+
     _installFitButtons() {
         this._fitBothButtonNode.addEventListener(
             "click",
@@ -257,6 +266,26 @@ class PostReadonlySidebarControl extends events.EventTarget {
             }
         });
     }
+
+    _loadLookalikePosts() {
+        const limit = parseInt(settings.get().similarPosts);
+        const fields = ["id", "thumbnailUrl"];
+        const threshold = 1;
+        return PostList.reverseSearch(this._post.id, limit, threshold, fields)
+            .then((response) => {
+                if (response.results.length === 0) {
+                    this._lookalikesNode.style.display = "none";
+                }
+                const listNode = this._lookalikesListNode;
+                for (let post of response.results) {
+                    let poseNode = similarItemTemplate({
+                        id: post.id,
+                        thumbnailUrl: post.thumbnailUrl,
+                    });
+                    listNode.appendChild(poseNode);
+                }
+            });
+    }
 }
 
 module.exports = PostReadonlySidebarControl;
diff --git a/client/js/models/post_list.js b/client/js/models/post_list.js
index 1220c7a..a94ff7f 100644
--- a/client/js/models/post_list.js
+++ b/client/js/models/post_list.js
@@ -54,6 +54,25 @@ class PostList extends AbstractList {
             });
     }
 
+    static reverseSearch(id, limit, threshold, fields) {
+        return api
+            .get(
+                uri.formatApiLink("post", id, "reverse-search", {
+                    limit: limit,
+                    threshold: threshold,
+                    fields: fields.join(","),
+                })
+            )
+            .then((response) => {
+                const results = response.similarPosts.map((sim) => sim.post);
+                return Promise.resolve(
+                    Object.assign({}, response, {
+                        results: PostList.fromResponse(results)
+                    })
+                );
+            });
+    }
+
     static decorateSearchQuery(text) {
         const browsingSettings = settings.get();
         const disabledSafety = [];