|
@@ -85,6 +85,7 @@ export const useSpeak = (musicContent?: string) => {
|
|
const getSelectText = () => {
|
|
const getSelectText = () => {
|
|
const selection: any = window.getSelection();
|
|
const selection: any = window.getSelection();
|
|
const range = selection.rangeCount > 0 ? selection.getRangeAt(0) : null;
|
|
const range = selection.rangeCount > 0 ? selection.getRangeAt(0) : null;
|
|
|
|
+
|
|
// console.log(selection, 'selection');
|
|
// console.log(selection, 'selection');
|
|
if (selection.toString().length > 0) {
|
|
if (selection.toString().length > 0) {
|
|
state.showDom = true;
|
|
state.showDom = true;
|
|
@@ -97,39 +98,58 @@ export const useSpeak = (musicContent?: string) => {
|
|
focusOffset = 0;
|
|
focusOffset = 0;
|
|
console.log(selection, 'selection');
|
|
console.log(selection, 'selection');
|
|
|
|
|
|
- const firstNode =
|
|
|
|
- checkSelectionDirection(selection) === 'up'
|
|
|
|
- ? selection.anchorNode.parentNode
|
|
|
|
- : selection.focusNode.parentNode;
|
|
|
|
- const endNode =
|
|
|
|
- checkSelectionDirection(selection) === 'down'
|
|
|
|
- ? selection.anchorNode.parentNode
|
|
|
|
- : selection.focusNode.parentNode;
|
|
|
|
- if (checkSelectionDirection(selection) === 'up') {
|
|
|
|
- anchorOffset = selection.anchorOffset;
|
|
|
|
- focusOffset = selection.focusOffset;
|
|
|
|
|
|
+ // 都为0的情况下判断为选中某一个段
|
|
|
|
+ if (selection.focusOffset === 0 && selection.anchorOffset === 0) {
|
|
|
|
+ // 查找起始和结束节点的最近的元素父节点
|
|
|
|
+ const anchorNode = selection.anchorNode;
|
|
|
|
+ const startParagraph = anchorNode.parentNode.parentElement;
|
|
|
|
+
|
|
|
|
+ const firstNode = startParagraph.childNodes[0];
|
|
|
|
+ const endNode =
|
|
|
|
+ startParagraph.childNodes[startParagraph.childNodes.length - 1];
|
|
|
|
+ sentences?.forEach((element: any, index: number) => {
|
|
|
|
+ if (element === firstNode) {
|
|
|
|
+ startIndex = index;
|
|
|
|
+ anchorOffset = 0;
|
|
|
|
+ }
|
|
|
|
+ if (element === endNode) {
|
|
|
|
+ endIndex = index;
|
|
|
|
+ focusOffset = endNode.textContent.length;
|
|
|
|
+ }
|
|
|
|
+ });
|
|
} else {
|
|
} else {
|
|
- anchorOffset = selection.focusOffset;
|
|
|
|
- focusOffset = selection.anchorOffset;
|
|
|
|
- }
|
|
|
|
- sentences?.forEach((element: any, index: number) => {
|
|
|
|
- if (element === firstNode) {
|
|
|
|
- startIndex = index;
|
|
|
|
- anchorOffset =
|
|
|
|
- checkSelectionDirection(selection) === 'up'
|
|
|
|
- ? selection.anchorOffset
|
|
|
|
- : selection.focusOffset;
|
|
|
|
- }
|
|
|
|
- if (element === endNode) {
|
|
|
|
- endIndex = index;
|
|
|
|
- focusOffset =
|
|
|
|
- checkSelectionDirection(selection) === 'down'
|
|
|
|
- ? selection.anchorOffset
|
|
|
|
- : selection.focusOffset;
|
|
|
|
- // focusOffset = selection.focusOffset;
|
|
|
|
|
|
+ const firstNode =
|
|
|
|
+ checkSelectionDirection(selection) === 'up'
|
|
|
|
+ ? selection.anchorNode.parentNode
|
|
|
|
+ : selection.focusNode.parentNode;
|
|
|
|
+ const endNode =
|
|
|
|
+ checkSelectionDirection(selection) === 'down'
|
|
|
|
+ ? selection.anchorNode.parentNode
|
|
|
|
+ : selection.focusNode.parentNode;
|
|
|
|
+ if (checkSelectionDirection(selection) === 'up') {
|
|
|
|
+ anchorOffset = selection.anchorOffset;
|
|
|
|
+ focusOffset = selection.focusOffset;
|
|
|
|
+ } else {
|
|
|
|
+ anchorOffset = selection.focusOffset;
|
|
|
|
+ focusOffset = selection.anchorOffset;
|
|
}
|
|
}
|
|
- });
|
|
|
|
-
|
|
|
|
|
|
+ sentences?.forEach((element: any, index: number) => {
|
|
|
|
+ if (element === firstNode) {
|
|
|
|
+ startIndex = index;
|
|
|
|
+ anchorOffset =
|
|
|
|
+ checkSelectionDirection(selection) === 'up'
|
|
|
|
+ ? selection.anchorOffset
|
|
|
|
+ : selection.focusOffset;
|
|
|
|
+ }
|
|
|
|
+ if (element === endNode) {
|
|
|
|
+ endIndex = index;
|
|
|
|
+ focusOffset =
|
|
|
|
+ checkSelectionDirection(selection) === 'down'
|
|
|
|
+ ? selection.anchorOffset
|
|
|
|
+ : selection.focusOffset;
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ }
|
|
state.selectOptions.startIndex = startIndex;
|
|
state.selectOptions.startIndex = startIndex;
|
|
state.selectOptions.anchorOffset = anchorOffset;
|
|
state.selectOptions.anchorOffset = anchorOffset;
|
|
state.selectOptions.endIndex = endIndex;
|
|
state.selectOptions.endIndex = endIndex;
|