superset2/dashed/templates/dashed/dashboard.html

{% extends "dashed/basic.html" %}

{% block head_js %}
  {{ super() }}
  <script src="/static/assets/javascripts/dist/dashboard.entry.js"></script>
{% endblock %}
{% block title %}[dashboard] {{ dashboard.dashboard_title }}{% endblock %}
{% block body %}
<div class="dashboard container-fluid" data-dashboard="{{ dashboard.json_data }}" data-css="{{ dashboard.css }}">

<!-- Modal -->
<div class="modal fade" id="css_modal" tabindex="-1" role="dialog">
  <div class="modal-dialog" role="document">
    <div class="modal-content css">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Dashboard CSS</h4>
        <h6><strong>Styling applies to this dashboard only</strong></h6>
      </div>
      <div class="modal-body">
        <select id="css_template" class="select2" style="margin-bottom: 5px;">
          <option value="" data-css="">CSS template</option>
          {% for t in templates %}
            <option value="{{ t.id }}" data-css="{{t.css}}">
              {{ t.template_name }}
            </option>
          {% endfor %}
        </select><br>
        <textarea id="dash_css" rows="30" cols="60">{{ dashboard.css }}</textarea>
        <input type="hidden" id="dashboard_id" value="{{ dashboard.id }}" />
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">
          Close
        </button>
      </div>
    </div>
  </div>
</div>

<div class="title">
    <div class="row">
      <div class="col-md-3"></div>
      <div class="col-md-6">
        <h2>
          <span class="favstar" class_name="Dashboard" obj_id="{{ dashboard.id }}"></span>
          {{ dashboard.dashboard_title }}
        </h2>
      </div>
      <div class="col-md-3">
        <div class="btn-group pull-right" role="group" >
          <button type="button" id="refresh_dash" class="btn btn-default" data-toggle="tooltip" title="Force refresh the whole dashboard">
            <i class="fa fa-refresh"></i>
          </button>
          <button type="button" id="filters" class="btn btn-default" data-toggle="tooltip" title="View the list of active filters">
            <i class="fa fa-filter"></i>
          </button>
          <button type="button" id="css" class="btn btn-default" data-toggle="modal" data-target="#css_modal">
            <i class="fa fa-css3" data-toggle="tooltip" title="Edit the dashboard's CSS"></i>
          </button>
          <a id="editdash" class="btn btn-default" href="/dashboardmodelview/edit/{{ dashboard.id }}" title="Edit this dashboard's property" data-toggle="tooltip" >
              <i class="fa fa-edit"></i>
          </a>
          <button type="button" id="savedash" class="btn btn-default" data-toggle="tooltip" title="Save the current positioning and CSS">
            <i class="fa fa-save"></i>
          </button>
        </div>
      </div>
    </div>
</div>
<div class="gridster content_fluid" style="visibility: hidden;">
    <ul>
        {% for slice in dashboard.slices %}
          {% set pos = pos_dict.get(slice.id, {}) %}
          {% set viz = slice.viz %}

          <li
            id="slice_{{ slice.id }}"
            slice_id="{{ slice.id }}"
            class="widget {{ slice.viz.viz_type }}"
            data-row="{{ pos.row or 1 }}"
            data-col="{{ pos.col or loop.index }}"
            data-sizex="{{ pos.size_x or 4 }}"
            data-sizey="{{ pos.size_y or 4 }}">

            <div class="row chart-header">

              <div class="col-md-12 text-center header">
                {{ slice.slice_name }}
              </div>
              <div class="col-md-12 chart-controls">
                <div class="pull-left">
                  <a title="Move chart" data-toggle="tooltip">
                    <i class="fa fa-arrows drag"></i>
                  </a>
                  <a class="refresh" title="Force refresh data" data-toggle="tooltip">
                    <i class="fa fa-repeat"></i>
                  </a>
                </div>
                <div class="pull-right">
                  {% if slice.description %}
                    <a title="Toggle chart description">
                      <i class="fa fa-info-circle slice_info" slice_id="{{ slice.id }}" title="{{ slice.description }}" data-toggle="tooltip"></i>
                    </a>
                  {% endif %}
                  <a href="{{ slice.edit_url }}" title="Edit chart" data-toggle="tooltip">
                    <i class="fa fa-pencil"></i>
                  </a>
                  <a href="{{ slice.slice_url }}" title="Explore chart" data-toggle="tooltip">
                    <i class="fa fa-share"></i>
                  </a>
                  <a class="remove-chart" title="Remove chart from dashboard" data-toggle="tooltip">
                    <i class="fa fa-close"></i>
                  </a>
                </div>
              </div>

            </div>
            <div
              class="slice_description bs-callout bs-callout-default"
              style="{{ 'display: none;' if "{}".format(slice.id) not in dashboard.metadata_dejson.expanded_slices }}">
                        {{ slice.description_markeddown | safe }}
            </div>
            <div class="row chart-container">
              <input type="hidden" slice_id="{{ slice.id }}" value="false">
              <div id="{{ viz.token }}" class="token col-md-12">
                <img src="{{ url_for("static", filename="assets/images/loading.gif") }}" class="loading" alt="loading">
                <div class="slice_container" id="{{ viz.token }}_con"></div>
              </div>
            </div>
          </li>

        {% endfor %}
    </ul>
</div>
</div>
{% endblock %}