{% extends "silpa.html" %}
{% block modulescript %}
<script type="text/javascript">
    $(document).ready(  () => {
        $("form").submit( (event) => {
            event.preventDefault();
            var id_result = $('#result'),
                id_error = $('#errormessage'),
                id_progress = $('#progress'),
                word1 = $("input[name=word1]", 'form').val(),
                word2 = $("input[name=word2]", 'form').val(),
                jsonRequest = {
                    "module": "libindic.soundex",
                    "method": "compare",
                    "params": [word1, word2],
                    "id": ""
                },
                messages = {
                    "-1": "Words does not match",
                    "0": "Both words are same",
                    "1": "Both words are from same language and sounds alike",
                    "2": "Words are from different language but sounds alike"
                };

            $.ajax({
                type: "POST",
                contentType: "application/json; charset=utf-8",
                url: "api",
                data: JSON.stringify(jsonRequest),
                dataType: "json",
                beforeSend: function () {
                    id_result.hide();
                    id_error.hide();
                    id_progress.html("Processing. Please Wait..").show();
                },
                success: function (response) {
                    id_progress.hide();
                    id_result.html(messages[response.result]).show();
                },
                error: function (msg) {
                    id_progress.hide();
                    id_error.html("Something went wrong. Please try again!").show();
                }
            });
        });

        $("input[type=button]", 'form').click(function (e) {
            var id_clicked = e.target.id.split("button")[1],
                id_error = $('#errormessage'),
                id_progress = $('#progress'),
                jsonRequest = {
                    "module": "libindic.soundex",
                    "method": "soundex",
                    "params": [
                        $("input[name=word" + id_clicked + "]", 'form').val()
                    ],
                    "id": ""
                };

            $.ajax({
                type: "POST",
                contentType: "application/json; charset=utf-8",
                url: "api",
                data: JSON.stringify(jsonRequest),
                dataType: "json",
                beforeSend: function () {
                    id_error.hide();
                    id_progress.html("Processing. Please Wait..").show();
                },
                success: function (msg) {
                    id_progress.hide();
                    $('#soundex' + id_clicked).html(msg.result).show();
                },
                error: function (msg) {
                    id_progress.hide();
                    id_error.html("Something went wrong. Please try again!").show();
                }
            });
        });
    });
</script>
{% endblock %}

{% block content %}
<div class="page-header">
    <h1>Indic Soundex</h1>
</div>

<p>Soundex Phonetic Code Algorithm Demo for Indian Languages. Supports all indian languages and English. Provides
    intra-indic string comparison</p>

<ul>
    <li><a href="http://thottingal.in/blog/2009/07/26/indicsoundex/">Read More about the algorithm </a></li>
    <li><a href="apis.html#soundex">Read about the JSON-RPC based APIs of SILPA for this service </a></li>
</ul>

<form id="soundex_form" action="" method="post">
    <div class="help-block">To get the soundex code for a word enter a word in the text box and press Soundex button.</div>

    <div class="form-group">
        <div class="form-group col-sm-3">
            <input type="text" name="word1" class="form-control ime" />
        </div>
        <input type="button" value="Soundex" class="btn btn-default" id="button1" />
    </div>
    <div id="soundex1" class="alert alert-info silpa-hide"></div>

    <div class="form-group">
        <div class="form-group col-sm-3">
            <input type="text" name="word2" class="form-control ime" />
        </div>
        <input type="button" value="Soundex" class="btn btn-default" id="button2" />
    </div>
    <div id="soundex2" class="alert alert-info silpa-hide"></div>


    <div class="form-group">
        <p class="help-block">To compare two words, enter the words in the above text boxes and press Compare button.</p>
        <input type="submit" id="compare" value="Compare" class="btn btn-default" />
    </div>
</form>

<div id="progress" class="alert alert-info silpa-hide"></div>
<div id="errormessage" class="alert alert-danger silpa-hide"></div>
<div id="result" class="alert alert-success silpa-hide"></div>
<hr />

<div class="well">
    <h3>Python Soundex API</h3>
    <p>
        This service provides indic soundex algorithm based soundex codes for a word
        <ul>
            <li>Method: modules.Soundex.soundex
                <ul>
                    <li>arg1 : the word</li>
                    <li>Return : The soundex code for the word</li>
                </ul>
            </li>
            <li>Method: modules.Soundex.compare
                <ul>
                    <li>arg1 : first word</li>
                    <li>arg2 : second word</li>
                    <li>Return : Returns 0 if both strings are same, 1 if strings
                        sound phonetically same and from same language, 2 if strings are
                        phonetically same and from different languages.
                        Returns -1 if strings are not equal.</li>
                </ul>
            </li>
        </ul>

        Sample usage is given below.
        <pre>
      >>>print libindic.soundex.soundex("&#3349;&#3390;&#3376;&#3405;&#8205;&#3364;&#3405;&#3364;&#3391;&#3349;&#3405;")
      &#3349;APKKBF0
      >>>print libindic.soundex.compare("&#3349;&#3390;&#3376;&#3405;&#8205;&#3364;&#3405;&#3364;&#3391;&#3349;&#3405;","&#2965;&#3006;&#2992;&#3021;&#2980;&#3007;&#2965;&#3021;")
      2</pre>
    </p>
</div>
{% endblock %}