From f63a57a147314137a8f329411a1d61d5d4a44c51 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=BB=84=E4=BA=91=E9=A3=9E?= Date: Mon, 6 Jun 2022 17:32:17 +0800 Subject: [PATCH 1/4] feat:add word count web worker --- index.html | 1 + src/editor/core/command/Command.ts | 6 +++++ src/editor/core/command/CommandAdapt.ts | 7 ++++++ src/editor/core/draw/Draw.ts | 8 +++++++ src/editor/core/worker/WorkerManager.ts | 28 +++++++++++++++++++++++ src/editor/core/worker/works/wordCount.ts | 7 ++++++ src/main.ts | 5 ++++ 7 files changed, 62 insertions(+) create mode 100644 src/editor/core/worker/WorkerManager.ts create mode 100644 src/editor/core/worker/works/wordCount.ts diff --git a/index.html b/index.html index 30b2f62..38a7e7d 100644 --- a/index.html +++ b/index.html @@ -208,6 +208,7 @@ 可见页码：1 页面：1/1 + 字数：0
编辑模式
diff --git a/src/editor/core/command/Command.ts b/src/editor/core/command/Command.ts index f5894b9..84df0fc 100644 --- a/src/editor/core/command/Command.ts +++ b/src/editor/core/command/Command.ts @@ -57,6 +57,7 @@ export class Command { private static print: Function private static getImage: Function private static getValue: Function + private static getWordCount: Function private static pageMode: Function private static pageScaleRecovery: Function private static pageScaleMinus: Function @@ -112,6 +113,7 @@ export class Command { Command.print = adapt.print.bind(adapt) Command.getImage = adapt.getImage.bind(adapt) Command.getValue = adapt.getValue.bind(adapt) + Command.getWordCount = adapt.getWordCount.bind(adapt) Command.pageMode = adapt.pageMode.bind(adapt) Command.pageScaleRecovery = adapt.pageScaleRecovery.bind(adapt) Command.pageScaleMinus = adapt.pageScaleMinus.bind(adapt) @@ -315,6 +317,10 @@ export class Command { return Command.getValue() } + public getWordCount(): Promise { + return Command.getWordCount() + } + // 页面模式、页面缩放 public executePageMode(payload: PageMode) { return Command.pageMode(payload) diff --git a/src/editor/core/command/CommandAdapt.ts b/src/editor/core/command/CommandAdapt.ts index bdf320f..2ed2279 100644 --- a/src/editor/core/command/CommandAdapt.ts +++ b/src/editor/core/command/CommandAdapt.ts @@ -23,6 +23,7 @@ import { CanvasEvent } from '../event/CanvasEvent' import { HistoryManager } from '../history/HistoryManager' import { Position } from '../position/Position' import { RangeManager } from '../range/RangeManager' +import { WorkerManager } from '../worker/WorkerManager' export class CommandAdapt { @@ -37,6 +38,7 @@ export class CommandAdapt { private tableTool: TableTool private options: Required private control: Control + private workerManager: WorkerManager constructor(draw: Draw) { this.draw = draw @@ -47,6 +49,7 @@ export class CommandAdapt { this.tableTool = draw.getTableTool() this.options = draw.getOptions() this.control = draw.getControl() + this.workerManager = draw.getWorkerManager() } public mode(payload: EditorMode) { @@ -1243,6 +1246,10 @@ export class CommandAdapt { return this.draw.getValue() } + public getWordCount(): Promise { + return this.workerManager.getWordCount() + } + public pageMode(payload: PageMode) { this.draw.setPageMode(payload) } diff --git a/src/editor/core/draw/Draw.ts b/src/editor/core/draw/Draw.ts index fc03a8f..1b63299 100644 --- a/src/editor/core/draw/Draw.ts +++ b/src/editor/core/draw/Draw.ts @@ -41,6 +41,7 @@ import { CheckboxParticle } from './particle/CheckboxParticle' import { DeepRequired } from '../../interface/Common' import { ControlComponent } from '../../dataset/enum/Control' import { formatElementList } from '../../utils/element' +import { WorkerManager } from '../worker/WorkerManager' export class Draw { @@ -79,6 +80,7 @@ export class Draw { private subscriptParticle: SubscriptParticle private checkboxParticle: CheckboxParticle private control: Control + private workerManager: WorkerManager private rowList: IRow[] private painterStyle: IElementStyle | null @@ -138,6 +140,8 @@ export class Draw { const globalEvent = new GlobalEvent(this, this.canvasEvent) globalEvent.register() + this.workerManager = new WorkerManager(this) + this.rowList = [] this.painterStyle = null this.painterOptions = null @@ -363,6 +367,10 @@ export class Draw { return this.control } + public getWorkerManager(): WorkerManager { + return this.workerManager + } + public getRowCount(): number { return this.rowList.length } diff --git a/src/editor/core/worker/WorkerManager.ts b/src/editor/core/worker/WorkerManager.ts new file mode 100644 index 0000000..fc3db2d --- /dev/null +++ b/src/editor/core/worker/WorkerManager.ts @@ -0,0 +1,28 @@ +import { Draw } from '../draw/Draw' + +export class WorkerManager { + + private draw: Draw + private wordCountWorker: Worker + + constructor(draw: Draw) { + this.draw = draw + this.wordCountWorker = new Worker(new URL('./works/wordCount.ts', import.meta.url)) + } + + public getWordCount(): Promise { + return new Promise((resolve, reject) => { + this.wordCountWorker.onmessage = (evt) => { + resolve(evt.data) + } + + this.wordCountWorker.onerror = (evt) => { + reject(evt) + } + + const elementList = this.draw.getOriginalElementList() + this.wordCountWorker.postMessage(elementList) + }) + } + +} \ No newline at end of file diff --git a/src/editor/core/worker/works/wordCount.ts b/src/editor/core/worker/works/wordCount.ts new file mode 100644 index 0000000..45513c7 --- /dev/null +++ b/src/editor/core/worker/works/wordCount.ts @@ -0,0 +1,7 @@ +import { IElement } from '../../../interface/Element' + +onmessage = (evt) => { + const elementList = evt.data + // TODO: + postMessage(elementList.length) +} diff --git a/src/main.ts b/src/main.ts index 6b298aa..64818c6 100644 --- a/src/main.ts +++ b/src/main.ts @@ -754,6 +754,11 @@ window.onload = function () { activeMode.classList.add('active') } + instance.listener.contentChange = async function () { + const wordCount = await instance.command.getWordCount() + document.querySelector('.word-count')!.innerText = `${wordCount || 0}` + } + instance.listener.saved = function (payload) { console.log('elementList: ', payload) } From cf16ab9650f90591994b7f2c5f62b393c614467c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=BB=84=E4=BA=91=E9=A3=9E?= Date: Tue, 7 Jun 2022 18:09:47 +0800 Subject: [PATCH 2/4] feat:add pick text for word count --- src/editor/core/worker/works/wordCount.ts | 92 ++++++++++++++++++++++- 1 file changed, 90 insertions(+), 2 deletions(-) diff --git a/src/editor/core/worker/works/wordCount.ts b/src/editor/core/worker/works/wordCount.ts index 45513c7..69ef70a 100644 --- a/src/editor/core/worker/works/wordCount.ts +++ b/src/editor/core/worker/works/wordCount.ts @@ -1,7 +1,95 @@ import { IElement } from '../../../interface/Element' +enum ElementType { + TEXT = 'text', + TABLE = 'table', + HYPERLINK = 'hyperlink', + CONTROL = 'control' +} + +enum ControlComponent { + VALUE = 'value' +} + +function pickText(elementList: IElement[]): string { + let text = '' + let e = 0 + while (e < elementList.length) { + const element = elementList[e] + // 表格、超链接递归处理 + if (element.type === ElementType.TABLE) { + if (element.trList) { + for (let t = 0; t < element.trList.length; t++) { + const tr = element.trList[t] + for (let d = 0; d < tr.tdList.length; d++) { + const td = tr.tdList[d] + text += pickText(td.value) + } + } + } + } else if (element.type === ElementType.HYPERLINK) { + const hyperlinkId = element.hyperlinkId + const valueList: IElement[] = [] + while (e < elementList.length) { + const hyperlinkE = elementList[e] + if (hyperlinkId !== hyperlinkE.hyperlinkId) { + e-- + break + } + delete hyperlinkE.type + valueList.push(hyperlinkE) + e++ + } + text += pickText(valueList) + } else if (element.type === ElementType.CONTROL) { + const controlId = element.controlId + const valueList: IElement[] = [] + while (e < elementList.length) { + const controlE = elementList[e] + if (controlId !== controlE.controlId) { + e-- + break + } + if (controlE.controlComponent === ControlComponent.VALUE) { + delete controlE.type + valueList.push(controlE) + } + e++ + } + text += pickText(valueList) + } + // 文本追加 + if (!element.type || element.type === ElementType.TEXT) { + text += element.value + } + e++ + } + return text +} + +function groupText(text: string): string[] { + const textList: string[] = [] + for (const t of text) { + textList.push(t) + } + return textList +} + onmessage = (evt) => { const elementList = evt.data - // TODO: - postMessage(elementList.length) + + // 提取所有文本 + const originText = pickText(elementList) + + // 过滤文本 + const ZERO = '\u200B' + const WRAP = '\n' + const filterText = originText + .replace(new RegExp(`^${ZERO}`), '') + .replace(new RegExp(ZERO, 'g'), WRAP) + + // 英文或数字以逗号/换行符分隔为一个字数 + const textGroup = groupText(filterText) + + postMessage(textGroup.length) } From 319467723f7a624d07aa09e5d469bbcb1d28ce31 Mon Sep 17 00:00:00 2001 From: Hufe921 Date: Tue, 7 Jun 2022 21:46:25 +0800 Subject: [PATCH 3/4] feat:add word count --- src/editor/core/worker/works/wordCount.ts | 56 ++++++++++++++++++----- 1 file changed, 45 insertions(+), 11 deletions(-) diff --git a/src/editor/core/worker/works/wordCount.ts b/src/editor/core/worker/works/wordCount.ts index 69ef70a..2a98eae 100644 --- a/src/editor/core/worker/works/wordCount.ts +++ b/src/editor/core/worker/works/wordCount.ts @@ -11,6 +11,9 @@ enum ControlComponent { VALUE = 'value' } +const ZERO = '\u200B' +const WRAP = '\n' + function pickText(elementList: IElement[]): string { let text = '' let e = 0 @@ -68,28 +71,59 @@ function pickText(elementList: IElement[]): string { } function groupText(text: string): string[] { - const textList: string[] = [] + const characterList: string[] = [] + // 英文或数字整体分隔为一个字数 + const numberReg = /[0-9]/ + const letterReg = /[A-Za-z]/ + const blankReg = /\s/ + // for of 循环字符 + let isPreLetter = false + let isPreNumber = false + let compositionText = '' + // 处理组合文本 + function pushCompositionText() { + if (compositionText) { + characterList.push(compositionText) + compositionText = '' + } + } for (const t of text) { - textList.push(t) + if (letterReg.test(t)) { + if (!isPreLetter) { + pushCompositionText() + } + compositionText += t + isPreLetter = true + isPreNumber = false + } else if (numberReg.test(t)) { + if (!isPreNumber) { + pushCompositionText() + } + compositionText += t + isPreLetter = false + isPreNumber = true + } else { + pushCompositionText() + isPreLetter = false + isPreNumber = false + if (!blankReg.test(t)) { + characterList.push(t) + } + } } - return textList + pushCompositionText() + return characterList } onmessage = (evt) => { const elementList = evt.data - - // 提取所有文本 + // 提取文本 const originText = pickText(elementList) - // 过滤文本 - const ZERO = '\u200B' - const WRAP = '\n' const filterText = originText .replace(new RegExp(`^${ZERO}`), '') .replace(new RegExp(ZERO, 'g'), WRAP) - - // 英文或数字以逗号/换行符分隔为一个字数 + // 文本分组 const textGroup = groupText(filterText) - postMessage(textGroup.length) } From 8ae0e4769041bafd03455654b857d5746beb1891 Mon Sep 17 00:00:00 2001 From: Hufe921 Date: Tue, 7 Jun 2022 22:11:42 +0800 Subject: [PATCH 4/4] feat:update web worker import --- src/editor/core/worker/WorkerManager.ts | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/editor/core/worker/WorkerManager.ts b/src/editor/core/worker/WorkerManager.ts index fc3db2d..efd2ede 100644 --- a/src/editor/core/worker/WorkerManager.ts +++ b/src/editor/core/worker/WorkerManager.ts @@ -1,4 +1,5 @@ import { Draw } from '../draw/Draw' +import WordCountWorker from './works/wordCount?worker' export class WorkerManager { @@ -7,7 +8,7 @@ export class WorkerManager { constructor(draw: Draw) { this.draw = draw - this.wordCountWorker = new Worker(new URL('./works/wordCount.ts', import.meta.url)) + this.wordCountWorker = new WordCountWorker() } public getWordCount(): Promise {