endpoint selection for create model form

5 files changed, 99 insertions, 12 deletions

diff --git a/application.rb b/application.rb
index 12784f0..3ed2af6 100644
--- a/application.rb
+++ b/application.rb
@@ -232,8 +232,8 @@ end
 
 post '/models' do # create a new model
 
-  unless (params[:dataset] and params[:prediction_feature]) or (params[:file] and params[:file][:tempfile]) #params[:endpoint] and 
-    flash[:notice] = "Please upload a Excel or CSV file or select an AMBIT dataset."
+  unless (params[:dataset] and params[:prediction_feature]) or (params[:endpoint] and params[:file] and params[:file][:tempfile]) #params[:endpoint] and 
+    flash[:notice] = "Please upload a Excel or CSV file and select an endpoint or select an AMBIT dataset."
     redirect url_for('/create')
   end
 
diff --git a/helper.rb b/helper.rb
index 9b47142..234d612 100644
--- a/helper.rb
+++ b/helper.rb
@@ -108,12 +108,39 @@ helpers do
         File.unlink(tmpfile)
       end
     end
-    result = OpenTox::Ontology::Echa.endpoint_option_list()
+    result = endpoint_selection()
     if result.lines.count > 3
       f = File.new(tmpfile,"w")
       f.print result
       f.close
     end
-    return result
+    result
   end
-end
+
+  def endpoint_level(endpoint="Endpoints", level=1)
+    results = OpenTox::Ontology::Echa.echa_endpoints(endpoint) rescue results = []
+    out = ""
+    out += "<ul id='list_#{endpoint}' class='endpoint level_#{level}'>\n" if results.size > 0
+    results.each do |result|
+      r = result.split(',')
+      endpointname = CGI.escape(r.first.split("#").last).gsub(".","")
+      title = r[1..r.size-1].to_s
+      out += "  <li class='level_#{level}'><input type='radio' name='endpoint' value='#{result}' id='#{endpointname}' class='endpoint_list' /><label for='#{endpointname}' id='label_#{endpointname}'>#{title.gsub("\"","")}</label>\n"
+      out += endpoint_level(endpointname, level + 1)
+      out += "</li>\n"
+    end
+    out += "</ul>\n" if results.size > 0
+    return out
+  end
+
+  def endpoint_selection()
+    out = "<span id='endpoint_label'></span><input type='button' id='endpoint_list_button' value='select endpoint' /> \n
+    <div id='div_endpoint'>\n"
+    out += "<b>Please select:</b>\n"
+    out += endpoint_level
+    js = ""
+    out += "</div>\n"
+    return out
+  end
+
+end
\ No newline at end of file
diff --git a/views/create.haml b/views/create.haml
index da85382..acfa098 100644
--- a/views/create.haml
+++ b/views/create.haml
@@ -1,3 +1,30 @@
+:javascript
+  $(document).ready(function() {
+   $(".endpoint_list").click(function() {
+     elem  = this.id;
+     title = $("label#label_" + elem).html();
+     if($("ul#list_" + elem)) {
+       if ($("ul#list_" + elem).is(":hidden")) {
+         $("ul#list_" + elem).slideDown("slow");
+       } else {
+         $("ul#list_" + elem).slideUp("slow");
+       }
+     }
+     $("span#endpoint_label").html(title);
+   });
+   $("#endpoint_list_button").click(function() {
+     if ($("div#div_endpoint").is(":hidden")) {
+       $("div#div_endpoint").slideDown("slow");
+       $("input#endpoint_list_button").val("OK");
+       $("input#endpoint_list_button").toggleClass("ok_button", true);
+     } else {
+       $("div#div_endpoint").slideUp("slow");
+       $("input#endpoint_list_button").val("select endpoint");
+       $("input#endpoint_list_button").toggleClass("ok_button", false);
+     }
+   });
+  });
+
 .input
 
   %p
@@ -25,7 +52,8 @@
         format:
       %input{:type => 'file', :name => 'file', :id => 'file', :size => '41'}
       %br
-      -# = haml :model_echa, :layout => false
+      = haml :model_echa, :layout => false
+    %br
     %input{ :type => "submit", :value => "Create model"}
     =# link_to "Cancel", '/create'
 
diff --git a/views/model_echa.haml b/views/model_echa.haml
index 257a28a..4815c35 100644
--- a/views/model_echa.haml
+++ b/views/model_echa.haml
@@ -1,2 +1,2 @@
-Select an endpoint:
-= endpoint_option_list
\ No newline at end of file
+For endpoint:
+= endpoint_option_list()
\ No newline at end of file
diff --git a/views/style.sass b/views/style.sass
index c2a74cb..0c1f48c 100644
--- a/views/style.sass
+++ b/views/style.sass
@@ -5,6 +5,7 @@ $ot_purple: #5d308a
 $body_color: white
 $text_color: black
 $notice_border: red
+$mouseover: #FFFF69
 
 body
   min-width: 30em
@@ -288,12 +289,43 @@ dl
   .thin
     font-weight: 100
 
+ul.endpoint
+  list-style-type: none
+  margin-left: 0px
+  padding-left: 0px
+
+ul.level_2
+  display: none
+ul.level_3
+  display: none
+ul.level_4
+  display: none
+
 .level_1
-  padding-left: 10px
+  margin-left: 0px
   font-weight: bold
 .level_2
-  padding-left: 20px
+  margin-left: 20px
+  font-weight: normal
 .level_3
-  padding-left: 30px
+  margin-left: 40px
+  font-weight: normal
 .level_4
-  padding-left: 40px
+  margin-left: 60px
+  font-weight: normal
+
+#endpoint_label
+  font-weight: bold
+  margin: 0 10px
+
+ul.endpoint
+  label:hover, label:active
+    background-color: $mouseover
+    border-bottom: solid #999 1px
+    border-top: solid #999 1px
+
+#div_endpoint
+  display: none
+
+.ok_button
+  background-color: $mouseover