{% extends "_base.jinja" %}

{% from "_sidebar.jinja" import sidebar %}
{% from "_list.jinja" import list %}

{% block title %}Chart List - Polaris{% endblock %}

{% block script %}
  {{ super() }}
  <script src="{{ cdn_url_for('polaris.js') }}"></script>
{% endblock %}

{% block body %}
<body ng-controller="ChartListCtrl">
  {{ sidebar(icons=["fui-plus"], user=user, href={"fui-plus": "/chart/new"}) }}

  <div class="content">
    <div class="container" style="width: 67%;">
      <div class="title">Chart Library</div>
      <div class="button-container" style="margin-bottom:42px;text-align:center;">
        <div class="btn-group" style="float:none;">
          <a class="btn btn-info" ng-class="{active: selected == 'All'}" ng-click="selected = 'All'; libFilter = null" href="#">All</a>
          <a class="btn btn-info" ng-class="{active: selected == 'Public'}" ng-click="selected = 'Public'; libFilter = {is_public: true}" href="#">Public</a>
          <a class="btn btn-info" ng-class="{active: selected == 'Private'}" ng-click="selected = 'Private'; libFilter = {is_public: false}" href="#">Private</a>
          <a class="btn btn-info" ng-class="{active: selected == 'Sources'}" ng-click="selected = 'Sources'; libFilter = {user_id: '{{ user.id }}'}" href="#">Sources</a>
        </div>
      </div>
      {{ list(name="chart") }}
    </div>
  </div>
</body>
{% endblock %}
