refactor results javascript, fixes bug with results archive [fixes SCI-1262] prevents duplicate request [fixes SCI-1248]

app/assets/javascripts/my_modules/results.js.erb

@@ -88,7 +88,7 @@
 
     // Toggle editing buttons
     function toggleResultEditButtons(show) {
-      if (show) {
+      if(show) {
         $('#results-toolbar').show();
         $('.edit-result-button').show();
       } else {
@@ -194,6 +194,29 @@
       }
     }
 
+    // init cancel button
+    function initCancelFormButton(form, callback) {
+      $(form).find('.cancel-new').click(function(event) {
+        event.preventDefault();
+        event.stopPropagation();
+        event.stopImmediatePropagation();
+        $(form).remove();
+        toggleResultEditButtons(true);
+        callback();
+      });
+    }
+
+    function archive(e, element) {
+      e.preventDefault();
+      e.stopPropagation();
+      e.stopImmediatePropagation();
+      var el = $(element);
+      if(confirm(el.data('confirm-text'))) {
+        animateSpinner();
+        $('#' + el.data('form-id')).submit();
+      }
+    }
+
     var publicAPI = Object.freeze({
       init: init,
       initHandsOnTables: initHandsOnTables,
@@ -201,7 +224,9 @@
       toggleResultEditButtons: toggleResultEditButtons,
       expandResult: expandResult,
       processResult: processResult,
-      ResultTypeEnum: ResultTypeEnum
+      ResultTypeEnum: ResultTypeEnum,
+      initCancelFormButton: initCancelFormButton,
+      archive: archive
     });
 
     return publicAPI;

app/assets/javascripts/results/result_assets.js

@@ -4,24 +4,32 @@
   var ResutlAssets = (function() {
     // New result asset behaviour
     function initNewResultAsset() {
-      $('#new-result-asset').on('ajax:success', function(e, data) {
-        debugger;
-        var $form = $(data.html);
-        $('#results').prepend($form);
+      $('#new-result-asset').on('click', function(event) {
+        event.preventDefault();
+        event.stopImmediatePropagation();
+        event.stopPropagation();
+        var $btn = $(this);
+        $btn.off();
+        animateSpinner(null, true);
 
-        _formAjaxResultAsset($form);
-
-        // Cancel button
-        $form.find('.cancel-new').click(function () {
-          $form.remove();
-          Results.toggleResultEditButtons(true);
+        // get new result form
+        $.ajax({
+          url: $btn.data('href'),
+          method: 'GET',
+          success: function(data) {
+            var $form = $(data.html);
+            animateSpinner(null, false);
+            $('#results').prepend($form);
+            _formAjaxResultAsset($form);
+            Results.initCancelFormButton($form, initNewResultAsset);
+            Results.toggleResultEditButtons(false);
+            $('#result_name').focus();
+          },
+          error: function() {
+            animateSpinner(null, false);
+            initNewResultAsset();
+          }
         });
-
-        Results.toggleResultEditButtons(false);
-
-        $('#result_name').focus();
-      }).on('ajax:error', function(e, xhr, status, error) {
-        animateSpinner(null, false);
       });
     }
 
@@ -65,6 +73,7 @@
         Results.expandResult($newResult);
         initPreviewModal();
         Comments.initialize();
+        initNewResultAsset();
       }).on('ajax:error', function(e, data) {
         // This check is here only because of remotipart bug, which returns
         // HTML instead of JSON, go figure

app/assets/javascripts/results/result_tables.js.erb

@@ -52,6 +52,7 @@
           Results.toggleResultEditButtons(true);
           Results.expandResult($result);
           Comments.initialize();
+          initNewResultTable();
         });
         $form.on('ajax:error', function(e, xhr, status, error) {
           var data = xhr.responseJSON;
@@ -88,23 +89,33 @@
 
       // New result text behaviour
       function initNewResultTable() {
-        $('#new-result-table').on('ajax:success', function(e, data) {
-          var $form = $(data.html);
-          $('#results').prepend($form);
-
-          _formAjaxResultTable($form);
-          _initEditableHandsOnTable($form);
-          _onSubmitExtractTable($form);
-
-          // Cancel button
-          $form.find('.cancel-new').click(function () {
-            $form.remove();
-            Results.toggleResultEditButtons(true);
+        $('#new-result-table').on('click', function(event) {
+          event.preventDefault();
+          event.stopImmediatePropagation();
+          event.stopPropagation();
+          var $btn = $(this);
+          $btn.off();
+          animateSpinner(null, true);
+          // get new result form
+          $.ajax({
+            url: $btn.data('href'),
+            method: 'GET',
+            success: function(data) {
+              var $form = $(data.html);
+              animateSpinner(null, false);
+              $('#results').prepend($form);
+              _formAjaxResultTable($form);
+              _initEditableHandsOnTable($form);
+              _onSubmitExtractTable($form);
+              Results.initCancelFormButton($form, initNewResultTable);
+              Results.toggleResultEditButtons(false);
+              $('#result_name').focus();
+            },
+            error: function() {
+              animateSpinner(null, false);
+              initNewResultTable();
+            }
           });
-
-          Results.toggleResultEditButtons(false);
-
-          $('#result_name').focus();
         });
       }
 

app/assets/javascripts/results/result_texts.js

@@ -4,80 +4,91 @@
   var ResultText = (function() {
     // New result text behaviour
     function initNewReslutText() {
-      $('#new-result-text').on('ajax:success', function(e, data) {
-          var $form = $(data.html);
-          $('#results').prepend($form);
+      $('#new-result-text').on('click', function(event) {
+        event.preventDefault();
+        event.stopImmediatePropagation();
+        event.stopPropagation();
+        var $btn = $(this);
+        $btn.off();
+        animateSpinner(null, true);
 
-          _formAjaxResultText($form);
-
-          // Cancel button
-          $form.find('.cancel-new').click(function() {
-              $form.remove();
-              Results.toggleResultEditButtons(true);
-          });
-          Results.toggleResultEditButtons(false);
-          TinyMCE.refresh();
-          TinyMCE.highlight();
-          $('#result_name').focus();
-      }).on('ajax:error', function() {
-          TinyMCE.refresh();
+        // get new result form
+        $.ajax({
+          url: $btn.data('href'),
+          method: 'GET',
+          success: function(data) {
+            var $form = $(data.html);
+            animateSpinner(null, false);
+            $('#results').prepend($form);
+            _formAjaxResultText($form);
+            Results.initCancelFormButton($form, initNewReslutText);
+            Results.toggleResultEditButtons(false);
+            TinyMCE.refresh();
+            TinyMCE.highlight();
+            $('#result_name').focus();
+          },
+          error: function() {
+            animateSpinner(null, false);
+            initNewReslutText();
+          }
+        })
       });
     }
 
-
     // Edit result text button behaviour
     function applyEditResultTextCallback() {
-        $('.edit-result-text').on('ajax:success', function(e, data) {
-            var $result = $(this).closest('.result');
-            var $form = $(data.html);
-            var $prevResult = $result;
-            $result.after($form);
-            $result.remove();
+      $('.edit-result-text').on('ajax:success', function(e, data) {
+        var $result = $(this).closest('.result');
+        var $form = $(data.html);
+        var $prevResult = $result;
+        $result.after($form);
+        $result.remove();
 
-            _formAjaxResultText($form);
+        _formAjaxResultText($form);
 
-            // Cancel button
-            $form.find('.cancel-edit').click(function () {
-                $form.after($prevResult);
-                $form.remove();
-                applyEditResultTextCallback();
-                Results.toggleResultEditButtons(true);
-            });
-            Results.toggleResultEditButtons(false);
-            TinyMCE.refresh();
-            $('#result_name').focus();
+        // Cancel button
+        $form.find('.cancel-edit').click(function() {
+          $form.after($prevResult);
+          $form.remove();
+          applyEditResultTextCallback();
+          Results.toggleResultEditButtons(true);
         });
+        Results.toggleResultEditButtons(false);
+        TinyMCE.refresh();
+        $('#result_name').focus();
+      });
     }
 
     // Apply ajax callback to form
     function _formAjaxResultText($form) {
-        $form.on('ajax:success', function(e, data) {
-            $form.after(data.html);
-            var newResult = $form.next();
-            initFormSubmitLinks(newResult);
-            $(this).remove();
+      $form.on('ajax:success', function(e, data) {
+        $form.after(data.html);
+        var newResult = $form.next();
+        initFormSubmitLinks(newResult);
+        $(this).remove();
 
-            applyEditResultTextCallback();
-            Results.applyCollapseLinkCallBack();
-            Results.toggleResultEditButtons(true);
-            Results.expandResult(newResult);
-            TinyMCE.destroyAll();
-            Comments.initialize();
-        });
-        $form.on('ajax:error', function(e, xhr, status, error) {
-            var data = xhr.responseJSON;
-            $form.renderFormErrors('result', data);
-            TinyMCE.highlight();
-            if (data['result_text.text']) {
-                var $el = $form.find(
-                  'textarea[name=result\\[result_text_attributes\\]\\[text\\]]'
-                );
+        applyEditResultTextCallback();
+        Results.applyCollapseLinkCallBack();
+        Results.toggleResultEditButtons(true);
+        Results.expandResult(newResult);
+        TinyMCE.destroyAll();
+        Comments.initialize();
+        initNewReslutText();
+      });
+      $form.on('ajax:error', function(e, xhr, status, error) {
+        var data = xhr.responseJSON;
+        $form.renderFormErrors('result', data);
+        TinyMCE.highlight();
+        if (data['result_text.text']) {
+          var $el = $form.find(
+            'textarea[name=result\\[result_text_attributes\\]\\[text\\]]'
+          );
 
-                $el.closest('.form-group').addClass('has-error');
-                $el.parent().append('<span class=\'help-block\'>' +
-                  data['result_text.text'] + '</span>');
-            }
-        });
+          $el.closest('.form-group').addClass('has-error');
+          $el.parent().append('<span class=\'help-block\'>' +
+            data['result_text.text'] + '</span>');
+        }
+      });
     }
 
     var publicAPI = Object.freeze({
@@ -92,5 +103,4 @@
     ResultText.initNewReslutText();
     ResultText.applyEditResultTextCallback();
   });
-
 })();

app/views/my_modules/_result.html.erb

@@ -19,7 +19,12 @@
           </a>
         <% end %>
         <% if can_archive_result(result) && !result.archived && result_unlocked?(result) %>
-          <a href="#" class="btn btn-link form-submit-link" data-submit-form="result-archive-form-<%= result.id %>" data-confirm-form="<%= t('my_modules.results.archive_confirm') %>" title="<%= t'my_modules.results.options.archive_title' %>">
+          <a href="#"
+             class="btn btn-link form-submit-link"
+             data-form-id="result-archive-form-<%= result.id %>"
+             data-confirm-text="<%= t('my_modules.results.archive_confirm') %>"
+             title="<%= t'my_modules.results.options.archive_title' %>"
+             onclick="Results.archive(event, this);">
             <span class="glyphicon glyphicon-briefcase"></span>
           </a>
           <%= form_for :result, url: result_path_of_type(result), method: :patch, html: {id: 'result-archive-form-' + result.id.to_s } do |f| %>