@cocreate/text 1.12.30 → 1.13.1

package/CHANGELOG.md

@@ -1,3 +1,37 @@
+## [1.13.1](https://github.com/CoCreate-app/CoCreate-text/compare/v1.13.0...v1.13.1) (2021-11-28)
+
+
+### Bug Fixes
+
+* replace click and keyup event with selectionchange event ([515da39](https://github.com/CoCreate-app/CoCreate-text/commit/515da39a62af4e350aa2a7857aa48b87c822a5dd))
+
+# [1.13.0](https://github.com/CoCreate-app/CoCreate-text/compare/v1.12.32...v1.13.0) (2021-11-28)
+
+
+### Bug Fixes
+
+* remove keypress and replaced with beforeinput event to support mobile browsers ([84ae8b1](https://github.com/CoCreate-app/CoCreate-text/commit/84ae8b162657ec028e6a49b627ca104909ff11ad))
+
+
+### Features
+
+* support for undo and redo ([8a727d3](https://github.com/CoCreate-app/CoCreate-text/commit/8a727d3ba5df8bcf03cf96c07c40e889dd359aea))
+
+## [1.12.32](https://github.com/CoCreate-app/CoCreate-text/compare/v1.12.31...v1.12.32) (2021-11-27)
+
+
+### Bug Fixes
+
+* actions import typo ([66f914e](https://github.com/CoCreate-app/CoCreate-text/commit/66f914e725a5862d99c2cdb1d462da461f9f46d7))
+* update dependencies ([de6cd6a](https://github.com/CoCreate-app/CoCreate-text/commit/de6cd6a4f9ca77d52588b633b8dd96bf4de4043a))
+
+## [1.12.31](https://github.com/CoCreate-app/CoCreate-text/compare/v1.12.30...v1.12.31) (2021-11-27)
+
+
+### Bug Fixes
+
+* update dependencies ([5a35385](https://github.com/CoCreate-app/CoCreate-text/commit/5a35385c4c3c1a0be817ec009e3486d23bb844bb))
+
 ## [1.12.30](https://github.com/CoCreate-app/CoCreate-text/compare/v1.12.29...v1.12.30) (2021-11-27)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cocreate/text",
-  "version": "1.12.30",
+  "version": "1.13.1",
   "description": "A simple text component in vanilla javascript. Easily configured using HTML5 attributes and/or JavaScript API.",
   "keywords": [
     "text",
@@ -61,13 +61,13 @@
     "webpack-log": "^3.0.1"
   },
   "dependencies": {
-    "@cocreate/actions": "^1.3.18",
-    "@cocreate/crdt": "^1.8.23",
-    "@cocreate/crud-client": "^1.4.34",
-    "@cocreate/cursors": "^1.10.12",
-    "@cocreate/docs": "^1.2.56",
-    "@cocreate/hosting": "^1.2.52",
-    "@cocreate/observer": "^1.3.48",
-    "@cocreate/selection": "^1.2.15"
+    "@cocreate/actions": "^1.3.23",
+    "@cocreate/crdt": "^1.8.26",
+    "@cocreate/crud-client": "^1.4.38",
+    "@cocreate/cursors": "^1.10.16",
+    "@cocreate/docs": "^1.2.60",
+    "@cocreate/hosting": "^1.2.56",
+    "@cocreate/observer": "^1.3.52",
+    "@cocreate/selection": "^1.2.19"
   }
 }

package/src/index.js

@@ -16,6 +16,11 @@ function init() {
     let elements = document.querySelectorAll(selectors);
     initElements(elements);
     _crdtUpdateListener();
+    document.addEventListener('selectionchange', (e) => {
+        let element = document.activeElement;
+        sendPosition(element)
+        console.log(element)
+    });
 }
 
 function initElements (elements) {
@@ -32,10 +37,16 @@ function initElement (element) {
         if(!collection || !document_id || !name) return;
 
         if (!isCrdt) {
-            if (element.tagName == 'IFRAME')
+            if (element.tagName == 'IFRAME'){
                 _addEventListeners(element.contentDocument.documentElement);
-            else 
-            _addEventListeners(element);
+                let Document = element.contentDocument
+                Document.addEventListener('selectionchange', (e) => {
+                    let element = Document.activeElement;
+                    sendPosition(element)
+                });            }  
+            else{ 
+                _addEventListeners(element);
+            }
         }   
         element.setAttribute('crdt', 'true');
         element.crdt = {init: true};
@@ -65,18 +76,12 @@ function initElement (element) {
 }
 
 export function _addEventListeners (element) {
-    element.addEventListener('click', _click);
     element.addEventListener('blur', _blur);
-    element.addEventListener('keyup', _keyup);
     element.addEventListener('cut', _cut);
     element.addEventListener('paste', _paste);
     element.addEventListener('keydown', _keydown);
-    element.addEventListener('keypress', _keypress);
-}
-
-function _click (event) {
-    let element = event.currentTarget;
-    sendPosition(element);
+    element.addEventListener('beforeinput', _beforeinput);
+    element.addEventListener('input', _input);
 }
 
 function _blur (event) {
@@ -87,11 +92,6 @@ function _blur (event) {
     cursors.sendPosition({collection, document_id, name, start, end});
 }
 
-function _keyup (event) {
-    let element = event.currentTarget;
-    sendPosition(element);
-}
-
 function _cut (event) {
     let element = event.currentTarget;
     const { start, end, range } = getSelection(element);
@@ -130,46 +130,58 @@ function _keydown (event) {
     const { start, end, range } = getSelection(element);
     if(event.key == "Backspace" || event.key == "Tab" || event.key == "Enter") {
         eventObj = event;
-        //ToDO switch case
         if(start != end) {
             updateText({element, start, end, range});
         }
+        
         if(event.key == "Backspace" && start == end) {
             updateText({element, start: start - 1, end, range});
         }
-        if(event.key == 'Tab') {
+        else if(event.key == 'Tab') {
             updateText({element, value: "\t", start, range});
         }
-        if(event.key == "Enter") {
+        else if(event.key == "Enter") {
             updateText({element, value: "\n", start, range});
         }
         event.preventDefault();
     }
+    else if (event.ctrlKey) {
+        if (event.keyCode == 90) 
+            console.log('Undo');
+        else if (event.keyCode == 89) 
+            console.log('Redo');
+    }
 }
 
-function _keypress (event) {
+function _beforeinput (event) {
     if(event.stopCCText) return;
     let element = event.currentTarget;
     let { start, end, range } = getSelection(element);
-    if(start != end) {
-        updateText({element, start, end, range});
+    if (event.data) {
+        if(start != end) {
+            updateText({element, start, end, range});
+        }
+        eventObj = event;
+        updateText({element, value: event.data, start, range});
+        event.preventDefault();
+    }
+}
+
+function _input (event) {
+    if(event.stopCCText) return;
+    if (event.data) {
+        eventObj = event;
     }
-    eventObj = event;
-    updateText({element, value: event.key, start, range});
-    event.preventDefault();
 }
 
 function _removeEventListeners (element) {
-    element.removeEventListener('click', _click);
     element.removeEventListener('blur', _blur);
-    element.removeEventListener('keyup', _keyup);
     element.removeEventListener('cut', _cut);
     element.removeEventListener('paste', _paste);
     element.removeEventListener('keydown', _keydown);
-    element.removeEventListener('keypress', _keypress);
+    element.removeEventListener('beforeinput', _beforeinput);
 }
 
-
 export function sendPosition (element) {
     if (!element) return;
     const { start, end } = getSelection(element);
@@ -278,6 +290,7 @@ export function _dispatchInputEvent(element, content, start, end, prev_start, pr
         element.dispatchEvent(event);
     }   
     let inputEvent = new CustomEvent('input', { bubbles: true });
+    Object.defineProperty(inputEvent, 'stopCCText', { writable: false, value: true });
     Object.defineProperty(inputEvent, 'target', { writable: false, value: element });
     Object.defineProperty(inputEvent, 'detail', { writable: false, value: detail });
     element.dispatchEvent(inputEvent);

package/src/saveDomText.js

@@ -1,5 +1,5 @@
 /*globals CustomEvent*/
-import action from '@cocreate/action';
+import action from '@cocreate/actions';
 import crud from '@cocreate/crud-client';
 import crdt from '@cocreate/crdt';