diff options
Diffstat (limited to 'views')
-rw-r--r-- | views/batch.haml | 229 | ||||
-rw-r--r-- | views/details.haml | 28 | ||||
-rw-r--r-- | views/faq.haml | 2 | ||||
-rw-r--r-- | views/license.haml | 1 | ||||
-rw-r--r-- | views/predict.haml | 10 | ||||
-rw-r--r-- | views/significant_fragments.haml | 66 |
6 files changed, 136 insertions, 200 deletions
diff --git a/views/batch.haml b/views/batch.haml index 0e7efc7..7f6ddb7 100644 --- a/views/batch.haml +++ b/views/batch.haml @@ -1,10 +1,94 @@ +:javascript + + function progress(value,id) { + var percent = Math.round(value); + var bar = document.getElementById("bar_"+id); + var prog = document.getElementById("progress_"+id); + bar.style.width = value + '%'; + if (percent == 100){ + prog.style.display = "none"; + }; + }; + + var HttpClient = function() { + this.get = function(aUrl, aCallback) { + var anHttpRequest = new XMLHttpRequest(); + anHttpRequest.onreadystatechange = function() { + if (anHttpRequest.readyState == 4 && anHttpRequest.status == 200) + aCallback(anHttpRequest.responseText); + } + anHttpRequest.open( "GET", aUrl, true ); + anHttpRequest.send( null ); + } + }; + + var markers = []; + + function renderTask(task_id,model_id,id) { + var uri = "#{to("/")}" + 'task/?turi=' + task_id; + var aClient = new HttpClient(); + aClient.get(uri, function(res) { + var response = JSON.parse(res); + if (model_id == "Cramer"){ + $("img.circle").show(); + }else{ + progress(response['percent'],id); + } + if (response['percent'] == 100){ + window.clearInterval(markers[id]); + $("a#downbutton_"+id).removeClass("disabled"); + $("a#detailsbutton_"+id).removeClass("disabled"); + $("img.circle").hide(); + }; + }); + }; + function simpleTemplating(data) { + var html = '<ul class=pagination>'; + $.each(data, function(index, item){ + html += '<li>'+ item +'</li>'+'</br>'; + }); + html += '</ul>'; + return html; + }; + function pagePredictions(task_id,model_id,id){ + button = document.getElementById("detailsbutton_"+id); + span = button.childNodes[1]; + if (span.className == "glyphicon glyphicon-menu-right"){ + span.className = "glyphicon glyphicon-menu-down"; + $('#data-container_'+id).show(); + $('#pager_'+id).show(); + $('#pager_'+id).pagination({ + dataSource: '#{to("/")}' + 'task/?predictions=' + task_id + '&model=' + model_id , + locator: 'prediction', + totalNumber: #{@compounds.size}, + pageSize: 1, + showPageNumbers: true, + showGoInput: true, + formatGoInput: 'go to <%= input %>', + formatAjaxError: function(jqXHR, textStatus, errorThrown) { + $('#data-container_'+id).html(errorThrown); + }, + /*ajax: { + beforeSend: function() { + $('#data-container_'+id).html('Loading content ...'); + } + },*/ + callback: function(data, pagination) { + var html = simpleTemplating(data); + $('#data-container_'+id).html(html); + $('#data-container_'+id).css("min-height", $(window).height() + "px" ); + } + }); + } else if (span.className = "glyphicon glyphicon-menu-down"){ + span.className = "glyphicon glyphicon-menu-right"; + $('#data-container_'+id).hide(); + $('#pager_'+id).hide(); + }; + }; %div.well - %a.btn.btn-warning{:href => to('/predict')} + %a.btn.btn-warning{:href => to("/predict?tpid=#{@pid}")} %span.glyphicon.glyphicon-menu-left{:aria=>{:hidden=>"true"}} New Prediction - %a.btn.btn-success{:id => "downbutton", :href=>"#{to("/predict/#{@tmppath}/#{@filename}")}", :title=>"download"} - %span.glyphicon.glyphicon-download-alt - Download CSV / show file name %topline @@ -13,97 +97,46 @@ %h3 Batch Prediction Results: %div.col-md-8 %h3= @filename - - / displays all prediction result in one table - %div.table-responsive - %table.table.table-bordered{:id=>"batch", :style=>"background-color:white;"} - %tbody - - if @warnings - - @warnings.each do |warning| - %tr - %td - %b Warning - %td - = warning.sub(/\b(tmp\/)\b/,"") - - @view.each do |compound, array| - %tr - %td{:style=>"vertical-align:top;"} - %p= compound.svg - %p= compound.smiles - - array.each do |model,prediction| - %td{:style=>"vertical-align:top;white-space:nowrap;"} - - model.model.class.to_s.match("Classification") ? type = "Classification" : type = "Regression" - - unit = model.unit - - %b{:class => "title"} - = "#{model.endpoint.gsub('_', ' ')} (#{model.species})" - - / check for prediction - - if prediction[:value] - %p - / show model type (classification|regression) - %b Type: - = type - %p - / check for database hit - - if prediction[:info] =~ /\b(identical)\b/i - - / show message about dbhit and measurements - %p - %b Compound is part of the training dataset - %p - %b Measured activity: - %br - - if prediction[:measurements].is_a?(Array) - = (type == "Regression") ? prediction[:measurements].collect{|value| "#{value.delog10.signif(3)} (#{unit})</br>#{compound.mmol_to_mg(value.delog10).signif(3)} #{unit =~ /mmol\/L/ ? "(mg/L)" : "(mg/kg_bw/day)"}"}.join("</br>") : prediction[:measurements].join(", ") - - else - = (type == "Regression") ? "#{prediction[:measurements].delog10.signif(3)} (#{unit})</br>#{compound.mmol_to_mg(prediction[:measurements].delog10).signif(3)} #{(unit =~ /\b(mmol\/L)\b/) ? "(mg/L)" : "(mg/kg_bw/day)"}" : prediction[:measurements] - - - / show prediction - %p - %b Prediction: - %br - = (type == "Regression") ? "#{prediction[:value].delog10.signif(3)} (#{unit})</br>#{compound.mmol_to_mg(prediction[:value].delog10).signif(3)} #{(unit =~ /\b(mmol\/L)\b/) ? "(mg/L)" : "(mg/kg_bw/day)"}" : prediction[:value] - - / show prediction interval or probability - %p - - if type == "Regression" - %b 95% Prediction interval: - - interval = (prediction[:prediction_interval].nil? ? nil : prediction[:prediction_interval]) - %br - = interval.nil? ? "" : "#{interval[1].delog10.signif(3)} - #{interval[0].delog10.signif(3)} (#{unit})" - %br - = "#{compound.mmol_to_mg(interval[1].delog10).signif(3)} - #{compound.mmol_to_mg(interval[0].delog10).signif(3)} #{(unit =~ /\b(mmol\/L)\b/) ? "(mg/L)" : "(mg/kg_bw/day)"}" if !prediction[:prediction_interval].nil? - - else - %b Probability: - - unless prediction[:probabilities].nil? - - probabilities = "" - - prediction[:probabilities].each{|k,v| probabilities += "#{k}: #{v.signif(3)}<br>"} - %br - = probabilities - / show warnings - %p - - if !prediction[:info].blank? - %b Info: - %br - %p=prediction[:info].sub(/\'.*\'/,"").sub(/,/, ",<br>") - - if !prediction[:warnings].blank? - %b Warnings: - - prediction[:warnings].uniq.each do |warning| - %br - %p=warning.sub(/substances/, "substances<br>").sub(/prediction\:/, "prediction\:<br>") - - / no prediction - - else - %br - - if !prediction[:info].blank? - %b Info: - %br - %p=prediction[:info].sub(/\'.*\'/,"").sub(/,/, ",<br>") - - if !prediction[:warnings].blank? - %b Warnings: - - prediction[:warnings].uniq.each do |warning| - %br - %p=warning.sub(/substances/, "substances<br>").sub(/prediction\:/, "prediction\:<br>") - %tr + + + - @models.each_with_index do |model,idx| + - m = Model::Validation.find model + - task = @tasks[idx].id + #result.panel{:id=>idx} + %div.row + %div.col-md-6 + %h5= "#{m.endpoint} (#{m.species})" + #pager{:id=>idx} + %div.col-md-6.h5 + %a.btn.btn-default.btn-xs.disabled{:id => "detailsbutton_#{idx}", :data=>{:toggle=>"collapse"}, :href=>"javascript:void(0)", :onclick=>"pagePredictions('#{task}','#{model}','#{idx}')", :style=>"font-size:small;"} + %span.glyphicon.glyphicon-menu-right + Details + %a.btn.btn-default.btn-xs.disabled{:id => "downbutton_#{idx}", :href=>"#{to("/predict/csv/#{task}/#{model}/#{@filename}")}", :title=>"download", :style=>"font-size:small;"} + %span.glyphicon.glyphicon-download-alt + CSV + - if model == "Cramer" + %img.h2{:src=>"/images/wait30trans.gif", :id=>"circle", :class=>"circle", :alt=>"wait", :style=>"display:none;"} + - if model != "Cramer" + %div{:id=>"progress_#{idx}", :style=>"width:100%;height:3px;position:relative;background-color:#ccc;"} + %div{:id=>"bar_#{idx}", :style=>"background-color: #4CAF50;width:10px;height:3px;position:absolute;"} + - # increase interval timer for large datasets + - ctimer = ((@compounds.size/1000) == 0 ? 1000 : ((@compounds.size/1000)*1000)) + :javascript + var timer = #{ctimer}; + $(document).ready(function(){ + // check button class before execute a task + if (#{idx} > 0){ + markers[#{idx}] = setInterval(function(){ + var button = document.getElementById("detailsbutton_#{idx-1}"); + if(!button.classList.contains('disabled')){ + renderTask('#{task}','#{model}',#{idx}); + } + }, timer ); + }else{ + markers[#{idx}] = setInterval(function(){ + renderTask('#{task}','#{model}',#{idx}); + }, timer ); + }; + }); + #data-container{:id=>idx,:style=>"width:100%;"} + -#pager{:id=>idx} diff --git a/views/details.haml b/views/details.haml deleted file mode 100644 index be4948a..0000000 --- a/views/details.haml +++ /dev/null @@ -1,28 +0,0 @@ -:javascript - $(document).ready(function(){ - addExternalLinks(); - }); -%div.modal-body{:style=>"padding:10px;"} - %button.close{ :type=>" button", data: { dismiss:"modal"}} × - %h3 - Names and synonyms: - %p= @compound.svg - %p - %b="SMILES:" - %p= @smiles - %br - %b="InChI:" - %p= @inchi - %br - %b="Names:" - %p{:style=>"padding-left:0.5em;"} - - if @names !~ /^no names/i - = @names.join("; ") - - else - = @names - %hr - %p{:style=>"padding-left:0.5em;"} - / pubchem link - %a.btn.btn-primary{:href=>"http://aop.in-silico.ch/", :title=>"Link opens in new window.", :alt=>"pubchem read across", :rel=>"external"} PubChem read across - %i (experimental) - %br diff --git a/views/faq.haml b/views/faq.haml deleted file mode 100644 index 818b96a..0000000 --- a/views/faq.haml +++ /dev/null @@ -1,2 +0,0 @@ -%div.well.faq - = @faq diff --git a/views/license.haml b/views/license.haml deleted file mode 100644 index 2813220..0000000 --- a/views/license.haml +++ /dev/null @@ -1 +0,0 @@ -= @license diff --git a/views/predict.haml b/views/predict.haml index 2308911..1c995e9 100644 --- a/views/predict.haml +++ b/views/predict.haml @@ -125,12 +125,12 @@ %br %input{:type => 'text', :name => 'identifier', :id => 'identifier', :size => '60'} %p - -#%label{:for=>"fileselect"} + %label{:for=>"fileselect"} or upload a CSV file for batch predictions: - -#%a.btn.glyphicon.glyphicon-info-sign{:href=>"javascript:void(0)", :title=>"File format", :tabindex=>"0", data: {trigger:"focus", toggle:"popover", placement:"auto", html:"true", content:"One column with compounds and keyword SMILES or InChI in the first row."}} - -#%br - %span.btn.btn-default.btn-file{:style=>"display:none;"} - %input{:type=>"file", :name=> "fileselect", :id=>"fileselect", :accept=>"text/csv", :disabled=>"disabled", :type=>"hidden"} + %a.btn.glyphicon.glyphicon-info-sign{:href=>"javascript:void(0)", :title=>"File format", :tabindex=>"0", data: {trigger:"focus", toggle:"popover", placement:"auto", html:"true", content:"One column with compounds and keyword SMILES or InChI in the first row."}} + %br + %span.btn.btn-default.btn-file + %input{:type=>"file", :name=> "fileselect", :id=>"fileselect", :accept=>"text/csv"} %fieldset#middle.well %h2 2. Select one or more endpoints diff --git a/views/significant_fragments.haml b/views/significant_fragments.haml deleted file mode 100644 index bd3598d..0000000 --- a/views/significant_fragments.haml +++ /dev/null @@ -1,66 +0,0 @@ -%div.modal-body{:style=>"padding:10px;"} - %button.close{ :type=>" button", data: { dismiss:"modal"}} × - - if @type =~ /classification/i - %div.row - %div.col-md-4 - %h3{:style=>"margin-left:8px;"} - Significant fragments: - %img{:src=>"#{@compound.uri}/image", :alt=>"#{@compound.smiles}", :title=>"#{@compound.smiles}", :width=>"300px", :heigth=>"300px"} - - if !@significant_fragments.empty? - %div.col-md-8 - %table{:id => "sf"} - %tr - / @value_map => hash; interpret the effect - %th{:style=>"border:2px solid #E6E6E6;"} - Predominantly in compounds with activity "inactive" - %th{:style=>"border:2px solid #E6E6E6;"} - p value - - @significant_fragments.each do |fragments| - / fragments == [effect, smarts, pValue] - / fragments[0] = effect - /- $logger.debug "effect:\t#{fragments[0]}\n" - - if fragments[0] == @value_map.index("inactive") - %tr - %td - / fragments[1] = smarts - = fragments[1] - -#%img{:src => "http://smartsview.de/smartsview/auto/png/1/both/#{CGI.escape(fragments[1])}", :class => "smarts"} - %td - /fragments[2] = pValue - = fragments[2] - %tr - %th{:style=>"border:2px solid #E6E6E6;"} - Predominantly in compounds with activity "active" - %th{:style=>"border:2px solid #E6E6E6;"} - p value - - @significant_fragments.each do |fragments| - / fragments == [effect, smarts, pValue] - - if fragments[0] == @value_map.index("active") - %tr - %td - -#%img{:src => "http://smartsview.de/smartsview/auto/png/1/both/#{CGI.escape(fragments[1])}", :class => "smarts"} - = fragments[1] - %td - = fragments[2] - %br - - if @type =~ /regression/i - %div.row - %div.col-md-4 - %h3 - Descriptors: - %img{:src=>"#{@compound.uri}/image", :alt=>"#{@compound.smiles}", :title=>"#{@compound.smiles}", :width=>"300px", :heigth=>"300px"} - - if !@significant_fragments.empty? - %div.col-md-8 - %table{:id =>"de"} - %tr - %th{:style=>"border:2px solid #E6E6E6;"} - Descriptor - %th{:style=>"border:2px solid #E6E6E6;"} - value - - @significant_fragments.each do |fragments| - %tr - %td - = fragments[0] - %td - = fragments[1][0].round(3) - %br |