Writing a TinyMCE custom plugin with java based logic

Question

I am a newbie in plugin development, and with regards to a school project I am working on, I am required to develop a voice to speech functionality which allows a user to speak input into a text editor, in this case I am constrained to the TinyMCE editor. I was given an already well developed java speech recognition library to work with, by name of CMU Sphinx- sphinx4.

So now, my problem. Sphinx4 is a java library and it contains all the logic I need to use to create the plugin. But with TinyMCE, I am restricted to writing the plugin in javascript. I tried writing a simple demo, with no success in getting the plugin to work. Here are the code snippets
1. Index.html

<!DOCTYPE html>
<html>
<head>
    <script src="//cdn.tinymce.com/4/tinymce.min.js"></script>
<script>
    tinymce.init({
        selector:'textarea',
        plugins: 'voiceDictation',
        toolbar: 'voiceDictation'
    });
</script>
</head>
<body>
<textarea>Testing voiceDictation</textarea>
</body>
</html>

Dictate.java

package javapackage;
import edu.cmu.sphinx.api.Configuration;
import edu.cmu.sphinx.api.LiveSpeechRecognizer;

import java.io.IOException;

public class Dictate {
public static LiveSpeechRecognizer dictate() throws IOException {
    Configuration configuration = new Configuration();



 configuration.setAcousticModelPath
 ("resource:/edu/cmu/sphinx/models/en-us/en-us");
configuration.setDictionaryPath("resource:/edu/cmu/sphinx/models/en-us/cmudict-en-us.dict");
configuration.setLanguageModelPath("resource:/edu/cmu/sphinx/models/en-us/en-us.lm.bin");

LiveSpeechRecognizer recognizer = new LiveSpeechRecognizer(configuration);
recognizer.startRecognition(true);
return recognizer;
}
}

plugin.js

import _ from 'lodash';

const plugin = (editor) => {
editor.addButton('voiceDictation', {
text: 'voiceDictation',
icon: false,
onclick: () => {
var recognizer = Packages.javapackage.Dictate.dictate;
var result = recognizer.getHypothesis();

    editor.windowManager.open({
        title: 'voiceDictation plugin',
        body: [
            { type: 'textbox', name: {result} }
        ],


})
}
})
};

export default plugin;

Index.js

import plugin from './plugin';

tinymce.PluginManager.add('voiceDictation', plugin);

Any help, no matter how minimal would be greatly appreciated

score 0 · Answer 1 · answered May 22 '18 at 16:48

Java and javascript are very different languages and you rarely can use java libraries from javascript unless you set a server which will run java library and contact it over network. Javascript in a browser has very limited capabilities to interact with other software. For your task you can use javascript speech recognition library, for example

Chrome Web Speech API - works only in Chrome

Dictate.js - works in Firefox too, but requires a server somewhere. Will not work in some browsers anyway.

You can search for others.

Thanks a lot for your answer. One thing I'd like to note is the fact that I'm restricted to using CMU Sphinx 4 — tenas ryan, May 23 '18 at 19:26

Writing a TinyMCE custom plugin with java based logic

1 Answers1