diff --git a/dev/js/src/init.js b/dev/js/src/init.js
index c77b7b4..d1488dc 100644
--- a/dev/js/src/init.js
+++ b/dev/js/src/init.js
@@ -415,6 +415,9 @@
     if (obj.hint === undefined)
       obj.hint = hintClass.create();
 
+    // Add the hinthelper to the KorAP object to make it manipulatable globally
+    // KorAP.Hint = obj.hint;
+
     return obj;
   });
 });
diff --git a/dev/js/src/match/info.js b/dev/js/src/match/info.js
index 743fa2c..f8ac2cc 100644
--- a/dev/js/src/match/info.js
+++ b/dev/js/src/match/info.js
@@ -1,16 +1,18 @@
-  /**
-   * Information about a match.
-   */
+/**
+ * Information about a match.
+ */
 define([
   'match/infolayer',
   'match/table',
   'match/tree',
   'match/treemenu',
+  'match/querycreator',
   'util'
 ], function (infoLayerClass,
 	           matchTableClass,
 	           matchTreeClass,
-	           matchTreeMenuClass) {
+	           matchTreeMenuClass,
+             matchQueryCreator) {
   
   // Override 
   KorAP.API.getMatchInfo = KorAP.API.getMatchInfo || function () {
@@ -166,12 +168,12 @@
 
       // Remove circular reference
       if (this._treeMenu !== undefined)
-	delete this._treeMenu["info"];
+	      delete this._treeMenu["info"];
       
       this._treeMenu.destroy();
       this._treeMenu = undefined;
       this._match = undefined;
-      
+      this._matchCreator = undefined;      
       // Element destroy
     },
 
@@ -184,9 +186,9 @@
       
       var h6 = matchtree.appendChild(document.createElement('h6'));
       h6.appendChild(document.createElement('span'))
-	.appendChild(document.createTextNode(foundry));
+	      .appendChild(document.createTextNode(foundry));
       h6.appendChild(document.createElement('span'))
-	.appendChild(document.createTextNode(layer));
+	      .appendChild(document.createTextNode(layer));
       
       var tree = matchtree.appendChild(
 	      document.createElement('div')
@@ -276,6 +278,9 @@
           matchtable.appendChild(table.element());
 	      };
 	      matchtable.classList.remove('loading');
+
+        // Add query creator
+        this._matchCreator = matchQueryCreator.create(matchtable);
       });
 
       // Get spans
diff --git a/dev/js/src/match/querycreator.js b/dev/js/src/match/querycreator.js
index 6786191..ca5aaf9 100644
--- a/dev/js/src/match/querycreator.js
+++ b/dev/js/src/match/querycreator.js
@@ -39,10 +39,19 @@
         document.createElement('span')
       );
 
+      // Event when the query fragment is clicked
+      this._element.addEventListener('click', this.toQueryBar.bind(this), 1);
+
+      // Get some basic information - see tutorial.js
+      // It may be better to consultate a global object like KorAP.Hint, however ...
+      this._ql = document.getElementById("ql-field");
+	    this._q = document.getElementById("q-field")
+
       this._shown = false;
       return this;
     },
 
+    // Realease a click event on the annotation table
     clickOnAnno : function (event) {
 
       // Listen for clicks on table cells
@@ -211,12 +220,23 @@
       return str;
     },
 
-    toQueryBar : function () {
-      // 1. Activate Poliquarp-QL
-      // 2. Empty query helper
-      // 3. Reset annotation helper
-      // 4. Insert to query bar
-      // 5. scroll to top
+    // Add query fragment to query bar
+    toQueryBar : function (e) {
+
+      // Set query language field
+      var qlf = this._ql.options;
+      for (var i in qlf) {
+	      if (qlf[i].value == 'poliqarp') {
+	        qlf[i].selected = true;
+          break;
+	      };
+      };
+
+      // Insert to query bar
+      this._q.value = this.toString();
+
+      // Scroll to top
+      window.scrollTo(0, 0);
     }
   };  
 });
diff --git a/dev/js/src/match/table.js b/dev/js/src/match/table.js
index 89ab555..da56e29 100644
--- a/dev/js/src/match/table.js
+++ b/dev/js/src/match/table.js
@@ -201,28 +201,28 @@
       var foundryList = Object.keys(this._foundry).sort();
 
       for (var f = 0; f < foundryList.length; f++) {
-  var foundry = foundryList[f];
-  var layerList =
-    Object.keys(this._foundry[foundry]).sort();
+        var foundry = foundryList[f];
+        var layerList =
+            Object.keys(this._foundry[foundry]).sort();
 
-  for (var l = 0; l < layerList.length; l++) {
-    var layer = layerList[l];
-    tr = tbody.appendChild(
-      d.createElement('tr')
-    );
-    tr.setAttribute('tabindex', 0);
-    tr.addCell = addCell;
+        for (var l = 0; l < layerList.length; l++) {
+          var layer = layerList[l];
+          tr = tbody.appendChild(
+            d.createElement('tr')
+          );
+          tr.setAttribute('tabindex', 0);
+          tr.addCell = addCell;
 
-    tr.addCell('th', foundry);
-    tr.addCell('th', layer);
+          tr.addCell('th', foundry);
+          tr.addCell('th', layer);
 
-    for (var v = 0; v < this.length(); v++) {
-      tr.addCell(
-        'td',
-        this.getValue(v, foundry, layer) 
-      );
-    };
-  };
+          for (var v = 0; v < this.length(); v++) {
+            tr.addCell(
+              'td',
+              this.getValue(v, foundry, layer) 
+            );
+          };
+        };
       };
 
       return this._element = table;
diff --git a/dev/js/src/tutorial.js b/dev/js/src/tutorial.js
index 2979657..2cea5f3 100644
--- a/dev/js/src/tutorial.js
+++ b/dev/js/src/tutorial.js
@@ -74,9 +74,10 @@
 
       var qlf = this._ql.options;
       for (var i in qlf) {
-	if (qlf[i].value == ql) {
-	  qlf[i].selected = true;
-	};
+	      if (qlf[i].value == ql) {
+	        qlf[i].selected = true;
+          break;
+	      };
       };
 
       this._q.value = q;
@@ -118,42 +119,42 @@
     show : function () {
       var element = this._element;
       if (element.style.display === 'block')
-	return;
+	      return;
 
       if (this._iframe === null) {
-	this._iframe = document.createElement('iframe');
-	this._iframe.setAttribute(
-	  'src',
-	  (this.getPage() || this.start) + '?embedded=true'
-	);
+	      this._iframe = document.createElement('iframe');
+	      this._iframe.setAttribute(
+	        'src',
+	        (this.getPage() || this.start) + '?embedded=true'
+	      );
 
-	var ul = document.createElement('ul');
-	ul.classList.add('action', 'right');
+	      var ul = document.createElement('ul');
+	      ul.classList.add('action', 'right');
 
-	// Add close button
-	var close = document.createElement('li');
-	close.appendChild(document.createElement('span'))
-	  .appendChild(document.createTextNode(loc.CLOSE));
-	close.classList.add('close');
-	close.setAttribute('title', loc.CLOSE);
-	close.onclick = function () {
-	  element.style.display = 'none';
-	};
+	      // Add close button
+	      var close = document.createElement('li');
+	      close.appendChild(document.createElement('span'))
+	        .appendChild(document.createTextNode(loc.CLOSE));
+	      close.classList.add('close');
+	      close.setAttribute('title', loc.CLOSE);
+	      close.onclick = function () {
+	        element.style.display = 'none';
+	      };
 
-	// Add open in new window button
-	// Add scroll to top button
-	/*
-	  var info = document.createElement('li');
-	  info.appendChild(document.createElement('span'))
-	  .appendChild(document.createTextNode(loc.SHOWINFO));
-	  info.classList.add('info');
-	  info.setAttribute('title', loc.SHOWINFO);
-	*/
+	      // Add open in new window button
+	      // Add scroll to top button
+	      /*
+	        var info = document.createElement('li');
+	        info.appendChild(document.createElement('span'))
+	        .appendChild(document.createTextNode(loc.SHOWINFO));
+	        info.classList.add('info');
+	        info.setAttribute('title', loc.SHOWINFO);
+	      */
 	
-	ul.appendChild(close);
+	      ul.appendChild(close);
 
-	element.appendChild(ul);
-	element.appendChild(this._iframe);
+	      element.appendChild(ul);
+	      element.appendChild(this._iframe);
       };
 
       element.style.display = 'block';