{% extends 'base.html' %}
{% block head_title %}Home{% endblock %}
{% block nosubheader %} {% endblock nosubheader %}
{% block title %}{% endblock title %}

{% block hero_subheader %}
    <div class="jumbotron">
        <div class="container">
            <div class="row">
                <div class="col-sm-12 col-md-8 col-md-offset-2">
                    <img src="{{STATIC_URL}}img/codalab-logo-onecolor-reverse.png" alt="CodaLab" class="img-responsive">
                </div>
            </div>
        </div>
    </div>
{% endblock hero_subheader %}

{% block content %}

    <div class="container">

        <div class="row">
          <div class="col-sm-6 competition-latest-list">
            <h2 class="homepage_headers">Popular Competitions</h2>
            {% if not latest_competitions %}
            <p><em>There are no competitions.</em></p>
            {% else %}
                {% for competition in latest_competitions %}
                    {% include "web/competition_latest.html" with competition=competition %}
                {% endfor %}
            {% endif %}
          </div>
            <div class="col-sm-6 competition-latest-list">
            <h2 class="homepage_headers">Featured Competitions</h2>
            {% if not featured_competitions %}
            <p><em>There are no competitions.</em></p>
            {% else %}
                {% for competition in featured_competitions %}
                    {% include "web/competition_latest.html" with competition=competition %}
                {% endfor %}
            {% endif %}
          </div>
        </div>
    </div>
{% endblock content %}
<script>
{% block js %}
    $(function () {
        $(".top-bar-section ul > li").removeClass("active");
    });

    function populate(frm, data) {
        $.each(data, function(key, value){
            var $ctrl = $('[name='+key+']', frm);
            switch($ctrl.attr("type"))
            {
                case "text":
                case "hidden":
                    $ctrl.val(value);
                    break;
                case "radio":
                case "checkbox":
                    $ctrl.each(function(){
                        if(value=='on') {
                            $(this).attr("checked",value);
                        }
                    });
                    break;
                default:
                    $ctrl.val(value);
            }
        });
    }
    $('.competition-tile').on('click',function(){
        var competitionID = $(this).find('#competitionID').val();
        window.location.href = '/competitions/' + competitionID;
    });

    var params = {}
    location.search.substr(1).split("&").forEach(function(item) {params[item.split("=")[0]] = item.split("=")[1]})

    populate('#search_form', params);
{% endblock js %}
</script>