{% extends 'layout.html' %}
{% block title %}Search{% endblock %}
{% block content %}
<script>
var idx = null;
var post_data = null;
var shown_ids = [];
var post_tpl = null;

function clear_posts() { 
    shown_ids = [];
    $('#posts').html('');
}    

function no_results() { 
    $('#posts').html('<p>No results</p>');
}

function sort_by_frequency(arr) {
    var frequency = {};

    arr.forEach(function(value) { frequency[value] = 0; });
    var uniques = arr.filter(function(value) {
        return ++frequency[value] == 1;
    });
    return uniques.sort(function(a, b) {
        return frequency[b] - frequency[a];
    });
}

function get_param(variable) {
    var query = window.location.search.substring(1);
    var vars = query.split("&");
    for (var i=0;i<vars.length;i++) {
        var pair = vars[i].split("=");
        if(pair[0] == variable){return decodeURIComponent(pair[1]);}
    }
    return false;
}

function list_post_by_id(id) {
    id = id.toString();
    if(shown_ids.indexOf(id) != -1) { 
        return false;
    }
    var file = idx.ids[id]; 
    if(!file) { 
        return false;
    }
    shown_ids.push(id);
    var post = post_data.info[file];
    html = post_tpl({'post':post});
    $('#posts').append(html);
}

function list_posts_by_tag(tag) { 
    clear_posts();
    for(var i=0; i<idx.tags[tag].length; i++) { 
        list_post_by_id(idx.tags[tag][i]);
    }
    $('#results').html('Results for tag "'+tag+'"');
}

function list_posts_by_query(search) {
    clear_posts(); 
    search = search.toLowerCase();
    search = search.replace(/\'/,'');
    search = search.replace(/[^a-z0-9\-]/g, ' ');
    var parts = search.split(' ');
    var to_show = [];
    for(var i=0; i<parts.length; i++) { 
        var ids = idx.index[parts[i]];
        if(ids) {
            for(var y=0; y<ids.length; y++) {
                to_show.push(ids[y]);
            }
        }
    }
    to_show = sort_by_frequency(to_show);
    for(var i=0; i<to_show.length; i++) { 
        list_post_by_id(to_show[i]);
    }
    if(to_show.length < 1) { 
        no_results();
    }
    $('#results').html('Results for query "'+search+'"');
}

function index_cb(data) { 
    idx = data;
    $.get('{{conf.web_prefix}}/{{conf.post_data_file}}',
        function(data) { 
            if(data) {
                post_data_cb(data);                
            }
        }
    ,"json");
}
function post_data_cb(data) { 
    $('#posts').html('Search index loaded');
    $('#taglist').show('fast');
    post_data = data;
    post_tpl = Mustache.compile($('#search_result_tpl').html());
    var q = get_param('q');
    if(q) { 
        list_posts_by_query(q);
        return;
    }
    var t = get_param('t');
    if(t) { 
        list_posts_by_tag(t);
    }
}


$(document).ready(function() { 
    // Get the search index file
    $('#posts').html('Loading search index...');
    $.get('{{conf.web_prefix}}/{{conf.index_file}}',
        function(data) { 
            if(data) {
                index_cb(data);                
            }
        }
    ,"json");
});
</script>
<div class="row">

<div class="col col-4">
    <div>
        <input type="text" id="search_text" class="input-text post-search-field"
            onkeydown="if (event.keyCode == 13) { $('#search_button').click(); return false; }"
            placeholder="Search" 
        />
        <button class="button post-search-btn"
            id="search_button"
            onclick="list_posts_by_query($('#search_text').val())">
            <span class="fontawesome-search"></span>
        </button>
    </div>
    {% include 'datelist.html' %}
</div>

<div class="col col-8">
    <div class="post-tags" id="taglist" style="display:none;">
      {% for t in ctrl.tags %}
        <a class="tag" href="#" 
            onclick="list_posts_by_tag('{{t|e}}'); return false;">{{t}} <span class="fontawesome-tag"></span></a>
      {% endfor %}
      <div class="clear"></div>
    </div>
    <h2 id="results">Results</h2>
    <div id="posts"></div>
</div>

<div class="clear"></div>
</div><!-- end row -->


{% include 'jstemplates.html' %}
{% endblock %}
