Worked on route headers implementation

assets/js/app/routes/controllers/add-route-modal-controller.js

@@ -45,7 +45,7 @@
 
           const data = _.cloneDeep($scope.route)
 
-          // Format sources and destingations
+          // Format sources, destingations and headers
           if(data.sources && data.sources.length) {
             data.sources = _.map(data.sources, (item) => {
               const parts = item.split(":");
@@ -66,6 +66,20 @@
             })
           }
 
+          if(data.headers && data.headers.length) {
+            data.headers = _.map(data.headers, (item) => {
+              const parts = item.split(":");
+              const obj = {};
+              obj[parts[0]] = parts[1].split(",")
+              return obj;
+            }).reduce(function(r, e) {
+              const key = Object.keys(e)[0];
+              const value = e[key];
+              r[key] = value;
+              return r;
+            }, {});
+          }
+
           console.log("Route =>", data);
           $scope.errorMessage = '';
 

assets/js/app/routes/controllers/route-details-controller.js

@@ -13,6 +13,16 @@
 
         var availableFormattedVersion = RoutesService.getLastAvailableFormattedVersion($rootScope.Gateway.version);
         $scope.route = $scope.route || _route;
+
+        // Transform headers attr to a compatible array
+        if($scope.route.headers && Object.keys($scope.route.headers).length) {
+          const array = [];
+          Object.keys($scope.route.headers).forEach(key => {
+            const str = `${key}:${$scope.route.headers[key].join(",")}`
+            array.push(str)
+          })
+          $scope.route.headers = array;
+        }
 
         // Transform sources and destinations
         if($scope.route.sources && $scope.route.sources.length) {
@@ -46,13 +56,14 @@
 
           if(!data.hosts || !data.hosts.length) data.hosts = null;
           if(!data.paths || !data.paths.length) data.paths = null;
+          if(!data.headers || !data.headers.length) data.headers = null;
           if(!data.methods || !data.methods.length) data.methods = null;
           if(!data.protocols || !data.protocols.length) data.protocols = null;
           if(!data.snis || !data.snis.length) data.snis = null;
           if(!data.sources || !data.sources.length) data.sources = null;
           if(!data.destinations || !data.destinations.length) data.destinations = null;
 
-          // Format sources and destingations
+          // Format sources and destingations and headers
           if(data.sources && data.sources.length) {
             data.sources = _.map(data.sources, (item) => {
               const parts = item.split(":");
@@ -73,6 +84,20 @@
             })
           }
 
+          if(data.headers && data.headers.length) {
+            data.headers = _.map(data.headers, (item) => {
+              const parts = item.split(":");
+              const obj = {};
+              obj[parts[0]] = parts[1].split(",")
+              return obj;
+            }).reduce(function(r, e) {
+              const key = Object.keys(e)[0];
+              const value = e[key];
+              r[key] = value;
+              return r;
+            }, {});
+          }
+
           console.log("Submitting route", data);
 
           RoutesService.update($scope.route.id, _.omit(data,["id", "data"]))

assets/js/app/routes/partials/form-route-013.html

@@ -93,6 +93,30 @@
     </p>
   </div>
 </div>
+<div class="form-group" ng-class="{'has-error' : errors.headers}">
+  <label class="col-sm-3 control-label"
+    >Headers <br /><em
+      ><small class="help-block">semi-optional</small></em
+    ></label
+  >
+  <div class="col-sm-9">
+    <chips ng-model="route.headers">
+      <chip-tmpl>
+        <div class="default-chip">
+          {{chip}}
+          <i class="mdi mdi-close" remove-chip></i>
+        </div>
+      </chip-tmpl>
+      <input chip-control />
+    </chips>
+    <p class="help-block">
+      One or more lists of values indexed by header name that will cause this
+      Route to match if present in the request. The <code>Host</code> header cannot be used
+      with this attribute: hosts should be specified using the <code>hosts</code> attribute.<br>
+      <code>Field values should be formatted like so: x-some-header:foo,bar</code>
+    </p>
+  </div>
+</div>
 <div
   class="form-group"
   ng-class="{'has-error' : errors.https_redirect_status_code}"

assets/js/app/routes/partials/form-route-015.html

@@ -94,6 +94,31 @@
   </div>
 </div>
 
+<div class="form-group" ng-class="{'has-error' : errors.headers}">
+  <label class="col-sm-3 control-label"
+    >Headers <br /><em
+      ><small class="help-block">semi-optional</small></em
+    ></label
+  >
+  <div class="col-sm-9">
+    <chips ng-model="route.headers">
+      <chip-tmpl>
+        <div class="default-chip">
+          {{chip}}
+          <i class="mdi mdi-close" remove-chip></i>
+        </div>
+      </chip-tmpl>
+      <input chip-control />
+    </chips>
+    <p class="help-block">
+      One or more lists of values indexed by header name that will cause this
+      Route to match if present in the request. The <code>Host</code> header cannot be used
+      with this attribute: hosts should be specified using the <code>hosts</code> attribute.<br>
+      <code>Field values should be formatted like so: x-some-header:foo,bar</code>
+    </p>
+  </div>
+</div>
+
 <div class="form-group" ng-class="{'has-error' : errors.path_handling}" ng-if="route.path_handling">
   <label class="col-sm-3 control-label">Path handling</label>
   <div class="col-sm-9">

assets/js/app/routes/routes-service.js

@@ -21,7 +21,7 @@
           '013': {
             name: '',
             hosts: [],
-            protocols: [],
+            protocols: ["http", "https"],
             methods: [],
             headers: [],
             paths: [],
@@ -36,7 +36,7 @@
           '015': {
             name: '',
             hosts: [],
-            protocols: [],
+            protocols: ["http", "https"],
             methods: [],
             paths: [],
             headers: [],