mods on starter
[VSoRC/.git] / src / views / starter.ejs
index de1868b9c452d0361a091817058e84937a37fca6..10988092443b910c57c4627afbe4edde0d2c7afd 100644 (file)
   <title></title>
   <!-- <link rel="stylesheet" type="text/css" href="/styles/main.css" /> -->
   <%include ../../partials/head%>
-  <style media="screen">
-    body{
-      display: flex;
-      flex-flow: row wrap;
-    }
-    main{
-      flex-grow: 2;
-    }
-    aside{
-      flex-grow: 1;
-    }
-    footer{
-      position: absolute;
-      top: 100%;
-    }
-
-    input[type="text"]{
-      background-color: rgba(200,200,200,0.5);
-      border: 0;
-      border-bottom: 2px black solid;
-      overflow: hidden;
-      width: 15em;
-    }
-    button{
-      border: 0;
-      border-bottom: 2px black solid;
-      overflow: hidden;
-      width: 15em;
-      background-color: white;
-    }
-  </style>
+  <link rel="stylesheet" type="text/css" href="/styles/starter.css" />
+
 </head>
 <header>
   <%include ../../partials/header%>
 </header>
+
 <body>
 
   <main>
-      <button type="button" name="button" onclick="startcontroller()">Iniciar controlador</button>
-      <button type="button" name="button" onclick="stopcontroller()">Detener controlador</button>
-      <button type="button" name="button" onclick="startvsorc()">Iniciar VsoRc</button>
-      <button type="button" name="button" onclick="stopvsorc()">Detener VsoRc</button>
+    <div class="side">
+
+      <div class="panel">
+        <textarea class="text" rows="20" cols="7" id="comandos" placeholder="Definicion de la red como: H1:S1"></textarea>
+        <div class="buttons">
+          <button type="button" name="button" onclick="startvsorc()">Iniciar VSoRC</button>
+          <button type="button" name="button" onclick="stopvsorc()">Detener VSoRC</button>
+          <button type="button" name="button" onclick="startcontroller()">Iniciar controlador</button>
+          <button type="button" name="button" onclick="stopcontroller()">Detener controlador</button>
+        </div>
+      </div>
+
+      <div class="panel">
+        <textarea class="text" disabled rows="20" cols="7" id="vsorcout" placeholder="Salida del sistema de consola"></textarea>
+        <div class="buttons">
+          <button type="button" name="button" onclick="startvsorc()">Ping all</button>
+          <button type="button" name="button" onclick="stopvsorc()">Placement</button>
+          <button type="button" name="button" onclick="startcontroller()">Iperf3</button>
+        </div>
+      </div>
+
+    </div>
+
+    <div class="side">
+
+      <div class="panel">
+        <textarea class="text" disabled rows="20" cols="7" id="vsorcout" placeholder="Salida del controlador"></textarea>
+      </div>
+
+      <div class="panel">
+
+      </div>
+
+    </div>
+
     <script type="text/javascript">
+      let topo = document.getElementById('comandos') //Donde van escrito el DSL
+
 
-    function stopcontroller() {
-      let xhr = new XMLHttpRequest();
-      xhr.open('GET', '/stopcontroller', true);
-      xhr.onload = function() {
-        if (xhr.status == 200) { //can use this.status instead
-          //console.log(xhr.responseText);// para ver en la consola
-          console.log("controller stoped");
+
+      function stopcontroller() {
+        let xhr = new XMLHttpRequest();
+        xhr.open('GET', '/stopcontroller', true);
+        xhr.onload = function() {
+          if (xhr.status == 200) { //can use this.status instead
+            //console.log(xhr.responseText);// para ver en la consola
+            console.log("controller stoped");
+          }
         }
+        xhr.send();
+
       }
-      xhr.send();
-    }
 
-    function startcontroller() {
-      let xhr = new XMLHttpRequest();
-      xhr.open('GET', '/startcontroller', true);
-      //console.log(xhr); //para ver en la consola
-      xhr.onload = function() {
-        if (xhr.status == 200) { //can use this.status instead
+      function startcontroller() {
+        let xhr = new XMLHttpRequest();
+        xhr.open('GET', '/startcontroller', true);
+        //console.log(xhr); //para ver en la consola
+        xhr.onload = function() {
+          if (xhr.status == 200) { //can use this.status instead
 
-          console.log("controller started");
+            console.log("controller started");
+          }
         }
+        xhr.send();
       }
-      xhr.send();
-    }
 
       function startvsorc() {
-          let xhr = new XMLHttpRequest();
-          xhr.open('GET', '/startvsorc', true);
-          xhr.onload = function() {
-            if (xhr.status == 200) { //can use this.status instead
-              //console.log(xhr.responseText);// para ver en la consola
-              console.log("vsorc started");
-            }
+        let xhr = new XMLHttpRequest();
+        topology = JSON.stringify(topo.value)
+        xhr.open('GET', '/startvsorc?topology=' + topology, true);
+        xhr.onload = function() {
+          if (xhr.status == 200) { //can use this.status instead
+            //console.log(xhr.responseText);// para ver en la consola
+            console.log("vsorc started");
           }
-          xhr.send();
         }
-        function stopvsorc() {
-            let xhr = new XMLHttpRequest();
-            xhr.open('GET', '/stopvsorc', true);
-            xhr.onload = function() {
-              if (xhr.status == 200) { //can use this.status instead
-                //console.log(xhr.responseText);// para ver en la consola
-                console.log("vsorc stopped");
-              }
-            }
-            xhr.send();
+
+        xhr.send();
+
+      }
+
+      function stopvsorc() {
+        let xhr = new XMLHttpRequest();
+        xhr.open('GET', '/stopvsorc', true);
+        xhr.onload = function() {
+          if (xhr.status == 200) { //can use this.status instead
+            //console.log(xhr.responseText);// para ver en la consola
+            console.log("vsorc stopped");
           }
+        }
+        xhr.send();
+      }
     </script>
   </main>
-  <aside class="">
-    <div class="statuscontroller">
-
-    </div>
-    <div class="statusproyect">
-
-    </div>
-  </aside>
 </body>
 <footer>
   <%include ../../partials/footer%>
 </footer>
 
 
-</html>
+</html>
\ No newline at end of file