From c75ac416f318df052b5e98bc646577e80ef6f95a Mon Sep 17 00:00:00 2001
From: Artur Arseniev <artur.catch@hotmail.it>
Date: Wed, 1 May 2019 20:15:14 +0200
Subject: [PATCH] Add Comment component

---
 src/dom_components/index.js                   |  5 ++++
 src/dom_components/model/ComponentComment.js  | 24 +++++++++++++++++++
 src/dom_components/model/ComponentTextNode.js |  1 +
 .../view/ComponentCommentView.js              |  7 ++++++
 4 files changed, 37 insertions(+)
 create mode 100644 src/dom_components/model/ComponentComment.js
 create mode 100644 src/dom_components/view/ComponentCommentView.js

diff --git a/src/dom_components/index.js b/src/dom_components/index.js
index a2bb3bdce..1a8567d26 100644
--- a/src/dom_components/index.js
+++ b/src/dom_components/index.js
@@ -107,6 +107,11 @@ module.exports = () => {
       model: require('./model/ComponentSvg'),
       view: require('./view/ComponentSvgView')
     },
+    {
+      id: 'comment',
+      model: require('./model/ComponentComment'),
+      view: require('./view/ComponentCommentView')
+    },
     {
       id: 'textnode',
       model: require('./model/ComponentTextNode'),
diff --git a/src/dom_components/model/ComponentComment.js b/src/dom_components/model/ComponentComment.js
new file mode 100644
index 000000000..4f74b554f
--- /dev/null
+++ b/src/dom_components/model/ComponentComment.js
@@ -0,0 +1,24 @@
+const Component = require('./ComponentTextNode');
+
+module.exports = Component.extend(
+  {
+    defaults: {
+      ...Component.prototype.defaults
+    },
+
+    toHTML() {
+      return `<!--${this.get('content')}-->`;
+    }
+  },
+  {
+    isComponent(el) {
+      if (el.nodeType == 8) {
+        return {
+          tagName: 'NULL',
+          type: 'comment',
+          content: el.textContent
+        };
+      }
+    }
+  }
+);
diff --git a/src/dom_components/model/ComponentTextNode.js b/src/dom_components/model/ComponentTextNode.js
index c1fcc28c8..6512da061 100644
--- a/src/dom_components/model/ComponentTextNode.js
+++ b/src/dom_components/model/ComponentTextNode.js
@@ -5,6 +5,7 @@ module.exports = Component.extend(
     defaults: {
       ...Component.prototype.defaults,
       droppable: false,
+      layerable: false,
       editable: true
     },
 
diff --git a/src/dom_components/view/ComponentCommentView.js b/src/dom_components/view/ComponentCommentView.js
new file mode 100644
index 000000000..3ccf17fd1
--- /dev/null
+++ b/src/dom_components/view/ComponentCommentView.js
@@ -0,0 +1,7 @@
+const ComponentView = require('./ComponentTextNodeView');
+
+module.exports = ComponentView.extend({
+  _createElement() {
+    return document.createComment(this.model.get('content'));
+  }
+});