diff --git a/dev/js/src/buttongroup.js b/dev/js/src/buttongroup.js
index 6da1cb7..b782754 100644
--- a/dev/js/src/buttongroup.js
+++ b/dev/js/src/buttongroup.js
@@ -13,7 +13,7 @@
     _init : function (classes) {
       var e = document.createElement('div');
       var cl = e.classList;
-      if (classes !== undefined) {
+      if (classes) {
         cl.add.apply(cl,classes);
       };
       cl.add('button-group');
diff --git a/dev/js/src/init.js b/dev/js/src/init.js
index f2744c7..2380db8 100644
--- a/dev/js/src/init.js
+++ b/dev/js/src/init.js
@@ -21,6 +21,8 @@
   'lib/alertify',
   'session',
   'selectMenu',
+  'panel',
+  'view/koralquery',
   'api',
   'mailToChiffre',
   'lib/highlight/highlight.pack',
@@ -34,7 +36,9 @@
              vcArray,
              alertifyClass,
              sessionClass,
-             selectMenuClass) {
+             selectMenuClass,
+             panelClass,
+             kqClass) {
 
   // Localization values
   const loc = KorAP.Locale;
@@ -63,7 +67,7 @@
   domReady(function (event) {
     var obj = {};
 
-    // What should be visible?
+    // What should be visible in the beginning?
     var show = KorAP.session.get('show') || {};
 
     /**
@@ -180,7 +184,9 @@
       ).limit(5);
     };
 
-    var result = d.getElementById('resultinfo');
+    var resultInfo = d.getElementById('resultinfo');
+
+    /*
     var resultButton;
     if (result != null) {
 
@@ -188,11 +194,31 @@
       resultButton = buttonGroupClass.create(['result']);
       result.appendChild(resultButton.element());
     };
+    */
 
+    /**
+     * Add result panel
+     */
+    var resultPanel;
+    if (resultInfo != null) {
+      resultPanel = panelClass.create(['result']);
+
+      // Move buttons to resultinfo
+      resultInfo.appendChild(resultPanel.actions.element());
+
+      
+      var sb = d.getElementById('search');
+      sb.insertBefore(resultPanel.element(), sb.firstChild);
+
+    };
+
+    
     // There is a koralQuery
-    if (KorAP.koralQuery !== undefined) {
+    if (KorAP.koralQuery !== undefined) {    
+      
+      if (resultInfo !== null) {
 
-      if (result !== null) {
+        /*
         var kq;
 
         var showKQ = function () {
@@ -220,6 +246,18 @@
 
         // Add KoralQuery button
         resultButton.add(loc.SHOW_KQ, ['show-kq','button-icon'], showKQ);
+        */
+
+        resultPanel.actions.add(loc.SHOW_KQ, ['show-kq','button-icon'], function () {
+
+          // Show only once
+          if (this._kq && this._kq.shown()) {
+            return;
+          };
+          
+          this._kq = kqClass.create();
+          this.add(this._kq);
+        });
       };
 
       if (KorAP.koralQuery["errors"]) {
@@ -242,23 +280,33 @@
       };
 
       // Session has KQ visibility stored
+      /**
+       * TODO:
       if (show["kq"])
         showKQ.apply();
+      */
     };
 
     // There is more than 0 matches and there is a resultButton
     if (i > 0) {
 
-      if (resultButton !== null) {
+      if (resultPanel !== null) {
         /**
          * Toggle the alignment (left <=> right)
          */
-
+        /*
         resultButton.add(loc.TOGGLE_ALIGN, ['align','right','button-icon'], function (e) {
           var ol = d.querySelector('#search > ol');
           ol.toggleClass("align-left", "align-right");
           this.toggleClass("left", "right");
         });
+        */
+
+        resultPanel.actions.add(loc.TOGGLE_ALIGN, ['align','right','button-icon'], function (e) {
+          var ol = d.querySelector('#search > ol');
+          ol.toggleClass("align-left", "align-right");
+          this.button.toggleClass("left", "right");
+        });
       };
     };
 
diff --git a/dev/js/src/match.js b/dev/js/src/match.js
index 3576867..3140de1 100644
--- a/dev/js/src/match.js
+++ b/dev/js/src/match.js
@@ -194,7 +194,7 @@
       if (!refLine)
         return;
 
-      var btns = buttonGroupClass.create(['action', 'bottom']);
+      var btns = buttonGroupClass.create(['action', 'bottom','button-panel']);
 
       // Add meta button
       btns.add(
diff --git a/dev/js/src/panel.js b/dev/js/src/panel.js
index 498a7f1..9d7968f 100644
--- a/dev/js/src/panel.js
+++ b/dev/js/src/panel.js
@@ -1,32 +1,40 @@
 /**
  * Create a panel for a certain aspect of the system, like
  * the result, a match, or the VC.
+ *
+ * The buttons are associated with the panel's views,
+ * though they are integrated independently
  */
 define(['buttongroup', 'util'], function (buttonGroupClass) {
 
   return {
-
-    // TODO:
-    //   Support classes
-    create : function (viewpos = 'up') {
-      return Object.create(this)._init(viewpos);
+    create : function (classes) {
+      return Object.create(this)._init(classes);
     },
 
-    _init : function (viewpos) {
+
+    // Override by inheriting object
+    _init : function (classes) {
       this.views = [];
 
-      this._viewpos = viewpos;
-
-      
       /**
        * 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']);
+
+      this._classes = classes;
+      var c = ['action', 'button-panel'];
+      if (classes)
+        c.push.apply(c,classes);
+      this.actions = buttonGroupClass.create(c).bind(this);
+
+      // Warning: This is circular
+      this.actions.panel = this;
       return this;
     },
 
+    
     /**
      * The element of the panel
      */
@@ -36,32 +44,33 @@
 
       // Create panel element
       var e = document.createElement('div');
-      e.classList.add('panel');
+      var cl = e.classList;
+      cl.add('panel');
+   
+      if (this._classes)
+        cl.add.apply(cl, this._classes);
 
-      if (this._viewpos == 'up') {
-        this._viewE = e.addE('div');
-      };
+      this._viewE = e.addE('div');
 
-      e.appendChild(this.actions.element());
-
-      if (this._viewpos == 'down') {
-        this._viewE = e.addE('div');
-      };
+      // Per default the action buttons are below the view
+      // and integrated
+      var aElem = this.actions.element();
+      if (!aElem.parentNode)
+        e.appendChild(aElem);
 
       this._element = e;
       return e;
     },
 
 
-    /**
+    /*
      * The element of the views
      */
-    viewElement : function () {
+    _viewElement : function () {
       this.element();
       return this._viewE;
     },
 
-
     /**
      * Add a view to the panel
      */
@@ -72,7 +81,7 @@
 
       // Append element to panel element
 
-      this.viewElement().appendChild(
+      this._viewElement().appendChild(
         view.element()
       );
 
@@ -89,27 +98,5 @@
         }
       }
     },
-
-    /**
-     * Elements before the action buttons
-     * TODO:
-     *   Maybe rename actionLine?
-     */
-    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
index 2eb5dd0..4a4dc03 100644
--- a/dev/js/src/view.js
+++ b/dev/js/src/view.js
@@ -6,26 +6,34 @@
 define(['buttongroup', 'util'], function (buttonGroupClass) {
 
   return {
-
-    // TODO:
-    //   Support classes
-    create : function () {
-      return Object.create(this)._init();
+    create : function (classes) {
+      return Object.create(this)._init(classes);
     },
 
-    _init : function () {
-      // ..
+    // Override by inheriting object
+    _init : function (classes) {
       this.panel = undefined;
+      this._classes = classes;
+      this._shown = false;
 
       // The buttonclass is bind to the view
-      this.actions = buttonGroupClass.create(['action', 'view']).bind(this);
+      var c = ['action', 'button-view'];
+      if (classes)
+        c.push.apply(null,classes);
+      
+      this.actions = buttonGroupClass.create(c).bind(this);
+
       this.actions.add('close', ['button-icon','close'], function (e) {
         this.close();
       });
 
+      // Warning: This is circular
+      this.actions.view = this;
+
       return this;
     },
 
+    
     /**
      * Element of the view
      */
@@ -35,7 +43,16 @@
 
       // Create panel element
       var e = document.createElement('div');
-      e.classList.add('view');
+
+      var cl = e.classList;
+      cl.add('view');
+      if (this._classes)
+        cl.add.apply(cl, this._classes);
+
+      if (this.show !== undefined)
+        e.appendChild(this.show());
+
+      this._shown = true;
 
       e.appendChild(this.actions.element());
 
@@ -43,6 +60,14 @@
       return e;
     },
 
+
+    /**
+     * Is the object shown?
+     */
+    shown : function () {
+      return this._shown;
+    },
+    
     /**
      * Close the view.
      */
@@ -50,6 +75,21 @@
       var e = this.element();
       e.parentNode.removeChild(e);
       this.panel.delView(this);
+      this._shown = false;
+    },
+
+
+    /**
+     * Upgrade this object to another object,
+     * while private data stays intact.
+     *
+     * @param {Object] An object with properties.
+     */
+    upgradeTo : function (props) {
+      for (var prop in props) {
+        this[prop] = props[prop];
+      };
+      return this;
     }
   };
 });
diff --git a/dev/js/src/view/koralquery.js b/dev/js/src/view/koralquery.js
new file mode 100644
index 0000000..583b196
--- /dev/null
+++ b/dev/js/src/view/koralquery.js
@@ -0,0 +1,30 @@
+define([
+  'view',
+  'lib/highlight/highlight.pack',
+], function (viewClass) {
+  return {
+    create : function (classes) {
+      return Object.create(viewClass)._init(classes).upgradeTo(this);
+    },
+
+    /**
+     * KoralQuery view element
+     */
+    show : function () {
+      if (this._show)
+        return this._show;
+
+      var kq = document.createElement('div');
+      kq.setAttribute('id', 'koralquery');
+
+      var kqInner = kq.addE('div');
+      kqInner.innerHTML = JSON.stringify(KorAP.koralQuery, null, '  ');
+
+      // Highlight the view
+      hljs.highlightBlock(kqInner);
+
+      this._show = kq;
+      return kq;
+    }
+  }
+});