Added file pickers to export flow to minimize typing

microsoft · Jun 26, 2017 · 98a9708 · 98a9708
1 parent c4c1bd9
commit 98a9708
Show file tree

Hide file tree

Showing 6 changed files with 35 additions and 4 deletions.
diff --git a/main.js b/main.js
@@ -208,6 +208,7 @@ if (process.platform === 'darwin') {
     })
     template[1].submenu.push();
     template[2].submenu.push();
+
   }
 
   const menu = Menu.buildFromTemplate(template);

diff --git a/src/public/css/styles.css b/src/public/css/styles.css
@@ -76,7 +76,7 @@ label {
      max-width:800px;
 }
 
-#model_selector{
+.file_selector{
     width:30px; 
     vertical-align: middle;
     display:inline-block;

diff --git a/src/public/html/export-configuration.html b/src/public/html/export-configuration.html
@@ -35,7 +35,13 @@
 
         <div class="form-group">
             <label for="Out"> Output Path</label>
-            <input id="output" class="form-control" type="text" />
+            <input id="output" class="form-control" type="text" style=" width:268px; display:inline-block;"  />
+            <div class="file_selector" onclick="getOutputFolder()" >
+              <svg id="icon-folder-plus" viewBox="0 0 32 32">
+                <title>folder-plus</title>
+                <path d="M18 8l-4-4h-14v26h32v-22h-14zM22 22h-4v4h-4v-4h-4v-4h4v-4h4v4h4v4z"></path>
+              </svg>
+            </div>
         </div>
 
         <div id="exportButton" class="btn btn-primary" style="display:inline-block;">Export</div>

diff --git a/src/public/html/review-configuration.html b/src/public/html/review-configuration.html
@@ -29,7 +29,7 @@
       <div class="form-group">
         <label for="Model"> Model Path</label>
         <input id="model" class="form-control" type="text" style=" width:268px; display:inline-block;"  />
-        <div id="model_selector" onclick="getModelFile()" >
+        <div class="file_selector" onclick="getModelFile()" >
           <svg id="icon-folder-plus" viewBox="0 0 32 32">
             <title>folder-plus</title>
             <path d="M18 8l-4-4h-14v26h32v-22h-14zM22 22h-4v4h-4v-4h-4v-4h4v-4h4v4h4v4z"></path>
@@ -39,7 +39,13 @@
 
       <div class="form-group">
           <label for="Out"> Output Path</label>
-          <input id="output" class="form-control" type="text" />
+          <input id="output" class="form-control" type="text" style=" width:268px; display:inline-block;"  />
+          <div class="file_selector" onclick="getOutputFolder()" >
+            <svg id="icon-folder-plus" viewBox="0 0 32 32">
+              <title>folder-plus</title>
+              <path d="M18 8l-4-4h-14v26h32v-22h-14zM22 22h-4v4h-4v-4h-4v-4h4v-4h4v4h4v4z"></path>
+            </svg>
+          </div>
       </div>
 
       <div id="reviewButton" class="btn btn-primary" style="display:inline-block;">Review</div>

diff --git a/src/public/js/export-configuration.js b/src/public/js/export-configuration.js
@@ -29,4 +29,13 @@ function getExportConfiguration() {
 
 function closeWindow() {
      remote.getCurrentWindow().hide();
+}
+
+function getOutputFolder(){
+    remote.dialog.showOpenDialog({
+      filters: [{ name: 'Output Folder'}],
+      properties: ['openDirectory']
+    }, (pathName) => {
+        $('#output').val(pathName);
+    });
 }
diff --git a/src/public/js/review-configuration.js b/src/public/js/review-configuration.js
@@ -35,4 +35,13 @@ function getModelFile(){
     }, (pathName) => {
         $('#model').val(pathName);
     });
+}
+
+function getOutputFolder(){
+    remote.dialog.showOpenDialog({
+      filters: [{ name: 'Output Folder'}],
+      properties: ['openDirectory']
+    }, (pathName) => {
+        $('#output').val(pathName);
+    });
 }