Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

feat(docs): set inline style at cursor #3846

Merged
merged 3 commits into from
Oct 24, 2024
Merged

feat(docs): set inline style at cursor #3846

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
eb23499
feat: set inline style at cursor
Jocs Oct 24, 2024
3a49b5e
fix: remove ununsed codes
Jocs Oct 24, 2024
1cefa80
fix: remove some failed test case
Jocs Oct 24, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
76 changes: 69 additions & 7 deletions packages/core/src/docs/data-model/text-x/__tests__/apply.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -384,13 +384,6 @@ describe('apply method', () => {
const resultC = TextX.apply(doc3, composedAction1);
const resultD = TextX.apply(doc4, composedAction2);

// console.log(JSON.stringify(resultA, null, 2));
// console.log(JSON.stringify(resultB, null, 2));

// console.log('composedAction1', JSON.stringify(composedAction1, null, 2));

// console.log(JSON.stringify(resultC, null, 2));

expect(resultA).toEqual(resultB);
expect(resultC).toEqual(resultD);
expect(resultA).toEqual(resultC);
Expand Down Expand Up @@ -478,4 +471,73 @@ describe('apply method', () => {
expect(resultA).toEqual(resultC);
expect(composedAction1).toEqual(composedAction2);
});

it('should get the same result when set different style at 2 clients', () => {
const actionsA: TextXAction[] = [
{
t: TextXActionType.RETAIN,
len: 1,
segmentId: '',
}, {
t: TextXActionType.RETAIN,
len: 1,
segmentId: '',
body: {
dataStream: '',
textRuns: [{
st: 0,
ed: 1,
ts: { fs: 9 },
}],
},
},
];

const actionsB: TextXAction[] = [
{
t: TextXActionType.RETAIN,
len: 2,
segmentId: '',
body: {
dataStream: '',
textRuns: [{
st: 0,
ed: 2,
ts: {
cl: {
rgb: '#ee0000',
},
},
}],
},
},
];

const doc1 = getDefaultDocWithLength2();
const doc2 = getDefaultDocWithLength2();
const doc3 = getDefaultDocWithLength2();
const doc4 = getDefaultDocWithLength2();

const resultA = TextX.apply(TextX.apply(doc1, actionsA), TextX.transform(actionsB, actionsA, 'left'));
const resultB = TextX.apply(TextX.apply(doc2, actionsB), TextX.transform(actionsA, actionsB, 'right'));

const composedAction1 = TextX.compose(actionsA, TextX.transform(actionsB, actionsA, 'left'));
const composedAction2 = TextX.compose(actionsB, TextX.transform(actionsA, actionsB, 'right'));

const resultC = TextX.apply(doc3, composedAction1);
const resultD = TextX.apply(doc4, composedAction2);

// console.log(JSON.stringify(resultA, null, 2));
// console.log(JSON.stringify(resultB, null, 2));

// console.log('composedAction1', JSON.stringify(composedAction1, null, 2));
// console.log('composedAction2', JSON.stringify(composedAction2, null, 2));

// console.log(JSON.stringify(resultC, null, 2));

expect(resultA).toEqual(resultB);
expect(resultC).toEqual(resultD);
expect(resultA).toEqual(resultC);
expect(composedAction1).toEqual(composedAction2);
});
});
32 changes: 16 additions & 16 deletions packages/core/src/docs/data-model/text-x/apply-utils/common.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,15 +33,15 @@ export function normalizeTextRuns(textRuns: ITextRun[]) {
const results: ITextRun[] = [];

for (const textRun of textRuns) {
const { ed, ts } = textRun;
const { st, ed, ts } = textRun;

if (textRun.sId === undefined) {
delete textRun.sId;
}

// if (st === ed) {
// continue;
// }
if (st === ed) {
continue;
}

// Delete textRun if it has no style(ts is empty or has no sId)
if (Tools.isEmptyObject(ts) && textRun.sId == null) {
Expand Down Expand Up @@ -473,18 +473,18 @@ export function deleteTextRuns(body: IDocumentBody, textLength: number, currentI
const removeTextRuns: ITextRun[] = [];

// Handles special case where repeated set inline format style by cursor.
if (startIndex === endIndex && textRuns?.find((t) => t.st === currentIndex && t.ed === currentIndex)) {
const textRun = textRuns.find((t) => t.st === currentIndex && t.ed === currentIndex)!;
removeTextRuns.push({
...textRun,
st: textRun.st - currentIndex,
ed: textRun.ed - currentIndex,
});

body.textRuns = body.textRuns?.filter((t) => t !== textRun);

return removeTextRuns;
}
// if (startIndex === endIndex && textRuns?.find((t) => t.st === currentIndex && t.ed === currentIndex)) {
// const textRun = textRuns.find((t) => t.st === currentIndex && t.ed === currentIndex)!;
// removeTextRuns.push({
// ...textRun,
// st: textRun.st - currentIndex,
// ed: textRun.ed - currentIndex,
// });

// body.textRuns = body.textRuns?.filter((t) => t !== textRun);

// return removeTextRuns;
// }

if (textRuns) {
const newTextRuns = [];
Expand Down
17 changes: 11 additions & 6 deletions packages/docs-ui/src/basics/paragraph.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,22 +14,27 @@
* limitations under the License.
*/

import type { ICustomTable, IParagraph, ITextRun } from '@univerjs/core';
import type { ICustomTable, IParagraph, ITextRun, ITextStyle, Nullable } from '@univerjs/core';

export function hasParagraphInTable(paragraph: IParagraph, tables: ICustomTable[]) {
return tables.some((table) => paragraph.startIndex > table.startIndex && paragraph.startIndex < table.endIndex);
}

export function getTextRunAtPosition(textRuns: ITextRun[], position: number) {
export function getTextRunAtPosition(textRuns: ITextRun[], position: number, cacheStyle?: Nullable<ITextStyle>) {
for (let i = textRuns.length - 1; i >= 0; i--) {
const textRun = textRuns[i];
const { st, ed } = textRun;
if (st === ed && position === st) {
return textRun;
}

if (position > st && position <= ed) {
return textRun;
return {
...textRun,
ts: {
...textRun.ts,
...cacheStyle,
},
};
}
}

return cacheStyle ? { ts: cacheStyle } : null;
}
5 changes: 4 additions & 1 deletion packages/docs-ui/src/commands/commands/ime-input.command.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ import { RichTextEditingMutation } from '@univerjs/docs';
import { IRenderManagerService, type ITextRangeWithStyle } from '@univerjs/engine-render';
import { getTextRunAtPosition } from '../../basics/paragraph';
import { DocIMEInputManagerService } from '../../services/doc-ime-input-manager.service';
import { DocMenuStyleService } from '../../services/doc-menu-style.service';
import { getRichTextEditPath } from '../util';

export interface IIMEInputCommandParams {
Expand All @@ -42,6 +43,7 @@ export const IMEInputCommand: ICommand<IIMEInputCommandParams> = {
const commandService = accessor.get(ICommandService);
const renderManagerService = accessor.get(IRenderManagerService);
const univerInstanceService = accessor.get(IUniverInstanceService);
const docMenuStyleService = accessor.get(DocMenuStyleService);

const imeInputManagerService = renderManagerService.getRenderById(unitId)?.with(DocIMEInputManagerService);
const docDataModel = univerInstanceService.getUnit<DocumentDataModel>(unitId, UniverInstanceType.UNIVER_DOC);
Expand Down Expand Up @@ -86,7 +88,8 @@ export const IMEInputCommand: ICommand<IIMEInputCommandParams> = {
},
};

const curTextRun = getTextRunAtPosition(body.textRuns ?? [], startOffset + oldTextLen);
const styleCache = docMenuStyleService.getStyleCache();
const curTextRun = getTextRunAtPosition(body.textRuns ?? [], startOffset + oldTextLen, styleCache);

const textX = new TextX();
const jsonX = JSONX.getInstance();
Expand Down
16 changes: 15 additions & 1 deletion packages/docs-ui/src/commands/commands/inline-format.command.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@
*/

import type {
DocumentDataModel,
ICommand, IDocumentBody, IMutationInfo, IStyleBase, ITextDecoration, ITextRun,
} from '@univerjs/core';
import type { IRichTextEditingMutationParams } from '@univerjs/docs';
Expand All @@ -24,8 +25,10 @@ import {
ICommandService, IUniverInstanceService,
JSONX, MemoryCursor,
TextX, TextXActionType,
UniverInstanceType,
} from '@univerjs/core';
import { DocSelectionManagerService, RichTextEditingMutation } from '@univerjs/docs';
import { DocMenuStyleService } from '../../services/doc-menu-style.service';
import { getRichTextEditPath } from '../util';

function handleInlineFormat(
Expand Down Expand Up @@ -233,6 +236,7 @@ export const SetInlineFormatCommand: ICommand<ISetInlineFormatCommandParams> = {
const commandService = accessor.get(ICommandService);
const docSelectionManagerService = accessor.get(DocSelectionManagerService);
const univerInstanceService = accessor.get(IUniverInstanceService);
const docMenuStyleService = accessor.get(DocMenuStyleService);

const docRanges = docSelectionManagerService.getDocRanges();

Expand All @@ -242,7 +246,7 @@ export const SetInlineFormatCommand: ICommand<ISetInlineFormatCommandParams> = {

const segmentId = docRanges[0].segmentId;

const docDataModel = univerInstanceService.getCurrentUniverDocInstance();
const docDataModel = univerInstanceService.getCurrentUnitForType<DocumentDataModel>(UniverInstanceType.UNIVER_DOC);
if (docDataModel == null) {
return false;
}
Expand Down Expand Up @@ -315,6 +319,16 @@ export const SetInlineFormatCommand: ICommand<ISetInlineFormatCommandParams> = {
continue;
}

if (startOffset === endOffset) {
// Cache the menu style for next input.
docMenuStyleService.setStyleCache(
{
[COMMAND_ID_TO_FORMAT_KEY_MAP[preCommandId]]: formatValue,
}
);
continue;
}

const body: IDocumentBody = {
dataStream: '',
textRuns: [
Expand Down
20 changes: 17 additions & 3 deletions packages/docs-ui/src/controllers/menu/menu.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -54,6 +54,7 @@ import { COLOR_PICKER_COMPONENT } from '../../components/color-picker';
import { FONT_FAMILY_COMPONENT, FONT_FAMILY_ITEM_COMPONENT } from '../../components/font-family';
import { FONT_SIZE_COMPONENT } from '../../components/font-size';
import { BULLET_LIST_TYPE_COMPONENT, ORDER_LIST_TYPE_COMPONENT } from '../../components/list-type-picker';
import { DocMenuStyleService } from '../../services/doc-menu-style.service';

function getInsertTableHiddenObservable(
accessor: IAccessor
Expand Down Expand Up @@ -913,19 +914,26 @@ export function BackgroundColorSelectorMenuItemFactory(accessor: IAccessor): IMe
function getFontStyleAtCursor(accessor: IAccessor) {
const univerInstanceService = accessor.get(IUniverInstanceService);
const textSelectionService = accessor.get(DocSelectionManagerService);
const docMenuStyleService = accessor.get(DocMenuStyleService);

const docDataModel = univerInstanceService.getCurrentUniverDocInstance();
const activeTextRange = textSelectionService.getActiveTextRange();
const cacheStyle = docMenuStyleService.getStyleCache() ?? {};

if (docDataModel == null || activeTextRange == null) {
return;
return {
ts: cacheStyle,
};
}

const { startOffset, segmentId } = activeTextRange;

const textRuns = docDataModel.getSelfOrHeaderFooterModel(segmentId).getBody()?.textRuns;

if (textRuns == null) {
return;
return {
ts: cacheStyle,
};
}

let textRun;
Expand All @@ -939,7 +947,13 @@ function getFontStyleAtCursor(accessor: IAccessor) {
}
}

return textRun;
return {
...textRun,
ts: {
...textRun?.ts,
...cacheStyle,
},
};
}

function getParagraphStyleAtCursor(accessor: IAccessor) {
Expand Down
7 changes: 5 additions & 2 deletions packages/docs-ui/src/controllers/render-controllers/doc-input.controller.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@ import { DocSkeletonManagerService } from '@univerjs/docs';
import { getTextRunAtPosition } from '../../basics/paragraph';
import { AfterSpaceCommand } from '../../commands/commands/auto-format.command';
import { InsertCommand } from '../../commands/commands/core-editing.command';
import { DocMenuStyleService } from '../../services/doc-menu-style.service';
import { DocSelectionRenderService } from '../../services/selection/doc-selection-render.service';

export class DocInputController extends Disposable implements IRenderModule {
Expand All @@ -31,7 +32,8 @@ export class DocInputController extends Disposable implements IRenderModule {
private readonly _context: IRenderContext<DocumentDataModel>,
@Inject(DocSelectionRenderService) private readonly _docSelectionRenderService: DocSelectionRenderService,
@Inject(DocSkeletonManagerService) private readonly _docSkeletonManagerService: DocSkeletonManagerService,
@ICommandService private readonly _commandService: ICommandService
@ICommandService private readonly _commandService: ICommandService,
@Inject(DocMenuStyleService) private readonly _docMenuStyleService: DocMenuStyleService
) {
super();

Expand Down Expand Up @@ -72,7 +74,8 @@ export class DocInputController extends Disposable implements IRenderModule {
const originBody = docDataModel.getSelfOrHeaderFooterModel(segmentId).getBody();

// Insert content's style should follow the text style of the current position.
const curTextRun = getTextRunAtPosition(originBody?.textRuns ?? [], activeRange.endOffset);
const cacheStyle = this._docMenuStyleService.getStyleCache();
const curTextRun = getTextRunAtPosition(originBody?.textRuns ?? [], activeRange.endOffset, cacheStyle);

await this._commandService.executeCommand(InsertCommand.id, {
unitId,
Expand Down
2 changes: 2 additions & 0 deletions packages/docs-ui/src/docs-ui-plugin.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -76,6 +76,7 @@ import { DocClipboardService, IDocClipboardService } from './services/clipboard/
import { DocAutoFormatService } from './services/doc-auto-format.service';
import { DocEventManagerService } from './services/doc-event-manager.service';
import { DocIMEInputManagerService } from './services/doc-ime-input-manager.service';
import { DocMenuStyleService } from './services/doc-menu-style.service';
import { DocPageLayoutService } from './services/doc-page-layout.service';
import { DocCanvasPopManagerService } from './services/doc-popup-manager.service';
import { DocStateChangeManagerService } from './services/doc-state-change-manager.service';
Expand Down Expand Up @@ -258,6 +259,7 @@ export class UniverDocsUIPlugin extends Plugin {
[DocsRenderService],
[DocStateChangeManagerService],
[DocAutoFormatService],
[DocMenuStyleService],
], this._config.override);
dependencies.forEach((d) => injector.add(d));
}
Expand Down
2 changes: 1 addition & 1 deletion packages/docs-ui/src/services/doc-ime-input-manager.service.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,10 +14,10 @@
* limitations under the License.
*/

import { JSONX, RxDisposable } from '@univerjs/core';
import type { DocumentDataModel, JSONXActions, Nullable } from '@univerjs/core';
import type { IRichTextEditingMutationParams } from '@univerjs/docs';
import type { IRenderContext, IRenderModule, ITextRangeWithStyle } from '@univerjs/engine-render';
import { JSONX, RxDisposable } from '@univerjs/core';

interface ICacheParams {
undoCache: IRichTextEditingMutationParams[];
Expand Down
Loading
Loading