<link rel="stylesheet" type="text/css" href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css" />
<link rel="stylesheet" type="text/css" href="mkws-widget-reference.css" />
<link rel="stylesheet" type="text/css" href="mkws-widget-credo.css" />
-<link rel="stylesheet" type="text/css" href="mkws-widget-ru.css" />
<script type="text/javascript">
var mkws_config = {
+ // target: 'wikimedia_wikipedia_single_result',
sp_auth_credentials: "mkwstest/mkwstest"
};
</script>
<script type="text/javascript" src="src/mkws-popup.js"></script>
<script type="text/javascript" src="mkws-widget-credo.js"></script>
-<script type="text/javascript" src="mkws-widget-ru.js"></script>
<style>
.dialog > textarea {
height: 100%;
}
body {
- background-color: #888892;
+ background-color: #bbbbbb;
margin: 0;
padding: 0;
display: flex;
header {
font-size: 1.3em;
}
-#top-bar {
- background-color: #002868;
- color: white;
- padding: .5em;
- display: flex;
- align-items: center;
- justify-content: space-between;
-}
-header button {
+header button, #note > input {
margin-left: 1em;
border-radius: 4px;
background-color: #4368a1;
font: inherit;
font-weight: normal;
border: 1px solid #7492c3;
- padding: 0.1em 0.15em;
+ padding: 0.15em 0.25em;
}
header button:hover, header button:active, header button:focus {
background-color: #2f5591;
}
+#top-bar, #current-bar, #note {
+ display: flex;
+ flex-wrap: wrap;
+ align-items: center;
+ justify-content: space-between;
+}
+#top-bar {
+ background-color: #002868;
+ color: white;
+}
+#current-bar {
+ background-color: #54d8a8;
+ color: #002868;
+}
+#note {
+ width: 100%;
+ padding: .5em;
+}
+#note > input {
+ flex: 1;
+ background-color: #7de3be;
+ border-color: #7ed6b6;
+ color: #002868;
+}
#maybe {
background-color: #F0AD4E;
border-color: #EEA236;
background-color: #C9302C;
border-color: #AC2925;
}
-#current-bar {
- background-color: #54d8a8;
- color: #002868;
- padding: .5em;
-}
#query {
font-weight: bold;
font-size: 110%;
}
-#settings {
- flex: 1;
+#settings, #judiciary {
+ padding: .5em;
display: flex;
align-items: center;
}
-#results {
- flex: 1;
+#results, #query-info {
+ padding: .5em;
display: flex;
text-align: right;
align-items: center;
justify-content: flex-end;
}
+#count {
+ font-size: 120%;
+}
#test-area {
flex: 1;
+ padding: 2em;
+ display: flex;
+ justify-content: center;
+ overflow: auto;
+}
+#test-subject {
+ margin: auto;
+}
+#results-table {
+ flex: 1;
padding: 1em;
display: flex;
justify-content: center;
- align-items: center;
}
+#results-table table {
+ border-collapse: collapse;
+ border-spacing: 0;
+}
+#results-table td, #results-table th {
+ padding: .25em 1.25em;
+ font-size: .9em;
+}
+#results-table tr:first-child {
+ border-bottom: 1px solid black;
+}
+#results-table tr {
+ border-bottom: 1px dotted black;
+}
+#results-table tr:last-child {
+ border-bottom: none;
+}
+
</style>
</head>
<span id="settings">
Settings:
<button id="widget-markup-button">Widget</button>
+ <button id="mkws-config-button">MKWS config</button>
<button id="queries-button">Queries</button>
</span>
<span id="results">
</header>
<header id="current-bar">
- Relevant to query <span id="query"></span>?
- <button id="yes" class="judgement">Yes</button>
- <button id="no" class="judgement">No</button>
- <button id="maybe" class="judgement">Maybe</button>
+ <span id="judiciary">
+ Relevant to query <span id="query"></span>?
+ <button id="yes" class="judgement">Yes</button>
+ <button id="no" class="judgement">No</button>
+ <button id="maybe" class="judgement">Maybe</button>
+ </span>
+ <span id="query-info">
+ <span id="count"></span>
+ </span>
+ <span id="note">
+ Note: <input type="text"></input>
+ </span>
</header>
<div id="widget-markup" class="dialog" title="Widget markup">
<textarea></textarea>
</div>
+<div id="mkws-config" class="dialog" title="MKWS configuration">
+ <textarea></textarea>
+</div>
<div id="queries" class="dialog" title="Queries">
<textarea></textarea>
</div>
<script>
(function () { // wrapper
// Initial data
-this.queries = ["sushi", "wurst", "berlin", "hammer", "bristol", "copenhagen", "tea", "latte"];
-$("#queries > textarea").html(this.queries.join("\n"));
+this.queries = ["sushi", "wurst", "tea", "latte"];
this.widgetMarkup = '<div class="mkws-reference" autosearch="{{query}}">Loading..</div>';
+if (localStorage.getItem('mkwstest-queries')) {
+ this.queries = JSON.parse(localStorage.getItem('mkwstest-queries'));
+}
+if (localStorage.getItem('mkwstest-widget-markup')) {
+ this.widgetMarkup = localStorage.getItem('mkwstest-widget-markup');
+}
+if (localStorage.getItem('mkwstest-mkws-config')) {
+ mkws_config = JSON.parse(localStorage.getItem('mkwstest-mkws-config'));
+}
+$("#queries > textarea").html(this.queries.join("\n"));
$("#widget-markup > textarea").html(this.widgetMarkup);
+$("#mkws-config > textarea").html(JSON.stringify(mkws_config));
+mkws.setMkwsConfig(mkws_config);
+mkws.authenticated = false;
+mkws.authenticating = false;
this.results = {};
-var next;
+var next = 0;
+if (localStorage.getItem('mkwstest-results')) {
+ this.results = JSON.parse(localStorage.getItem('mkwstest-results'));
+}
+if (localStorage.getItem('mkwstest-next') !== null) {
+ next = parseInt(localStorage.getItem('mkwstest-next'));
+}
+
var context = this;
var showNext = function () {
if (next < this.queries.length) {
+ $('#note > input').val("");
$('#test-subject').html(this.widgetMarkup.replace("{{query}}", this.queries[next]));
$('#query').html('"' + this.queries[next] + '"');
+ localStorage.setItem("mkwstest-next", next);
next++;
+ $('#count').html(next + " / " + this.queries.length);
mkws.init('#test-subject');
+ } else {
+ $("#results-table").dialog("open");
}
}
var startEval = function () {
}
var judge = function (e) {
var query = $('#test-subject > div').attr('autosearch');
- context.results[query] = {judgement: $(this).html()};
+ context.results[query] = {judgement: $(this).html(), note: $("#note > input").val() || ""};
+ localStorage.setItem("mkwstest-results", JSON.stringify(context.results));
showNext();
}
// Markup dialog
var updateMarkup = function () {
context.widgetMarkup = $("#widget-markup > textarea").val();
+ localStorage.setItem("mkwstest-widget-markup", context.widgetMarkup);
startEval();
}
$("#widget-markup-button").click(function () {
{text: "Cancel", click: function() { $(this).dialog("close"); }}
]);
+// MKWS config dialog
+var updateConfig = function () {
+ mkws.setMkwsConfig(JSON.parse($("#mkws-config > textarea").val()));
+ mkws.authenticated = false;
+ mkws.authenticating = false;
+ localStorage.setItem("mkwstest-mkws-config", $("#mkws-config > textarea").val());
+ startEval();
+}
+$("#mkws-config-button").click(function () {
+ $("#mkws-config").dialog("open");
+});
+$("#mkws-config").dialog("option", "buttons", [
+ {text: "Start new evaluation", click: updateConfig},
+ {text: "Cancel", click: function() { $(this).dialog("close"); }}
+]);
+
// Queries dialog
var updateQueries = function () {
context.queries = $("#queries > textarea").val().split("\n");
+ // ignore empty query values
+ context.queries = $.grep(context.queries, function (query, index) { return query.match(/^\s*\S+/) } );
+ localStorage.setItem("mkwstest-queries", JSON.stringify(context.queries));
startEval();
}
$("#queries-button").click(function () {
$("#results-csv").dialog("open");
});
$("#results-table").dialog("option", "open", function () {
- var html = "<tr><th>Query</th><th>Relevant?</th><tr>";
+ var html = "<tr><th>Query</th><th>Relevant?</th><th>Note</th><tr>";
for (var i = 0; i < context.queries.length; i++) {
var q = context.queries[i];
var r = context.results;
if (r[q]) {
- html += "<tr><td>" + q + "</td><td>" + r[q].judgement + "</td></tr>\n";
+ html += "<tr><td>" + q + "</td><td>" + r[q].judgement + "</td><td>" + r[q].note + "</td></tr>\n";
}
}
$("#results-table > table").html(html);
});
$("#results-csv").dialog("option", "open", function () {
- var csv = "Query|Relevant?\n";
+ var csv = "Query|Relevant?|Note\n";
for (var i = 0; i < context.queries.length; i++) {
var q = context.queries[i];
var r = context.results;
if (r[q]) {
- csv += [q, r[q].judgement].join("|") + "\n";
+ csv += [q, r[q].judgement, r[q].note].join("|") + "\n";
}
}
$("#results-csv > textarea").html(csv);
});
$('button.judgement').click(judge);
-startEval();
+showNext();
})();// wrapper
</script>