Renamed to Kalamar and updated Virtual Collection Chooser
diff --git a/public/js/src/menu.js b/public/js/src/menu.js
index b251000..f0dd15d 100644
--- a/public/js/src/menu.js
+++ b/public/js/src/menu.js
@@ -1,5 +1,11 @@
var KorAP = KorAP || {};
+/**
+ * Create scrollable drop-down menus.
+ *
+ * @author Nils Diewald
+ */
+
(function (KorAP) {
"use strict";
@@ -25,39 +31,63 @@
return Object.create(KorAP.Menu)._init(params);
},
+ focus : function () {
+ this._element.focus();
+ },
+
+ // Initialize list
_init : function (itemClass, params) {
// this._element.addEventListener("click", chooseHint, false);
this._itemClass = itemClass;
this._element = document.createElement("ul");
this._element.style.opacity = 0;
+/*
+ this._listener = document.createElement('input');
+ this._listener.setAttribute('type', 'text');
+// this._listener.style.display = "none";
+*/
+ this._element.addEventListener(
+ "keydown",
+ function (e) {
+ console.log('+++');
+ },
+ false
+ );
+
this.active = false;
this._items = new Array();
var i;
+
+ // Initialize item list based on parameters
for (i in params) {
var obj = itemClass.create(params[i]);
- this._items.push(
- obj
- );
+ this._items.push(obj);
};
this._limit = KorAP.menuLimit;
this._position = 0; // position in the active list
this._active = -1; // active item in the item list
-
this._reset();
return this;
},
+ /**
+ * Get the instantiated HTML element
+ */
element : function () {
return this._element;
},
+ /**
+ * Get the creator object for items
+ */
itemClass : function () {
return this._itemClass;
},
/**
- * Get and set numerical value for limit
+ * Get and set numerical value for limit,
+ * i.e. the number of items visible.
*/
limit : function (limit) {
if (arguments.length === 1)
@@ -69,7 +99,7 @@
* Upgrade this object to another object,
* while private data stays intact.
*
- * @param {Object] An object with properties.
+ * @param {Object} An object with properties.
*/
upgradeTo : function (props) {
for (var prop in props) {
@@ -78,6 +108,7 @@
return this;
},
+ // Reset chosen item and prefix
_reset : function () {
this._offset = 0;
this._pos = 0;
@@ -96,30 +127,30 @@
if (!this._initList())
return;
- // show based on offset
+ // show based on initial offset
this._showItems(0);
// Set the first element to active
+ // Todo: Or the last element chosen
this.liveItem(0).active(true);
this._position = 0;
this._active = this._list[0];
+ this._element.style.opacity = 1;
+
// Add classes for rolling menus
this._boundary(true);
},
- /**
- * Get a specific item from the complete list
- *
- * @param {number} index of the list item
- */
- item : function (index) {
- return this._items[index]
+ hide : function () {
+ this._element.style.opacity = 0;
},
+ // Initialize the list
_initList : function () {
+ // Create a new list
if (this._list === undefined) {
this._list = [];
}
@@ -131,20 +162,27 @@
// Offset is initially zero
this._offset = 0;
+ // There is no prefix set
if (this.prefix().length <= 0) {
for (var i = 0; i < this._items.length; i++)
this._list.push(i);
return true;
};
+ // There is a prefix set, so filter the list
var pos;
var paddedPrefix = " " + this.prefix();
+ // Iterate over all items and choose preferred matching items
+ // i.e. the matching happens at the word start
for (pos = 0; pos < this._items.length; pos++) {
if ((this.item(pos).lcField().indexOf(paddedPrefix)) >= 0)
this._list.push(pos);
};
+ // The list is empty - so lower your expectations
+ // Iterate over all items and choose matching items
+ // i.e. the matching happens anywhere in the word
if (this._list.length == 0) {
for (pos = 0; pos < this._items.length; pos++) {
if ((this.item(pos).lcField().indexOf(this.prefix())) >= 0)
@@ -152,7 +190,7 @@
};
};
- // Filter was successful
+ // Filter was successful - yeah!
return this._list.length > 0 ? true : false;
},
@@ -164,12 +202,13 @@
/**
* Get the prefix for filtering,
- * e.g. "ve"" for "verb"
+ * e.g. "ve" for "verb"
*/
prefix : function () {
return this._prefix || '';
},
+ // Append Items that should be shown
_showItems : function (offset) {
this.delete();
@@ -194,12 +233,16 @@
*/
delete : function () {
var child;
+
+ // Iterate over all visible items
for (var i = 0; i <= this.limit(); i++) {
+ // there is a visible element - unhighlight!
if (child = this.shownItem(i))
child.lowlight();
};
+ // Remove all children
while (child = this._element.firstChild)
this._element.removeChild(child);
},
@@ -218,10 +261,38 @@
},
+ // Prepend item to the shown list based on index
+ _prepend : function (i) {
+ var item = this.item(i);
+
+ // Highlight based on prefix
+ if (this.prefix().length > 0)
+ item.highlight(this.prefix());
+
+ var e = this.element();
+ // Append element
+ e.insertBefore(
+ item.element(),
+ e.firstChild
+ );
+ },
+
+
+ /**
+ * Get a specific item from the complete list
+ *
+ * @param {number} index of the list item
+ */
+ item : function (index) {
+ return this._items[index]
+ },
+
+
/**
* Get a specific item from the filtered list
*
* @param {number} index of the list item
+ * in the filtered list
*/
liveItem : function (index) {
if (this._list === undefined)
@@ -231,15 +302,12 @@
return this._items[this._list[index]];
},
- length : function () {
- return this._items.length;
- },
-
/**
* Get a specific item from the visible list
*
* @param {number} index of the list item
+ * in the visible list
*/
shownItem : function (index) {
if (index >= this.limit())
@@ -248,8 +316,16 @@
},
- /*
- * Make the next item in the menu active
+ /**
+ * Get the length of the full list
+ */
+ length : function () {
+ return this._items.length;
+ },
+
+
+ /**
+ * Make the next item in the filtered menu active
*/
next : function () {
// No active element set
@@ -270,7 +346,7 @@
}
// The next element is outside the view - roll down
- else if (this._position >= (this.limit + this._offset)) {
+ else if (this._position >= (this.limit() + this._offset)) {
this._removeFirst();
this._offset++;
this._append(this._list[this._position]);
@@ -282,8 +358,8 @@
/*
* Make the previous item in the menu active
*/
-/*
prev : function () {
+ // No active element set
if (this._position == -1)
return;
@@ -294,9 +370,9 @@
// The previous element is undefined - roll to bottom
if (newItem === undefined) {
- this._position = this.liveLength - 1;
+ this._offset = this.liveLength() - this.limit();
+ this._position = this.liveLength() - 1;
newItem = this.liveItem(this._position);
- this._offset = this.liveLength - this.limit;
this._showItems(this._offset);
}
@@ -306,85 +382,33 @@
this._offset--;
this._prepend(this._list[this._position]);
};
+
newItem.active(true);
},
-*/
- /**
- * Get the context of the menue,
- * e.g. "tt/" for the tree tagger menu
- */
-/*
- get context () {
- return this._context;
- },
-*/
-/*
- get liveLength () {
- if (this._list === undefined)
- this._initList();
- return this._list.length;
- },
-*/
-/*
- chooseHint : function (e) {
- var element = e.target;
- while (element.nodeName == "STRONG" || element.nodeName == "SPAN")
- element = element.parentNode;
-
- if (element === undefined || element.nodeName != "LI")
- return;
-
- var action = element.getAttribute('data-action');
- hint.insertText(action);
- var menu = hint.menu();
- menu.hide();
-
- // Fill this with the correct value
- var show;
- if ((show = hint.analyzeContext()) != "-") {
- menu.show(show);
- menu.update(
- hint._search.getBoundingClientRect().right
- );
- };
-
- hint._search.focus();
- },
-
+ // Remove the HTML node from the first item
_removeFirst : function () {
this.item(this._list[this._offset]).lowlight();
this._element.removeChild(this._element.firstChild);
},
+
+ // Remove the HTML node from the last item
_removeLast : function () {
- this.item(this._list[this._offset + this.limit - 1]).lowlight();
+ this.item(this._list[this._offset + this.limit() - 1]).lowlight();
this._element.removeChild(this._element.lastChild);
},
-
- // Prepend item to the shown list based on index
- _prepend : function (i) {
- var item = this.item(i);
-
- // Highlight based on prefix
- if (this.prefix.length > 0)
- item.highlight(this.prefix);
-
- // Append element
- this.element.insertBefore(
- item.element,
- this.element.firstChild
- );
- },
-*/
-
+ // Length of the filtered list
+ liveLength : function () {
+ if (this._list === undefined)
+ this._initList();
+ return this._list.length;
+ }
};
-
-
/**
* Item in the Dropdown menu
*/
@@ -585,4 +609,10 @@
},
};
+/*
+ KorAP._updateKey : function (e) {
+ var code = this._codeFromEvent(e)
+ };
+*/
+
}(this.KorAP));
diff --git a/public/js/src/vc.js b/public/js/src/vc.js
index d226fc4..00528aa 100644
--- a/public/js/src/vc.js
+++ b/public/js/src/vc.js
@@ -3,9 +3,13 @@
*
* @author Nils Diewald
*/
-
+/*
+ * Replaces a previous version written by Mengfei Zhou
+ */
var KorAP = KorAP || {};
+// Requires menu.js
+
/*
TODO: Implement a working localization solution!
TODO: Disable "and" or "or" in case it's followed
@@ -50,7 +54,6 @@
loc.DEL = loc.DEL || '×';
loc.EMPTY = loc.EMPTY || '⋯'
-
// Utility for analysing boolean values
function _bool (bool) {
return (bool === undefined || bool === null || bool === false) ? false : true;
@@ -148,10 +151,10 @@
if (json !== undefined) {
// Root object
- if (json['@type'] == 'korap:doc') {
+ if (json['@type'] == 'koral:doc') {
obj._root = KorAP.Doc.create(obj, json);
}
- else if (json['@type'] == 'korap:docGroup') {
+ else if (json['@type'] == 'koral:docGroup') {
obj._root = KorAP.DocGroup.create(obj, json);
}
else {
@@ -343,7 +346,7 @@
// Set JSON-LD type
var newDoc = KorAP.Doc.create(this._parent, {
- "@type" : "korap:doc",
+ "@type" : "koral:doc",
"value" : "",
"key" : v
});
@@ -374,6 +377,9 @@
ellipsis.appendChild(document.createTextNode(loc.EMPTY));
this._element.appendChild(ellipsis);
+ // Set ref - TODO: Cleanup!
+ this._element.refTo = this;
+
// Set operators
if (this._parent !== undefined && this.parent().ldType() !== null) {
var op = this.operators(
@@ -430,6 +436,9 @@
// Get element
var e = this._element;
+ // Set ref - TODO: Cleanup!
+ e.refTo = this;
+
// Check if there is a change
if (this.__changed) {
@@ -441,6 +450,10 @@
// Added key
var key = document.createElement('span');
key.setAttribute('class', 'key');
+
+ // Change key
+ key.addEventListener('click', KorAP._changeKey, false);
+
if (this.key())
key.appendChild(document.createTextNode(this.key()));
@@ -676,7 +689,7 @@
return {};
return {
- "@type" : "korap:" + this.ldType(),
+ "@type" : "koral:" + this.ldType(),
"key" : this.key(),
"match" : "match:" + this.matchop(),
"value" : this.value() || '',
@@ -810,7 +823,7 @@
KorAP.log(701, "JSON-LD group has no @type attribute");
return;
- case "korap:doc":
+ case "koral:doc":
// Be aware of cyclic structures!
var doc = KorAP.Doc.create(this, operand);
if (doc === undefined)
@@ -822,7 +835,7 @@
};
return dupl;
- case "korap:docGroup":
+ case "koral:docGroup":
// Be aware of cyclic structures!
var docGroup = KorAP.DocGroup.create(this, operand);
if (docGroup === undefined)
@@ -1039,7 +1052,7 @@
opArray.push(this._operands[i].toJson());
};
return {
- "@type" : "korap:" + this.ldType(),
+ "@type" : "koral:" + this.ldType(),
"operation" : "operation:" + this.operation(),
"operands" : opArray
};
@@ -1301,7 +1314,7 @@
toJson : function () {
return {
// Unspecified object
- "@type" : "korap:" + this.ldType()
+ "@type" : "koral:" + this.ldType()
};
},
@@ -1309,5 +1322,65 @@
return '';
}
};
+
+
+ /**
+ * Criterion in a KorAP.Doc
+ */
+ KorAP._changeKey = function () {
+ var doc = this.parentNode.refTo;
+ console.log(doc.type());
+ // key, matchop, type, value
+ };
+
+
+ // Field menu
+ KorAP.FieldMenu = {
+ create : function (params) {
+ return Object.create(KorAP.Menu)
+ .upgradeTo(KorAP.FieldMenu)
+ ._init(KorAP.FieldMenuItem, params)
+ }
+ };
+
+
+ // Field menu item
+ KorAP.FieldMenuItem = {
+ create : function (params) {
+ return Object.create(KorAP.MenuItem)
+ .upgradeTo(KorAP.FieldMenuItem)
+ ._init(params);
+ },
+ _init : function (params) {
+ if (params[0] === undefined)
+ throw new Error("Missing parameters");
+
+ this._name = params[0];
+ this._value = params[1];
+ this._type = params[2];
+
+ this._lcField = ' ' + this._name.toLowerCase();
+
+ return this;
+ },
+ name : function () {
+ return this._name;
+ },
+ type : function () {
+ return this._type;
+ },
+ element : function () {
+ // already defined
+ if (this._element !== undefined)
+ return this._element;
+
+ // Create list item
+ var li = document.createElement("li");
+ li.setAttribute("data-type", this._type);
+ li.setAttribute("data-value", this._value);
+ li.appendChild(document.createTextNode(this._name));
+ return this._element = li;
+ }
+ };
}(this.KorAP));