{% extends "silpa.html" %}
{% block modulescript %}
<script>
$(document).ready(function() {
    function trim(s)
    {
        var l=0; var r=s.length -1;
        while(l < s.length && s[l] == ' ')
        {
            l++; 
        }
        while(r > l && s[r] == ' ')
        {
            r-=1;
        }
        return s.substring(l, r+1);
    }

    $("form").submit(function(event)
    {
        event.preventDefault();
        id_result = $('#result');
        id_error = $('#errormessage');
        id_progress = $('#progress');

        text= $("textarea[name=input_text]", 'form').val();
        var key= $("input[name=key]", 'form').val();
        var jsonRequest = {
            "method" : "inexactsearch.search",
            "params" : [text, key],
            "id" : ""
        };

        $.ajax({
            type: "POST",
            contentType: "application/json; charset=utf-8",
            url: "{{ url_for(main_page + '/JSONRPC' if not main_page == '/' else main_page + 'JSONRPC') }}",
            data: JSON.stringify(jsonRequest),
            dataType: "json",
            beforeSend:function(){
                id_result.hide();
                id_error.hide();
                id_progress.html("Searching. Please Wait...").show();
            },
            success: function(msg) {
                id_progress.hide();
                var resultobj= msg.result;
                var words = text.split(" ");
                var highlighted_text= "";
                for(var i=0; i<words.length; i++) {
                    if(trim(words[i]).length ==0) {
                        highlighted_text += " ";
                        continue;
                    }
                    if(trim(words[i]) == "\n") {
                        highlighted_text += "<br/>";
                        continue;
                    }
                    var weight = resultobj[words[i]];
                    if (weight >= 0.6) {
                        highlighted_text += "<span class='highlight' title='" + weight + "'>" + words[i] + "</span>";
                    }
                    else{
                        highlighted_text += "<span title='"+ weight + "'>" + words[i] + "</span> ";
                    }
                }
                id_error.hide();
                id_result.html(highlighted_text).show();
            },
            error: function(msg) {
                id_progress.hide();
                id_error.html("Something went wrong. Please try again!").show();
            }
        });
    });
});
</script>
{% endblock %}

{% block content %}
<div class="well">
  <h3>Approximate String Search</h3>
  <p align="justify">This is a <a href="http://en.wikipedia.org/wiki/Fuzzy_string_searching">Fuzzy string search</a> application. This application illustrates the combined use of <a href="http://en.wikipedia.org/wiki/Levenshtein_distance">Edit distance</a> and <a href="Soundex">Indic Soundex</a> algorithm.</p>
  <p align="justify">By mixing both written like(edit distance) and sounds like(soundex), we achieve an efficient aproximate string searching. This application is capable of cross language string search too. That means, you can search Hindi words in Malayalam text. If there is any Malayalam word, which is approximate transliteration of hindi word, or sounds alike the hindi words, it will be returned as an approximate match. The "written like" algorithm used here is a bigram average algorithm. The ratio of common bigrams in two strings and average number of bigrams will give a factor which is greater than zero and less than 1. Similarly the soundex algorithm also gives a weight. By selecting words which has comparison weight more than
        the threshold weight(which 0.6), we get the search results. </p>
  <form id="searchform" action="" method="post" class="form-search">
    <p class="help-block">Enter the text in the below textarea</p>
    <textarea name='input_text' id='input_text' rows="10" style="width: 98.5%;"></textarea>
    <span class="help-block"></span>
    <div class="input-append">
      <input type="text" id="key" name="key" class="span10 search-query" placeholder="Enter Text to Search for"/>
      <button  type="submit" id="Search" class="btn">Search</button>
  </form>
  <p>In the search result. move your mouse over the words to get the comparison weight.</p>
</div>
  <hr/>
  <div id="progress" class="alert alert-info hide"></div>
  <div id="successmessage" class="alert alert-success hide"></div>
  <div id="errormessage" class="alert alert-error hide"></div>
  <div id="result" class="alert alert-info hide"></div>
{% endblock %}
