Add popup and menu item

browser/css/dark.css

@@ -743,7 +743,8 @@ span .substitution {
   border-radius: 2px;
 }
 #file_menu,
-#axis_choice {
+#axis_choice,
+#add_clone_menu {
   z-index: 2;
   border: solid;
   position: fixed;
@@ -756,6 +757,26 @@ span .substitution {
   background: #000000;
   display: none;
 }
+#addclone_input {
+  margin-bottom: 10px;
+  resize: none;
+  height: 8em;
+  width: 98%;
+  border: 1px solid silver;
+  border-radius: 0.1em;
+  padding: 1%;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+  -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+  -webkit-transition: border linear 0.2s, box-shadow linear 0.2s;
+  -moz-transition: border linear 0.2s, box-shadow linear 0.2s;
+  -o-transition: border linear 0.2s, box-shadow linear 0.2s;
+  transition: border linear 0.2s, box-shadow linear 0.2s;
+  transition-property: border, box-shadow;
+  transition-duration: 0.2s, 0.2s;
+  transition-timing-function: linear, linear;
+  transition-delay: 0s, 0s;
+}
 .buttonSelector {
   background: #000000;
   cursor: pointer;

browser/index.html

@@ -75,6 +75,16 @@
             </div></div>
         </div>
 
+        <div id="add_clone_menu">
+            <span class="closeButton" onclick="cancel();">X</span>
+            <h2>add a clone</h2>
+
+            <textarea id="addclone_input" placeholder="clone sequence (fasta format)"></textarea>
+
+            <button onclick="document.getElementById('add_clone_menu').style.display = 'none';
+                m.addManualClones('addclone_input');">Add</button>
+        </div>
+
         <!-- TOP-CONTAINER -->
         <div id="top-container" onmouseout="hideSelector()">
             <div id="menu-container">
@@ -114,6 +124,9 @@
                           <a class="buttonSelector" id="export_sample_report" onclick="javascript:report.reportHTMLdiag()">export report (sample)</a>
                           <a class="buttonSelector" id="export_monitor_report" onclick="javascript:report.reportHTML()">export report (monitor)</a>
                         </div>
+                        <div class="menu_box">
+                            <a class="buttonSelector" id ="add_clone" onclick="javascript:addManualClone()">add a clone</a>
+                        </div>
                         <div class="menu_box">
                             <a class="buttonSelector" id="export_analysis" onclick="javascript:m.saveAnalysis()">export analysis</a>
                             <a class="buttonSelector" id="export_svg1" onclick="javascript:graph.resize(1400,800);m.exportSVG('visu2_svg')">export SVG graph</a>

browser/js/menu.js

@@ -108,6 +108,8 @@ function cancel() {
         .style.display = "none";
     document.getElementById("file_menu")
         .style.display = "none";
+    document.getElementById("add_clone_menu")
+        .style.display = "none";
 }
 
 function showSelector(elem) {
@@ -137,3 +139,10 @@ function showDisplayMenu() {
     $('#display-menu')
         .toggle("fast");
 }
+
+function addManualClone() {
+    document.getElementById("add_clone_menu")
+        .style.display = "block";
+    document.getElementById("axis_choice")
+        .style.display = "none";
+}