details views

app/scripts/views/details/details-add-field-view.js

@@ -1,26 +1,29 @@
-import Backbone from 'backbone';
+import { View } from 'view-engine/view';
+import template from 'templates/details/details-add-field.hbs';
 
-const DetailsAddFieldView = Backbone.View.extend({
-    template: require('templates/details/details-add-field.hbs'),
+class DetailsAddFieldView extends View {
+    parent = '.details__body-fields';
 
-    events: {
+    template = template;
+
+    events = {
         'click .details__field-label': 'fieldLabelClick',
         'click .details__field-value': 'fieldValueClick'
-    },
+    };
 
     render() {
-        this.renderTemplate();
+        super.render();
         this.labelEl = this.$el.find('.details__field-label');
         return this;
-    },
+    }
 
     fieldLabelClick() {
-        this.trigger('more-click');
-    },
+        this.emit('more-click');
+    }
 
     fieldValueClick() {
-        this.trigger('add-field');
+        this.emit('add-field');
     }
-});
+}
 
 export { DetailsAddFieldView };

app/scripts/views/details/details-attachment-view.js

@@ -1,13 +1,14 @@
-import Backbone from 'backbone';
+import { View } from 'view-engine/view';
 import { Shortcuts } from 'comp/app/shortcuts';
+import template from 'templates/details/details-attachment.hbs';
 
-const DetailsAttachmentView = Backbone.View.extend({
-    template: require('templates/details/details-attachment.hbs'),
+class DetailsAttachmentView extends View {
+    template = template;
 
-    events: {},
+    events = {};
 
     render(complete) {
-        this.renderTemplate({}, true);
+        super.render();
         const shortcut = this.$el.find('.details__attachment-preview-download-text-shortcut');
         shortcut.html(Shortcuts.actionShortcutSymbol(false));
         const blob = new Blob([this.model.getBinary()], { type: this.model.mimeType });
@@ -36,6 +37,6 @@ const DetailsAttachmentView = Backbone.View.extend({
         complete();
         return this;
     }
-});
+}
 
 export { DetailsAttachmentView };

app/scripts/views/details/details-view.js

@@ -369,7 +369,7 @@ const DetailsView = Backbone.View.extend({
         }, this);
 
         this.moreView = new DetailsAddFieldView();
-        this.moreView.setElement(fieldsMainEl).render();
+        this.moreView.render();
         this.moreView.on('add-field', this.addNewField.bind(this));
         this.moreView.on('more-click', this.toggleMoreOptions.bind(this));
     },
@@ -578,7 +578,10 @@ const DetailsView = Backbone.View.extend({
             return;
         }
         this.removeSubView();
-        const subView = new DetailsAttachmentView({ el: this.scroller, model: attachment });
+        const subView = new DetailsAttachmentView(attachment, {
+            parent: this.scroller[0],
+            replace: true
+        });
         subView.attId = id;
         subView.render(this.pageResized.bind(this));
         this.views.sub = subView;