From 50fcce8314c07dc13d65da47c8fc6fdd16491495 Mon Sep 17 00:00:00 2001
From: Patrick Simianer <p@simianer.de>
Date: Fri, 30 Oct 2015 18:50:51 +0100
Subject: better OOV handling

---
 index.php       |  1 +
 interface.php   |  8 +++++---
 js/lfpe.js      | 20 ++++++++++++++++++--
 server.rb       |  5 +++++
 static/main.css |  5 +++++
 5 files changed, 34 insertions(+), 5 deletions(-)

diff --git a/index.php b/index.php
index 30d8993..1123b02 100644
--- a/index.php
+++ b/index.php
@@ -25,6 +25,7 @@
 <p>Beta test:
 <select class="small">
   <option value="beta_test_A" onclick="document.getElementById('key').value=this.value;">A</option>
+  <option value="product/de-en/beta/A" onclick="document.getElementById('key').value=this.value;">A [new]</option>
   <option value="beta_test_A_nolearn" onclick="document.getElementById('key').value=this.value;">A (no learning)</option>
   <option value="beta_test_A_nomt" onclick="document.getElementById('key').value=this.value;">A (no MT)</option>
   <option value="beta_test_A_sparse" onclick="document.getElementById('key').value=this.value;">A (sparse)</option>
diff --git a/interface.php b/interface.php
index c0348bf..71d40fe 100644
--- a/interface.php
+++ b/interface.php
@@ -39,10 +39,11 @@
   </table>
 </div>
 <div id="oov_form">
-  <p class="small" style="margin-bottom:0"><strong>Unknown words:</strong><br />
-  Please enter a translation for each source word, then click 'Next' or press return.<br />
-<span class="small">Note that the source word may be distorted.</span>
+  <p style="margin-bottom:0"><strong>Unknown words</strong><br />
+  <span class="small">Please enter a translation for each source word, then click 'Next' or press return.<br />
+Note that the source word may be distorted.</span>
 </p>
+<p><span style="text-decoration:underline;font-size:0.8em">Context:</span> <span id="oov_context"></span></p>
   <div id="oov_fields"></div>
 </div>
 <!-- /Source and target textboxes -->
@@ -108,6 +109,7 @@ foreach($db->raw_source_segments as $s) {
 <textarea style="display:none" id="current_seg_id">0</textarea>
 <textarea style="display:none" id="paused">0</textarea>
 <textarea style="display:none" id="oov_correct">0</textarea>
+<textarea style="display:none" id="oov_num_items">0</textarea>
 <textarea style="display:none" id="displayed_oov_hint">0</textarea>
 <textarea style="display:none" id="port"><?php echo $db->port; ?></textarea>
 <textarea style="display:none" id="init">0</textarea>
diff --git a/js/lfpe.js b/js/lfpe.js
index a626f1d..28a5d97 100644
--- a/js/lfpe.js
+++ b/js/lfpe.js
@@ -174,10 +174,10 @@ function Next()
       document.getElementById("seg_"+(current_seg_id.value)+"_t").innerHTML=post_edit;
   // OOV correction mode
   } else if (oov_correct.value=="true") {
-     var l = document.getElementById("oov_fields").children.length;
+     var l = document.getElementById("oov_num_items").value;
      var src = [];
      var tgt = [];
-     for (var i=0; i<l/2; i++) {
+     for (var i=0; i<l; i++) {
        src.push(trim(document.getElementById("oov_src"+i).value));
        tgt.push(trim(document.getElementById("oov_tgt"+i).value));
        if (tgt[tgt.length-1] == "") { // empty correction
@@ -252,6 +252,13 @@ function Next()
     // enter OOV correct mode
     } else if (data["oovs"]) {
       var append_to = document.getElementById("oov_fields");
+      document.getElementById("oov_num_items").value = data["oovs"].length;
+      if ($("#ui_type").val() == "t") {
+        $("#textboxes").fadeTo(200,0.1);
+      } else {
+        $("#derivation_editor").fadeTo(200,0.1);
+      }
+      $("#oov_context").html(data["raw_source"].replace(/\*\*\*/g,"<strong>").replace(/###/g,"</strong>"));
       for (var i=0; i<data["oovs"].length; i++) {
         var node_src = document.createElement("input");
         var node_tgt = document.createElement("input");
@@ -263,7 +270,10 @@ function Next()
         node_src.setAttribute("disabled", "disabled");
         append_to.appendChild(node_src);
         append_to.appendChild(node_tgt);
+        append_to.appendChild(document.createElement("br"));
+        $("#oov_src"+i).attr({width: 'auto', size: $("#oov_src"+i).val().length});
         node_tgt.onkeypress = function (event) {
+          $(this).attr({width: 'auto', size: 5+$(this).val().length});
           catch_return(event);
         }
       }
@@ -277,6 +287,12 @@ function Next()
 
     // translation mode
     } else {
+      if ($("#ui_type").val() == "t") {
+        $("#textboxes").fadeTo(200,1);
+      } else {
+        $("#derivation_editor").fadeTo(200,1);
+      }
+
       var id          = data["progress"];
       var src         = data["source"];
       var translation = data["transl_detok"];
diff --git a/server.rb b/server.rb
index 0b39c1d..81816cd 100755
--- a/server.rb
+++ b/server.rb
@@ -271,6 +271,11 @@ get '/next' do      # (receive post-edit, update models), send next translation
       obj = Hash.new
       obj["oovs"] = oovs
       obj["progress"] = $db['progress']
+      raw_source_annot = "#{raw_source}"
+      oovs.each { |o|
+        raw_source_annot.gsub! "#{o}", "***#{o}###"
+      }
+      obj["raw_source"] = raw_source_annot
       $last_reply = obj.to_json
       logmsg :server, "OOV reply: '#{$last_reply}'"
       $lock = false
diff --git a/static/main.css b/static/main.css
index 2f4fc6a..642666c 100644
--- a/static/main.css
+++ b/static/main.css
@@ -15,6 +15,11 @@ textarea {
   -webkit-transition: all .5s; /* Safari */
 }
 
+textarea, input {
+  transition: all .5s;
+  -webkit-transition: all .5s; /* Safari */
+}
+
 button {
   margin:     1em;
   padding:    .25em;
-- 
cgit v1.2.3