diff options
| -rw-r--r-- | footer.php | 9 | ||||
| -rw-r--r-- | header.php | 10 | ||||
| -rw-r--r-- | index.php | 82 | ||||
| -rw-r--r-- | interface.php | 89 | ||||
| -rw-r--r-- | lfpe.css | 21 | ||||
| -rw-r--r-- | lfpe.js | 6 |
6 files changed, 135 insertions, 82 deletions
diff --git a/footer.php b/footer.php new file mode 100644 index 0000000..32fd415 --- /dev/null +++ b/footer.php @@ -0,0 +1,9 @@ +<!-- Footer --> +<p id="footer"> + ©2015 Heidelberg University/Institute for Computational Linguistics +</p> +<!-- /Footer --> + +</div> +<!-- /Wrapper --> + diff --git a/header.php b/header.php new file mode 100644 index 0000000..d7b84eb --- /dev/null +++ b/header.php @@ -0,0 +1,10 @@ +<!-- Wrapper --> +<div id="wrapper"> + +<!-- Header --> +<div id="header"> + <img id="uni" src="img/logo_neu_204x107.jpg" /> + <img id="cl" src="img/institut_cl.png" /> +</div> +<!-- /Header --> + @@ -1,88 +1,22 @@ <html> <head> <meta charset="utf-8" /> - <title>Post-editing application (key: <?php echo $_GET["key"]; ?></title> + <title>Post-editing application</title> <script src="lfpe.js"></script> <link rel="stylesheet" type="text/css" href="lfpe.css" /> </head> -<body onload="init()"> +<body onload=""> -<!-- Wrapper --> -<div id="wrapper"> +<?php include("header.php"); ?> -<!-- Header --> -<div id="header"> - <img id="uni" src="img/logo_neu_204x107.jpg" /> - <img id="cl" src="img/institut_cl.png" /> -</div> -<!-- /Header --> +<form method="get" action="interface.php"> + Please enter your session key: <input type="text" name="key" /> +<input type="submit" value="Submit" /> +</form> -<!-- Source and target --> -<table> -<tr> - <td align="right">Source:</td> - <td><textarea id="raw_source_textarea" name="source" cols="80" rows="1" disabled></textarea></td> -</tr> -<tr> - <td align="right">Target:</td> - <td><textarea id="target_textarea" name="target" cols="80" rows="1" onkeypress="catch_return(event)"></textarea></td> -</tr> -</table> -<!-- /Source and target --> +<?php include("footer.php"); ?> -<!-- Next button --> -<div> - <button id="pause_button" type="button" onclick="pause()">Pause</button> - <button id="next" type="button" onclick="Next()">Start/Continue</button> - <span id="status"><strong>Working</strong> <img src="img/ajax-loader-large.gif" width="20px" /></span> -</div> -<!-- /Next button --> - -<!-- Document overview --> -<div> -<strong>Document overview</strong> -<table id="overview"> -<?php -$j = file_get_contents($_GET["dir"]."/".$_GET["key"].".json"); # FIXME: get overview/state from database -$a = json_decode($j); -$i = 0; -foreach($a->raw_source_segments as $s) { - if ($i <= $a->progress) { - echo "<tr id='seg_".$i."'><td>".($i+1).".</td><td>".$s."</td><td class='seg_text' id='seg_".$i."_t'>".$a->post_edits_raw[$i]."</td></tr>"; - } else { - echo "<tr id='seg_".$i."'><td>".($i+1).".</td><td>".$s."</td><td class='seg_text' id='seg_".$i."_t'></td></tr>"; - } - $i += 1; -} -?> -</table> -</div> -<!-- /Document overview --> - -<!-- Help --> -<p id="help"> -<strong>Help</strong><br /> -Press the 'Next' to submit your post-edit and to request the next segment to translate -(or just press enter when the 'Target' textarea is in focus). -</p> -<!-- /Help --> - -<!-- Footer --> -<p id="footer"> - ©2015 Heidelberg University/Institute for Computational Linguistics -</p> -<!-- /Footer --> - -</div> -<!-- /Wrapper --> - -<!-- Data --> -<textarea style="display:none" id="key"><?php echo $_GET['key']; ?></textarea> -<textarea style="display:none" id="source"></textarea> -<textarea style="display:none" id="current_seg_id">0</textarea> -<textarea style="display:none" id="paused">0</textarea> -<!-- /Data --> </body> </html> diff --git a/interface.php b/interface.php new file mode 100644 index 0000000..3505eda --- /dev/null +++ b/interface.php @@ -0,0 +1,89 @@ +<html> +<head> + <meta charset="utf-8" /> + <title>Post-editing application (key: <?php echo $_GET["key"]; ?></title> + <script src="lfpe.js"></script> + <link rel="stylesheet" type="text/css" href="lfpe.css" /> +</head> + +<body onload="init()"> + +<!-- Wrapper --> +<div id="wrapper"> + +<!-- Header --> +<div id="header"> + <img id="uni" src="img/logo_neu_204x107.jpg" /> + <img id="cl" src="img/institut_cl.png" /> +</div> +<!-- /Header --> + +<!-- Source and target --> +<table> +<tr> + <td align="right">Source:</td> + <td><textarea id="raw_source_textarea" name="source" cols="80" rows="1" disabled></textarea></td> +</tr> +<tr> + <td align="right">Target:</td> + <td><textarea id="target_textarea" name="target" cols="80" rows="1" onkeypress="catch_return(event)"></textarea></td> +</tr> +</table> +<!-- /Source and target --> + +<!-- Next button --> +<div> + <button id="pause_button" type="button" onclick="pause()">Pause</button> + <button id="next" type="button" onclick="Next()">Start/Continue</button> + <span id="status"><strong>Working</strong> <img src="img/ajax-loader-large.gif" width="20px" /></span> +</div> +<!-- /Next button --> + +<!-- Document overview --> +<div> +<strong>Document overview</strong> +<table id="overview"> +<?php +$j = file_get_contents($_GET["dir"]."/".$_GET["key"].".json"); # FIXME: get overview/state from database +$a = json_decode($j); +$i = 0; +foreach($a->raw_source_segments as $s) { + if ($i <= $a->progress) { + echo "<tr id='seg_".$i."'><td>".($i+1).".</td><td>".$s."</td><td class='seg_text' id='seg_".$i."_t'>".$a->post_edits_raw[$i]."</td></tr>"; + } else { + echo "<tr id='seg_".$i."'><td>".($i+1).".</td><td>".$s."</td><td class='seg_text' id='seg_".$i."_t'></td></tr>"; + } + $i += 1; +} +?> +</table> +</div> +<!-- /Document overview --> + +<!-- Help --> +<p id="help"> +<strong>Help</strong><br /> +Press the 'Next' to submit your post-edit and to request the next segment to translate +(or just press enter when the 'Target' textarea is in focus). +</p> +<!-- /Help --> + +<!-- Footer --> +<p id="footer"> + ©2015 Heidelberg University/Institute for Computational Linguistics +</p> +<!-- /Footer --> + +</div> +<!-- /Wrapper --> + +<!-- Data --> +<textarea style="display:none" id="key"><?php echo $_GET['key']; ?></textarea> +<textarea style="display:none" id="source"></textarea> +<textarea style="display:none" id="current_seg_id">0</textarea> +<textarea style="display:none" id="paused">0</textarea> +<!-- /Data --> + +</body> +</html> + @@ -4,8 +4,8 @@ html { } textarea { - font-size: 20px; - width: 100% + font-size: 2em; + width: 100% } button { @@ -16,6 +16,8 @@ button { } .bold { font-weight:bold } +.small { font-size:.8em } +.xtrasmall { font-size:.6em } div#wrapper { margin: 2em; @@ -29,7 +31,8 @@ span#status { } /* Document overview */ -table#overview { font-size:80% } +div#overview_wrapper { margin-top:1em } +table#overview { font-size:.8em } table#overview td.seg_text { width: 45% } table#overview td { border-bottom: 1px solid #000 } /* /Document overview */ @@ -44,7 +47,10 @@ p#footer { } /* Header */ -div#header { margin-bottom: 2em } +div#header { + margin-bottom: 2em; + text-align:right +} img#uni {} img#cl { margin-bottom:20px; @@ -54,12 +60,15 @@ img#cl { /* /Header */ /* Help */ -p#help { +div#help { + margin-top: 2em; font-size: .8em; width: 40%; color: #ccc; text-align: justify } -p#help:hover { color: #000 } +div#help a { color:#ccc } +div#help:hover { color: #000 } +div#help:hover a { color: #000 } /* /Help */ @@ -5,6 +5,7 @@ function init() document.getElementById("source").value = ""; document.getElementById("current_seg_id").value = ""; document.getElementById("paused").value = ""; + document.getElementById("next").removeAttribute("disabled"); return false; } @@ -61,7 +62,8 @@ function Next() button.setAttribute("disabled", "disabled"); target_textarea.setAttribute("disabled", "disabled"); - var base_url = "http://coltrane.cl.uni-heidelberg.de:60666"; // FIXME: variable + var port = document.getElementById("port").value; + var base_url = "http://coltrane.cl.uni-heidelberg.de:"+port; var key = document.getElementById("key").value; next_url = base_url+"/next?key="+key; @@ -140,7 +142,7 @@ function Next() source.value = src; // confirm to server - var xhr_confirm = CreateCORSRequest('get', "http://coltrane.cl.uni-heidelberg.de:60666/confirm"); + var xhr_confirm = CreateCORSRequest('get', base_url+"/confirm"); xhr_confirm.send(); // FIXME: handle errors } }; |