diff --git a/xos/configurations/common/Dockerfile.common b/xos/configurations/common/Dockerfile.common
index 03b479a..ede0cb3 100644
--- a/xos/configurations/common/Dockerfile.common
+++ b/xos/configurations/common/Dockerfile.common
@@ -43,7 +43,7 @@
 RUN pip install django-crispy-forms
 RUN pip install django-geoposition
 RUN pip install django-extensions
-RUN pip install django-suit
+RUN pip install django-suit==0.3a1
 RUN pip install django-bitfield
 RUN pip install django-ipware
 RUN pip install django-encrypted-fields
diff --git a/xos/core/static/xos.css b/xos/core/static/xos.css
index 33d05cb..14702d9 100644
--- a/xos/core/static/xos.css
+++ b/xos/core/static/xos.css
@@ -1,4 +1,4 @@
-g/*************************
+/*************************
 colors:
     tab - active/focus color
     background-color: #105E9E !important;
@@ -12,6 +12,274 @@
 
 *************************/
 
+html, body {
+  /*height: 100%;*/
+  min-height: 100%;
+  margin: 0;
+}
+
+body{
+  max-width: 100%;
+  overflow-x: hidden;
+}
+
+/*#wrap {
+  min-height: 100%;
+}*/
+
+/* ************************* SIDENAV TOGGLE ************************* */
+
+#wrapper {
+    padding-left: 0;
+    -webkit-transition: all 0.5s ease;
+    -moz-transition: all 0.5s ease;
+    -o-transition: all 0.5s ease;
+    transition: all 0.5s ease;
+}
+
+#wrapper.toggled {
+    padding-left: 250px;
+}
+
+#sidebar-wrapper {
+  z-index: 1000;
+  position: fixed;
+  left: 250px;
+  width: 0;
+  height: 100%;
+  margin-left: -250px;
+  overflow-y: auto;
+  -webkit-transition: all 0.5s ease;
+  -moz-transition: all 0.5s ease;
+  -o-transition: all 0.5s ease;
+  transition: all 0.5s ease;
+}
+
+#wrapper.toggled #sidebar-wrapper {
+  width: 250px;
+  padding: 10px;
+}
+
+#page-content-wrapper {
+    width: 100%;
+    position: absolute;
+    padding: 15px;
+}
+
+#wrapper.toggled #page-content-wrapper {
+    position: absolute;
+    margin-right: -250px;
+}
+
+@media(min-width:768px) {
+    #wrapper {
+        padding-left: 250px;
+    }
+
+    #wrapper.toggled {
+        padding-left: 0;
+    }
+
+    #sidebar-wrapper {
+      width: 250px;
+      padding: 10px;
+    }
+
+    #wrapper.toggled #sidebar-wrapper {
+        width: 0;
+    }
+
+    #page-content-wrapper {
+        padding: 20px;
+        position: relative;
+    }
+
+    #wrapper.toggled #page-content-wrapper {
+        position: relative;
+        margin-right: 0;
+    }
+}
+
+.navbar-toggle{
+  border: 1px solid #08C;
+}
+
+.navbar-toggle .icon-bar{
+  background: #08C;
+}
+/* ************************* END SIDENAV TOGGLE ************************* */
+
+/* ************************* HEADER STYLE ************************* */
+
+.header{
+  background-color: #ffffff !important;
+  border-bottom: 3px solid #C5CCD4;
+  margin-bottom: 14px;
+  height: 85px;
+}
+
+.header .logo{
+  max-height: 80px;
+}
+
+.nav-quick-search{
+  margin: 30px -10px 0px 0px !important;
+  padding:0 25px 0 0 !important;
+  float:right !important;
+}
+
+.nav-quick-search .search-query{
+  border-radius:5px;
+  border:none;
+  box-shadow:0px;
+  background-color:lightGrey;
+  padding-left: 27px;
+}
+
+
+.header #branding {
+  width: 100%;
+  height:60px;
+  border-right:none;
+}
+
+.header a {
+  color: #08C;
+  font-weight: bold;
+  /*border-bottom: 1px solid #C5CCD4;*/
+}
+a {
+  color: #08C;
+  font-weight: bold;
+  /*border-bottom: 1px solid #C5CCD4;*/
+}
+
+
+#branding2{
+height:20px;
+width:100%;
+color: #333;
+/*background-color: #000000;*/
+margin-bottom: 10px;
+}
+
+.header #user-tools {
+    padding: 12px 20px 0px 0px;
+    float: right;
+    margin-top: -5px;
+}
+
+.header .header-content .date{
+padding-left:10px;
+}
+
+.header .header-content .time {
+font-weight: normal;
+}
+.header .header-content.header-content-first{
+height: 15px;
+padding-bottom: 0px;
+}
+
+.header .header-content {
+padding-bottom: 0px;
+padding: 7px 0 0 0px;
+}
+
+/************************* END HEADER *************************/
+
+/************************* FOOTER *************************/
+
+.footer{
+  z-index: 1001;
+}
+
+/* FIXME */
+@media(max-width:768px) {
+  .footer{
+    display: none;
+  }
+
+  #page-content-wrapper{
+    padding-bottom: 60px;
+  }
+}
+
+.footer .content .statusMsg {
+    float: right;
+    padding: 15px 20px 0 0;
+    display: block;
+}
+/************************* END FOOTER *************************/
+
+/************************* NAV *************************/
+
+#sidebar-wrapper {
+  -webkit-box-shadow: 3px 0px 5px 0px rgba(50, 50, 50, 0.75);
+  -moz-box-shadow:    3px 0px 5px 0px rgba(50, 50, 50, 0.75);
+  box-shadow:         3px 0px 5px 0px rgba(50, 50, 50, 0.75);
+}
+
+#sidebar-wrapper .logo{
+  max-width: 100%;
+}
+
+.icon-app {
+background-image: url("opencloudApp.png");
+}
+.icon-home {
+/*  Going with darker standard color nav -- so using over png's background-image: url("Home.png"); */
+background-image: url("Home.png");
+}
+.icon-deployment{
+background-image: url("Deployments.png");
+}
+.icon-site{
+background-image: url("Sites.png");
+}
+.icon-slice{
+background-image: url("Slices.png");
+}
+.icon-user{
+background-image: url("Users.png");
+}
+.icon-reservation{
+background-image: url("Reservations.png");
+}
+
+#sidebar-wrapper>ul>li.active>a>.icon-home ,
+/*#sidebar-wrapper>ul>li:hover>a>.icon-home ,*/
+#sidebar-wrapper>ul>li.focus>a>.icon-home{
+  background-image: url("Home_over.png");
+}
+
+#sidebar-wrapper>ul>li.active>a>.icon-deployment,
+/*#sidebar-wrapper>ul>li:hover>a>.icon-deployment,*/
+#sidebar-wrapper>ul>li.focus>a>.icon-deployment{
+  background-image: url("Deployments_over.png");
+}
+#sidebar-wrapper>ul>li.active>a>.icon-site,
+/*#sidebar-wrapper>ul>li:hover>a>.icon-site,*/
+#sidebar-wrapper>ul>li.focus>a>.icon-site{
+  background-image: url("Sites_over.png");
+}
+#sidebar-wrapper>ul>li.active>a>.icon-slice,
+/*#sidebar-wrapper>ul>li:hover>a>.icon-slice,*/
+#sidebar-wrapper>ul>li.focus>a>.icon-slice{
+  background-image: url("Slices_over.png");
+}
+#sidebar-wrapper>ul>li.active>a>.icon-user,
+/*#sidebar-wrapper>ul>li:hover>a>.icon-user,*/
+#sidebar-wrapper>ul>li.focus>a>.icon-user{
+  background-image: url("Users_over.png");
+}
+#sidebar-wrapper>ul>li.active>a>.icon-reservation,
+/*#sidebar-wrapper>ul>li:hover>a>.icon-reservation,*/
+#sidebar-wrapper>ul>li.focus>a>.icon-reservation{
+  background-image: url("Reservations_over.png");
+}
+/************************* END NAV *************************/
+
 /*   CSS for jquery Tabs */
 #hometabs {
 border-bottom: 1px solid #105E9E;
@@ -50,97 +318,7 @@
     text-shadow: rgb(46, 43, 43) 0.1em 0.1em 0.2em;
     font-weight: normal;
 }
-/*************************/
-/*  Header elements      */
 
-.logo {
-}
-.header{
-    background-color: #ffffff !important;
-    /*background-image: url('bg2.jpg');*/
-    background-size: 100% auto;
-    background-image: none !important;
-    text-shadow: none;
-    border-bottom: 3px solid #C5CCD4;
-    margin-bottom: 14px;
-    margin-top: -120px;
-    height: 85px;
-    /*min-width: 1321px;*/
-}
-
-.nav-quick-search{
-margin: 30px -10px 0px 0px !important;
-padding:0 25px 0 0 !important;
-float:right !important;
-}
-
-.nav-quick-search .search-query{
-border-radius:5px;
-border:none;
-box-shadow:0px;
-background-color:lightGrey;
-padding-left: 27px;
-}
-
-
-.header #branding {
-width: 100%;
-height:60px;
-}
-
-.header a {
-color: #08C;
-font-weight: bold;
-/*border-bottom: 1px solid #C5CCD4;*/
-}
-a {
-color: #08C;
-font-weight: bold;
-/*border-bottom: 1px solid #C5CCD4;*/
-}
-
-.header #branding {
-border-right:none;
-}
-
-#branding2{
-height:20px;
-width:100%;
-color: #333;
-/*background-color: #000000;*/
-margin-bottom: 10px;
-}
-
-.header #user-tools {
-    padding: 12px 20px 0px 0px;
-    float: right;
-    margin-top: -5px;
-}
-
-.header .header-content .date{
-padding-left:10px;
-}
-
-.header .header-content .time {
-font-weight: normal;
-}
-.header .header-content.header-content-first{
-height: 15px;
-padding-bottom: 0px;
-}
-
-.header .header-content {
-padding-bottom: 0px;
-padding: 7px 0 0 0px;
-}
-
-/*************************/
-
-.footer .content .statusMsg {
-    float: right;
-    padding: 15px 20px 0 0;
-    display: block;
-}
 
 .alignCenter {
     text-align: center !important;
@@ -248,7 +426,7 @@
 #suit-center {
 padding: 20px;
 width: 100%;
-min-width:650px;
+/*min-width:650px;*/
 }
 .inner-two-columns .inner-center-column .tab-content {
 overflow-x: auto;
@@ -266,60 +444,12 @@
 margin-bottom: 5px;
 }
 
-
-/*For changing the background color of the left side navigation list items*/
-/*For changing the color of the left side navigation list items*/
-/*For changing the font of the left side navigation list items*/
-.left-nav>ul>li>a {
-/*background-color: #CDE7FF;*/
-/* Light color nav choices */
-/*background-color: #DFECF8;*/
-/*background-color: #91BFE4;*/
-/*background-color: #DAECFC;*/
-background-color: #448CCA;
-/*ONlab.us reg color blue*/
-/*background-color: #ccffff;*/
-font-weight: normal;
-/*color: #105E9E;*/
-color: #ffffff;
-text-shadow: rgb(46, 43, 43) 0.1em 0.1em 0.2em;
-letter-spacing: 1px;
-font-size: 12px;
-border-bottom: none;
-}
-
-/*For giving the padding for the left side navigation*/
-.left-nav>ul {
-padding-left: 5px;
-}
-
-/*For increasing the height of left side navigation list items*/
-.left-nav>ul>li {
-padding-top:4px;
-line-height: 35px;
-width: 200px;
-}
-
 /*For changing background color of suit center*/
 #suit-center {
 background-color: #ffffff;
 }
 
-.left-nav>ul>li.active>a {
-/*background-color: #448CCA;*/
-/* Last Active
-background-color: #0061B7; */
-background-color: #515151;
-/*background-color: #448CCA;*/
-font-weight:normal;
-color:#ffffff;
-text-shadow: rgb(46, 43, 43) 0.1em 0.1em 0.2em;
-letter-spacing: 1px;
 
-/*left: 10px;*/
-background-image: url("right_arrow.png");
-    background-position: 97% center;
-}
 
 
 .nav-tabs-suit li{
@@ -380,37 +510,6 @@
 line-height: 0;
 }
 
-
-/* create an arrow that points down */
-
-
-.left-nav>ul>li.active>a:hover{
-/*background-color: #448CCA;*/
-/*background-color: #91BFE4;*/
-/*background-color: #D6E7F8;*/
-font-weight:normal;
-font-size: 1.2em;
-/*font-weight: bold;*/
-color:#ffffff;
-/*padding-top:10px;*/
-text-decoration:none;
-}
-
-/* Adjust font weight to normal on hover, else white blurs */
-.left-nav>ul>li>a:hover{
-/*background-color: #448CCA;*/
-/*background-color: #004775;*/
-background-color: #515151;
-color:#ffffff;
-font-weight:normal;
-font-size: 1.2em;
-/*padding-top:10px;*/
-text-decoration:none;
-/*border-left: 15px solid #105E9E ;*/
-border-left: 10px solid #ffffff;
-text-shadow: rgb(46, 43, 43) 0.1em 0.1em 0.2em;
-letter-spacing: 1px;
-}
 .nav-tabs-suit li.active a:hover,.nav-tabs-suit li a:hover{
 /*background-color: #448CCA;*/
 background-color: #515151;
@@ -600,9 +699,10 @@
 }*/
 
 .login {
-background-image: url('bg.jpg');
-background-size: 100%;
-background-repeat: no-repeat;
+  background-image: url('bg.jpg');
+  background-size: cover;
+  background-position: center; 
+  background-repeat: no-repeat;
 }
 
 
@@ -622,7 +722,7 @@
     browser resizes **/
 #content-main {
     overflow-x:auto;
-    min-width: 1000px;
+    /*min-width: 1000px;*/
 }
 
 .tab-content tab-content-main {
@@ -666,14 +766,14 @@
 
 .login #wrap {
     background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
+    overflow: hidden;
+    padding: 0f;
 }
 #wrap {
     background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
 }
 #wrap {
-    height: auto !important;
-    margin: 0 auto -60px;
-    min-height: 100%;
+    padding-bottom: 60px;
 }
 
 .forgotLink {
@@ -709,7 +809,6 @@
 
 /*Added by Beena for adding the three components in dashboard*/
 .breadcrumb{
-		width: 37%;
 	display:inline-block;
 	background-color: #fff;
 
@@ -766,52 +865,13 @@
 }
 
 .icon-home ,.icon-deployment ,.icon-site ,.icon-slice ,.icon-user, .icon-reservation, .icon-app{
-background-position: left center;
-width:22px;
-height:22px;	
-}
-
-.icon-app {
-background-image: url("opencloudApp.png");
-}
-.icon-home {
-/*  Going with darker standard color nav -- so using over png's background-image: url("Home.png"); */
-background-image: url("Home_over.png");
-}
-.icon-deployment{
-background-image: url("Deployments_over.png");
-}
-.icon-site{
-background-image: url("Sites_over.png");
-}
-.icon-slice{
-background-image: url("Slices_over.png");
-}
-.icon-user{
-background-image: url("Users_over.png");
-}
-.icon-reservation{
-background-image: url("Reservations_over.png");
-}
-
-.left-nav>ul>li.active>a>.icon-home , .left-nav>ul>li:hover>a>.icon-home , .left-nav>ul>li.focus>a>.icon-home{
-background-image: url("Home_over.png");
-}
-
-.left-nav>ul>li.active>a>.icon-deployment,.left-nav>ul>li:hover>a>.icon-deployment,.left-nav>ul>li.focus>a>.icon-deployment{
-background-image: url("Deployments_over.png");
-}
-.left-nav>ul>li.active>a>.icon-site , .left-nav>ul>li:hover>a>.icon-site , .left-nav>ul>li.focus>a>.icon-site{
-background-image: url("Sites_over.png");
-}
-.left-nav>ul>li.active>a>.icon-slice , .left-nav>ul>li:hover>a>.icon-slice , .left-nav>ul>li.focus>a>.icon-slice {
-background-image: url("Slices_over.png");
-}
-.left-nav>ul>li.active>a>.icon-user , .left-nav>ul>li:hover>a>.icon-user , .left-nav>ul>li.focus>a>.icon-user{
-background-image: url("Users_over.png");
-}
-.left-nav>ul>li.active>a>.icon-reservation , .left-nav>ul>li:hover>a>.icon-reservation , .left-nav>ul>li.focus>a>.icon-reservation{
-background-image: url("Reservations_over.png");
+  background-position: left center;
+  width:22px;
+  height:22px;
+  display: inline-block;
+  margin-right: 10px;
+  position: relative;
+  top: 5px;
 }
 
 #dashboardHPC {
diff --git a/xos/core/xoslib/ngXosLib/generator-xos/app/index.js b/xos/core/xoslib/ngXosLib/generator-xos/app/index.js
index a6dd8eb..547a8f9 100755
--- a/xos/core/xoslib/ngXosLib/generator-xos/app/index.js
+++ b/xos/core/xoslib/ngXosLib/generator-xos/app/index.js
@@ -10,7 +10,7 @@
     return string.replace(/^./, string[0].toUpperCase());
   },
   prompting: {
-    name: function(){
+    name:function(){
       var done = this.async();
       this.prompt({
         type    : 'input',
@@ -23,38 +23,38 @@
         done();
       }.bind(this));
     },
-    url: function(){
+    host:function(){
       var done = this.async();
       this.prompt({
-        type: 'input',
-        name: 'host',
-        message: 'Insert your backend URL:'
-      }, function(answers){
+        type    : 'input',
+        name    : 'host',
+        message : 'Your project remote host (with port)'
+      }, function (answers) {
         config.host = answers.host;
         done();
-      })
+      }.bind(this));
     },
-    token: function(){
+    token:function(){
       var done = this.async();
       this.prompt({
-        type: 'input',
-        name: 'token',
-        message: 'Insert your backend Token:'
-      }, function(answers){
+        type    : 'input',
+        name    : 'token',
+        message : 'Insert your active session token'
+      }, function (answers) {
         config.token = answers.token;
         done();
-      })
+      }.bind(this));
     },
-    session: function(){
+    session:function(){
       var done = this.async();
       this.prompt({
-        type: 'input',
-        name: 'session',
-        message: 'Insert your backend session Id:'
-      }, function(answers){
+        type    : 'input',
+        name    : 'session',
+        message : 'Insert your active session id'
+      }, function (answers) {
         config.session = answers.session;
         done();
-      })
+      }.bind(this));
     }
   },
   writing: {
@@ -69,7 +69,7 @@
         { name: config.name, author: {name:user.git.name()} }
       );
     },
-    env: function(){
+    envConfig: function(){
       this.fs.copyTpl(
         this.templatePath('env/default.js'),
         this.destinationPath(`${this.config.get('folder')}/${config.name}/env/default.js`),
diff --git a/xos/core/xoslib/ngXosViews/contentProvider/gulp/build.js b/xos/core/xoslib/ngXosViews/contentProvider/gulp/build.js
index e851505..9af8074 100644
--- a/xos/core/xoslib/ngXosViews/contentProvider/gulp/build.js
+++ b/xos/core/xoslib/ngXosViews/contentProvider/gulp/build.js
@@ -23,7 +23,10 @@
 var rename = require('gulp-rename');
 var replace = require('gulp-replace');
 
-var TEMPLATE_FOOTER = '}]);angular.bootstrap(angular.element(\'#xosContentProvider\'), [\'xos.contentProvider\']);';
+var TEMPLATE_FOOTER = `}]);
+angular.module('xos.contentProvider').run(function($location){$location.path('/')});
+angular.bootstrap(angular.element('#xosContentProvider'), ['xos.contentProvider']);`;
+
 module.exports = function(options){
   
   // delete previous builded file
diff --git a/xos/core/xoslib/ngXosViews/contentProvider/gulp/server.js b/xos/core/xoslib/ngXosViews/contentProvider/gulp/server.js
index ad7c681..8eab1bf 100644
--- a/xos/core/xoslib/ngXosViews/contentProvider/gulp/server.js
+++ b/xos/core/xoslib/ngXosViews/contentProvider/gulp/server.js
@@ -31,6 +31,7 @@
       // reloadDelay: 500,
       // logLevel: 'debug',
       // logConnections: true,
+      startPath: '#/',
       snippetOptions: {
         rule: {
           match: /<!-- browserSync -->/i
diff --git a/xos/core/xoslib/ngXosViews/contentProvider/spec/sample.test.js b/xos/core/xoslib/ngXosViews/contentProvider/spec/sample.test.js
new file mode 100644
index 0000000..177bc7d
--- /dev/null
+++ b/xos/core/xoslib/ngXosViews/contentProvider/spec/sample.test.js
@@ -0,0 +1,37 @@
+'use strict';
+
+describe('The User List', () => {
+  
+  var scope, element, isolatedScope, httpBackend;
+
+  beforeEach(module('xos.contentProvider'));
+  beforeEach(module('templates'));
+
+  beforeEach(inject(function($httpBackend, $compile, $rootScope){
+    
+    httpBackend = $httpBackend;
+    // Setting up mock request
+    $httpBackend.expectGET('/xos/users/?no_hyperlinks=1').respond([
+      {
+        email: 'matteo.scandolo@link-me.it',
+        firstname: 'Matteo',
+        lastname: 'Scandolo' 
+      }
+    ]);
+  
+    scope = $rootScope.$new();
+    element = angular.element('<users-list></users-list>');
+    $compile(element)(scope);
+    scope.$digest();
+    isolatedScope = element.isolateScope().vm;
+  }));
+
+  it('should load 1 users', () => {
+    httpBackend.flush();
+    expect(isolatedScope.users.length).toBe(1);
+    expect(isolatedScope.users[0].email).toEqual('matteo.scandolo@link-me.it');
+    expect(isolatedScope.users[0].firstname).toEqual('Matteo');
+    expect(isolatedScope.users[0].lastname).toEqual('Scandolo');
+  });
+
+});
\ No newline at end of file
diff --git a/xos/core/xoslib/ngXosViews/contentProvider/src/templates/users-list.tpl.html b/xos/core/xoslib/ngXosViews/contentProvider/src/templates/users-list.tpl.html
new file mode 100644
index 0000000..2983ad0
--- /dev/null
+++ b/xos/core/xoslib/ngXosViews/contentProvider/src/templates/users-list.tpl.html
@@ -0,0 +1,14 @@
+<div class="row">
+  <h1>Users List</h1>
+  <p>This is only an example view.</p>
+</div>
+<div class="row">
+  <div class="span4">Email</div>
+  <div class="span4">First Name</div>
+  <div class="span4">Last Name</div>
+</div>  
+<div class="row" ng-repeat="user in vm.users">
+  <div class="span4">{{user.email}}</div>
+  <div class="span4">{{user.firstname}}</div>
+  <div class="span4">{{user.lastname}}</div>
+</div>  
\ No newline at end of file
diff --git a/xos/core/xoslib/package.json b/xos/core/xoslib/package.json
index c512432..dd4ea4c 100644
--- a/xos/core/xoslib/package.json
+++ b/xos/core/xoslib/package.json
@@ -26,5 +26,6 @@
     "karma-phantomjs-launcher": "~0.2.1",
     "phantomjs": "~1.9.18",
     "wiredep": "^3.0.0-beta"
-  }
+  },
+  "dependencies": {}
 }
diff --git a/xos/core/xoslib/static/js/xosContentProvider.js b/xos/core/xoslib/static/js/xosContentProvider.js
index 219cbca..58ea2f6 100644
--- a/xos/core/xoslib/static/js/xosContentProvider.js
+++ b/xos/core/xoslib/static/js/xosContentProvider.js
@@ -1 +1 @@
-"use strict";angular.module("xos.contentProvider",["ngResource","ngCookies","ngLodash","xos.helpers","ui.router","xos.xos"]).config(["$stateProvider","$urlRouterProvider",function(n,e){n.state("list",{url:"/",template:"<content-provider-list></content-provider-list>"}).state("details",{url:"/contentProvider/:id",template:"<content-provider-detail></content-provider-detail>"}).state("cdn",{url:"/contentProvider/:id/cdn_prefix",template:"<content-provider-cdn></content-provider-cdn>"}).state("server",{url:"/contentProvider/:id/origin_server",template:"<content-provider-server></content-provider-server>"}).state("users",{url:"/contentProvider/:id/users",template:"<content-provider-users></content-provider-users>"})}]).config(["$httpProvider",function(n){n.interceptors.push("SetCSRFToken"),n.interceptors.push("NoHyperlinks")}]).service("ContentProvider",["$resource",function(n){return n("/hpcapi/contentproviders/:id/",{id:"@id"},{update:{method:"PUT"}})}]).service("ServiceProvider",["$resource",function(n){return n("/hpcapi/serviceproviders/:id/",{id:"@id"})}]).service("CdnPrefix",["$resource",function(n){return n("/hpcapi/cdnprefixs/:id/",{id:"@id"})}]).service("OriginServer",["$resource",function(n){return n("/hpcapi/originservers/:id/",{id:"@id"})}]).service("User",["$resource",function(n){return n("/xos/users/:id/",{id:"@id"})}]).directive("cpActions",["ContentProvider","$location",function(n,e){return{restrict:"E",scope:{id:"=id"},bindToController:!0,controllerAs:"vm",templateUrl:"templates/cp_actions.html",controller:function(){this.deleteCp=function(t){n["delete"]({id:t}).$promise.then(function(){e.url("/")})}}}}]).directive("contentProviderList",["ContentProvider","lodash",function(n,e){return{restrict:"E",controllerAs:"vm",scope:{},templateUrl:"templates/cp_list.html",controller:function(){var t=this;n.query().$promise.then(function(n){t.contentProviderList=n})["catch"](function(n){throw new Error(n)}),this.deleteCp=function(s){n["delete"]({id:s}).$promise.then(function(){e.remove(t.contentProviderList,{id:s})})}}}}]).directive("contentProviderDetail",["ContentProvider","ServiceProvider","$stateParams","$location",function(n,e,t,s){return{restrict:"E",controllerAs:"vm",scope:{},templateUrl:"templates/cp_detail.html",controller:function(){this.pageName="detail";var i=this;t.id?n.get({id:t.id}).$promise.then(function(n){i.cp=n})["catch"](function(n){i.result={status:0,msg:n.data.detail}}):i.cp=new n,e.query().$promise.then(function(n){i.sp=n}),this.saveContentProvider=function(n){var e,t=!1;n.id?e=n.$update():(t=!0,n.name=n.humanReadableName,e=n.$save()),e.then(function(n){i.result={status:1,msg:"Content Provider Saved"},t&&s.url("contentProvider/"+n.id+"/")})["catch"](function(n){i.result={status:0,msg:n.data.detail}})}}}}]).directive("contentProviderCdn",["$stateParams","CdnPrefix","ContentProvider","lodash",function(n,e,t,s){return{restrict:"E",controllerAs:"vm",scope:{},templateUrl:"templates/cp_cdn_prefix.html",controller:function(){var i=this;this.pageName="cdn",n.id&&t.get({id:n.id}).$promise.then(function(n){i.cp=n})["catch"](function(n){i.result={status:0,msg:n.data.detail}}),e.query().$promise.then(function(e){i.prf=e,i.cp_prf=s.where(e,{contentProvider:parseInt(n.id)})})["catch"](function(n){i.result={status:0,msg:n.data.detail}}),this.addPrefix=function(t){t.contentProvider=n.id;var s=new e(t);s.$save().then(function(n){i.cp_prf.push(n)})["catch"](function(n){i.result={status:0,msg:n.data.detail}})},this.removePrefix=function(n){n.$delete().then(function(){s.remove(i.cp_prf,n)})["catch"](function(n){i.result={status:0,msg:n.data.detail}})}}}}]).directive("contentProviderServer",["$stateParams","OriginServer","ContentProvider","lodash",function(n,e,t,s){return{restrict:"E",controllerAs:"vm",scope:{},templateUrl:"templates/cp_origin_server.html",controller:function(){this.pageName="server",this.protocols={http:"HTTP",rtmp:"RTMP",rtp:"RTP",shout:"SHOUTcast"};var i=this;n.id&&t.get({id:n.id}).$promise.then(function(n){i.cp=n})["catch"](function(n){i.result={status:0,msg:n.data.detail}}),e.query({contentProvider:n.id}).$promise.then(function(n){i.cp_os=n})["catch"](function(n){i.result={status:0,msg:n.data.detail}}),this.addOrigin=function(t){t.contentProvider=n.id;var s=new e(t);s.$save().then(function(n){i.cp_os.push(n)})["catch"](function(n){i.result={status:0,msg:n.data.detail}})},this.removeOrigin=function(n){n.$delete().then(function(){s.remove(i.cp_os,n)})["catch"](function(n){i.result={status:0,msg:n.data.detail}})}}}}]).directive("contentProviderUsers",["$stateParams","ContentProvider","User","lodash",function(n,e,t,s){return{restrict:"E",controllerAs:"vm",scope:{},templateUrl:"templates/cp_user.html",controller:function(){var i=this;this.pageName="user",this.cp_users=[],n.id&&t.query().$promise.then(function(t){return i.users=t,e.get({id:n.id}).$promise}).then(function(n){return n.users=i.populateUser(n.users,i.users),n}).then(function(n){i.cp=n})["catch"](function(n){i.result={status:0,msg:n.data.detail}}),this.populateUser=function(n,e){for(var t=0;t<n.length;t++)n[t]=s.find(e,{id:n[t]});return n},this.addUserToCp=function(n){i.cp.users.push(n)},this.removeUserFromCp=function(n){s.remove(i.cp.users,n)},this.saveContentProvider=function(n){n.users=s.pluck(n.users,"id"),n.$update().then(function(n){i.cp.users=i.populateUser(n.users,i.users),i.result={status:1,msg:"Content Provider Saved"}})["catch"](function(n){i.result={status:0,msg:n.data.detail}})}}}}]),angular.module("xos.contentProvider").run(["$templateCache",function(n){n.put("templates/cp_actions.html",'<a href="#/" class="btn btn-default">\n  <i class="icon icon-arrow-left"></i>Back\n</a>\n<a href="#/contentProvider/" class="btn btn-success">\n  <i class="icon icon-plus"></i>Create\n</a>\n<a ng-click="vm.deleteCp(vm.id)" class="btn btn-danger">\n  <i class="icon icon-remove"></i>Remove\n</a>'),n.put("templates/cp_cdn_prefix.html",'<div class="row-fluid">\n  <div class="span6">\n    <h1>{$ vm.cp.humanReadableName $}</h1>\n  </div>\n  <div class="span6 text-right">\n    <cp-actions id="vm.cp.id"></cp-actions>\n  </div>\n</div>\n<hr>\n<div class="row-fluid">\n  <div class="span2">\n    <div ng-include="\'templates/cp_side_nav.html\'"></div>\n  </div>\n  <div class="span10">\n    <div ng-repeat="item in vm.cp_prf" class="well">\n      <div class="row-fluid">\n        <div class="span4">\n          {{item.humanReadableName}}\n        </div>\n        <div class="span6">\n          <!-- TODO show the name instead that id -->\n          {{item.defaultOriginServer}}\n        </div>\n        <div class="span2">\n          <a ng-click="vm.removePrefix(item)" class="btn btn-danger pull-right">\n            <i class="icon icon-remove"></i>\n          </a>\n        </div>\n      </div>\n    </div>\n    <hr>\n    <form ng-submit="vm.addPrefix(vm.new_prf)">\n      <div class="row-fluid">\n        <div class="span4">\n          <label>Prefix</label>\n          <input type="text" ng-model="vm.new_prf.prefix" required style="max-width: 90%">\n        </div>\n        <div class="span6">\n          <label>Default Origin Server</label>\n          <select ng-model="vm.new_prf.defaultOriginServer" style="max-width: 100%">\n            <option ng-repeat="prf in vm.prf" ng-value="prf.id">{$ prf.humanReadableName $}</option>\n          </select>\n        </div>\n        <div class="span2 text-right">\n          <button class="btn btn-success margin-wells">\n            <i class="icon icon-plus"></i>\n          </button>\n        </div>\n      </div>\n    </form>\n    <div class="alert" ng-show="vm.result" ng-class="{\'alert-success\': vm.result.status === 1,\'alert-error\': vm.result.status === 0}">\n      {$ vm.result.msg $}\n    </div>\n  </div>\n</div>'),n.put("templates/cp_detail.html",'<div class="row-fluid">\n  <div class="span6">\n    <h1>{$ vm.cp.humanReadableName $}</h1>\n  </div>\n  <div class="span6 text-right">\n    <cp-actions id="vm.cp.id"></cp-actions>\n  </div>\n</div>\n<hr>\n<div class="row-fluid">\n  <div ng-show="vm.cp.id" class="span2">\n    <div ng-include="\'templates/cp_side_nav.html\'"></div>\n  </div>\n  <div ng-class="{span10: vm.cp.id, span12: !vm.cp.id}">\n  <!-- TODO hide form on not found -->\n    <form ng-submit="vm.saveContentProvider(vm.cp)">\n      <fieldset>\n        <div class="row-fluid">\n          <div class="span6">\n            <label>Name:</label>\n            <input type="text" ng-model="vm.cp.humanReadableName" required/>\n          </div>\n          <div class="span6">\n            <label class="checkbox">\n              <input type="checkbox" ng-model="vm.cp.enabled" /> Enabled\n            </label>\n          </div>\n        </div>\n        <div class="row-fluid">\n          <div class="span12">\n            <label>Description</label>\n            <textarea style="width: 100%" ng-model="vm.cp.description"></textarea>\n          </div>\n        </div>\n        <div class="row-fluid">\n          <div class="span12">\n            <label>Service provider</label>\n            <select required ng-model="vm.cp.serviceProvider" ng-options="sp.id as sp.humanReadableName for sp in vm.sp"></select>\n          </div>\n        </div>\n        <div class="row-fluid">\n          <div class="span12">\n            <button class="btn btn-success">\n              <span ng-show="vm.cp.id">Save</span>\n              <span ng-show="!vm.cp.id">Create</span>\n            </button>\n          </div>\n        </div>\n      </fieldset>\n    </form>\n    <div class="alert" ng-show="vm.result" ng-class="{\'alert-success\': vm.result.status === 1,\'alert-error\': vm.result.status === 0}">\n      {$ vm.result.msg $}\n    </div>\n  </div>\n</div>'),n.put("templates/cp_list.html",'<table class="table table-striped" ng-show="vm.contentProviderList.length > 0">\n  <thead>\n    <tr>\n      <th>\n        Name\n      </th>\n      <th>Description</th>\n      <th>Status</th>\n      <th></th>\n    </tr>\n  </thead>\n  <tr ng-repeat="item in vm.contentProviderList">\n    <td>\n      <a ui-sref="details({ id: item.id })">{$ item.humanReadableName $}</a>\n    </td>\n    <td>\n      {$ item.description $}\n    </td>\n    <td>\n      {$ item.enabled $}\n    </td>\n    <td class="text-right">\n      <a ng-click="vm.deleteCp(item.id)" class="btn btn-danger"><i class="icon icon-remove"></i></a></td>\n  </tr>\n</table>\n<div class="alert alert-error" ng-show="vm.contentProviderList.length == 0">\n  No Content Provider defined\n</div>\n\n<div class="row">\n  <div class="span12 text-right">\n    <a class="btn btn-success"href="#/contentProvider/">Create</a>\n  </div>\n</div>'),n.put("templates/cp_origin_server.html",'<div class="row-fluid">\n  <div class="span6">\n    <h1>{$ vm.cp.humanReadableName $}</h1>\n  </div>\n  <div class="span6 text-right">\n    <cp-actions id="vm.cp.id"></cp-actions>\n  </div>\n</div>\n<hr>\n<div class="row-fluid">\n  <div class="span2">\n    <div ng-include="\'templates/cp_side_nav.html\'"></div>\n  </div>\n  <div class="span10">\n    <div ng-repeat="item in vm.cp_os" class="well">\n      <div class="row-fluid">\n        <div class="span4">\n          {{item.humanReadableName}}\n        </div>\n        <div class="span6">\n          <!-- TODO shoe the name instead that url -->\n          {{item.defaultOriginServer}}\n        </div>\n        <div class="span2">\n          <a ng-click="vm.removeOrigin(item)" class="btn btn-danger pull-right">\n            <i class="icon icon-remove"></i>\n          </a>\n        </div>\n      </div>\n    </div>\n    <hr>\n    <form ng-submit="vm.addOrigin(vm.new_os)">\n      <div class="row-fluid">\n        <div class="span4">\n          <label>Protocol</label>\n          <select ng-model="vm.new_os.protocol" ng-options="k as v for (k,v) in vm.protocols" style="max-width: 100%;"></select>\n        </div>\n        <div class="span6">\n          <label>Url</label>\n          <input type="text" ng-model="vm.new_os.url" required>\n        </div>\n        <div class="span2 text-right">\n          <button class="btn btn-success margin-wells">\n            <i class="icon icon-plus"></i>\n          </button>\n        </div>\n      </div>\n    </form>\n    <div class="alert" ng-show="vm.result" ng-class="{\'alert-success\': vm.result.status === 1,\'alert-error\': vm.result.status === 0}">\n      {$ vm.result.msg $}\n    </div>\n  </div>\n</div>'),n.put("templates/cp_side_nav.html",'<ul class="nav nav-list">\n  <li>\n    <a class="btn" ng-class="{\'btn-primary\': vm.pageName == \'detail\'}" href="#/contentProvider/{$ vm.cp.id $}">Details</a>\n  </li>\n  <li>\n    <a class="btn" ng-class="{\'btn-primary\': vm.pageName == \'cdn\'}" href="#/contentProvider/{$ vm.cp.id $}/cdn_prefix">Cdn Prexix</a>\n  </li>\n  <li>\n    <a class="btn" ng-class="{\'btn-primary\': vm.pageName == \'server\'}" href="#/contentProvider/{$ vm.cp.id $}/origin_server">Origin Server</a>\n  </li>\n  <li>\n    <a class="btn" ng-class="{\'btn-primary\': vm.pageName == \'user\'}" href="#/contentProvider/{$ vm.cp.id $}/users">Users</a>\n  </li>\n</ul>'),n.put("templates/cp_user.html",'<div class="row-fluid">\n  <div class="span6">\n    <h1>{$ vm.cp.humanReadableName $}</h1>\n  </div>\n  <div class="span6 text-right">\n    <cp-actions id="vm.cp.id"></cp-actions>\n  </div>\n</div>\n<hr>\n<div class="row-fluid">\n  <div class="span2">\n    <div ng-include="\'templates/cp_side_nav.html\'"></div>\n  </div>\n  <div class="span10">\n    <div ng-repeat="item in vm.cp.users" class="well">\n      <div class="row-fluid">\n        <div class="span3">\n          {{item.firstname}}\n        </div>\n        <div class="span3">\n          {{item.lastname}}\n        </div>\n        <div class="span4">\n          {{item.email}}\n        </div>\n        <div class="span2">\n          <a ng-click="vm.removeUserFromCp(item)" class="btn btn-danger pull-right">\n            <i class="icon icon-remove"></i>\n          </a>\n        </div>\n      </div>\n    </div>\n    <hr>\n    <form ng-submit="vm.saveContentProvider(vm.cp)">\n      <div class="row-fluid">\n        <div class="span8">\n          <label>Select user:</label>\n          <select ng-model="vm.user" ng-options="u as u.username for u in vm.users" ng-change="vm.addUserToCp(vm.user)"></select>\n        </div>  \n        <div class="span4 text-right">\n          <button class="btn btn-success margin-wells">\n            Save\n          </button>\n        </div>\n      </div>\n    </form>\n    <div class="alert" ng-show="vm.result" ng-class="{\'alert-success\': vm.result.status === 1,\'alert-error\': vm.result.status === 0}">\n      {$ vm.result.msg $}\n    </div>\n  </div>\n</div>')}]),angular.bootstrap(angular.element("#xosContentProvider"),["xos.contentProvider"]);
\ No newline at end of file
+"use strict";angular.module("xos.contentProvider",["ngResource","ngCookies","ngLodash","xos.helpers","ui.router","xos.xos"]).config(["$stateProvider","$urlRouterProvider",function(n,e){n.state("list",{url:"/",template:"<content-provider-list></content-provider-list>"}).state("details",{url:"/contentProvider/:id",template:"<content-provider-detail></content-provider-detail>"}).state("cdn",{url:"/contentProvider/:id/cdn_prefix",template:"<content-provider-cdn></content-provider-cdn>"}).state("server",{url:"/contentProvider/:id/origin_server",template:"<content-provider-server></content-provider-server>"}).state("users",{url:"/contentProvider/:id/users",template:"<content-provider-users></content-provider-users>"})}]).config(["$httpProvider",function(n){n.interceptors.push("SetCSRFToken"),n.interceptors.push("NoHyperlinks")}]).service("ContentProvider",["$resource",function(n){return n("/hpcapi/contentproviders/:id/",{id:"@id"},{update:{method:"PUT"}})}]).service("ServiceProvider",["$resource",function(n){return n("/hpcapi/serviceproviders/:id/",{id:"@id"})}]).service("CdnPrefix",["$resource",function(n){return n("/hpcapi/cdnprefixs/:id/",{id:"@id"})}]).service("OriginServer",["$resource",function(n){return n("/hpcapi/originservers/:id/",{id:"@id"})}]).service("User",["$resource",function(n){return n("/xos/users/:id/",{id:"@id"})}]).directive("cpActions",["ContentProvider","$location",function(n,e){return{restrict:"E",scope:{id:"=id"},bindToController:!0,controllerAs:"vm",templateUrl:"templates/cp_actions.html",controller:function(){this.deleteCp=function(t){n["delete"]({id:t}).$promise.then(function(){e.url("/")})}}}}]).directive("contentProviderList",["ContentProvider","lodash",function(n,e){return{restrict:"E",controllerAs:"vm",scope:{},templateUrl:"templates/cp_list.html",controller:function(){var t=this;n.query().$promise.then(function(n){t.contentProviderList=n})["catch"](function(n){throw new Error(n)}),this.deleteCp=function(s){n["delete"]({id:s}).$promise.then(function(){e.remove(t.contentProviderList,{id:s})})}}}}]).directive("contentProviderDetail",["ContentProvider","ServiceProvider","$stateParams","$location",function(n,e,t,s){return{restrict:"E",controllerAs:"vm",scope:{},templateUrl:"templates/cp_detail.html",controller:function(){this.pageName="detail";var i=this;t.id?n.get({id:t.id}).$promise.then(function(n){i.cp=n})["catch"](function(n){i.result={status:0,msg:n.data.detail}}):i.cp=new n,e.query().$promise.then(function(n){i.sp=n}),this.saveContentProvider=function(n){var e,t=!1;n.id?e=n.$update():(t=!0,n.name=n.humanReadableName,e=n.$save()),e.then(function(n){i.result={status:1,msg:"Content Provider Saved"},t&&s.url("contentProvider/"+n.id+"/")})["catch"](function(n){i.result={status:0,msg:n.data.detail}})}}}}]).directive("contentProviderCdn",["$stateParams","CdnPrefix","ContentProvider","lodash",function(n,e,t,s){return{restrict:"E",controllerAs:"vm",scope:{},templateUrl:"templates/cp_cdn_prefix.html",controller:function(){var i=this;this.pageName="cdn",n.id&&t.get({id:n.id}).$promise.then(function(n){i.cp=n})["catch"](function(n){i.result={status:0,msg:n.data.detail}}),e.query().$promise.then(function(e){i.prf=e,i.cp_prf=s.where(e,{contentProvider:parseInt(n.id)})})["catch"](function(n){i.result={status:0,msg:n.data.detail}}),this.addPrefix=function(t){t.contentProvider=n.id;var s=new e(t);s.$save().then(function(n){i.cp_prf.push(n)})["catch"](function(n){i.result={status:0,msg:n.data.detail}})},this.removePrefix=function(n){n.$delete().then(function(){s.remove(i.cp_prf,n)})["catch"](function(n){i.result={status:0,msg:n.data.detail}})}}}}]).directive("contentProviderServer",["$stateParams","OriginServer","ContentProvider","lodash",function(n,e,t,s){return{restrict:"E",controllerAs:"vm",scope:{},templateUrl:"templates/cp_origin_server.html",controller:function(){this.pageName="server",this.protocols={http:"HTTP",rtmp:"RTMP",rtp:"RTP",shout:"SHOUTcast"};var i=this;n.id&&t.get({id:n.id}).$promise.then(function(n){i.cp=n})["catch"](function(n){i.result={status:0,msg:n.data.detail}}),e.query({contentProvider:n.id}).$promise.then(function(n){i.cp_os=n})["catch"](function(n){i.result={status:0,msg:n.data.detail}}),this.addOrigin=function(t){t.contentProvider=n.id;var s=new e(t);s.$save().then(function(n){i.cp_os.push(n)})["catch"](function(n){i.result={status:0,msg:n.data.detail}})},this.removeOrigin=function(n){n.$delete().then(function(){s.remove(i.cp_os,n)})["catch"](function(n){i.result={status:0,msg:n.data.detail}})}}}}]).directive("contentProviderUsers",["$stateParams","ContentProvider","User","lodash",function(n,e,t,s){return{restrict:"E",controllerAs:"vm",scope:{},templateUrl:"templates/cp_user.html",controller:function(){var i=this;this.pageName="user",this.cp_users=[],n.id&&t.query().$promise.then(function(t){return i.users=t,e.get({id:n.id}).$promise}).then(function(n){return n.users=i.populateUser(n.users,i.users),n}).then(function(n){i.cp=n})["catch"](function(n){i.result={status:0,msg:n.data.detail}}),this.populateUser=function(n,e){for(var t=0;t<n.length;t++)n[t]=s.find(e,{id:n[t]});return n},this.addUserToCp=function(n){i.cp.users.push(n)},this.removeUserFromCp=function(n){s.remove(i.cp.users,n)},this.saveContentProvider=function(n){n.users=s.pluck(n.users,"id"),n.$update().then(function(n){i.cp.users=i.populateUser(n.users,i.users),i.result={status:1,msg:"Content Provider Saved"}})["catch"](function(n){i.result={status:0,msg:n.data.detail}})}}}}]),angular.module("xos.contentProvider").run(["$templateCache",function(n){n.put("templates/cp_actions.html",'<a href="#/" class="btn btn-default">\n  <i class="icon icon-arrow-left"></i>Back\n</a>\n<a href="#/contentProvider/" class="btn btn-success">\n  <i class="icon icon-plus"></i>Create\n</a>\n<a ng-click="vm.deleteCp(vm.id)" class="btn btn-danger">\n  <i class="icon icon-remove"></i>Remove\n</a>'),n.put("templates/cp_cdn_prefix.html",'<div class="row-fluid">\n  <div class="span6">\n    <h1>{$ vm.cp.humanReadableName $}</h1>\n  </div>\n  <div class="span6 text-right">\n    <cp-actions id="vm.cp.id"></cp-actions>\n  </div>\n</div>\n<hr>\n<div class="row-fluid">\n  <div class="span2">\n    <div ng-include="\'templates/cp_side_nav.html\'"></div>\n  </div>\n  <div class="span10">\n    <div ng-repeat="item in vm.cp_prf" class="well">\n      <div class="row-fluid">\n        <div class="span4">\n          {{item.humanReadableName}}\n        </div>\n        <div class="span6">\n          <!-- TODO show the name instead that id -->\n          {{item.defaultOriginServer}}\n        </div>\n        <div class="span2">\n          <a ng-click="vm.removePrefix(item)" class="btn btn-danger pull-right">\n            <i class="icon icon-remove"></i>\n          </a>\n        </div>\n      </div>\n    </div>\n    <hr>\n    <form ng-submit="vm.addPrefix(vm.new_prf)">\n      <div class="row-fluid">\n        <div class="span4">\n          <label>Prefix</label>\n          <input type="text" ng-model="vm.new_prf.prefix" required style="max-width: 90%">\n        </div>\n        <div class="span6">\n          <label>Default Origin Server</label>\n          <select ng-model="vm.new_prf.defaultOriginServer" style="max-width: 100%">\n            <option ng-repeat="prf in vm.prf" ng-value="prf.id">{$ prf.humanReadableName $}</option>\n          </select>\n        </div>\n        <div class="span2 text-right">\n          <button class="btn btn-success margin-wells">\n            <i class="icon icon-plus"></i>\n          </button>\n        </div>\n      </div>\n    </form>\n    <div class="alert" ng-show="vm.result" ng-class="{\'alert-success\': vm.result.status === 1,\'alert-error\': vm.result.status === 0}">\n      {$ vm.result.msg $}\n    </div>\n  </div>\n</div>'),n.put("templates/cp_detail.html",'<div class="row-fluid">\n  <div class="span6">\n    <h1>{$ vm.cp.humanReadableName $}</h1>\n  </div>\n  <div class="span6 text-right">\n    <cp-actions id="vm.cp.id"></cp-actions>\n  </div>\n</div>\n<hr>\n<div class="row-fluid">\n  <div ng-show="vm.cp.id" class="span2">\n    <div ng-include="\'templates/cp_side_nav.html\'"></div>\n  </div>\n  <div ng-class="{span10: vm.cp.id, span12: !vm.cp.id}">\n  <!-- TODO hide form on not found -->\n    <form ng-submit="vm.saveContentProvider(vm.cp)">\n      <fieldset>\n        <div class="row-fluid">\n          <div class="span6">\n            <label>Name:</label>\n            <input type="text" ng-model="vm.cp.humanReadableName" required/>\n          </div>\n          <div class="span6">\n            <label class="checkbox">\n              <input type="checkbox" ng-model="vm.cp.enabled" /> Enabled\n            </label>\n          </div>\n        </div>\n        <div class="row-fluid">\n          <div class="span12">\n            <label>Description</label>\n            <textarea style="width: 100%" ng-model="vm.cp.description"></textarea>\n          </div>\n        </div>\n        <div class="row-fluid">\n          <div class="span12">\n            <label>Service provider</label>\n            <select required ng-model="vm.cp.serviceProvider" ng-options="sp.id as sp.humanReadableName for sp in vm.sp"></select>\n          </div>\n        </div>\n        <div class="row-fluid">\n          <div class="span12">\n            <button class="btn btn-success">\n              <span ng-show="vm.cp.id">Save</span>\n              <span ng-show="!vm.cp.id">Create</span>\n            </button>\n          </div>\n        </div>\n      </fieldset>\n    </form>\n    <div class="alert" ng-show="vm.result" ng-class="{\'alert-success\': vm.result.status === 1,\'alert-error\': vm.result.status === 0}">\n      {$ vm.result.msg $}\n    </div>\n  </div>\n</div>'),n.put("templates/cp_list.html",'<table class="table table-striped" ng-show="vm.contentProviderList.length > 0">\n  <thead>\n    <tr>\n      <th>\n        Name\n      </th>\n      <th>Description</th>\n      <th>Status</th>\n      <th></th>\n    </tr>\n  </thead>\n  <tr ng-repeat="item in vm.contentProviderList">\n    <td>\n      <a ui-sref="details({ id: item.id })">{$ item.humanReadableName $}</a>\n    </td>\n    <td>\n      {$ item.description $}\n    </td>\n    <td>\n      {$ item.enabled $}\n    </td>\n    <td class="text-right">\n      <a ng-click="vm.deleteCp(item.id)" class="btn btn-danger"><i class="icon icon-remove"></i></a></td>\n  </tr>\n</table>\n<div class="alert alert-error" ng-show="vm.contentProviderList.length == 0">\n  No Content Provider defined\n</div>\n\n<div class="row">\n  <div class="span12 text-right">\n    <a class="btn btn-success"href="#/contentProvider/">Create</a>\n  </div>\n</div>'),n.put("templates/cp_origin_server.html",'<div class="row-fluid">\n  <div class="span6">\n    <h1>{$ vm.cp.humanReadableName $}</h1>\n  </div>\n  <div class="span6 text-right">\n    <cp-actions id="vm.cp.id"></cp-actions>\n  </div>\n</div>\n<hr>\n<div class="row-fluid">\n  <div class="span2">\n    <div ng-include="\'templates/cp_side_nav.html\'"></div>\n  </div>\n  <div class="span10">\n    <div ng-repeat="item in vm.cp_os" class="well">\n      <div class="row-fluid">\n        <div class="span4">\n          {{item.humanReadableName}}\n        </div>\n        <div class="span6">\n          <!-- TODO shoe the name instead that url -->\n          {{item.defaultOriginServer}}\n        </div>\n        <div class="span2">\n          <a ng-click="vm.removeOrigin(item)" class="btn btn-danger pull-right">\n            <i class="icon icon-remove"></i>\n          </a>\n        </div>\n      </div>\n    </div>\n    <hr>\n    <form ng-submit="vm.addOrigin(vm.new_os)">\n      <div class="row-fluid">\n        <div class="span4">\n          <label>Protocol</label>\n          <select ng-model="vm.new_os.protocol" ng-options="k as v for (k,v) in vm.protocols" style="max-width: 100%;"></select>\n        </div>\n        <div class="span6">\n          <label>Url</label>\n          <input type="text" ng-model="vm.new_os.url" required>\n        </div>\n        <div class="span2 text-right">\n          <button class="btn btn-success margin-wells">\n            <i class="icon icon-plus"></i>\n          </button>\n        </div>\n      </div>\n    </form>\n    <div class="alert" ng-show="vm.result" ng-class="{\'alert-success\': vm.result.status === 1,\'alert-error\': vm.result.status === 0}">\n      {$ vm.result.msg $}\n    </div>\n  </div>\n</div>'),n.put("templates/cp_side_nav.html",'<ul class="nav nav-list">\n  <li>\n    <a class="btn" ng-class="{\'btn-primary\': vm.pageName == \'detail\'}" href="#/contentProvider/{$ vm.cp.id $}">Details</a>\n  </li>\n  <li>\n    <a class="btn" ng-class="{\'btn-primary\': vm.pageName == \'cdn\'}" href="#/contentProvider/{$ vm.cp.id $}/cdn_prefix">Cdn Prexix</a>\n  </li>\n  <li>\n    <a class="btn" ng-class="{\'btn-primary\': vm.pageName == \'server\'}" href="#/contentProvider/{$ vm.cp.id $}/origin_server">Origin Server</a>\n  </li>\n  <li>\n    <a class="btn" ng-class="{\'btn-primary\': vm.pageName == \'user\'}" href="#/contentProvider/{$ vm.cp.id $}/users">Users</a>\n  </li>\n</ul>'),n.put("templates/cp_user.html",'<div class="row-fluid">\n  <div class="span6">\n    <h1>{$ vm.cp.humanReadableName $}</h1>\n  </div>\n  <div class="span6 text-right">\n    <cp-actions id="vm.cp.id"></cp-actions>\n  </div>\n</div>\n<hr>\n<div class="row-fluid">\n  <div class="span2">\n    <div ng-include="\'templates/cp_side_nav.html\'"></div>\n  </div>\n  <div class="span10">\n    <div ng-repeat="item in vm.cp.users" class="well">\n      <div class="row-fluid">\n        <div class="span3">\n          {{item.firstname}}\n        </div>\n        <div class="span3">\n          {{item.lastname}}\n        </div>\n        <div class="span4">\n          {{item.email}}\n        </div>\n        <div class="span2">\n          <a ng-click="vm.removeUserFromCp(item)" class="btn btn-danger pull-right">\n            <i class="icon icon-remove"></i>\n          </a>\n        </div>\n      </div>\n    </div>\n    <hr>\n    <form ng-submit="vm.saveContentProvider(vm.cp)">\n      <div class="row-fluid">\n        <div class="span8">\n          <label>Select user:</label>\n          <select ng-model="vm.user" ng-options="u as u.username for u in vm.users" ng-change="vm.addUserToCp(vm.user)"></select>\n        </div>  \n        <div class="span4 text-right">\n          <button class="btn btn-success margin-wells">\n            Save\n          </button>\n        </div>\n      </div>\n    </form>\n    <div class="alert" ng-show="vm.result" ng-class="{\'alert-success\': vm.result.status === 1,\'alert-error\': vm.result.status === 0}">\n      {$ vm.result.msg $}\n    </div>\n  </div>\n</div>'),n.put("templates/users-list.tpl.html",'<div class="row">\n  <h1>Users List</h1>\n  <p>This is only an example view.</p>\n</div>\n<div class="row">\n  <div class="span4">Email</div>\n  <div class="span4">First Name</div>\n  <div class="span4">Last Name</div>\n</div>  \n<div class="row" ng-repeat="user in vm.users">\n  <div class="span4">{{user.email}}</div>\n  <div class="span4">{{user.firstname}}</div>\n  <div class="span4">{{user.lastname}}</div>\n</div>  ')}]),angular.module("xos.contentProvider").run(["$location",function(n){n.path("/")}]),angular.bootstrap(angular.element("#xosContentProvider"),["xos.contentProvider"]);
\ No newline at end of file
diff --git a/xos/templates/admin/base.html b/xos/templates/admin/base.html
index 04ec651..4c433c1 100644
--- a/xos/templates/admin/base.html
+++ b/xos/templates/admin/base.html
@@ -1,17 +1,20 @@
-﻿{% load admin_static %}{% load suit_tags %}{% load url from future %}<!DOCTYPE html>
+﻿{% load admin_static %}{% load suit_tags %}{% load url from future %}
+<!DOCTYPE html>
 <html lang="{{ LANGUAGE_CODE|default:"en-us" }}" {% if LANGUAGE_BIDI %}dir="rtl"{% endif %}>
 <head>
-  <title>{% block title %}  {%if title %} {{ title }} | {% endif %} {{ 'ADMIN_NAME'|suit_conf }}{% endblock %}</title>
+  <title>{% block title %}  {%if title %} {{ title }} | {% endif %} {{ 'ADMIN_NAME'|suit_conf }}{% endblock %}</title> 
   <link rel="stylesheet" type="text/css" href="{% block stylesheet %}{% endblock %}"/>
-  <link rel="stylesheet" type="text/css" href="{% static 'suit/bootstrap/css/bootstrap.min.css' %}" media="all"/>
+  <link rel="stylesheet" type="text/css" href="{% static 'suit/bootstrap/dist/css/bootstrap.min.css' %}" media="all"/>
   <link rel="stylesheet" type="text/css" href="{% static 'suit/css/suit.css' %}" media="all">
   <link rel="stylesheet" type="text/css" href="{% static 'xos.css' %}" media="all">
-  <link rel="stylesheet" type="text/css" href="{% static 'cord.css' %}" media="all">
   {% if XOS_BRANDING_CSS %}
-      <link rel="stylesheet" type="text/css" href="{{ XOS_BRANDING_CSS }}">
+  <link rel="stylesheet" type="text/css" href="{% static 'cord.css' %}" media="all">
+  <link rel="stylesheet" type="text/css" href="{{ XOS_BRANDING_CSS }}">
   {% endif %}
   {% block extrastyle %}{% endblock %}
-  {% if LANGUAGE_BIDI %}<link rel="stylesheet" type="text/css" href="{% block stylesheet_rtl %}{% static "admin/css/rtl.css" %}{% endblock %}"/>{% endif %}
+  {% if LANGUAGE_BIDI %}
+  <link rel="stylesheet" type="text/css" href="{% block stylesheet_rtl %}{% static "admin/css/rtl.css" %}{% endblock %}"/>
+  {% endif %}
   <script type="text/javascript">window.__admin_media_prefix__ = "{% filter escapejs %}{% static "admin/" %}{% endfilter %}";</script>
   <script src="{% static 'suit/js/jquery-1.9.1.min.js' %}"></script>
   <script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
@@ -31,269 +34,289 @@
   {% endif %}
   {% block extrahead %}{% endblock %}
   {% block blockbots %}
-    <meta name="robots" content="NONE,NOARCHIVE"/>{% endblock %}
-  <link rel="shortcut icon" href="{{ XOS_BRANDING_ICON }}">
-</head>
-{% load i18n %}
-
+  <meta name="robots" content="NONE,NOARCHIVE"/>
+  {% endblock %}
+  <link rel="shortcut icon" href="{{ XOS_BRANDING_ICON }}"></head>
+  {% load i18n %}
 <body class="{% if is_popup %}popup {% endif %}{% block bodyclass %}{% endblock %}">
-<div id="dialog-placeholder">
-<!-- This is a placeholder for dialog boxes, like the observer calendar -->
-</div>
+  <div id="dialog-placeholder">
+    <!-- This is a placeholder for dialog boxes, like the observer calendar -->
+  </div>
 
-<!-- Sticky footer wrap -->
-<div id="wrap">
+  <!-- Sticky footer wrap -->
+  <div id="wrap">
 
-  <!-- Container -->
-  {% block container %}
-    <div id="container">
+    <!-- Container -->
+    {% block container %}
+    <!-- <div id="container"> -->
+      
+    <!-- </div> -->
+    <!-- END Header -->
+    <div id="wrapper">
 
-      {% block logo %}
-      <a href="{% url 'admin:index' %}"><h1 id="site-name"><img class="logo" height="70" width="259" src="{% static 'cord_logo_3.png' %}"/></h1></a>
-      {% endblock %}
-      {% block header %}
-        {% if not is_popup %}
-          <!-- Header -->
-          <div id="header" class="header">
-            
-            <div id="branding">
-                  {% block quick-search %}
-                {% with 'SEARCH_URL'|suit_conf as search_url %}
-                  {% if search_url %}
-                    <form class="form-search nav-quick-search" autocomplete="off" action="{% if '/' in search_url %}{{ search_url }}{% else %}{% url search_url %}{% endif %}" method="GET">
-                      <i class="input-icon icon-search"></i>
-                      <input type="text" name="q" class="input-medium search-query" id="quick-search">
-                      <input type="submit" class="submit" value="">
-                    </form>
+      <!-- Sidebar -->
+      <div id="sidebar-wrapper">
+        <a href="{% url 'admin:index' %}" class="hidden-xs">
+          <img class="logo" src="{% static 'cord_logo_3.png' %}"/>
+        </a>
+        {% include 'suit/menu.html' %}
+        <button class="navbar-toggle collapsed visible-xs" type="button">
+          <i class="glyphicon glyphicon-arrow-left"></i>
+        </button>
+      </div>
+      <!-- /#sidebar-wrapper -->
+
+      <!-- Page Content -->
+      <div id="page-content-wrapper">
+        <div class="container-fluid">
+          <div class="row">
+            <div class="col-xs-12">
+              {% block header %}
+                {% if not is_popup %}
+                  <!-- Header -->
+                  <div id="header" class="header">
+                    <button class="navbar-toggle collapsed" type="button">
+                      <span class="icon-bar"></span>
+                      <span class="icon-bar"></span>
+                      <span class="icon-bar"></span>
+                    </button>
+                    {% block logo %}
+                      <a href="{% url 'admin:index' %}" class="visible-xs">
+                        <img class="logo" src="{% static 'cord_logo_3.png' %}"/>
+                      </a>
+                    {% endblock %}
+                    <!-- <div id="branding">
+                      {% block quick-search %}
+                        {% with 'SEARCH_URL'|suit_conf as search_url %}
+                          {% if search_url %}
+                            <form class="form-search nav-quick-search" autocomplete="off" action="{% if '/' in search_url %}{{ search_url }}{% else %}{% url search_url %}{% endif %}" method="GET"> <i class="input-icon icon-search"></i>
+                              <input type="text" name="q" class="input-medium search-query" id="quick-search">
+                              <input type="submit" class="submit" value="">
+                            </form>
+                          {% endif %}
+                        {% endwith %}
+                      {% endblock %}
+                    </div> -->
+                    {% block header_time %}
+                      <!-- <div id="branding2">
+                        <div class="header-content header-content-first">
+                          <div class="header-column icon"> <i class="icon-time"></i></div>
+                          <div class="header-column">
+                            <span class="date">{% suit_date %}</span>
+                            <br>
+                            <span class="time" id="clock">{% suit_time %}</span>
+                          </div>
+                        </div>
+                      </div> -->
+                    {% endblock %}
+
+                    {% block header_content %}
+                      <div class="header-content">
+                        <div class="header-column icon">
+                          <i class="icon-comment"></i>
+                        </div>
+                        <div class="header-column">
+                          <a href="" class="grey"> <b>2</b>
+                            new messages
+                          </a>
+                        </div>
+                      </div>
+                    {% endblock %}
+
+                    {% if user.is_active and user.is_staff %}
+                      <div id="user-tools">
+                        {% trans 'Welcome,' %}
+                        <a href="http://{{ request.get_host}}/admin/core/user/{{user.id}}">{{user.email}}</a>
+                        <span id="observer-status"></span>
+                        <span class="user-links">
+                          {% block userlinks %}
+                            {% url 'django-admindocs-docroot' as docsroot %}
+                            {% if docsroot %}
+                              <a href="http://guide.xosproject.org/">{% trans 'Documentation' %}</a>
+                              <span class="separator">|</span>
+                            {% endif %}
+                            <a href="{% url 'admin:password_change' %}">{% trans 'Change password' %}</a>
+                            <span class="separator">|</span>
+                            <a href="{% url 'admin:logout' %}">{% trans 'Log out' %}</a>
+                          {% endblock %}
+                        </span>
+                      </div>
+                    {% endif %}
+
+                    {% block nav-global %}
+                    {% endblock %}
+                  </div>
+                {% endif %}
+              {% endblock %}
+            </div>
+          </div>
+          <div class="row">
+            <div class="col-lg-12">
+              <div class="suit-columns {{ is_popup|yesno:'one-column,two-columns' }}">
+                {% block content-center %}
+                  {% if not is_popup %}
+                    {% block minidash %}
+                      <div id="openCloudTopPage">
+                        {% include "admin/newminidashboard.html" %}
+                      </div>
+                    {% endblock %} 
+
+                    {% block breadcrumbs %}
+                      <ul class="breadcrumb">
+                        <li>
+                          <a href="{% url 'admin:index' %}">{% trans 'Home' %}</a>
+                          {% if title %}
+                            <span class="divider">&raquo;</span>
+                        </li>
+                        <li class="active">
+                          {{ title }}
+                          {% endif %}
+                        </li>
+                      </ul>
+                    {% endblock %}
+                  {% endif %}
+
+                  {% block messages %}
+                    {% if messages %}
+                      {% for message in messages %}
+                        <div class="alert alert-{% firstof message.tags 'info' %}">
+                          <button class="close" data-dismiss="alert">×</button>
+                          <strong>{% if message.tags %}{{ message.tags|capfirst }}{% else %}Message{% endif %}!</strong> 
+                          {{ message }}
+                        </div>
+                      {% endfor %}
+                    {% endif %}
+                  {% endblock messages %}
+
+                  <!-- Content -->
+                  <div id="content" class="{% block coltype %}colM{% endblock %} row-fluid">
+                    {% block pretitle %}
+                    {% endblock %}
+                    {% block content_title %}
+                      {% if title %}
+                        <h2 class="content-title">{{ title }}</h2>
+                      {% endif %}
+                    {% endblock %}
+                    {% block content %}
+                      {% block object-tools %}
+                      {% endblock %}
+                      {{ content }}
+                    {% endblock %}
+                    {% block sidebar_content %}
+                      {% block sidebar %}{% endblock %}
+                    {% endblock %}
+                  </div>
+                  <!-- END Content -->
+                  <span class="clearfix"></span>
+                  <!-- </div>
+                  -->
+                {% endblock %}
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <!-- /#page-content-wrapper -->
+    <!-- /#wrapper -->
+    {% endblock %}
+    </div>
+    {% if not is_popup %}
+      <!-- Sticky footer push -->
+      <div id="push"></div>
+    {% endif %}
+
+    {% block footer %}
+      {% if not is_popup %}
+        <div id="footer" class="footer">
+          <div class="content">
+            <div class="tools">
+              {% block footer_links %}
+                <a href="http://djangosuit.com/support/" target="_blank" class="icon">
+                  <i class="icon-question-sign"></i>
+                  Support
+                </a>
+                <a href="http://djangosuit.com/pricing/" target="_blank" class="icon">
+                  <i class="icon-bookmark"></i>
+                  Licence
+                </a>
+                <a href="http://github.com/darklow/django-suit/issues" target="_blank" class="icon">
+                  <i class="icon-comment"></i>
+                  Report a bug
+                </a>
+              {% endblock %}
+            </div>
+
+            <div class="statusMsg" id="statusMsg">
+              <!-- this is a placeholder for xoslib views to display status messages -->
+            </div>
+
+            <div class="branding">
+              {% block footer_branding %}
+                {% with 'ADMIN_NAME'|suit_conf as admin_name %}
+                  {{ admin_name }}
+                  {% if admin_name == 'Django Suit' %}
+                    v{{ 'VERSION'|suit_conf }}
                   {% endif %}
                 {% endwith %}
               {% endblock %}
             </div>
-          
-            {% block header_time %}
-            <div id="branding2">
-            <!--<div class="header-content header-content-first">
-              <div class="header-column icon">
-                <i class="icon-time"></i>
-              </div>
-              <div class="header-column">
-                <span class="date"> {% suit_date %}</span><br>
-                <span class="time" id="clock">{% suit_time %}</span>
-              </div>
-            </div>-->
-          
-            {% endblock %}
-
-            {% block header_content %}
-              <!--<div class="header-content">
-                <div class="header-column icon">
-                  <i class="icon-comment"></i>
-                </div>
-                <div class="header-column">
-                  <a href="" class="grey"><b>2</b> new messages</a>
-                </div>
-              </div>-->
-            {% endblock %}
-
-            {% if user.is_active and user.is_staff %}
-              <div id="user-tools">
-                {% trans 'Welcome,' %}
-                <a href="http://{{ request.get_host}}/admin/core/user/{{user.id}}">{{user.email}}</a>
-                <span id="observer-status"></span>
-                <span class="user-links">
-                {% block userlinks %}
-                  {% url 'django-admindocs-docroot' as docsroot %}
-                  {% if docsroot %}
-                    <a href="http://guide.xosproject.org/">{% trans 'Documentation' %}</a>
-                   <span class="separator">|</span>
-                  {% endif %}
-                  <a href="{% url 'admin:password_change' %}">{% trans 'Change password' %}</a>
-                  <span class="separator">|</span>
-                  <a href="{% url 'admin:logout' %}">{% trans 'Log out' %}</a>
-                  </span>
-                {% endblock %}
-              </div>
-            {% endif %}
-
-            {% block nav-global %}{% endblock %}
-
           </div>
-           </div>
-        {% endif %}
-        <!-- END Header -->
-      {% endblock %}
-
-
-      <div class="suit-columns {{ is_popup|yesno:'one-column,two-columns' }}">
-
-        {% block content-center %}
-          <div id="suit-center" class="suit-column">
-
-            {% if not is_popup %}
-            {% block minidash %}
-            <div id=openCloudTopPage>
-            {% include "admin/newminidashboard.html" %}
-            </div>
-            {% endblock %} 
-
-              {% block breadcrumbs %}
-                <ul class="breadcrumb"> 
-                  <li><a href="{% url 'admin:index' %}">{% trans 'Home' %}</a>
-                    {% if title %}
-                      <span class="divider">&raquo;</span>
-                      </li>
-                      <li class="active">
-                      {{ title }}
-                    {% endif %}
-                    </li>
-                </ul>
-              {% endblock %}
-            {% endif %}
-
-            {% block messages %}
-              {% if messages %}
-
-                {% for message in messages %}
-                  <div class="alert alert-{% firstof message.tags 'info' %}">
-                    <button class="close" data-dismiss="alert">×</button>
-                    <strong>
-                      {% if message.tags %}{{ message.tags|capfirst }}{% else %}
-                        Message{% endif %}!</strong>
-                    {{ message }}
-                  </div>
-                {% endfor %}
-              {% endif %}
-            {% endblock messages %}
-
-            <!-- Content -->
-            <div id="content" class="{% block coltype %}colM{% endblock %} row-fluid">
-              {% block pretitle %}{% endblock %}
-              {% block content_title %}{% if title %}
-                <h2 class="content-title">{{ title }}</h2>
-              {% endif %}{% endblock %}
-              {% block content %}
-                {% block object-tools %}{% endblock %}
-                {{ content }}
-              {% endblock %}
-              {% block sidebar_content %}
-                {% block sidebar %}{% endblock %}
-              {% endblock %}
-            </div>
-            <!-- END Content -->
-          <span class="clearfix"></span>
-          </div>
-        {% endblock %}
-
-
-        {% block content-left %}
-          {% if not user.is_appuser %}
-              {% if not is_popup %}
-                <div id="suit-left" class="suit-column">
-
-
-                  {% include 'suit/menu.html' %}
-
-                </div>
-              {% endif %}
-          {% endif %}
-        {% endblock %}
-
-      </div>
-    </div>
-  {% endblock %}
-
-  {% if not is_popup %}
-  <!-- Sticky footer push -->
-  <div id="push"></div>
-  {% endif %}
-
-</div>
-
-{% block footer %}
-  {% if not is_popup %}
-  <div id="footer" class="footer">
-    <div class="content">
-      <div class="tools">
-        {% block footer_links %}
-          <a href="http://djangosuit.com/support/" target="_blank" class="icon"><i class="icon-question-sign"></i>Support</a>
-          <a href="http://djangosuit.com/pricing/" target="_blank" class="icon"><i class="icon-bookmark"></i>Licence</a>
-          <a href="http://github.com/darklow/django-suit/issues" target="_blank" class="icon"><i class="icon-comment"></i>Report a bug</a>
-        {% endblock %}
-      </div>
-
-      <div class="statusMsg" id="statusMsg">
-      <!-- this is a placeholder for xoslib views to display status messages -->
-      </div>
-
-      <!-- <div class="copyright">
-        {% block copyright %}
-          Copyright &copy; 2013 DjangoSuit.com<br>Developed by <a href="http://djangosuit.com" target="_blank">DjangoSuit.com</a>
-        {% endblock %}
-      </div> -->
-
-      <div class="branding">{% block footer_branding %}
-        {% with 'ADMIN_NAME'|suit_conf as admin_name %}
-          {{ admin_name }}
-          {% if admin_name == 'Django Suit' %}
-            v{{ 'VERSION'|suit_conf }}
-          {% endif %}
-        {% endwith %}
-      {% endblock %}</div>
-    </div>
+        </div>
+      {% endif %}
+    {% endblock %}
   </div>
-  {% endif %}
-{% endblock %}
 
-  <script src="{% static 'suit/bootstrap/js/bootstrap.min.js' %}"></script>
+  <script src="{% static 'suit/bootstrap/dist/js/bootstrap.min.js' %}"></script>
   <script src="{% static 'suit/js/suit.js' %}"></script>
   <script type="text/javascript" src="//www.google.com/jsapi"></script>
-  <!-- src="{% static 'xos_graphs.js' %}" -->
+  {% block extrajs %}
+  {% endblock %}
+  <script src="http://d3js.org/d3.v3.js"></script>
+  <div class="modal fade hide" id="chartsModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
+    <div class="modal-dialog">
+      <div class="modal-content">
+        <!--<div class="modal-header">
+          <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+          <h4 class="modal-title" id="myModalLabel">OpenCloud</h4>
+        </div>-->
+        <div class="modal-body" style="overflow-y:hidden; overflow-x:hidden;">
+          <div class="chartContainer">
+            <div class="row">
+              <div class=" padding"></div>
+            </div>
 
-  {% block extrajs %}{% endblock %}
-<script src="http://d3js.org/d3.v3.js"></script>
-	<div class="modal fade hide" id="chartsModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
-	  <div class="modal-dialog">
-	    <div class="modal-content">
-	      <!--<div class="modal-header">
-		<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
-		<h4 class="modal-title" id="myModalLabel">OpenCloud</h4>
-	      </div>-->
-	      <div class="modal-body" style="overflow-y:hidden; overflow-x:hidden;">
-		<div class="chartContainer">
-			<div class="row">
-				<div class=" padding">
-				</div>
-			</div>
+            <div class="row">
+              <div class=" heading">
+                <p id="chartHeading" class="heading">OpenCloud</p>
+              </div>
+            </div>
+            <div class="row">
+              <div class="padding"></div>
+              <div class="padding"></div>
+            </div>
+            <div class="row">
+              <div id="graph" class="graph"></div>
+            </div>
+          </div>
+          <div id="graph_work" style="display:none"></div>
+        </div>
+        <!--<div class="modal-footer">
+        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
+        </div>
+        -->
+      </div>
+      <!-- /.modal-content -->
+    </div>
+    <!-- /.modal-dialog -->
+  </div>
+  <!-- /.modal -->
 
-			<div class="row">
-				<div class=" heading">
-					<p id="chartHeading" class="heading">OpenCloud</p>	
-				</div>
-			</div>
-			<div class="row">
-				<div class="padding"></div>
-				<div class="padding"></div>
-			</div>
-			<div class="row">
-				<div id="graph" class="graph">
-				</div>
-			</div>
-		</div>
-                <div id="graph_work" style="display:none"></div>
-	      </div>
-	      <!--<div class="modal-footer">
-		<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
-	      </div>-->
-	    </div><!-- /.modal-content -->
-	  </div><!-- /.modal-dialog -->
-	</div><!-- /.modal -->
-
-
-<script>
-
-
-
-
-</script>
+  <!-- Menu Toggle Script -->
+  <script>
+    $(".navbar-toggle").click(function(e) {
+      e.preventDefault();
+      $("#wrapper").toggleClass("toggled");
+    });
+  </script>
 </body>
-</html>
+</html>
\ No newline at end of file
diff --git a/xos/templates/admin/dashboard/customize.html b/xos/templates/admin/dashboard/customize.html
index e9ef6d8..e74d6f0 100644
--- a/xos/templates/admin/dashboard/customize.html
+++ b/xos/templates/admin/dashboard/customize.html
@@ -9,8 +9,8 @@
     </div>
 </div>
 <form>
-    <div class="customize_row">
-        <div class="customize_column">
+    <div class="row">
+        <div class="col-xs-4">
             <div>Available Dashboard Views</div>
             <select name="selectfrom" id="select-from" multiple size="5">
                 {% for cp in unusedDashboards %}
@@ -18,14 +18,14 @@
                 {% endfor %}
             </select>
         </div>
-        <div class="customize_column">
+        <div class="col-xs-2">
             <br>
             <div class="btn btn-success" id="customize-btn-add">Add &raquo;</div>
             <br>
             <br>
             <div class="btn btn-success" id="customize-btn-remove">&laquo; Remove</div>
         </div>
-        <div class="customize_column">
+        <div class="col-xs-4">
             <div>Selected Dashboard Views</div>
             <select name="selectto" id="select-to" multiple size="5">
                 {% for cp in dashboards %}
@@ -36,7 +36,7 @@
             <div class="btn btn-high btn-info" id="customize-btn-save">Save</div>
             <div style="display: none" id="customize-msg-saving">Saving...</div>
         </div>
-        <div class="customize_column">
+        <div class="col-xs-2">
             <br>
             <div class="btn btn-success" id="customize-btn-up">Up</div>
             <br>
diff --git a/xos/templates/admin/login.html b/xos/templates/admin/login.html
index da44628..5b7ec4d 100644
--- a/xos/templates/admin/login.html
+++ b/xos/templates/admin/login.html
@@ -2,7 +2,6 @@
 {% load i18n admin_static %}
 
 {% block extrastyle %}{{ block.super }}
-<link rel="stylesheet" type="text/css" href="/static/suit/bootstrap/css/bootstrap.min.css" media="all"/>
 <link rel="stylesheet" type="text/css" href="{% static "xos.css" %}" />
 {% if XOS_BRANDING_CSS %}
     <link rel="stylesheet" type="text/css" href="{{ XOS_BRANDING_CSS }}">
diff --git a/xos/xos/apps.py b/xos/xos/apps.py
new file mode 100644
index 0000000..3462990
--- /dev/null
+++ b/xos/xos/apps.py
@@ -0,0 +1,13 @@
+from suit.apps import DjangoSuitConfig
+
+class MyDjangoSuitConfig(DjangoSuitConfig):
+    admin_name = 'XOS'
+    menu_position = 'vertical'
+    menu_open_first_child = False
+    menu = (
+      {'label': 'Deployments', 'icon':'icon-deployment', 'url': '/admin/core/deployment/'},
+      {'label': 'Sites', 'icon':'icon-site', 'url': '/admin/core/site/'},
+      {'label': 'Slices', 'icon':'icon-slice', 'url': '/admin/core/slice/'},
+      {'label': 'Users', 'icon':'icon-user', 'url': '/admin/core/user/'},
+      {'label': 'Services', 'icon':'icon-cog', 'url': '/serviceGrid/'},
+    )
\ No newline at end of file
diff --git a/xos/xos/settings.py b/xos/xos/settings.py
index 3e64d15..51de172 100644
--- a/xos/xos/settings.py
+++ b/xos/xos/settings.py
@@ -143,7 +143,8 @@
     'django.contrib.messages',
     'django.contrib.staticfiles',
     # Uncomment the next line to enable the admin:
-    'suit',
+    #'suit',
+    'xos.apps.MyDjangoSuitConfig',
     'admin_customize',
     'django.contrib.admin',
     # Uncomment the next line to enable admin documentation:
@@ -177,68 +178,6 @@
     'core.context_processors.xos',
 )
 
-# Django Suit configuration example
-SUIT_CONFIG = {
-    # header
-    'ADMIN_NAME': getattr(config, "gui_branding_name", "OpenCloud"),
-    # 'HEADER_DATE_FORMAT': 'l, j. F Y',
-    # 'HEADER_TIME_FORMAT': 'H:i',
-
-    # forms
-    #'SHOW_REQUIRED_ASTERISK': True,  # Default True
-    'CONFIRM_UNSAVED_CHANGES': True, # Default True
-
-    # menu
-    # 'SEARCH_URL': '/admin/auth/user/',
-    # 'MENU_ICONS': {
-    #    'sites': 'icon-leaf',
-    #    'auth': 'icon-lock',
-    # },
-    # 'MENU_OPEN_FIRST_CHILD': True, # Default True
-    'MENU_EXCLUDE': (
-         'auth.group',
-         'auth', 
-         'core.network',
-         'core.instance',
-         'core.node',
-         'core.image',
-         'core.deploymentrole',
-         'core.siterole',
-         'core.slicerole',
-         'core.networktemplate',
-         'core.networkparametertype',
-         'core.router',
-         'core.tag',
-         'core.account',
-         'core.invoice',
-         'core.serviceclass',
-    ),
-    'MENU': (
-        #{'app': 'core', 'icon':'icon-lock'},
-        #{'app': 'core', 'icon': 'icon-lock', 'models': ('core.site', 'core.deployment', 'core.service', 'core.slice', 'core.user', 'core.reservation', 'core.account', 'core.invoice', 'core.payment', 'core.usableobject')},
-        {'label': 'Deployments', 'icon':'icon-deployment', 'url': '/admin/core/deployment/'},
-        {'label': 'Sites', 'icon':'icon-site', 'url': '/admin/core/site/'},
-        {'label': 'Slices', 'icon':'icon-slice', 'url': '/admin/core/slice/'},
-        {'label': 'Users', 'icon':'icon-user', 'url': '/admin/core/user/'},
-        {'label': 'Services', 'icon':'icon-cog', 'url': '/serviceGrid/'},
-#        {'label': 'RequestRouter', 'icon':'icon-cog', 'app': 'requestrouter'},
-#        {'label': 'HyperCache', 'icon':'icon-cog', 'app': 'hpc'},
-#        {'label': 'Syndicate', 'icon':'icon-cog', 'app': 'syndicate_storage'},
-#       {'label': 'URL Filter', 'icon': 'icon-cog', 'app': 'urlfilter'},
-#       {'label': 'Service Comp', 'icon': 'icon-cog', 'app': 'servcomp'},
-
-        #{'label': 'Configured Services', 'icon':'icon-cog', 'models': [{'label': 'Content Delivery Network', 'app':'hpc'}]},
-    #     'sites',
-    #     {'app': 'auth', 'icon':'icon-lock', 'models': ('user', 'group')},
-    #     {'label': 'Support', 'icon':'icon-question-sign', 'url': '/support/'},
-    #   {'label': 'Settings', 'icon':'icon-cog', 'models': ('core.user', 'core.site')},
-    # ),
-    ),
-
-    # misc
-    # 'LIST_PER_PAGE': 15
-}
-
 # A sample logging configuration. The only tangible logging
 # performed by this configuration is to send an email to
 # the site admins on every HTTP 500 error when DEBUG=False.