X-Git-Url: http://www.aleph1.co.uk/gitweb/?p=yaffs-website;a=blobdiff_plain;f=web%2Fcore%2Fmodules%2Fquickedit%2Fjs%2Feditors%2FplainTextEditor.es6.js;fp=web%2Fcore%2Fmodules%2Fquickedit%2Fjs%2Feditors%2FplainTextEditor.es6.js;h=bb4bb3c2bc0b54cc8edf03e578b48cd53b69438a;hp=0000000000000000000000000000000000000000;hb=9917807b03b64faf00f6a1f29dcb6eafc454efa5;hpb=aea91e65e895364e460983b890e295aa5d5540a5

diff --git a/web/core/modules/quickedit/js/editors/plainTextEditor.es6.js b/web/core/modules/quickedit/js/editors/plainTextEditor.es6.js
new file mode 100644
index 000000000..bb4bb3c2b
--- /dev/null
+++ b/web/core/modules/quickedit/js/editors/plainTextEditor.es6.js
@@ -0,0 +1,140 @@
+/**
+ * @file
+ * ContentEditable-based in-place editor for plain text content.
+ */
+
+(function ($, _, Drupal) {
+  Drupal.quickedit.editors.plain_text = Drupal.quickedit.EditorView.extend(/** @lends Drupal.quickedit.editors.plain_text# */{
+
+    /**
+     * Stores the textual DOM element that is being in-place edited.
+     */
+    $textElement: null,
+
+    /**
+     * @constructs
+     *
+     * @augments Drupal.quickedit.EditorView
+     *
+     * @param {object} options
+     *   Options for the plain text editor.
+     */
+    initialize(options) {
+      Drupal.quickedit.EditorView.prototype.initialize.call(this, options);
+
+      const editorModel = this.model;
+      const fieldModel = this.fieldModel;
+
+      // Store the original value of this field. Necessary for reverting
+      // changes.
+      let $textElement;
+      const $fieldItems = this.$el.find('.quickedit-field');
+      if ($fieldItems.length) {
+        $textElement = this.$textElement = $fieldItems.eq(0);
+      }
+      else {
+        $textElement = this.$textElement = this.$el;
+      }
+      editorModel.set('originalValue', $.trim(this.$textElement.text()));
+
+      // Sets the state to 'changed' whenever the value changes.
+      let previousText = editorModel.get('originalValue');
+      $textElement.on('keyup paste', (event) => {
+        const currentText = $.trim($textElement.text());
+        if (previousText !== currentText) {
+          previousText = currentText;
+          editorModel.set('currentValue', currentText);
+          fieldModel.set('state', 'changed');
+        }
+      });
+    },
+
+    /**
+     * @inheritdoc
+     *
+     * @return {jQuery}
+     *   The text element for the plain text editor.
+     */
+    getEditedElement() {
+      return this.$textElement;
+    },
+
+    /**
+     * @inheritdoc
+     *
+     * @param {object} fieldModel
+     *   The field model that holds the state.
+     * @param {string} state
+     *   The state to change to.
+     * @param {object} options
+     *   State options, if needed by the state change.
+     */
+    stateChange(fieldModel, state, options) {
+      const from = fieldModel.previous('state');
+      const to = state;
+      switch (to) {
+        case 'inactive':
+          break;
+
+        case 'candidate':
+          if (from !== 'inactive') {
+            this.$textElement.removeAttr('contenteditable');
+          }
+          if (from === 'invalid') {
+            this.removeValidationErrors();
+          }
+          break;
+
+        case 'highlighted':
+          break;
+
+        case 'activating':
+          // Defer updating the field model until the current state change has
+          // propagated, to not trigger a nested state change event.
+          _.defer(() => {
+            fieldModel.set('state', 'active');
+          });
+          break;
+
+        case 'active':
+          this.$textElement.attr('contenteditable', 'true');
+          break;
+
+        case 'changed':
+          break;
+
+        case 'saving':
+          if (from === 'invalid') {
+            this.removeValidationErrors();
+          }
+          this.save(options);
+          break;
+
+        case 'saved':
+          break;
+
+        case 'invalid':
+          this.showValidationErrors();
+          break;
+      }
+    },
+
+    /**
+     * @inheritdoc
+     *
+     * @return {object}
+     *   A settings object for the quick edit UI.
+     */
+    getQuickEditUISettings() {
+      return { padding: true, unifiedToolbar: false, fullWidthToolbar: false, popup: false };
+    },
+
+    /**
+     * @inheritdoc
+     */
+    revert() {
+      this.$textElement.html(this.model.get('originalValue'));
+    },
+
+  });
+}(jQuery, _, Drupal));