/ unpacks multi prediction array ;
/ prepare it for neighbors ;
/ align single prediction to endpoint ;
/ display preordered in table view ;

%div.results
  %h3 Neighbors:
  / tabs div
  #tabs
    %ul.nav.nav-tabs.nav-justified{:id=>"neighborTabs", :role=>"tablist"}
      / each model a tab head ;
      / hash for predictionFeature
      - predictionFeature = {}
      - @models.each_with_index do |model,i|
        / get predictionFeature type
        - m = Model::Lazar.find model.model_id.to_s
        - predFeature = Feature.find m.prediction_feature_id.to_s
        / define feature type (numeric : nominal)
        - predFeatureType = (predFeature.numeric? ? "numeric" : "nominal")
        / use prediction feature id for neighbor compound features
        - predFeatureId = m.prediction_feature_id.to_s
        - predictionFeature[i] = {"id" => predFeatureId, "type" => predFeatureType}
        %li{:class => ("active" if i == 0)}
          %a{:href => "#results_#{i+1}", :id => "linkTab#{i+1}", data: {toggle:"tab"}}
            = "#{model.endpoint} (#{model.species})"
    %div.tab-content
      / unpack to single arrays
      - @predictions.each_with_index do |prediction,j|
        / pass model type for significant fragments view
        #results.tab-pane{:id=>"#{j+1}", :class => ("active" if j == 0)}
          / prepare dataset for neighbors table ;
          / delete first array which contains prediction ;
          / following arrays are the neighbor predictions ;
          / call the tablesorter plugin ;
          / presort by similarity ;
          :javascript
            $(document).ready(function(){
              $("table##{j+1}").tablesorter({
                debug: false,
                theme: "bootstrap",
                headerTemplate: '',
                widgets: ['columns', 'uitheme', 'stickyHeaders'],
                widgetOptions: {
                  stickyHeaders_attachTo : '.tab-content',
                  stickyHeaders : '',
                  stickyHeaders_offset : 0,
                  stickyHeaders_cloneId : '-sticky',
                  stickyHeaders_addResizeEvent : true,
                  stickyHeaders_includeCaption : true,
                  stickyHeaders_zIndex : 2,
                  stickyHeaders_attachTo : null,
                  stickyHeaders_xScroll : null,
                  stickyHeaders_yScroll : null,
                  stickyHeaders_filteredToTop: true
                },
                sortList: [[2,1]],
                headers: {sorter: false},
                widthFixed: false
              });
            });
          - if prediction[:neighbors].size > 0
            %div.table-responsive
              %table{:id=>"#{j+1}", :style=>"border-style: solid;"}
                %thead
                  %tr
                    %th.sorter-false{:style =>"vertical-align:middle;"}
                      Compound
                    %th.sorter-false{:style =>"vertical-align:middle;"}
                      Measured Activity
                      %a.btn.glyphicon.glyphicon-info-sign{:href=>"#neighbors", :title=>"Measured Activity", :tabindex=>"0", data: {trigger:"focus", container:"body", toggle:"popover", placement:"left", html:"true", content:"Experimental result(s) from the training dataset."}, :style=>"z-index:auto+10;"}
                    %th.sorter-false{:style =>"vertical-align:middle;"}
                      Similarity
                      %a.btn.glyphicon.glyphicon-info-sign{:href=>"#neighbors", :title=>"Similarity", :tabindex=>"0", data: {trigger:"focus", container:"body", toggle:"popover", placement:"left", html:"true", content:"<a href=\"https://en.wikipedia.org/wiki/Jaccard_index\">Tanimoto/Jaccard</a> similarity based on <a href=\"https://openbabel.org/docs/dev/FileFormats/MolPrint2D_format.html\">Molprint2D</a> fingerprints."}, :style=>"z-index:auto+10;"}
                    / %th{:style =>"vertical-align:middle;"}
                    / Supporting Information
                %tbody
                  - type = @model_types[j]
                  - unit = @models[j].unit
                - prediction[:neighbors].uniq.each_with_index do |neighbor,count|
                  %tr
                    / Compound
                    - c = Compound.find(neighbor["_id"])
                    %td{:style =>"vertical-align:middle;padding-left:1em;width:50%;"}
                      /%a.btn.btn-link{:href => "#details#{j+1}", data: { toggle: "modal", remote: to("/prediction/#{CGI.escape(neighbor["_id"])}/details"), :id=>"link#{j+1}#{count}"}}
                      %p= c.svg
                      %p= c.smiles
                    - mw = c.molecular_weight
                    / Measured Activity = compound.features
                    %td{:style =>"vertical-align:middle;padding-left:1em;width:20%;white-space:nowrap;"}
                      - features = c.features.collect{|k,v| v if k == predictionFeature[j]["id"] }.compact.flatten
                      = (predictionFeature[j]["type"] == "numeric") ? features.collect{|v| weight = c.mmol_to_mg(v); '%.2e' % v + " (#{@models[j].unit})"+" , #{'%.2e' % weight} #{(unit == "mmol/L") ? "(mg/L)" : "(mg/kg_bw/day)"}"}.join("</br>") : features.join("</br>")
                    / Similarity = tanimoto
                    %td{:style =>"vertical-align:middle;padding-left:1em;width:20%;"}
                      / TODO differentiate between no neighbors found and compound found in dataset, display neighbors for compounds in dataset?
                      = neighbor[:tanimoto] != nil ? neighbor[:tanimoto].to_f.round(3) : "Not enough similar compounds </br>in training dataset."

          - else
            %span.btn.btn-default.disabled
              = "Not enough similar compounds in training dataset"

          %div.modal.fade{:id=>"details#{j+1}", :role=>"dialog"}
            %div.modal-dialog.modal-lg
              %div.modal-content