diff options
| -rw-r--r-- | app/javascript/mastodon/features/ui/components/focal_point_modal.js | 26 | ||||
| -rw-r--r-- | app/javascript/mastodon/features/ui/util/async-components.js | 4 | ||||
| -rw-r--r-- | babel.config.js | 6 |
3 files changed, 24 insertions, 12 deletions
diff --git a/app/javascript/mastodon/features/ui/components/focal_point_modal.js b/app/javascript/mastodon/features/ui/components/focal_point_modal.js index b21d5c9d4..f7a5efda3 100644 --- a/app/javascript/mastodon/features/ui/components/focal_point_modal.js +++ b/app/javascript/mastodon/features/ui/components/focal_point_modal.js @@ -10,11 +10,11 @@ import { FormattedMessage, defineMessages, injectIntl } from 'react-intl'; import IconButton from 'mastodon/components/icon_button'; import Button from 'mastodon/components/button'; import Video from 'mastodon/features/video'; -import { TesseractWorker } from 'tesseract.js'; import Textarea from 'react-textarea-autosize'; import UploadProgress from 'mastodon/features/compose/components/upload_progress'; import CharacterCounter from 'mastodon/features/compose/components/character_counter'; import { length } from 'stringz'; +import { Tesseract as fetchTesseract } from 'mastodon/features/ui/util/async-components'; const messages = defineMessages({ close: { id: 'lightbox.close', defaultMessage: 'Close' }, @@ -148,19 +148,21 @@ class FocalPointModal extends ImmutablePureComponent { handleTextDetection = () => { const { media } = this.props; - const worker = new TesseractWorker({ - workerPath: `${assetHost}/packs/ocr/worker.min.js`, - corePath: `${assetHost}/packs/ocr/tesseract-core.wasm.js`, - langPath: `${assetHost}/ocr/lang-data`, - }); - this.setState({ detecting: true }); - worker.recognize(media.get('url')) - .progress(({ progress }) => this.setState({ progress })) - .finally(() => worker.terminate()) - .then(({ text }) => this.setState({ description: removeExtraLineBreaks(text), dirty: true, detecting: false })) - .catch(() => this.setState({ detecting: false })); + fetchTesseract().then(({ TesseractWorker }) => { + const worker = new TesseractWorker({ + workerPath: `${assetHost}/packs/ocr/worker.min.js`, + corePath: `${assetHost}/packs/ocr/tesseract-core.wasm.js`, + langPath: `${assetHost}/ocr/lang-data`, + }); + + worker.recognize(media.get('url')) + .progress(({ progress }) => this.setState({ progress })) + .finally(() => worker.terminate()) + .then(({ text }) => this.setState({ description: removeExtraLineBreaks(text), dirty: true, detecting: false })) + .catch(() => this.setState({ detecting: false })); + }).catch(() => this.setState({ detecting: false })); } render () { diff --git a/app/javascript/mastodon/features/ui/util/async-components.js b/app/javascript/mastodon/features/ui/util/async-components.js index 6e8ed163a..0a07aa75e 100644 --- a/app/javascript/mastodon/features/ui/util/async-components.js +++ b/app/javascript/mastodon/features/ui/util/async-components.js @@ -133,3 +133,7 @@ export function ListAdder () { export function Search () { return import(/*webpackChunkName: "features/search" */'../../search'); } + +export function Tesseract () { + return import(/*webpackChunkName: "tesseract" */'tesseract.js'); +} diff --git a/babel.config.js b/babel.config.js index a506ad8ce..3f7ff84db 100644 --- a/babel.config.js +++ b/babel.config.js @@ -20,6 +20,12 @@ module.exports = (api) => { ['react-intl', { messagesDir: './build/messages' }], 'preval', ], + overrides: [{ + test: /tesseract\.js/, + presets: [ + ['@babel/env', { ...envOptions, modules: 'commonjs' }], + ], + }], }; switch (env) { |