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

   1 $.fn.editable.defaults.ajaxOptions = {type: 'post', dataType: 'json'};
   2 $.fn.editable.defaults.send = 'always';
   3
   4 // Default for editing is popup.  I experimented with inline which is a little
   5 // nicer in that it shows up right under the mouse instead of nearby.  However,
   6 // the inline box is taller than the regular content, which causes the page
   7 // layout to shift unless we make the table rows tall, which leaves a lot of
   8 // wasted space when not editing.  Also inline can get cut off if the page is
   9 // too narrow, when the popup box will just move to do the right thing.
  10 //$.fn.editable.defaults.mode = 'inline';
  11
  12 $.fn.editable.defaults.success = function (response, newValue) {
  13     $(document).trigger('editable:success', [this, response, newValue]);
  14 };
  15
  16 $.fn.editable.defaults.params = function (params) {
  17     var a = {};
  18     var key = params.pk.key;
  19     a.id = $(this).attr('data-object-uuid') || params.pk.id;
  20     a[key] = params.pk.defaults || {};
  21     // Remove null values. Otherwise they get transmitted as empty
  22     // strings in request params.
  23     for (i in a[key]) {
  24         if (a[key][i] == null)
  25             delete a[key][i];
  26     }
  27     a[key][params.name] = params.value;
  28     if (!a.id) {
  29         a['_method'] = 'post';
  30     } else {
  31         a['_method'] = 'put';
  32     }
  33     return a;
  34 };
  35
  36 $.fn.editable.defaults.validate = function (value) {
  37     if (value == "***invalid***") {
  38         return "Invalid selection";
  39     }
  40 }
  41
  42 $(document).
  43     on('ready ajax:complete', function() {
  44         $('.editable').
  45             not('.editable-done-setup').
  46             addClass('editable-done-setup').
  47             editable({
  48                 success: function(response, newValue) {
  49                     // If we just created a new object, stash its UUID
  50                     // so we edit it next time instead of creating
  51                     // another new object.
  52                     if (!$(this).attr('data-object-uuid') && response.uuid) {
  53                         $(this).attr('data-object-uuid', response.uuid);
  54                     }
  55                     if (response.href) {
  56                         $(this).editable('option', 'url', response.href);
  57                     }
  58                     if ($(this).attr('data-name')) {
  59                         var textileAttr = $(this).attr('data-name') + 'Textile';
  60                         if (response[textileAttr]) {
  61                             $(this).attr('data-textile', response[textileAttr]);
  62                         }
  63                     }
  64                     return;
  65                 },
  66                 error: function(response, newValue) {
  67                     var errlist = response.responseJSON.errors;
  68                     var errmsg;
  69                     if (Array.isArray(errlist)) {
  70                         errmsg = errlist.join();
  71                     } else {
  72                         errmsg = ("The server returned an error when making " +
  73                                   "this update (status " + response.status +
  74                                   ": " + errlist + ").");
  75                     }
  76                     return errmsg;
  77                 }
  78             }).
  79             on('hidden', function(e, reason) {
  80                 // After saving a new attribute, update the same
  81                 // information if it appears elsewhere on the page.
  82                 if (reason != 'save') return;
  83                 var html = $(this).html();
  84                 if( $(this).attr('data-textile') ) {
  85                     html = $(this).attr('data-textile');
  86                     $(this).html(html);
  87                 }
  88                 var uuid = $(this).attr('data-object-uuid');
  89                 var attr = $(this).attr('data-name');
  90                 var edited = this;
  91                 if (uuid && attr) {
  92                     $("[data-object-uuid='" + uuid + "']" +
  93                       "[data-name='" + attr + "']").each(function() {
  94                           if (this != edited)
  95                               $(this).html(html);
  96                       });
  97                 }
  98             });
  99     }).
 100     on('ready ajax:complete', function() {
 101         $("[data-toggle~='x-editable']").
 102             not('.editable-done-setup').
 103             addClass('editable-done-setup').
 104             click(function(e) {
 105                 e.stopPropagation();
 106                 $($(this).attr('data-toggle-selector')).editable('toggle');
 107             });
 108     });
 109
 110 $.fn.editabletypes.text.defaults.tpl = '<input type="text" name="editable-text">'
 111
 112 $.fn.editableform.buttons = '\
 113 <button type="submit" class="btn btn-primary btn-sm editable-submit" \
 114   id="editable-submit"><i class="glyphicon glyphicon-ok"></i></button>\
 115 <button type="button" class="btn btn-default btn-sm editable-cancel" \
 116   id="editable-cancel"><i class="glyphicon glyphicon-remove"></i></button>\
 117 '