1 files changed, 16 insertions, 8 deletions
diff --git a/module/web/static/js/views/modal/modalView.js b/module/web/static/js/views/modal/modalView.js
index efc0cc3cb..b20aab57d 100644
--- a/module/web/static/js/views/modal/modalView.js
+++ b/module/web/static/js/views/modal/modalView.js
@@ -1,11 +1,14 @@
-define(['jquery', 'backbone', 'underscore', 'omniwindow'], function($, Backbone, _) {
+define(['jquery', 'backbone', 'underscore', 'text!tpl/default/modal.html', 'omniwindow'], function($, Backbone, _, template) {
 
     return Backbone.View.extend({
 
         events: {
-
+            'click .btn-close': 'hide',
+            'click .close': 'hide'
         },
 
+        template: _.template(template),
+
         dialog: null,
 
         initialize: function() {
@@ -13,16 +16,15 @@ define(['jquery', 'backbone', 'underscore', 'omniwindow'], function($, Backbone,
         },
 
         render: function() {
-            this.$el.addClass('modal');
-            this.$el.addClass('modal-closed');
-            this.$el.append(this.renderContent());
+            this.$el.html(this.template({ content: this.renderContent().html(), header: this.getHeader()}));
+            this.$el.addClass('modal hide');
             this.$el.css({opacity: 0, scale: 0.7});
             $("body").append(this.el);
 
             this.dialog = this.$el.omniWindow({
                 overlay: {
                     selector: '#modal-overlay',
-                    hideClass: 'modal-closed',
+                    hideClass: 'hide',
                     animations: {
                         hide: function(subjects, internalCallback) {
                             subjects.overlay.fadeOut(400, function() {
@@ -35,7 +37,7 @@ define(['jquery', 'backbone', 'underscore', 'omniwindow'], function($, Backbone,
                             });
                         }}},
                 modal: {
-                    hideClass: 'modal-closed',
+                    hideClass: 'hide',
                     animations: {
                         hide: function(subjects, internalCallback) {
                             subjects.modal.transition({opacity: 'hide', scale: 0.7}, 250, function() {
@@ -53,7 +55,11 @@ define(['jquery', 'backbone', 'underscore', 'omniwindow'], function($, Backbone,
             return this;
         },
         renderContent: function() {
-            return $('<h1>Dialog</h1>');
+            return $('<h1>Content!</h1>');
+        },
+
+        getHeader: function() {
+            return 'Dialog';
         },
 
         show: function() {
@@ -61,6 +67,8 @@ define(['jquery', 'backbone', 'underscore', 'omniwindow'], function($, Backbone,
                 this.render();
 
             this.dialog.trigger('show');
+
+            // TODO: set focus on first element
         },
 
         hide: function() {