using Mathjax in android

Question

Hi I want to using Mathjax in my android app for that i found a example form Here.
I want to show a formula when activity start up, not like example when you press show button but that's not work.am i miss something in my code?
Thanks for any help.

private String doubleEscapeTeX(String s) {
    String t="";
    for (int i=0; i < s.length(); i++) {
        if (s.charAt(i) == '\'') t += '\\';
        if (s.charAt(i) != '\n') t += s.charAt(i);
        if (s.charAt(i) == '\\') t += "\\";
    }
    return t;
}

private int exampleIndex = 0;

private String getExample(int index) {
    return getResources().getStringArray(R.array.tex_examples)[index];
}

public void onClick(View v) {
    if (v == findViewById(R.id.button2)) {
        WebView w = (WebView) findViewById(R.id.webview);
        EditText e = (EditText) findViewById(R.id.edit);
        w.loadUrl("javascript:document.getElementById('math').innerHTML='\\\\["
                   +doubleEscapeTeX(e.getText().toString())+"\\\\]';");
        w.loadUrl("javascript:MathJax.Hub.Queue(['Typeset',MathJax.Hub]);");
    }
    else if (v == findViewById(R.id.button3)) {
        WebView w = (WebView) findViewById(R.id.webview);
        EditText e = (EditText) findViewById(R.id.edit);
        e.setText("");
        w.loadUrl("javascript:document.getElementById('math').innerHTML='';");
        w.loadUrl("javascript:MathJax.Hub.Queue(['Typeset',MathJax.Hub]);");
    }
    else if (v == findViewById(R.id.button4)) {
        WebView w = (WebView) findViewById(R.id.webview);
        EditText e = (EditText) findViewById(R.id.edit);
        e.setText(getExample(exampleIndex++));
        if (exampleIndex > getResources().getStringArray(R.array.tex_examples).length-1) 
            exampleIndex=0;
        w.loadUrl("javascript:document.getElementById('math').innerHTML='\\\\["
                  +doubleEscapeTeX(e.getText().toString())
                  +"\\\\]';");
        w.loadUrl("javascript:MathJax.Hub.Queue(['Typeset',MathJax.Hub]);");
    }
}

/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState)
{
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);
    WebView w = (WebView) findViewById(R.id.webview);
    w.getSettings().setJavaScriptEnabled(true);
    w.getSettings().setBuiltInZoomControls(true);
    w.loadDataWithBaseURL("http://bar", "<script type='text/x-mathjax-config'>"
                          +"MathJax.Hub.Config({ " 
                            +"showMathMenu: false, "
                            +"jax: ['input/TeX','output/HTML-CSS'], "
                            +"extensions: ['tex2jax.js'], " 
                            +"TeX: { extensions: ['AMSmath.js','AMSsymbols.js',"
                              +"'noErrors.js','noUndefined.js'] } "
                          +"});</script>"
                          +"<script type='text/javascript' "
                          +"src='file:///android_asset/MathJax/MathJax.js'"
                          +"></script><span id='math'></span>","text/html","utf-8","");
    EditText e = (EditText) findViewById(R.id.edit);
    e.setBackgroundColor(Color.LTGRAY);
    e.setTextColor(Color.BLACK);
    e.setText("");
    Button b = (Button) findViewById(R.id.button2);
    b.setOnClickListener(this);
    b = (Button) findViewById(R.id.button3);
    b.setOnClickListener(this);
    b = (Button) findViewById(R.id.button4);
    b.setOnClickListener(this);
    TextView t = (TextView) findViewById(R.id.textview3);
    t.setMovementMethod(LinkMovementMethod.getInstance());
    t.setText(Html.fromHtml(t.getText().toString()));   

// Here is my added code.
 w.loadUrl("javascript:document.getElementById('math').innerHTML='\\\\["
               +doubleEscapeTeX("\\frac{1}2")+"\\\\]';");
 w.loadUrl("javascript:MathJax.Hub.Queue(['Typeset',MathJax.Hub]);");

}

Answer 1

you must copy assets folder to you'r assets folder of you'r app.

Answer 2

never put webView.loadWithBaseUrl(..) in the same process with webView.loadUrl(..). Because If webView.loadUrl(..) was loaded before webView.loadWithBaseUrl(..) finished, it will raise error and webView will display nothing

the solution is by separating them by using this code: `

private void initiateWebView(){

    webViewEquationDisplay.setWebViewClient(new WebViewClient() {
        @Override
        public void onPageFinished(WebView view, String url) {
            super.onPageFinished(view, url);

            if(Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT){
                loadUrlKitKat(equationSymbolFinal+equationToBeDisplayedFinal);
            }
            else{
                webViewEquationDisplay.loadUrl("javascript:document.getElementById('math').innerHTML='<font color=\"yellow\">`"+equationToBeDisplayedFinal+"`</font>';");
            }

            webViewEquationDisplay.loadUrl("javascript:MathJax.Hub.Queue(['Typeset',MathJax.Hub]);");
        }
    });

    final String mathJaxOfflineUrl = "file:///android_asset/MathJax/MathJax.js";            
    webViewEquationDisplay.loadDataWithBaseURL("http://bar/", "<script type='text/x-mathjax-config'>"
            +"MathJax.Hub.Config({ " 
                +"showMathMenu: false, "
                +"jax: ['input/AsciiMath','output/HTML-CSS'], "
                +"extensions: ['asciimath2jax.js'], " 
                +"AsciiMath: { fixphi: true, useMathMLspacing: true, displaystyle: false, decimalsign: \".\" }, "
              +"});</script>"
            +"<script type='text/javascript' "
              +"src='"+mathJaxOfflineUrl+"'"
              +"></script><span id='math'></span>","text/html","utf-8","");
}


@TargetApi(Build.VERSION_CODES.KITKAT)
private void loadUrlKitKat(String param){
    webViewEquationDisplay.evaluateJavascript("javascript:document.getElementById('math').innerHTML='<font color=\"#97FD97\">`"+param+"`</font>';",null);
}

`

Don't forget to add KITKAT support by using evaluateJavascript instead of loadUrl

Good luck