{% extends "layout.html" %}
{% block title %}{{title}}{% endblock %}
{% block head %}
    <script>
select_account = function (account) {
            console.log("select account " + account)
            document.cookie="account="+account
};
    </script>
  {{ super() }}
{% endblock %}

{% block page %}{{title}}{% endblock %}
{% block heading %}
  {{ super() }}
{% endblock %}

{% block content %}
        <div id="page-wrapper">
            <div class="row">
                <div class="col-lg-12">
                    <h1 class="page-header">{{ _("Select Account") }}</h1>
                </div>
                <!-- /.col-lg-12 -->
            </div>
            <div class="row">
                {% for account in account_list %}
                    <div class="col-lg-3 col-md-4"> 
                       <div class="panel panel-primary"> 
                           <div class="panel-heading"> 
                               <div class="row"> 
                                   <div class="col-xs-9 text-left"> 
                                       <div class="fa-2x">{{ account }}</div>
                                   </div>
                               </div>
                           </div>
                           <a href="/" onclick="select_account('{{ account }}');">
                               <div class="panel-footer">
                                   <span class="pull-left">Select</span>
                                   <span class="pull-right"><i class="fa fa-arrow-circle-right"></i></span>
                                   <div class="clearfix"></div>
                               </div>
                           </a>
                       </div>
                    </div>
                {% endfor %}
            </div>
            <!-- /.row -->
        </div>
        <!-- /#page-wrapper -->

{% endblock %}
