Tour: localize vc definition / add click to statistic button
Change-Id: Ia122082f586d1de2801ea0e8383816dcbe5bdabd
diff --git a/dev/js/spec/tourSpec.js b/dev/js/spec/tourSpec.js
index 55307b4..4bb71ef 100644
--- a/dev/js/spec/tourSpec.js
+++ b/dev/js/spec/tourSpec.js
@@ -65,13 +65,35 @@
"</div>";
+ var preDefinedStat={
+ "documents":12,
+ "tokens":2323,
+ "sentences":343434,
+ "paragraphs":45454545
+ };
+
+
+ KorAP.API.getCorpStat = function(collQu, cb){
+ return cb(preDefinedStat);
+ };
+
let template = document.createElement('template');
- html = introKorAP.trim(); // Do not return a text node of whitespace as the result
+ let html = introKorAP.trim(); // Do not return a text node of whitespace as the result
template.innerHTML = html;
- intrkorap = template.content;
+ let intrkorap = template.content;
+ let vc= vcClass.create().fromJson({
+ '@type' : 'koral:doc',
+ 'key' : 'title',
+ 'match': 'match:eq',
+ 'value' : 'TestTour!',
+ 'type' : 'type:string'
+ });
+
+ KorAP.vc = vc;
//TODO Add hint and vc-choose, they are not part of the generated file
+
describe('KorAP.GuidedTour', function(){
it('IDs and classes, that are needed for the guided tour should be in existence', function(){
expect(intrkorap.querySelector('#searchbar')).not.toBeNull();
@@ -83,21 +105,20 @@
expect(intrkorap.querySelector('#glimpse')).not.toBeNull();
expect(intrkorap.querySelector('#view-tutorial')).not.toBeNull();
expect(intrkorap.querySelector('#qsubmit')).not.toBeNull();
- let vc= vcClass.create().fromJson({
- '@type' : 'koral:doc',
- 'key' : 'title',
- 'match': 'match:eq',
- 'value' : 'TestTour!',
- 'type' : 'type:string'
- });
- var show = document.createElement('div');
+ let show = document.createElement('div');
show.appendChild(vc.element());
- expect(show.querySelector('.statistic')).not.toBeNull();
+ let statbut = show.querySelector('.statistic');
+ expect(statbut).not.toBeNull();
+ statbut.click();
+ expect(show.querySelector('.stattable')).not.toBeNull();
});
it('Guided Tour should be started and display steps and labels in the right order', function(){
+
+ let vcpanel = intrkorap.getElementById("vc-view");
+ vcpanel.appendChild(vc.element());
let searchTour = tourClass.gTstartSearch(intrkorap);
searchTour.start();
let totalSteps = searchTour.stepCount;
@@ -110,6 +131,7 @@
for(let i = 2; i <= totalSteps; i++){
searchTour.goToStepNumber(i);
expect(document.querySelector(".introjs-tooltiptext").textContent).toEqual(searchTour.testIntros[i-1]);
+
if(i == totalSteps){
expect(document.querySelector(".introjs-donebutton").textContent).toEqual(loc.TOUR_seargo);
expect(document.querySelector(".introjs-prevbutton").textContent).toEqual(loc.TOUR_lprev);
diff --git a/dev/js/src/loc/de.js b/dev/js/src/loc/de.js
index 99d3fa3..467adc4 100644
--- a/dev/js/src/loc/de.js
+++ b/dev/js/src/loc/de.js
@@ -50,10 +50,11 @@
loc.TOUR_annotAss = "Der Annotationsassistent erleichert die Formulierung von Suchanfragen mit Annotationen.";
loc.TOUR_vccho1 = "Öffnen des Korpusassistenten";
loc.TOUR_vccho2 = "Eigene Definition von Subkorpora durch Verknüpfung beliebiger Metadatenfelder.";
- loc.TOUR_vcStat = "Anzeigen der Korpusstatistik";
+ loc.TOUR_vcStat1 = "Es besteht die Möglichkeit, die Korpusstatistik anzuzeigen.";
+ loc.TOUR_vcStat2 = "Korpusstatistik";
loc.TOUR_qlfield = "Auswahl der Suchanfragesprache";
loc.TOUR_glimpse = "Beim Wählen dieser Option wird festgelegt ob nur die ersten Treffer in zufälliger Reihenfolge ausgewählt werden.";
- loc.TOUR_help = "Hier finden Sie Hilfe zu KorAP.";
+ loc.TOUR_help = "Hilfe zu KorAP";
loc.TOUR_seargo = "Suchanfrage starten";
//Guided Tour: explain the result
diff --git a/dev/js/src/loc/dereko.js b/dev/js/src/loc/dereko.js
index 1bd7a57..b90e8c4 100644
--- a/dev/js/src/loc/dereko.js
+++ b/dev/js/src/loc/dereko.js
@@ -4,7 +4,18 @@
* @author Helge Stallkamp
*/
-define(function () {
+define(['vc', 'vc/doc'], function (vcClass, docClass) {
const loc = KorAP.Locale;
- loc.TOUR_Qexample = loc.TOUR_Qexample || "laufen";
-});
\ No newline at end of file
+
+ //Query example for guided tour
+ loc.TOUR_Qexample = "laufen";
+
+ /* To define vc for guided tour */
+ loc.TOUR_vcQuery = {
+ '@type' : 'koral:doc',
+ 'key' : 'docSigle',
+ 'match': 'match:eq',
+ 'value' : 'GOE/AGI',
+ };
+
+});
diff --git a/dev/js/src/tour/tours.js b/dev/js/src/tour/tours.js
index 660338e..6ae961c 100644
--- a/dev/js/src/tour/tours.js
+++ b/dev/js/src/tour/tours.js
@@ -4,7 +4,7 @@
* @author Helge Stallkamp
*/
-define(['lib/intro', 'vc'], function(introClass, vcClass) {
+define(['lib/intro', 'vc', 'vc/doc', 'vc/docgroup'], function(introClass, vcClass, docClass, docGroup) {
//needed for localization of labels and contents of the tour
const loc = KorAP.Locale;
@@ -18,11 +18,12 @@
//localization guided tour gTstartSearch
loc.TOUR_sear1 = loc.TOUR_sear1 || "Enter your search enquiry here.";
loc.TOUR_sear2 = loc.TOUR_sear2 || "For example the search for '" + loc.TOUR_Qexample + "'.";
- loc.TOUR_searAnnot = loc.TOUR_searAnnot || "Annotation helper: By clicking here, the annotations of the differents layers are displayed and can be selected.";
+ loc.TOUR_searAnnot = loc.TOUR_searAnnot || "Annotation helper: By clicking, the annotations of the differents layers are displayed and can be selected.";
loc.TOUR_annotAss = loc.TOUR_annotAss || "The annoation assistant helps to formulate queries with annotations";
- loc.TOUR_vccho1 = loc.TOUR_vccho1 || "Choose corpus by clicking here.";
+ loc.TOUR_vccho1 = loc.TOUR_vccho1 || "Choose corpus";
loc.TOUR_vccho2 = loc.TOUR_vccho2 || "Define your corpus here.";
- loc.TOUR_vcStat = loc.TOUR_vcStat || "Display corpus statistic.";
+ loc.TOUR_vcStat1 = loc.TOUR_vcStat1 || "Click here to display corpus statistic.";
+ loc.TOUR_vcStat2 = loc.TOUR_vcStat2 || "Corpus statistic";
loc.TOUR_qlfield = loc.TOUR_qlfield|| "You can use KorAP with different query languages, select the query language here.";
loc.TOUR_help = loc.TOUR_help || "Help and more information about KorAP.";
loc.TOUR_glimpse = loc.TOUR_glimpse || "Select to show only the first hits in arbitrary order.";
@@ -45,7 +46,6 @@
* Guided Tour gTstartSearch: Explains the search functionality
*/
gTstartSearch:function(elparam){
-
let intro = introClass();
intro.setOptions(labelOptions);
intro.setOption('doneLabel', loc.TOUR_seargo);
@@ -89,10 +89,15 @@
},
{
element: doe.querySelector('.statistic'),
- intro: loc.TOUR_vcStat,
+ intro: loc.TOUR_vcStat1,
position: "left",
},
{
+ element: doe.querySelector('.stattable'),
+ intro: loc.TOUR_vcStat2,
+ position: "bottom",
+ },
+ {
element: doe.querySelector('#ql-field').parentNode,
intro: loc.TOUR_qlfield,
position: "bottom",
@@ -147,15 +152,15 @@
vchoo = doe.querySelector("#vc-choose");
vcv = doe.querySelector("#vc-view");
KorAP._delete.apply(KorAP.vc.root());
- KorAP.vc.root().key("creationDate").update();
- KorAP.vc.root().value("1820").update();
+
+ KorAP.vc.fromJson(loc.TOUR_vcQuery);
if(!(vcv.querySelector(".active"))){
vchoo.click();
/*
* Intro.js caches elements at the beginning, so element and position has to be set again.
*/
- intro._introItems[5].element = doe.querySelector(".statistic");
- intro._introItems[5].position = "bottom";
+ intro._introItems[5].element = doe.querySelector('.statistic');
+ intro._introItems[5].position = "left";
}
break;
@@ -170,14 +175,20 @@
intro.setOption('hideNext', true);
break;
}
+
+ if(this._currentStep == 6){
+ let statbut = doe.querySelector('.statistic');
+ statbut.click();
+ intro._introItems[6].element = doe.querySelector(".stattable");
+ intro._introItems[6].position = "bottom";
+ }
});
// Execute at the end of the tour (By clicking at the done-Button)
intro.oncomplete(function(){
KorAP.session.set("tour", true);
- let form = doe.getElementById("searchform");
- form.submit();
+ doe.getElementById("qsubmit").click();
//input.value="";
//KorAP._delete.apply(KorAP.vc.root());
});