From fedde73a02c357617ef285109a247a4a7f784e94 Mon Sep 17 00:00:00 2001
From: Juan Cruz Viotti <jviottidc@gmail.com>
Date: Wed, 13 Apr 2016 12:12:19 -0400
Subject: [PATCH] Improve UX when re-selecting a single available drive (#313)

Currently, if you have only one connected drive, Etcher will auto-select
it. One the single drive is auto-selected, if you attempt to change your
drive selection by clicking on the "Change" link button, the
re-selection is undone, and redone in a matter of milliseconds, making
it very difficult to get the drive selector modal to open.

A simple solution to this problem is making "Change" links trigger the
reselection action (e.g: opening modals, dialogs, etc) instead of simply
undoing the selection.

Fixes: https://github.com/resin-io/etcher/issues/296
Signed-off-by: Juan Cruz Viotti <jviottidc@gmail.com>
---
 lib/browser/app.js     | 3 ++-
 lib/partials/main.html | 5 ++---
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/lib/browser/app.js b/lib/browser/app.js
index 4c3d5c9a..c941effd 100644
--- a/lib/browser/app.js
+++ b/lib/browser/app.js
@@ -216,6 +216,7 @@ app.controller('AppController', function(
     // "returns" to the first step.
     self.selection.clear();
 
+    self.openImageSelector();
     AnalyticsService.logEvent('Reselect image');
   };
 
@@ -224,7 +225,7 @@ app.controller('AppController', function(
       return;
     }
 
-    self.selection.removeDrive();
+    self.openDriveSelector();
     AnalyticsService.logEvent('Reselect drive');
   };
 
diff --git a/lib/partials/main.html b/lib/partials/main.html
index a7e62190..5976bf43 100644
--- a/lib/partials/main.html
+++ b/lib/partials/main.html
@@ -10,7 +10,7 @@
           <p class="step-footer">*supported files: .img, .iso, .zip</p>
         </div>
         <div ng-show="app.selection.hasImage()">
-          <div ng-bind="app.selection.getImage() | basename" ng-click="app.reselectImage()"></div>
+          <div ng-bind="app.selection.getImage() | basename"></div>
 
           <button class="btn btn-link step-footer"
             ng-click="app.reselectImage()"
@@ -44,8 +44,7 @@
 
         </div>
         <div ng-show="app.selection.hasDrive()">
-          <div ng-bind="app.selection.getDrive().name + ' - ' + app.selection.getDrive().size"
-            ng-click="app.reselectDrive()"></div>
+          <div ng-bind="app.selection.getDrive().name + ' - ' + app.selection.getDrive().size"></div>
 
           <button class="btn btn-link step-footer"
             ng-click="app.reselectDrive()"