{% extends "base.html" %}
{% block title %}{{ flow.entry_point_contract_name }}.{{ flow.entry_point_function_name }}{{ flow.signature_suffix }} — Solidity Flow Navigator{% endblock %}
{% block body_class %}flow-page{% endblock %}

{% block head_extra %}
  <link rel="stylesheet" href="{{ url_for('static', filename='css/pygments.css') }}">
{% endblock %}

{% block content %}
{# v0.10.4: the back-link lives INSIDE the header's flex row. It was
   previously a position:fixed overlay at the header's coordinates, which
   sat on top of the title's first characters on every flow page. #}
<header class="flow-header">
  <nav class="flow-nav">
    <a class="back-link" href="{{ url_for('index') }}">&larr; index</a>
  </nav>
  <div class="flow-header-text">
    <h1 class="flow-title">
      <code>{{ flow.entry_point_contract_name }}.{{ flow.entry_point_function_name }}{{ flow.signature_suffix }}</code>
    </h1>
    {% set root = flow.root %}
    {% if root.invoked_via_contract_name != root.declarer_contract_name %}
      <p class="flow-subtitle">
        Inherited entry point — invoked on
        <code>{{ root.invoked_via_contract_name }}</code>,
        declared in <code>{{ root.declarer_contract_name }}</code>.
      </p>
    {% endif %}
  </div>
</header>

{# Stage 3 graph layout. Flow data is embedded inline; flow.js builds the
   dagre graph, measures rendered HTML nodes, lays out, and binds d3-zoom.
   The ``data-expand-all`` attribute is the v0.10.0 toggle (spec §10.2): the
   progressive renderer reads it on init and, when "true", expands every
   call site recursively before the first layout pass. #}
<script type="application/json" id="flow-data" data-expand-all="{{ 'true' if expand_all else 'false' }}">{{ flow_json | safe }}</script>

<div id="graph-frame" tabindex="0">
  <div id="graph">
    <svg id="edges" aria-hidden="true">
      <defs>
        <marker id="arrowhead" viewBox="0 0 10 10" refX="9" refY="5"
                markerWidth="6" markerHeight="6" orient="auto-start-reverse">
          <path d="M 0 0 L 10 5 L 0 10 z"></path>
        </marker>
      </defs>
    </svg>
    <div id="nodes"></div>
  </div>
  <button id="reset-view" type="button" title="Fit the whole tree in view (shortcut: R or 0)">Reset view</button>
</div>
{% endblock %}

{% block scripts %}
  <script src="{{ url_for('static', filename='vendor/dagre.min.js') }}"></script>
  <script src="{{ url_for('static', filename='vendor/d3.min.js') }}"></script>
  {# v0.10.0 Stage 2: the all-at-once renderer (flow.js) and the
     `--legacy` flag that selected it are retired. The bird's-eye-view
     use case is now `--expand-all` on this same renderer (spec §10.2). #}
  <script src="{{ url_for('static', filename='js/flow-progressive.js') }}"></script>
{% endblock %}