{% extends "base.html" %}
{% load get %}
{% load staticfiles %}



{% block head_block %}
    {{ block.super }}
    <link rel="stylesheet" href="/static/bower_components/select2/dist/css/select2.min.css">
    <link rel="stylesheet" href="/static/css/lwuitable.css">

    <!-- Topology3D core CSS -->
    <link rel="stylesheet" href="/static/topology3D/css/graph_editor_d3js.css">
    <link rel="stylesheet" href="/static/topology3D/css/d3-context-menu.css">

{% endblock %}
{% block title_header_big %}
    {{ block.super }}
{% endblock %}
{% block left_sidebar %}
    {% include 'osm/osm_project_left_sidebar.html' %}
{% endblock %}


{% block breadcrumb_body %}
    {{ block.super }}
    <li><a href="#"><i class="fa fa-sitemap"></i> Composer</a></li>
{% endblock %}

{% block content_body %}
    {{ block.super }}
    {% csrf_token %}
    {% include 'modal/create_link_chooser.html' %}
    {% include 'modal/choose_node_id.html' %}
    <div class="row" >
        <div class="col-md-12">
            {% block topology_toolbar %}
                {{ block.super }}
                 {% include 'topology_toolbar.html' %}
            {% endblock %}
            <div id="graph_ed_container" style="width: 100%; height:100%; background-color: white; border: 2px #3c8dbc solid;">

            </div>
        </div>
    </div>



{% endblock %}

{% block resource_block %}
    {{ block.super }}
    <script>
        var topology_data = {};//{{topology_data|safe }};
    </script>
    <!-- Utility JS -->
    <script src="/static/bower_components/select2/dist/js/select2.js"></script>

    <!-- d3.js -->
    <script src="https://d3js.org/d3.v4.js"></script>
<!--
    <script src="/static/bower_components/d3/d3.js"></script>-->

    <!-- topology3D -->
    <script src="/static/topology3D/js/d3-context-menu.js"></script>
    <script src="/static/topology3D/js/event.js"></script>
    <script src="/static/topology3D/js/graph_editor.js"></script>
    <script src="/static/topology3D/js/graph_request.js"></script>
    <script src="/static/topology3D/js/model_graph_editor.js"></script>


    <script src="/static/src/osm_gui_properties.js"></script>
    <script src="/static/src/projecthandler/composer.js"></script>
    <script src="/static/src/projecthandler/osm/controller.js"></script>

{% endblock %}

{% block footer %}
    {% include "footer.html" %}
{% endblock %}