pages235/src/react/SignEditorProvider.tsx
2024-03-20 14:31:35 +04:00

81 lines
3 KiB
TypeScript

import { useMemo, useEffect, useState, useRef } from 'react'
import { showModal, hideModal } from '../globalState'
import { setDoPreventDefault } from '../controls'
import { options } from '../optionsStorage'
import { useIsModalActive } from './utils'
import SignEditor, { ResultType } from './SignEditor'
const isWysiwyg = async () => {
const items = await bot.tabComplete('/', true, true)
const commands = new Set<string>(['data'])
for (const item of items) {
if (commands.has(item.match as unknown as string)) {
return true
}
}
return false
}
export default () => {
const [location, setLocation] = useState<{x: number, y: number, z: number} | null>(null)
const text = useRef<string[]>(['', '', '', ''])
const [enableWysiwyg, setEnableWysiwyg] = useState(false)
const isModalActive = useIsModalActive('signs-editor-screen')
const handleClick = (result: ResultType) => {
hideModal({ reactType: 'signs-editor-screen' })
if ('plainText' in result) {
bot._client.write('update_sign', {
location,
text1: result.plainText[0],
text2: result.plainText[1],
text3: result.plainText[2],
text4: result.plainText[3]
})
} else {
if (!location) return
const command = `/data merge block ${location.x} ${location.y} ${location.z} {Text1:'` + JSON.stringify(result.dataText[0]) + '\',Text2: \'' + JSON.stringify(result.dataText[1]) + '\',Text3:\'' + JSON.stringify(result.dataText[2]) + '\',Text4:\'' + JSON.stringify(result.dataText[3]) + '\'}' // mojangson
bot.chat(command)
}
}
const handleInput = (target: HTMLInputElement) => {
const smallSymbols = /[()[\]{} ]/
const largeSymbols = /[;|',.]/
let addLength = 0
for (const letter of target.value) {
if (smallSymbols.test(letter)) {
addLength += 1 - 1 / 1.46
} else if (largeSymbols.test(letter)) {
addLength += 1 - 1 / 3
}
}
text.current[Number(target.dataset.key)] = target.value
target.setAttribute('maxlength', `${15 + Math.ceil(addLength)}`)
}
useEffect(() => {
setDoPreventDefault(!isModalActive) // disable e.preventDefault() since we might be using wysiwyg editor which doesn't use textarea and need default browser behavior to ensure characters are being typed in contenteditable container. Ideally we should do e.preventDefault() only when either ctrl, cmd (meta) or alt key is pressed.
}, [isModalActive])
useMemo(() => {
bot._client.on('open_sign_entity', (packet) => {
if (!options.autoSignEditor) return
setLocation(prev => packet.location)
showModal({ reactType: 'signs-editor-screen' })
if (options.wysiwygSignEditor === 'auto') {
void isWysiwyg().then((value) => {
setEnableWysiwyg(value)
})
} else if (options.wysiwygSignEditor === 'always') {
setEnableWysiwyg(true)
} else {
setEnableWysiwyg(false)
}
})
}, [])
if (!isModalActive) return null
return <SignEditor isWysiwyg={enableWysiwyg} handleInput={handleInput} handleClick={handleClick} />
}