From de6c03a73bf40173a86dc6751517166866d146e3 Mon Sep 17 00:00:00 2001
From: zmagod <zmago_devetak@yahoo.com>
Date: Thu, 1 Sep 2016 16:52:42 +0200
Subject: [PATCH 1/8] setup experiment modal input validation

---
 .../javascripts/experiments/dropdown_actions.js      | 12 +++++++++++-
 app/views/experiments/_form.html.erb                 | 10 ++++++++--
 2 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/app/assets/javascripts/experiments/dropdown_actions.js b/app/assets/javascripts/experiments/dropdown_actions.js
index 1034e7284..8b5925df8 100644
--- a/app/assets/javascripts/experiments/dropdown_actions.js
+++ b/app/assets/javascripts/experiments/dropdown_actions.js
@@ -1,9 +1,10 @@
-
 (function(){
 
   // Create ajax hook on given 'element', which should return modal with 'id' =>
   // show that modal
   function initializeModal(element, id){
+
+    // Initializev new experiment modal listner
     $(element)
     .on("ajax:beforeSend", function(){
       animateSpinner();
@@ -15,6 +16,7 @@
         keyboard: false,
       });
       validateMoveModal(id);
+      validateExperimentForm();
     })
     .on("ajax:error", function() {
       animateSpinner(null, false);
@@ -63,6 +65,14 @@
       })
       .clearFormErrors();
     }
+  // Setup front-end validations for experiment form
+  function validateExperimentForm(){
+    var form = $("#new-experiment-modal").find("form");
+    form.on('submit', function(ev){
+      textValidator(ev, $('#new-experiment-name'), false);
+      textValidator(ev, $('#new-experiment-description'), true);
+    });
+    form.clearFormErrors();
   }
   // Initialize no description edit link
   function initEditNoDescription(){
diff --git a/app/views/experiments/_form.html.erb b/app/views/experiments/_form.html.erb
index 29732c85f..ab78ede99 100644
--- a/app/views/experiments/_form.html.erb
+++ b/app/views/experiments/_form.html.erb
@@ -1,7 +1,11 @@
 <div class="row">
   <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
     <div  class="form-group">
-      <%= form.text_field :name, label: t("experiments.new.name"), autofocus: true, placeholder: t("experiments.new.name_placeholder") %>
+      <%= form.text_field :name,
+                          label: t("experiments.new.name"),
+                          autofocus: true,
+                          placeholder: t("experiments.new.name_placeholder"),
+                          id: 'new-experiment-name'%>
     </div>
   </div>
 </div>
@@ -9,7 +13,9 @@
 <div class="row">
   <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
     <div class="form-group">
-      <%= form.text_area :description, label: t('experiments.new.description') %>
+      <%= form.text_area :description,
+                         label: t('experiments.new.description'),
+                         id: 'new-experiment-description' %>
     </div>
   </div>
 </div>

From 9d469f90922faa0199007454a4e49e52add86bd8 Mon Sep 17 00:00:00 2001
From: zmagod <zmago_devetak@yahoo.com>
Date: Fri, 2 Sep 2016 11:46:48 +0200
Subject: [PATCH 2/8] sets front end validation for new experiment modal [fixes
 SCI-348]

---
 .../experiments/dropdown_actions.js           | 27 ++++++++++++++++---
 app/controllers/experiments_controller.rb     | 13 ++++++---
 app/views/experiments/_new_modal.html.erb     |  2 +-
 3 files changed, 35 insertions(+), 7 deletions(-)

diff --git a/app/assets/javascripts/experiments/dropdown_actions.js b/app/assets/javascripts/experiments/dropdown_actions.js
index 8b5925df8..efa7ae741 100644
--- a/app/assets/javascripts/experiments/dropdown_actions.js
+++ b/app/assets/javascripts/experiments/dropdown_actions.js
@@ -68,11 +68,32 @@
   // Setup front-end validations for experiment form
   function validateExperimentForm(){
     var form = $("#new-experiment-modal").find("form");
-    form.on('submit', function(ev){
+    form
+    .on('ajax:success' , function(){
+      animateSpinner(form, true);
+      location.reload();
+    })
+    .on('ajax:error', function(e, error){
+      var msg = JSON.parse(error.responseText);
+      if ( 'name' in msg ) {
+        renderFormError(e,
+                        $('#new-experiment-name'),
+                        msg.name.toString());
+      } else if ( 'description' in msg ) {
+        renderFormError(e,
+                        $('#new-experiment-description'),
+                        msg.description.toString());
+      } else {
+        renderFormError(e,
+                        $('#new-experiment-name'),
+                        error.statusText);
+      }
+    })
+    .on('submit', function(ev) {
       textValidator(ev, $('#new-experiment-name'), false);
       textValidator(ev, $('#new-experiment-description'), true);
-    });
-    form.clearFormErrors();
+    })
+    .clearFormErrors();
   }
   // Initialize no description edit link
   function initEditNoDescription(){
diff --git a/app/controllers/experiments_controller.rb b/app/controllers/experiments_controller.rb
index dedbac645..16a70aef9 100644
--- a/app/controllers/experiments_controller.rb
+++ b/app/controllers/experiments_controller.rb
@@ -39,10 +39,17 @@ class ExperimentsController < ApplicationController
     if @experiment.save
       flash[:success] = t('experiments.create.success_flash',
                           experiment: @experiment.name)
-      redirect_to canvas_experiment_path(@experiment)
+      respond_to do |format|
+        format.json do
+          render json: {}, status: :ok
+        end
+      end
     else
-      flash[:alert] = t('experiments.create.error_flash')
-      redirect_to :back
+      respond_to do |format|
+        format.json do
+          render json: @experiment.errors, status: :unprocessable_entity
+        end
+      end
     end
   end
 
diff --git a/app/views/experiments/_new_modal.html.erb b/app/views/experiments/_new_modal.html.erb
index 598f202a4..959786049 100644
--- a/app/views/experiments/_new_modal.html.erb
+++ b/app/views/experiments/_new_modal.html.erb
@@ -1,6 +1,6 @@
 <!-- New experiment modal -->
 <div class="modal" id="new-experiment-modal" tabindex="-1" role="dialog" aria-labelledby="new-experiment-modal-label">
-  <%= bootstrap_form_for [@project, @experiment] do |f| %>
+  <%= bootstrap_form_for [@project, @experiment], remote: true do |f| %>
     <div class="modal-dialog" role="document">
       <div class="modal-content">
         <div class="modal-header">

From b44a284b5419bbf95171e24dc7cb10b0c2ff524f Mon Sep 17 00:00:00 2001
From: zmagod <zmago_devetak@yahoo.com>
Date: Fri, 2 Sep 2016 14:13:59 +0200
Subject: [PATCH 3/8] sets edit experiment validation

---
 .../experiments/dropdown_actions.js           | 64 ++++++++++---------
 app/controllers/experiments_controller.rb     | 13 +++-
 app/views/experiments/_edit_modal.html.erb    |  2 +-
 app/views/experiments/_form.html.erb          |  4 +-
 4 files changed, 47 insertions(+), 36 deletions(-)

diff --git a/app/assets/javascripts/experiments/dropdown_actions.js b/app/assets/javascripts/experiments/dropdown_actions.js
index efa7ae741..ba69012ff 100644
--- a/app/assets/javascripts/experiments/dropdown_actions.js
+++ b/app/assets/javascripts/experiments/dropdown_actions.js
@@ -16,7 +16,7 @@
         keyboard: false,
       });
       validateMoveModal(id);
-      validateExperimentForm();
+      validateExperimentForm($(id));
     })
     .on("ajax:error", function() {
       animateSpinner(null, false);
@@ -63,37 +63,41 @@
                         form.find("#experiment_project_id"),
                         msg.message.toString());
       })
-      .clearFormErrors();
+      on('submit', function(){
+        form.clearFormErrors();
+      });
     }
   // Setup front-end validations for experiment form
-  function validateExperimentForm(){
-    var form = $("#new-experiment-modal").find("form");
-    form
-    .on('ajax:success' , function(){
-      animateSpinner(form, true);
-      location.reload();
-    })
-    .on('ajax:error', function(e, error){
-      var msg = JSON.parse(error.responseText);
-      if ( 'name' in msg ) {
-        renderFormError(e,
-                        $('#new-experiment-name'),
-                        msg.name.toString());
-      } else if ( 'description' in msg ) {
-        renderFormError(e,
-                        $('#new-experiment-description'),
-                        msg.description.toString());
-      } else {
-        renderFormError(e,
-                        $('#new-experiment-name'),
-                        error.statusText);
-      }
-    })
-    .on('submit', function(ev) {
-      textValidator(ev, $('#new-experiment-name'), false);
-      textValidator(ev, $('#new-experiment-description'), true);
-    })
-    .clearFormErrors();
+  function validateExperimentForm(element){
+    if ( element ) {
+      var form = element.find("form");
+      form
+      .on('ajax:success' , function(){
+        animateSpinner(form, true);
+        location.reload();
+      })
+      .on('ajax:error', function(e, error){
+        var msg = JSON.parse(error.responseText);
+        if ( 'name' in msg ) {
+          renderFormError(e,
+                          element.find("#experiment-name"),
+                          msg.name.toString());
+        } else if ( 'description' in msg ) {
+          renderFormError(e,
+                          element.find("#experiment-description"),
+                          msg.description.toString());
+        } else {
+          renderFormError(e,
+                          element.find("#experiment-name"),
+                          error.statusText);
+        }
+      })
+      .on('submit', function(ev) {
+        textValidator(ev, element.find("#experiment-name"), false);
+        textValidator(ev, element.find("#experiment-description"), true);
+      })
+      .clearFormErrors();
+    }
   }
   // Initialize no description edit link
   function initEditNoDescription(){
diff --git a/app/controllers/experiments_controller.rb b/app/controllers/experiments_controller.rb
index 16a70aef9..ed5b37785 100644
--- a/app/controllers/experiments_controller.rb
+++ b/app/controllers/experiments_controller.rb
@@ -76,10 +76,17 @@ class ExperimentsController < ApplicationController
       @experiment.touch(:workflowimg_updated_at)
       flash[:success] = t('experiments.update.success_flash',
                           experiment: @experiment.name)
-      redirect_to canvas_experiment_path(@experiment)
+      respond_to do |format|
+        format.json do
+          render json: {}, status: :ok
+        end
+      end
     else
-      flash[:alert] = t('experiments.update.error_flash')
-      redirect_to :back
+      respond_to do |format|
+        format.json do
+          render json: @experiment.errors, status: :unprocessable_entity
+        end
+      end
     end
   end
 
diff --git a/app/views/experiments/_edit_modal.html.erb b/app/views/experiments/_edit_modal.html.erb
index b3a362e29..b2a1c3e85 100644
--- a/app/views/experiments/_edit_modal.html.erb
+++ b/app/views/experiments/_edit_modal.html.erb
@@ -4,7 +4,7 @@
      tabindex="-1"
      role="dialog"
      aria-labelledby="edit-experiment-modal-label">
-  <%= bootstrap_form_for [@project, @experiment] do |f| %>
+  <%= bootstrap_form_for [@project, @experiment], remote: true do |f| %>
     <div class="modal-dialog" role="document">
       <div class="modal-content">
         <div class="modal-header">
diff --git a/app/views/experiments/_form.html.erb b/app/views/experiments/_form.html.erb
index ab78ede99..eb9e5dd1b 100644
--- a/app/views/experiments/_form.html.erb
+++ b/app/views/experiments/_form.html.erb
@@ -5,7 +5,7 @@
                           label: t("experiments.new.name"),
                           autofocus: true,
                           placeholder: t("experiments.new.name_placeholder"),
-                          id: 'new-experiment-name'%>
+                          id: 'experiment-name'%>
     </div>
   </div>
 </div>
@@ -15,7 +15,7 @@
     <div class="form-group">
       <%= form.text_area :description,
                          label: t('experiments.new.description'),
-                         id: 'new-experiment-description' %>
+                         id: 'experiment-description' %>
     </div>
   </div>
 </div>

From b672d854058eaacb0a0ccb45fa12792ba10e4c97 Mon Sep 17 00:00:00 2001
From: zmagod <zmago_devetak@yahoo.com>
Date: Tue, 6 Sep 2016 11:33:09 +0200
Subject: [PATCH 4/8] fixed error message duplication

---
 .../javascripts/experiments/dropdown_actions.js      | 12 ++++++++----
 app/models/experiment.rb                             |  2 +-
 2 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/app/assets/javascripts/experiments/dropdown_actions.js b/app/assets/javascripts/experiments/dropdown_actions.js
index ba69012ff..00ee76002 100644
--- a/app/assets/javascripts/experiments/dropdown_actions.js
+++ b/app/assets/javascripts/experiments/dropdown_actions.js
@@ -93,12 +93,16 @@
         }
       })
       .on('submit', function(ev) {
-        textValidator(ev, element.find("#experiment-name"), false);
-        textValidator(ev, element.find("#experiment-description"), true);
-      })
-      .clearFormErrors();
+        form.clearFormErrors();
+      });
+
+      $("#new-experiment-modal").on("hidden.bs.modal", function (){
+        form.clearFormErrors();
+      });
+
     }
   }
+
   // Initialize no description edit link
   function initEditNoDescription(){
     var modal = "#edit-experiment-modal-";
diff --git a/app/models/experiment.rb b/app/models/experiment.rb
index 5723fdea1..2717ebbf4 100644
--- a/app/models/experiment.rb
+++ b/app/models/experiment.rb
@@ -21,7 +21,7 @@ class Experiment < ActiveRecord::Base
             presence: true,
             length: { minimum: 4, maximum: 50 },
             uniqueness: { scope: :project, case_sensitive: false }
-  validates :description, length: { maximum: 255 }
+  validates :description, length: { maximum: 50 }
   validates :project, presence: true
   validates :created_by, presence: true
   validates :last_modified_by, presence: true

From a5a24c7610948c4d13b1d5f2f5fbf20d88603ddf Mon Sep 17 00:00:00 2001
From: zmagod <zmago_devetak@yahoo.com>
Date: Tue, 6 Sep 2016 11:34:47 +0200
Subject: [PATCH 5/8] clear unused variable

---
 app/assets/javascripts/experiments/dropdown_actions.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/assets/javascripts/experiments/dropdown_actions.js b/app/assets/javascripts/experiments/dropdown_actions.js
index 00ee76002..9f2072dfe 100644
--- a/app/assets/javascripts/experiments/dropdown_actions.js
+++ b/app/assets/javascripts/experiments/dropdown_actions.js
@@ -92,7 +92,7 @@
                           error.statusText);
         }
       })
-      .on('submit', function(ev) {
+      .on('submit', function() {
         form.clearFormErrors();
       });
 

From 856d2269467651381624e538895d7a940474568b Mon Sep 17 00:00:00 2001
From: zmagod <zmago_devetak@yahoo.com>
Date: Tue, 6 Sep 2016 11:48:56 +0200
Subject: [PATCH 6/8] fixed move experiment form error duplication

---
 app/assets/javascripts/experiments/dropdown_actions.js | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/app/assets/javascripts/experiments/dropdown_actions.js b/app/assets/javascripts/experiments/dropdown_actions.js
index 9f2072dfe..e08bf5fdf 100644
--- a/app/assets/javascripts/experiments/dropdown_actions.js
+++ b/app/assets/javascripts/experiments/dropdown_actions.js
@@ -63,7 +63,11 @@
                         form.find("#experiment_project_id"),
                         msg.message.toString());
       })
-      on('submit', function(){
+      .on('submit', function(){
+        form.clearFormErrors();
+      });
+
+      $(modal).on("hidden.bs.modal", function (){
         form.clearFormErrors();
       });
     }

From daa144ce7cf5d962f472a121315822ca1245e19d Mon Sep 17 00:00:00 2001
From: zmagod <zmago_devetak@yahoo.com>
Date: Tue, 6 Sep 2016 11:57:03 +0200
Subject: [PATCH 7/8] added missing bracket

---
 app/assets/javascripts/experiments/dropdown_actions.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/app/assets/javascripts/experiments/dropdown_actions.js b/app/assets/javascripts/experiments/dropdown_actions.js
index e08bf5fdf..f0a48806d 100644
--- a/app/assets/javascripts/experiments/dropdown_actions.js
+++ b/app/assets/javascripts/experiments/dropdown_actions.js
@@ -71,6 +71,7 @@
         form.clearFormErrors();
       });
     }
+  }
   // Setup front-end validations for experiment form
   function validateExperimentForm(element){
     if ( element ) {

From 6eca3661bfd19e3543b59b2850c3eb049408f1ad Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Matej=20Zrim=C5=A1ek?= <mzrimsek@biosistemika.com>
Date: Thu, 8 Sep 2016 12:43:31 +0200
Subject: [PATCH 8/8] Some JS error refactoring and accordingly updated error
 rendering when experiment description is too long.

---
 .../experiments/dropdown_actions.js           | 27 ++++++-------------
 .../javascripts/sitewide/form_errors.js       | 16 ++++++++---
 .../sitewide/form_validators.js.erb           |  4 +--
 3 files changed, 23 insertions(+), 24 deletions(-)

diff --git a/app/assets/javascripts/experiments/dropdown_actions.js b/app/assets/javascripts/experiments/dropdown_actions.js
index f0a48806d..f6956737e 100644
--- a/app/assets/javascripts/experiments/dropdown_actions.js
+++ b/app/assets/javascripts/experiments/dropdown_actions.js
@@ -61,15 +61,9 @@
         var msg = JSON.parse(error.responseText);
         renderFormError(e,
                         form.find("#experiment_project_id"),
-                        msg.message.toString());
+                        msg.message.toString(),
+                        true);
       })
-      .on('submit', function(){
-        form.clearFormErrors();
-      });
-
-      $(modal).on("hidden.bs.modal", function (){
-        form.clearFormErrors();
-      });
     }
   }
   // Setup front-end validations for experiment form
@@ -86,25 +80,20 @@
         if ( 'name' in msg ) {
           renderFormError(e,
                           element.find("#experiment-name"),
-                          msg.name.toString());
+                          msg.name.toString(),
+                          true);
         } else if ( 'description' in msg ) {
           renderFormError(e,
                           element.find("#experiment-description"),
-                          msg.description.toString());
+                          msg.description.toString(),
+                          true);
         } else {
           renderFormError(e,
                           element.find("#experiment-name"),
-                          error.statusText);
+                          error.statusText,
+                          true);
         }
       })
-      .on('submit', function() {
-        form.clearFormErrors();
-      });
-
-      $("#new-experiment-modal").on("hidden.bs.modal", function (){
-        form.clearFormErrors();
-      });
-
     }
   }
 
diff --git a/app/assets/javascripts/sitewide/form_errors.js b/app/assets/javascripts/sitewide/form_errors.js
index 8695dcf6d..5f9707cbc 100644
--- a/app/assets/javascripts/sitewide/form_errors.js
+++ b/app/assets/javascripts/sitewide/form_errors.js
@@ -33,9 +33,21 @@ $.fn.renderFormErrors = function (modelName, errors, clear, ev) {
  * and, if present, mark and show the tab where the error occured and
  * focus/scroll to the error input, if it is the first one to be
  * specified or if errMsgs is undefined.
+ *
+ * @param {string} errAttributes Span element (error) attributes
+ * @param {boolean} clearErr Set clearErr to true if this is the only
+ * error that can happen/show.
  */
-var renderFormError = function (ev, input, errMsgs, errAttributes) {
+var renderFormError = function (ev, input, errMsgs, clearErr, errAttributes) {
+  clearErr = _.isUndefined(clearErr) ? false : clearErr;
+  errAttributes = _.isUndefined(errAttributes) ? "" : " " + errAttributes;
+  $form = $(input).closest("form");
+
   if (!_.isUndefined(errMsgs)) {
+    if (clearErr) {
+      $form.clearFormErrors();
+    }
+
     // Mark error form group
     $formGroup = $(input).closest(".form-group");
     if (!$formGroup.hasClass("has-error")) {
@@ -43,7 +55,6 @@ var renderFormError = function (ev, input, errMsgs, errAttributes) {
     }
 
     // Add error message/s
-    errAttributes = _.isUndefined(errAttributes) ? "" : " " + errAttributes;
     error_text = ($.makeArray(errMsgs).map(function (m) {
       return m.strToErrorFormat();
     })).join("<br />");
@@ -51,7 +62,6 @@ var renderFormError = function (ev, input, errMsgs, errAttributes) {
     $formGroup.append($errSpan);
   }
 
-  $form = $(input).closest("form");
   $tab = $(input).closest(".tab-pane");
   if ($tab.length) {
     // Mark error tab
diff --git a/app/assets/javascripts/sitewide/form_validators.js.erb b/app/assets/javascripts/sitewide/form_validators.js.erb
index f42afec50..bd96677cc 100644
--- a/app/assets/javascripts/sitewide/form_validators.js.erb
+++ b/app/assets/javascripts/sitewide/form_validators.js.erb
@@ -95,7 +95,7 @@ function filesPresentValidator(ev, fileInputs) {
   _.each(fileInputs, function(fileInput) {
     if (!fileInput.files[0]) {
       assetError = I18n.t("general.file.blank");
-      renderFormError(ev, fileInput, assetError, "data-error='file-missing'");
+      renderFormError(ev, fileInput, assetError, false, "data-error='file-missing'");
       filesPresentValid = false;
     }
   });
@@ -125,7 +125,7 @@ function filesSizeValidator(ev, fileInputs, fileTypeEnum) {
     var file = fileInput.files[0];
     var assetError = getFileTooBigError(file);
     if (assetError) {
-      renderFormError(ev, fileInput, assetError, "data-error='file-size'");
+      renderFormError(ev, fileInput, assetError, false, "data-error='file-size'");
       filesSizeValid = false;
     }
   });