Maxlength attribute in the text area. Some other fix.

git-svn-id: http://svn.research-infrastructures.eu/public/d4science/gcube/trunk/data-analysis/nlphub@164998 82a268e6-3cf1-43bd-a215-b396298e98cf
This commit is contained in:
Erik Perrone 2018-03-13 13:31:37 +00:00
parent 7210d91790
commit 7dc3514e2e
3 changed files with 170 additions and 110 deletions

View File

@ -241,12 +241,26 @@ select {
margin: 2px;
}
.left-side-half {
float: left;
width: 49%;
height: 3vh;
margin: 1px;
}
.right-side::after {
content: "";
clear: both;
display: table;
}
.left-side-half::after {
content: "";
clear: both;
display: table;
}
.header-side {
float: left;
width: 100%;

View File

@ -72,8 +72,8 @@
</div>
</div>
</div>
<div class="input-field col s12">
<textarea id="input-textarea" class="my-textarea" rows="8"
<div class="input-field col s12">Write or paste a text in the text area (<span style="color:red;">max 4000 characters</span>)
<textarea maxlength="4000" id="input-textarea" class="my-textarea" rows="8"
placeholder="paste your text here"></textarea>
</div>
</div>
@ -95,7 +95,11 @@
</div>
<!-- this is the main result container -->
<div id="ner-result-container">
<div id="result-header" class="header-side"></div>
<div id="result-header" class="header-side">
<div class="left-side-half" id="result-header-left"></div>
<div class="left-side-half" id="result-header-right"></div>
</div>
<div></div>
<div class="left-side" id="result-text-div"></div>
<div class="right-side" id="result-params-div"></div>
<div style="text-align: left;">

View File

@ -16,8 +16,9 @@ var hexLetters = '0123456789ABCDEF';
// with valid algs info.
// ------------------------------------------------------------------------------------------------------
$
.ajax({
$(document).ready(function() {
disableExecuteButton();
$.ajax({
url : "https://data.d4science.org/bnp4UDNyb21lSURkQXdDUnlSS0JkVWgzWk1KMUxWVGZHbWJQNStIS0N6Yz0",
type : "GET",
async : true,
@ -40,7 +41,7 @@ $
jsonContent = null;
});
$("#execute-button").css("background-color", pageGray);
disableExecuteButton();
$("#upload-button")
.uploadFile(
@ -99,8 +100,7 @@ $
+ files
+ "</span>");
publicLink = data.message;
$("#execute-button").css(
"background-color", pageGreen);
enableExecuteButton();
if (publicLink == null) {
alert("Error uploading file.");
}
@ -117,6 +117,8 @@ $
alert("Unexpected Error. Status: " + richiesta.status);
}
});
});
/*
* Utility function processing the language indication returned by the language recognition service
@ -250,26 +252,61 @@ buildLanguageSelection = function() {
}
}
enableExecuteButton = function() {
$("#execute-button").css("background-color", pageGreen);
$("#execute-button").attr("enable", "true");
}
disableExecuteButton = function() {
$("#execute-button").css("background-color", pageGray);
$("#execute-button").attr("enable", "false");
}
isEnabled = function() {
if($("#execute-button").attr("enable") == "true")
return true;
return false;
}
enableDisableTextArea = function() {
if ($("#input-textarea").val() == "")
disableExecuteButton();
else
enableExecuteButton();
}
/*
* Set the listeners on the text area and the execute button
*/
setEventListeners = function() {
$("#input-textarea").on("keyup", function() {
if ($("#input-textarea").val() == "")
$("#execute-button").css("background-color", pageGray);
else
$("#execute-button").css("background-color", pageGreen);
enableDisableTextArea();
});
$("#input-textarea").change(function() {
enableDisableTextArea();
});
window.addEventListener('contextmenu', function(e) {
//alert("You've tried to open context menu"); //here you draw your own menu
//e.preventDefault();
enableDisableTextArea();
}, false);
$("#execute-button")
.click(
function() {
if(!isEnabled())
return;
if ((publicLink == null)
&& ($("#input-textarea").val() == "")) {
alert("You must upload a file or write some text in the text area before submit a request.");
return;
}
disableExecuteButton();
showProgress();
// if some text has been written in the text area, then
// a corresponding text file
@ -286,7 +323,6 @@ setEventListeners = function() {
contentType : "text/plain; charset=utf-8",
success : function(data, stato) {
publicLink = data.message;
// console.log(data.language);
if (publicLink == null) {
alert("Error uploading file.");
}
@ -370,6 +406,7 @@ launchAlgorithm = function() {
success : function(data, stato) {
textAreaEnable(true);
$("#file-info").empty();
$("#reset-upload").css("display", "none");
if (typeof (data.response) != 'undefined') {
var jsonOut = getOutputJson(data.message);
} else if (typeof (data.error) != 'undefined') {
@ -444,13 +481,15 @@ showResult = function(data) {
jsonContent = data;
resultText = jsonContent.output.text;
$("#result-header").empty();
$("#result-header-left").empty();
$("#result-header-right").empty();
$("#result-params-div").empty();
$("#result-text-div").empty();
$("#result-header").append(
"<p>You can download the overall result as a JSON file <a href='"
+ jsonContent.link + "'>here</a></p>");
$("#result-header-left").append(
"You can download the overall result as a JSON file <a href='"
+ jsonContent.link + "'>here</a>");
$("#result-header-right").append("&nbsp;");
var localText = resultText;
localText = resultText.replace(/\n/g, "<br>");
$("#result-text-div").empty();
@ -536,7 +575,10 @@ rewriteText = function(annotation, color) {
var G = enhanceColor(complement.substring(2,4));
var B = enhanceColor(complement.substring(4));
complement = "#" + R + G + B;
var indices = getIndices(annotation);
$("#result-header-right").empty();
$("#result-header-right").append("<span style='color:" + color + ";'>" + annotation + "</span> occurs " + indices.length + " times.");
var indexedText = "";
if ((typeof (indices) == 'undefined') || (indices.length == 0)) {
@ -636,7 +678,7 @@ mergeIndices = function(indices) {
*/
resetExecuteButton = function() {
publicLink = null;
$("#execute-button").css("background-color", pageGray);
disableExecuteButton();
}
/*