Attach the querycreator object to the annotation table object
Change-Id: Ia6bdd0f1dd786de4286633e83e872e41c590f148
diff --git a/dev/js/src/match/info.js b/dev/js/src/match/info.js
index ac741ae..4d8ea9d 100644
--- a/dev/js/src/match/info.js
+++ b/dev/js/src/match/info.js
@@ -7,14 +7,12 @@
'match/treehierarchy',
'match/treearc',
'match/meta',
- 'match/querycreator',
'util'
], function (infoLayerClass,
matchTableClass,
matchTreeHierarchyClass,
matchTreeArcClass,
- matchMetaClass,
- matchQueryCreator) {
+ matchMetaClass) {
// Override
KorAP.API.getMatchInfo = KorAP.API.getMatchInfo || function () {
@@ -315,6 +313,9 @@
info.appendChild(matchtable);
+ // TODO:
+ // Create try-catch-exception-handling
+
// Create the table asynchronous
this.getTableData(undefined, function (table) {
@@ -327,9 +328,6 @@
// Load data
matchtable.classList.remove('loading');
-
- // Add query creator
- this._matchCreator = matchQueryCreator.create(info);
});
// Add button
diff --git a/dev/js/src/match/querycreator.js b/dev/js/src/match/querycreator.js
index 7c75145..72c672e 100644
--- a/dev/js/src/match/querycreator.js
+++ b/dev/js/src/match/querycreator.js
@@ -1,5 +1,7 @@
/**
* QueryCreator for Kalamar.
+ * This creates a Poliqarp/CQP query by using the
+ * annotation table.
*
* @author Nils Diewald
*/
@@ -11,6 +13,8 @@
* Cache foundry and layer information per row.
* TODO:
* Or-Groups are no longer in use.
+ * TODO:
+ * Make language and input fields snigletons!
*/
const loc = KorAP.Locale;
loc.NEW_QUERY = loc.NEW_QUERY || 'New Query';
@@ -39,31 +43,28 @@
};
return {
- create : function (matchInfo) {
- return Object.create(this)._init(matchInfo);
+
+ /**
+ * Constructor
+ */
+ create : function (matchTable) {
+ return Object.create(this)._init(matchTable);
},
// Initialize query creator
- _init : function (matchInfo) {
+ _init : function (matchTable) {
// Parameter checks
- if (matchInfo === undefined)
+ if (matchTable === undefined)
throw new Error('Missing parameters');
- else if (!(matchInfo instanceof Node))
+ else if (!(matchTable instanceof Node))
throw new Error('Requires element');
// Collect the token sequence in an array
this._query = []
- // Remember the matchinfo that is the parent of
- // the matchtable and the query frafment
- this._matchInfo = matchInfo;
-
// Get the match table
- this._matchTable = this._matchInfo.getElementsByClassName('matchtable')[0];
-
- if (this._matchTable === undefined)
- throw new Error('Element contains no match table');
+ this._matchTable = matchTable;
// Listen on the match table
this._matchTable.addEventListener(
@@ -84,7 +85,9 @@
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 ...
+ // TODO:
+ // 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")
@@ -221,7 +224,7 @@
if (annotation !== '') {
// Add annotation to string
- this.addToToken(i, annotation);
+ this._addToToken(i, annotation);
keyvaluepair.className = 'chosen';
};
};
@@ -236,7 +239,7 @@
if (annotation !== '') {
// Add annotation to string
- this.addToToken(i, annotation);
+ this._addToToken(i, annotation);
sib.className = 'chosen';
};
}
@@ -251,7 +254,7 @@
},
// Add term to token
- addToToken : function (index, term) {
+ _addToToken : function (index, term) {
var token = this._query[index];
@@ -275,7 +278,7 @@
// Remove term from token
- removeFromToken : function (index, term) {
+ _removeFromToken : function (index, term) {
var token = this._query[index];
if (token === undefined)
@@ -314,7 +317,7 @@
// Hide element
if (this._shown === true) {
- this._matchInfo.removeChild(this._element);
+ this._matchTable.parentNode.removeChild(this._element);
this._shown = false;
}
}
@@ -323,7 +326,11 @@
else {
if (this._shown === false) {
- this._matchInfo.insertBefore(this._element, this._matchTable.nextSibling);
+
+ // Insert after
+ this._matchTable.parentNode.insertBefore(
+ this._element, this._matchTable.nextSibling
+ );
this._shown = true;
};
@@ -335,11 +342,11 @@
// Add term to token if not yet chosen, otherwise remove
toggleInToken : function (node, index, term) {
if (node.className == 'chosen') {
- this.removeFromToken(index, term);
+ this._removeFromToken(index, term);
node.className = '';
}
else {
- this.addToToken(index, term);
+ this._addToToken(index, term);
node.className = 'chosen';
};
},
@@ -377,8 +384,10 @@
// Add query fragment to query bar
toQueryBar : function (e) {
- if (this._ql === undefined || this._q === undefined)
+ if (this._ql === undefined || this._q === undefined || this._ql === null) {
+ console.log('No query language object defined');
return;
+ };
// Set query language field
var qlf = this._ql.options;
diff --git a/dev/js/src/match/table.js b/dev/js/src/match/table.js
index 67e20cd..7aec5ad 100644
--- a/dev/js/src/match/table.js
+++ b/dev/js/src/match/table.js
@@ -1,9 +1,17 @@
/**
- * Table representation of morphological
+ * Table representation of token-based
* annotations of a match.
*/
-// TODO: Create base object for all matchinfo classes!
-define(["util"], function () {
+define([
+ 'match/querycreator',
+ "util"
+], function (matchQueryCreator) {
+ /*
+ * TODO:
+ * Create base object for all matchinfo classes!
+ * TODO:
+ * Rename to match/annotationtable
+ */
const _TermRE = new RegExp("^(?:([^\/]+?)\/)?([^:]+?):(.+?)$");
const d = document;
@@ -31,11 +39,15 @@
// Parse the snippet
this._parse(html.childNodes);
-
+
html.innerHTML = '';
return this;
},
-
+
+ // TODO: Destroy match!
+ destroy : function () {
+ this._matchCreator = undefined;
+ },
/**
* Length of the table (columns),
@@ -244,7 +256,10 @@
};
};
};
-
+
+ // Add query creator
+ this._matchCreator = matchQueryCreator.create(this._element);
+
return this._element;
},
};
diff --git a/dev/scss/main/kwic.scss b/dev/scss/main/kwic.scss
index 9927be3..847c344 100644
--- a/dev/scss/main/kwic.scss
+++ b/dev/scss/main/kwic.scss
@@ -125,10 +125,23 @@
display: none;
}
-#search li.active div.matchinfo {
- display: block;
+#search {
+
+ li.active div.matchinfo {
+ display: block;
+ }
+
+ li.active + li.active {
+ border-top: $border-size solid $light-grey;
+ padding-top: 3 * $border-size;
+ > ul.action.right {
+ padding-top: 3 * $border-size;
+ }
+ }
}
+
+
#search div.match-main {
position: relative;
z-index: 4;