diff --git a/dev/js/src/init.js b/dev/js/src/init.js
index 5d19cbd..b9822fd 100644
--- a/dev/js/src/init.js
+++ b/dev/js/src/init.js
@@ -1,4 +1,9 @@
 /*
+ * Initialize The JS frontend part and decorate
+ * the static HTML data.
+ *
+ * @author Nils Diewald
+ *
  * TODO: Create lazy loading of objects including
  * - obj.hint()
  * - obj.alertify()
@@ -15,14 +20,12 @@
   'hint',
   'vc',
   'tutorial',
-  'buttongroup',
   'lib/domReady',
   'vc/array',
   'lib/alertify',
   'session',
   'selectMenu',
-  'panel',
-  'view/koralquery',
+  'panel/result',
   'api',
   'mailToChiffre',
   'util'
@@ -30,21 +33,17 @@
              hintClass,
              vcClass,
              tutClass,
-             buttonGroupClass,
              domReady,
              vcArray,
              alertifyClass,
              sessionClass,
              selectMenuClass,
-             panelClass,
-             kqClass) {
+             resultPanelClass) {
 
   // Localization values
   const loc = KorAP.Locale;
   loc.VC_allCorpora    = loc.VC_allCorpora    || 'all corpora';
   loc.VC_oneCollection = loc.VC_oneCollection || 'a virtual corpus';
-  loc.TOGGLE_ALIGN     = loc.TOGGLE_ALIGN     || 'toggle alignment';
-  loc.SHOW_KQ          = loc.SHOW_KQ          || 'show KoralQuery';
 
   const d = document;
 
@@ -114,9 +113,9 @@
     var inactiveLi = d.querySelectorAll(
       '#search > ol > li:not(.active)'
     );
-    var i = 0;
+    var matchCount = 0;
 
-    for (i = 0; i < inactiveLi.length; i++) {
+    for (matchCount = 0; matchCount < inactiveLi.length; matchCount++) {
       inactiveLi[i].addEventListener('click', function (e) {
         if (this._match !== undefined)
           this._match.open();
@@ -127,7 +126,7 @@
         // This would prevent the sidebar to go back
         // e.halt();
       });
-      inactiveLi[i].addEventListener('keydown', function (e) {
+      inactiveLi[matchCount].addEventListener('keydown', function (e) {
         var code = _codeFromEvent(e);
         
         switch (code) {
@@ -192,9 +191,9 @@
     /**
      * Add result panel
      */
-    var resultPanel;
+    var resultPanel = resultPanelClass.create(show);
+
     if (resultInfo != null) {
-      resultPanel = panelClass.create(['result']);
 
       // Move buttons to resultinfo
       resultInfo.appendChild(resultPanel.actions.element());
@@ -202,38 +201,15 @@
       // The views are at the top of the search results
       var sb = d.getElementById('search');
       sb.insertBefore(resultPanel.element(), sb.firstChild);
-
     };
 
     
     // There is a koralQuery
     if (KorAP.koralQuery !== undefined) {    
-      
+
+      // Add KoralQuery view to result panel
       if (resultInfo !== null) {
-
-        // Open KoralQuery view
-        var kqButton = resultPanel.actions.add(loc.SHOW_KQ, ['show-kq','button-icon'], function () {
-
-          // Show only once - otherwise toggle
-          if (this._kq && this._kq.shown()) {
-            this._kq.close();
-            return;
-          };
-          
-          this._kq = kqClass.create();
-
-          // On close, remove session info on KQ
-          this._kq.onClose = function () {
-            delete show['kq'];
-          };
-
-          show['kq'] = true;
-          this.add(this._kq);
-        });
-
-        // Show KoralQuery in case it's meant to be shown
-        if (show['kq'])
-          kqButton.click();
+        resultPanel.addKqAction()
       };
 
       if (KorAP.koralQuery["errors"]) {
@@ -256,22 +232,16 @@
       };
     };
 
-    // There is more than 0 matches and there is a resultButton
-    if (i > 0) {
+    
+    /*
+     * There is more than 0 matches, so allow for
+     * alignment toggling (left <=> right)
+     */
+    if (matchCount > 0)
+      resultPanel.addAlignAction();
 
-      if (resultPanel) {
-        /**
-         * Toggle the alignment (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");
-        });
-      };
-    };
 
-    /**
+    /*
      * Toggle the Virtual Collection builder
      */
     if (vcname) {
@@ -385,6 +355,7 @@
   });
 });
 
+
 // Render Virtual collection
 function _getCurrentVC (vcClass, vcArray) {
   var vc = vcClass.create(vcArray);
@@ -394,6 +365,7 @@
   return vc;
 };
 
+
 function _checkVCrewrite (vcClass) {
   if (KorAP.koralQuery !== undefined && KorAP.koralQuery["collection"]) {
     return vcClass.checkRewrite(KorAP.koralQuery["collection"]);
diff --git a/dev/js/src/panel/match.js b/dev/js/src/panel/match.js
index 7058a9a..64dbf5d 100644
--- a/dev/js/src/panel/match.js
+++ b/dev/js/src/panel/match.js
@@ -1,7 +1,8 @@
 /**
- * Define a panel for matches
+ * The match panel.
+ *
+ * @author Nils Diewald
  */
-
 define([
   'panel',
   'match/treeitem',
diff --git a/dev/js/src/panel/result.js b/dev/js/src/panel/result.js
new file mode 100644
index 0000000..d3eef46
--- /dev/null
+++ b/dev/js/src/panel/result.js
@@ -0,0 +1,74 @@
+/**
+ * The result panel
+ *
+ * @author Nils Diewald
+ */
+define([
+  'panel',
+  'view/result/koralquery'
+], function (panelClass, kqViewClass) {
+
+  const d = document;
+
+  // Localization values
+  const loc = KorAP.Locale;
+  loc.TOGGLE_ALIGN = loc.TOGGLE_ALIGN || 'toggle alignment';
+  loc.SHOW_KQ      = loc.SHOW_KQ      || 'show KoralQuery';
+  
+  return {
+    create : function (show) {
+      return Object.create(panelClass)._init(['result']).upgradeTo(this)._init(show);
+    },
+
+    // Initialize panel
+    _init : function (show) {
+
+      return this;
+    },
+
+
+    /**
+     * Add KoralQuery action to panel
+     */
+    addKqAction : function () {
+
+      // Open KoralQuery view
+      var kqButton = this.actions.add(loc.SHOW_KQ, ['show-kq','button-icon'], function () {
+
+        // Show only once - otherwise toggle
+        if (this._kq && this._kq.shown()) {
+          this._kq.close();
+          return;
+        };
+          
+        this._kq = kqViewClass.create();
+
+        // On close, remove session info on KQ
+        this._kq.onClose = function () {
+          delete show['kq'];
+        };
+
+        show['kq'] = true;
+        this.add(this._kq);
+      });
+
+      // Show KoralQuery in case it's meant to be shown
+      if (show['kq'])
+        kqButton.click();
+    },
+
+    /**
+     * Add align action to panel
+     */
+    addAlignAction : function () {
+      /**
+       * Toggle the alignment (left <=> right)
+       */
+      this.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/view/koralquery.js b/dev/js/src/view/result/koralquery.js
similarity index 100%
rename from dev/js/src/view/koralquery.js
rename to dev/js/src/view/result/koralquery.js