apps/workbench/app/assets/javascripts/selection.js

   1 //= require jquery
   2 //= require jquery_ujs
   3
   4 /** Javascript for local persistent selection. */
   5
   6 get_selection_list = null;
   7 form_selection_sources = {};
   8
   9 jQuery(function($){
  10     var storage = localStorage; // sessionStorage
  11
  12     get_selection_list = function() {
  13         if (!storage.persistentSelection) {
  14             storage.persistentSelection = JSON.stringify([]);
  15         }
  16         return JSON.parse(storage.persistentSelection);
  17     }
  18
  19     var put_storage = function(lst) {
  20         storage.persistentSelection = JSON.stringify(lst);
  21     }
  22
  23     var add_selection = function(uuid, name, href, type) {
  24         var lst = get_selection_list();
  25         lst.push({"uuid": uuid, "name": name, "href": href, "type": type});
  26         put_storage(lst);
  27         update_count();
  28     };
  29
  30     var remove_selection = function(uuid) {
  31         var lst = get_selection_list();
  32         for (var i = 0; i < lst.length; i++) {
  33             if (lst[i].uuid == uuid) {
  34                 lst.splice(i, 1);
  35                 i--;
  36             }
  37         }
  38         put_storage(lst);
  39         update_count();
  40     };
  41
  42     var remove_selection_click = function(e) {
  43         remove_selection($(this).val());
  44     };
  45
  46     var clear_selections = function() {
  47         put_storage([]);
  48         update_count();
  49     }
  50
  51     var update_count = function(e) {
  52         var html;
  53         var this_object_uuid = $('#selection-form-content').
  54             closest('form').
  55             find('input[name=uuid]').val();
  56         var lst = get_selection_list();
  57         $("#persistent-selection-count").text(lst.length);
  58         if (lst.length > 0) {
  59             html = '<li><a href="#" class="btn btn-xs btn-info" id="clear_selections_button"><i class="fa fa-fw fa-ban"></i> Clear selections</a></li>';
  60             if (this_object_uuid.match('-j7d0g-')) {
  61                 html += '<li><button class="btn btn-xs btn-info" type="submit" name="copy_selections_into_project" id="copy_selections_into_project"><i class="fa fa-fw fa-copy"></i> Copy selections into this project</button></li>';
  62                 html += '<li><button class="btn btn-xs btn-info" type="submit" name="move_selections_into_project" id="move_selections_into_project"><i class="fa fa-fw fa-truck"></i> Move selections into this project</button></li>';
  63             }
  64             html += '<li><button class="btn btn-xs btn-info" type="submit" name="combine_selected_files_into_collection" '
  65                 + ' id="combine_selected_files_into_collection">'
  66                 + '<i class="fa fa-fw fa-archive"></i> Combine selected collections and files into a new collection</button></li>'
  67                 + '<li class="notification"><table style="width: 100%"></table></li>';
  68             $('#selection-form-content').html(html);
  69
  70             for (var i = 0; i < lst.length; i++) {
  71                 $('#selection-form-content > li > table').append("<tr>"
  72                                                        + "<td>"
  73                                                        + "<input class='remove-selection' name='selection[]' type='checkbox' value='" + lst[i].uuid + "' checked='true' data-stoppropagation='true' />"
  74                                                        + "</td>"
  75
  76                                                        + "<td>"
  77                                                        + "<div style='padding-left: 1em'><a href=\"" + lst[i].href + "\">" + lst[i].name + "</a></div>"
  78                                                        + "</td>"
  79
  80                                                        + "<td style=\"vertical-align: top\">"
  81                                                        + "<span style=\"padding-right: 1em\">" + lst[i].type + "</span>"
  82                                                        + "</td>"
  83
  84                                                        + "</tr>");
  85             }
  86         } else {
  87             $('#selection-form-content').html("<li class='notification empty'>No selections.</li>");
  88         }
  89
  90         var checkboxes = $('.persistent-selection:checkbox');
  91         for (i = 0; i < checkboxes.length; i++) {
  92             for (var j = 0; j < lst.length; j++) {
  93                 if (lst[j].uuid == $(checkboxes[i]).val()) {
  94                     checkboxes[i].checked = true;
  95                     break;
  96                 }
  97             }
  98             if (j == lst.length) {
  99                 checkboxes[i].checked = false;
 100             }
 101         }
 102
 103         $('.remove-selection').on('click', remove_selection_click);
 104         $('#clear_selections_button').on('click', clear_selections);
 105         $(document).trigger('selections-updated', [lst]);
 106     };
 107
 108     $(document).
 109         on('change', '.persistent-selection:checkbox', function(e) {
 110             var inc = 0;
 111             if ($(this).is(":checked")) {
 112                 add_selection($(this).val(), $(this).attr('friendly_name'), $(this).attr('href'), $(this).attr('friendly_type'));
 113             }
 114             else {
 115                 remove_selection($(this).val());
 116             }
 117         });
 118
 119     $(window).on('load storage', update_count);
 120
 121     $('#selection-form-content').on("click", function(e) {
 122         e.stopPropagation();
 123     });
 124 });
 125
 126 add_form_selection_sources = null;
 127 select_form_sources = null;
 128
 129 (function() {
 130     var form_selection_sources = {};
 131     add_form_selection_sources = function (src) {
 132         for (var i = 0; i < src.length; i++) {
 133             var t = form_selection_sources[src[i].type];
 134             if (!t) {
 135                 t = form_selection_sources[src[i].type] = {};
 136             }
 137             if (!t[src[i].uuid]) {
 138                 t[src[i].uuid] = src[i];
 139             }
 140         }
 141     };
 142
 143     select_form_sources = function(type) {
 144         var ret = [];
 145
 146         if (get_selection_list) {
 147             var lst = get_selection_list();
 148             if (lst.length > 0) {
 149                 var text = "&horbar; Selections &horbar;";
 150                 var span = document.createElement('span');
 151                 span.innerHTML = text;
 152                 ret.push({text: span.innerHTML, value: "***invalid***"});
 153
 154                 for (var i = 0; i < lst.length; i++) {
 155                     if (lst[i].type == type) {
 156                         var n = lst[i].name;
 157                         n = n.replace(/<span[^>]*>/i, "[");
 158                         n = n.replace(/<\/span>/i, "]");
 159                         ret.push({text: n, value: lst[i].uuid})
 160                     }
 161                 }
 162             }
 163         }
 164
 165         var text = "&horbar; Recent &horbar;";
 166         var span = document.createElement('span');
 167         span.innerHTML = text;
 168         ret.push({text: span.innerHTML, value: "***invalid***"});
 169
 170         var t = form_selection_sources[type];
 171         for (var key in t) {
 172             if (t.hasOwnProperty(key)) {
 173                 var obj = t[key];
 174                 ret.push({text: obj.name, value: obj.uuid})
 175             }
 176         }
 177         return ret;
 178     };
 179 })();
 180
 181 function dispatch_selection_action() {
 182     // Build a new "href" attribute for this link by starting with the
 183     // "data-href" attribute and appending ?foo[]=bar&foo[]=baz (or
 184     // &foo=... as appropriate) to reflect the current object
 185     // selections.
 186     var data = [];
 187     var param_name = $(this).attr('data-selection-param-name');
 188     var href = $(this).attr('data-href');
 189     if ($(this).closest('.disabled').length > 0) {
 190         return false;
 191     }
 192     $('.persistent-selection:checkbox:checked').each(function() {
 193         data.push({name: param_name, value: $(this).val()});
 194     });
 195     if (href.indexOf('?') >= 0)
 196         href += '&';
 197     else
 198         href += '?';
 199     href += $.param(data, true);
 200     $(this).attr('href', href);
 201     return true;
 202 }
 203
 204 function enable_disable_selection_actions() {
 205     var $checked = $('.persistent-selection:checkbox:checked');
 206     $('[data-selection-action]').
 207         closest('div.btn-group-sm').
 208         find('ul li').
 209         toggleClass('disabled', ($checked.length == 0));
 210     $('[data-selection-action=compare]').
 211         closest('li').
 212         toggleClass('disabled',
 213                     ($checked.filter('[value*=-d1hrv-]').length < 2) ||
 214                     ($checked.not('[value*=-d1hrv-]').length > 0));
 215 }
 216
 217 $(document).
 218     on('selections-updated ready ajax:complete', function() {
 219         $('[data-selection-action]').click(dispatch_selection_action);
 220         enable_disable_selection_actions();
 221     });