diff --git a/dev/js/src/match.js b/dev/js/src/match.js
index 59d2e83..3576867 100644
--- a/dev/js/src/match.js
+++ b/dev/js/src/match.js
@@ -184,6 +184,9 @@
       
       var that = this;
 
+      // TODO:
+      //   Introduce panel object here!
+      
       // Add meta button
       var refLine = element.querySelector("p.ref");
 
@@ -274,6 +277,9 @@
      */
     info : function () {
 
+      // TODO:
+      //   Rename info() to panel()
+
       // Create match info
       if (this._info === undefined)
         this._info = infoClass.create(this);
diff --git a/dev/js/src/match/info.js b/dev/js/src/match/info.js
index 628659f..655535f 100644
--- a/dev/js/src/match/info.js
+++ b/dev/js/src/match/info.js
@@ -3,7 +3,7 @@
  */
 /*
  * TODO:
- *   Create a "views" object, that is the parent of this
+ *   Create a "panel" object, that is the parent of this
  *   class and supports a simple .add() method to add views
  *   to an element.
  */
@@ -60,34 +60,6 @@
 
 
     /**
-     * Open the information view,
-     * if closed, otherwise close.
-     */
-    /*
-    toggle : function () {
-
-      var elem = this._match.element();
-
-      if (this.opened == true) {        
-        elem.removeChild(
-          this.element()
-        );
-        this.opened = false;
-      }
-      else {
-        // Append element to match
-        elem.appendChild(
-          this.element()
-        );
-        this.opened = true;
-      };
-      
-      return this.opened;
-    },
-    */
-
-
-    /**
      * Retrieve and parse snippet for table
      * representation
      */
@@ -419,6 +391,9 @@
     },
 
     // Add action button
+    // TODO:
+    //   These are view-buttons that should be added to
+    //   the view and not to the panel!
     _addButton : function (buttonType, element, cb) {
       // TODO: Unless existent
       var actions = document.createElement('ul');
diff --git a/dev/js/src/panel.js b/dev/js/src/panel.js
new file mode 100644
index 0000000..5aa96ad
--- /dev/null
+++ b/dev/js/src/panel.js
@@ -0,0 +1,95 @@
+/**
+ * Create a panel for a certain aspect of the system, like
+ * the result, a match, or the VC.
+ */
+define(['buttongroup', 'util'], function (buttonGroupClass) {
+
+  return {
+
+    // TODO:
+    //   Support classes
+    create : function () {
+      return Object.create(this)._init();
+    },
+
+    _init : function () {
+      // ...
+      this.views = [];
+
+      
+      /**
+       * Main action buttons for the panel,
+       * may be at the bottom (for matches)
+       * or as tabs (for the result).
+       */
+      this.actions = buttonGroupClass.create(['action', 'panel']);
+      return this;
+    },
+
+    /**
+     * The element of the panel
+     */
+    element : function () {
+      if (this._element)
+        return this._element;
+
+      // Create panel element
+      var e = document.createElement('div');
+      e.classList.add('panel');
+
+      e.appendChild(this.actions.element());
+
+      this._element = e;
+      return e;
+    },
+
+
+    /**
+     * Add a view to the panel
+     */
+    add : function (view) {
+
+      // Add view to views list
+      this.views.push(view);
+
+      // Append element to panel element
+
+      this.element().appendChild(
+        view.element()
+      );
+
+      view.panel = this;
+    },
+
+    /**
+     * Delete a closed view from panel
+     */
+    delView : function (view) {
+      for (i in this.views) {
+        if (this.views[i] === view) {
+          this.views[i] = undefined;
+        }
+      }
+    },
+
+    /**
+     * Elements before the action buttons
+     */
+    beforeActions : function (element) {
+      if (arguments.length > 0)
+        this._beforeActions = element;
+
+      return this._beforeActions;
+    },
+
+    /**
+     * Element after the action buttons
+     */
+    afterActions : function (element) {
+      if (arguments.length > 0)
+        this._afterActions = element;
+
+      return this._afterActions;
+    }
+  }
+});
diff --git a/dev/js/src/view.js b/dev/js/src/view.js
new file mode 100644
index 0000000..2eb5dd0
--- /dev/null
+++ b/dev/js/src/view.js
@@ -0,0 +1,55 @@
+/**
+ * Create a view that can be added to a panel,
+ * like a tree view or the metadata view.
+ */
+
+define(['buttongroup', 'util'], function (buttonGroupClass) {
+
+  return {
+
+    // TODO:
+    //   Support classes
+    create : function () {
+      return Object.create(this)._init();
+    },
+
+    _init : function () {
+      // ..
+      this.panel = undefined;
+
+      // The buttonclass is bind to the view
+      this.actions = buttonGroupClass.create(['action', 'view']).bind(this);
+      this.actions.add('close', ['button-icon','close'], function (e) {
+        this.close();
+      });
+
+      return this;
+    },
+
+    /**
+     * Element of the view
+     */
+    element : function () {
+      if (this._element)
+        return this._element;
+
+      // Create panel element
+      var e = document.createElement('div');
+      e.classList.add('view');
+
+      e.appendChild(this.actions.element());
+
+      this._element = e;
+      return e;
+    },
+
+    /**
+     * Close the view.
+     */
+    close : function () {
+      var e = this.element();
+      e.parentNode.removeChild(e);
+      this.panel.delView(this);
+    }
+  };
+});