Merge branch 'master' into 4024-pipeline-instances-scroll
[arvados.git] / apps / workbench / app / assets / javascripts / select_modal.js
1 $(document).on('click', '.selectable', function() {
2     var any;
3     var $this = $(this);
4     var $container = $(this).closest('.selectable-container');
5     if (!$container.hasClass('multiple')) {
6         $container.
7             find('.selectable').
8             removeClass('active');
9     }
10     $this.toggleClass('active');
11
12     if (!$this.hasClass('use-preview-selection')) {
13       any = ($container.
14            find('.selectable.active').length > 0)
15     }
16
17     if (!$container.hasClass('preview-selectable-container')) {
18       $this.
19         closest('.modal').
20         find('[data-enable-if-selection]').
21         prop('disabled', !any);
22
23       if ($this.hasClass('active')) {
24         var no_preview_available = '<div class="spinner-h-center spinner-v-center"><center>(No preview available)</center></div>';
25         if (!$this.attr('data-preview-href')) {
26             $(".modal-dialog-preview-pane").html(no_preview_available);
27             return;
28         }
29         $(".modal-dialog-preview-pane").html('<div class="spinner spinner-32px spinner-h-center spinner-v-center"></div>');
30         $.ajax($this.attr('data-preview-href'),
31                {dataType: "html"}).
32             done(function(data, status, jqxhr) {
33                 $(".modal-dialog-preview-pane").html(data);
34             }).
35             fail(function(data, status, jqxhr) {
36                 $(".modal-dialog-preview-pane").html(no_preview_available);
37             });
38       }
39     } else {
40       any = ($container.
41            find('.preview-selectable.active').length > 0)
42       $(this).
43           closest('.modal').
44           find('[data-enable-if-selection]').
45           prop('disabled', !any);
46     }
47
48 }).on('click', '.modal button[data-action-href]', function() {
49     var selection = [];
50     var data = [];
51     var $modal = $(this).closest('.modal');
52     var action_data = $(this).data('action-data');
53     var action_data_from_params = $(this).data('action-data-from-params');
54     var selection_param = action_data.selection_param;
55     $modal.find('.modal-error').removeClass('hide').hide();
56
57     var $preview_selections = $modal.find('.preview-selectable.active');
58     if ($preview_selections.length > 0) {
59       data.push({name: selection_param, value: $preview_selections.first().attr('href')});
60     }
61
62     if (data.length == 0) {   // not using preview selection option
63       $modal.find('.selectable.active[data-object-uuid]').each(function() {
64         var val = $(this).attr('data-object-uuid');
65         data.push({name: selection_param, value: val});
66       });
67     }
68     $.each($.extend({}, action_data, action_data_from_params),
69            function(key, value) {
70                if (value instanceof Array && key[-1] != ']') {
71                    for (var i in value) {
72                        data.push({name: key + '[]', value: value[i]});
73                    }
74                } else {
75                    data.push({name: key, value: value});
76                }
77            });
78     $.ajax($(this).attr('data-action-href'),
79            {dataType: 'json',
80             type: $(this).attr('data-method'),
81             data: data,
82             traditional: false,
83             context: {modal: $modal, action_data: action_data}}).
84         fail(function(jqxhr, status, error) {
85             if (jqxhr.readyState == 0 || jqxhr.status == 0) {
86                 message = "Cancelled."
87             } else if (jqxhr.responseJSON && jqxhr.responseJSON.errors) {
88                 message = jqxhr.responseJSON.errors.join("; ");
89             } else {
90                 message = "Request failed.";
91             }
92             this.modal.find('.modal-error').
93                 html('<div class="alert alert-danger">' + message + '</div>').
94                 show();
95         }).
96         done(function(data, status, jqxhr) {
97             var event_name = this.action_data.success;
98             this.modal.find('.modal-error').hide();
99             $(document).trigger(event_name!=null ? event_name : 'page-refresh',
100                                 [data, status, jqxhr, this.action_data]);
101         });
102 }).on('click', '.chooser-show-project', function() {
103     var params = {};
104     var project_uuid = $(this).attr('data-project-uuid');
105     $(this).attr('href', '#');  // Skip normal click handler
106     if (project_uuid) {
107         params = {'filters': [['owner_uuid',
108                                '=',
109                                project_uuid]],
110                   'project_uuid': project_uuid
111                  };
112     }
113     // Use current selection as dropdown button label
114     $(this).
115         closest('.dropdown-menu').
116         prev('button').
117         html($(this).text() + ' <span class="caret"></span>');
118     // Set (or unset) filter params and refresh filterable rows
119     $($(this).closest('[data-filterable-target]').attr('data-filterable-target')).
120         data('infinite-content-params-from-project-dropdown', params).
121         trigger('refresh-content');
122 }).on('ready', function() {
123     $('form[data-search-modal] a').on('click', function() {
124         $(this).closest('form').submit();
125         return false;
126     });
127     $('form[data-search-modal]').on('submit', function() {
128         // Ask the server for a Search modal. When it arrives, copy
129         // the search string from the top nav input into the modal's
130         // search query field.
131         var $form = $(this);
132         var searchq = $form.find('input').val();
133         var is_a_uuid = /^([0-9a-f]{32}(\+\S+)?|[0-9a-z]{5}-[0-9a-z]{5}-[0-9a-z]{15})$/;
134         if (searchq.trim().match(is_a_uuid)) {
135             window.location = '/actions?uuid=' + encodeURIComponent(searchq.trim());
136             // Show the "loading" indicator. TODO: better page transition hook
137             $(document).trigger('ajax:send');
138             return false;
139         }
140         if ($form.find('a[data-remote]').length > 0) {
141             // A search dialog is already loading.
142             return false;
143         }
144         $('<a />').
145             attr('href', $form.attr('data-search-modal')).
146             attr('data-remote', 'true').
147             attr('data-method', 'GET').
148             hide().
149             appendTo($form).
150             on('ajax:success', function(data, status, xhr) {
151                 $('body > .modal-container input[type=text]').
152                     val($form.find('input').val()).
153                     focus();
154                 $form.find('input').val('');
155             }).on('ajax:complete', function() {
156                 $(this).detach();
157             }).
158             click();
159         return false;
160     });
161 }).on('page-refresh', function(event, data, status, jqxhr, action_data) {
162     window.location.reload();
163 }).on('tab-refresh', function(event, data, status, jqxhr, action_data) {
164     $(document).trigger('arv:pane:reload:all');
165     $('body > .modal-container .modal').modal('hide');
166 }).on('redirect-to-created-object', function(event, data, status, jqxhr, action_data) {
167     window.location.href = data.href.replace(/^[^\/]*\/\/[^\/]*/, '');
168 }).on('shown.bs.modal', 'body > .modal-container .modal', function() {
169     $('.focus-on-display', this).focus();
170 });