Show checkbox for secure routes rather than advanced options

Author: spadgett

app/scripts/directives/oscRouting.js

@@ -123,13 +123,29 @@ angular.module("openshiftConsole")
         // Show a warning if previously-set certificates won't be used because
         // the TLS termination is now incompatible.
         scope.$watch('route.tls.termination', function() {
-          if (_.get(scope, 'route.tls.termination')) {
-            // If editing a route with TLS termination already set, expand the secure route options.
-            scope.showSecureRouteOptions = true;
-          }
+          scope.secureRoute = !!_.get(scope, 'route.tls.termination');
           scope.showCertificatesNotUsedWarning = showCertificateWarning();
         });
 
+        var previousTermination;
+        scope.$watch('secureRoute', function(newValue, oldValue) {
+          if (newValue === oldValue) {
+            return;
+          }
+
+          var termination = _.get(scope, 'route.tls.termination');
+          if (!scope.securetRoute && termination) {
+            // Remember previous value if user switches back to secure.
+            previousTermination = termination;
+            delete scope.route.tls.termination;
+          }
+
+          if (scope.secureRoute && !termination) {
+            // Restore previous termination value or default to edge if no previous value.
+            _.set(scope, 'route.tls.termination', previousTermination || 'edge');
+          }
+        });
+
         scope.addAlternateService = function() {
           scope.route.alternateServices = scope.route.alternateServices || [];
           var firstUnselected = _.find(scope.services, function(service) {

app/views/directives/osc-routing.html

@@ -150,25 +150,20 @@ <h3>Alternate Services</h3>
       </div>
     </div>
 
-    <div>
-      <a href=""
-        ng-click="showSecureRouteOptions = true"
-        ng-show="!showSecureRouteOptions">Show options for secured routes</a>
-    </div>
-
-    <div ng-show="showSecureRouteOptions">
-      <h3>Route Type</h3>
-      <div>
-        <span class="help-block">
-          Routes can be secured using several TLS termination types for serving certificates.
-        </span>
+    <div class="checkbox">
+      <label>
+        <input type="checkbox" ng-model="secureRoute" id="secure-route">Secure route
+      </label>
+      <div class="help-block">
+        Routes can be secured using several TLS termination types for serving certificates.
       </div>
+    </div>
 
+    <div ng-show="secureRoute">
       <!-- TLS Termination -->
       <div class="form-group">
         <label>TLS Termination</label>
         <select ng-model="route.tls.termination" class="form-control">
-          <option value="">None</option>
           <option value="edge">Edge</option>
           <option value="passthrough">Passthrough</option>
           <option value="reencrypt">Re-encrypt</option>

dist/scripts/scripts.js

@@ -8946,7 +8946,14 @@ var f = function() {
 return !!a.route.tls && ((!a.route.tls.termination || "passthrough" === a.route.tls.termination) && (a.route.tls.certificate || a.route.tls.key || a.route.tls.caCertificate || a.route.tls.destinationCACertificate));
 };
 a.$watch("route.tls.termination", function() {
-_.get(a, "route.tls.termination") && (a.showSecureRouteOptions = !0), a.showCertificatesNotUsedWarning = f();
+a.secureRoute = !!_.get(a, "route.tls.termination"), a.showCertificatesNotUsedWarning = f();
+});
+var g;
+a.$watch("secureRoute", function(b, c) {
+if (b !== c) {
+var d = _.get(a, "route.tls.termination");
+!a.securetRoute && d && (g = d, delete a.route.tls.termination), a.secureRoute && !d && _.set(a, "route.tls.termination", g || "edge");
+}
 }), a.addAlternateService = function() {
 a.route.alternateServices = a.route.alternateServices || [];
 var b = _.find(a.services, function(b) {

dist/scripts/templates.js

@@ -6908,21 +6908,19 @@ angular.module('openshiftConsoleTemplates', []).run(['$templateCache', function(
     "</span>\n" +
     "</div>\n" +
     "</div>\n" +
-    "<div>\n" +
-    "<a href=\"\" ng-click=\"showSecureRouteOptions = true\" ng-show=\"!showSecureRouteOptions\">Show options for secured routes</a>\n" +
-    "</div>\n" +
-    "<div ng-show=\"showSecureRouteOptions\">\n" +
-    "<h3>Route Type</h3>\n" +
-    "<div>\n" +
-    "<span class=\"help-block\">\n" +
+    "<div class=\"checkbox\">\n" +
+    "<label>\n" +
+    "<input type=\"checkbox\" ng-model=\"secureRoute\" id=\"secure-route\">Secure route\n" +
+    "</label>\n" +
+    "<div class=\"help-block\">\n" +
     "Routes can be secured using several TLS termination types for serving certificates.\n" +
-    "</span>\n" +
     "</div>\n" +
+    "</div>\n" +
+    "<div ng-show=\"secureRoute\">\n" +
     "\n" +
     "<div class=\"form-group\">\n" +
     "<label>TLS Termination</label>\n" +
     "<select ng-model=\"route.tls.termination\" class=\"form-control\">\n" +
-    "<option value=\"\">None</option>\n" +
     "<option value=\"edge\">Edge</option>\n" +
     "<option value=\"passthrough\">Passthrough</option>\n" +
     "<option value=\"reencrypt\">Re-encrypt</option>\n" +