From e9f3543572172b2326c14ecceae4c363e91cb248 Mon Sep 17 00:00:00 2001
From: Tom Kazimiers <tom@voodoo-arts.net>
Date: Tue, 2 Oct 2018 21:22:20 -0400
Subject: [PATCH] Neuron similarity widget: make "Show top N" option work

This option specifies how many matching results are displayed per query
element.
---
 .../js/widgets/neuron-similarity-detail-widget.js     | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/django/applications/catmaid/static/js/widgets/neuron-similarity-detail-widget.js b/django/applications/catmaid/static/js/widgets/neuron-similarity-detail-widget.js
index c713334bc3..2b6a01ca80 100644
--- a/django/applications/catmaid/static/js/widgets/neuron-similarity-detail-widget.js
+++ b/django/applications/catmaid/static/js/widgets/neuron-similarity-detail-widget.js
@@ -117,6 +117,7 @@
             let value = parseInt(this.value, 10);
             if (value !== undefined && !Number.isNaN(value)) {
               self.showTopN = value;
+              self.refresh();
             }
           },
         });
@@ -173,17 +174,17 @@
     let theadTh1 = theadTr.appendChild(document.createElement('th'));
     theadTh1.appendChild(document.createTextNode('Query ' + this.similarity.query_type));
     let theadTh2 = theadTr.appendChild(document.createElement('th'));
-    theadTh2.appendChild(document.createTextNode('Top 10 target ' + this.similarity.target_type + 's'));
+    theadTh2.appendChild(document.createTextNode(`Top ${this.showTopN} target ${this.similarity.target_type}s`));
     let tbody = table.appendChild(document.createElement('tbody'));
 
     let pointClouds = {};
 
     NeuronSimilarityDetailWidget.createSimilarityTable(this.similarity,
-        this.onlyPositiveScores, pointClouds, table);
+        this.onlyPositiveScores, this.showTopN, pointClouds, table);
   };
 
   NeuronSimilarityDetailWidget.createSimilarityTable = function(similarity,
-      matchesOnly, pointClouds, table) {
+      matchesOnly, showTopN, pointClouds, table) {
     if (!table) {
       table = document.createElement('table');
     }
@@ -253,9 +254,9 @@
         class: 'cm-left',
         render: function(data, type, row, meta) {
           if (row[1].length > 0) {
-            let nTop10Elements = Math.min(10, row[1].length);
+            let topNElements = Math.min(showTopN, row[1].length);
             let elements = ['<span class="result-list">'];
-            for (let i=0; i<nTop10Elements; ++i) {
+            for (let i=0; i<topNElements; ++i) {
               let entry = row[1][i];
               elements.push(`<span class="result-element"><span>${i+1}.</span><a href="#" data-skeleton-id="${entry[0]}" data-role="select-skeleton">${entry[0]}</a> (${entry[1]})</span>`);
             }