DictionaryForMIDs Translation Layer ported to Javascript

Started by Gert, 13. November 2010, 22:28:09

Previous topic - Next topic

0 Members and 1 Guest are viewing this topic.

Gert

Colleagues,

I'd like to announce that I ported the Translation Layer to Javascript. Well, some work still remains to be done of course.

I'd also like to use this occasion to praise DictionaryForMIDs' very good structure and modularization: as planned, only the following classes needed to be written for JavaScript:
- HTRInputStream - for accessing the dictionary files via XMLHttpRequest
- HTRInputStreamAccess - implementation for DfMInputStreamAccess (refers to HTRInputStream)
- UtilJs - for logging

Not one of the existing classes will need to be reworked !

Well, still it was still quite an effort to get there: I use the Google Web Toolkit for translating Java to Javascript. Thanks to Google for this fantastic tool ! However, I spent quite some time to implement missing classes such as InputStreamReader etc (those are not included in the Google Web Toolkit).

I will work more on that "when I find time"; I will also provide a detailed documentation for those who want to write an HTML5 User Interface.

Who wants to implement the "HMI Layer" in HTML5 for DictionaryForMIDs ?

I don't expect that an HTML5 implementation of DictionaryForMIDs will ever be as powerful as a native implementation such as Achim's Android implementation. And it still may take a long time before the browsers of mobile devices are powerful enough to be run DictionaryForMIDs as HTML5 application. Execution time may be an issue; remember that DictionaryForMIDs offers the capability of an offline dictionary (no need to have an internet connection for translations !), so the whole dictionary search needs to be run as Javascript in the browser.

More to follow in a few weeks.

Best regards,
Gert

P.S.: Only the Translation Layer is ported; there is no User Interface yet; still I quickly hacked some lines of code to present the translation results, see the attached screenshot. By the way, the search was accomplished surprisingly fast.

Gert

I am working to create a convenient Javascript interface of the Translation Layer. Actually, the interface looks exactly the same as in Java.

So now there are two ways of using the DictionaryForMIDs Javascript Translation Layer:
1) implement in Java and use the normal Java interface; then run everything through Google's Web Toolkit (the screenshot from the above posting was generated from Java code that was translated to Javascript with Google's Web Toolkit)
2) implement in Javascript and use directly the interface to the DictionaryForMIDs Javascript Translation Layer. Basically you have for each of the Java interface classes an identical Javascript object. For example, there is a TranslationResult object that provides the same methods as the Java TranslationResult class. A detailed documentation will follow later.

I expect that most people will be interested in 2), i.e. using the Translation Layer from Javascript.

The attached screenshot was produced from a simple Javascript implementation that uses the Javascript interface. Here is the code for displaying the result of the translation:
   function newTranslationResult(resultOfTranslation) {
var translationResultsTable = document.getElementById("translationResultsTable");
    for (var currentTranslation = 0;
    currentTranslation < resultOfTranslation.numberOfFoundTranslations();
    currentTranslation++) {
var singleTranslation = resultOfTranslation.getTranslationAt(currentTranslation);
tr = translationResultsTable.insertRow(currentTranslation);
    for (var currentToText = 0;
    currentToText < singleTranslation.getNumberOfToTexts();
    currentToText++) {
    var toText = singleTranslation.getToTextAt(currentToText);
var stringColourItemText = determineItemsFromContent(toText, true, false);
var innerHTMLText = '';
for (var currentStringColourItemTextPart = 0;
currentStringColourItemTextPart < stringColourItemText.size();
currentStringColourItemTextPart++) {
    stringColourItemTextPart = stringColourItemText.getItemTextPart(currentStringColourItemTextPart);
    var rgbString = stringColourItemTextPart.getColour().getHexValue();
var tdElement = document.createElement('td');
    innerHTMLText = '<font color=\"#' + rgbString + '\">' + stringColourItemTextPart.getText();
tdElement.innerHTML = innerHTMLText;
tr.appendChild(tdElement);
}
    }
}
   }


So work is progressing; but I still need to do quite some work on the Javascript Translation Layer. Hope we will find someone who can implement the HMI Layer (means: implement the user interface) !

Regards,
Gert

Gert

To keep you updated: I now finalized the Javascript interface. Documentation is still to be written.

Next I need to do:
- performance improvement for reading files (most of the execution time is currently spent in the charset decoder)
- support for Normation classes: those seem to be 'optimized away' by GWT :(

Will keep you informed.

Gert

Gert

I am done with the performance optimization: on a modern browser such as an advanced version of Google Chrome the execution time for a translation is now close to zero. Well, I expect that cell phones currently have a Javascript engine that is much slower as the one of Google Chrome.

I also adapted a few Java classes of the DictionaryForMIDs path, in order to provide 'hooks' for optimized Javascript classes. I will submit the updates to SVN when I have an SVN client installed and working again.

Regards,
Gert

axin

Hi Gert,

your HTML5 approach and the results sound very promising! Keep us posted  :)

Achim

Gert

Achim,

thanks for your encouraging words.

Well, I am making good progress with the HTML5 version - however I think the HTML5 version will never be as good as the native implementations, such as your Android version. The HTML5 version will only be interesting for those platforms where there is no native implementation.

Also, I guess it will still take a lot of time before we will have a mature 'complete' HTML5 version. I need to point out that I only work on the Translation Layer.

Ok, will keep you updated !

Best regards,
Gert

Gert

I will soon put a first test version online. Because I hope for a lot of feedback during the development of the htmlApp I will open an htmlApp board here on the forum and post things there.

Regards,
Gert