Support is-experimental field

web/src/components/LlpsTable.vue

@@ -40,7 +40,7 @@
 
   export default {
     name: 'llps-table',
-    props: ['id', 'data', 'map'],
+    props: ['id', 'data', 'map', 'is-experimental'],
     data() {
       return {
       };
@@ -67,7 +67,7 @@
           d.DT_RowID = `${d.n}`;
         });
 
-        const columns = [
+        const columns = vm.isExperimental ? [
           {
             title: 'Gene Name',
             data: 'gene_name',
@@ -140,7 +140,89 @@
               }
             }
           }
-        ];
+        ] :
+          [
+            {
+              title: 'Gene Name',
+              data: 'gene_name',
+              fnCreatedCell: (nTd, sData, oData) => {
+                if (sData) {
+                  $(nTd).html(`<a href="" class="protein-link"> ${sData}</a>`);
+                } else {
+                  $(nTd).html(`<a href="" class="protein-link"> ${oData.uniprot_id}</a>`);
+                }
+              },
+            },
+            {
+              title: 'Name',
+              data: 'name',
+              fnCreatedCell: (nTd, sData, oData) => {
+                if (sData) {
+                  $(nTd).html(`<a href="" class="protein-link"> ${sData}</a>`);
+                } else {
+                  $(nTd).html(`<a href="" class="protein-link"> ${oData.uniprot_id}</a>`);
+                }
+              },
+            },
+            {
+              title: 'Evidences',
+              data: 'uniprot_id',
+              className: "text-nowrap",
+              fnCreatedCell: (nTd, sData, oData) => {
+                // console.log(sData)
+                let data = vm.map[oData.uniprot_id];
+                if(data) {
+                  // $(nTd).html(data.filter(a => a.startsWith('http')).join('\n'));
+                  $(nTd).html(data.join('\n'));
+                }
+              }
+            },
+            {
+              title: 'UniProt',
+              data: 'uniprot_id',
+              className: "text-nowrap",
+              fnCreatedCell: (nTd, sData, oData) => {
+                $(nTd).html(`<a href="" class="uniprot-link tooltipped tooltipped-n tooltipped-multiline"
+                    aria-label="Clicking this link opens UniProt page."> ${sData} <i class="glyphicon glyphicon-link"></i></a>`);
+              },
+            },
+            // {
+            //   title: 'Evidence',
+            //   data: 'uniprot_id',
+            //   className: "text-nowrap",
+            //   fnCreatedCell: (nTd, sData, oData) => {
+            //     $(nTd).html(`${vm.map[oData.uniprot_id]}`);
+            //   },
+            // },
+            // {
+            //   title: 'Sequence',
+            //   data: 'sequence',
+            //   className: "text-nowrap",
+            //   fnCreatedCell: (nTd, sData, oData) => {
+            //     $(nTd).html(`<input type="text" value="${sData}">
+            //           <button class="copy-button" name="${oData.uniprot_id}" id="${oData.uniprot_id}" data-clipboard-text="${sData}"><i class="glyphicon glyphicon-copy"></i> </button>`);
+            //   },
+            // }
+            {
+              title: 'Evidence Stars',
+              className: "text-nowrap",
+              data: 'uniprot_id',
+              render: function ( data, type, row, meta ) {
+                // console.log(_.flatMap(row.condensates, c => c.data_sources))
+                if(row.condensates) {
+                  return getRatingValue(vm.map[row.uniprot_id]);
+                }
+                return '';
+              },
+              fnCreatedCell: (nTd, sData, oData) => {
+                // console.log(sData)
+                let data = vm.map[oData.uniprot_id];
+                if(data) {
+                  $(nTd).html(getRating(data).join('\n'));
+                }
+              }
+            }
+          ];
 
         const nTableOptions = {
           columns,