From 2ab5da4bfdce9f41e93a27082900da6ea72db6ed Mon Sep 17 00:00:00 2001
From: Guillaume Horel <guillaume.horel@gmail.com>
Date: Tue, 29 Jul 2014 18:50:09 -0400
Subject: Webapp now show three columns

image, original text and corrected text. The highlighting is functional
as well.
---
 web/templates/index.html | 31 +++++++++++++++++++++----------
 1 file changed, 21 insertions(+), 10 deletions(-)

(limited to 'web/templates/index.html')

diff --git a/web/templates/index.html b/web/templates/index.html
index b3b5fe0..2ba18c1 100644
--- a/web/templates/index.html
+++ b/web/templates/index.html
@@ -1,14 +1,25 @@
 {% extends "layout.html" %}
 
 {% block main %}
-    <div id="image_container">
-        <img id="page" src="{{page_number}}.jpg" usemap="#wordmap" />
-    </div>
-    <map name="wordmap">{% for id, coords in areas %}
-        <area href="#" shape="rect" coords="{{coords}}" data-id="{{id}}" />{% end %}
-    </map>
-    <div id="text">
-    {% for id, word in words %}
-    <span id="{{id}}">{{word}}</span> {% end %}
-    </div>
+<div id="image_container">
+  <img id="page" src="{{page_number}}.jpg" usemap="#wordmap" />
+</div>
+<map name="wordmap">
+  {% for i, coord in enumerate(orig_coords) %}
+  <area href="#" shape="rect" coords="{{coord}}" data-id="{{i}}" />
+  {% end %}
+</map>
+
+<div id="texte-non-corrige">
+  <h3>Texte original</h3>
+  {% for i, word in enumerate(orig_words) %}
+  <span id="orig-{{i}}">{{word}}</span>
+  {% end %}
+</div>
+<div id="texte-corrige">
+  <h3>Texte corrigé</h3>
+  {% for i, word in enumerate(corr_words) %}
+  <span id="corr-{{corr_coords_index[i]}}">{{word}}</span>
+  {% end %}
+</div>
 {% end %}
-- 
cgit v1.2.3-70-g09d2