update

src/components/core.ts

@@ -203,7 +203,7 @@ export default class Core {
       }
     }
 
-    this.config.readOnly = this.config.readOnly ? this.config.readOnly : false;
+    this.config.readOnly = this.config.readOnly || false;
 
     /**
      * Adjust i18n

src/components/modules/blockManager.ts

@@ -158,7 +158,7 @@ export default class BlockManager extends Module {
   private _blocks: Blocks = null;
 
   /**
-   * Binded listener ids
+   * listener identifiers bound on elements
    */
   private listenerIds: string[] = [];
 
@@ -222,10 +222,10 @@ export default class BlockManager extends Module {
    * @param {boolean} readOnlyEnabled - "read only" state
    */
   public toggleReadOnly(readOnlyEnabled: boolean): void {
-    if (readOnlyEnabled) {
-      this.disableModuleEvents();
+    if (!readOnlyEnabled) {
+      this.enableModuleBindings();
     } else {
-      this.enableModuleEvents();
+      this.disableModuleBindings();
     }
   }
 
@@ -688,12 +688,6 @@ export default class BlockManager extends Module {
   private bindBlockEvents(block: Block): void {
     const { BlockEvents, Listeners } = this.Editor;
 
-    // this.listenerIds.push(
-    //   Listeners.on(block.holder, 'mousedown', (event: MouseEvent) => {
-    //     BlockEvents.mouseDown(event);
-    //   })
-    // );
-
     this.listenerIds.push(
       Listeners.on(block.holder, 'keydown', (event: KeyboardEvent) => {
         BlockEvents.keydown(event);
@@ -725,7 +719,7 @@ export default class BlockManager extends Module {
    *  - Removes all listeners by id
    *  - Removes all shortcuts
    */
-  private disableModuleEvents(): void {
+  private disableModuleBindings(): void {
     const { Listeners } = this.Editor;
 
     for (const id of this.listenerIds) {
@@ -742,7 +736,7 @@ export default class BlockManager extends Module {
    *  - Restore `copy` and `cut` bindings
    *  - Bind all events handlers for all Blocks
    */
-  private enableModuleEvents(): void {
+  private enableModuleBindings(): void {
     this.blocks.forEach((block: Block) => {
       this.bindBlockEvents(block);
     });

src/components/modules/blockSelection.ts

@@ -49,6 +49,17 @@ export default class BlockSelection extends Module {
     };
   }
 
+  /**
+   * Flag that identifies all Blocks selection
+   *
+   * @returns {boolean}
+   */
+  public get allBlocksSelected(): boolean {
+    const { BlockManager } = this.Editor;
+
+    return BlockManager.blocks.every((block) => block.selected === true);
+  }
+
   /**
    * Set selected all blocks
    *
@@ -121,7 +132,9 @@ export default class BlockSelection extends Module {
   public prepare(): void {
     this.selection = new SelectionUtils();
 
-    this.toggleReadOnly(this.config.readOnly);
+    if (!this.config.readOnly) {
+      this.enableModuleBindings();
+    }
   }
 
   /**
@@ -138,39 +151,10 @@ export default class BlockSelection extends Module {
    * @param {boolean} readOnlyEnabled - "read only" state
    */
   public toggleReadOnly(readOnlyEnabled: boolean): void {
-    const { Shortcuts } = this.Editor;
-
     if (readOnlyEnabled) {
-      Shortcuts.remove('CMD+A');
-
-      SelectionUtils.get()
-        .removeAllRanges();
-
-      this.allBlocksSelected = false;
+      this.disableModuleBindings();
     } else {
-      /**
-       * CMD/CTRL+A selection shortcut
-       */
-      Shortcuts.add({
-        name: 'CMD+A',
-        handler: (event) => {
-          const { BlockManager } = this.Editor;
-
-          /**
-           * When one page consist of two or more EditorJS instances
-           * Shortcut module tries to handle all events.
-           * Thats why Editor's selection works inside the target Editor, but
-           * for others error occurs because nothing to select.
-           *
-           * Prevent such actions if focus is not inside the Editor
-           */
-          if (!BlockManager.currentBlock) {
-            return;
-          }
-
-          this.handleCommandA(event);
-        },
-      });
+      this.enableModuleBindings();
     }
   }
 
@@ -402,4 +386,49 @@ export default class BlockSelection extends Module {
     /** close InlineToolbar if we selected all Blocks */
     this.Editor.InlineToolbar.close();
   }
+
+  /**
+   * Binds module all necessary events
+   */
+  private enableModuleBindings(): void {
+    const { Shortcuts } = this.Editor;
+
+    /**
+     * CMD/CTRL+A selection shortcut
+     */
+    Shortcuts.add({
+      name: 'CMD+A',
+      handler: (event) => {
+        const { BlockManager } = this.Editor;
+
+        /**
+         * When one page consist of two or more EditorJS instances
+         * Shortcut module tries to handle all events.
+         * Thats why Editor's selection works inside the target Editor, but
+         * for others error occurs because nothing to select.
+         *
+         * Prevent such actions if focus is not inside the Editor
+         */
+        if (!BlockManager.currentBlock) {
+          return;
+        }
+
+        this.handleCommandA(event);
+      },
+    });
+  }
+
+  /**
+   * Unbinds module events
+   */
+  private disableModuleBindings(): void {
+    const { Shortcuts } = this.Editor;
+
+    Shortcuts.remove('CMD+A');
+
+    SelectionUtils.get()
+      .removeAllRanges();
+
+    this.allBlocksSelected = false;
+  }
 }

src/components/modules/crossBlockSelection.ts

@@ -18,13 +18,15 @@ export default class CrossBlockSelection extends Module {
   private lastSelectedBlock: Block;
 
   /**
+   * Module preparation
+   *
    * @returns {Promise}
    */
   public async prepare(): Promise<void> {
     const { Listeners } = this.Editor;
 
     Listeners.on(document, 'mousedown', (event: MouseEvent) => {
-      this.handleCBSMouseDown(event);
+      this.enableCrossBlockSelection(event);
     });
   }
 
@@ -56,9 +58,11 @@ export default class CrossBlockSelection extends Module {
   }
 
   /**
-   * @param {MouseEvent} event
+   * Enables Cross Block Selection
+   *
+   * @param {MouseEvent} event - mouse down event
    */
-  public handleCBSMouseDown(event: MouseEvent): void {
+  private enableCrossBlockSelection(event: MouseEvent): void {
     /**
      * Each mouse down on Block must disable selectAll state
      */

src/components/modules/dragNDrop.ts

@@ -22,7 +22,9 @@ export default class DragNDrop extends Module {
    * Bind events
    */
   public prepare(): void {
-    this.toggleReadOnly(this.config.readOnly);
+    if (!this.config.readOnly) {
+      this.enableModuleBindings();
+    }
   }
 
   /**

src/components/modules/modificationsObserver.ts

@@ -65,25 +65,21 @@ export default class ModificationsObserver extends Module {
    * @returns {Promise<void>}
    */
   public async prepare(): Promise<void> {
-    this.toggleReadOnly(this.config.readOnly);
+    if (!this.config.readOnly) {
+      this.enableModule();
+    }
   }
 
   /**
    * Set read-only state
    *
-   * @param {boolean} readOnlyEnabled
+   * @param {boolean} readOnlyEnabled - read only flag value
    */
-  public toggleReadOnly(readOnlyEnabled: boolean) {
+  public toggleReadOnly(readOnlyEnabled: boolean): void {
     if (readOnlyEnabled) {
-      this.disable();
+      this.disableModule();
     } else {
-      /**
-       * wait till Browser render Editor's Blocks
-       */
-      window.setTimeout(() => {
-        this.setObserver();
-        this.enable();
-      }, 1000);
+      this.enableModule();
     }
   }
 
@@ -183,4 +179,24 @@ export default class ModificationsObserver extends Module {
 
     this.nativeInputs.forEach((input) => this.Editor.Listeners.on(input, 'input', this.mutationDebouncer));
   }
+
+  /**
+   * Sets observer and enables it
+   */
+  private enableModule(): void {
+    /**
+     * wait till Browser render Editor's Blocks
+     */
+    window.setTimeout(() => {
+      this.setObserver();
+      this.enable();
+    }, 1000);
+  }
+
+  /**
+   * Disables observer
+   */
+  private disableModule(): void {
+    this.disable();
+  }
 }

src/components/modules/paste.ts

@@ -151,9 +151,9 @@ export default class Paste extends Module {
   /**
    * Set read-only state
    *
-   * @param {boolean} readOnlyEnabled
+   * @param {boolean} readOnlyEnabled - read only flag value
    */
-  public toggleReadOnly(readOnlyEnabled: boolean) {
+  public toggleReadOnly(readOnlyEnabled: boolean): void {
     if (!readOnlyEnabled) {
       this.processTools();
       this.setCallback();

src/components/modules/readonly.ts

@@ -1,7 +1,7 @@
 import Module from '../__module';
 
 /**
- * @module readonly
+ * @module ReadOnly
  *
  * Has one important method:
  *    - {Function} toggleReadonly - Set read-only mode or toggle current state

src/components/modules/tools.ts

@@ -307,19 +307,6 @@ export default class Tools extends Module {
     });
   }
 
-  /**
-   * Set read-only state
-   *
-   * @param {boolean} readOnlyEnabled
-   */
-  public toggleReadOnly(readOnlyEnabled: boolean) {
-    if (readOnlyEnabled) {
-      // read-only state should set in each tool
-    } else {
-      // tools should still be configured
-    }
-  }
-
   /**
    * Success callback
    *

src/components/modules/ui.ts

@@ -181,7 +181,9 @@ export default class UI extends Module {
     /**
      * Prepare with read-only state from config
      */
-    this.toggleReadOnly(this.config.readOnly);
+    if (!this.config.readOnly) {
+      this.enableModuleBindings();
+    }
   }
 
   /**
@@ -199,16 +201,16 @@ export default class UI extends Module {
     /**
      * Prepare components based on read-only state
      */
-    if (readOnlyEnabled) {
+    if (!readOnlyEnabled) {
       /**
        * Unbind all events
        */
-      this.unbindEvents();
+      this.enableModuleBindings();
     } else {
       /**
        * Bind events for the UI elements
        */
-      this.bindEvents();
+      this.disableModuleBindings();
     }
   }
 
@@ -338,7 +340,7 @@ export default class UI extends Module {
   /**
    * Bind events on the Editor.js interface
    */
-  private bindEvents(): void {
+  private enableModuleBindings(): void {
     this.listenerIds.push(
       this.Editor.Listeners.on(this.nodes.redactor, 'click', (event: MouseEvent) => {
         this.redactorClicked(event);
@@ -390,7 +392,7 @@ export default class UI extends Module {
   /**
    * Unbind events on the Editor.js interface
    */
-  private unbindEvents(): void {
+  private disableModuleBindings(): void {
     for (const id of this.listenerIds) {
       this.Editor.Listeners.offById(id);
     }