2754: Allow editing the same parameter in two different places on the page.

[arvados.git] / apps / workbench / app / assets / javascripts / pipeline_instances.js

diff --git a/apps/workbench/app/assets/javascripts/pipeline_instances.js b/apps/workbench/app/assets/javascripts/pipeline_instances.js
index ee14e3b78127dbdfc79513abc97e4ed4c29b18d8..3209d67782b7fd6fb9760cef5523f6476c62b752 100644 (file)
--- a/apps/workbench/app/assets/javascripts/pipeline_instances.js
+++ b/apps/workbench/app/assets/javascripts/pipeline_instances.js
@@ -1,46 +1,46 @@
+function run_pipeline_button_state() {
+    var a = $('a.editable.required.editable-empty');
+    if (a.length > 0) {
+        $(".run-pipeline-button").addClass("disabled");
+    }
+    else {
+        $(".run-pipeline-button").removeClass("disabled");
+    }
+}
 
-(function() {
-    var run_pipeline_button_state = function() {
-        var a = $('a.editable.required.editable-empty');
-        if (a.length > 0) {
-            $("#run-pipeline-button").addClass("disabled");
+$(document).on('editable:success', function(event, tag, response, newValue) {
+    if ($('.run-pipeline-button').length == 0)
+        return;
+    tag = $(tag);
+    if (tag.hasClass("required")) {
+        if (newValue && newValue.trim() != "") {
+            tag.removeClass("editable-empty");
+            tag.parent().css("background-color", "");
+            tag.parent().prev().css("background-color", "");
         }
         else {
-            $("#run-pipeline-button").removeClass("disabled");
+            tag.addClass("editable-empty");
+            tag.parent().css("background-color", "#ffdddd");
+            tag.parent().prev().css("background-color", "#ffdddd");
         }
     }
-
-    $.fn.editable.defaults.success = function (response, newValue) {
-        var tag = $(this);
-        if (tag.hasClass("required")) {
-            if (newValue && newValue.trim() != "") {
-                tag.removeClass("editable-empty");
-                tag.parent().css("background-color", "");
-                tag.parent().prev().css("background-color", "");
-            }
-            else {
-                tag.addClass("editable-empty");
-                tag.parent().css("background-color", "#ffdddd");
-                tag.parent().prev().css("background-color", "#ffdddd");
-            }
-        }
-        run_pipeline_button_state();
+    if (tag.attr('data-name')) {
+        // Update other inputs representing the same piece of data
+        $('[data-name="' + tag.attr('data-name') + '"]').html(newValue);
     }
+    run_pipeline_button_state();
+});
 
-    $(window).on('load', function() {
-        var a = $('a.editable.required');
-        for (var i = 0; i < a.length; i++) {
-            var tag = $(a[i]);
-            if (tag.hasClass("editable-empty")) {
-                tag.parent().css("background-color", "#ffdddd");
-                tag.parent().prev().css("background-color", "#ffdddd");
-            }
-            else {
-                tag.parent().css("background-color", "");
-                tag.parent().prev().css("background-color", "");
-            }
+$(document).on('ready ajax:complete', function() {
+    $('a.editable.required').each(function() {
+        if (this.hasClass("editable-empty")) {
+            this.parent().css("background-color", "#ffdddd");
+            this.parent().prev().css("background-color", "#ffdddd");
         }
-        run_pipeline_button_state();
-    } );
-
-})();
+        else {
+            this.parent().css("background-color", "");
+            this.parent().prev().css("background-color", "");
+        }
+    });
+    run_pipeline_button_state();
+});