1 {% extends "workflow/viewport-element.html" %}
18 box-shadow: 0px 0px 7px 0px rgba(0,0,0,0.75);
19 transition-property: box-shadow;
20 transition-duration: 0.1s;
24 box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
25 transition-property: box-shadow;
26 transition-duration: 0.1s;
37 box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);
38 transition-property: box-shadow;
39 transition-duration: 0.1s;
42 box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.75);
43 transition-property: box-shadow;
44 transition-duration: 0.1s;
45 background-color: rgba(144,238,144,0.3);
48 background-color: lightgreen !important;
55 {% bootstrap_form_errors form type='non_fields' %}
56 <form id="host_select_form" action="/wf/workflow/" method="POST" class="form">
58 <input type="hidden" id="hidden_json_input", name="host"/>
60 <div id="host_select_container" class="booking_container">
63 var selected_host = null;
64 var initial = {{chosen|safe|default:'null'}};
66 function select(booking_id, host_name){
67 var input = document.getElementById("hidden_json_input");
68 input.value = JSON.stringify({"booking": booking_id, "name": host_name});
69 // clear out and highlist host
71 selected_host.classList.remove("selected");
73 selected_host = document.getElementById("booking_" + booking_id + "_host_" + host_name);
74 selected_host.classList.add("selected");
77 function draw_bookings(){
78 var booking_hosts = {{booking_hosts|safe}};
80 var container = document.getElementById("host_select_container");
81 for(var booking_id in booking_hosts){
82 var booking = document.createElement("DIV");
83 var heading = document.createElement("H3");
84 heading.appendChild(document.createTextNode("Booking " + booking_id));
85 booking.appendChild(heading);
86 booking.appendChild(document.createTextNode("start: " + booking_hosts[booking_id].start));
87 booking.appendChild(document.createElement("BR"));
88 booking.appendChild(document.createTextNode("end: " + booking_hosts[booking_id].end));
89 booking.appendChild(document.createElement("BR"));
90 booking.appendChild(document.createTextNode("purpose: " + booking_hosts[booking_id].purpose));
91 booking.appendChild(document.createElement("BR"));
92 booking.appendChild(document.createTextNode("hosts:"));
93 booking.id = "booking_" + booking_id;
94 booking.className = "booking";
95 var hosts = booking_hosts[booking_id].hosts;
96 for(var i=0; i<hosts.length; i++){
97 var host = document.createElement("DIV");
98 host.id = "booking_" + booking_id + "_host_" + hosts[i].name;
99 host.classList.add("host");
100 host.appendChild(document.createTextNode(hosts[i].name));
101 var hostname = hosts[i].name;
102 host.booking = booking_id;
103 host.hostname = hostname;
104 host.onclick = function() {
105 select(this.booking, this.hostname);
107 booking.appendChild(host);
109 bookings.push(booking);
110 container.appendChild(booking);
115 select(initial.booking_id, initial.hostname);
118 {% endblock content %}
121 var ajaxForm = $("#host_select_form");
122 var formData = ajaxForm.serialize();
123 req = new XMLHttpRequest();
124 req.open("POST", "/wf/workflow/", false);
125 req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
126 req.onerror = function() { alert("problem submitting form"); }