Introduced alert information to hint helper
diff --git a/dev/js/spec/hintSpec.js b/dev/js/spec/hintSpec.js
index 6cfd218..554b61d 100644
--- a/dev/js/spec/hintSpec.js
+++ b/dev/js/spec/hintSpec.js
@@ -7,16 +7,16 @@
"initKeyboardEvent" : "initKeyEvent";
keyboardEvent[initMethod](
type,
- true, // bubbles
- true, // cancelable
- window, // viewArg: should be window
- false, // ctrlKeyArg
- false, // altKeyArg
- false, // shiftKeyArg
- false, // metaKeyArg
+ true, // bubbles
+ true, // cancelable
+ window, // viewArg: should be window
+ false, // ctrlKeyArg
+ false, // altKeyArg
+ false, // shiftKeyArg
+ false, // metaKeyArg
keyCode, // keyCodeArg : unsigned long the virtual key code, else 0
- 0 // charCodeArgs : unsigned long the Unicode character
- // associated with the depressed key, else 0
+ 0 // charCodeArgs : unsigned long the Unicode character
+ // associated with the depressed key, else 0
);
element.dispatchEvent(keyboardEvent);
};
diff --git a/dev/js/src/hint.js b/dev/js/src/hint.js
index 1db2fd0..4f55d0f 100644
--- a/dev/js/src/hint.js
+++ b/dev/js/src/hint.js
@@ -4,6 +4,12 @@
*
* @author Nils Diewald
*/
+/*
+ * TODO: List can be shown when prefix is like 'base/s=pcorenlp/'
+ * TODO: Sometimes the drop-down box down vanish when list is shown
+ * TODO: Create should expect an input text field
+ * TODO: Embed only one single menu (not multiple)
+ */
define([
'hint/input',
'hint/menu',
@@ -24,7 +30,7 @@
"(?:[-_a-zA-Z0-9]+?)=" + // Layer
"(?:"+
"(?:[^:=\/ ]+?):|" + // Key
- "(?:[^-=\/ ]+?)-" + // Node
+ "(?:[^-=\/ ]+?)-" + // Node
")?" +
")?" +
")$";
@@ -106,10 +112,27 @@
return this;
},
+
+ /**
+ * Return the input field attached to the hint helper.
+ */
inputField : function () {
return this._inputField;
},
+
+ /**
+ * Altert at a specific character position.
+ */
+ charAlert : function (charPos, msg) {
+ this._inputField.moveto(charPos);
+ var c = this._inputField.container();
+ c.classList.add('active');
+ var error = c.appendChild(document.createElement('div'));
+ error.classList.add('alert', 'hint');
+ error.appendChild(document.createTextNode(msg));
+ },
+
/**
* Return hint menu and probably init based on an action
*/
@@ -148,7 +171,9 @@
/**
- * Show the menu
+ * Show the menu.
+ * Currently this means that multiple menus may be loaded
+ * but not shown.
*/
show : function (ifContext) {
@@ -164,8 +189,8 @@
c.appendChild(menu.element());
menu.show();
menu.focus();
- // Focus on input field
- // this.inputField.element.focus();
+ // Focus on input field
+ // this.inputField.element.focus();
};
}
};
diff --git a/dev/js/src/hint/input.js b/dev/js/src/hint/input.js
index c12d26a..6e02793 100644
--- a/dev/js/src/hint/input.js
+++ b/dev/js/src/hint/input.js
@@ -1,4 +1,8 @@
// Input field for queries
+/*
+ * TODO: Support allert for query problems.
+ */
+
define({
/**
@@ -7,38 +11,7 @@
create : function (element) {
return Object.create(this)._init(element);
},
-
- // Initialize new input field
- _init : function (element) {
- this._element = element;
- // Create mirror for searchField
- if ((this._mirror = document.getElementById("searchMirror")) === null) {
- this._mirror = document.createElement("div");
- this._mirror.setAttribute("id", "searchMirror");
- this._mirror.appendChild(document.createElement("span"));
- this._container = this._mirror.appendChild(document.createElement("div"));
- this._mirror.style.height = "0px";
- document.getElementsByTagName("body")[0].appendChild(this._mirror);
- };
-
- // Update position of the mirror
- var that = this;
- var repos = function () {
- that.reposition();
- };
- window.addEventListener('resize', repos);
- this._element.addEventListener('onfocus', repos);
- that.reposition();
-
- return this;
- },
-
- // Get the right position
- _rightPos : function () {
- var box = this._mirror.firstChild.getBoundingClientRect();
- return box.right - box.left;
- },
/**
* Get the mirrored input field.
@@ -50,8 +23,9 @@
/**
* Get the container element.
- * This contains the mirror and
- * the hint helper.
+ * This contains the hint helper / menus
+ * and probably an
+ * error message.
*/
container : function () {
return this._container;
@@ -66,6 +40,7 @@
return this._element;
},
+
/**
* Get the value of the input field
* the hint helper is attached to.
@@ -81,8 +56,10 @@
update : function () {
this._mirror.firstChild.textContent = this._split()[0];
this._container.style.left = this._rightPos() + 'px';
+ return this;
},
+
/**
* Insert text into the mirror.
* This is a prefix of the input field's
@@ -94,9 +71,21 @@
s.value = splittedText[0] + text + splittedText[1];
s.selectionStart = (splittedText[0] + text).length;
s.selectionEnd = s.selectionStart;
+
+ // Maybe update?
this._mirror.firstChild.textContent = splittedText[0] + text;
+ return this;
},
-
+
+ /**
+ * Move hinthelper to given character position
+ */
+ moveto : function (charpos) {
+ this._element.selectionStart = charpos;
+ this._element.selectionEnd = charpos;
+ this._element.focus();
+ return this.update();
+ },
/**
* Reposition the input mirror directly
@@ -124,6 +113,7 @@
mirrorStyle.fontFamily = inputStyle.getPropertyValue("font-family");
},
+
/**
* Get the context, which is the input
* field's value bounded to the
@@ -133,14 +123,49 @@
return this._split()[0];
},
+
+ // Initialize new input field
+ _init : function (element) {
+ this._element = element;
+
+ // Create mirror for searchField
+ // This is important for positioning
+ if ((this._mirror = document.getElementById("searchMirror")) === null) {
+ this._mirror = document.createElement("div");
+ this._mirror.setAttribute("id", "searchMirror");
+ this._mirror.appendChild(document.createElement("span"));
+ this._container = this._mirror.appendChild(document.createElement("div"));
+ this._mirror.style.height = "0px";
+ document.getElementsByTagName("body")[0].appendChild(this._mirror);
+ };
+
+ // Update position of the mirror
+ window.addEventListener('resize', this.reposition.bind(this));
+ this._element.addEventListener('onfocus', this.reposition.bind(this));
+ this.reposition();
+ return this;
+ },
+
+ // Get the right position
+ _rightPos : function () {
+ var box = this._mirror.firstChild.getBoundingClientRect();
+ return box.right - box.left;
+ },
+
+
/*
* Return two substrings,
- * splitted at the current cursor position.
+ * splitted at a given position
+ * or at the current cursor position.
*/
- _split : function () {
+ _split : function (start) {
var s = this._element;
var value = s.value;
- var start = s.selectionStart;
+
+ // Get start from cursor position
+ if (arguments.length === 0)
+ start = s.selectionStart;
+
return new Array(
value.substring(0, start),
value.substring(start, value.length)
diff --git a/dev/js/src/hint/item.js b/dev/js/src/hint/item.js
index b9a1bc8..7d97334 100644
--- a/dev/js/src/hint/item.js
+++ b/dev/js/src/hint/item.js
@@ -52,8 +52,7 @@
// Update input field
var input = h.inputField();
- input.insert(this._action);
- input.update();
+ input.insert(this._action).update();
h.active = false;
diff --git a/dev/js/src/menu.js b/dev/js/src/menu.js
index 4d9df49..e8028ea 100644
--- a/dev/js/src/menu.js
+++ b/dev/js/src/menu.js
@@ -8,6 +8,7 @@
* TODO: Show the slider briefly on move (whenever screen is called).
* TODO: Ignore alt+ and strg+ key strokes.
* TODO: Should scroll to a chosen value after prefixing, if the chosen value is live
+ * Add a "title" to a menu that is not scrollable.
*/
define([
'menu/item',