@cocreate/text 1.12.31 → 1.13.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +34 -0
- package/package.json +9 -9
- package/src/index.js +41 -29
- package/src/saveDomText.js +1 -1
package/CHANGELOG.md
CHANGED
@@ -1,3 +1,37 @@
|
|
1
|
+
## [1.13.2](https://github.com/CoCreate-app/CoCreate-text/compare/v1.13.1...v1.13.2) (2021-11-28)
|
2
|
+
|
3
|
+
|
4
|
+
### Bug Fixes
|
5
|
+
|
6
|
+
* removed console.log ([81a07d4](https://github.com/CoCreate-app/CoCreate-text/commit/81a07d4be95acd507fa4047de38847069fd53d5c))
|
7
|
+
|
8
|
+
## [1.13.1](https://github.com/CoCreate-app/CoCreate-text/compare/v1.13.0...v1.13.1) (2021-11-28)
|
9
|
+
|
10
|
+
|
11
|
+
### Bug Fixes
|
12
|
+
|
13
|
+
* replace click and keyup event with selectionchange event ([515da39](https://github.com/CoCreate-app/CoCreate-text/commit/515da39a62af4e350aa2a7857aa48b87c822a5dd))
|
14
|
+
|
15
|
+
# [1.13.0](https://github.com/CoCreate-app/CoCreate-text/compare/v1.12.32...v1.13.0) (2021-11-28)
|
16
|
+
|
17
|
+
|
18
|
+
### Bug Fixes
|
19
|
+
|
20
|
+
* remove keypress and replaced with beforeinput event to support mobile browsers ([84ae8b1](https://github.com/CoCreate-app/CoCreate-text/commit/84ae8b162657ec028e6a49b627ca104909ff11ad))
|
21
|
+
|
22
|
+
|
23
|
+
### Features
|
24
|
+
|
25
|
+
* support for undo and redo ([8a727d3](https://github.com/CoCreate-app/CoCreate-text/commit/8a727d3ba5df8bcf03cf96c07c40e889dd359aea))
|
26
|
+
|
27
|
+
## [1.12.32](https://github.com/CoCreate-app/CoCreate-text/compare/v1.12.31...v1.12.32) (2021-11-27)
|
28
|
+
|
29
|
+
|
30
|
+
### Bug Fixes
|
31
|
+
|
32
|
+
* actions import typo ([66f914e](https://github.com/CoCreate-app/CoCreate-text/commit/66f914e725a5862d99c2cdb1d462da461f9f46d7))
|
33
|
+
* update dependencies ([de6cd6a](https://github.com/CoCreate-app/CoCreate-text/commit/de6cd6a4f9ca77d52588b633b8dd96bf4de4043a))
|
34
|
+
|
1
35
|
## [1.12.31](https://github.com/CoCreate-app/CoCreate-text/compare/v1.12.30...v1.12.31) (2021-11-27)
|
2
36
|
|
3
37
|
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@cocreate/text",
|
3
|
-
"version": "1.
|
3
|
+
"version": "1.13.2",
|
4
4
|
"description": "A simple text component in vanilla javascript. Easily configured using HTML5 attributes and/or JavaScript API.",
|
5
5
|
"keywords": [
|
6
6
|
"text",
|
@@ -61,13 +61,13 @@
|
|
61
61
|
"webpack-log": "^3.0.1"
|
62
62
|
},
|
63
63
|
"dependencies": {
|
64
|
-
"@cocreate/actions": "^1.3.
|
65
|
-
"@cocreate/crdt": "^1.8.
|
66
|
-
"@cocreate/crud-client": "^1.4.
|
67
|
-
"@cocreate/cursors": "^1.10.
|
68
|
-
"@cocreate/docs": "^1.2.
|
69
|
-
"@cocreate/hosting": "^1.2.
|
70
|
-
"@cocreate/observer": "^1.3.
|
71
|
-
"@cocreate/selection": "^1.2.
|
64
|
+
"@cocreate/actions": "^1.3.23",
|
65
|
+
"@cocreate/crdt": "^1.8.26",
|
66
|
+
"@cocreate/crud-client": "^1.4.38",
|
67
|
+
"@cocreate/cursors": "^1.10.16",
|
68
|
+
"@cocreate/docs": "^1.2.60",
|
69
|
+
"@cocreate/hosting": "^1.2.56",
|
70
|
+
"@cocreate/observer": "^1.3.52",
|
71
|
+
"@cocreate/selection": "^1.2.19"
|
72
72
|
}
|
73
73
|
}
|
package/src/index.js
CHANGED
@@ -16,6 +16,10 @@ function init() {
|
|
16
16
|
let elements = document.querySelectorAll(selectors);
|
17
17
|
initElements(elements);
|
18
18
|
_crdtUpdateListener();
|
19
|
+
document.addEventListener('selectionchange', (e) => {
|
20
|
+
let element = document.activeElement;
|
21
|
+
sendPosition(element)
|
22
|
+
});
|
19
23
|
}
|
20
24
|
|
21
25
|
function initElements (elements) {
|
@@ -32,10 +36,16 @@ function initElement (element) {
|
|
32
36
|
if(!collection || !document_id || !name) return;
|
33
37
|
|
34
38
|
if (!isCrdt) {
|
35
|
-
if (element.tagName == 'IFRAME')
|
39
|
+
if (element.tagName == 'IFRAME'){
|
36
40
|
_addEventListeners(element.contentDocument.documentElement);
|
37
|
-
|
38
|
-
|
41
|
+
let Document = element.contentDocument
|
42
|
+
Document.addEventListener('selectionchange', (e) => {
|
43
|
+
let element = Document.activeElement;
|
44
|
+
sendPosition(element)
|
45
|
+
}); }
|
46
|
+
else{
|
47
|
+
_addEventListeners(element);
|
48
|
+
}
|
39
49
|
}
|
40
50
|
element.setAttribute('crdt', 'true');
|
41
51
|
element.crdt = {init: true};
|
@@ -65,18 +75,12 @@ function initElement (element) {
|
|
65
75
|
}
|
66
76
|
|
67
77
|
export function _addEventListeners (element) {
|
68
|
-
element.addEventListener('click', _click);
|
69
78
|
element.addEventListener('blur', _blur);
|
70
|
-
element.addEventListener('keyup', _keyup);
|
71
79
|
element.addEventListener('cut', _cut);
|
72
80
|
element.addEventListener('paste', _paste);
|
73
81
|
element.addEventListener('keydown', _keydown);
|
74
|
-
element.addEventListener('
|
75
|
-
|
76
|
-
|
77
|
-
function _click (event) {
|
78
|
-
let element = event.currentTarget;
|
79
|
-
sendPosition(element);
|
82
|
+
element.addEventListener('beforeinput', _beforeinput);
|
83
|
+
element.addEventListener('input', _input);
|
80
84
|
}
|
81
85
|
|
82
86
|
function _blur (event) {
|
@@ -87,11 +91,6 @@ function _blur (event) {
|
|
87
91
|
cursors.sendPosition({collection, document_id, name, start, end});
|
88
92
|
}
|
89
93
|
|
90
|
-
function _keyup (event) {
|
91
|
-
let element = event.currentTarget;
|
92
|
-
sendPosition(element);
|
93
|
-
}
|
94
|
-
|
95
94
|
function _cut (event) {
|
96
95
|
let element = event.currentTarget;
|
97
96
|
const { start, end, range } = getSelection(element);
|
@@ -130,46 +129,58 @@ function _keydown (event) {
|
|
130
129
|
const { start, end, range } = getSelection(element);
|
131
130
|
if(event.key == "Backspace" || event.key == "Tab" || event.key == "Enter") {
|
132
131
|
eventObj = event;
|
133
|
-
//ToDO switch case
|
134
132
|
if(start != end) {
|
135
133
|
updateText({element, start, end, range});
|
136
134
|
}
|
135
|
+
|
137
136
|
if(event.key == "Backspace" && start == end) {
|
138
137
|
updateText({element, start: start - 1, end, range});
|
139
138
|
}
|
140
|
-
if(event.key == 'Tab') {
|
139
|
+
else if(event.key == 'Tab') {
|
141
140
|
updateText({element, value: "\t", start, range});
|
142
141
|
}
|
143
|
-
if(event.key == "Enter") {
|
142
|
+
else if(event.key == "Enter") {
|
144
143
|
updateText({element, value: "\n", start, range});
|
145
144
|
}
|
146
145
|
event.preventDefault();
|
147
146
|
}
|
147
|
+
else if (event.ctrlKey) {
|
148
|
+
if (event.keyCode == 90)
|
149
|
+
console.log('Undo');
|
150
|
+
else if (event.keyCode == 89)
|
151
|
+
console.log('Redo');
|
152
|
+
}
|
148
153
|
}
|
149
154
|
|
150
|
-
function
|
155
|
+
function _beforeinput (event) {
|
151
156
|
if(event.stopCCText) return;
|
152
157
|
let element = event.currentTarget;
|
153
158
|
let { start, end, range } = getSelection(element);
|
154
|
-
if(
|
155
|
-
|
159
|
+
if (event.data) {
|
160
|
+
if(start != end) {
|
161
|
+
updateText({element, start, end, range});
|
162
|
+
}
|
163
|
+
eventObj = event;
|
164
|
+
updateText({element, value: event.data, start, range});
|
165
|
+
event.preventDefault();
|
166
|
+
}
|
167
|
+
}
|
168
|
+
|
169
|
+
function _input (event) {
|
170
|
+
if(event.stopCCText) return;
|
171
|
+
if (event.data) {
|
172
|
+
eventObj = event;
|
156
173
|
}
|
157
|
-
eventObj = event;
|
158
|
-
updateText({element, value: event.key, start, range});
|
159
|
-
event.preventDefault();
|
160
174
|
}
|
161
175
|
|
162
176
|
function _removeEventListeners (element) {
|
163
|
-
element.removeEventListener('click', _click);
|
164
177
|
element.removeEventListener('blur', _blur);
|
165
|
-
element.removeEventListener('keyup', _keyup);
|
166
178
|
element.removeEventListener('cut', _cut);
|
167
179
|
element.removeEventListener('paste', _paste);
|
168
180
|
element.removeEventListener('keydown', _keydown);
|
169
|
-
element.removeEventListener('
|
181
|
+
element.removeEventListener('beforeinput', _beforeinput);
|
170
182
|
}
|
171
183
|
|
172
|
-
|
173
184
|
export function sendPosition (element) {
|
174
185
|
if (!element) return;
|
175
186
|
const { start, end } = getSelection(element);
|
@@ -278,6 +289,7 @@ export function _dispatchInputEvent(element, content, start, end, prev_start, pr
|
|
278
289
|
element.dispatchEvent(event);
|
279
290
|
}
|
280
291
|
let inputEvent = new CustomEvent('input', { bubbles: true });
|
292
|
+
Object.defineProperty(inputEvent, 'stopCCText', { writable: false, value: true });
|
281
293
|
Object.defineProperty(inputEvent, 'target', { writable: false, value: element });
|
282
294
|
Object.defineProperty(inputEvent, 'detail', { writable: false, value: detail });
|
283
295
|
element.dispatchEvent(inputEvent);
|
package/src/saveDomText.js
CHANGED