virtual-labs · goyalchirag2222 · Feb 10, 2025 · Jan 23, 2025 · Jan 23, 2025
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1 @@
+node_modules
diff --git a/experiment-descriptor.json b/experiment-descriptor.json
@@ -2,6 +2,7 @@
   "unit-type": "lu",
   "label": "",
   "basedir": ".",
+  "services": ["VLAB_SVC_OCTAVE_ANN"],
   "units": [
     {
       "unit-type": "aim"
@@ -13,7 +14,7 @@
       "unit-type": "task",
       "content-type": "text"
     },
-   
+
     {
       "target": "procedure.html",
       "source": "procedure.md",
@@ -28,7 +29,7 @@
       "unit-type": "task",
       "content-type": "simulation"
     },
-	{
+    {
       "target": "observations.html",
       "source": "observations.md",
       "label": "Observations",
@@ -42,7 +43,7 @@
       "unit-type": "task",
       "content-type": "text"
     },
-    
+
     {
       "target": "references.html",
       "source": "references.md",

diff --git a/experiment/simulation/css/main.css b/experiment/simulation/css/main.css
@@ -1 +1,4 @@
-/* You CSS goes in here */
+#heading {
+    text-align: center;
+    font-family: 'Roboto Slab', serif;
+}
diff --git a/experiment/simulation/exp.css b/experiment/simulation/exp.css
diff --git a/experiment/simulation/exp.html b/experiment/simulation/exp.html
diff --git a/experiment/simulation/exp.js b/experiment/simulation/exp.js
diff --git a/experiment/simulation/index.html b/experiment/simulation/index.html
@@ -1,14 +1,79 @@
 <!DOCTYPE html>
-<html>
+<html lang="en">
+
 <head>
-	<!-- Add CSS at the head of HTML file -->
+    <meta charset="UTF-8">
+    <title>CLNN</title>
     <link rel="stylesheet" href="./css/main.css">
 </head>
+
 <body>
-		<!-- Your code goes here-->
+    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
+        integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous" />
+    <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"
+        integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"
+        crossorigin="anonymous"></script>
+    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"
+        integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6"
+        crossorigin="anonymous"></script>
+    <div class="container-fluid p-4">
+        <div class="row no-gutters">
+            <div class="col">
+
+                <form name="myform" method="post">
+                    <div class="form-group">
+
+                        <label>
+                            Type of mapping
+                            <select name="mapping" class="custom-select">
+                            </select>
+                        </label>
+
+                        <label>
+                            Region
+                            <select name="region" class="custom-select">
+                            </select>
+                        </label>
+                    </div>
+
+                    <div class="form-group">
 
-		<!-- Add JS at the bottom of HTML file -->
-		<iframe src="exp.html" width="1200" height="1000"></iframe>
-        <script src="./js/main.js"></script>
+                        <label>
+                            Number of data points
+                            <select name="numDataPoints" class="custom-select">
+                            </select>
+                        </label>
+
+                        <label>
+                            Number of iterations
+                            <select name="numIterations" class="custom-select">
+                            </select>
+                        </label>
+
+                        <label>Iteration step size: <input class="form-control" type="text" name=NIstep></label>
+                    </div>
+
+                    <div class="form-group">
+                        <button class="btn btn-primary" type="submit" name="generateData" value="Generate data"
+                            onclick="jssetgenflag();">Generate data
+                        </button>
+                        <button class="btn btn-primary" type="submit" name="nextIteration" value="Next iteration"
+                            onclick="jssetiternflag();">Next
+                            iteration
+                        </button>
+                    </div>
+
+                    <input type=hidden name=genflag value=0>
+                    <input type=hidden name=iternflag value=0>
+                </form>
+            </div>
+            <div class="col image-container">
+            </div>
+        </div>
+    </div>
+    <script src="./js/utils.js"></script>
+    <script src="./js/main.js"></script>
 </body>
-</html>
+
+</html>
diff --git a/experiment/simulation/js/main.js b/experiment/simulation/js/main.js
@@ -1 +1,34 @@
-//Your JavaScript goes in here
+window.EXP_NAME = "clnn";
+const map_arr = {1: "2D-2D"};
+const region_arr = {1: "Square", 2: "Circle", 3: "Triangle"};
+const numDataPoints_arr = {100: "100", 300: "300", 1000: "1000"};
+const numIterations_arr = {20: "20", 50: "50", 100: "100"};
+
+const typeOfMapping = 1;
+const regionType = 1;
+const numIterations = 20;
+const numDataPoints = 100;
+const NIstep = 1;
+
+let isSetGen = true;
+
+function jssetgenflag() {
+    isSetGen = true;
+}
+
+function jssetiternflag() {
+    isSetGen = false;
+}
+
+window.extraArgs = function () {
+    return {type: isSetGen ? "1" : "0", inputDim: "2"};
+};
+window.appenditure = {
+    "mapping": map_arr,
+    "region": region_arr,
+    "numDataPoints": numDataPoints_arr,
+    "numIterations": numIterations_arr
+};
+
+
+window.otherSetters = {NIstep};
diff --git a/experiment/simulation/js/utils.js b/experiment/simulation/js/utils.js
@@ -1,7 +1,8 @@
-window.SERVER =
-  "svc-test.vlabs.ac.in/octave-ann";
+// window.SERVER =
+//   "svc-test.vlabs.ac.in/octave-ann";
 
 function submitForm() {
+  const SERVER = window.vlabsConfig.service["VLAB_SVC_OCTAVE_ANN"];
   const $form = $('form[name="myform"]');
 
   let args = $form.serializeArray().reduce((prev, cur) => {
@@ -11,7 +12,7 @@ function submitForm() {
   if (window.extraArgs) args = { ...args, ...window.extraArgs() };
 
   $.ajax({
-    url: SERVER + "/exp-" + window.EXP_NAME,
+    url: SERVER.url + "/exp-" + window.EXP_NAME,
     type: "POST",
     headers: {
       token: localStorage.getItem("token"),
@@ -71,10 +72,11 @@ function appendOptions(elm, list) {
 }
 
 function onload() {
+  const SERVER = window.vlabsConfig.service["VLAB_SVC_OCTAVE_ANN"];
   if (document.readyState === "complete") {
     if (!localStorage.getItem("token")) {
       $.get(
-        `${SERVER}/get_token`,
+        `${SERVER.url}/get_token`,
         (success = function (data) {
           localStorage.setItem("token", data);
         })