Skip to main content

UndoRedoButton Plugin

The UndoRedoButton plugin enhances the functionality of the On-Codemerge editor by providing undo and redo capabilities. Users can easily undo or redo their actions within the editor, making it convenient to correct mistakes or backtrack through changes.

on-CodeMerge

A WYSIWYG editor for on-codemerge is a user-friendly interface that allows users to edit and view their code in real time, exactly as it will appear in the final product. This intuitive tool for developers of all skill levels.
Result:
Preview:

Key Features​

1. Undo Actions​

  • Undo: Users can undo their previous actions within the editor.
  • Undo Button: A dedicated "Undo" button is provided on the editor's toolbar.

2. Redo Actions​

  • Redo: Users can redo actions that were undone.
  • Redo Button: A dedicated "Redo" button is provided on the editor's toolbar.

3. Real-time Updates​

  • Status Updates: The plugin dynamically updates the status of the undo and redo buttons based on the user's actions.
  • Disabled Buttons: The undo and redo buttons are disabled when there are no actions to undo or redo.

Integration​

To integrate the UndoRedoButton plugin with the On-Codemerge editor, follow these steps:

  1. Import the UndoRedoButton class from the plugin package.
  2. Initialize an instance of EditorCore.
  3. Register the UndoRedoButton as a module using the registerModule method.

Here's an example of how to integrate the UndoRedoButton plugin:

import EditorCore from 'on-codemerge';
import { UndoRedoButton } from 'on-codemerge/undoRedoButton';

document.addEventListener('DOMContentLoaded', () => {
  const appElement = document.getElementById('app');
  if (appElement) {
    const editor = new EditorCore(appElement);

    // Create and register the UndoRedoButton module
    const undoRedoButton = new UndoRedoButton();
    editor.registerModule(undoRedoButton);
  }
});

Usage​

The UndoRedoButton plugin is a valuable addition to your On-Codemerge editor, allowing users to easily navigate and correct their actions. Whether they need to undo the last change or redo a previously undone action, these buttons provide a convenient way to manage the editing history.

Example Usage​

Integrate the UndoRedoButton plugin to enhance your On-Codemerge editor's functionality. By providing users with undo and redo capabilities, you can improve their editing experience and make it easier to work with the editor's content.