Merge "Proposal for localizable example queries in tutorials"
diff --git a/dev/js/src/datepicker.js b/dev/js/src/datepicker.js
index 8ae5267..fe9e97d 100644
--- a/dev/js/src/datepicker.js
+++ b/dev/js/src/datepicker.js
@@ -36,6 +36,7 @@
return Object.create(this)._init();
},
+
// Init datepicker
_init : function () {
this._selected = [];
@@ -93,6 +94,10 @@
this._click = cb;
},
+
+ input : function () {
+ return this._input;
+ },
/**
* Show the datepicker.
@@ -120,10 +125,40 @@
(today.getMonth() + 1));
// Append all helpers
- this._element.appendChild(this._monthHelper());
- this._element.appendChild(this._yearHelper());
- this._element.appendChild(this._dayHelper());
- this._element.appendChild(this._stringHelper());
+ e.appendChild(this._monthHelper());
+ e.appendChild(this._yearHelper());
+ e.appendChild(this._dayHelper());
+ this._input = e.appendChild(this._stringHelper());
+
+ // Always focus
+ e.addEventListener(
+ 'mousedown',
+ function (ev) {
+ this._inField = true
+ }.bind(this)
+ );
+
+ e.addEventListener(
+ 'mouseup',
+ function (ev) {
+ this._inField = false;
+ this._input.focus();
+ }.bind(this)
+ );
+
+ this._input.addEventListener(
+ 'blur',
+ function (ev) {
+ if (!this._inField) {
+ if (this.fromString(this._input.value)) {
+ this.store();
+ };
+ };
+ ev.halt();
+ }.bind(this)
+ );
+
+ this._input.focus();
return this._element;
},
diff --git a/dev/js/src/vc.js b/dev/js/src/vc.js
index d6a26f2..4772115 100644
--- a/dev/js/src/vc.js
+++ b/dev/js/src/vc.js
@@ -243,8 +243,9 @@
* Get the element associated with the virtual collection
*/
element : function () {
- if (this._element !== undefined)
- return this._element;
+ if (this._element !== undefined) {
+ return this._element;
+ };
this._element = document.createElement('div');
this._element.setAttribute('class', 'vc');
@@ -270,18 +271,18 @@
* as a creation date limit criterion.
*/
makePersistant : function () {
-// this.root().wrapOnRoot('and');
+ // this.root().wrapOnRoot('and');
var todayStr = KorAP._vcDatePicker.today();
var doc = docClass.create();
var root = this.root();
if (root.ldType() === 'docGroup' &&
- root.operation === 'and') {
- root.append(cond);
+ root.operation === 'and') {
+ root.append(cond);
}
else {
- root.wrapOnRoot('and');
- root.append(doc);
+ root.wrapOnRoot('and');
+ root.append(doc);
};
doc.key("creationDate");
diff --git a/dev/js/src/vc/doc.js b/dev/js/src/vc/doc.js
index 67bf37a..87b7057 100644
--- a/dev/js/src/vc/doc.js
+++ b/dev/js/src/vc/doc.js
@@ -441,7 +441,7 @@
// Show datepicker
if (this.type() === 'date') {
var dp = KorAP._vcDatePicker;
- dp.fromString(v)
+ dp.fromString(v);
// Todo: change this
dp.onclick(function (selected) {
@@ -467,16 +467,7 @@
this._valueE
);
- dpElem.focus();
- /*
- dpElem.addEventListener('blur', function (e) {
- e.halt();
-
- // Remove datepicker
- // TODO: If focus is not set to string input
- that._element.removeChild(this);
- });
- */
+ dp.input().focus();
}
else {
var regex = this.type() === 'regex' ? true : false;
diff --git a/dev/js/src/vc/stringval.js b/dev/js/src/vc/stringval.js
index 595057a..1cebde4 100644
--- a/dev/js/src/vc/stringval.js
+++ b/dev/js/src/vc/stringval.js
@@ -87,11 +87,14 @@
/**
* Store the string value.
* This method should be overwritten.
- * The method receives the the value and the regex.
+ * The method receives the value and the regex.
*/
store : function (v,r) {},
+ /**
+ * Put focus on element
+ */
focus : function () {
this._element.children[0].focus();
},
@@ -127,26 +130,47 @@
);
re.addEventListener(
'click',
- function (e) {
+ function (ev) {
this.toggleRegex();
- e.halt();
+ // ev.halt();
}.bind(this),
true
);
re.appendChild(document.createTextNode('RE'));
- e.addEventListener(
+ // If the focus is not on the text field anymore,
+ // delegate focus to
+ this._input.addEventListener(
'blur',
- function (e) {
- this.store(this.value(), this.regex());
- e.halt();
+ function (ev) {
+ if (!this._inField) {
+ this.value(this._input.value);
+ this.store(this.value(), this.regex());
+ };
+ ev.halt();
+ }.bind(this)
+ );
+
+ // Workaround to check the click is in the field
+ e.addEventListener(
+ 'mousedown',
+ function (ev) {
+ this._inField = true;
+ }.bind(this)
+ );
+
+ e.addEventListener(
+ 'mouseup',
+ function (ev) {
+ this._inField = false;
+ this._input.focus();
}.bind(this)
);
this._input.addEventListener(
'keypress',
- function (e) {
- if (e.keyCode == 13) {
+ function (ev) {
+ if (ev.keyCode == 13) {
this.value(this._input.value);
this.store(this.value(), this.regex());
return false;
diff --git a/dev/scss/main/kwic.scss b/dev/scss/main/kwic.scss
index 5776004..ca646b9 100644
--- a/dev/scss/main/kwic.scss
+++ b/dev/scss/main/kwic.scss
@@ -129,24 +129,6 @@
display: block;
}
-
-
-/*
-#search ol > li:focus:not(.active) {
- background-color: $dark-orange !important;
- &:not(:target) div.flag {
- border-right-color: $nearly-white;
- }
- div.snippet {
- color: $nearly-white;
- text-shadow: none !important;
- .class-3 {
- border-color: $nearly-white;
- }
- }
- }
-*/
-
#search div.match-main {
position: relative;
z-index: 4;
@@ -193,25 +175,21 @@
/**
* Active
*/
-#search > ol {
- > li.active,
- > li:target {
- background-color: $dark-orange;
- display: block;
- text-align: left;
- position: relative;
- border-width: 2px;
- white-space: wrap;
- height: auto;
- width: auto;
+body.no-js #search > ol > li:active,
+#search > ol > li.active,
+#search > ol > li:target {
+ background-color: $dark-orange;
+ display: block;
+ text-align: left;
+ position: relative;
+ border-width: 2px;
+ white-space: wrap;
+ height: auto;
+ width: auto;
- div.match-main > div.match-wrap {
- cursor: default;
- }
+ div.match-main > div.match-wrap {
+ cursor: default;
}
-}
-
-#search > ol > li.active {
span {
display: inline !important;
}
@@ -249,9 +227,7 @@
}
}
}
-}
-#search > ol > li.active {
overflow: hidden;
div.meta {
display: none;