Support setting query form values via plugins
Change-Id: I75de9d725ab8be72acd03c5f84ac68355a0c45a1
diff --git a/dev/demo/plugin-client.html b/dev/demo/plugin-client.html
index 7935347..530682c 100644
--- a/dev/demo/plugin-client.html
+++ b/dev/demo/plugin-client.html
@@ -77,7 +77,6 @@
KorAPlugin.log(0, d.value.search);
});
}
-
</script>
<ul>
@@ -89,6 +88,7 @@
<li><a onclick="flood()">Flood!</a></li>
<li><a onclick="KorAPlugin.requestMsg({'action':'get', 'key':'KQ'}, function (d) { document.write(JSON.stringify(d.value))})">Get KQ</a></li>
<li><a onclick="KorAPlugin.requestMsg({'action':'get', 'key':'textSigle', 'value':'textSigle'}, function (d) { document.write(JSON.stringify(d.value))})">Get textSigle</a></li>
+ <li><a onclick="KorAPlugin.sendMsg({'action':'set', 'key':'QueryForm', 'value':{'q':'[This][is][a][query]'}})">Set query</a></li>
</ul>
<p style="width: 2000px">------------------------------------------------------------------------------------------------------------------------</p>
</body>
diff --git a/dev/demo/plugin-server.html b/dev/demo/plugin-server.html
index 98cbac0..6a1e12f 100644
--- a/dev/demo/plugin-server.html
+++ b/dev/demo/plugin-server.html
@@ -18,7 +18,45 @@
<p>Start the demo server with <code>morbo -l 'http://*:3003' t/server/plugin.pl</code> and open <a href="http://localhost:3003/demo/plugin-server.html"><code>this website</code></a>.</p>
<header>
- <form id="searchform" autocomplete="off" action="/kalamar"></form>
+ <form autocomplete="off" action="/kalamar" id="searchform">
+ <div id="searchbar">
+ <input type="search"
+ placeholder="Find ..."
+ name="q"
+ id="q-field"
+ value="abcdefghijklmnopqrstuvwxyz"
+ autofocus="autofocus" />
+ <button id="qsubmit" type="submit"><span>Go</span></button>
+ <!-- <i class="fa fa-arrow-circle-down show-hint" onclick="hint.popUp()"></i> -->
+ </div>
+
+ <!-- Search in the following virtual corpus -->
+ <div id="vc-view"></div>
+ in
+ <input id="show" name="show" type="hidden" />
+ <!--<input id="collection-name" name="collection-name" type="hidden"> -->
+ <input id="cq" name="cq" type="text" value="">
+ with <span class="menu select">
+ <select name="ql" id="ql-field">
+ <option value="poliqarp">Poliqarp</option>
+ <option value="cosmas2">Cosmas II</option>
+ <option value="annis">Annis</option>
+ <option value="cql">CQL v1.2</option>
+ </select>
+ </span>
+ <div class="button right">
+ <input type="checkbox"
+ value="1"
+ name="cutoff"
+ class="checkbox"
+ id="q-cutoff-field" />
+ <label for="q-cutoff-field"><span id="glimpse"></span>Glimpse</label>
+
+ <!-- Todo: open tutorial - like openTutorial() -->
+ <a href="doc/faq" tabindex="-1" class="question"><span>Question</span></a>
+ <a href="tutorial.html" title="Tutorial" class="tutorial" id="view-tutorial"><span>Tutorial</span></a>
+ </div>
+ </form>
</header>
<main>
diff --git a/dev/js/src/plugin/server.js b/dev/js/src/plugin/server.js
index c99f695..b47e75c 100644
--- a/dev/js/src/plugin/server.js
+++ b/dev/js/src/plugin/server.js
@@ -13,6 +13,8 @@
KorAP.Panel = KorAP.Panel || {};
+ const d = document;
+
// State manager undefined
const states = KorAP.States ? KorAP.States :
@@ -69,6 +71,10 @@
* Initialize the plugin manager
*/
_init : function () {
+ this._ql = d.getElementById("ql-field");
+ this._q = d.getElementById("q-field")
+ this._cutoff = d.getElementById("q-cutoff-field");
+
return this;
},
@@ -548,6 +554,33 @@
break;
+ case 'set':
+
+ // Get Query information from form
+ if (d.key == 'QueryForm') {
+ let v = d["value"];
+ if (v["q"] != undefined && this._q) {
+ this._q.value = v["q"];
+ };
+
+ // Set query language field
+ // Identical to tutorial.js
+ if (v[ql] != undefined && KorAP.QLmenu) {
+ KorAP.QLmenu.selectValue(ql);
+ }
+
+ else if (this._ql) {
+ let found = Array.from(this._ql.options).find(o => o.value === ql);
+ if (found)
+ found.selected = true;
+ };
+
+ window.scrollTo(0, 0);
+ // if (v["cq"] != undefined) {};
+ }
+
+ break;
+
// Redirect to a different page relative to the current
case 'redirect':
const url = new URL(window.location);