@cocreate/selection 1.2.14 → 1.2.18

Sign up to get free protection for your applications and to get access to all the features.
package/CHANGELOG.md CHANGED
@@ -1,3 +1,31 @@
1
+ ## [1.2.18](https://github.com/CoCreate-app/CoCreate-selection/compare/v1.2.17...v1.2.18) (2021-11-27)
2
+
3
+
4
+ ### Bug Fixes
5
+
6
+ * update docs api and cocreateJS script ([b8be3e8](https://github.com/CoCreate-app/CoCreate-selection/commit/b8be3e8c967b5de5ab7866fa56d6547a899b1a0b))
7
+
8
+ ## [1.2.17](https://github.com/CoCreate-app/CoCreate-selection/compare/v1.2.16...v1.2.17) (2021-11-26)
9
+
10
+
11
+ ### Bug Fixes
12
+
13
+ * add nav and sidenav to docs ([eb6f6f1](https://github.com/CoCreate-app/CoCreate-selection/commit/eb6f6f1d7459a57abea30a3976ce6488a36cbc25))
14
+
15
+ ## [1.2.16](https://github.com/CoCreate-app/CoCreate-selection/compare/v1.2.15...v1.2.16) (2021-11-26)
16
+
17
+
18
+ ### Bug Fixes
19
+
20
+ * update dependencies ([754df39](https://github.com/CoCreate-app/CoCreate-selection/commit/754df39e8831d33c4cdaaea4e1ff804a687faabf))
21
+
22
+ ## [1.2.15](https://github.com/CoCreate-app/CoCreate-selection/compare/v1.2.14...v1.2.15) (2021-11-24)
23
+
24
+
25
+ ### Bug Fixes
26
+
27
+ * processSelection when at position 0 ([2143e31](https://github.com/CoCreate-app/CoCreate-selection/commit/2143e313e1dcf744980df298790f13442e5715bd))
28
+
1
29
  ## [1.2.14](https://github.com/CoCreate-app/CoCreate-selection/compare/v1.2.13...v1.2.14) (2021-11-23)
2
30
 
3
31
 
package/docs/index.html CHANGED
@@ -15,7 +15,13 @@
15
15
  </head>
16
16
 
17
17
  <body>
18
- <div collection="" document_id="" name="" id="cocreate-selection">
18
+ <nav class="nav display:flex align-items:center left:0px background:whitesmoke padding-top:10px padding-bottom:10px" content_id="content" scroll="sticky-nav,hide-nav" scroll-up="10" scroll-down="10" collection="files" document_id="60395ef42b3ac232657040fd" name="src">
19
+ </nav>
20
+ <sidenav id="menuL" class="position:fixed top:0px left:0px overflow:hidden background:whitesmoke height:100vh width:0px width:300px@xl" resizable resize-target="[content_id='content']" resize-property="margin-left" resize-value="width">
21
+ <menu collection="files" document_id="603717b07de7fb350ae9fec8" name="src"></menu>
22
+ <div resize="right"></div>
23
+ </sidenav>
24
+ <main class="padding-top:15px padding:15px@lg@xl" content_id="content" id="cocreate-selection">
19
25
  <div class="display:flex flex-wrap:wrap justify-content:space-between margin:10px">
20
26
  <div class="display:flex align-items:center">
21
27
  <h2>CoCreate-selection</h2>
@@ -62,55 +68,35 @@
62
68
  <!-- SandBox -->
63
69
  <h2 class="border-bottom:1px_solid_lightgrey padding:5px_0px">Demo</h2>
64
70
  <div class="position:sticky top:0 padding:10px_0px height:100vh">
65
- <div class="container svColumn overflow:hidden card border-radius:2px width:auto height:100%" id="sandbox">
66
- <div class="font-size:20px position:absolute top:10px right:10px opacity:0.6 z-index:7">
67
- <a class="margin-right:10px" id="preview" show="preview" hide="code"><i class="far fa-eye"></i></a>
68
- <a class="margin-right:10px hidden" id="code" show="code" hide="preview"><i class="fas fa-code"></i></a>
69
- <!--<a class="margin-right:10px"><i class="far fa-window-maximize"></i></a>-->
70
- <a target="modal" href="module_activity_datatable.html"
71
- pass-collection="modules"
72
- pass-document_id=""
73
- pass-fetch_value=""
74
- pass-prefix=""
75
- pass-to="render"
76
- modal-width="600px"
77
- modal-height="400px"
78
- modal-color="#229954"
79
- modal-header="false"
80
- class="margin-right:10px">
81
- <i class="fas fa-external-link-alt"></i>
82
- </a>
83
- <a class="fs-toggle margin-right:5px" fullscreen target="#sandbox"><i class="fas fa-expand"></i></a>
84
- </div>
85
-
86
- <div class="svRow">
87
-
88
- <div class="svColumn">
89
-
90
- <div class="svPanel">
91
- <div realtime="false"
92
- collection="modules"
93
- document_id="5eefe30952c6e94c75fb5e3f"
94
- name="html"
95
- id="7"
96
- class="codemirror height:100% min-width:300px">
97
- </div>
98
- </div>
99
- <div class="svSplitter svHorizontal"> </div>
100
-
101
- <div class="svPanel">
102
- <iframe get-value="7" frameBorder="0" height="100%" width="100%" class="min-width:300px"></iframe>
103
- </div>
104
-
105
- </div>
106
- </div>
107
- </div>
108
- <!-- End SandBox -->
71
+ <!-- SandBox -->
72
+ <div class="container svColumn overflow:hidden card position:relative border-radius:2px width:auto height:100%" id="sandbox">
73
+ <div class="font-size:20px position:absolute top:10px right:10px opacity:0.6">
74
+ <a class="margin-right:10px" id="code" show="#preview" hide="#code, #view"><i class="far fa-eye"></i></a>
75
+ <a class="margin-right:10px hidden" id="preview" show="#code, #view" hide="#preview"><i class="fas fa-code"></i></a>
76
+ <a class="margin-right:5px" fullscreen target="#playground"><i class="fas fa-expand"></i></a>
77
+ </div>
78
+ <div class="svRow">
79
+
80
+ <div class="svColumn">
81
+
82
+ <div class="svPanel" id="view">
83
+ <textarea collection="demos" document_id="" name="demo" save="false" id="demo" class="height:100% width:100% border:none resize:none padding:5px"></textarea>
84
+ </div>
85
+ <div class="svSplitter svHorizontal"> </div>
86
+
87
+ <div class="svPanel">
88
+ <iframe get-value="demo" frameBorder="0" height="100%" width="100%" class="min-width:300px"></iframe>
89
+ </div>
90
+
91
+ </div>
92
+ </div>
93
+ </div>
94
+ <!-- End SandBox -->
109
95
  </div>
110
96
  </div>
111
97
 
112
98
  </div>
113
- </div>
99
+ </main>
114
100
  <script src="/apikey.js"></script>
115
101
  <script src="https://cdn.cocreate.app/latest/CoCreate.min.js" ></script>
116
102
  </body>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cocreate/selection",
3
- "version": "1.2.14",
3
+ "version": "1.2.18",
4
4
  "description": "A simple selection component in vanilla javascript. Easily configured using HTML5 data-attributes and/or JavaScript API.",
5
5
  "keywords": [
6
6
  "selection",
@@ -61,8 +61,8 @@
61
61
  "webpack-log": "^3.0.1"
62
62
  },
63
63
  "dependencies": {
64
- "@cocreate/docs": "^1.2.55",
65
- "@cocreate/hosting": "^1.2.51",
66
- "@cocreate/utils": "^1.3.11"
64
+ "@cocreate/docs": "^1.2.56",
65
+ "@cocreate/hosting": "^1.2.52",
66
+ "@cocreate/utils": "^1.3.12"
67
67
  }
68
68
  }
package/src/index.js CHANGED
@@ -20,7 +20,7 @@ export function getSelection(element) {
20
20
  let start = range.startOffset;
21
21
  let end = range.endOffset;
22
22
  let previousSibling = range.startContainer.previousSibling;
23
- if(previousSibling && previousSibling.nodeType == 3) {
23
+ if(element.innerHTML && previousSibling && previousSibling.nodeType == 3) {
24
24
  let length = 0;
25
25
  do {
26
26
  length += previousSibling.length;
@@ -29,6 +29,7 @@ export function getSelection(element) {
29
29
  start += length;
30
30
  end += length;
31
31
  }
32
+
32
33
  if(range.startContainer != range.endContainer) {
33
34
  // toDo: replace common ancestor value
34
35
  }
@@ -37,7 +38,7 @@ export function getSelection(element) {
37
38
  domTextEditor = element.closest('[contenteditable]');
38
39
  }
39
40
  let elementStart = start, elementEnd = end;
40
- if (domTextEditor){
41
+ if (domTextEditor && domTextEditor.htmlString){
41
42
  let nodePos = getStringPosition({ string: domTextEditor.htmlString, target: range.startContainer.parentElement, position: 'afterbegin'});
42
43
  if (nodePos){
43
44
  elementStart = nodePos.start;
@@ -46,11 +47,20 @@ export function getSelection(element) {
46
47
  end = end + nodePos.end;
47
48
  }
48
49
  }
50
+
51
+ let startContainer = range.startContainer;
52
+ if (startContainer.nodeType == 3)
53
+ startContainer = range.startContainer.parentElement;
54
+
55
+ let endContainer = range.endContainer;
56
+ if (endContainer.nodeType == 3)
57
+ endContainer = range.endContainer.parentElement;
58
+
49
59
  let rangeObj = {
50
60
  startOffset: range.startOffset,
51
61
  endOffset: range.endOffset,
52
- startContainer: range.startContainer.parentElement,
53
- endContainer: range.endContainer.parentElement,
62
+ startContainer,
63
+ endContainer,
54
64
  elementStart,
55
65
  elementEnd
56
66
  };
@@ -85,8 +95,9 @@ export function processSelection(element, value = "", prev_start, prev_end, star
85
95
  }
86
96
  else if (prevStart < prev_start){
87
97
  let length = prev_start - prevStart;
88
- if(Math.sign(length) === 1 && range.startOffset >= length)
89
- range.startOffset += length;
98
+ if(Math.sign(length) === 1)
99
+ if (range.startOffset == 0 || range.startOffset >= length)
100
+ range.startOffset += length;
90
101
  }
91
102
  if (prevEnd > prev_end){
92
103
  let length = prevEnd - prev_end;
@@ -95,8 +106,9 @@ export function processSelection(element, value = "", prev_start, prev_end, star
95
106
  }
96
107
  else if (prevEnd < prev_end){
97
108
  let length = prev_end - prevEnd;
98
- if(Math.sign(length) === 1 && range.endOffset >= length)
99
- range.endOffset += length;
109
+ if(Math.sign(length) === 1)
110
+ if (range.endOffset == 0 || range.endOffset >= length)
111
+ range.endOffset += length;
100
112
  }
101
113
  }
102
114