6 <!-- <link rel="stylesheet" type="text/css" href="/styles/main.css" /> -->
7 <%include ../../partials/head%>
8 <link rel="stylesheet" type="text/css" href="/styles/starter.css" />
9 <link rel="stylesheet" href="/node_modules/xterm/css/xterm.css" />
10 <!-- <link rel="stylesheet" href="/node_modules/xterm/dist/addons/fullscreen/fullscreen.css" /> -->
11 <script src="https://cdnjs.cloudflare.com/ajax/libs/es6-promise/4.1.1/es6-promise.auto.min.js"></script>
12 <script src="https://cdnjs.cloudflare.com/ajax/libs/fetch/1.0.0/fetch.min.js"></script>
13 <script src="/node_modules/xterm/lib/xterm.js"></script>
14 <script src="/node_modules/xterm-addon-fit/lib/xterm-addon-fit.js"></script>
15 <script src="/node_modules/xterm-addon-attach/lib/xterm-addon-attach.js"></script>
16 <!-- <script src="/node_modules/xterm/dist/addons/winptyCompat/winptyCompat.js"></script> -->
20 <%include ../../partials/header%>
30 <textarea class="text" rows="20" cols="7" id="comandos" placeholder="Definicion de la red como: h1:s1"></textarea>
32 <button type="button" name="button" onclick="startvsorc()">Iniciar VSoRC</button>
33 <button type="button" name="button" onclick="stopvsorc()">Detener VSoRC</button>
34 <button type="button" name="button" onclick="startcontroller()">Iniciar controlador</button>
35 <button type="button" name="button" onclick="stopcontroller()">Detener controlador</button>
40 <textarea class="text" style="font-size: 12px;" disabled rows="20" cols="7" id="vsorcout" placeholder="Salida del sistema de consola"></textarea>
42 <button type="button" name="button" onclick="pingall()">Ping all</button>
43 <button type="button" name="button" onclick="placement()">Placement</button>
44 <button type="button" name="button" onclick="iperf()">Iperf3</button>
53 <textarea class="text" style="font-size: 12px;" disabled rows="20" cols="7" id="controllerout" placeholder="Salida del controlador"></textarea>
56 <div class="terminal"></div>
60 <script type="text/javascript">
64 let topo = document.getElementById('comandos') //Donde van escrito el DSL
65 let vsorcout = document.getElementById('vsorcout') //salida del vsorc
66 let controllerout = document.getElementById('controllerout') //salida del controlador
69 let timeController = 1000;
70 //Estos time son para especificar cada cuantos ms se pedira leer la data de los archivos aichivo y controllerout
72 let intervalController = null;//Para tener el id del interval para obtener data del controller
73 let intervalVsorc = null; //Para tener el id del interval para obtener data del vsorc
75 function startcontroller() {
76 let xhr = new XMLHttpRequest();
77 xhr.open('GET', '/startcontroller', true);
78 //console.log(xhr); //para ver en la consola
79 xhr.onload = function() {
80 if (xhr.status == 200) { //can use this.status instead
81 console.log("controller started");
85 intervalController=setInterval(getcontrollerdata, timeController);
88 function stopcontroller() {
89 let xhr = new XMLHttpRequest();
90 xhr.open('GET', '/stopcontroller', true);
91 xhr.onload = function() {
92 if (xhr.status == 200) { //can use this.status instead
93 //console.log(xhr.responseText);// para ver en la consola
94 console.log("controller stoped");
98 clearInterval(intervalController);
99 controllerout.value='';
101 function getcontrollerdata() {
102 let xhr = new XMLHttpRequest();
103 xhr.open('GET', '/getcontrollerdata', true);
104 xhr.onload = function() {
105 if (xhr.status == 200) { //can use this.status instead
106 //console.log(xhr.responseText);// para ver en la consola
107 controllerout.value=xhr.response;
108 console.log("getting controller data");
113 controllerout.scrollTop = controllerout.scrollHeight;
116 function startvsorc() {
117 let xhr = new XMLHttpRequest();
118 topology = JSON.stringify(topo.value)
119 xhr.open('GET', '/startvsorc?topology=' + topology, true);
120 xhr.onload = function() {
121 if (xhr.status == 200) { //can use this.status instead
122 //console.log(xhr.responseText);// para ver en la consola
123 console.log("vsorc started");
127 intervalVsorc = setInterval(getvsorcdata, timeVsorc);
130 function stopvsorc() {
131 let xhr = new XMLHttpRequest();
132 xhr.open('GET', '/stopvsorc', true);
133 xhr.onload = function() {
134 if (xhr.status == 200) { //can use this.status instead
135 //console.log(xhr.responseText);// para ver en la consola
137 console.log("vsorc stopped");
141 clearInterval(intervalVsorc);
145 function getvsorcdata() {
146 let xhr = new XMLHttpRequest();
147 xhr.open('GET', '/getvsorcdata', true);
148 xhr.onload = function() {
149 if (xhr.status == 200) { //can use this.status instead
150 //console.log(xhr.responseText);// para ver en la consola
151 vsorcout.value=xhr.response;
152 console.log("getting vsorc data");
159 vsorcout.scrollTop = vsorcout.scrollHeight;
162 let xhr = new XMLHttpRequest();
163 xhr.open('GET', '/pingall', true);
164 xhr.onload = function() {
165 if (xhr.status == 200) { //can use this.status instead
166 //console.log(xhr.responseText);// para ver en la consola
167 vsorcout.value+=xhr.response;
168 console.log("pingall");
177 let xhr = new XMLHttpRequest();
178 xhr.open('GET', '/iperf', true);
179 xhr.onload = function() {
180 if (xhr.status == 200) { //can use this.status instead
181 //console.log(xhr.responseText);// para ver en la consola
182 vsorcout.value+=xhr.response;
183 console.log("pingall");
190 function placement() {
191 let xhr = new XMLHttpRequest();
192 xhr.open('GET', '/placement', true);
193 xhr.onload = function() {
194 if (xhr.status == 200) { //can use this.status instead
195 //console.log(xhr.responseText);// para ver en la consola
196 vsorcout.value+=xhr.response;
197 console.log("placement");
204 ///////////////////////////////////////////////////////////////////////CODIGO DE LA terminal
205 // No idea what these are about. Just copied them from the demo code
206 // Terminal.applyAddon(attach);
207 // Terminal.applyAddon(fit);
208 // Terminal.applyAddon(winptyCompat);
211 // const fitAddon = new FitAddon();
212 // term.loadAddon(fitAddon);
215 const term = new Terminal();
216 // No idea what this does
217 // term.winptyCompatInit();
218 // This kinda makes sense
219 const container = document.getElementById('terminal');
220 term.open(container);
221 // Open the websocket connection to the backend
222 const protocol = (location.protocol === 'https:') ? 'wss://' : 'ws://';
223 const port = location.port ? `:${location.port}` : '';
224 const socketUrl = `${protocol}${location.hostname}${port}/shell`;
225 const socket = new WebSocket(socketUrl);
226 const attachAddon = new AttachAddon(socket);
227 term.loadAddon(attachAddon);
228 // Attach the socket to the terminal
229 socket.onopen = (ev) => { term.attach(socket); };
230 // Not going to worry about close/error for the websocket
231 //////////////////////////////////////////////////////////////////////FIN DEL CODIGO DE LA TERMINAL
236 <%include ../../partials/footer%>