/**
* DO NOT EDIT THIS FILE.
* See the following change record for more information,
* https://www.drupal.org/node/2815083
* @preserve
**/

(function ($, _, Backbone, Drupal) {
  Drupal.quickedit.FieldToolbarView = Backbone.View.extend({
    $editedElement: null,
    editorView: null,
    _id: null,

    initialize(options) {
      this.$editedElement = options.$editedElement;
      this.editorView = options.editorView;
      this.$root = this.$el;
      this._id = `quickedit-toolbar-for-${this.model.id.replace(/[/[\]]/g, '_')}`;
      this.listenTo(this.model, 'change:state', this.stateChange);
    },

    render() {
      this.setElement($(Drupal.theme('quickeditFieldToolbar', {
        id: this._id
      })));
      this.$el.prependTo(this.$root);
      return this;
    },

    stateChange(model, state) {
      const from = model.previous('state');
      const to = state;

      switch (to) {
        case 'inactive':
          break;

        case 'candidate':
          if (from !== 'inactive' && from !== 'highlighted') {
            this.$el.remove();
            this.setElement();
          }

          break;

        case 'highlighted':
          break;

        case 'activating':
          this.render();

          if (this.editorView.getQuickEditUISettings().fullWidthToolbar) {
            this.$el.addClass('quickedit-toolbar-fullwidth');
          }

          if (this.editorView.getQuickEditUISettings().unifiedToolbar) {
            this.insertWYSIWYGToolGroups();
          }

          break;

        case 'active':
          break;

        case 'changed':
          break;

        case 'saving':
          break;

        case 'saved':
          break;

        case 'invalid':
          break;
      }
    },

    insertWYSIWYGToolGroups() {
      this.$el.append(Drupal.theme('quickeditToolgroup', {
        id: this.getFloatedWysiwygToolgroupId(),
        classes: ['wysiwyg-floated', 'quickedit-animate-slow', 'quickedit-animate-invisible', 'quickedit-animate-delay-veryfast'],
        buttons: []
      })).append(Drupal.theme('quickeditToolgroup', {
        id: this.getMainWysiwygToolgroupId(),
        classes: ['wysiwyg-main', 'quickedit-animate-slow', 'quickedit-animate-invisible', 'quickedit-animate-delay-veryfast'],
        buttons: []
      }));
      this.show('wysiwyg-floated');
      this.show('wysiwyg-main');
    },

    getId() {
      return `quickedit-toolbar-for-${this._id}`;
    },

    getFloatedWysiwygToolgroupId() {
      return `quickedit-wysiwyg-floated-toolgroup-for-${this._id}`;
    },

    getMainWysiwygToolgroupId() {
      return `quickedit-wysiwyg-main-toolgroup-for-${this._id}`;
    },

    _find(toolgroup) {
      return this.$el.find(`.quickedit-toolgroup.${toolgroup}`);
    },

    show(toolgroup) {
      const $group = this._find(toolgroup);

      $group.on(Drupal.quickedit.util.constants.transitionEnd, event => {
        $group.off(Drupal.quickedit.util.constants.transitionEnd);
      });
      window.setTimeout(() => {
        $group.removeClass('quickedit-animate-invisible');
      }, 0);
    }

  });
})(jQuery, _, Backbone, Drupal);