Refactored INT service impl to support multi-instance ONOS and fabric.p4

Change-Id: Ic82a3ab72d71a774606b25997e283b93aedc6ec9
diff --git a/apps/inbandtelemetry/app/src/main/resources/app/view/intApp/intApp.html b/apps/inbandtelemetry/app/src/main/resources/app/view/intApp/intApp.html
index 42717e0..8c39cdc 100644
--- a/apps/inbandtelemetry/app/src/main/resources/app/view/intApp/intApp.html
+++ b/apps/inbandtelemetry/app/src/main/resources/app/view/intApp/intApp.html
@@ -1,62 +1,128 @@
 <!-- partial HTML -->
 <div id="ov-int-app-main">
-    <div class="config-panel">
-        <div>
-            Collector IP
-            <input type="text" required pattern="^([0-9]{1,3}\.){3}[0-9]{1,3}$" ng-model="collectorIp">
+    <div class="tabular-header">
+        <h2 style="font-weight: bold">In-band Network Telemetry (INT) Control
+            Application</h2>
+    </div>
 
-            Collector Port
-            <input type="text" required pattern="^[0-9]{0,5}$" ng-model="collectorPort">
-        </div>
-    </div>
-    <div class="config-button-panel">
-        <div class = "int-app-config-button" ng-click="sendIntConfigString()">
-            Deploy
-        </div>
-    </div>
     <hr>
-    <div class="input-panel">
-        <div>
-            Src Address
-            <input type="text" required pattern="^([0-9]{1,3}\.){3}[0-9]{1,3}(/[0-9]{1,2})?$" ng-model="ip4SrcPrefix">
 
-            Dst Address
-            <input type="text" required pattern="^([0-9]{1,3}\.){3}[0-9]{1,3}(/[0-9]{1,2})?$" ng-model="ip4DstPrefix">
-
-            Src Port
-            <input type="text" required pattern="^[0-9]{0,5}$" ng-model="l4SrcPort">
-
-            Dst Port
-            <input type="text" required pattern="^[0-9]{0,5}$" ng-model="l4DstPort">
-
-            Protocol
-            <select name="protocol" ng-model="protocol">
-                <option selected disabled hidden style="display: none" value=''></option>
-                <option value="TCP">TCP</option>
-                <option value="UDP">UDP</option>
-            </select>
+    <div class="tabular-header">
+        <h2>
+            INT Collector Configuration
+        </h2>
+        <div class="config-panel">
+            <h3>
+                Collector IPv4 address and UDP port
+            </h3>
+            <div>
+                <input type="text" required
+                       pattern="^([0-9]{1,3}\.){3}[0-9]{1,3}$"
+                       ng-model="collectorIp" placeholder="IPv4 address">
+                :
+                <input type="text" required pattern="^[0-9]{0,5}$"
+                       ng-model="collectorPort" placeholder="port">
+            </div>
         </div>
-        <div>
-            <input type="checkbox" ng-model= "metaSwId">Switch Id
-            <input type="checkbox" ng-model= "metaPortId">Port Id
-            <input type="checkbox" ng-model= "metaHopLatency">Hop Latency
-            <input type="checkbox" ng-model= "metaQOccupancy">Queue Occupancy
-            <input type="checkbox" ng-model= "metaIngressTstamp">Ingress Timestamp
-            <input type="checkbox" ng-model= "metaEgressTstamp">Egress Timestamp
-            <!--<input type="checkbox" ng-model= "metaQCongestion">Queue Congestion Status-->
-            <input type="checkbox" ng-model= "metaEgressTx">Egress Port Tx Utilization
+        <div class="config-button-panel">
+            <div class="int-app-config-button" ng-click="sendIntConfigString()">
+                Apply Configuration
+            </div>
         </div>
     </div>
 
-    <div class="button-panel">
-        <div class = "int-app-button" ng-click="sendIntIntentString()">
-            Deploy
+    <hr>
+
+    <div class="tabular-header">
+        <h2>
+            INT Watchlist Rules
+        </h2>
+
+        <div>
+            <div class="input-panel">
+                <h3>
+                    Create New Watchlist Rule
+                </h3>
+                <div>
+                    <label>
+                        <input placeholder="Source IP address" type="text"
+                               required
+                               pattern="^([0-9]{1,3}\.){3}[0-9]{1,3}(/[0-9]{1,2})?$"
+                               ng-model="ip4SrcPrefix">
+                    </label>
+                    <label>
+                        <input placeholder="Dest IP address" type="text"
+                               required
+                               pattern="^([0-9]{1,3}\.){3}[0-9]{1,3}(/[0-9]{1,2})?$"
+                               ng-model="ip4DstPrefix">
+                    </label>
+                    <label>
+                        <input placeholder="Source port" type="text" required
+                               pattern="^[0-9]{0,5}$"
+                               ng-model="l4SrcPort">
+                    </label>
+                    <label>
+                        <input placeholder="Dest port" type="text" required
+                               pattern="^[0-9]{0,5}$"
+                               ng-model="l4DstPort">
+                    </label>
+                    <label>
+                        Protocol
+                        <select name="protocol" ng-model="protocol">
+                            <option selected disabled hidden
+                                    style="display: none" value=''></option>
+                            <option value="TCP">TCP</option>
+                            <option value="UDP">UDP</option>
+                        </select>
+                    </label>
+                </div>
+                <div>
+                    <label>
+                        <input type="checkbox" ng-model="metaSwId">
+                        Switch ID
+                    </label>
+                    <label>
+                        <input type="checkbox" ng-model="metaPortId">
+                        Port IDs
+                    </label>
+                    <label>
+                        <input type="checkbox" ng-model="metaHopLatency">
+                        Hop Latency
+                    </label>
+                    <label>
+                        <input type="checkbox" ng-model="metaQOccupancy">
+                        Queue Occupancy
+                    </label>
+                    <label>
+                        <input type="checkbox" ng-model="metaIngressTstamp">
+                        Ingress Timestamp
+                    </label>
+                    <label>
+                        <input type="checkbox" ng-model="metaEgressTstamp">
+                        Egress Timestamp
+                    </label>
+                    <label>
+                        <input type="checkbox" ng-model="metaQCongestion">
+                        Queue Congestion Status
+                    </label>
+                    <label>
+                        <input type="checkbox" ng-model="metaEgressTx">
+                        Egress Port Tx Utilization
+                    </label>
+                </div>
+            </div>
+        </div>
+
+        <div class="button-panel">
+            <div class="int-app-button" ng-click="sendIntIntentString()">
+                Apply Watchlist Rule
+            </div>
         </div>
     </div>
     <!-- ++++++++++++++++++++++++++++++++++++++++++++++++++++++++ -->
     <div class='int-app-main-intents'>
         <div class="tabular-header">
-            <h2>Installed INT Intents ({{tableData.length}} total)</h2>
+            <h2>Installed Watchlist Rules ({{tableData.length}} total)</h2>
             <div class="ctrl-btns">
                 <div class="refresh" ng-class="{active: autoRefresh}"
                      icon icon-id="refresh" icon-size="36"
@@ -77,13 +143,13 @@
             <div class="table-header" onos-sortable-header>
                 <table>
                     <tr>
-                        <td colId="id" sortable>ID </td>
-                        <td colId="srcAddr" sortable>Src Address </td>
-                        <td colId="dstAddr" sortable>Dst Address </td>
-                        <td colId="srcPort" sortable>Src Port </td>
-                        <td colId="dstPort" sortable>Dst Port </td>
-                        <td colId="protocol" sortable>Protocol </td>
-                        <td colId="metadata" sortable>Metadata </td>
+                        <td colId="id" sortable>ID</td>
+                        <td colId="srcAddr" sortable>Src Address</td>
+                        <td colId="dstAddr" sortable>Dst Address</td>
+                        <td colId="srcPort" sortable>Src Port</td>
+                        <td colId="dstPort" sortable>Dst Port</td>
+                        <td colId="protocol" sortable>Protocol</td>
+                        <td colId="metadata" sortable>Metadata</td>
                     </tr>
                 </table>
             </div>