|
@@ -141,8 +141,7 @@ export class TextEditor {
|
|
height: '100%',
|
|
height: '100%',
|
|
resize: 'none',
|
|
resize: 'none',
|
|
opacity: 0,
|
|
opacity: 0,
|
|
- touchAction: 'none',
|
|
|
|
- zIndex: 1
|
|
|
|
|
|
+ touchAction: 'none'
|
|
}
|
|
}
|
|
)
|
|
)
|
|
this.textContainer.append(textarea)
|
|
this.textContainer.append(textarea)
|
|
@@ -444,8 +443,6 @@ export class TextEditor {
|
|
|
|
|
|
} else if (this.state === 2) {
|
|
} else if (this.state === 2) {
|
|
if (isMobileDevice) {
|
|
if (isMobileDevice) {
|
|
- this.textarea.focus()
|
|
|
|
-
|
|
|
|
const offsetX = e.changedTouches[0].clientX - this.pageViewer.div.getBoundingClientRect().left
|
|
const offsetX = e.changedTouches[0].clientX - this.pageViewer.div.getBoundingClientRect().left
|
|
const offsetY = e.changedTouches[0].clientY - this.pageViewer.div.getBoundingClientRect().top
|
|
const offsetY = e.changedTouches[0].clientY - this.pageViewer.div.getBoundingClientRect().top
|
|
|
|
|
|
@@ -575,6 +572,7 @@ export class TextEditor {
|
|
|
|
|
|
let endPoint
|
|
let endPoint
|
|
if (isMobileDevice) {
|
|
if (isMobileDevice) {
|
|
|
|
+ this.textarea.focus()
|
|
const offsetX = e.changedTouches[0].clientX - this.pageViewer.div.getBoundingClientRect().left
|
|
const offsetX = e.changedTouches[0].clientX - this.pageViewer.div.getBoundingClientRect().left
|
|
const offsetY = e.changedTouches[0].clientY - this.pageViewer.div.getBoundingClientRect().top
|
|
const offsetY = e.changedTouches[0].clientY - this.pageViewer.div.getBoundingClientRect().top
|
|
|
|
|
|
@@ -635,10 +633,11 @@ export class TextEditor {
|
|
this.textarea.addEventListener('blur', this.onBlur)
|
|
this.textarea.addEventListener('blur', this.onBlur)
|
|
this.textarea.addEventListener('keydown', this.onKeydown)
|
|
this.textarea.addEventListener('keydown', this.onKeydown)
|
|
this.textarea.addEventListener(this.textInput, this.onTextInput)
|
|
this.textarea.addEventListener(this.textInput, this.onTextInput)
|
|
- if (this.isFirefox) {
|
|
|
|
|
|
+ if (this.isFirefox || isMobileDevice) {
|
|
this.textarea.addEventListener('compositionstart', this.onCompositionstart)
|
|
this.textarea.addEventListener('compositionstart', this.onCompositionstart)
|
|
this.textarea.addEventListener('compositionend', this.onCompositionend)
|
|
this.textarea.addEventListener('compositionend', this.onCompositionend)
|
|
}
|
|
}
|
|
|
|
+ onClickOutsideUp([this.textContainer], this.handleTextOutside.bind(this))
|
|
}
|
|
}
|
|
|
|
|
|
this.frameContainer.classList.add('selected')
|
|
this.frameContainer.classList.add('selected')
|
|
@@ -836,6 +835,11 @@ export class TextEditor {
|
|
// console.log('blur')
|
|
// console.log('blur')
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+ handleTextOutside () {
|
|
|
|
+ this.cursor?.remove()
|
|
|
|
+ this.cursor = null
|
|
|
|
+ }
|
|
|
|
+
|
|
async handleOutside () {
|
|
async handleOutside () {
|
|
if (this.moving) {
|
|
if (this.moving) {
|
|
const elements = [this.textContainer, this.outerLine, this.deletetButton]
|
|
const elements = [this.textContainer, this.outerLine, this.deletetButton]
|
|
@@ -911,7 +915,7 @@ export class TextEditor {
|
|
this.textarea.removeEventListener('blur', this.onBlur)
|
|
this.textarea.removeEventListener('blur', this.onBlur)
|
|
this.textarea.removeEventListener('keydown', this.onKeydown)
|
|
this.textarea.removeEventListener('keydown', this.onKeydown)
|
|
this.textarea.removeEventListener(this.textInput, this.onTextInput)
|
|
this.textarea.removeEventListener(this.textInput, this.onTextInput)
|
|
- if (this.isFirefox) {
|
|
|
|
|
|
+ if (this.isFirefox || isMobileDevice) {
|
|
this.textarea.removeEventListener('compositionstart', this.onCompositionstart)
|
|
this.textarea.removeEventListener('compositionstart', this.onCompositionstart)
|
|
this.textarea.removeEventListener('compositionend', this.onCompositionend)
|
|
this.textarea.removeEventListener('compositionend', this.onCompositionend)
|
|
}
|
|
}
|
|
@@ -996,7 +1000,7 @@ export class TextEditor {
|
|
|
|
|
|
let data = e.data
|
|
let data = e.data
|
|
|
|
|
|
- if (this.isFirefox) {
|
|
|
|
|
|
+ if (this.isFirefox || isMobileDevice) {
|
|
if (e.inputType === 'insertLineBreak') {
|
|
if (e.inputType === 'insertLineBreak') {
|
|
data = '\n'
|
|
data = '\n'
|
|
} else if (this.composing || data === null) {
|
|
} else if (this.composing || data === null) {
|
|
@@ -1740,7 +1744,7 @@ export class TextEditor {
|
|
this.textarea.addEventListener('blur', this.onBlur)
|
|
this.textarea.addEventListener('blur', this.onBlur)
|
|
this.textarea.addEventListener('keydown', this.onKeydown)
|
|
this.textarea.addEventListener('keydown', this.onKeydown)
|
|
this.textarea.addEventListener(this.textInput, this.onTextInput)
|
|
this.textarea.addEventListener(this.textInput, this.onTextInput)
|
|
- if (this.isFirefox) {
|
|
|
|
|
|
+ if (this.isFirefox || isMobileDevice) {
|
|
this.textarea.addEventListener('compositionstart', this.onCompositionstart)
|
|
this.textarea.addEventListener('compositionstart', this.onCompositionstart)
|
|
this.textarea.addEventListener('compositionend', this.onCompositionend)
|
|
this.textarea.addEventListener('compositionend', this.onCompositionend)
|
|
}
|
|
}
|