better 2-way highlighting, still not perfect

4 files changed, 13 insertions, 10 deletions

diff --git a/web/main.py b/web/main.py
index b5174d8..a6826c1 100644
--- a/web/main.py
+++ b/web/main.py
@@ -9,9 +9,10 @@ import io
 class MainHandler(RequestHandler):
 
     def get(self, page_number):
-        orig_coords, orig_words, corr_coords_index, corr_words = utils.gen_html(self.settings["book"], page_number)
-        self.render("index.html", page_number=page_number,
-                    orig_coords=orig_coords, orig_words=orig_words, corr_words=corr_words, corr_coords_index=corr_coords_index)
+        orig_coords, orig_words, corr_words, align = \
+            utils.gen_html(self.settings["book"], page_number)
+        self.render("index.html", page_number=page_number, orig_coords=orig_coords,
+                    orig_words=orig_words, corr_words=corr_words, align=align)
 
 class ImageHandler(RequestHandler):
 
diff --git a/web/static/js/main.js b/web/static/js/main.js
index 2adf3ea..c790e34 100644
--- a/web/static/js/main.js
+++ b/web/static/js/main.js
@@ -1,6 +1,6 @@
 $(document).ready(function() {
     $('#page').mapster({
-        mapKey: 'data-id',
+        mapKey: 'data-orig',
         fillColor: 'ff0000',
         fillOpacity: 0.3,
         onMouseover: function (e) {
@@ -15,7 +15,9 @@ $(document).ready(function() {
     }).mapster('resize', 500);
 
     $("span").mouseenter(function() {
-        $('area[data-id='+$(this).attr("id").replace(/\D+/,"")+']').mapster("highlight");
+        $(this).attr("id").replace(/\D+/,"").split(",").map(function(e){
+            $('area[data-orig='+e+']').mapster("highlight");
+        })
     });
 
     $("span").mouseout(function() {
diff --git a/web/templates/index.html b/web/templates/index.html
index 2ba18c1..0a07be1 100644
--- a/web/templates/index.html
+++ b/web/templates/index.html
@@ -6,7 +6,8 @@
 </div>
 <map name="wordmap">
   {% for i, coord in enumerate(orig_coords) %}
-  <area href="#" shape="rect" coords="{{coord}}" data-id="{{i}}" />
+  <area href="#" shape="rect" coords="{{coord}}" data-orig="{{i}}" />
+        {# data-corr="{{",".join(map(str,corr_coords_index[i]))}}" #}
   {% end %}
 </map>
 
@@ -19,7 +20,7 @@
 <div id="texte-corrige">
   <h3>Texte corrigé</h3>
   {% for i, word in enumerate(corr_words) %}
-  <span id="corr-{{corr_coords_index[i]}}">{{word}}</span>
+  <span id="corr-{{",".join(map(str,align[i]))}}">{{word}}</span>
   {% end %}
 </div>
 {% end %}
diff --git a/web/utils.py b/web/utils.py
index 71a5048..7e20858 100644
--- a/web/utils.py
+++ b/web/utils.py
@@ -12,10 +12,9 @@ def gen_html(book, page_number):
     if d:
         orig_words, orig_coords = zip(*d)
         C = su.align(corrected_words, list(orig_words), list(orig_coords))
-        r = su.alignment_to_coord(corrected_text.split(), C[1])
-        corr_words, corr_coords_index = zip(*r)
+        corr_words = corrected_text.split()
         orig_coords_html = du.convert_to_htmlcoord(orig_coords, page.size[1])
-    return orig_coords_html, orig_words, corr_coords_index, corr_words
+    return orig_coords_html, orig_words, corr_words, C[1]
 
 if __name__ == "__main__":
     gen_html(*sys.argv[1:3])