Merge pull request #1066 from Dyalog/new_session

Refactor new session page, fix #1056

index.html

@@ -20,46 +20,47 @@
 <!--Connect page-->
 <div id=cn class="container-fluid" hidden>
   <div id="cn_lhs" class="col col-xs-3">
+    <div id=cn_gobig class=col>
+      <button class="go">
+        <span class="fas fa-play"></span><br>
+        <span id=cn_gobig_type>Start</span><br>
+        <span id=cn_gobig_name></span>
+      </button>
+    </div>
     <div id=cn_favs></div>
-    <div id=cn_fav_btns class="row">
-      <div class="col col-xs-3"><button id=cn_neu class=tb_btn title="New"><span class="fas fa-plus-square"></span></button></div>
-      <div class="col col-xs-3"><button id=cn_cln class=tb_btn title="Clone"><span class="fas fa-clone"></span></button></div>
-      <div class="col col-xs-3"><button id=cn_del class=tb_btn title="Delete"><span class="fas fa-minus-square"></span></button></div>
-      <div class="col col-xs-3"><button id=cn_sve class=tb_btn title="Save"><span class="fas fa-save"></span></button></div>
+    <div id=cn_fav_btns class=dlg_btns>
+      <div class="col col-xs-12"><button id=cn_neu title="New"><u>N</u>ew</button></div>
     </div>
   </div>
   <div id="cn_rhs" class="col col-xs-9">
-    <div class="row">
-      <div class="col col-xs-3"><label for=cn_fav_name>C<u>o</u>nfiguration name:</label></div>
-      <div class="col col-xs-9"><input id=cn_fav_name placeholder=unnamed></div>
-    </div>
-    <div class="row">
-      <div class="col col-xs-3"><label for=cn_type><u>T</u>ype:</label></div>
-      <div class="col col-xs-9">
-        <div class="row">
-          <div class="col col-xs-6">
-            <select id=cn_type class=cn_select>
-              <option value=connect     title="Connect to an interpreter"                  >Connect
-              <option value=start       title="Start and connect to an interpreter"        >Start
-              <option value=listen      title="Start and connect to an interpreter via SSL">Listen
-            </select>
-          </div>
-          <div class="col col-xs-6">
-            <select id=cn_subtype hidden>
-              <option value=raw title="Connect to an interpreter via raw TCP/IP" id=cn_raw_opt>TCP
-              <option value=ssh title="Connect to an interpreter via SSH"                     >SSH
-              <option value=ssl title="Connect to an interpreter using TLS/SSL"  id=cn_ssl_opt>TLS/SSL
-            </select>
+    <div id=cn_type_dtl>
+      <div class="row">
+        <div class="col col-xs-3"><label for=cn_fav_name>C<u>o</u>nfiguration name:</label></div>
+        <div class="col col-xs-9"><input id=cn_fav_name placeholder=unnamed></div>
+      </div>
+      <div class="row">
+        <div class="col col-xs-3"><label for=cn_type><u>T</u>ype:</label></div>
+        <div class="col col-xs-9">
+          <div class="row">
+            <div class="col col-xs-6">
+              <select id=cn_type class=cn_select>
+                <option value=connect     title="Connect to an interpreter"                  >Connect
+                <option value=start       title="Start and connect to an interpreter"        >Start
+                <option value=listen      title="Start and connect to an interpreter via SSL">Listen
+              </select>
+            </div>
+            <div class="col col-xs-6">
+              <select id=cn_subtype hidden>
+                <option value=raw title="Connect to an interpreter via raw TCP/IP" id=cn_raw_opt>TCP
+                <option value=ssh title="Connect to an interpreter via SSH"                     >SSH
+                <option value=ssl title="Connect to an interpreter using TLS/SSL"  id=cn_ssl_opt>TLS/SSL
+              </select>
+            </div>
           </div>
         </div>
       </div>
+      <hr>
     </div>
-    <div class="row">
-        <div class="col col-xs-3 col-xs-offset-3">
-          <button id=cn_go><u>C</u>onnect</button>
-        </div>
-    </div>
-    <hr>
     <div id=cn_dtl>
       <div class="row">
         <div class="col col-xs-3">
@@ -182,7 +183,7 @@
         </div>
       </div>
       <div id=cn_start hidden>
-        <div class="row">
+        <div class="row" id=cn_exes_dtl>
           <div class="col col-xs-3"><label for=cn_exes class=cn_label><u>I</u>nterpreter:</label></div>
           <div class="col col-xs-9">
             <select id=cn_exes name=exes class="cn_select browse"></select>
@@ -192,7 +193,8 @@
           </div>
         </div>
         <div class="row">
-          <div class="col col-xs-9 col-xs-offset-3">
+          <div class="col col-xs-3"><label for=cn_exe class=cn_label>Exe path:</label></div>
+          <div class="col col-xs-9">
             <input id=cn_exe name=exe placeholder='path to executable'>
           </div>
         </div>
@@ -231,6 +233,17 @@
         </div>
       </div>
     </div>
+    <div class=dlg_btns>
+      <div class="col col-xs-9 col-md-9 left">
+        <button id=cn_cln title="Clone"><u>C</u>lone</button>
+        <button id=cn_del title="Delete"><u>D</u>elete</button>
+        <button id=cn_sve title="Save"><u>S</u>ave</button>
+        <button id=cn_def title="Make Default">Make <u>D</u>efault</button>
+      </div>
+      <div class="col col-xs-3 col-md-3 right">
+        <button id=cn_go><u>C</u>onnect</button>
+      </div>
+    </div>
   </div>
 </div>
 <div id=splash class=ui-front></div>