Adds modifyBlocks option to make structure read-only

spec/javascripts/units/block/unmodifiable.spec.js

@@ -0,0 +1,38 @@
+"use strict";
+
+var config = require('../../../../src/config');
+
+describe("UnmodifiableBlock Block", function(){
+
+  var element, editor, block, testHandler;
+
+  beforeEach(function(){
+    element = global.createBaseElement();
+    editor = new SirTrevor.Editor({ el: element });
+
+    config.defaults.modifyBlocks = false;
+
+    SirTrevor.Blocks.UnmodifiableBlock = SirTrevor.Block.extend({});
+
+    block = new SirTrevor.Blocks.UnmodifiableBlock({}, editor.ID, editor.mediator);
+  });
+
+  afterEach(function(){
+    delete SirTrevor.Blocks.UnmodifiableBlock;
+  });
+
+  describe("render", function(){
+
+    it("has no reorder control", function(){
+      expect(block.el.querySelectorAll('.st-block-ui-btn__reorder').length)
+        .toBe(0);
+    });
+
+    it("has no delete control", function(){
+      expect(block.el.querySelectorAll('.st-block-ui-btn__delete').length)
+        .toBe(0);
+    });
+
+  });
+
+});

src/block.js

@@ -331,17 +331,19 @@ Object.assign(Block.prototype, SimpleBlock.fn, require('./block-validations'), {
    //Init functions for adding functionality
   _initUIComponents: function() {
 
-    this.addDeleteControls();
+    if (config.defaults.modifyBlocks) {
+      this.addDeleteControls();
 
-    this.positioner = new BlockPositioner(this.el, this.mediator);
+      this.positioner = new BlockPositioner(this.el, this.mediator);
 
-    this._withUIComponent(this.positioner, '.st-block-ui-btn__reorder',
-                          this.onPositionerClick);
+      this._withUIComponent(this.positioner, '.st-block-ui-btn__reorder',
+                            this.onPositionerClick);
 
-    this._withUIComponent(new BlockReorder(this.el, this.mediator));
+      this._withUIComponent(new BlockReorder(this.el, this.mediator));
 
-    this._withUIComponent(new BlockDeletion(), '.st-block-ui-btn__delete',
-                          this.onDeleteClick);
+      this._withUIComponent(new BlockDeletion(), '.st-block-ui-btn__delete',
+                            this.onDeleteClick);
+    }
 
     this.onFocus();
     this.onBlur();

src/blocks/scribe-plugins/scribe-text-block-plugin.js

@@ -6,6 +6,8 @@ var {
   selectToEnd
 } = require('./shared.js');
 
+var config = require('./../../config');
+
 var ScribeTextBlockPlugin = function(block) {
   return function(scribe) {
 
@@ -53,7 +55,7 @@ var ScribeTextBlockPlugin = function(block) {
 
     scribe.el.addEventListener('keydown', function(ev) {
 
-      if (block.supressKeyListeners) {
+      if (block.supressKeyListeners || !config.defaults.modifyBlocks) {
         return;
       }
 
@@ -90,7 +92,7 @@ var ScribeTextBlockPlugin = function(block) {
 
     scribe.el.addEventListener('keyup', function(ev) {
 
-      if (block.supressKeyListeners) {
+      if (block.supressKeyListeners || !config.defaults.modifyBlocks) {
         return;
       }
 

src/config.js

@@ -32,6 +32,9 @@ module.exports = {
   instances: [],
 
   defaults: {
+    // If set to false will not allow users to add/remove or move blocks
+    modifyBlocks: true,
+
     defaultType: false,
     spinner: {
       className: 'st-spinner',

src/templates/block-addition-top.js

@@ -3,6 +3,10 @@
 var config = require('../config');
 
 module.exports = () => {
+  if (!config.defaults.modifyBlocks) {
+    return '';
+  }
+
   return `
     <div class="st-block-addition-top">
       <div class="st-block-addition-top__button" type="button"></div>

src/templates/block-addition.js

@@ -3,6 +3,10 @@
 var config = require('../config');
 
 module.exports = () => {
+  if (!config.defaults.modifyBlocks) {
+    return '';
+  }
+
   return `
     <button class="st-block-addition" type="button">
       <span class="st-block-addition__button">