summaryrefslogtreecommitdiffstats
path: root/src/templates/resource/steps/pod_definition.html
blob: 4392dbde9cf4584592ea5338d141b4718020fb97 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
{% extends "workflow/viewport-element.html" %}
{% block extrahead %}
<link href="/static/css/graph_common.css" rel="stylesheet">
<title>Pod Definition Prototype</title>

<!-- Loads and initializes the library -->
<script>
    var mxLoadStylesheets = false;
</script>
<script type="text/javascript" src="/static/js/mxClient.min.js" ></script>
<script type="text/javascript" src="/static/js/dashboard.js" ></script>
{% endblock extrahead %}

<!-- Calls the main function after the page has loaded. Container is dynamically created. -->
{% block content %}
    <div class="row p-0 w-100 mx-0 position-absolute overflow-hidden topToBottom">
        <div id="graphParent" class="col px-0">
            <div class="row">
                <div class="col pr-0">
                    <div id="toolbarContainer" class="bg-light pl-4"></div>
                </div>
            </div>
            <!-- Creates a container for the sidebar -->
            <div id="graphContainer"></div>
        </div>

        <div id="network_select" class="p-0 w-25 ml-auto col-2">
            <div class="px-0 mb-2">
                <!-- Creates a container for the outline -->
                <div id="outlineContainer" class="border"></div>
            </div>
            <div>
                <button id="btn_add_network" type="button" class="btn btn-primary w-100" onclick="network_step.newNetworkWindow();">Add Network</button>
            </div>
            <ul id="network_list" class="list-group">
            </ul>
            <button type="button" class="d-none" onclick="network_step.submitForm();">Submit</button>
        </div>
    </div>
    <form id="step_form" method="post">
        {% csrf_token %}
        <input type="hidden" id="hidden_xml_input" name="xml" />
    </form>
    <script type="text/javascript" src="/static/js/mxClient.min.js" ></script>
    <script>
        //gather context data
        let debug = false;
        {% if debug %}
        debug = true;
        {% endif %}

        let xml = '';
        {% if xml %}
        xml = '{{xml|safe}}';
        {% endif %}

        let hosts = [];
        {% for host in hosts %}
        hosts.push({{host|safe}});
        {% endfor %}

        let added_hosts = [];
        {% for host in added_hosts %}
        added_hosts.push({{host|safe}});
        {% endfor %}

        let removed_host_ids = {{removed_hosts|safe}};

        network_step = new NetworkStep(
            debug,
            xml,
            hosts,
            added_hosts,
            removed_host_ids,
            document.getElementById('graphContainer'),
            document.getElementById('outlineContainer'),
            document.getElementById('toolbarContainer'),
            document.getElementById('sidebarContainer')
        );
        form_submission_callbacks.push(() => network_step.prepareForm());
    </script>
{% endblock content %}
{% block onleave %}
network_step.submitForm();
{% endblock %}