new concordia cat

This commit is contained in:
Rafał Jaworski 2017-02-22 10:29:15 +01:00
parent 41f96c5ad9
commit dff6e2f15c
4 changed files with 114 additions and 46 deletions

View File

@ -2,7 +2,8 @@
$url = 'http://@concordia_host@:@concordia_port@'; $url = 'http://@concordia_host@:@concordia_port@';
$inputSentence = $_GET["pattern"]; $inputSentence = $_GET["pattern"];
$data = array("operation" => "concordiaSearch","tmId" => intval($_GET["tmId"]),"pattern" => $inputSentence); $tmId = intval($_GET["tmId"]);
$data = array("operation" => "concordiaSearch","tmId" => $tmId,"pattern" => $inputSentence);
// use key 'http' even if you send the request to https://... // use key 'http' even if you send the request to https://...
$options = array( $options = array(
@ -16,46 +17,104 @@ $context = stream_context_create($options);
$response = file_get_contents($url, false, $context); $response = file_get_contents($url, false, $context);
$data = json_decode($response); $data = json_decode($response);
function sub($string, $start, $end = null) {
if (is_null($end)) {
return mb_substr($string, $start, null, 'UTF-8');
} else {
return mb_substr($string, $start, $end-$start, 'UTF-8');
}
}
?> ?>
<html> <html>
<head> <head>
<script src="js/jquery-1.11.3.min.js"></script> <script src="js/jquery-1.11.3.min.js"></script>
<script src="js/cat.js"></script> <script src="js/cat.js"></script>
<link rel="stylesheet" href="css/iatagger.css" /> <link rel="stylesheet" href="css/concordia_cat.css" />
<meta charset="UTF-8"> <meta charset="UTF-8">
</head> </head>
<body> <body>
<script>
var concordiaUrl = 'http://@concordia_host@:@concordia_port@';
var currentTmId = <?= $tmId ?>;
var disablePhraseSearch = true;
$(document).ready(function() {
$('#search-input').bind("enterKey",function(e){
searchHandle(currentTmId);
});
$('#search-input').keyup(function(e){
if(e.keyCode == 13) {
$(this).trigger("enterKey");
}
});
});
</script>
<div id="header"> <div id="header">
</div> </div>
<div id="content"> <div id="content">
<input id="search-input" type="text" value="<?= $inputSentence ?>" />
<img id="search-icon" src="images/search.png" alt="search" onclick="searchHandle(currentTmId)" title="search"/>
<img id="clear-icon" src="images/reset.png" alt="clear" onclick="$('#search-input').val('')" title="clear search field"/>
<div id="result"> <div id="result">
<div id="result-score">Concordia score: <b><?= round($data->result->bestOverlayScore*100) ?>%</b></div> <div id="result-score">Concordia score: <b><?= round($data->result->bestOverlayScore*100) ?>%</b></div>
<?php <div id="result-sentence"><?php
$markedSentence = ""; $lastInsertedEnd = 0;
$fragments = array();
$lastInsertedEnd = 0;
for($i=0; $i<count($data->result->bestOverlay);$i++) { for($i=0; $i<count($data->result->bestOverlay);$i++) {
$fragment = $data->result->bestOverlay[i]; $fragment = $data->result->bestOverlay[$i];
//previous unmarked fragment //previous unmarked fragment
$markedSentence += substr($inputSentence,$lastInsertedEnd, $fragment->matchedPatternStart - $lastInsertedEnd); echo sub($inputSentence,$lastInsertedEnd, $fragment->matchedPatternStart);
//the marked fragment
//the marked fragment ?><span onclick="displayDetails(this, <?= $i ?>)" class="matchedFragment"><?= sub($inputSentence,$fragment->matchedPatternStart, $fragment->matchedPatternEnd) ?></span><?php
$markedSentence += '<span onclick="displayDetails(this, '+i+')" class="matchedFragment">'+substr($inputSentence,$fragment->matchedPatternStart, $fragment->matchedPatternEnd - $fragment->matchedPatternStart)+'</span>'; $lastInsertedEnd = $fragment->matchedPatternEnd;
//fragments += renderFragment(fragment, i);
$lastInsertedEnd = $fragment->matchedPatternEnd; }
//remaining unmarked fragment
//fragments += renderFragment(fragment, i); echo sub($inputSentence, $lastInsertedEnd);
?></div>
}
//remaining unmarked fragment
$markedSentence += substr($inputSentence, $lastInsertedEnd);
?>
<div id="result-sentence"><?=$inputSentence ?><?=$markedSentence ?></div>
<br/><br/><br/> <br/><br/><br/>
<?php
$i=0;
foreach ($data->result->bestOverlay as $fragment) {
?>
<div style="display:none" id="fragment<?= $i ?>" class="fragmentDetails">
<table>
<tr>
<td><!-- source segment --->
<?= sub($fragment->sourceSegment, 0, $fragment->matchedExampleStart) ?>
<span class="matchedFragment"><?= sub($fragment->sourceSegment, $fragment->matchedExampleStart, $fragment->matchedExampleEnd) ?></span>
<?= sub($fragment->sourceSegment, $fragment->matchedExampleEnd)?>
</td>
</tr>
<tr>
<td>
<?php
$currStart = 0;
foreach ($fragment->targetFragments as $targetFragment) {
?>
<?= sub($fragment->targetSegment, $currStart, $targetFragment[0]); ?>
<span class="matchedFragment"><?= sub($fragment->targetSegment, $targetFragment[0], $targetFragment[1]); ?></span>
<?php
$currStart = $targetFragment[1];
}
echo sub($fragment->targetSegment, $currStart);
?>
</td>
</tr>
</table>
<?php
$i++;
?>
</div>
<?php
}
?>
</div> </div>
</div> </div>
</body> </body>

View File

@ -56,6 +56,10 @@
cursor:pointer; cursor:pointer;
} }
#clear-icon {
cursor:pointer;
}
#help-icon { #help-icon {
margin-left:20px; margin-left:20px;
@ -122,7 +126,7 @@
border-style: solid; border-style: solid;
border-width: 5px; border-width: 5px;
border-color:#19424F; border-color:#19424F;
border-radius: 10px; border-radius: 10px;
} }
.fragmentDetails table { .fragmentDetails table {
@ -173,9 +177,9 @@
#result-sentence { #result-sentence {
text-align:center; text-align:left;
font-size:24px; font-size:16px;
white-space:pre; line-height: 40px;
} }
/** General Style Info **/ /** General Style Info **/
@ -432,7 +436,7 @@ td.selected .choice-available {
.help-section { .help-section {
margin-top:20px; margin-top:20px;
margin-bottom:20px; margin-bottom:20px;
} }
.suggestion-count-box { .suggestion-count-box {

View File

@ -2,7 +2,7 @@
<head> <head>
<script src="../js/jquery-1.11.3.min.js"></script> <script src="../js/jquery-1.11.3.min.js"></script>
<script src="../js/cat.js"></script> <script src="../js/cat.js"></script>
<link rel="stylesheet" href="../css/iatagger.css" /> <link rel="stylesheet" href="../css/concordia_cat.css" />
<meta charset="UTF-8"> <meta charset="UTF-8">
</head> </head>
<body> <body>
@ -43,7 +43,7 @@
<img id="search-icon" src="../images/search.png" alt="search" onclick="searchHandle(currentTmId)" title="search"/> <img id="search-icon" src="../images/search.png" alt="search" onclick="searchHandle(currentTmId)" title="search"/>
<img id="help-icon" src="../images/help.png" alt="help" onclick="toggleHelp()" title="show/hide help"/> <img id="help-icon" src="../images/help.png" alt="help" onclick="toggleHelp()" title="show/hide help"/>
<div id="result"> <div id="result">
</div> </div>
</div> </div>
</body> </body>

View File

@ -47,15 +47,20 @@ function phraseSearchHandle(tmid, intervals) {
function renderResult(data) { function renderResult(data) {
var res = ''; var res = '';
if (typeof(data['result']['bestOverlayScore']) === 'undefined') { if (typeof(data['result']['bestOverlayScore']) === 'undefined') {
// ignore // ignore
} else { } else {
var score = data['result']['bestOverlayScore']*100; var score = data['result']['bestOverlayScore']*100;
res += '<div id="result-score">Concordia score: <b>'+score.toFixed(0)+'%</b></div>'; res += '<div id="result-score">Concordia score: <b>'+score.toFixed(0)+'%</b></div>';
} }
res += '<div id="phrase-selection">Phrase search mode:&nbsp;<img id="phrase-off-icon" src="../images/switchOff.png" alt="enter phrase search mode" onclick="togglePhraseSearchMode()" title="search for phrases"/><img class="hidden" id="phrase-on-icon" src="../images/switchOn.png" alt="cancel phrase search" onclick="togglePhraseSearchMode()" title="cancel phrase search"/><span id="phrase-prompt" class="hidden">Select continuous phrase: </span></div>';
if (typeof disablePhraseSearch !== 'undefined') {
// ignore
} else {
res += '<div id="phrase-selection">Phrase search mode:&nbsp;<img id="phrase-off-icon" src="../images/switchOff.png" alt="enter phrase search mode" onclick="togglePhraseSearchMode()" title="search for phrases"/><img class="hidden" id="phrase-on-icon" src="../images/switchOn.png" alt="cancel phrase search" onclick="togglePhraseSearchMode()" title="cancel phrase search"/><span id="phrase-prompt" class="hidden">Select continuous phrase: </span></div>';
}
var inputSentence = $('#search-input').val(); var inputSentence = $('#search-input').val();
var markedSentence = ''; var markedSentence = '';
var fragments = ''; var fragments = '';
@ -67,19 +72,19 @@ function renderResult(data) {
//the marked fragment //the marked fragment
markedSentence += '<span onclick="displayDetails(this, '+i+')" class="matchedFragment">'+inputSentence.slice(fragment['matchedPatternStart'], fragment['matchedPatternEnd'])+'</span>'; markedSentence += '<span onclick="displayDetails(this, '+i+')" class="matchedFragment">'+inputSentence.slice(fragment['matchedPatternStart'], fragment['matchedPatternEnd'])+'</span>';
lastInsertedEnd = fragment['matchedPatternEnd']; lastInsertedEnd = fragment['matchedPatternEnd'];
fragments += renderFragment(fragment, i); fragments += renderFragment(fragment, i);
} }
//remaining unmarked fragment //remaining unmarked fragment
markedSentence += inputSentence.slice(lastInsertedEnd); markedSentence += inputSentence.slice(lastInsertedEnd);
res += '<div id="result-sentence" onMouseUp="phraseSearch(this)">'+markedSentence+'</div>'; res += '<div id="result-sentence" onMouseUp="phraseSearch(this)">'+markedSentence+'</div>';
res += '<br/><br/><br/>'+fragments; res += '<br/><br/><br/>'+fragments;
return res; return res;
} }
@ -93,7 +98,7 @@ function renderFragment(fragment, number) {
result += sourceSegment.slice(fragment['matchedExampleStart'], fragment['matchedExampleEnd']); result += sourceSegment.slice(fragment['matchedExampleStart'], fragment['matchedExampleEnd']);
result += '</span>'; result += '</span>';
result += sourceSegment.slice(fragment['matchedExampleEnd']); result += sourceSegment.slice(fragment['matchedExampleEnd']);
// target segment // target segment
result += '</td></tr><tr><td>'; result += '</td></tr><tr><td>';
var targetSegment = fragment['targetSegment']; var targetSegment = fragment['targetSegment'];
@ -140,15 +145,15 @@ function phraseSearch(caller) {
if ($('#result-sentence').hasClass('phrase-mode')) { if ($('#result-sentence').hasClass('phrase-mode')) {
var phrase = getSelectedTextWithin(caller); var phrase = getSelectedTextWithin(caller);
if (phrase.length > 0) { if (phrase.length > 0) {
var intervalStarts = getIndicesOf(phrase, $("#search-input").val(), true); var intervalStarts = getIndicesOf(phrase, $("#search-input").val(), true);
var intervals = []; var intervals = [];
for (var i=0;i<intervalStarts.length;i++) { for (var i=0;i<intervalStarts.length;i++) {
intervals.push([intervalStarts[i], intervalStarts[i]+phrase.length]) intervals.push([intervalStarts[i], intervalStarts[i]+phrase.length])
} }
phraseSearchHandle(currentTmId, intervals); phraseSearchHandle(currentTmId, intervals);
} }
} }