easy-richtextarea 4.0.18 → 4.0.20

package/src/example/view.js

@@ -3,26 +3,20 @@
 import RichTextarea from "./richTextarea";
 
 const content = "",
-      activeRichTextarea =
+      richTextarea =
 
         <RichTextarea onChange={changeHandler} onScroll={scrollHandler} onFocus={focusHandler} onBlur={blurHandler} />
 
-      ,
-      inactiveRichTextarea =
-
-        <RichTextarea />
-
       ;
 
-activeRichTextarea.setContent(content);
+richTextarea.setContent(content);
 
-activeRichTextarea.activate();
+richTextarea.activate();
 
 const View = (properties) =>
 
   <div className="view">
-    {activeRichTextarea}
-    {inactiveRichTextarea}
+    {richTextarea}
   </div>
 
 ;
@@ -30,30 +24,17 @@ const View = (properties) =>
 export default View;
 
 function changeHandler(event, element) {
-  const contentChanged = activeRichTextarea.hasContentChanged(),
-        selectionChanged = activeRichTextarea.hasSelectionChanged();
+  const contentChanged = richTextarea.hasContentChanged(),
+        selectionChanged = richTextarea.hasSelectionChanged();
 
   console.log(contentChanged, selectionChanged)
-
-  if (contentChanged) {
-    const content = activeRichTextarea.getContent();
-
-    inactiveRichTextarea.setContent(content);
-  }
-
-  if (selectionChanged) {
-    const selection = activeRichTextarea.getSelection();
-
-    inactiveRichTextarea.setSelection(selection);
-  }
 }
 
 function scrollHandler(event, element) {
-  const scrollTop = activeRichTextarea.getScrollTop(),
-        scrollLeft = activeRichTextarea.getScrollLeft();
+  const scrollTop = richTextarea.getScrollTop(),
+        scrollLeft = richTextarea.getScrollLeft();
 
-  inactiveRichTextarea.setScrollTop(scrollTop);
-  inactiveRichTextarea.setScrollLeft(scrollLeft);
+  console.log(scrollTop, scrollLeft)
 }
 
 function focusHandler(event, element) {

package/src/richTextarea.js

@@ -103,6 +103,8 @@ export default class RichTextarea extends Element {
 
   selectChangeHandler = (event, element) => {
     if (this.focused) {
+      element = this; ///
+
       this.intermediateHandler(event, element);
     }
   }
@@ -312,17 +314,21 @@ export default class RichTextarea extends Element {
   }
 
   undo(event, element) {
-    const operation = this.undoBuffer.undo();
+    const undoOperation = this.undoBuffer.undo();
+
+    if (undoOperation !== null) {
+      const operation = undoOperation;  ///
 
-    if (operation !== null) {
       this.revert(event, element, operation);
     }
   }
 
   redo(event, element) {
-    const operation = this.undoBuffer.redo();
+    const redoOperation = this.undoBuffer.redo();
+
+    if (redoOperation !== null) {
+      const operation = redoOperation;  ///
 
-    if (operation !== null) {
       this.revert(event, element, operation);
     }
   }
@@ -367,6 +373,23 @@ export default class RichTextarea extends Element {
     this.intermediateHandler(event, element, undoable, eventType);
   }
 
+  callHandlers(eventType, ...remainingArguments) {
+    const eventListeners = this.findEventListeners(eventType);
+
+    eventListeners.forEach((eventListener) => {
+      let { element } = eventListener;
+
+      const { handler } = eventListener,
+              handlerElement = element; ///
+
+      element = this; ///
+
+      if ((handler !== this.blurHandler) && (handler !== this.focusHandler) && (handler !== this.scrollHandler)) {
+        handler.call(handlerElement, ...remainingArguments, element);
+      }
+    });
+  }
+
   applyOperation(operation) {
     let content = this.getContent(),
         selection = this.getSelection();
@@ -470,23 +493,6 @@ export default class RichTextarea extends Element {
     this.removeEventListener(eventType, handler, element);
   }
 
-  callHandlers(eventType, ...remainingArguments) {
-    const eventListeners = this.findEventListeners(eventType);
-
-    eventListeners.forEach((eventListener) => {
-      let { element } = eventListener;
-
-      const { handler } = eventListener,
-            handlerElement = element; ///
-
-      element = this; ///
-
-      if ((handler !== this.blurHandler) && (handler !== this.focusHandler) && (handler !== this.scrollHandler)) {
-        handler.call(handlerElement, ...remainingArguments, element);
-      }
-    });
-  }
-
   didMount() {
     const { onChange, onScroll, onFocus, onBlur } = this.properties,
           changeHandler = onChange, ///

package/src/undoBuffer.js

@@ -7,99 +7,113 @@ import InsertOperation from "./operation/insert";
 import DeleteOperation from "./operation/delete";
 import transformOperations from "./transform/operations";
 
-const { push } = arrayUtilities;
+const { clear, filter, unshift } = arrayUtilities;
 
 export default class UndoBuffer {
-  constructor(position, operations) {
-    this.position = position;
-    this.operations = operations;
+  constructor(undoOperations, redoOperations) {
+    this.undoOperations = undoOperations;
+    this.redoOperations = redoOperations;
   }
 
-  getPosition() {
-    return this.position;
+  getUndoOperations() {
+    return this.undoOperations;
   }
-
-  getOperations() {
-    return this.operations;
+  
+  getRedoOperations() {
+    return this.redoOperations;
   }
 
   undo() {
-    let operation = null;
+    let undoOperation = null;
 
-    if (this.position > 0) {
-      this.position--;
+    const undoOperationsLength = this.undoOperations.length;
 
-      operation = this.operations[this.position];
+    if (undoOperationsLength > 0) {
+      undoOperation = this.undoOperations.shift();
 
-      const invertedOperation = operation.invert(InsertOperation, DeleteOperation);
+      const invertedUndoOperation = undoOperation.invert(InsertOperation, DeleteOperation),
+            redoOperation = invertedUndoOperation;  ///
 
-      operation = invertedOperation;  ///
+      this.redoOperations.unshift(redoOperation);
     }
 
-    return operation;
+    return undoOperation;
   }
 
   redo() {
-    let operation = null;
+    let redoOperation = null;
+
+    const redoOperationsLength = this.redoOperations.length;
 
-    const operationsLength = this.operations.length;
+    if (redoOperationsLength > 0) {
+      redoOperation = this.redoOperations.shift();
 
-    if (this.position < operationsLength) {
-      operation = this.operations[this.position];
+      const invertedRedoOperation = redoOperation.invert(InsertOperation, DeleteOperation),
+            undoOperation = invertedRedoOperation;  ///
 
-      this.position++;
+      this.undoOperations.unshift(undoOperation);
     }
 
-    return operation;
+    return redoOperation;
   }
 
   transform(operations) {
-    this.operations = transformOperations(this.operations, operations);
+    this.undoOperations = transformOperations(this.undoOperations, operations);
 
-    this.filterEmptyOperations();
+    this.redoOperations = transformOperations(this.redoOperations, operations);
+    
+    filterEmptyOperations(this.undoOperations);
+
+    filterEmptyOperations(this.redoOperations);
   }
 
   addOperations(operations) {
-    const start = this.position;  ///
+    const invertedOperations = invertOperations(operations),
+          reversedInvertedOperations = reverseOperations(invertedOperations),
+          undoOperations = reversedInvertedOperations;  ///
 
-    this.operations.splice(start);
+    unshift(this.undoOperations, undoOperations);
 
-    push(this.operations, operations);
+    clear(this.redoOperations);
+  }
 
-    const operationsLength = this.operations.length;
+  static fromNothing() {
+    const undoOperations = [],
+          redoOperations = [],
+          undoBuffer = new UndoBuffer(undoOperations, redoOperations);
 
-    this.position = operationsLength; ///
+    return undoBuffer;
   }
+}
+
+function invertOperations(operations) {
+  const invertedOperations = operations.map((operation) => {
+    const invertedOperation = operation.invert(InsertOperation, DeleteOperation);
 
-  filterEmptyOperations() {
-    let length = this.operations.length,
-          position = 0;
+    return invertedOperation;
+  });
 
-    while (position < length) {
-      const operation = this.operations[position];
+  return invertedOperations;
+}
 
-      if (operation instanceof EmptyOperation) {
-        const start = position, ///
-              deleteCount = 1;
+function reverseOperations(operations) {
+  const reversedOperations = operations.reduce((reversedOperations, operation) => {
+    const reversedOperation = operation;  ///
 
-        this.operations.splice(start, deleteCount);
+    reversedOperations.unshift(reversedOperation);
 
-        if (this.position > position) {
-          this.position--;
-        }
-      } else {
-        position++;
-      }
+    return reversedOperations;
+  }, []);
 
-      length = this.operations.length;
-    }
-  }
+  return reversedOperations;
+}
 
-  static fromNothing() {
-    const position = 0,
-          operations = [],
-          undoBuffer = new UndoBuffer(position, operations);
+function filterEmptyOperations(operations) {
+  filter(operations, (operation) => {
+    const operationEmptyOperation = (operation instanceof EmptyOperation);
 
-    return undoBuffer;
-  }
+    if (!operationEmptyOperation) {
+      return true;
+    }
+  });
 }