2018-03-09 14:40:21 +01:00
var tableRawSize = 5 ;
var annotations = [ ] ;
var algorithms = [ ] ;
var languages = [ ] ;
var publicLink = null ;
var pageGreen = "#4CAF50" ;
var pageGray = "#A0A0A0" ;
var savedAnnotations = "" ;
var jsonContent = null ;
var named = null ;
var resultText = "" ;
var hexLetters = '0123456789ABCDEF' ;
// ------------------------------------------------------------------------------------------------------
// Starting point: get the csv file with algorithm parameters and set the page
// with valid algs info.
// ------------------------------------------------------------------------------------------------------
2018-03-13 14:31:37 +01:00
$ ( document ) . ready ( function ( ) {
disableExecuteButton ( ) ;
$ . ajax ( {
url : "https://data.d4science.org/bnp4UDNyb21lSURkQXdDUnlSS0JkVWgzWk1KMUxWVGZHbWJQNStIS0N6Yz0" ,
type : "GET" ,
async : true ,
contentType : "text/plain; charset=utf-8" ,
success : function ( data , stato ) {
$ ( "#ner-result-container" ) . hide ( ) ;
var lineTokens = manageCsvData ( data ) ;
getAlgorithms ( lineTokens ) ;
buildLanguageSelection ( ) ;
buildLanguageList ( ) ;
buildAnnotations ( ) ;
resizeTable ( ) ;
resizeLogo ( ) ;
$ ( "#back-ner-ui-button" ) . click ( function ( ) {
2018-03-09 14:40:21 +01:00
$ ( "#ner-result-container" ) . hide ( ) ;
2018-03-13 14:31:37 +01:00
$ ( "#ner-ui" ) . show ( ) ;
$ ( "#input-textarea" ) . val ( "" ) ;
publicLink = null ;
jsonContent = null ;
} ) ;
disableExecuteButton ( ) ;
$ ( "#upload-button" )
. uploadFile (
{
url : "/nlphub/nlphub-uploader-servlet" ,
fileName : "mytxtfile" ,
maxFileCount : 100 ,
multiple : false ,
maxFileSize : 1024 * 1000 * 6.14 ,
showFileCounter : false ,
showCancel : true ,
dragDropStr : "<img class='img-prompt' src='img/upload.png' width='60px' height='60px' style='display:block; margin:auto; padding: 10px'>" ,
extErrorStr : "Error. Text file only" ,
sizeErrorStr : "Error. Max size: 6 Mb" ,
onLoad : function ( obj ) {
$ ( "#file-info" ) . remove ( ) ;
$ ( "#reset-upload" ) . remove ( ) ;
$ ( "#fu-container" )
. append (
"<div id=\"right-child\" class=\"float-right-div\"></div>" ) ;
$ ( "#right-child" )
. append (
"<div id=\"file-info\" class=\"centered\"></div>" ) ;
$ ( "#right-child" )
. append (
"<div id=\"reset-upload\" class=\"centered\">Cancel</div>" ) ;
$ ( "#reset-upload" ) . hide ( ) ;
$ ( "#reset-upload" ) . click (
function ( ) {
resetExecuteButton ( ) ;
$ ( "#file-info" ) . empty ( ) ;
$ ( "#reset-upload" ) . css (
"display" , "none" ) ;
textAreaEnable ( true ) ;
} ) ;
savedAnnotations = "" ;
setEventListeners ( ) ;
} ,
onSelect : function ( files ) {
showProgress ( ) ;
textAreaEnable ( false ) ;
$ ( "#input-textarea" ) . val ( "" ) ;
} ,
onSuccess : function ( files , data , xhr ) {
hideProgress ( ) ;
console . log ( '' + data . language ) ;
checkLanguage ( data . language ) ;
selectAnnotationsByLanguage ( ) ;
$ ( "#reset-upload" ) . css ( "display" ,
"inline" ) ;
console . log ( "files: " + files ) ;
$ ( "#file-info" ) . empty ( ) ;
$ ( "#file-info" )
. append (
"Uploaded: <span style=\"color:#4CAF50; letter-spacing: 1px; font-weight: bold;\">"
+ files
+ "</span>" ) ;
publicLink = data . message ;
enableExecuteButton ( ) ;
if ( publicLink == null ) {
alert ( "Error uploading file." ) ;
2018-03-09 14:40:21 +01:00
}
2018-03-13 14:31:37 +01:00
} ,
onError : function ( files , status , errMsg ,
pd ) {
hideProgress ( ) ;
textAreaEnable ( true ) ;
alert ( errMsg ) ;
}
} ) ;
} ,
error : function ( richiesta , stato , errori ) {
alert ( "Unexpected Error. Status: " + richiesta . status ) ;
}
} ) ;
} ) ;
2018-03-09 14:40:21 +01:00
/ *
* Utility function processing the language indication returned by the language recognition service
* /
checkLanguage = function ( lang ) {
var options = $ ( "#language-select option" ) ;
for ( var i = 0 ; i < options . length ; i ++ ) {
if ( options [ i ] . innerText . toLowerCase ( ) == lang . toLowerCase ( ) ) {
$ ( "#language-select" ) . val ( options [ i ] . innerText ) ;
buildAnnotations ( ) ;
return ;
}
2018-02-20 08:39:31 +01:00
}
2018-03-12 17:46:20 +01:00
alert ( "The uploaded file seems to be in " + lang + ", but this language is not currently supported. Please, be aware of this, should you decide to continue and use the tools of another language... \"Praemonitus praemunitus!\"" ) ;
2018-03-09 14:40:21 +01:00
}
2018-02-20 08:39:31 +01:00
2018-03-09 14:40:21 +01:00
/ *
* CSV parser
* /
manageCsvData = function ( data ) {
// first of all: split on the "newline" character in order to
// get all lines.
var lines = data . split ( "\n" ) ;
var tokens = [ ] , lineTokens = [ ] ;
// second: parse each line
for ( i in lines ) {
var line = ',' + lines [ i ] ;
var tokenStart = - 1 ;
for ( var j = 0 ; j < line . length ; j ++ ) {
if ( line . charAt ( j ) == '\"' ) {
j = line . indexOf ( '\"' , j + 1 ) ;
if ( j < 0 )
return ;
continue ;
}
if ( line . charAt ( j ) == ',' ) {
if ( tokenStart == - 1 ) {
tokenStart = j ;
} else {
tokens [ tokens . length ] = line . substring ( tokenStart + 1 , j ) ;
tokenStart = j ;
}
}
}
// get the new token and push it in the array
tokens [ tokens . length ] = line . substring ( tokenStart + 1 ) ;
lineTokens [ lineTokens . length ] = tokens ;
tokens = [ ] ;
2018-02-20 08:39:31 +01:00
}
2018-03-09 14:40:21 +01:00
return lineTokens ;
}
/ *
* Map the supported algorithms ( from CSV ) in the internal global algorithm array
* /
getAlgorithms = function ( lineTokens ) {
// build the list of supported algorithms
for ( i = 0 ; i < lineTokens . length ; i ++ ) {
if ( ( i == 0 ) || ( lineTokens [ i ] . length != 8 ) )
continue ; // skip the header
if ( lineTokens [ i ] [ 7 ] . trim ( ) . toUpperCase ( ) == "OK" ) {
var algName = lineTokens [ i ] [ 0 ] . trim ( ) ;
var algDescription = lineTokens [ i ] [ 1 ] . trim ( ) ;
var algId = lineTokens [ i ] [ 2 ] . trim ( ) ;
var annotationList = lineTokens [ i ] [ 3 ] . replace ( /"/g , " " ) . trim ( ) ;
var language = lineTokens [ i ] [ 4 ] . replace ( /"/g , " " ) . trim ( ) ;
algorithms [ algorithms . length ] = {
"name" : algName ,
"description" : algDescription ,
"id" : algId ,
"lang" : language ,
"annotations" : annotationList
} ;
2018-02-20 08:39:31 +01:00
}
}
2018-03-09 14:40:21 +01:00
}
2018-02-20 08:39:31 +01:00
2018-03-09 14:40:21 +01:00
/ *
* Build the annotation list based on the language selected
* /
buildAnnotations = function ( ) {
annotations = [ ] ;
var language = $ ( "#language-select" ) . val ( ) ;
for ( i in algorithms ) {
if ( algorithms [ i ] . lang . toLowerCase ( ) != language . toLowerCase ( ) )
continue ;
var annotationList = algorithms [ i ] . annotations ;
var a = annotationList . split ( /\s|,/ ) ;
for ( j in a ) {
a [ j ] = a [ j ] . trim ( ) ;
if ( a [ j ] . length > 0 ) {
var thereIs = false ;
for ( k in annotations ) {
if ( annotations [ k ] . toUpperCase ( ) == a [ j ] . toUpperCase ( ) ) {
thereIs = true ;
break ;
}
}
if ( ! thereIs )
annotations [ annotations . length ] = a [ j ] ;
}
}
}
2018-02-20 08:39:31 +01:00
}
2018-03-09 14:40:21 +01:00
/ *
* Build the language array
* /
buildLanguageSelection = function ( ) {
for ( i in algorithms ) {
var languageList = algorithms [ i ] . lang ;
var langs = languageList . split ( /\s|,/ ) ;
for ( j in langs ) {
langs [ j ] = langs [ j ] . trim ( ) ;
if ( langs [ j ] . length > 0 ) {
var thereIs = false ;
for ( k in languages ) {
if ( languages [ k ] . toUpperCase ( ) == langs [ j ] . toUpperCase ( ) ) {
thereIs = true ;
break ;
}
}
if ( ! thereIs )
languages [ languages . length ] = langs [ j ] ;
}
}
2018-02-20 08:39:31 +01:00
}
}
2018-03-13 14:31:37 +01:00
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 ( ) ;
}
2018-03-09 14:40:21 +01:00
/ *
* Set the listeners on the text area and the execute button
* /
setEventListeners = function ( ) {
$ ( "#input-textarea" ) . on ( "keyup" , function ( ) {
2018-03-13 14:31:37 +01:00
enableDisableTextArea ( ) ;
} ) ;
$ ( "#input-textarea" ) . change ( function ( ) {
enableDisableTextArea ( ) ;
2018-03-09 14:40:21 +01:00
} ) ;
2018-03-13 14:31:37 +01:00
window . addEventListener ( 'contextmenu' , function ( e ) {
//alert("You've tried to open context menu"); //here you draw your own menu
//e.preventDefault();
enableDisableTextArea ( ) ;
} , false ) ;
2018-03-09 14:40:21 +01:00
$ ( "#execute-button" )
. click (
function ( ) {
2018-03-13 14:31:37 +01:00
if ( ! isEnabled ( ) )
return ;
2018-03-09 14:40:21 +01:00
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 ;
}
2018-03-13 14:31:37 +01:00
disableExecuteButton ( ) ;
2018-03-09 14:40:21 +01:00
showProgress ( ) ;
// if some text has been written in the text area, then
// a corresponding text file
// must be written in the workspace and the public link
// is set.
if ( $ ( "#input-textarea" ) . val ( ) . length > 0 ) {
freeText = $ ( "#input-textarea" ) . val ( ) ;
$
. ajax ( {
url : "/nlphub/nlphub-uploader-servlet?freetext="
+ encodeURI ( freeText ) ,
type : "POST" ,
async : true ,
contentType : "text/plain; charset=utf-8" ,
success : function ( data , stato ) {
publicLink = data . message ;
if ( publicLink == null ) {
alert ( "Error uploading file." ) ;
}
launchAlgorithm ( ) ;
} ,
error : function ( richiesta , stato ,
errori ) {
alert ( "Unexpected Error. Status: "
+ richiesta . status ) ;
hideProgress ( ) ;
textAreaEnable ( true ) ;
$ ( "#file-info" ) . empty ( ) ;
}
} ) ;
}
else {
launchAlgorithm ( ) ;
}
} ) ;
}
/ *
* show the in - progress popup
* /
showProgress = function ( ) {
var width = $ ( ".progress-circular-div" ) . width ( ) ;
var height = $ ( ".progress-circular-div" ) . height ( ) ;
var left = parseInt ( ( window . innerWidth - width ) / 2 ) ;
var top = parseInt ( ( window . innerHeight - height ) / 2 ) ;
$ ( ".progress-circular-div" ) . css ( "left" , left ) ;
$ ( ".progress-circular-div" ) . css ( "top" , top ) ;
$ ( ".hidden-div" ) . css ( "display" , "block" ) ;
}
/ *
* hide the in - progress popup
* /
hideProgress = function ( ) {
$ ( ".hidden-div" ) . css ( "display" , "none" ) ;
}
/ *
* run the algorithms selected by the chosen language
* /
launchAlgorithm = function ( ) {
if ( publicLink == null ) {
alert ( "No input text available for the service." ) ;
return ;
}
var list = buildInputAnnotationList ( ) ;
var annList = "" ;
for ( i in list ) {
annList += list [ i ] + "," ;
}
annList = annList . substring ( 0 , annList . length - 1 ) ;
savedAnnotations = annList ;
var algList = "" ;
for ( j in algorithms ) {
if ( algorithms [ j ] . lang . toLowerCase ( ) . indexOf (
$ ( "#language-select" ) . val ( ) . toLowerCase ( ) ) >= 0 ) {
algList += encodeURI ( algorithms [ j ] . id ) + "," ;
}
2018-02-20 08:39:31 +01:00
}
2018-03-09 14:40:21 +01:00
if ( algList . length == 0 ) {
alert ( "Warning. No algorithm matching with selected language." ) ;
return ;
}
algList = algList . substring ( 0 , algList . length - 1 ) ;
var parameters = "annotations=" + annList ;
parameters += "&lang=" + $ ( "#language-select" ) . val ( ) ;
parameters += "&plink=" + encodeURI ( publicLink ) ;
parameters += "&algs=" + algList ;
$ . ajax ( {
url : "/nlphub/nlphub-servlet?" + parameters ,
type : "POST" ,
async : true ,
success : function ( data , stato ) {
textAreaEnable ( true ) ;
$ ( "#file-info" ) . empty ( ) ;
2018-03-13 14:31:37 +01:00
$ ( "#reset-upload" ) . css ( "display" , "none" ) ;
2018-03-09 14:40:21 +01:00
if ( typeof ( data . response ) != 'undefined' ) {
var jsonOut = getOutputJson ( data . message ) ;
} else if ( typeof ( data . error ) != 'undefined' ) {
hideProgress ( ) ;
alert ( data . message ) ;
2018-02-20 08:39:31 +01:00
} else {
2018-03-09 14:40:21 +01:00
hideProgress ( ) ;
alert ( "Unexpected response" ) ;
2018-02-20 08:39:31 +01:00
}
2018-03-09 14:40:21 +01:00
resetExecuteButton ( ) ;
} ,
error : function ( richiesta , stato , errori ) {
hideProgress ( ) ;
textAreaEnable ( true ) ;
alert ( "Unexpected Error. Status: " + richiesta . status ) ;
resetExecuteButton ( ) ;
2018-02-20 08:39:31 +01:00
}
2018-03-09 14:40:21 +01:00
} ) ;
}
/ *
* Get the final json returned by the server
* /
getOutputJson = function ( message ) {
var tobemap = "" ;
for ( var i = 0 ; i < message . length ; i ++ ) {
tobemap += message [ i ] + "|" ;
}
tobemap = tobemap . substring ( 0 , tobemap . length - 1 ) ;
2018-02-20 08:39:31 +01:00
2018-03-09 14:40:21 +01:00
var parameters = "annotations=" + savedAnnotations ;
parameters += "&plink=" + encodeURI ( publicLink ) ;
parameters += "&lang=" + $ ( "#language-select" ) . val ( ) ;
parameters += "&tobemap=" + encodeURI ( tobemap ) ;
console . log ( parameters ) ;
$ . ajax ( {
url : "/nlphub/nlphub-mapper-servlet?" + parameters ,
type : "POST" ,
async : true ,
success : function ( data , stato ) {
hideProgress ( ) ;
console . log ( data ) ;
if ( ( typeof ( data . response ) != "undefined" )
&& ( data . response . trim ( ) . toUpperCase ( ) == "ERROR" ) ) {
alert ( "ERROR\n" + data . message ) ;
} else {
$ ( "#reset-upload" ) . hide ( ) ;
savedAnnotations = "" ;
publicLink = null ;
showResult ( data ) ;
}
} ,
error : function ( richiesta , stato , errori ) {
hideProgress ( ) ;
$ ( "#reset-upload" ) . hide ( ) ;
savedAnnotations = "" ;
publicLink = null ;
alert ( "Unexpected Error. Status: " + richiesta . status ) ;
}
2018-02-20 08:39:31 +01:00
} ) ;
}
2018-03-09 14:40:21 +01:00
/ *
* Show the computation result
* /
showResult = function ( data ) {
$ ( "#ner-ui" ) . hide ( ) ;
$ ( "#ner-result-container" ) . show ( ) ;
jsonContent = data ;
resultText = jsonContent . output . text ;
2018-03-13 14:31:37 +01:00
$ ( "#result-header-left" ) . empty ( ) ;
$ ( "#result-header-right" ) . empty ( ) ;
2018-03-09 14:40:21 +01:00
$ ( "#result-params-div" ) . empty ( ) ;
$ ( "#result-text-div" ) . empty ( ) ;
2018-03-13 14:31:37 +01:00
$ ( "#result-header-left" ) . append (
"You can download the overall result as a JSON file <a href='"
+ jsonContent . link + "'>here</a>" ) ;
$ ( "#result-header-right" ) . append ( " " ) ;
2018-03-09 14:40:21 +01:00
var localText = resultText ;
localText = resultText . replace ( /\n/g , "<br>" ) ;
$ ( "#result-text-div" ) . empty ( ) ;
$ ( "#result-text-div" ) . append ( "<p>" + localText + "</p>" ) ;
showAnnotationList ( jsonContent . output . annotations ) ;
}
showAnnotationList = function ( list ) {
var colorDisabled = "CCCCCC" ;
var color ;
var colors = [ ] ;
var annotations = list . split ( "," ) ;
for ( var i = 0 ; i < annotations . length ; i ++ ) {
do {
color = randomRGB ( ) ;
} while ( color == colorDisabled ) ;
colors [ colors . length ] = color ;
}
$ ( "#result-params-div" ) . append ( "<form id='colored-annotations'></form>" ) ;
for ( var i = 0 ; i < annotations . length ; i ++ ) {
var cb = "<input type='radio' name='foo' " ;
if ( ! checkAnnotation ( annotations [ i ] ) ) {
cb += "disabled " ;
colors [ i ] = colorDisabled ;
}
cb += "named='" + annotations [ i ] + "' value='" + colors [ i ]
+ "' id='color-" + i + "' class='filled-in'>" ;
cb += "<label for='color-" + i
+ "'><span style='font-weight:bold; color:#" + colors [ i ] + "'>"
+ annotations [ i ] + "</span></label><br>" ;
$ ( "#colored-annotations" ) . append ( cb ) ;
}
$ ( "#colored-annotations :radio" ) . change ( function ( ) {
if ( this . checked ) {
rewriteText ( this . getAttribute ( "named" ) , "#" + this . value ) ;
}
} ) ;
}
/ *
* Utility function
* /
countSubstringOccurrencies = function ( string , substring ) {
var occurrencies = 0 ;
var index = 0 ;
var s = string ;
while ( index >= 0 ) {
index = s . indexOf ( substring ) ;
if ( index >= 0 ) {
occurrencies ++ ;
s = s . substring ( index + 1 ) ;
}
}
return occurrencies ;
}
/ *
* Utility
* /
enhanceColor = function ( color ) {
var c = eval ( "0x" + color ) ;
var hi = Math . round ( c / 16 ) ;
if ( hi < 15 ) {
hi += Math . round ( ( 15 - hi ) / 1.5 ) ;
}
if ( hi > 15 ) hi = 15 ;
return '' + hexLetters [ hi ] + hexLetters [ c % 16 ] ;
}
/ *
* Write the html paragraph < p > containing the text highlighted on annotation value
* /
rewriteText = function ( annotation , color ) {
$ ( "#result-text-div" ) . empty ( ) ;
var complemetar = 0xFFFFFF - eval ( "0x" + color . substring ( 1 ) ) ;
var complement = complemetar . toString ( 16 ) ;
var R = enhanceColor ( complement . substring ( 0 , 2 ) ) ;
var G = enhanceColor ( complement . substring ( 2 , 4 ) ) ;
var B = enhanceColor ( complement . substring ( 4 ) ) ;
complement = "#" + R + G + B ;
2018-03-13 14:31:37 +01:00
2018-03-09 14:40:21 +01:00
var indices = getIndices ( annotation ) ;
2018-03-13 14:31:37 +01:00
$ ( "#result-header-right" ) . empty ( ) ;
$ ( "#result-header-right" ) . append ( "<span style='color:" + color + ";'>" + annotation + "</span> occurs " + indices . length + " times." ) ;
2018-03-09 14:40:21 +01:00
var indexedText = "" ;
if ( ( typeof ( indices ) == 'undefined' ) || ( indices . length == 0 ) ) {
indexedText = resultText ;
indexedText = indexedText . replace ( /\n/g , "<br>" ) ;
$ ( "#result-text-div" ) . append ( "<p>" + indexedText + "</p>" ) ;
return ;
}
var t = 0 ;
var offset = 0 ;
for ( var i = 0 ; i < indices . length ; i ++ ) {
var index = indices [ i ] ;
var start = index [ 0 ] ;
var end = index [ 1 ] ;
indexedText += resultText . substring ( t , start ) ;
offset += countSubstringOccurrencies ( resultText . substring ( t , start ) ,
"\n" ) ;
offset += countSubstringOccurrencies ( resultText . substring ( t , start ) ,
"\r" ) ;
offset += countSubstringOccurrencies ( resultText . substring ( t , start ) ,
"\t" ) ;
start += offset ;
end += offset ;
var colored = "<span style='color:" + color + "; background:"
+ complement + "; font-weight:bold;'>"
+ resultText . substring ( start , end ) + "</span>" ;
indexedText += colored ;
t = end ;
}
if ( t < resultText . length )
indexedText += resultText . substring ( t ) ;
indexedText = indexedText . replace ( /\n/g , "<br>" ) ;
$ ( "#result-text-div" ) . append ( "<p>" + indexedText + "</p>" ) ;
}
/ *
* Find if the annotation is presente in the json
* /
checkAnnotation = function ( annotation ) {
for ( var i = 0 ; i < jsonContent . output . result . length ; i ++ ) {
var entities = jsonContent . output . result [ i ] . entities ;
for ( var j = 0 ; j < entities . length ; j ++ ) {
a = entities [ j ] [ annotation ] ;
if ( typeof a != 'undefined' ) {
return true ;
}
}
}
return false ;
}
/ *
* Retrieve the annotation indices from the json
* /
getIndices = function ( annotation ) {
var indices = [ ] ;
// get indices
for ( var i = 0 ; i < jsonContent . output . result . length ; i ++ ) {
var entities = jsonContent . output . result [ i ] . entities ;
for ( var j = 0 ; j < entities . length ; j ++ ) {
a = entities [ j ] [ annotation ] ;
if ( typeof a != 'undefined' ) {
indices [ i ] = [ ] ;
for ( var k = 0 ; k < a . length ; k ++ ) {
var index = a [ k ] . indices ;
indices [ i ] [ k ] = index ;
}
}
}
}
var indices2 = [ ] ;
for ( var i = 0 ; i < indices . length ; i ++ ) {
if ( typeof ( indices [ i ] ) != 'undefined' )
indices2 [ indices2 . length ] = indices [ i ] ;
}
return mergeIndices ( indices2 ) ;
}
/ *
* Merge the indices
* /
mergeIndices = function ( indices ) {
var newIndices = [ ]
if ( indices . length <= 1 )
newIndices = indices [ 0 ] ;
else
newIndices = mergeAll ( indices ) ;
return newIndices ;
}
/ *
* Utility function
* /
resetExecuteButton = function ( ) {
publicLink = null ;
2018-03-13 14:31:37 +01:00
disableExecuteButton ( ) ;
2018-03-09 14:40:21 +01:00
}
/ *
* Resize the annotation table based on the screen geometry
* /
resizeTable = function ( ) {
// resize the annotation table
$ ( "#annotations-table" ) . empty ( ) ;
var rowId = "" ;
var ratio = window . innerWidth / window . innerHeight ;
if ( ratio <= 0.35 ) {
tableRawSize = 1 ;
} else if ( ( ratio > 0.35 ) && ( ratio <= 0.75 ) ) {
tableRawSize = 2 ;
} else if ( ( ratio > 0.75 ) && ( ratio <= 1 ) ) {
tableRawSize = 3 ;
} else if ( ( ratio > 1 ) && ( ratio <= 1.5 ) ) {
tableRawSize = 4 ;
} else {
tableRawSize = 5 ;
}
for ( var i = 0 ; i < annotations . length ; i ++ ) {
if ( i % tableRawSize == 0 ) {
rowId = "row-" + i ;
$ ( "#annotations-table" ) . append ( "<tr id=\"" + rowId + "\"></tr>" ) ;
}
var annotationElement = "<input type=\"checkbox\" id=\"check-" + i
+ "\" value=\"" + annotations [ i ]
+ "\" checked=\"checked\"></input> <label for=\"check-" + i
+ "\">" + annotations [ i ] + "</label>" ;
$ ( "#" + rowId ) . append ( "<td>" + annotationElement + "</td>" ) ;
}
}
/ *
* Resize the page logo image based on the screen geometry
* /
resizeLogo = function ( ) {
if ( window . innerWidth < 200 )
$ ( "#logo-image" ) . width ( window . innerWidth - 10 ) ;
}
/ *
* Build the annotation list for the service invocation
* /
buildInputAnnotationList = function ( ) {
var list = [ ] ;
for ( var i = 0 ; i < annotations . length ; i ++ ) {
if ( $ ( "#check-" + i ) . is ( ":Checked" ) )
list [ list . length ] = $ ( "#check-" + i ) . val ( ) ;
}
return list ;
}
/ *
* Handler for the window resize event
* /
window . onresize = function ( event ) {
resizeTable ( ) ;
resizeLogo ( ) ;
} ;
/ *
* Handler for the file upload control
* /
$ ( ".ajax-file-upload-abort" ) . on ( "DOMAttrModified" , function ( event ) {
$ ( ".ajax-file-upload-abort" ) . css ( "display" , "none" ) ;
if ( event . attributeName == "display" ) { // which attribute you want to watch
// for changes
$ ( ".ajax-file-upload-abort" ) . css ( "display" , "none" ) ;
}
} ) ;
/ *
* Build the option list of supported language
* /
buildLanguageList = function ( ) {
// build the language selection input control
for ( i in languages ) {
var opt = "<option value=\"" + languages [ i ]
+ "\" selected=\"selected\">" + languages [ i ] + "</option>" ;
if ( i > 1 )
opt = "<option value=\"" + languages [ i ] + "\">" + languages [ i ]
+ "</option>" ;
$ ( "#language-select" ) . append ( opt ) ;
}
$ ( "#language-select" ) . on ( "change" , function ( ) {
selectAnnotationsByLanguage ( ) ;
} ) ;
}
/ *
* Utility
* /
selectAnnotationsByLanguage = function ( ) {
buildAnnotations ( ) ;
resizeTable ( ) ;
}
/ *
* Enable / disable the input text area
* /
textAreaEnable = function ( enable ) {
if ( enable == true )
$ ( "#input-textarea" ) . prop ( 'disabled' , false ) ;
else
$ ( "#input-textarea" ) . prop ( 'disabled' , true ) ;
}
/ *
* Get a random RGB color
* /
randomRGB = function ( ) {
var color = '' ;
var couple = '' ;
for ( var i = 0 ; i < 3 ; i ++ ) {
couple = '' + hexLetters [ Math . floor ( Math . random ( ) * 10 ) ] + hexLetters [ Math . floor ( Math . random ( ) * 16 ) ] ;
color += couple ;
}
return color ;
}