w2v-server: build collocator table on the client side
diff --git a/templates/index.html.ep b/templates/index.html.ep
index 9e78ea6..cdca76b 100644
--- a/templates/index.html.ep
+++ b/templates/index.html.ep
@@ -7,6 +7,7 @@
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src = "https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<script src = "https://cdn.datatables.net/fixedcolumns/3.2.3/js/dataTables.fixedColumns.min.js"></script>
+ <script src = "https://cdn.datatables.net/plug-ins/1.10.16/sorting/scientific.js"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css">
<script
src="http://code.jquery.com/ui/1.12.1/jquery-ui.min.js"
@@ -48,32 +49,54 @@
]
} );
- var t = $('#secondtable').DataTable({
- "sScrollY": "800px",
- "bScrollCollapse": true,
- "bPaginate": false,
- "bJQueryUI": true,
- "dom": '<"top">rt<"bottom"flp><"clear">',
- "columnDefs": [
- { "searchable": false,
- "orderable": false,
- "targets": 0
- },
- { "orderSequence": [ "desc" ], "targets": [ 2, 3, 4, 5, 6 ] },
- { "orderSequence": [ "asc", "desc" ], "targets": [ 1, 7 ] },
- ],
- "order": [[ 4, 'desc' ]],
- } );
- t.on( 'order.dt search.dt', function () {
- t.column(0, {order:'applied'}).nodes().each( function (cell, i) {
- cell.innerHTML = i+1;
+ function bitvec2window(n) {
+ var str = n.toString(2).padStart(10, "0")
+ .replace(/^([0-9]{5})/, '$1x')
+ .replace(/0/g, '·')
+ .replace(/1/g, '+');
+ return str;
+ }
+
+ var collocatorData = <%= b(Mojo::JSON::to_json($collocators)) %>;
+
+ if (collocatorData != null) {
+ var t = $('#secondtable').DataTable({
+ data: collocatorData,
+ "sScrollY": "800px",
+ "bScrollCollapse": true,
+ "bPaginate": false,
+ "bJQueryUI": true,
+ "dom": '<"top">rt<"bottom"flp><"clear">',
+ "columns": [
+ { "data": "rank", type: "allnumeric" },
+ { "data": "pos", width: "7%", sClass: "dt-center mono compact", render: function ( data, type, row ) {return bitvec2window(data) }},
+ { "data": "max", render: function ( data, type, row ) {return data.toFixed(3) }},
+ { "data": "conorm", render: function ( data, type, row ) {return data.toFixed(3) }},
+ { "data": "prob", type: "scientific", render: function ( data, type, row ) {return data.toExponential(3) } },
+ { "data": "cprob", type: "scientific", render: function ( data, type, row ) {return data.toExponential(3) } },
+ { "data": "overall", type: "scientific", render: function ( data, type, row ) {return data.toExponential(3) } },
+ { "data": "word", sClass: "collocator" }
+ ],
+ "columnDefs": [
+ { className: "dt-right", "targets": [0,2,3,4,5,6] },
+ { className: "dt-center", "targets": [ 1] },
+ { "searchable": false,
+ "orderable": false,
+ "targets": 0
+ },
+ { "type": "scientific", targets: [2,3,4,5,6] },
+ { "orderSequence": [ "desc" ], "targets": [ 2, 3, 4, 5, 6 ] },
+ { "orderSequence": [ "asc", "desc" ], "targets": [ 1, 7 ] },
+ ],
+ "order": [[ 4, 'desc' ]],
} );
- } ).draw();
-
+ t.on( 'order.dt search.dt', function () {
+ t.column(0, {order:'applied'}).nodes().each( function (cell, i) {
+ cell.innerHTML = i+1;
+ } );
+ } ).draw();
+ }
});
-
-
-
$(function(){
$("#dropdownoptions").dialog({
title: "Options",
@@ -101,6 +124,12 @@
});
$(function(){
+ $("td.collocator").click(function(){
+ queryKorAPCII(this.textContent + " /w5 <%= $word %>");
+ });
+ });
+
+ $(function(){
$("#showoptions").click(function(){
$("#dropdownoptions").dialog("open");
var target = $(this);
@@ -733,7 +762,7 @@
<tr>
% if($collocators) {
<th>#</th>
- <th align="right" title="The columns (c) around the target are considered for summation are marked with *.">w'</th>
+ <th align="center" title="The columns (c) around the target are considered for summation are marked with *.">w'</th>
<th align="right" title="Raw (max.) activation of the collocator in the output layers.">max(a)</th>
<th title="Co-normalized raw activation sum of the collocator in the selected columns." align="right">⊥Σa</th>
<th title="Sum of activations over the selected colunns normalized by the total activation sum of the selected columns." align="right">Σa/Σc</th>
@@ -744,42 +773,24 @@
</tr>
</thead>
<tbody>
- % for(my $i=0; $i < (@$collocators); $i++) {
- % my $c = ($collocators? (@$collocators)[$i] : 0);
- <tr>
+ <tr>
+ <td align="right">
+ </td>
<td align="right">
- <%= $i %>
</td>
- % if($c) {
- <td align="right">
- <span class="mono"><%= bitvec2window( $c->{pos} ) %></span>
- </td>
- <td align="right">
- <%= sprintf("%.3f", $c->{max}) %>
- </td>
- <td align="right">
- <%= sprintf("%.3e", $c->{conorm}) %>
- </td>
- <td align="right">
- <%= sprintf("%.3e", $c->{prob}) %>
- </td>
- <td align="right">
- <%= sprintf("%.3e", $c->{cprob}) %>
- </td>
- <td align="right">
- <%= sprintf("%.3e", $c->{overall}) %>
- </td>
- <td align="left">
- <a onclick="<%= sprintf("queryKorAPCII('%s /w5 %s')", $c->{word}, $word) =%>"
- title="freq. rank: <%= $c->{rank} =%>">
- <%= $c->{word} %>
- </a>
- </td>
- % } else {
- <td colspan="5"/>
- % }
- </tr>
- % }
+ <td align="right">
+ </td>
+ <td align="right">
+ </td>
+ <td align="right">
+ </td>
+ <td align="right">
+ </td>
+ <td align="right">
+ </td>
+ <td align="left">
+ </td>
+ </tr>
</tbody>
</table>
</div> <!-- - tab2 -->