check input

3 files changed, 47 insertions, 16 deletions

diff --git a/views/layout.haml b/views/layout.haml
index 6366ae6..a12b324 100644
--- a/views/layout.haml
+++ b/views/layout.haml
@@ -8,15 +8,16 @@
     %link{:rel=>"stylesheet", :href=>"/stylesheets/jquery-ui.css"}
     %script{:src=>"/javascripts/jquery-1.9.1.min.js"}
     %script{ :src=>"/javascripts/jquery-ui.js"}
+    %script{ :src=>"/javascripts/lazar-gui.js"}
     
 
   %body
     .logo
-      %a{:href=> "http://www.in-silico.ch/", :target=>"_blank"}
+      %a{:href=> "http://www.in-silico.ch/", :rel=> "external"}
         %img{:src=>"/images/ist_logo.png"}
       %h1 Lazar Toxicity Predictions
     
-    .content
+    .content    
       = yield
     
     .footer
diff --git a/views/neighbours.haml b/views/neighbours.haml
index 6170d43..cb30481 100644
--- a/views/neighbours.haml
+++ b/views/neighbours.haml
@@ -1,43 +1,52 @@
+/ @@prediction_models and @@predictions defined in POST request '/predict'
+/ unpacks multi prediction array ;
+/ prepare it for neighbours ;
+/ align single prediction to endpoint ;
+/ display preordered in table view ;
+/ loaded in iframe, necessary to load js/css here ;
 %link{ :href=>"/stylesheets/screen.css", :media=>"screen, projection", :rel=>"stylesheet", :type=>"text/css"}
 %link{:rel=>"stylesheet", :href=>"http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css"}
 %script{:src=>"http://code.jquery.com/jquery-1.9.1.js"}
 %script{ :src=>"http://code.jquery.com/ui/1.10.0/jquery-ui.js"}
 %script{:src=>"/javascripts/jquery.tablesorter.min.js"}
- 
+/ main class in stylesheet ;
 .results
   - count_m = 0
+  / js function for tabs div with preseleted tab by link id ;
   :javascript
     $(function() {
       $("#tabs").tabs({ active: '#{params[:id]}' });
     });
+  / tabs div ;
   #tabs
     %ul
+      / each endpoint becomes a tab head ;
       - @@prediction_models.each do |m|
         - count_m += 1
         %li
           %a{:href => "#results_#{count_m}", :id => "link#{m.title}"}
             = m.title
     - count_rs = 0
+    / unpack to single arrays
     - @@predictions.each do |pa|
       - count_rs += 1
       #results{:id=>"#{count_rs}"}
         - pa.each do |p|
           / get prediction OpenTox::Dataset   
           - p.get
-          / prepare dataset for neighbours table
+          / prepare dataset for neighbours table ;
+          / delete first array which contains input compound prediction ;
+          / keep the following arrays they are the neighbour predictions ;
           - p.data_entries.shift
           - p.compounds.shift
-          
+          / call the tablesorter plugin ;
+          / presort by similarity ;
           :javascript
             $(document).ready(function(){
-              // call the tablesorter plugin 
               $("table##{count_rs}").tablesorter({
-                // debug for development
                 debug: true,
                 widgets: ['zebra'],
-                // disable first column
                 headers: {0: {sorter: false},3: {sorter: false}},
-                // presort similarity asc
                 sortList: [[2,0]]
               });
             });
@@ -65,6 +74,7 @@
                   = p.data_entries[count][3].round(3)
                   
                 %td
+                  / target is iframe "details", defined in prediction.haml
                   %a{:href => to("/prediction/#{CGI.escape(neighbour_compound.uri)}/details"), :id=>"link#{neighbour_compound.uri}/#{count}", :target=>"details"}
                     %img{:src=>"/images/arrow_right_float.png", :alt=>"arrow"}
                 - count += 1
diff --git a/views/predict.haml b/views/predict.haml
index 8ee3558..064ed60 100644
--- a/views/predict.haml
+++ b/views/predict.haml
@@ -2,10 +2,26 @@
   function getsmiles() {
     if (document.JME.smiles() != '') {
       document.form.identifier.value = document.JME.smiles() ;
-    }
-  }
-
-%form{:name => "form", :action => to('/predict'), :method => "post", :enctype => "multipart/form-data" }
+    };
+  };
+  function checksmiles () {
+    if (document.form.identifier.value == "") {
+      alert("Please insert a compound.")
+      document.form.identifier.focus();
+      return false;
+    };
+    return true;
+  };
+  function checkboxes () {
+    if ($("#model input[type=checkbox]:checked").length < 1 ){
+      alert("Please select an endpoint.")
+      document.getElementById('model').focus();
+      return false;
+    };
+    return true;
+  };
+  
+%form{:name => "form", :action => to('/predict'), :method => "post", :enctype => "multipart/form-data", :onsubmit => "return  !!(checksmiles() & checkboxes())" }
   %fieldset#top
     %a{:href => "#insert", :id => "linkInsert"}
       %h1 1. Draw or insert your compound   
@@ -21,6 +37,7 @@
         %applet{:code => "JME.class", :name => "JME", :archive => "JME.jar", :width => "500", :height => "360"}
           %param{ :name => "options", :value => "polarnitro"}
           Please enable Java and JavaScript in your browser to use the JME editor.
+        %a{:href => "jme_help", :rel => "external"} (help)
         %span{:style=>"font-size:75%"}
           &copy;
           %a{:href => 'http://www.molinspiration.com/jme/index.html', :rel => "external"} JME Editor
@@ -55,7 +72,8 @@
       - @models.each do |model|
         - model.get
         #model
-          %input{:type => 'checkbox', :name => "selection[#{model.title}]", :value => true, :disabled => false}
+          %input{:type => "checkbox", :name => "selection[#{model.title}]", :id => "selection[#{model.title}]", :value => true, :disabled => false}
+          %label{:for => "selection[#{model.title}]"}
             %b= model.title
           %a{:href=>"#", :alt=>"#{model.title} validation"}
             %i Validation Link
@@ -70,6 +88,8 @@
 
   %fieldset#bottom
     %a{:href => "#predict", :id => "linkPredict"}
-      %h1 3. Predict
-      %input{ :type => "submit", :value=>">>", :onclick => "getsmiles();"}
+      %label{:for => "submit"}
+        %h1 3. Predict
+      %input{ :type => "submit", :id => "submit", :value=>">>", :onclick => "getsmiles()"}
+