virtual-labs-archive · saum7800 · Jun 26, 2019 · Jun 27, 2019 · Jun 28, 2019 · Jul 1, 2019
diff --git a/SRIP/Codes/sop_srip.css b/SRIP/Codes/sop_srip.css
@@ -0,0 +1,67 @@
+*{
+  font-family:sans-serif;
+}
+
+html{
+   background:url(https://bbl.solutions/wp-content/uploads/2014/11/Blog-background-white-HNM-blue-gradient-blue-gear-2.png);
+   background-size: cover;
+}
+
+#heading{
+	background-color: lightblue;
+	color:white;
+	text-align: center;
+	border-style: solid;
+  padding-top:10px;
+  padding-bottom:10px;
+ }
+
+
+.btn {
+    border: none;
+    padding: 14px 28px;
+    font-size: 16px;
+    cursor: pointer;
+    background-color:lightblue;
+    text-align: center;
+    background-origin: padding-box;
+     border-radius:10px;
+  }
+.btn:hover{
+  background:orange;
+}
+
+  #centre_button{
+      text-align: center;
+  }
+
+#flex-container{
+  display:flex;
+  flex-direction:row-reverse;
+  justify-content:space-around;
+  align-content:center;
+}
+
+table,th,td{
+border:1px solid lightblue;
+  border-collapse: collapse;
+}
+
+td{
+  height:30px;
+  padding:5px;
+}
+
+input{
+  border:none;
+}
+
+input:hover{
+  background:lightCyan;
+}
+
+#one{
+  margin-bottom:20px;
+  float: right;
+  margin-right: 2%;
+}
diff --git a/SRIP/Codes/sop_srip.html b/SRIP/Codes/sop_srip.html
@@ -0,0 +1,56 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <title>sop</title>
+    <script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
+    <script src="sop_srip.js"></script>
+    <link rel="stylesheet" type="text/css" href="sop_srip.css">  
+</head>
+
+<body>
+        <h1 id="heading">SOP</h1>
+
+        <div id="centre_button">
+        <button class="btn" onclick="initSOM()">Initialize SOM</button>
+        <button class="btn" onclick="window.open('help.html','_blank')">Next City</button>
+        <button class="btn" onclick="setNewValues()">Next Iteration</button>
+        <button class="btn" onclick="document.location.reload(true)">Reset</button>
+    </div>
+       <br><br>
+
+  <div id="flex-container">
+      <div id="city-coordinates"></div>
+
+    <table id="one">
+        <tr>
+            <th>Variable</th>
+            <th>Value</th> 
+        </tr>
+        <tr>
+            <td>Number of cities</td>
+            <td><input type="text" autocomplete="off" id="numCities" value='20'></td>
+        </tr>
+        <tr>
+            <td>Number of Nodes</td>
+            <td><input type="text" autocomplete="off" id="numNodes" value='40'></td>
+        </tr>
+        <tr>
+            <td>Number of iterations</td>
+            <td><input type="text" autocomplete="off" id="numIter" value='20'></td>
+        </tr>
+        <tr>
+            <td>City Step Size</td>
+            <td><input type="text" autocomplete="off" id="cityStep" value='1'></td>
+        </tr>
+        <tr>
+            <td>Iteration step size</td>
+            <td><input type="text" autocomplete="off" id="iterStep" value='1'></td>
+        </tr>
+    </table>
+    <div id="weight-coordinates"></div> 
+  </div> 
+</body>
+
+</html>
diff --git a/SRIP/Codes/sop_srip.js b/SRIP/Codes/sop_srip.js
@@ -0,0 +1,155 @@
+//console.log("whaaaat!");
+let tau0 = 1.0;
+let tauT = tau0;
+let currentCityIndex =1;
+let currentIterationIndex =1;
+let pi=3.14159;
+let numCities;
+let numNodes;
+let numIterations;
+let cityStep;
+let iterStep;
+let cityData=[];
+cityData[0]=[];
+cityData[1]=[];
+let weights=[];
+weights[0]=[];
+weights[1]=[];
+weights[2]=[];
+weights[3]=[];
+
+function setValues()
+{
+     numCities=parseInt(document.getElementById("numCities").value);
+     numNodes=parseInt(document.getElementById("numNodes").value);
+     numIterations=parseInt(document.getElementById("numIter").value);
+     cityStep=parseInt(document.getElementById("cityStep").value);
+     iterStep=parseInt(document.getElementById("iterStep").value);     
+//    console.log(isNaN(i));
+}
+
+function setData()
+{
+    for(let i=0;i<numCities;i++)
+    {
+        cityData[0][i]=Math.random();
+        cityData[1][i]=Math.random();
+    }
+}
+
+function setWeights()
+{
+    let r=[];
+    let theta=[];
+    for(let i=0;i<numNodes;i++)
+    {
+        r=1.0;
+        theta=(pi/(numNodes-1)) + 2*pi*(i)/(numNodes-1);
+        let x= r * Math.cos(theta);
+        let y= r * Math.sin(theta);
+        weights[0][i]=x;
+        weights[1][i]=y;
+        weights[2][i]=Math.random();
+        weights[3][i]=Math.random();
+    }
+}
+
+function plotData()
+{
+    let drawdata = {
+        x: cityData[0],
+        y: cityData[1],
+        mode: 'markers',
+        type: 'scatter',
+        hoverinfo: 'skip',
+        marker: {
+            size: 10,
+            symbol: "star-open",
+            color: "blue"
+        }
+    };
+    let layout = {
+        xaxis: {
+            range: [-0.1, 1.1],
+            title: "x-coordinate of city location"
+        },
+        yaxis: {
+            range: [-0.1, 1.1],
+            title: "y-coordinate of city location"
+        },
+        title: "Coordinates of cities",
+        width: 400,
+        height: 400
+
+        //xlabel:"X-coordinate of data",
+        //ylabel:"Y-coordinate of data"
+    };
+
+    var data = [drawdata];
+
+    Plotly.newPlot('city-coordinates', data, layout);
+}
+
+function plotWeights(){
+    let i;
+    let weightTemp1=[];
+    weightTemp1[0]=[];
+    weightTemp1[1]=[];
+    weightTemp1[2]=[];
+    weightTemp1[3]=[];
+    for(i=0;i<numNodes;i++)
+    {
+        weightTemp1[0][i]=weights[0][i];
+        weightTemp1[1][i]=weights[1][i];
+        weightTemp1[2][i]=weights[2][i];
+        weightTemp1[3][i]=weights[3][i];
+    }
+    weightTemp1[0][i]=0;
+        weightTemp1[1][i]=0;
+        weightTemp1[2][i]=weights[2][0];
+        weightTemp1[3][i]=weights[3][0];
+    let drawWeight = {
+        x: weightTemp1[2],
+        y: weightTemp1[3],
+        mode: 'markers',
+        type: 'scatter',
+        hoverinfo: 'skip',
+        marker: {
+            size: 4,
+            symbol: "circle",
+            color: "black"
+        }
+    };
+    let layout = {
+        xaxis: {
+            range: [-0.1, 1.1],
+            title: "w_1"
+        },
+        yaxis: {
+            range: [-0.1, 1.1],
+            title: "w_2"
+        },
+        title: "Weight vectors coordinates of nodes",
+        width: 400,
+        height: 400
+
+        //xlabel:"X-coordinate of data",
+        //ylabel:"Y-coordinate of data"
+    };
+
+    var data = [drawWeight];
+
+    Plotly.newPlot('weight-coordinates', data, layout);
+}
+
+
+
+function initSOM()
+{
+//    console.log("wut");
+    setValues();
+    setData();
+    setWeights();
+    plotData();
+    plotWeights();
+}
diff --git a/project issue number 200/Codes/help.css b/project issue number 200/Codes/help.css
@@ -0,0 +1,33 @@
+*{
+    font-family:sans-serif;
+  }
+
+  html{
+     background:url(https://bbl.solutions/wp-content/uploads/2014/11/Blog-background-white-HNM-blue-gradient-blue-gear-2.png);
+     background-size: cover;
+  }
+
+  #heading{
+      background-color: lightblue;
+      color:white;
+      text-align: center;
+      border-style: solid;
+    padding-top:10px;
+    padding-bottom:10px;
+   }
+
+   #ol{
+    background: lightcyan;
+    padding: 30px;
+    border-style: solid;
+
+}
+
+h3{
+    background-color: lightblue;
+      color:white;
+      text-align: center;
+      border-style: solid;
+    padding-top:10px;
+    padding-bottom:10px;
+}
diff --git a/project issue number 200/Codes/help.html b/project issue number 200/Codes/help.html
@@ -0,0 +1,66 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <title>HELP</title>
+    <link rel="stylesheet" type="text/css" href="help.css">
+</head>
+
+<body>
+    <h1 id="heading">HELP</h1>
+    <p>
+        An interactive activation and competition network consists of a collection of processing units organized into some number of competitive pools. There are excitatory connections among units in different pools and inhibitory connections among units within the same pool. The excitatory connections between pools are generally bidirectional, thereby making the processing interactive in the sense that processing in each pool both influences and is influenced by processing in other pools. Within a pool, the inhibitory connections are usually assumed to run from each unit in the pool to every other unit in the pool. This implements a kind of competition among the units such that the unit or units in the pool that receive the strongest activation tend to drive down the activation of the other units. 
+    </p>
+    <h3>Procedure for use</h3>
+        <ol id="ol">
+            <li> Observe the bottom of the simulator to know which cycle number is going on and to see the g-delta plot and global change value.</li>
+            <br>
+            <li>  hover your mouse over any component to highlight the component and see it's excitatory and inhibitory connections with other units. The activation and net input of that unit is displayed on top left.</li>
+            <br>
+            <li> Click on any unit (except in the instance pool) to give external input to that unit and activate it.</li>
+            <br>
+            <li>  Observe how activation of that unit affects the other units activation and net inputs.</li>
+            <br>
+            <li> Also observe how the global change spikes in the few cycles after giving external input to a unit.</li>
+            <br>
+            <li> Click on same unit to take away the external input given to that unit.</li>
+            <br>
+            <li> Observe how the residual net input remains even after removing external input.</li>
+            <br>
+            <li> Press spacebar to pause the simulator in current cycle. Press spacebar again to resume cycles.</li>
+            <br>
+            <li> In paused position, hover over units whose activation data you want. In paused position, cycle will be stopped and giving external input will be disallowed.</li>
+            <br>
+            <li>  Press r to reset the simulator with the same values just used in the simulator. </li>
+            <br>
+            <li> Press s to activate slow motion mode which performs cycles slower than actual speed to get a closer look at how the values of the units change. Press s again to resume real speed cycle change.</li>
+            <br>
+            <li> Change the values of the variables in the table ( in range of (original value - 0.5) to (original value + 0.5) ) and click on set values and restart to start new set of cycles with changed values of variables.</li>
+            <br>
+            <li> Click on Reset original values and restart to start new set of cycles with original values of variables.</li>
+        </ol>
+    <h3>Formulae Used</h3>
+    <p>
+        if weights between i'th and j'th components is +ve,<br>
+q = weight * activation<br>
+excitation += q for all units.<br><br> 
+
+if weights between i'th and j'th components is -ve,<br>
+q = weight * activation<br>
+inhibition += q for all units.<br><br>
+
+net input = (estr * external input) + (beta * excitation) + (gamma * inhibition)
+<br>
+delta excitation = (actmax - activation) * net input - decay * (activation - actrest)<br>
+activation += delta excitation<br>
+g Delta = g Delta + absolute(delta excitation)<br><br>
+
+delta inhibition = (activation - actmin) * net input - decay * (activation - actrest);<br>
+activation += delta inhibition;<br>
+g Delta = g Delta + absolute(delta inhibiton);<br><br>
+  For more information and help regarding IAC, click <a href="https://web.stanford.edu/group/pdplab/pdphandbook/handbookch3.html">here</a>  
+  </p>
+</body>
+
+</html>