www.aleph1.co.uk Git - yaffs-website/blob - web/core/modules/quickedit/js/views/AppView.js

   1 /**
   2 * DO NOT EDIT THIS FILE.
   3 * See the following change record for more information,
   4 * https://www.drupal.org/node/2815083
   5 * @preserve
   6 **/
   7
   8 (function ($, _, Backbone, Drupal) {
   9   var reload = false;
  10
  11   Drupal.quickedit.AppView = Backbone.View.extend({
  12     initialize: function initialize(options) {
  13       this.activeFieldStates = ['activating', 'active'];
  14       this.singleFieldStates = ['highlighted', 'activating', 'active'];
  15       this.changedFieldStates = ['changed', 'saving', 'saved', 'invalid'];
  16       this.readyFieldStates = ['candidate', 'highlighted'];
  17
  18       this.listenTo(options.entitiesCollection, 'change:state', this.appStateChange);
  19       this.listenTo(options.entitiesCollection, 'change:isActive', this.enforceSingleActiveEntity);
  20
  21       this.listenTo(options.fieldsCollection, 'change:state', this.editorStateChange);
  22
  23       this.listenTo(options.fieldsCollection, 'change:html', this.renderUpdatedField);
  24       this.listenTo(options.fieldsCollection, 'change:html', this.propagateUpdatedField);
  25
  26       this.listenTo(options.fieldsCollection, 'add', this.rerenderedFieldToCandidate);
  27
  28       this.listenTo(options.fieldsCollection, 'destroy', this.teardownEditor);
  29     },
  30     appStateChange: function appStateChange(entityModel, state) {
  31       var app = this;
  32       var entityToolbarView = void 0;
  33       switch (state) {
  34         case 'launching':
  35           reload = false;
  36
  37           entityToolbarView = new Drupal.quickedit.EntityToolbarView({
  38             model: entityModel,
  39             appModel: this.model
  40           });
  41           entityModel.toolbarView = entityToolbarView;
  42
  43           entityModel.get('fields').each(function (fieldModel) {
  44             app.setupEditor(fieldModel);
  45           });
  46
  47           _.defer(function () {
  48             entityModel.set('state', 'opening');
  49           });
  50           break;
  51
  52         case 'closed':
  53           entityToolbarView = entityModel.toolbarView;
  54
  55           entityModel.get('fields').each(function (fieldModel) {
  56             app.teardownEditor(fieldModel);
  57           });
  58
  59           if (entityToolbarView) {
  60             entityToolbarView.remove();
  61             delete entityModel.toolbarView;
  62           }
  63
  64           if (reload) {
  65             reload = false;
  66             location.reload();
  67           }
  68           break;
  69       }
  70     },
  71     acceptEditorStateChange: function acceptEditorStateChange(from, to, context, fieldModel) {
  72       var accept = true;
  73
  74       if (context && (context.reason === 'stop' || context.reason === 'rerender')) {
  75         if (from === 'candidate' && to === 'inactive') {
  76           accept = true;
  77         }
  78       } else {
  79           if (!Drupal.quickedit.FieldModel.followsStateSequence(from, to)) {
  80             accept = false;
  81
  82             if (_.indexOf(this.activeFieldStates, from) !== -1 && to === 'candidate') {
  83               accept = true;
  84             } else if ((from === 'changed' || from === 'invalid') && to === 'candidate') {
  85                 accept = true;
  86               } else if (from === 'highlighted' && to === 'candidate') {
  87                   accept = true;
  88                 } else if (from === 'saved' && to === 'candidate') {
  89                     accept = true;
  90                   } else if (from === 'invalid' && to === 'saving') {
  91                       accept = true;
  92                     } else if (from === 'invalid' && to === 'activating') {
  93                         accept = true;
  94                       }
  95           }
  96
  97           if (accept) {
  98             var activeField = void 0;
  99             var activeFieldState = void 0;
 100
 101             if ((this.readyFieldStates.indexOf(from) !== -1 || from === 'invalid') && this.activeFieldStates.indexOf(to) !== -1) {
 102               activeField = this.model.get('activeField');
 103               if (activeField && activeField !== fieldModel) {
 104                 activeFieldState = activeField.get('state');
 105
 106                 if (this.activeFieldStates.indexOf(activeFieldState) !== -1) {
 107                   activeField.set('state', 'candidate');
 108                 } else if (activeFieldState === 'changed' || activeFieldState === 'invalid') {
 109                   activeField.set('state', 'saving');
 110                 }
 111
 112                 if (from === 'invalid') {
 113                   this.model.set('activeField', fieldModel);
 114                   accept = false;
 115                 }
 116               }
 117             } else if (_.indexOf(this.activeFieldStates, from) !== -1 && to === 'candidate') {
 118                 if (context && context.reason === 'mouseleave') {
 119                   accept = false;
 120                 }
 121               } else if ((from === 'changed' || from === 'invalid') && to === 'candidate') {
 122                   if (context && context.reason === 'mouseleave') {
 123                     accept = false;
 124                   } else {
 125                     if (context && context.confirmed) {
 126                       accept = true;
 127                     }
 128                   }
 129                 }
 130           }
 131         }
 132
 133       return accept;
 134     },
 135     setupEditor: function setupEditor(fieldModel) {
 136       var entityModel = fieldModel.get('entity');
 137       var entityToolbarView = entityModel.toolbarView;
 138
 139       var fieldToolbarRoot = entityToolbarView.getToolbarRoot();
 140
 141       var editorName = fieldModel.get('metadata').editor;
 142       var editorModel = new Drupal.quickedit.EditorModel();
 143       var editorView = new Drupal.quickedit.editors[editorName]({
 144         el: $(fieldModel.get('el')),
 145         model: editorModel,
 146         fieldModel: fieldModel
 147       });
 148
 149       var toolbarView = new Drupal.quickedit.FieldToolbarView({
 150         el: fieldToolbarRoot,
 151         model: fieldModel,
 152         $editedElement: $(editorView.getEditedElement()),
 153         editorView: editorView,
 154         entityModel: entityModel
 155       });
 156
 157       var decorationView = new Drupal.quickedit.FieldDecorationView({
 158         el: $(editorView.getEditedElement()),
 159         model: fieldModel,
 160         editorView: editorView
 161       });
 162
 163       fieldModel.editorView = editorView;
 164       fieldModel.toolbarView = toolbarView;
 165       fieldModel.decorationView = decorationView;
 166     },
 167     teardownEditor: function teardownEditor(fieldModel) {
 168       if (typeof fieldModel.editorView === 'undefined') {
 169         return;
 170       }
 171
 172       fieldModel.toolbarView.remove();
 173       delete fieldModel.toolbarView;
 174
 175       fieldModel.decorationView.remove();
 176       delete fieldModel.decorationView;
 177
 178       fieldModel.editorView.remove();
 179       delete fieldModel.editorView;
 180     },
 181     confirmEntityDeactivation: function confirmEntityDeactivation(entityModel) {
 182       var that = this;
 183       var discardDialog = void 0;
 184
 185       function closeDiscardDialog(action) {
 186         discardDialog.close(action);
 187
 188         that.model.set('activeModal', null);
 189
 190         if (action === 'save') {
 191           entityModel.set('state', 'committing', { confirmed: true });
 192         } else {
 193           entityModel.set('state', 'deactivating', { confirmed: true });
 194
 195           if (entityModel.get('reload')) {
 196             reload = true;
 197             entityModel.set('reload', false);
 198           }
 199         }
 200       }
 201
 202       if (!this.model.get('activeModal')) {
 203         var $unsavedChanges = $('<div>' + Drupal.t('You have unsaved changes') + '</div>');
 204         discardDialog = Drupal.dialog($unsavedChanges.get(0), {
 205           title: Drupal.t('Discard changes?'),
 206           dialogClass: 'quickedit-discard-modal',
 207           resizable: false,
 208           buttons: [{
 209             text: Drupal.t('Save'),
 210             click: function click() {
 211               closeDiscardDialog('save');
 212             },
 213
 214             primary: true
 215           }, {
 216             text: Drupal.t('Discard changes'),
 217             click: function click() {
 218               closeDiscardDialog('discard');
 219             }
 220           }],
 221
 222           closeOnEscape: false,
 223           create: function create() {
 224             $(this).parent().find('.ui-dialog-titlebar-close').remove();
 225           },
 226
 227           beforeClose: false,
 228           close: function close(event) {
 229             $(event.target).remove();
 230           }
 231         });
 232         this.model.set('activeModal', discardDialog);
 233
 234         discardDialog.showModal();
 235       }
 236     },
 237     editorStateChange: function editorStateChange(fieldModel, state) {
 238       var from = fieldModel.previous('state');
 239       var to = state;
 240
 241       if (_.indexOf(this.singleFieldStates, to) !== -1 && this.model.get('highlightedField') !== fieldModel) {
 242         this.model.set('highlightedField', fieldModel);
 243       } else if (this.model.get('highlightedField') === fieldModel && to === 'candidate') {
 244         this.model.set('highlightedField', null);
 245       }
 246
 247       if (_.indexOf(this.activeFieldStates, to) !== -1 && this.model.get('activeField') !== fieldModel) {
 248         this.model.set('activeField', fieldModel);
 249       } else if (this.model.get('activeField') === fieldModel && to === 'candidate') {
 250         if (from === 'changed' || from === 'invalid') {
 251           fieldModel.editorView.revert();
 252         }
 253         this.model.set('activeField', null);
 254       }
 255     },
 256     renderUpdatedField: function renderUpdatedField(fieldModel, html, options) {
 257       var $fieldWrapper = $(fieldModel.get('el'));
 258       var $context = $fieldWrapper.parent();
 259
 260       var renderField = function renderField() {
 261         fieldModel.destroy();
 262
 263         $fieldWrapper.replaceWith(html);
 264
 265         Drupal.attachBehaviors($context.get(0));
 266       };
 267
 268       if (!options.propagation) {
 269         _.defer(function () {
 270           fieldModel.set('state', 'candidate');
 271
 272           _.defer(function () {
 273             fieldModel.set('state', 'inactive', { reason: 'rerender' });
 274
 275             renderField();
 276           });
 277         });
 278       } else {
 279         renderField();
 280       }
 281     },
 282     propagateUpdatedField: function propagateUpdatedField(updatedField, html, options) {
 283       if (options.propagation) {
 284         return;
 285       }
 286
 287       var htmlForOtherViewModes = updatedField.get('htmlForOtherViewModes');
 288       Drupal.quickedit.collections.fields.where({ logicalFieldID: updatedField.get('logicalFieldID') }).forEach(function (field) {
 289         if (field === updatedField) {} else if (field.getViewMode() === updatedField.getViewMode()) {
 290             field.set('html', updatedField.get('html'));
 291           } else if (field.getViewMode() in htmlForOtherViewModes) {
 292               field.set('html', htmlForOtherViewModes[field.getViewMode()], { propagation: true });
 293             }
 294       });
 295     },
 296     rerenderedFieldToCandidate: function rerenderedFieldToCandidate(fieldModel) {
 297       var activeEntity = Drupal.quickedit.collections.entities.findWhere({ isActive: true });
 298
 299       if (!activeEntity) {
 300         return;
 301       }
 302
 303       if (fieldModel.get('entity') === activeEntity) {
 304         this.setupEditor(fieldModel);
 305         fieldModel.set('state', 'candidate');
 306       }
 307     },
 308     enforceSingleActiveEntity: function enforceSingleActiveEntity(changedEntityModel) {
 309       if (changedEntityModel.get('isActive') === false) {
 310         return;
 311       }
 312
 313       changedEntityModel.collection.chain().filter(function (entityModel) {
 314         return entityModel.get('isActive') === true && entityModel !== changedEntityModel;
 315       }).each(function (entityModel) {
 316         entityModel.set('state', 'deactivating');
 317       });
 318     }
 319   });
 320 })(jQuery, _, Backbone, Drupal);