{% extends "public.html" %}
{% load thumbnail %}

{% block whole_title %}Capability Cloud{% endblock %}

{% block banner_extra %}
    
    {% if homepage_settings.banner %}
        <div id="banner" class="jumbotron hidden-xs">
            <img class="item img-responsive fullsize" src="{{ homepage_settings.banner|thumbnail:'2400x704'}}" alt=""/>
            <div class="container">
                <div class="banner_inner">
                    <div class="banner_text">
                        <h1>{{ homepage_settings.banner_title }}</h1>
                        <h2>{{ homepage_settings.banner_subtitle }}</h2>
                    </div>

                    <div id="search">
                        <form class="form-inline" role="form" action="{% url 'audience_search' %}" method="post">
                            {% csrf_token %}
                            <div class="form-group">
                                <label for="id_audience" class="control-label">I am a...</label>
                                <select name="audience" class="form-control" id="id_audience">
                                    <option value="">Please Select</option>
                                    {% for search in audience_search %}
                                        <option value="{{ search.slug }}">{{ search }}</option>
                                    {% endfor %}
                                </select>
                            </div>
                            <div class="form-group">
                                <label for="id_content_type" class="control-label">Looking For...</label>
                                <select name="content_type" class="form-control" id="id_content_type">
                                    <option value="">Please Select</option>
                                    {% for search in content_type_search %}
                                        <option value="{{ search.slug }}">{{ search }}</option>
                                    {% endfor %}
                                </select>
                            </div>
                            <button type="submit" class="btn btn-primary button primary_button">Search</button>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    {% endif %}
    
{% endblock %}

{% block banner_mobile %}

    {% if homepage_settings.mobile_banner %}    
        <div id="banner_mob" class="jumbotron visible-xs-block">
            <img class="item img-responsive fullsize" src="{{ homepage_settings.mobile_banner|thumbnail:'768x376' }}" alt=""/>
        
            <div class="banner_inner">
                <div class="banner_text">
                    <h1>{{ homepage_settings.banner_title }}</h1>
                    <h2>{{ homepage_settings.banner_subtitle }}</h2>
                </div>
            </div>
        </div>
    {% endif %}
    
    <div id="mobile_search" class="row visible-xs-block">
        <div class='col-lg-12'>
            <form class="form-inline" role="form" action="{% url 'audience_search' %}" method="post">
                {% csrf_token %}
                <div class="form-group">
                    <label for="id_audience2" class="control-label">I am a...</label>
                    <select name="audience" class="form-control" id="id_audience2">
                        <option value="">Please Select</option>
                        {% for search in audience_search %}
                            <option value="{{ search.slug }}">{{ search }}</option>
                        {% endfor %}
                    </select>
                </div>
                <div class="form-group">
                    <label for="id_content_type2" class="control-label">Looking For...</label>
                    <select name="content_type" class="form-control" id="id_content_type2">
                        <option value="">Please Select</option>
                        {% for search in content_type_search %}
                            <option value="{{ search.slug }}">{{ search }}</option>
                        {% endfor %}
                    </select>
                </div>
                <button type="submit" class="btn btn-primary button primary_button">Search</button>
            </form>
        </div>
    </div>
    
{% endblock %}

{% block main_content %}
    <div id="actions" class="row">
        {% if block_layout %}
            {% include block_layout.get_public_template %}
        {% endif %}
	</div>
    
    <div id="home_content" class="row">
        <div class="text col-md-6">
            {{ homepage_settings.left_content|safe }}
        </div>
        <div class="text col-md-6">
            {{ homepage_settings.right_content|safe }}
        </div>
    </div>
    
{% endblock %}