3 files changed, 90 insertions, 5 deletions

diff --git a/module/web/static/js/views/modal/modalView.js b/module/web/static/js/views/modal/modalView.js
new file mode 100644
index 000000000..efc0cc3cb
--- /dev/null
+++ b/module/web/static/js/views/modal/modalView.js
@@ -0,0 +1,76 @@
+define(['jquery', 'backbone', 'underscore', 'omniwindow'], function($, Backbone, _) {
+
+    return Backbone.View.extend({
+
+        events: {
+
+        },
+
+        dialog: null,
+
+        initialize: function() {
+
+        },
+
+        render: function() {
+            this.$el.addClass('modal');
+            this.$el.addClass('modal-closed');
+            this.$el.append(this.renderContent());
+            this.$el.css({opacity: 0, scale: 0.7});
+            $("body").append(this.el);
+
+            this.dialog = this.$el.omniWindow({
+                overlay: {
+                    selector: '#modal-overlay',
+                    hideClass: 'modal-closed',
+                    animations: {
+                        hide: function(subjects, internalCallback) {
+                            subjects.overlay.fadeOut(400, function() {
+                                internalCallback(subjects);
+                            });
+                        },
+                        show: function(subjects, internalCallback) {
+                            subjects.overlay.fadeIn(250, function() {
+                                internalCallback(subjects);
+                            });
+                        }}},
+                modal: {
+                    hideClass: 'modal-closed',
+                    animations: {
+                        hide: function(subjects, internalCallback) {
+                            subjects.modal.transition({opacity: 'hide', scale: 0.7}, 250, function() {
+                                internalCallback(subjects);
+                            });
+                        },
+
+                        show: function(subjects, internalCallback) {
+                            subjects.modal.transition({opacity: 'show', scale: 1}, 250, function() {
+                                internalCallback(subjects);
+                            });
+                        }}
+                }});
+
+            return this;
+        },
+        renderContent: function() {
+            return $('<h1>Dialog</h1>');
+        },
+
+        show: function() {
+            if (this.dialog === null)
+                this.render();
+
+            this.dialog.trigger('show');
+        },
+
+        hide: function() {
+            this.dialog.trigger('hide');
+        },
+
+        destroy: function() {
+            this.$el.remove();
+            this.dialog = null;
+        }
+
+    });
+});
\ No newline at end of file
diff --git a/module/web/static/js/views/packageTreeView.js b/module/web/static/js/views/packageTreeView.js
index 91768ec04..e26924db2 100644
--- a/module/web/static/js/views/packageTreeView.js
+++ b/module/web/static/js/views/packageTreeView.js
@@ -12,8 +12,6 @@ define(['jquery', 'backbone', 'underscore', 'models/TreeCollection', 'views/pack
             },
 
             initialize: function() {
-                _.bindAll(this, 'render');
-
                 this.tree = new TreeCollection();
 
             },
@@ -26,7 +24,6 @@ define(['jquery', 'backbone', 'underscore', 'models/TreeCollection', 'views/pack
             },
 
             render: function() {
-
                 this.$el.html("<br>");
 
                 var packs = this.tree.get('packages'),
diff --git a/module/web/static/js/views/packageView.js b/module/web/static/js/views/packageView.js
index a2e0abf31..b820b9ba8 100644
--- a/module/web/static/js/views/packageView.js
+++ b/module/web/static/js/views/packageView.js
@@ -1,4 +1,5 @@
-define(['jquery', 'backbone', 'underscore', 'views/fileView'], function($, Backbone, _, fileView) {
+define(['jquery', 'backbone', 'underscore', 'views/fileView', 'views/modal/modalView'],
+    function($, Backbone, _, fileView, modalView) {
 
     // Renders a single package item
     return Backbone.View.extend({
@@ -6,9 +7,12 @@ define(['jquery', 'backbone', 'underscore', 'views/fileView'], function($, Backb
         tagName: 'li',
         events: {
             'click .load': 'load',
-            'click .delete': 'delete'
+            'click .delete': 'delete',
+            'click .show': 'show'
         },
 
+        modal: null,
+
         initialize: function() {
             this.model.on('change', this.render, this);
             this.model.on('remove', this.unrender, this);
@@ -18,6 +22,7 @@ define(['jquery', 'backbone', 'underscore', 'views/fileView'], function($, Backb
             this.$el.html('Package ' + this.model.get('pid') + ': ' + this.model.get('name'));
             this.$el.append($('<a class="load" href="#"> Load</a>'));
             this.$el.append($('<a class="delete" href="#"> Delete</a>'));
+            this.$el.append($('<a class="show" href="#"> Show</a>'));
 
             if (this.model.isLoaded()) {
                 var ul = $('<ul></ul>');
@@ -39,6 +44,13 @@ define(['jquery', 'backbone', 'underscore', 'views/fileView'], function($, Backb
 
         delete: function() {
             this.model.destroy();
+        },
+
+        show: function() {
+            if (this.modal === null)
+                this.modal = new modalView();
+
+            this.modal.show();
         }
 
     });