Updating subscriber
diff --git a/.dockerignore b/.dockerignore
old mode 100644
new mode 100755
index 4a688ff..9afc36d
--- a/.dockerignore
+++ b/.dockerignore
@@ -1,2 +1,3 @@
-node_modules/
-bower_components/
\ No newline at end of file
+views/
+applications/
+containers/
\ No newline at end of file
diff --git a/views/ngXosViews/diagnostic/env/local.js b/views/ngXosViews/diagnostic/env/local.js
index 77f9585..bf5af60 100644
--- a/views/ngXosViews/diagnostic/env/local.js
+++ b/views/ngXosViews/diagnostic/env/local.js
@@ -8,6 +8,6 @@
 
 module.exports = {
   host: 'http://xos.local:9999/',
-  xoscsrftoken: 'LNTm83Yqbabh0r60IZIl6rMYPHaYJdl1',
-  xossessionid: 'j9oazvejbv5jaiahmuhkba7f09ks8yuo'
+  xoscsrftoken: 'lu7LFTapqkGQqrqjupArNvyfd5LUoOk5',
+  xossessionid: 'mjzzv7u1q68tfsp8s807h0qzv0qdriaj'
 };
diff --git a/views/ngXosViews/diagnostic/mocks/data/cordsubscriber.json b/views/ngXosViews/diagnostic/mocks/data/cordsubscriber.json
index 15d1385..b0c69bc 100644
--- a/views/ngXosViews/diagnostic/mocks/data/cordsubscriber.json
+++ b/views/ngXosViews/diagnostic/mocks/data/cordsubscriber.json
@@ -1,31 +1,36 @@
 [
-   {
-     "humanReadableName": "cordSubscriber-1", 
-     "id": 1, 
-     "service_specific_id": "123", 
-     "vlan_id": "432", 
-     "s_tag": "222", 
-     "c_tag": "432", 
-     "vcpe_id": 4, 
-     "instance": 1, 
-     "instance_name": "mysite_vsg", 
-     "image": 1, 
-     "image_name": "trusty-server-multi-nic", 
-     "firewall_enable": false, 
-     "firewall_rules": "accept all anywhere anywhere", 
-     "url_filter_enable": false, 
-     "url_filter_rules": "allow all", 
-     "url_filter_level": "R", 
-     "bbs_account": null, 
-     "ssh_command": null, 
-     "vcpe_synced": false, 
-     "cdn_enable": false, 
-     "vbng_id": 5, 
-     "routeable_subnet": "", 
-     "nat_ip": null, 
-     "lan_ip": null, 
-     "wan_ip": null, 
-     "private_ip": null, 
-     "wan_mac": null
-   }
+     {
+          "humanReadableName": "cordSubscriber-1", 
+          "id": 1, 
+          "service_specific_id": "123", 
+          "vlan_id": "432", 
+          "s_tag": "222", 
+          "c_tag": "432", 
+          "vcpe_id": 4, 
+          "instance": 1, 
+          "instance_name": "mysite_vcpe", 
+          "image": 1, 
+          "image_name": "trusty-server-multi-nic", 
+          "firewall_enable": false, 
+          "firewall_rules": "accept all anywhere anywhere", 
+          "url_filter_enable": false, 
+          "url_filter_rules": "allow all", 
+          "url_filter_level": "R", 
+          "bbs_account": null, 
+          "ssh_command": null, 
+          "vcpe_synced": false, 
+          "cdn_enable": false, 
+          "vbng_id": 5, 
+          "routeable_subnet": "", 
+          "nat_ip": null, 
+          "lan_ip": null, 
+          "wan_ip": null, 
+          "private_ip": null, 
+          "wan_mac": null, 
+          "wan_container_ip": "10.0.1.24", 
+          "uplink_speed": 1000000000, 
+          "downlink_speed": 1000000000, 
+          "status": "copyrightviolation", 
+          "enable_uverse": true
+     }
 ]
\ No newline at end of file
diff --git a/views/ngXosViews/diagnostic/mocks/diagnostic.conf.json b/views/ngXosViews/diagnostic/mocks/diagnostic.conf.json
index e677249..a346dc6 100644
--- a/views/ngXosViews/diagnostic/mocks/diagnostic.conf.json
+++ b/views/ngXosViews/diagnostic/mocks/diagnostic.conf.json
@@ -2,7 +2,7 @@
   {
     "url": "cordsubscriber",
     "base": "xoslib/",
-    "methods": ["GET"],
+    "methods": ["GET", "PUT"],
     "param": "id"
   },
   {
diff --git a/views/ngXosViews/diagnostic/package.json b/views/ngXosViews/diagnostic/package.json
index d425069..d7694bc 100644
--- a/views/ngXosViews/diagnostic/package.json
+++ b/views/ngXosViews/diagnostic/package.json
@@ -6,6 +6,7 @@
     "prestart": "npm install && bower install",
     "start": "gulp serve",
     "dev": "NODE_ENV=mock gulp serve",
+    "local": "NODE_ENV=local gulp serve",
     "server": "easy-mocker -c ./mocks/diagnostic.conf.json -d ./mocks/data",
     "build": "gulp",
     "test": "karma start",
diff --git a/views/ngXosViews/diagnostic/src/css/diagnostic.css b/views/ngXosViews/diagnostic/src/css/diagnostic.css
index de76060..4a8a6f9 100644
--- a/views/ngXosViews/diagnostic/src/css/diagnostic.css
+++ b/views/ngXosViews/diagnostic/src/css/diagnostic.css
@@ -27,6 +27,12 @@
     z-index: 1;
 }
 
+
+/* subscriber-status-modal */
+subscriber-status-modal .row + .row {
+  margin-top: 20px;
+}
+
 .half-height + .half-height {
     border-top: 1px solid black;
 }
diff --git a/views/ngXosViews/diagnostic/src/js/chart_data_service.js b/views/ngXosViews/diagnostic/src/js/chart_data_service.js
index 7326ac8..f39a1e2 100644
--- a/views/ngXosViews/diagnostic/src/js/chart_data_service.js
+++ b/views/ngXosViews/diagnostic/src/js/chart_data_service.js
@@ -80,10 +80,10 @@
 
     };
 
-    this.getSubscriberIP = () => {
-      const ip = JSON.parse(this.currentServiceChain.children[0].children[0].tenant.service_specific_attribute).wan_container_ip;
+    this.getSubscriberIP = (subscriber) => {
+      // const ip = JSON.parse(this.currentServiceChain.children[0].children[0].tenant.service_specific_attribute).wan_container_ip;
       // const ip = this.currentServiceChain.children[0].children[0].tenant.wan_container_ip;
-      this.logicTopologyData.children[0].subscriberIP = ip;
+      this.logicTopologyData.children[0].subscriberIP = subscriber.wan_container_ip;
     };
 
     this.selectSubscriber = (subscriber) => {
@@ -96,7 +96,7 @@
       this.highlightInstances([]);
 
       this.getSubscriberTag(subscriber);
-      this.getSubscriberIP();
+      this.getSubscriberIP(subscriber);
 
     };
 
diff --git a/views/ngXosViews/diagnostic/src/js/rest_services.js b/views/ngXosViews/diagnostic/src/js/rest_services.js
index e88f098..5677f30 100644
--- a/views/ngXosViews/diagnostic/src/js/rest_services.js
+++ b/views/ngXosViews/diagnostic/src/js/rest_services.js
@@ -165,6 +165,10 @@
   })
   .service('Subscribers', function($resource, $q, SubscriberDevice){
     return $resource('/xoslib/cordsubscriber/:id', {id: '@id'}, {
+      update: {
+        method: 'PUT',
+        isArray: false
+      },
       queryWithDevices: {
         method: 'GET',
         isArray: true,
diff --git a/views/ngXosViews/diagnostic/src/js/subscriber-modal.js b/views/ngXosViews/diagnostic/src/js/subscriber-modal.js
index a8b93f5..74bb8a7 100644
--- a/views/ngXosViews/diagnostic/src/js/subscriber-modal.js
+++ b/views/ngXosViews/diagnostic/src/js/subscriber-modal.js
@@ -34,22 +34,31 @@
       restrict: 'E',
       templateUrl: 'templates/subscriber-status-modal.tpl.html',
       controllerAs: 'vm',
-      controller: function($log, $scope){
+      controller: function($log, $timeout, $scope, Subscribers){
 
-        // mock until api
-        $scope.$watch(() => this.subscriber, (subscriber) => {
-          if(subscriber){
-            subscriber.status = 'enabled';
-          }
+        $scope.$watch(() => this.open, () => {
+          this.success = null;
+          this.formError = null;
         });
 
         this.close = () => {
           this.open = false;
         };
 
-        this.setStatus = (status) => {
-          this.subscriber.status = status;
-          $log.info(`Set subscriber status to: ${status}`);
+        this.updateSubscriber = (subscriber) => {
+
+          Subscribers.update(subscriber).$promise
+          .then(() => {
+            this.success = 'Subscriber successfully updated!';
+          })
+          .catch((e) => {
+            this.formError = e;
+          })
+          .finally(() => {
+            $timeout(() => {
+              this.close();
+            }, 1500);
+          });
         };
       }
     };
diff --git a/views/ngXosViews/diagnostic/src/templates/subscriber-status-modal.tpl.html b/views/ngXosViews/diagnostic/src/templates/subscriber-status-modal.tpl.html
index 6ae28db..7f87999 100644
--- a/views/ngXosViews/diagnostic/src/templates/subscriber-status-modal.tpl.html
+++ b/views/ngXosViews/diagnostic/src/templates/subscriber-status-modal.tpl.html
@@ -3,41 +3,79 @@
     <div class="modal-content">
       <div class="modal-header">
         <button ng-click="vm.close()"  type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
-        <h4 class="modal-title">Change subscriber status:</h4>
+        <h4 class="modal-title">Manage subscriber:</h4>
       </div>
-      <div class="modal-body">
-        <div class="row">
-          <div class="col-xs-6">
-            <a ng-click="vm.setStatus('enabled')" 
-              class="btn btn-block"
-              ng-class="{'btn-primary': vm.subscriber.status === 'enabled' ,'btn-default': vm.subscriber.status !== 'enabled'}"
-              >Enabled</a>
+      <form name="vm.subscriber-detail">
+        <div class="modal-body">
+          <div class="row">
+            <div class="col-xs-12">
+              <label>Status</label>
+            </div>
+            <div class="col-xs-6">
+              <a ng-click="vm.subscriber.status = 'enabled'"
+                class="btn btn-block"
+                ng-class="{'btn-primary': vm.subscriber.status === 'enabled' ,'btn-default': vm.subscriber.status !== 'enabled'}"
+                >Enabled</a>
+            </div>
+            <div class="col-xs-6">
+              <a ng-click="vm.subscriber.status = 'suspended'"
+                class="btn btn-block"
+                ng-class="{'btn-primary': vm.subscriber.status === 'suspended' ,'btn-default': vm.subscriber.status !== 'suspended'}"
+                >Suspended</a>
+            </div>
           </div>
-          <div class="col-xs-6">
-            <a ng-click="vm.setStatus('suspended')" 
-              class="btn btn-block"
-              ng-class="{'btn-primary': vm.subscriber.status === 'suspended' ,'btn-default': vm.subscriber.status !== 'suspended'}"
-              >Suspended</a>
+          <div class="row">
+            <div class="col-xs-6">
+              <a ng-click="vm.subscriber.status = 'delinquent'"
+                class="btn btn-block"
+                ng-class="{'btn-primary': vm.subscriber.status === 'delinquent' ,'btn-default': vm.subscriber.status !== 'delinquent'}"
+                >Delinquent <br> payment</a>
+            </div>
+            <div class="col-xs-6">
+              <a ng-click="vm.subscriber.status = 'copyrightviolation'"
+                class="btn btn-block"
+                ng-class="{'btn-primary': vm.subscriber.status === 'copyrightviolation' ,'btn-default': vm.subscriber.status !== 'copyrightviolation'}"
+                >Copyright <br> violation</a>
+            </div>
+          </div>
+          <div class="row">
+            <div class="col-xs-6">
+              <label>Uplink Speed</label>
+              <input type="number" class="form-control" ng-model="vm.subscriber.uplink_speed"/>
+            </div>
+            <div class="col-xs-6">
+              <label>Downlink Speed</label>
+              <input type="number" class="form-control" ng-model="vm.subscriber.downlink_speed"/>
+            </div>
+          </div>
+          <div class="row">
+            <div class="col-xs-6">
+              <label>Enable Uverse</label>
+            </div>
+            <div class="col-xs-6">
+              <a 
+                ng-click="vm.subscriber.enable_uverse = !vm.subscriber.enable_uverse" 
+                ng-class="{'btn-success': vm.subscriber.enable_uverse, 'btn-danger': !vm.subscriber.enable_uverse}"
+                class="btn btn-block">
+                <span ng-show="vm.subscriber.enable_uverse === true">Enabled</span>
+                <span ng-show="vm.subscriber.enable_uverse !== true">Disabled</span>
+              </a>
+            </div>
           </div>
         </div>
-        <div class="row" style="margin-top: 20px">
-          <div class="col-xs-6">
-            <a ng-click="vm.setStatus('delinquent')" 
-              class="btn btn-block"
-              ng-class="{'btn-primary': vm.subscriber.status === 'delinquent' ,'btn-default': vm.subscriber.status !== 'delinquent'}"
-              >Delinquent <br> payment</a>
+        <div class="modal-footer" ng-show="vm.success || vm.formError">
+          <div class="alert alert-success" ng-show="vm.success">
+            {{vm.success}}
           </div>
-          <div class="col-xs-6">
-            <a ng-click="vm.setStatus('copyright')" 
-              class="btn btn-block"
-              ng-class="{'btn-primary': vm.subscriber.status === 'copyright' ,'btn-default': vm.subscriber.status !== 'copyright'}"
-              >Copyright <br> violation</a>
+          <div class="alert alert-danger" ng-show="vm.formError">
+            {{vm.formError}}
           </div>
         </div>
-      </div>
-      <div class="modal-footer">
-        <button ng-click="vm.close()" type="button" class="btn btn-default" data-dismiss="modal">Close</button>
-      </div>
+        <div class="modal-footer">
+          <button ng-click="vm.close()" type="button" class="btn btn-default" data-dismiss="modal">Close</button>
+          <button ng-click="vm.updateSubscriber(vm.subscriber)" type="button" class="btn btn-primary">Save</button>
+        </div>
+      </form>
     </div><!-- /.modal-content -->
   </div><!-- /.modal-dialog -->
 </div><!-- /.modal -->
\ No newline at end of file
diff --git a/xos/core/xoslib/static/css/xosDiagnostic.css b/xos/core/xoslib/static/css/xosDiagnostic.css
index 088d311..0debce0 100644
--- a/xos/core/xoslib/static/css/xosDiagnostic.css
+++ b/xos/core/xoslib/static/css/xosDiagnostic.css
@@ -1 +1 @@
-#xosDiagnostic,[ui-view]{min-height:700px;position:relative}diagnostic-container .half-height{position:relative;height:50%}diagnostic-container .onethird-height{position:relative;height:33%}diagnostic-container .twothird-height{position:relative;height:67%}diagnostic-container .subscriber-select{max-width:200px;position:absolute;top:20px;right:20px;z-index:1}.half-height+.half-height{border-top:1px solid black}service-topology,logic-topology{height:100%;width:100%;display:block;position:absolute;top:0}logic-topology .subscriber circle,logic-topology .device circle{fill:#fff;stroke:green;stroke-width:1px}logic-topology>svg{position:absolute;top:0}logic-topology .network .cloud{fill:#fff;stroke:green;stroke-width:1px}logic-topology .node.rack>g>rect{fill:#ccc;stroke:steelblue;stroke-width:1px}logic-topology .compute-node>rect{fill:#fff;stroke:steelblue;stroke-width:1px}logic-topology .instance>rect{fill:#eee;stroke:steelblue;stroke-width:1px}logic-topology .node .instance.active rect{fill:lightsteelblue;stroke:steelblue;stroke-width:1px}logic-topology .node .instance.active.good>rect{fill:green}logic-topology .node .instance.active.provisioning>rect{fill:yellow}logic-topology .node .instance.active.bad>rect{fill:red}logic-topology .node .instance .stats-container rect{fill:white}logic-topology .node .instance .stats-container text.name{font-weight:700}logic-topology .node .instance .stats-container text.ip{font-style:italic;font-size:10px}logic-topology .node .instance .stats-container .container rect{fill:#eee;stroke:steelblue;stroke-width:1px}.legend{fill:#fff;stroke:#ccc;stroke-width:1px;position:relative}.legend text{stroke:#000}.node{cursor:pointer}.node circle,.node rect{fill:#fff;stroke:steelblue;stroke-width:1px}.node.subscriber circle,.node.subscriber rect,.node.router circle,.node.router rect{stroke:#05ffcb}.node.slice rect{stroke:#b01dff}.node.instance rect{stroke:#ccc}.node.instance rect.active{stroke:#ff8b00}.node rect.slice-detail{fill:#fff;stroke:steelblue;stroke-width:3px}.node text{font:12px sans-serif}.link,.device-link{fill:none;stroke:#ccc;stroke-width:2px}.link.slice{stroke:rgba(157,4,183,.29)}.link.instance{stroke:#ccc}.link.instance.active{stroke:rgba(255,138,0,.65)}.service-details{width:200px;position:absolute;top:20px;right:20px}.animate.ng-hide-remove{animation:.5s bounceInRight ease}.animate.ng-hide-add{animation:.5s bounceOutRight ease}.loader{font-size:10px;margin:150px auto;text-indent:-9999em;width:11em;height:11em;border-radius:50%;background:#fff;background:linear-gradient(to right,#fff 10%,rgba(255,255,255,0) 42%);position:relative;animation:load3 1.4s infinite linear;transform:translateZ(0)}.loader:before{width:50%;height:50%;background:#105e9e;border-radius:100% 0 0;position:absolute;top:0;left:0;content:''}.loader:after{background:#fff;width:75%;height:75%;border-radius:50%;content:'';margin:auto;position:absolute;top:0;left:0;bottom:0;right:0}@keyframes load3{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.modal.fade.in{display:block}@keyframes bounceInRight{from,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1.000)}from{opacity:0;transform:translate3d(3000px,0,0)}60%{opacity:1;transform:translate3d(-25px,0,0)}75%{transform:translate3d(10px,0,0)}90%{transform:translate3d(-5px,0,0)}to{transform:none}}@keyframes bounceOutRight{20%{opacity:1;transform:translate3d(-20px,0,0)}to{opacity:0;transform:translate3d(2000px,0,0)}}
\ No newline at end of file
+#xosDiagnostic,[ui-view]{min-height:700px;position:relative}diagnostic-container .half-height{position:relative;height:50%}diagnostic-container .onethird-height{position:relative;height:33%}diagnostic-container .twothird-height{position:relative;height:67%}diagnostic-container .subscriber-select{max-width:200px;position:absolute;top:20px;right:20px;z-index:1}subscriber-status-modal .row+.row{margin-top:20px}.half-height+.half-height{border-top:1px solid black}service-topology,logic-topology{height:100%;width:100%;display:block;position:absolute;top:0}logic-topology .subscriber circle,logic-topology .device circle{fill:#fff;stroke:green;stroke-width:1px}logic-topology>svg{position:absolute;top:0}logic-topology .network .cloud{fill:#fff;stroke:green;stroke-width:1px}logic-topology .node.rack>g>rect{fill:#ccc;stroke:steelblue;stroke-width:1px}logic-topology .compute-node>rect{fill:#fff;stroke:steelblue;stroke-width:1px}logic-topology .instance>rect{fill:#eee;stroke:steelblue;stroke-width:1px}logic-topology .node .instance.active rect{fill:lightsteelblue;stroke:steelblue;stroke-width:1px}logic-topology .node .instance.active.good>rect{fill:green}logic-topology .node .instance.active.provisioning>rect{fill:yellow}logic-topology .node .instance.active.bad>rect{fill:red}logic-topology .node .instance .stats-container rect{fill:white}logic-topology .node .instance .stats-container text.name{font-weight:700}logic-topology .node .instance .stats-container text.ip{font-style:italic;font-size:10px}logic-topology .node .instance .stats-container .container rect{fill:#eee;stroke:steelblue;stroke-width:1px}.legend{fill:#fff;stroke:#ccc;stroke-width:1px;position:relative}.legend text{stroke:#000}.node{cursor:pointer}.node circle,.node rect{fill:#fff;stroke:steelblue;stroke-width:1px}.node.subscriber circle,.node.subscriber rect,.node.router circle,.node.router rect{stroke:#05ffcb}.node.slice rect{stroke:#b01dff}.node.instance rect{stroke:#ccc}.node.instance rect.active{stroke:#ff8b00}.node rect.slice-detail{fill:#fff;stroke:steelblue;stroke-width:3px}.node text{font:12px sans-serif}.link,.device-link{fill:none;stroke:#ccc;stroke-width:2px}.link.slice{stroke:rgba(157,4,183,.29)}.link.instance{stroke:#ccc}.link.instance.active{stroke:rgba(255,138,0,.65)}.service-details{width:200px;position:absolute;top:20px;right:20px}.animate.ng-hide-remove{animation:.5s bounceInRight ease}.animate.ng-hide-add{animation:.5s bounceOutRight ease}.loader{font-size:10px;margin:150px auto;text-indent:-9999em;width:11em;height:11em;border-radius:50%;background:#fff;background:linear-gradient(to right,#fff 10%,rgba(255,255,255,0) 42%);position:relative;animation:load3 1.4s infinite linear;transform:translateZ(0)}.loader:before{width:50%;height:50%;background:#105e9e;border-radius:100% 0 0;position:absolute;top:0;left:0;content:''}.loader:after{background:#fff;width:75%;height:75%;border-radius:50%;content:'';margin:auto;position:absolute;top:0;left:0;bottom:0;right:0}@keyframes load3{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.modal.fade.in{display:block}@keyframes bounceInRight{from,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1.000)}from{opacity:0;transform:translate3d(3000px,0,0)}60%{opacity:1;transform:translate3d(-25px,0,0)}75%{transform:translate3d(10px,0,0)}90%{transform:translate3d(-5px,0,0)}to{transform:none}}@keyframes bounceOutRight{20%{opacity:1;transform:translate3d(-20px,0,0)}to{opacity:0;transform:translate3d(2000px,0,0)}}
\ No newline at end of file
diff --git a/xos/core/xoslib/static/js/xosDiagnostic.js b/xos/core/xoslib/static/js/xosDiagnostic.js
index d11e839..d515105 100644
--- a/xos/core/xoslib/static/js/xosDiagnostic.js
+++ b/xos/core/xoslib/static/js/xosDiagnostic.js
@@ -18,7 +18,7 @@
 angular.module("xos.diagnostic").run(["$templateCache", function($templateCache) {$templateCache.put("templates/diagnostic.tpl.html","<div class=\"container-fluid\">\n  <div ng-hide=\"vm.error && vm.loader\" style=\"height: 900px\">\n    <div class=\"onethird-height\">\n      <service-topology service-chain=\"vm.serviceChain\"></service-topology>\n    </div>\n    <div class=\"twothird-height\">\n      <logic-topology ng-if=\"vm.subscribers\" subscribers=\"vm.subscribers\" selected=\"vm.selectedSubscriber\"></logic-topology>\n    </div>\n  </div>\n  <div class=\"row\" ng-if=\"vm.error\">\n    <div class=\"col-xs-12\">\n      <div class=\"alert alert-danger\">\n        {{vm.error}}\n      </div>\n    </div>\n  </div>\n  <div class=\"row\" ng-if=\"vm.loader\">\n    <div class=\"col-xs-12\">\n      <div class=\"loader\">Loading</div>\n    </div>\n  </div>\n</div>");
 $templateCache.put("templates/logicTopology.tpl.html","<select-subscriber-modal open=\"vm.openSelectSubscriberModal\" subscribers=\"vm.subscribers\"></select-subscriber-modal>\n<subscriber-status-modal open=\"vm.openSubscriberStatusModal\" subscriber=\"vm.currentSubscriber\"></subscriber-status-modal>\n<div class=\"instances-stats animate\" ng-hide=\"vm.hideInstanceStats\">\n  <div class=\"row\">\n    <div class=\"col-sm-3 col-sm-offset-8\">\n      <div class=\"panel panel-primary\" ng-repeat=\"instance in vm.selectedInstances\">\n        <div class=\"panel-heading\">\n          {{instance.humanReadableName}}\n        </div>\n          <ul class=\"list-group\">\n            <li class=\"list-group-item\">Backend Status: {{instance.backend_status}}</li>\n            <li class=\"list-group-item\">IP Address: {{instance.ip}}</li>\n          </ul>\n          <ul class=\"list-group\">\n            <li class=\"list-group-item\" ng-repeat=\"stat in instance.stats\">\n              <span class=\"badge\">{{stat.value}}</span>\n              {{stat.meter}}\n            </li>\n          </ul>\n        </div>\n      </div>  \n    </div>\n  </div>\n</div>");
 $templateCache.put("templates/select-subscriber-modal.tpl.html","<div class=\"modal fade\" ng-class=\"{in: vm.open}\" tabindex=\"-1\" role=\"dialog\">\n  <div class=\"modal-dialog modal-sm\">\n    <div class=\"modal-content\">\n      <div class=\"modal-header\">\n        <button ng-click=\"vm.close()\"  type=\"button\" class=\"close\" data-dismiss=\"modal\" aria-label=\"Close\"><span aria-hidden=\"true\">&times;</span></button>\n        <h4 class=\"modal-title\">Select a subscriber:</h4>\n      </div>\n      <div class=\"modal-body\">\n        <select class=\"form-control\" ng-options=\"s as s.humanReadableName for s in vm.subscribers\" ng-model=\"vm.selected\"></select>\n      </div>\n      <div class=\"modal-footer\">\n        <button ng-click=\"vm.close()\" type=\"button\" class=\"btn btn-default\" data-dismiss=\"modal\">Close</button>\n        <button ng-click=\"vm.select(vm.selected)\" type=\"button\" class=\"btn btn-primary\">Select</button>\n      </div>\n    </div><!-- /.modal-content -->\n  </div><!-- /.modal-dialog -->\n</div><!-- /.modal -->");
-$templateCache.put("templates/subscriber-status-modal.tpl.html","<div class=\"modal fade\" ng-class=\"{in: vm.open}\" tabindex=\"-1\" role=\"dialog\">\n  <div class=\"modal-dialog modal-sm\">\n    <div class=\"modal-content\">\n      <div class=\"modal-header\">\n        <button ng-click=\"vm.close()\"  type=\"button\" class=\"close\" data-dismiss=\"modal\" aria-label=\"Close\"><span aria-hidden=\"true\">&times;</span></button>\n        <h4 class=\"modal-title\">Change subscriber status:</h4>\n      </div>\n      <div class=\"modal-body\">\n        <div class=\"row\">\n          <div class=\"col-xs-6\">\n            <a ng-click=\"vm.setStatus(\'enabled\')\" \n              class=\"btn btn-block\"\n              ng-class=\"{\'btn-primary\': vm.subscriber.status === \'enabled\' ,\'btn-default\': vm.subscriber.status !== \'enabled\'}\"\n              >Enabled</a>\n          </div>\n          <div class=\"col-xs-6\">\n            <a ng-click=\"vm.setStatus(\'suspended\')\" \n              class=\"btn btn-block\"\n              ng-class=\"{\'btn-primary\': vm.subscriber.status === \'suspended\' ,\'btn-default\': vm.subscriber.status !== \'suspended\'}\"\n              >Suspended</a>\n          </div>\n        </div>\n        <div class=\"row\" style=\"margin-top: 20px\">\n          <div class=\"col-xs-6\">\n            <a ng-click=\"vm.setStatus(\'delinquent\')\" \n              class=\"btn btn-block\"\n              ng-class=\"{\'btn-primary\': vm.subscriber.status === \'delinquent\' ,\'btn-default\': vm.subscriber.status !== \'delinquent\'}\"\n              >Delinquent <br> payment</a>\n          </div>\n          <div class=\"col-xs-6\">\n            <a ng-click=\"vm.setStatus(\'copyright\')\" \n              class=\"btn btn-block\"\n              ng-class=\"{\'btn-primary\': vm.subscriber.status === \'copyright\' ,\'btn-default\': vm.subscriber.status !== \'copyright\'}\"\n              >Copyright <br> violation</a>\n          </div>\n        </div>\n      </div>\n      <div class=\"modal-footer\">\n        <button ng-click=\"vm.close()\" type=\"button\" class=\"btn btn-default\" data-dismiss=\"modal\">Close</button>\n      </div>\n    </div><!-- /.modal-content -->\n  </div><!-- /.modal-dialog -->\n</div><!-- /.modal -->");}]);
+$templateCache.put("templates/subscriber-status-modal.tpl.html","<div class=\"modal fade\" ng-class=\"{in: vm.open}\" tabindex=\"-1\" role=\"dialog\">\n  <div class=\"modal-dialog modal-sm\">\n    <div class=\"modal-content\">\n      <div class=\"modal-header\">\n        <button ng-click=\"vm.close()\"  type=\"button\" class=\"close\" data-dismiss=\"modal\" aria-label=\"Close\"><span aria-hidden=\"true\">&times;</span></button>\n        <h4 class=\"modal-title\">Manage subscriber:</h4>\n      </div>\n      <form name=\"vm.subscriber-detail\">\n        <div class=\"modal-body\">\n          <div class=\"row\">\n            <div class=\"col-xs-12\">\n              <label>Status</label>\n            </div>\n            <div class=\"col-xs-6\">\n              <a ng-click=\"vm.subscriber.status = \'enabled\'\"\n                class=\"btn btn-block\"\n                ng-class=\"{\'btn-primary\': vm.subscriber.status === \'enabled\' ,\'btn-default\': vm.subscriber.status !== \'enabled\'}\"\n                >Enabled</a>\n            </div>\n            <div class=\"col-xs-6\">\n              <a ng-click=\"vm.subscriber.status = \'suspended\'\"\n                class=\"btn btn-block\"\n                ng-class=\"{\'btn-primary\': vm.subscriber.status === \'suspended\' ,\'btn-default\': vm.subscriber.status !== \'suspended\'}\"\n                >Suspended</a>\n            </div>\n          </div>\n          <div class=\"row\">\n            <div class=\"col-xs-6\">\n              <a ng-click=\"vm.subscriber.status = \'delinquent\'\"\n                class=\"btn btn-block\"\n                ng-class=\"{\'btn-primary\': vm.subscriber.status === \'delinquent\' ,\'btn-default\': vm.subscriber.status !== \'delinquent\'}\"\n                >Delinquent <br> payment</a>\n            </div>\n            <div class=\"col-xs-6\">\n              <a ng-click=\"vm.subscriber.status = \'copyrightviolation\'\"\n                class=\"btn btn-block\"\n                ng-class=\"{\'btn-primary\': vm.subscriber.status === \'copyrightviolation\' ,\'btn-default\': vm.subscriber.status !== \'copyrightviolation\'}\"\n                >Copyright <br> violation</a>\n            </div>\n          </div>\n          <div class=\"row\">\n            <div class=\"col-xs-6\">\n              <label>Uplink Speed</label>\n              <input type=\"number\" class=\"form-control\" ng-model=\"vm.subscriber.uplink_speed\"/>\n            </div>\n            <div class=\"col-xs-6\">\n              <label>Downlink Speed</label>\n              <input type=\"number\" class=\"form-control\" ng-model=\"vm.subscriber.downlink_speed\"/>\n            </div>\n          </div>\n          <div class=\"row\">\n            <div class=\"col-xs-6\">\n              <label>Enable Uverse</label>\n            </div>\n            <div class=\"col-xs-6\">\n              <a \n                ng-click=\"vm.subscriber.enable_uverse = !vm.subscriber.enable_uverse\" \n                ng-class=\"{\'btn-success\': vm.subscriber.enable_uverse, \'btn-danger\': !vm.subscriber.enable_uverse}\"\n                class=\"btn btn-block\">\n                <span ng-show=\"vm.subscriber.enable_uverse === true\">Enabled</span>\n                <span ng-show=\"vm.subscriber.enable_uverse !== true\">Disabled</span>\n              </a>\n            </div>\n          </div>\n        </div>\n        <div class=\"modal-footer\" ng-show=\"vm.success || vm.formError\">\n          <div class=\"alert alert-success\" ng-show=\"vm.success\">\n            {{vm.success}}\n          </div>\n          <div class=\"alert alert-danger\" ng-show=\"vm.formError\">\n            {{vm.formError}}\n          </div>\n        </div>\n        <div class=\"modal-footer\">\n          <button ng-click=\"vm.close()\" type=\"button\" class=\"btn btn-default\" data-dismiss=\"modal\">Close</button>\n          <button ng-click=\"vm.updateSubscriber(vm.subscriber)\" type=\"button\" class=\"btn btn-primary\">Save</button>\n        </div>\n      </form>\n    </div><!-- /.modal-content -->\n  </div><!-- /.modal-dialog -->\n</div><!-- /.modal -->");}]);
 'use strict';
 
 (function () {
@@ -56,25 +56,31 @@
       restrict: 'E',
       templateUrl: 'templates/subscriber-status-modal.tpl.html',
       controllerAs: 'vm',
-      controller: ["$log", "$scope", function controller($log, $scope) {
+      controller: ["$log", "$timeout", "$scope", "Subscribers", function controller($log, $timeout, $scope, Subscribers) {
         var _this2 = this;
 
-        // mock until api
         $scope.$watch(function () {
-          return _this2.subscriber;
-        }, function (subscriber) {
-          if (subscriber) {
-            subscriber.status = 'enabled';
-          }
+          return _this2.open;
+        }, function () {
+          _this2.success = null;
+          _this2.formError = null;
         });
 
         this.close = function () {
           _this2.open = false;
         };
 
-        this.setStatus = function (status) {
-          _this2.subscriber.status = status;
-          $log.info('Set subscriber status to: ' + status);
+        this.updateSubscriber = function (subscriber) {
+
+          Subscribers.update(subscriber).$promise.then(function () {
+            _this2.success = 'Subscriber successfully updated!';
+          })['catch'](function (e) {
+            _this2.formError = e;
+          })['finally'](function () {
+            $timeout(function () {
+              _this2.close();
+            }, 1500);
+          });
         };
       }]
     };
@@ -466,6 +472,10 @@
     });
   }]).service('Subscribers', ["$resource", "$q", "SubscriberDevice", function ($resource, $q, SubscriberDevice) {
     return $resource('/xoslib/cordsubscriber/:id', { id: '@id' }, {
+      update: {
+        method: 'PUT',
+        isArray: false
+      },
       queryWithDevices: {
         method: 'GET',
         isArray: true,
@@ -1714,10 +1724,10 @@
       _this.currentSubscriber.tags = tags;
     };
 
-    this.getSubscriberIP = function () {
-      var ip = JSON.parse(_this.currentServiceChain.children[0].children[0].tenant.service_specific_attribute).wan_container_ip;
+    this.getSubscriberIP = function (subscriber) {
+      // const ip = JSON.parse(this.currentServiceChain.children[0].children[0].tenant.service_specific_attribute).wan_container_ip;
       // const ip = this.currentServiceChain.children[0].children[0].tenant.wan_container_ip;
-      _this.logicTopologyData.children[0].subscriberIP = ip;
+      _this.logicTopologyData.children[0].subscriberIP = subscriber.wan_container_ip;
     };
 
     this.selectSubscriber = function (subscriber) {
@@ -1730,7 +1740,7 @@
       _this.highlightInstances([]);
 
       _this.getSubscriberTag(subscriber);
-      _this.getSubscriberIP();
+      _this.getSubscriberIP(subscriber);
     };
 
     this.highlightInstances = function (instances) {