https://virtual-labs.github.io/virtual-labs/exp-mean-field-annealing-…

…iiith click on the link to test your code.

README.md

@@ -0,0 +1 @@
+### README

aim.md

@@ -0,0 +1,6 @@
+The objective of this experiment is to demonstrate different annealing strategies in the solutions to optimization problems using a Hopfield model. This is illustrated using the weighted matching problem as a case study.
+
+The optimization is guided by the activation dynamics of a Hopfield network. The activation dynamics is guided by the energy surface defined by the activation states of the units in the Hopfield network. The three relaxation strategies studied are:
+(a) Deterministic relaxation
+(b) Stochastic relaxation
+(c) Mean-field approximation

assets/css/common-styles-responsive.css

@@ -0,0 +1,97 @@
+.slidecontainer {
+    text-align: center;
+}
+
+.slider {
+    width: 10%;
+}
+
+.text-box {
+    padding: 7px 20px;
+    margin: 8px 0;
+    box-sizing: border-box;
+    width: 14%; 
+}
+
+.legend { list-style: none; }
+.legend li { padding-bottom : 1.5vw; width: 20vw; }
+.legend span { border: 0.1vw solid black; float: left; border-radius: 50%;}
+.legend .grey { background-color: grey; }
+.legend .green { background-color: #a4c652; }
+.legend .black { background-color: black; }
+
+.button-input {
+    border-radius: 50vw;
+    background-color: #288ec8;
+    border: none;
+    color: white;
+    padding: 1%;
+    margin-left: 1%;
+    margin-right: 1%;
+    padding-bottom: 1%;
+    padding-top: 1%;
+    padding-left: 2%;
+    padding-right: 2%;
+}
+
+.button-input:hover {
+    background-color:gray;
+    cursor:pointer;
+}
+
+.comment-box {
+    position: relative;
+    padding: 1vw;
+    width: 30vw;
+    text-align: center;
+}
+
+.instruction-box {
+    position: relative;
+    width: 100%;
+    transition: width 0.2s ease-out;
+    border: 0.1vw solid grey;
+    z-index : 10;
+}
+
+.collapsible {
+    background-color: Transparent;
+    color: "grey";
+    cursor: pointer;
+    width: 100%;
+    border: none;
+    text-align: center;
+    outline: none;
+    font-weight: bold;
+    padding-top: 1%;
+    padding-bottom: 1%;
+}
+
+.collapsible::-moz-focus-inner {
+    border: 0;
+}
+
+.active, .collapsible:hover {
+    background-color: "white";
+}
+
+/*The unicode \25BE is for ▾ (Dropdown arrow) */
+.collapsible:after {
+    content: "\25BE";
+    color: "grey";
+    font-weight: bold;
+    float: right;
+    margin-left: 5px;
+}
+
+.active:after {
+    content: "\25B4";
+}
+
+.content {
+    padding: 0 1.8vw;
+    max-height: 0;
+    overflow: hidden;
+    transition: max-height 0.2s ease-out;
+    background-color: "white";
+}

assets/css/common-styles.css

@@ -0,0 +1,104 @@
+.slidecontainer {
+    text-align: center;
+}
+
+.slider {
+    width: 10%;
+}
+
+.text-box {
+    padding: 7px 20px;
+    margin: 8px 0;
+    box-sizing: border-box;
+    width: 14%; 
+}
+
+.legend{
+    font-size: 1.4vw;
+}
+.legend { list-style: none; }
+.legend li { padding-bottom : 1.5vw; width: 20vw; }
+.legend span { border: 0.1vw solid black; float: left; width: 2vw; height: 2vw; margin-right : 0.5vw; border-radius: 50%;}
+.legend .grey { background-color: grey; }
+.legend .green { background-color: #a4c652; }
+.legend .black { background-color: black; }
+
+.button-input {
+    border-radius: 50vw;
+    background-color: #288ec8;
+    border: none;
+    color: white;
+    padding: 1%;
+    font-size: 1.3vw;
+    margin-left: 1%;
+    margin-right: 1%;
+    padding-bottom: 1%;
+    padding-top: 1%;
+    padding-left: 2%;
+    padding-right: 2%;
+}
+
+.button-input:hover {
+    background-color:gray;
+    cursor:pointer;
+}
+
+.comment-box {
+    position: relative;
+    padding: 1vw;
+    width: 30vw;
+    font-size: 1.5vw;
+    text-align: center;
+}
+
+.instruction-box {
+    position: relative;
+    width: 100%;
+    transition: width 0.2s ease-out;
+    border: 0.1vw solid grey;
+    font-size: 1.5vw;
+    z-index : 10;
+}
+
+.collapsible {
+    background-color: Transparent;
+    color: "grey";
+    cursor: pointer;
+    width: 100%;
+    border: none;
+    text-align: center;
+    outline: none;
+    font-size: 1.5vw;
+    font-weight: bold;
+    padding-top: 1%;
+    padding-bottom: 1%;
+}
+
+.collapsible::-moz-focus-inner {
+    border: 0;
+}
+
+.active, .collapsible:hover {
+    background-color: "white";
+}
+
+.collapsible:after {
+    content: '\25BE';
+    color: "grey";
+    font-weight: bold;
+    float: right;
+    margin-left: 5px;
+}
+
+.active:after {
+    content: "\25B4";
+}
+
+.content {
+    padding: 0 1.8vw;
+    max-height: 0;
+    overflow: hidden;
+    transition: max-height 0.2s ease-out;
+    background-color: "white";
+}
+