Fix tutorial links to support query-languages

Change-Id: Ic32258b8421bc7a0b90a49fc4ec4b3d29790bf74
diff --git a/dev/js/spec/selectMenuSpec.js b/dev/js/spec/selectMenuSpec.js
index 26cfd25..8145611 100644
--- a/dev/js/spec/selectMenuSpec.js
+++ b/dev/js/spec/selectMenuSpec.js
@@ -27,17 +27,22 @@
 	        value : 'cql'
 	      }
       ];
-      
-      it('should replace a select element', function () {
-	      var div = document.createElement('div');
+
+      function _selectE() {
+        var div = document.createElement('div');
 	      var element = div.appendChild(document.createElement('select'));
 	      for (i in list) {
 	        var opt = element.appendChild(document.createElement('option'));
 	        opt.setAttribute('value', list[i].value);
 	        opt.appendChild(document.createTextNode(list[i].content));
 	      };
-
+        return div;
+      };
+      
+      it('should replace a select element', function () {
+	      var div = _selectE();
 	      var menu = selectMenuClass.create(div);
+        var element = div.firstChild;
 
 	      expect(element.style.display).toEqual('none');
 
@@ -55,14 +60,10 @@
 	      expect(menu.shownItem(0).lcField()).toEqual(' poliqarp');
       });
 
+
       it('should first show the selected value', function () {
-	      var div = document.createElement('div');
-	      var element = div.appendChild(document.createElement('select'));
-	      for (i in list) {
-	        var opt = element.appendChild(document.createElement('option'));
-	        opt.setAttribute('value', list[i].value);
-	        opt.appendChild(document.createTextNode(list[i].content));
-	      };
+	      var div = _selectE();
+        var element = div.firstChild;
 
         expect(element.selectedIndex).toEqual(0);
 
@@ -75,6 +76,16 @@
         menu.show(3);
         expect(menu._title.textContent).toEqual('Annis');
       });
+
+      it('should be selectable via method', function () {
+        var div = _selectE();
+        var element = div.firstChild;
+	      var menu = selectMenuClass.create(div);
+        
+        expect(element.selectedIndex).toEqual(0);
+        menu.selectValue('annis');
+        expect(element.selectedIndex).toEqual(2);
+      });
     });
   }
 );
diff --git a/dev/js/src/init.js b/dev/js/src/init.js
index 4e2c5c3..2ad0883 100644
--- a/dev/js/src/init.js
+++ b/dev/js/src/init.js
@@ -182,7 +182,7 @@
     // Replace QL select menus with KorAP menus
     var qlField = document.getElementById('ql-field');
     if (qlField !== null) {
-      selectMenuClass.create(
+      KorAP.QLmenu = selectMenuClass.create(
         document.getElementById('ql-field').parentNode
       ).limit(5);
     };
diff --git a/dev/js/src/selectMenu.js b/dev/js/src/selectMenu.js
index dc0f863..d44d756 100644
--- a/dev/js/src/selectMenu.js
+++ b/dev/js/src/selectMenu.js
@@ -83,6 +83,24 @@
 	      return this._selected || this._select.selectedIndex || 0;
       },
 
+
+      /**
+       * Set the select value
+       */
+      selectValue : function (vParam) {
+        var qlf = this._select.options;
+        var i;
+        for (i in qlf) {
+	        if (qlf[i].value == vParam) {
+            this.hide();
+            this.select(i);
+            this.showTitle();
+            break;
+	        };
+        };
+        return this;
+      },
+      
       /**
        * Show the select menu
        */
diff --git a/dev/js/src/tutorial.js b/dev/js/src/tutorial.js
index 2cea5f3..aa18c34 100644
--- a/dev/js/src/tutorial.js
+++ b/dev/js/src/tutorial.js
@@ -19,7 +19,7 @@
      */
     create : function (obj,session) {
       if (!obj)
-	return null;
+	      return null;
       return Object.create(this)._init(obj,session);
     },
 
@@ -27,34 +27,34 @@
     _init : function (obj, session) {
 
       if (session === undefined) {
-	this._session = sessionClass.create();
+	      this._session = sessionClass.create();
       }
       else {
-	this._session = session;
+	      this._session = session;
       };
     
 
       if (obj) {
-	this._show = obj;
-	this.start = obj.getAttribute('href');
-	obj.removeAttribute('href');
-	var that = this;
-	obj.onclick = function () {
-	  that.show();
-	};
+	      this._show = obj;
+	      this.start = obj.getAttribute('href');
+	      obj.removeAttribute('href');
+	      var that = this;
+	      obj.onclick = function () {
+	        that.show();
+	      };
 
-	// Injects a tutorial div to the body
-	var div = document.createElement('div');
-	div.setAttribute('id', 'tutorial');
-	div.style.display = 'none';
-	document.getElementsByTagName('body')[0].appendChild(div);
-	this._iframe = null;
-	this._element = div;
+	      // Injects a tutorial div to the body
+	      var div = document.createElement('div');
+	      div.setAttribute('id', 'tutorial');
+	      div.style.display = 'none';
+	      document.getElementsByTagName('body')[0].appendChild(div);
+	      this._iframe = null;
+	      this._element = div;
 
-	// Some fields
-	this._ql     = document.getElementById("ql-field");
-	this._q      = document.getElementById("q-field")
-	this._cutoff = document.getElementById("q-cutoff-field");
+	      // Some fields
+	      this._ql     = document.getElementById("ql-field");
+	      this._q      = document.getElementById("q-field")
+	      this._cutoff = document.getElementById("q-cutoff-field");
       };
 
       return this;
@@ -69,9 +69,13 @@
       var ql = e.getAttribute("data-query-language");
       var qc = e.getAttribute("data-query-cutoff");
       if (qc !== 0 && qc !== "0" && qc !== "off" && qc !== null) {
-	this._cutoff.checked = true;
+	      this._cutoff.checked = true;
       };
 
+      if (KorAP.QLmenu) {
+        KorAP.QLmenu.selectValue(ql);
+      };
+      /*
       var qlf = this._ql.options;
       for (var i in qlf) {
 	      if (qlf[i].value == ql) {
@@ -79,6 +83,7 @@
           break;
 	      };
       };
+      */
 
       this._q.value = q;
       this.setPage(e);
@@ -92,9 +97,9 @@
       var qs = d.querySelectorAll('pre.query.tutorial');
       var that = this;
       for (var i = 0; i < qs.length; i++) {
-	qs[i].onclick = function (e) {
-	  that.useQuery(this,e);
-	};
+	      qs[i].onclick = function (e) {
+	        that.useQuery(this,e);
+	      };
       };
     },
 
@@ -105,10 +110,10 @@
       var dl = d.getElementsByClassName('doc-link');
       var that = this;
       for (var i = 0; i < dl.length; i++) {
-	dl[i].onclick = function (e) {
-	  that.setPage(this.getAttribute('href'));
-	  return true;
-	};
+	      dl[i].onclick = function (e) {
+	        that.setPage(this.getAttribute('href'));
+	        return true;
+	      };
       };      
     },
 
@@ -127,7 +132,7 @@
 	        'src',
 	        (this.getPage() || this.start) + '?embedded=true'
 	      );
-
+        
 	      var ul = document.createElement('ul');
 	      ul.classList.add('action', 'right');
 
@@ -174,23 +179,23 @@
     setPage : function (obj) {
       var page = obj;
       if (typeof page != 'string') {
-	var l = this._iframe !== null ? window.frames[0].location : window.location;
-	page = l.pathname + l.search;
+	      var l = this._iframe !== null ? window.frames[0].location : window.location;
+	      page = l.pathname + l.search;
 
-	for (var i = 1; i < 5; i++) {
-	  if (obj.nodeName === 'SECTION') {
-	    if (obj.hasAttribute('id'))
-	      page += '#' + obj.getAttribute('id');
-	    break;
-	  }
-	  else if (obj.nodeName === 'PRE' && obj.hasAttribute('id')) {
-	    page += '#' + obj.getAttribute('id');
-	    break;
-	  }
-	  else {
-	    obj = obj.parentNode;
-	  };
-	};
+	      for (var i = 1; i < 5; i++) {
+	        if (obj.nodeName === 'SECTION') {
+	          if (obj.hasAttribute('id'))
+	            page += '#' + obj.getAttribute('id');
+	          break;
+	        }
+	        else if (obj.nodeName === 'PRE' && obj.hasAttribute('id')) {
+	          page += '#' + obj.getAttribute('id');
+	          break;
+	        }
+	        else {
+	          obj = obj.parentNode;
+	        };
+	      };
       };
       this._session.set('tutpage', page);
     },