From c025cd02e4082f2e56eb7f7a7736b114c16acf21 Mon Sep 17 00:00:00 2001
From: Daniel Molina <dmolina@opennebula.org>
Date: Wed, 17 Jun 2015 16:38:51 +0200
Subject: [PATCH] feature #3748: Add provision-tab templates

---
 src/sunstone/public/app/tabs/provision-tab.js | 982 +-----------------
 .../public/app/tabs/provision-tab/content.hbs |  20 +
 .../app/tabs/provision-tab/flows/create.hbs   |  70 ++
 .../app/tabs/provision-tab/flows/info.hbs     |  47 +
 .../app/tabs/provision-tab/flows/list.hbs     |  52 +
 .../app/tabs/provision-tab/group/info.hbs     |  39 +
 .../public/app/tabs/provision-tab/header.hbs  |  60 ++
 .../app/tabs/provision-tab/templates/list.hbs |  44 +
 .../app/tabs/provision-tab/users/create.hbs   |  67 ++
 .../tabs/provision-tab/users/empty-graphs.hbs |   4 +
 .../app/tabs/provision-tab/users/info.hbs     |  72 ++
 .../app/tabs/provision-tab/users/list.hbs     |  41 +
 .../tabs/provision-tab/users/quota-widget.hbs | 114 ++
 .../app/tabs/provision-tab/vms/create.hbs     | 115 ++
 .../app/tabs/provision-tab/vms/info.hbs       | 166 +++
 .../app/tabs/provision-tab/vms/list.hbs       |  50 +
 .../templates/helpers/isTabPanelEnabled.js    |  16 +
 17 files changed, 991 insertions(+), 968 deletions(-)
 create mode 100644 src/sunstone/public/app/tabs/provision-tab/content.hbs
 create mode 100644 src/sunstone/public/app/tabs/provision-tab/flows/create.hbs
 create mode 100644 src/sunstone/public/app/tabs/provision-tab/flows/info.hbs
 create mode 100644 src/sunstone/public/app/tabs/provision-tab/flows/list.hbs
 create mode 100644 src/sunstone/public/app/tabs/provision-tab/group/info.hbs
 create mode 100644 src/sunstone/public/app/tabs/provision-tab/header.hbs
 create mode 100644 src/sunstone/public/app/tabs/provision-tab/templates/list.hbs
 create mode 100644 src/sunstone/public/app/tabs/provision-tab/users/create.hbs
 create mode 100644 src/sunstone/public/app/tabs/provision-tab/users/empty-graphs.hbs
 create mode 100644 src/sunstone/public/app/tabs/provision-tab/users/info.hbs
 create mode 100644 src/sunstone/public/app/tabs/provision-tab/users/list.hbs
 create mode 100644 src/sunstone/public/app/tabs/provision-tab/users/quota-widget.hbs
 create mode 100644 src/sunstone/public/app/tabs/provision-tab/vms/create.hbs
 create mode 100644 src/sunstone/public/app/tabs/provision-tab/vms/info.hbs
 create mode 100644 src/sunstone/public/app/tabs/provision-tab/vms/list.hbs
 create mode 100644 src/sunstone/public/app/templates/helpers/isTabPanelEnabled.js

diff --git a/src/sunstone/public/app/tabs/provision-tab.js b/src/sunstone/public/app/tabs/provision-tab.js
index 7a6b5b2ecf..a42f4e12df 100644
--- a/src/sunstone/public/app/tabs/provision-tab.js
+++ b/src/sunstone/public/app/tabs/provision-tab.js
@@ -17,239 +17,23 @@ define(function(require) {
   var Graphs = require('utils/graphs');
 
   // Templates
+  var TemplateContent = require('hbs!./provision-tab/content');
+  var TemplateHeader = require('hbs!./provision-tab/header');
+
   var TemplateDashboardQuotas = require('hbs!./provision-tab/dashboard/quotas');
   var TemplateDashboardVdcQuotas = require('hbs!./provision-tab/dashboard/vdc-quotas');
   var TemplateDashboardVms = require('hbs!./provision-tab/dashboard/vms');
   var TemplateDashboardVdcVms = require('hbs!./provision-tab/dashboard/vdc-vms');
   var TemplateDashboardUsers = require('hbs!./provision-tab/dashboard/users');
 
-  var TemplateVmsCreate = require('hbs!./provision-tab/vms/create');
+  var TemplateVmsList = require('hbs!./provision-tab/vms/list');
+  var TemplateFlowsList = require('hbs!./provision-tab/flows/list');
+  var TemplateUsersList = require('hbs!./provision-tab/users/list');
+  var TemplateGroupInfo = require('hbs!./provision-tab/group/info');
+  var TemplateTemplatesList = require('hbs!./provision-tab/templates/list');
 
   var TAB_ID = require('./provision-tab/tabId');
 
-  var provision_dashboard = '<div id="provision_dashboard" class="section_content">'+
-  '</div>';
-
-
-
-  var provision_create_flow = '<form id="provision_create_flow" class="hidden section_content">'+
-    '<div class="row">'+
-      '<div class="large-10 large-centered columns">'+
-        '<h2 class="subheader">'+
-          Locale.tr("Create Service")+
-        '</h2>'+
-        '<br>'+
-      '</div>'+
-    '</div>'+
-    '<div class="row">'+
-      '<div class="large-8 large-centered columns">'+
-        '<input type="text" id="flow_name"  class="provision-input" placeholder="'+Locale.tr("Service Name")+'" style="height: 40px !important; font-size: 16px; padding: 0.5rem  !important;"/>'+
-        '<br>'+
-      '</div>'+
-    '</div>'+
-    '<div class="row">'+
-      '<div class="large-10 large-centered columns">'+
-        '<dl class="accordion provision_accordion_flow_template" data-accordion="provision_accordion_flow_template">'+
-          '<dd style="border-bottom: 1px solid #efefef;" class="active accordion-navigation">'+
-            '<a href="#provision_dd_flow_template" style="background: #fff; font-size: 30px">'+
-              '<span class="select_template" style="color:#555">'+
-                Locale.tr("Select a Template")+
-              '</span>'+
-              '<span class="selected_template" style="display:none; color:#555">'+
-                '<span class="provision-logo selected_template_logo" style="color:#555"">'+
-                '</span>'+
-                '<span class="selected_template_name" style="color:#555">'+
-                '</span>'+
-                '<span class="has-tip right" style="cursor: pointer; margin-right:10px;">'+
-                  '<i class="fa fa-pencil"/>'+
-                '</span>'+
-              '</span>'+
-            '</a>'+
-            '<div id="provision_dd_flow_template" class="provision_select_flow_template active content">'+
-              '<div class="row">'+
-                '<div class="large-12 large-centered columns">'+
-                  '<h3 class="subheader text-right">'+
-                    '<input type="search" class="provision-search-input right" placeholder="Search" id="provision_create_flow_template_search"/>'+
-                  '</h3>'+
-                  '<br>'+
-                '</div>'+
-              '</div>'+
-              '<div class="row">'+
-                '<div class="large-12 large-centered columns">'+
-                  '<table id="provision_flow_templates_table">'+
-                    '<thead class="hidden">'+
-                      '<tr>'+
-                        '<th>'+Locale.tr("ID")+'</th>'+
-                        '<th>'+Locale.tr("Name")+'</th>'+
-                      '</tr>'+
-                    '</thead>'+
-                    '<tbody class="hidden">'+
-                    '</tbody>'+
-                  '</table>'+
-                '</div>'+
-              '</div>'+
-            '</div>'+
-          '</dd>'+
-        '</dl>'+
-      '</div>'+
-    '</div>'+
-    '<br>'+
-    '<br>'+
-    '<br>'+
-    '<div class="row">'+
-      '<div class="provision_network_selector large-9 large-centered columns">'+
-      '</div>'+
-    '</div>'+
-    '<br>'+
-    '<div class="row">'+
-      '<div class="provision_custom_attributes_selector large-9 large-centered columns">'+
-      '</div>'+
-    '</div>'+
-    '<div id="provision_customize_flow_template" style="display: none">'+
-    '</div>'+
-    '<br>'+
-    '<br>'+
-    '<div class="row">'+
-      '<div class="large-7 columns large-centered">'+
-        '<div data-alert class="alert-box alert-box-error radius text-center hidden">'+
-        '</div>'+
-        '<button href="#" class="button large success radius large-12 small-12" type="submit" style="height: 59px">'+Locale.tr("Create")+'</button>'+
-      '</div>'+
-    '</div>'+
-    '<br>'+
-    '<br>'+
-  '</form>';
-
-  var provision_quota_widget = '<div class="row">'+
-    '<div class="large-12 large-centered columns">'+
-      '<h5 class="subheader text-right">'+
-        '<span class="left" style="margin-bottom: 0.5em">'+
-          Locale.tr("Running VMs")+
-        '</span>'+
-      '</h5>'+
-    '</div>'+
-  '</div>'+
-  '<div class="row provision_rvms_quota">'+
-    '<div class="medium-3 small-12 columns">'+
-      '<select class="provision_quota_select">'+
-        '<option value="edit">'+Locale.tr("Manual")+'</option>'+
-        '<option value="unlimited">'+Locale.tr("Unlimited")+'</option>'+
-        '<option value="default">'+Locale.tr("Default")+'</option>'+
-      '</select>'+
-    '</div>'+
-    '<div class="medium-9 small-12 columns provision_quota_edit">'+
-      '<div class="row collapse">'+
-        '<div class="small-9 columns">'+
-          '<div class="range-slider radius provision_rvms_quota_slider" data-slider data-options="start: 0; end: 50;">'+
-            '<span class="range-slider-handle"></span>'+
-            '<span class="range-slider-active-segment"></span>'+
-            '<input type="hidden">'+
-          '</div>'+
-        '</div>'+
-        '<div class="large-2 small-2 columns">'+
-          '<input type="text"  class="provision-input provision_rvms_quota_input" style="margin-top: -7px; height: 40px !important; font-size: 16px; padding: 0.5rem  !important;"/>'+
-        '</div>'+
-      '</div>'+
-    '</div>'+
-    '<div class="medium-9 small-12 columns provision_quota_unlimited" style="display:none">'+
-      '<span style="font-size: 18px; color: #999">'+
-        Locale.tr("Unlimited. Group quotas will still apply")+
-      '</span>'+
-    '</div>'+
-    '<div class="medium-9 small-12 columns provision_quota_default" style="display:none">'+
-      '<span style="font-size: 18px; color: #999">'+
-        Locale.tr("Use the default system quotas set by the cloud adminstrator")+
-      '</span>'+
-    '</div>'+
-  '</div>'+
-  '<div class="row">'+
-    '<div class="large-12 large-centered columns">'+
-      '<h5 class="subheader text-right">'+
-        '<span class="left" style="margin-bottom: 0.5em">'+
-          Locale.tr("CPU")+
-        '</span>'+
-      '</h5>'+
-    '</div>'+
-  '</div>'+
-  '<div class="row provision_cpu_quota">'+
-    '<div class="medium-3 small-12 columns">'+
-      '<select class="provision_quota_select">'+
-        '<option value="edit">'+Locale.tr("Manual")+'</option>'+
-        '<option value="unlimited">'+Locale.tr("Unlimited")+'</option>'+
-        '<option value="default">'+Locale.tr("Default")+'</option>'+
-      '</select>'+
-    '</div>'+
-    '<div class="medium-9 small-12 columns provision_quota_edit">'+
-      '<div class="row collapse">'+
-        '<div class="small-9 columns">'+
-          '<div class="range-slider radius provision_cpu_quota_slider" data-slider data-options="start: 0; end: 50;">'+
-            '<span class="range-slider-handle"></span>'+
-            '<span class="range-slider-active-segment"></span>'+
-            '<input type="hidden">'+
-          '</div>'+
-        '</div>'+
-        '<div class="large-2 small-2 columns">'+
-          '<input type="text"  class="provision-input provision_cpu_quota_input" style="margin-top: -7px; height: 40px !important; font-size: 16px; padding: 0.5rem  !important;"/>'+
-        '</div>'+
-      '</div>'+
-    '</div>'+
-    '<div class="medium-9 small-12 columns provision_quota_unlimited" style="display:none">'+
-      '<span style="font-size: 18px; color: #999">'+
-        Locale.tr("Unlimited. Group quotas will still apply")+
-      '</span>'+
-    '</div>'+
-    '<div class="medium-9 small-12 columns provision_quota_default" style="display:none">'+
-      '<span style="font-size: 18px; color: #999">'+
-        Locale.tr("Use the default system quotas set by the cloud adminstrator")+
-      '</span>'+
-    '</div>'+
-  '</div>'+
-  '<div class="row">'+
-    '<div class="large-12 large-centered columns">'+
-      '<h5 class="subheader text-right">'+
-        '<span class="left" style="margin-bottom: 0.5em">'+
-          Locale.tr("Memory (GBs)")+
-        '</span>'+
-      '</h5>'+
-    '</div>'+
-  '</div>'+
-  '<div class="vm_param">'+
-      '<input type="hidden" class="provision_memory_quota_input"/>'+
-  '</div>'+
-  '<div class="row provision_memory_quota">'+
-    '<div class="medium-3 small-12 columns">'+
-      '<select class="provision_quota_select">'+
-        '<option value="edit">'+Locale.tr("Manual")+'</option>'+
-        '<option value="unlimited">'+Locale.tr("Unlimited")+'</option>'+
-        '<option value="default">'+Locale.tr("Default")+'</option>'+
-      '</select>'+
-    '</div>'+
-    '<div class="medium-9 small-12 columns provision_quota_edit">'+
-      '<div class="row collapse">'+
-        '<div class="small-9 columns">'+
-          '<div class="range-slider radius provision_memory_quota_slider" data-slider data-options="start: 0; end: 50;">'+
-            '<span class="range-slider-handle"></span>'+
-            '<span class="range-slider-active-segment"></span>'+
-            '<input type="hidden">'+
-          '</div>'+
-        '</div>'+
-        '<div class="large-2 small-2 columns">'+
-          '<input type="text"  class="provision-input provision_memory_quota_tmp_input" style="margin-top: -7px; height: 40px !important; font-size: 16px; padding: 0.5rem  !important;"/>'+
-        '</div>'+
-      '</div>'+
-    '</div>'+
-    '<div class="medium-9 small-12 columns provision_quota_unlimited" style="display:none">'+
-      '<span style="font-size: 18px; color: #999">'+
-        Locale.tr("Unlimited. Group quotas will still apply")+
-      '</span>'+
-    '</div>'+
-    '<div class="medium-9 small-12 columns provision_quota_default" style="display:none">'+
-      '<span style="font-size: 18px; color: #999">'+
-        Locale.tr("Use the default system quotas set by the cloud adminstrator")+
-      '</span>'+
-    '</div>'+
-  '</div>';
-
   function setup_provision_quota_widget(context){
       // Mode selector, for the 3 sliders
       $("select.provision_quota_select", context).on('change', function(){
@@ -377,84 +161,6 @@ define(function(require) {
     };
   }
 
-  var provision_create_user = '<form id="provision_create_user" class="hidden section_content">'+
-    '<div class="row">'+
-      '<div class="large-10 large-centered columns">'+
-        '<h2 class="subheader">'+
-          Locale.tr("Create User")+
-        '</h2>'+
-        '<br>'+
-      '</div>'+
-    '</div>'+
-    '<div class="row">'+
-      '<div class="large-8 large-centered columns">'+
-        '<input type="text" id="username"  class="provision-input" placeholder="'+Locale.tr("Username")+'" style="height: 40px !important; font-size: 16px; padding: 0.5rem  !important;"/>'+
-        '<br>'+
-      '</div>'+
-    '</div>'+
-    '<div class="row">'+
-      '<div class="large-8 large-centered columns">'+
-        '<input type="password" id="password"  class="provision-input" placeholder="'+Locale.tr("Password")+'" style="height: 40px !important; font-size: 16px; padding: 0.5rem  !important;"/>'+
-        '<br>'+
-      '</div>'+
-    '</div>'+
-    '<div class="row">'+
-      '<div class="large-8 large-centered columns">'+
-        '<input type="password" id="repeat_password"  class="provision-input" placeholder="'+Locale.tr("Repeat Password")+'" style="height: 40px !important; font-size: 16px; padding: 0.5rem  !important;"/>'+
-        '<br>'+
-      '</div>'+
-    '</div>'+
-    '<div class="row">'+
-      '<div class="large-10 large-centered columns">'+
-        '<h3 class="subheader text-right">'+
-          '<span class="left">'+
-            Locale.tr("Define Quotas")+
-          '</span>'+
-        '</h3>'+
-        '<br>'+
-      '</div>'+
-    '</div>'+
-    '<br>'+
-    '<div class="row">'+
-      '<div class="large-8 large-centered columns">'+
-        '<dl class="tabs text-center" data-tab style="width: 100%">'+
-          '<dd class="active" style="width: 50%;"><a href="#provision_create_user_default_quota">'+ Locale.tr("Default") +'</a></dd>'+
-          '<dd style="width: 50%;"><a href="#provision_create_user_manual_quota">'+ Locale.tr("Manual") +'</a></dd>'+
-        '</dl>'+
-        '<div class="tabs-content">'+
-          '<div class="content active" id="provision_create_user_default_quota">'+
-            '<div class="row">'+
-              '<div class="large-12 large-centered columns">'+
-                '<span style="font-size: 18px; color: #999">'+
-                  Locale.tr("Use the default system quotas set by the cloud adminstrator")+
-                '</span>'+
-              '</div>'+
-            '</div>'+
-          '</div>'+
-          '<div class="content" id="provision_create_user_manual_quota">'+
-            provision_quota_widget+
-          '</div>'+
-        '</div>'+
-      '</div>'+
-    '</div>'+
-    '<br>'+
-    '<br>'+
-    '<div class="row">'+
-      '<div class="large-5 large-centered columns">'+
-        '<hr>'+
-        '<br>'+
-      '</div>'+
-    '</div>'+
-    '<div class="row">'+
-      '<div class="large-7 columns large-centered">'+
-        '<div data-alert class="alert-box alert-box-error radius text-center hidden">'+
-        '</div>'+
-        '<button href="#" class="button large radius large-12 small-12" type="submit">'+Locale.tr("Add User")+'</button>'+
-      '</div>'+
-    '</div>'+
-    '<br>'+
-  '</form>';
-
   var provision_user_info = '<div id="provision_user_info" class="hidden section_content">'+
     '<div class="row">'+
       '<div class="large-12 large-centered columns">'+
@@ -695,199 +401,13 @@ define(function(require) {
   '</div>';
 
 
-  var provision_info_vdc_user =
-  '<div class="text-center provision_info_vdc_user_loading">'+
-    '<span class="fa-stack fa-5x" style="color: #dfdfdf">'+
-      '<i class="fa fa-cloud fa-stack-2x"></i>'+
-      '<i class="fa  fa-spinner fa-spin fa-stack-1x fa-inverse"></i>'+
-    '</span>'+
-    '<br>'+
-    '<br>'+
-    '<span style="font-size: 18px; color: #999">'+
-    '</span>'+
-  '</div>'+
-  '<div class="provision_info_vdc_user">'+
-    '<div class="row">'+
-      '<div class="large-12 large-centered columns">'+
-        '<ul class="inline-list provision_action_icons">'+
-          '<li class="">'+
-            '<a href"#" data-tooltip title="Update the User Quotas" class="left button medium secondary radius provision_vdc_user_quota_confirm_button tip-top">'+
-              '<i class="fa fa-fw fa-lg fa-align-left"/>'+
-            '</a>'+
-            '<a href"#" data-tooltip title="Change the password of the User" class="left button medium secondary radius provision_vdc_user_password_confirm_button tip-top">'+
-              '<i class="fa fa-fw fa-lg fa-lock"/>'+
-            '</a>'+
-          '</li>'+
-          '<li class="right">'+
-            '<a href"#" data-tooltip title="Delete the User" class="right button medium radius alert provision_vdc_user_delete_confirm_button tip-top">'+
-              '<i class="fa fa-fw fa-lg fa-trash-o"/>'+
-            '</a>'+
-          '</li>'+
-        '</ul>'+
-      '</div>'+
-    '</div>'+
-    '<div class="row">'+
-      '<div class="provision_vdc_user_confirm_action large-10 large-centered columns">'+
-      '</div>'+
-    '</div>'+
-    '<br>'+
-    '<div class="row">'+
-      '<div class="large-4 columns">'+
-        '<ul class="provision-pricing-table_user_info provision-pricing-table" style="border: 0px !important; background: #fff;">'+
-        '</ul>'+
-      '</div>'+
-      '<div class="large-8 columns">'+
-        '<div class="row dashboard_vm_accounting">'+
-          '<div id="acct_content">'+
-            '<div class="large-6 columns">'+
-              '<input style="display:none;" value="vm" id="acct_group_by"/>'+
-              '<div class="row">'+
-                '<div class="large-12 columns graph_legend text-center">'+
-                  '<span style="color: #777; font-size: 14px">'+Locale.tr("CPU hours")+'</span>'+
-                '</div>'+
-                '<br>'+
-                '<div class="large-12 columns">'+
-                  '<div class="large-12 columns centered graph" id="acct_cpu_graph" style="height: 180px;">'+
-                  '</div>'+
-                '</div>'+
-              '</div>'+
-            '</div>'+
-            '<div class="large-6 columns">'+
-              '<div class="row">'+
-                '<div class="large-12 columns graph_legend text-center">'+
-                  '<span style="color: #777; font-size: 14px">'+Locale.tr("Memory GB hours")+'</span>'+
-                '</div>'+
-                '<div class="large-12 columns">'+
-                  '<div class="large-12 columns centered graph" id="acct_mem_graph" style="height: 180px;">'+
-                  '</div>'+
-                '</div>'+
-              '</div>'+
-            '</div>'+
-          '</div>'+
-          '<div id="acct_no_data">'+
-            '<div class="row">'+
-              '<div class="large-12 columns text-center">'+
-                  //TemplateEmptyGraphs() +
-              '</div>'+
-            '</div>'+
-          '</div>'+
-        '</div>'+
-      '</div>'+
-    '</div>'+
-    '<br>'+
-    '<div class="row">'+
-      '<div class="provision_vdc_info_container large-12 large-centered columns">'+
-      '</div>'+
-    '</div>'+
-    '<br>'+
-  '</div>'
-
   var list_users_accordion_id = 0;
-
   function provision_list_users(opts_arg){
     list_users_accordion_id += 1;
-    return '<dl class="accordion accordion_list provision_list_users" data-accordion>'+
-      '<dd class="active accordion-navigation">'+
-        '<a href="#provision_list_user_accordion'+list_users_accordion_id+'" class="provision_back right only-not-active">'+
-          '<span class="button medium radius">'+
-            '<i class="fa fa-fw fa-lg fa-th"/> '+
-            '<i class="fa fa-fw fa-lg fa-chevron-left"/> '+
-            //Locale.tr("Show List") +
-          '</span>' +
-        '</a>'+
-        '<h2 class="subheader">'+
-            Locale.tr("Users")+
-            '<span class="provision_info_vdc_user_name only-not-active" style="margin-left: 20px; color: #777; font-size: 20px">'+
-            '</span>'+
-            '<span href"#" class="right only-active provision_users_list_refresh_button button medium radius secondary" data-tooltip title="'+ Locale.tr("Refresh")+'">'+
-              '<i class="fa fa-fw fa-lg fa-refresh"/>'+
-            '</span>'+
-            '<span href"#" class="right only-not-active provision_refresh_info button medium radius secondary" data-tooltip title="'+ Locale.tr("Refresh")+'">'+
-              '<i class="fa fa-fw fa-lg fa-refresh"/>'+
-            '</span>'+
-            '<input type="search" class="provision_list_users_search provision-search-input right only-active" placeholder="Search"/>'+
-            '<span href"#" class="right only-active provision_create_user_button button medium radius success">'+
-              '<i class="fa fa-fw fa-lg fa-plus-square"/>'+
-            '</span>'+
-        '</h2>'+
-        '<div id="provision_list_user_accordion'+list_users_accordion_id+'" class="content active">'+
-          '<div class="row">'+
-            '<div class="large-12 large-centered columns">'+
-              '<table class="provision_users_table">'+
-                '<thead class="hidden">'+
-                  '<tr>'+
-                    '<th>'+Locale.tr("ID")+'</th>'+
-                    '<th>'+Locale.tr("Name")+'</th>'+
-                  '</tr>'+
-                '</thead>'+
-                '<tbody class="hidden">'+
-                '</tbody>'+
-              '</table>'+
-              '<br>'+
-            '</div>'+
-          '</div>'+
-        '</div>'+
-      '</dd>'+
-      '<dd class="accordion-navigation">'+
-        '<a class="provision_show_user_accordion" href="#provision_show_user_accordion'+list_users_accordion_id+'">'+
-        '</a>'+
-        '<div id="provision_show_user_accordion'+list_users_accordion_id+'" class="content">'+
-          provision_info_vdc_user +
-        '</div>'+
-      '</dd>'+
-    '</dl>';
+    return TemplateUsersList({'accordionId': list_users_accordion_id});
   }
 
-
-  var provision_manage_vdc = '<div id="provision_manage_vdc" class="hidden section_content">'+
-        '<div class="row">'+
-          '<div class="large-11 large-centered columns">'+
-            '<h3 class="subheader text-right">'+
-              '<span class="left">'+
-                Locale.tr("Group Accounting")+
-              '</span>'+
-            '</h3>'+
-          '</div>'+
-        '</div>'+
-        '<br>'+
-        '<div class="row">'+
-          '<div  id="provision_info_vdc_group_acct" class="large-10 large-centered columns">'+
-          '</div>'+
-        '</div>'+
-        '<br>'+
-        (Config.isFeatureEnabled("showback") ? '<div class="row">'+
-          '<div class="large-11 large-centered columns">'+
-            '<h3 class="subheader text-right">'+
-              '<span class="left">'+
-                Locale.tr("Group Showback")+
-              '</span>'+
-            '</h3>'+
-          '</div>'+
-        '</div>'+
-        '<br>'+
-        '<div class="row">'+
-          '<div  id="provision_info_vdc_group_showback" class="large-10 large-centered columns">'+
-          '</div>'+
-        '</div>'+
-        '<br>' : '') +
-        '<div class="row">'+
-          '<div class="large-11 large-centered columns">'+
-            '<h3 class="subheader text-right">'+
-              '<span class="left">'+
-                Locale.tr("Group Quotas")+
-              '</span>'+
-            '</h3>'+
-          '</div>'+
-        '</div>'+
-        '<br>'+
-        '<div class="row">'+
-          '<div class="large-11 columns large-centered quotas" id="provision_vdc_quotas_div">'+
-          '</div>'+
-        '</div>'+
-  '</div>';
-
   var list_templates_accordion_id = 0;
-
   function provision_list_templates(opts_arg){
     opts = $.extend({
         title: Locale.tr("Saved Templates"),
@@ -898,237 +418,10 @@ define(function(require) {
       },opts_arg)
 
     list_templates_accordion_id += 1;
-    return '<dl class="accordion accordion_list provision_list_templates" data-accordion="dfsaf">'+
-      '<dd class="'+ (opts.active ? 'active' : '') +' accordion-navigation">'+
-        '<a class="right only-not-active" href="#provision_list_template_accordion'+list_templates_accordion_id+'">'+
-          '<span class="button medium radius">'+
-            '<i class="fa fa-fw fa-lg fa-th"/> '+
-            '<i class="fa fa-fw fa-lg fa-chevron-left"/> '+
-            //Locale.tr("Show List") +
-          '</span>' +
-        '</a>'+
-        '<h2 class="subheader">'+
-          opts.title +
-          '<span href"#" class="right only-active button medium radius secondary provision_templates_list_refresh_button"  '+(!opts.refresh ? 'style="display:none" ': "") + 'data-tooltip title="'+ Locale.tr("Refresh")+'">'+
-            '<i class="fa fa-fw fa-lg fa-refresh"/>'+
-          '</span>'+
-          '<span href"#" class="right only-active button medium radius secondary provision_templates_list_filter_button"  '+(!opts.filter ? 'style="display:none" ': "") + 'data-tooltip title="'+ Locale.tr("Filter by User")+'">'+
-            '<i class="fa fa-fw fa-lg fa-filter"/>'+
-          '</span>'+
-          '<span class="right only-active provision_list_templates_filter" style="display: none"></span>'+
-          '<input type="search" class="provision_list_templates_search right only-active provision-search-input right" placeholder="Search"/>'+
-        '</h2>'+
-        '<div id="provision_list_template_accordion'+list_templates_accordion_id+'" class="content '+ (opts.active ? 'active' : '') +'">'+
-          '<div class="row">'+
-            '<div class="provision_confirm_delete_template_div large-10 large-centered columns">'+
-            '</div>'+
-          '</div>'+
-          '<div class="row">'+
-            '<div class="large-12 large-centered columns">'+
-              '<table class="provision_templates_table">'+
-                '<thead class="hidden">'+
-                  '<tr>'+
-                    '<th>'+Locale.tr("ID")+'</th>'+
-                    '<th>'+Locale.tr("Name")+'</th>'+
-                    '<th>'+Locale.tr("Saved")+'</th>'+
-                    '<th>'+Locale.tr("User ID")+'</th>'+
-                  '</tr>'+
-                '</thead>'+
-                '<tbody class="hidden">'+
-                '</tbody>'+
-              '</table>'+
-              '<br>'+
-            '</div>'+
-          '</div>'+
-        '</div>'+
-      '</dd>'+
-      '<dd class="accordion-navigation">'+
-        '<a class="provision_show_template_accordion" href="#provision_show_template_accordion'+list_templates_accordion_id+'">'+
-        '</a>'+
-        '<div id="provision_show_template_accordion'+list_templates_accordion_id+'" class="content">'+
-          //provision_info_vdc_template +
-        '</div>'+
-      '</dd>'+
-    '</dl>';
+    return TemplateTemplatesList({'accordionId': list_templates_accordion_id, 'opts': opts});
   }
 
-  var provision_info_vm =
-  '<div class="text-center provision_info_vm_loading">'+
-    '<span class="fa-stack fa-5x" style="color: #dfdfdf">'+
-      '<i class="fa fa-cloud fa-stack-2x"></i>'+
-      '<i class="fa  fa-spinner fa-spin fa-stack-1x fa-inverse"></i>'+
-    '</span>'+
-    '<br>'+
-    '<br>'+
-    '<span style="font-size: 18px; color: #999">'+
-    '</span>'+
-  '</div>'+
-  '<div class="provision_info_vm">'+
-    '<div class="row">'+
-      '<div class="large-12 large-centered columns">'+
-        '<ul class="inline-list provision_action_icons">'+
-          '<li>'+
-            '<a href"#" data-tooltip title="Open a remote console in a new window" class="left button medium radius provision_vnc_button tip-top">'+
-              '<i class="fa fa-fw fa-lg fa-desktop"/> '+
-            '</a>'+
-            '<a data-tooltip title="You have to boot the Virtual Machine first" class="left button medium radius white provision_vnc_button_disabled tip-top" style="color: #999">'+
-              '<i class="fa fa-fw fa-lg fa-desktop"/> '+
-            '</a>'+
-            (Config.isTabPanelEnabled("provision-tab", "templates") ?
-              '<a href"#" data-tooltip title="The main disk of the Virtual Machine will be saved in a new Image" class="left button medium radius success provision_snapshot_button tip-top">'+
-                '<i class="fa fa-fw fa-lg fa-save"/> '+
-              '</a>'+
-              '<a data-tooltip title="You have to power-off the virtual machine first" class="left button medium radius white provision_snapshot_button_disabled tip-top" style="color: #999">'+
-                '<i class="fa fa-fw fa-lg fa-save"/> '+
-              '</a>' : '') +
-          '</li>'+
-          '<li class="right">'+
-            '<a href"#" data-tooltip title="Delete" class="button medium radius alert provision_delete_confirm_button tip-top right">'+
-              '<i class="fa fa-fw fa-lg fa-trash-o"/>'+
-            '</a>'+
-            '<a href"#" data-tooltip title="Delete" class="button medium radius alert provision_shutdownhard_confirm_button tip-top right">'+
-              '<i class="fa fa-fw fa-lg fa-trash-o"/>'+
-            '</a>'+
-            '<a href"#" data-tooltip title="Power off" class="button medium radius secondary provision_poweroff_confirm_button tip-top right">'+
-              '<i class="fa fa-fw fa-lg fa-power-off"/> '+
-            '</a>'+
-            '<a href"#" data-tooltip title="Power on" class="button medium radius secondary provision_poweron_button tip-top right">'+
-              '<i class="fa fa-fw fa-lg fa-play"/> '+
-            '</a>'+
-            '<a href"#" data-tooltip title="Reboot" class="button medium radius secondary provision_reboot_confirm_button tip-top right">'+
-              '<i class="fa fa-fw fa-lg fa-repeat"/> '+
-            '</a>'+
-          '</li>'+
-        '</ul>'+
-      '</div>'+
-    '</div>'+
-    '<div class="row">'+
-      '<div class="provision_confirm_action large-10 large-centered columns">'+
-      '</div>'+
-    '</div>'+
-    '<br>'+
-    '<div class="row">'+
-      '<div class="large-4 columns">'+
-        '<ul class="provision-pricing-table_vm_info provision-pricing-table" style="border: 0px !important; background: #fff;">'+
-        '</ul>'+
-      '</div>'+
-      '<div class="large-8 columns">'+
-        '<div class="row">'+
-          '<div class="large-6 medium-6  columns">'+
-            '<div class="row text-center">'+
-              '<div class="large-12 columns">'+
-                '<h3 class="subheader"><small>'+Locale.tr("CPU")+'</small></h3>'+
-              '</div>'+
-            '</div>'+
-            '<div class="row">'+
-              '<div class="large-12 columns">'+
-                '<div class="large-12 columns centered graph vm_cpu_graph" style="height: 100px;">'+
-                '</div>'+
-              '</div>'+
-            '</div>'+
-            '<div class="row graph_legend">'+
-              '<div class="large-12 columns centered vm_cpu_legend">'+
-              '</div>'+
-            '</div>'+
-          '</div>'+
-          '<div class="large-6 medium-6 columns">'+
-            '<div class="row text-center">'+
-              '<div class="large-12 columns">'+
-                '<h3 class="subheader"><small>'+Locale.tr("MEMORY")+'</small></h3>'+
-              '</div>'+
-            '</div>'+
-            '<div class="row">'+
-              '<div class="large-12 columns">'+
-                '<div class="large-12 columns centered graph vm_memory_graph" style="height: 100px;">'+
-                '</div>'+
-              '</div>'+
-            '</div>'+
-            '<div class="row graph_legend">'+
-              '<div class="large-12 columns centered vm_memory_legend">'+
-              '</div>'+
-            '</div>'+
-          '</div>'+
-        '</div>'+
-        '<div class="row">'+
-          '<div class="large-6 medium-6 columns">'+
-            '<div class="row text-center">'+
-              '<div class="large-12 columns">'+
-                '<h3 class="subheader"><small>'+Locale.tr("NET RX")+'</small></h3>'+
-              '</div>'+
-            '</div>'+
-            '<div class="row">'+
-              '<div class="large-12 columns">'+
-                '<div class="large-12 columns centered graph vm_net_rx_graph" style="height: 100px;">'+
-                '</div>'+
-              '</div>'+
-            '</div>'+
-            '<div class="row graph_legend">'+
-              '<div class="large-12 columns centered vm_net_rx_legend">'+
-              '</div>'+
-            '</div>'+
-          '</div>'+
-          '<div class="large-6 medium-6  columns">'+
-            '<div class="row text-center">'+
-              '<div class="large-12 columns">'+
-                '<h3 class="subheader"><small>'+Locale.tr("NET TX")+'</small></h3>'+
-              '</div>'+
-            '</div>'+
-            '<div class="row">'+
-              '<div class="large-12 columns">'+
-                '<div class="large-12 columns centered graph vm_net_tx_graph" style="height: 100px;">'+
-                '</div>'+
-              '</div>'+
-            '</div>'+
-            '<div class="row graph_legend">'+
-              '<div class="large-12 columns centered vm_net_tx_legend">'+
-              '</div>'+
-            '</div>'+
-          '</div>'+
-        '</div>'+
-        '<div class="row">'+
-          '<div class="large-6 medium-6  columns">'+
-            '<div class="row text-center">'+
-              '<div class="large-12 columns">'+
-                '<h3 class="subheader"><small>'+Locale.tr("NET DOWNLOAD SPEED")+'</small></h3>'+
-              '</div>'+
-            '</div>'+
-            '<div class="row">'+
-              '<div class="large-12 columns">'+
-                '<div class="large-12 columns centered graph vm_net_rx_speed_graph" style="height: 100px;">'+
-                '</div>'+
-              '</div>'+
-            '</div>'+
-            '<div class="row graph_legend">'+
-              '<div class="large-12 columns centered vm_net_rx_speed_legend">'+
-              '</div>'+
-            '</div>'+
-          '</div>'+
-          '<div class="large-6 medium-6 columns">'+
-            '<div class="row text-center">'+
-              '<div class="large-12 columns">'+
-                '<h3 class="subheader"><small>'+Locale.tr("NET UPLOAD SPEED")+'</small></h3>'+
-              '</div>'+
-            '</div>'+
-            '<div class="row">'+
-              '<div class="large-12 columns">'+
-                '<div class="large-12 columns centered graph vm_net_tx_speed_graph" style="height: 100px;">'+
-                '</div>'+
-              '</div>'+
-            '</div>'+
-            '<div class="row graph_legend">'+
-              '<div class="large-12 columns centered vm_net_tx_speed_legend">'+
-              '</div>'+
-            '</div>'+
-          '</div>'+
-        '</div>'+
-      '</div>'+
-    '</div>'+
-    '<br>'+
-    '<br>'+
-  '</div>';
-
   var list_vms_accordion_id = 0;
-
   function provision_list_vms(opts_arg){
     opts = $.extend({
         title: Locale.tr("Virtual Machines"),
@@ -1138,124 +431,10 @@ define(function(require) {
       },opts_arg)
 
     list_vms_accordion_id += 1;
-    return '<dl class="accordion accordion_list provision_list_vms" data-accordion>'+
-      '<dd class="'+ (opts.active ? 'active' : '') +' accordion-navigation">'+
-          '<a href="#provision_list_vm_accordion'+list_vms_accordion_id+'" class="provision_back right only-not-active">'+
-            '<span class="button medium radius">'+
-              '<i class="fa fa-fw fa-lg fa-th"/> '+
-              '<i class="fa fa-fw fa-lg fa-chevron-left"/> '+
-              //Locale.tr("Show List") +
-            '</span>' +
-          '</a>' +
-          '<h2 class="subheader">'+
-            opts.title +
-            '<span class="provision_info_vm_name only-not-active" style="margin-left: 20px; color: #777; font-size: 20px">'+
-            '</span>'+
-            '<span href"#" class="right only-active button medium radius secondary provision_vms_list_refresh_button" '+(!opts.refresh ? 'style="display:none" ': "") + 'data-tooltip title="'+ Locale.tr("Refresh")+'">'+
-              '<i class="fa fa-fw fa-lg fa-refresh"/> '+
-            '</span>'+
-            '<span href"#" class="right only-not-active button medium radius secondary provision_refresh_info" '+(!opts.refresh ? 'style="display:none" ': "") + 'data-tooltip title="'+ Locale.tr("Refresh")+'">'+
-              '<i class="fa fa-fw fa-lg fa-refresh"/>'+
-            '</span>' +
-            '<span href"#" class="right only-active button medium radius secondary provision_vms_list_filter_button" '+(!opts.filter ? 'style="display:none" ': "") + 'data-tooltip title="'+ Locale.tr("Filter by User")+'">'+
-              '<i class="fa fa-fw fa-lg fa-filter"/> '+
-            '</span>'+
-            '<span class="right only-active provision_list_vms_filter" style="display: none"></span>'+
-            '<span>' +
-            '<input type="search" class="right only-active provision_list_vms_search provision-search-input right" placeholder="Search"/>'+
-            '<span href"#" class="right only-active button medium radius success provision_create_vm_button" '+(!opts.create ? 'style="display:none" ': "") + '>'+
-              '<i class="fa fa-fw fa-lg fa-plus-square"/> '+
-            '</span>' +
-          '</h2>'+
-        '<div id="provision_list_vm_accordion'+list_vms_accordion_id+'" class="content '+ (opts.active ? 'active' : '') +'">'+
-          '<div class="row">'+
-            '<div class="large-12 large-centered columns">'+
-              '<table class="provision_vms_table">'+
-                '<thead class="hidden">'+
-                  '<tr>'+
-                    '<th>'+Locale.tr("ID")+'</th>'+
-                    '<th>'+Locale.tr("Name")+'</th>'+
-                    '<th>'+Locale.tr("User ID")+'</th>'+
-                  '</tr>'+
-                '</thead>'+
-                '<tbody class="hidden">'+
-                '</tbody>'+
-              '</table>'+
-              '<br>'+
-            '</div>'+
-          '</div>'+
-        '</div>'+
-      '</dd>'+
-      '<dd class="accordion-navigation">'+
-        '<a class="provision_show_vm_accordion" href="#provision_show_vm_accordion'+list_vms_accordion_id+'">'+
-        '</a>'+
-        '<div id="provision_show_vm_accordion'+list_vms_accordion_id+'" class="content">'+
-          provision_info_vm +
-        '</div>'+
-      '</dd>'+
-    '</dl>';
+    return TemplateVmsList({'accordionId': list_vms_accordion_id, 'opts': opts});
   }
 
-  var provision_info_flow =
-  '<div class="text-center provision_info_flow_loading">'+
-    '<span class="fa-stack fa-5x" style="color: #dfdfdf">'+
-      '<i class="fa fa-cloud fa-stack-2x"></i>'+
-      '<i class="fa  fa-spinner fa-spin fa-stack-1x fa-inverse"></i>'+
-    '</span>'+
-    '<br>'+
-    '<br>'+
-    '<span style="font-size: 18px; color: #999">'+
-    '</span>'+
-  '</div>'+
-  '<div class="provision_info_flow">'+
-    '<div class="row">'+
-      '<div class="large-12 large-centered columns">'+
-        '<ul class="inline-list provision_action_icons">'+
-          '<li>'+
-            '<a href"#" data-tooltip title="Recover a failed service, cleaning the failed VMs" class="left button medium radius success provision_recover_button">'+
-              '<i class="fa fa-fw fa-lg fa-wrench"/> '+
-            '</a>'+
-          '</li>'+
-          '<li class="right">'+
-            '<a href"#" data-tooltip title="Delete" class="button medium radius alert provision_delete_confirm_button tip-top right">'+
-              '<i class="fa fa-fw fa-lg fa-trash-o"/>'+
-            '</a>'+
-            '<a href"#" data-tooltip title="Shutdown" class="button medium radius secondary provision_shutdown_confirm_button tip-top right">'+
-              '<i class="fa fa-fw fa-lg fa-power-off"/>'+
-            '</a>'+
-          '</li>'+
-        '</ul>'+
-      '</div>'+
-    '</div>'+
-    '<div class="row">'+
-      '<div class="provision_confirm_action large-10 large-centered columns">'+
-      '</div>'+
-    '</div>'+
-    '<br>'+
-    '<div class="row">'+
-      '<div class="large-4 columns">'+
-        '<ul class="provision-pricing-table_flow_info provision-pricing-table" style="border: 0px !important; background: #fff;">'+
-        '</ul>'+
-      '</div>'+
-      '<div class="large-8 columns">'+
-        '<div class="row">'+
-          '<div class="large-12 columns">'+
-            '<ul class="provision_roles_ul large-block-grid-2 medium-block-grid-2 small-block-grid-1 text-center">'+
-            '</ul>'+
-          '</div>'+
-        '</div>'+
-      '</div>'+
-    '</div>'+
-    '<br>'+
-    '<br>'+
-    '<div class="row">'+
-      '<div class="provision_role_vms_container large-12 large-centered columns">'+
-      '</div>'+
-    '</div>'+
-  '</div>';
-
   var list_flows_accordion_id = 0;
-
   function provision_list_flows(opts_arg){
     opts = $.extend({
         title: Locale.tr("Services"),
@@ -1266,135 +445,9 @@ define(function(require) {
       },opts_arg)
 
     list_flows_accordion_id += 1;
-    return '<dl class="accordion accordion_list provision_list_flows" data-accordion>'+
-      '<dd class="'+ (opts.active ? 'active' : '') +' accordion-navigation">'+
-        '<a class="provision_list_flow_accordion right only-not-active provision_back" href="#provision_list_flow_accordion'+list_flows_accordion_id+'">'+
-          '<span class="button medium radius">'+
-            '<i class="fa fa-fw fa-lg fa-th"/> '+
-            '<i class="fa fa-fw fa-lg fa-chevron-left"/> '+
-            //Locale.tr("Show List") +
-          '</span>' +
-        '</a>'+
-        '<h2 class="subheader">'+
-          opts.title +
-          '<span class="provision_info_flow_name only-not-active" style="margin-left: 20px; color: #777; font-size: 20px">'+
-          '</span>'+
-          '<span href"#" class="only-active right button radius medium secondary provision_flows_list_refresh_button"  '+(!opts.refresh ? 'style="display:none" ': "") + 'data-tooltip title="'+ Locale.tr("Refresh")+'">'+
-            '<i class="fa fa-fw fa-lg fa-refresh"/>'+
-          '</span>'+
-          '<span href"#" class="only-not-active right button medium radius secondary provision_refresh_info"  '+(!opts.refresh ? 'style="display:none" ': "") + 'data-tooltip title="'+ Locale.tr("Refresh")+'">'+
-            '<i class="fa fa-fw fa-lg fa-refresh"/>'+
-          '</span>'+
-          '<span href"#" class="only-active right button radius medium secondary provision_flows_list_filter_button"  '+(!opts.filter ? 'style="display:none" ': "") + 'data-tooltip title="'+ Locale.tr("Filter by User")+'">'+
-            '<i class="fa fa-fw fa-lg fa-filter"/> '+
-          '</span>'+
-          '<span class="only-active right provision_list_flows_filter" style="display: none"></span>'+
-          '<span>'+
-          '<input type="search" class="only-active provision_list_flows_search provision-search-input right" placeholder="Search"/>'+
-          '<span href"#" class="only-active right button radius medium success provision_create_flow_button" '+(!opts.create ? 'style="display:none" ': "") + '>'+
-            '<i class="fa fa-fw fa-lg fa-plus-square"/> '+
-          '</span>'+
-        '</h2>'+
-        '<div id="provision_list_flow_accordion'+list_flows_accordion_id+'" class="content '+ (opts.active ? 'active' : '') +'">'+
-          '<div class="">'+
-            '<div class="row">'+
-              '<div class="large-12 large-centered columns">'+
-                '<table class="provision_flows_table">'+
-                  '<thead class="hidden">'+
-                    '<tr>'+
-                      '<th>'+Locale.tr("ID")+'</th>'+
-                      '<th>'+Locale.tr("Name")+'</th>'+
-                      '<th>'+Locale.tr("User ID")+'</th>'+
-                    '</tr>'+
-                  '</thead>'+
-                  '<tbody class="hidden">'+
-                  '</tbody>'+
-                '</table>'+
-                '<br>'+
-              '</div>'+
-            '</div>'+
-          '</div>'+
-        '</div>'+
-      '</dd>'+
-      '<dd class="accordion-navigation">'+
-        '<a class="provision_show_flow_accordion" href="#provision_show_flow_accordion'+list_flows_accordion_id+'">'+
-        '</a>'+
-        '<div id="provision_show_flow_accordion'+list_flows_accordion_id+'" class="content">'+
-          provision_info_flow +
-        '</div>'+
-      '</dd>'+
-    '</dl>';
+    return TemplateVmsList({'accordionId': list_flows_accordion_id, 'opts': opts});
   }
 
-  var provision_content = provision_dashboard +
-    provision_user_info +
-    TemplateVmsCreate() +
-    '<div class="provision_vms_list_section hidden section_content">' +
-    '</div>';
-
-  if (Config.isTabPanelEnabled("provision-tab", "templates")) {
-    provision_content += '<div class="provision_templates_list_section hidden section_content">';
-    provision_content += '</div>';
-  }
-
-  if (Config.isTabPanelEnabled("provision-tab", "users")) {
-    provision_content += provision_manage_vdc;
-    provision_content += '<div class="provision_users_list_section hidden section_content">';
-    provision_content += '</div>';
-    provision_content += provision_create_user;
-  }
-
-  if (Config.isTabPanelEnabled("provision-tab", "flows")) {
-    provision_content += '<div class="provision_flows_list_section hidden section_content">'
-    provision_content += '</div>'
-    provision_content += provision_create_flow;
-  }
-
-  var provision_header = '<a href="#" class="provision_image_header" ><img src="'+Config.provision.logo+'" style="height:40px; vertical-align:top"></a><br><br>'+
-     '<ul class="inline-list text-center" style="font-size:13px; padding-bottom: 10px; border-bottom: 1px solid #efefef;">';
-
-  if (Config.isTabPanelEnabled("provision-tab", "users")) {
-    provision_header +=
-      '<li>'+
-        '<a href"#" class="medium off-color" id="provision_vdc_info_button"><i class="fa fa-fw fa-2x fa-bar-chart-o"/>'+Locale.tr("Group Info")+'</a>'+
-      '</li>'+
-      '<li>'+
-        '<a href"#" class="medium off-color provision_users_list_button" id=""><i class="fa fa-fw fa-2x fa-users"/>'+Locale.tr("Users")+'</a>'+
-      '</li>'
-  }
-
-  provision_header +=  '<li>'+
-        '<a href"#" class="medium off-color provision_vms_list_button" id=""><i class="fa fa-fw fa-2x fa-th"/>'+Locale.tr("VMs")+'</a>'+
-      '</li>'
-
-  if (Config.isTabPanelEnabled("provision-tab", "templates")) {
-    provision_header +=
-      '<li>'+
-        '<a href"#" class="medium off-color provision_templates_list_button"><i class="fa fa-fw fa-2x fa-save"/>'+Locale.tr("Templates")+'</a>'+
-      '</li>';
-  }
-
-  if (Config.isTabPanelEnabled("provision-tab", "flows")) {
-    provision_header +=
-      '<li>'+
-        '<a href"#" class="medium off-color provision_flows_list_button" id=""><i class="fa fa-2x fa-fw fa-cubes"/>'+Locale.tr("Services")+'</a>'+
-      '</li>';
-  }
-
-    provision_header +=
-      //'<li style="border-left: 1px solid #efefef; height: 40px">'+
-      //'</li>'+
-      //'<li>'+
-      //  '<a href"#" class="medium off-color" id="provision_user_info_button"><i class="fa fa-fw fa-2x fa-user"/>'+config['display_name']+'</a>'+
-      //'</li>'+
-      //'<li>'+
-      //  '<a href="#" data-dropdown="provision_zone_selector" class="button small radius secondary dropdown off-color" id="zonelector" style="padding:0px; font-size: 12px;">'+
-      //    '<i class="fa fa-home fa-2x header-icon" style="margin-bottom: 2px"/> ' + config['zone_name'] +
-      //  '</a>'+
-      //  '<ul id="provision_zone_selector" data-dropdown-content class="zone-ul f-dropdown"></ul>'+
-      //'</li>'+
-    '</ul>'
-
   var povision_actions = {
     "Provision.User.show" : {
         type: "single",
@@ -5372,7 +4425,7 @@ define(function(require) {
     tabId: TAB_ID,
     list_header: "",
     actions: povision_actions,
-    content: provision_content,
+    content: TemplateContent(),
     setup: _setup
   };
 
@@ -5384,14 +4437,7 @@ define(function(require) {
       var tab = $("#"+tab_name);
 
       if (Config.isTabEnabled(tab_name)) {
-        $('.right-header').prepend(
-          '<div style=" padding: 15px 0px 10px 0px; margin-bottom: 10px">'+
-            '<div class="row">'+
-              '<div class="large-10 large-centered columns">'+
-              provision_header+
-              '</div>'+
-            '</div>'+
-          '<div>')
+        $('.right-header').prepend(TemplateHeader({'logo': Config.provision.logo}))
 
         $(".left-content").remove();
         $(".right-content").addClass("large-centered small-centered");
diff --git a/src/sunstone/public/app/tabs/provision-tab/content.hbs b/src/sunstone/public/app/tabs/provision-tab/content.hbs
new file mode 100644
index 0000000000..be0fe8ab9b
--- /dev/null
+++ b/src/sunstone/public/app/tabs/provision-tab/content.hbs
@@ -0,0 +1,20 @@
+<div id="provision_dashboard" class="section_content"></div>
+{{!provision_user_info}}
+
+{{> tabs/provision-tab/vms/create}}
+<div class="provision_vms_list_section hidden section_content"></div>
+
+{{#isTabPanelEnabled "provision-tab" "templates"}}
+<div class="provision_templates_list_section hidden section_content"></div>
+{{/isTabPanelEnabled}}
+
+{{#isTabPanelEnabled "provision-tab" "users"}}
+{{> tabs/provision-tab/group/info}}
+{{> tabs/provision-tab/users/create}}
+<div class="provision_users_list_section hidden section_content"></div>
+{{/isTabPanelEnabled}}
+
+{{#isTabPanelEnabled "provision-tab" "flows"}}
+{{> tabs/provision-tab/flows/create}}
+<div class="provision_flows_list_section hidden section_content"></div>
+{{/isTabPanelEnabled}}
\ No newline at end of file
diff --git a/src/sunstone/public/app/tabs/provision-tab/flows/create.hbs b/src/sunstone/public/app/tabs/provision-tab/flows/create.hbs
new file mode 100644
index 0000000000..2744304e09
--- /dev/null
+++ b/src/sunstone/public/app/tabs/provision-tab/flows/create.hbs
@@ -0,0 +1,70 @@
+<form id="provision_create_flow" class="hidden section_content">
+  <div class="row">
+    <div class="large-10 large-centered columns">
+      <h2 class="subheader">{{tr "Create Service"}}</h2>
+      <br></div>
+  </div>
+  <div class="row">
+    <div class="large-8 large-centered columns">
+      <input type="text" id="flow_name"  class="provision-input" placeholder="{{tr "Service Name"}}" style="height: 40px !important; font-size: 16px; padding: 0.5rem  !important;"/>
+    </div>
+  </div>
+  <div class="row">
+    <div class="large-10 large-centered columns">
+      <dl class="accordion provision_accordion_flow_template" data-accordion="provision_accordion_flow_template">
+        <dd style="border-bottom: 1px solid #efefef;" class="active accordion-navigation">
+          <a href="#provision_dd_flow_template" style="background: #fff; font-size: 30px">
+            <span class="select_template" style="color:#555">{{tr "Select a Template"}}</span>
+            <span class="selected_template" style="display:none; color:#555">
+              <span class="provision-logo selected_template_logo" style="color:#555"></span>
+              <span class="selected_template_name" style="color:#555"></span>
+              <span class="has-tip right" style="cursor: pointer; margin-right:10px;"> <i class="fa fa-pencil"/></span>
+            </span>
+          </a>
+          <div id="provision_dd_flow_template" class="provision_select_flow_template active content">
+            <div class="row">
+              <div class="large-12 large-centered columns">
+                <h3 class="subheader text-right">
+                  <input type="search" class="provision-search-input right" placeholder="Search" id="provision_create_flow_template_search"/>
+                </h3>
+                <br></div>
+            </div>
+            <div class="row">
+              <div class="large-12 large-centered columns">
+                <table id="provision_flow_templates_table">
+                  <thead class="hidden">
+                    <tr>
+                      <th>{{tr "ID"}}</th>
+                      <th>{{tr "Name"}}</th>
+                    </tr>
+                  </thead>
+                  <tbody class="hidden"></tbody>
+                </table>
+              </div>
+            </div>
+          </div>
+        </dd>
+      </dl>
+    </div>
+  </div>
+  <br>
+  <br>
+  <br>
+  <div class="row">
+    <div class="provision_network_selector large-9 large-centered columns"></div>
+  </div>
+  <br>
+  <div class="row">
+    <div class="provision_custom_attributes_selector large-9 large-centered columns"></div>
+  </div>
+  <div id="provision_customize_flow_template" style="display: none"></div>
+  <br>
+  <br>
+  <div class="row">
+    <div class="large-7 columns large-centered">
+      <div data-alert class="alert-box alert-box-error radius text-center hidden"></div>
+      <button href="#" class="button large success radius large-12 small-12" type="submit" style="height: 59px">{{tr "Create"}}</button>
+    </div>
+  </div>
+  <br>
+  <br></form>
\ No newline at end of file
diff --git a/src/sunstone/public/app/tabs/provision-tab/flows/info.hbs b/src/sunstone/public/app/tabs/provision-tab/flows/info.hbs
new file mode 100644
index 0000000000..a12b48b5e5
--- /dev/null
+++ b/src/sunstone/public/app/tabs/provision-tab/flows/info.hbs
@@ -0,0 +1,47 @@
+<div class="text-center provision_info_flow_loading">
+  <span class="fa-stack fa-5x" style="color: #dfdfdf"> <i class="fa fa-cloud fa-stack-2x"></i> <i class="fa  fa-spinner fa-spin fa-stack-1x fa-inverse"></i>
+  </span>
+  <br>
+  <br>
+  <span style="font-size: 18px; color: #999"></span>
+</div>
+<div class="provision_info_flow">
+  <div class="row">
+    <div class="large-12 large-centered columns">
+      <ul class="inline-list provision_action_icons">
+        <li>
+          <a href"#" data-tooltip title="{{tr "Recover a failed service, cleaning the failed VMs"}}" class="left button medium radius success provision_recover_button">
+            <i class="fa fa-fw fa-lg fa-wrench"/></a>
+        </li>
+        <li class="right">
+          <a href"#" data-tooltip title="{{tr "Delete"}}" class="button medium radius alert provision_delete_confirm_button tip-top right">
+            <i class="fa fa-fw fa-lg fa-trash-o"/></a>
+          <a href"#" data-tooltip title="{{tr "Shutdown"}}" class="button medium radius secondary provision_shutdown_confirm_button tip-top right">
+            <i class="fa fa-fw fa-lg fa-power-off"/>
+          </a>
+        </li>
+      </ul>
+    </div>
+  </div>
+  <div class="row">
+    <div class="provision_confirm_action large-10 large-centered columns"></div>
+  </div>
+  <br>
+  <div class="row">
+    <div class="large-4 columns">
+      <ul class="provision-pricing-table_flow_info provision-pricing-table" style="border: 0px !important; background: #fff;"></ul>
+    </div>
+    <div class="large-8 columns">
+      <div class="row">
+        <div class="large-12 columns">
+          <ul class="provision_roles_ul large-block-grid-2 medium-block-grid-2 small-block-grid-1 text-center"></ul>
+        </div>
+      </div>
+    </div>
+  </div>
+  <br>
+  <br>
+  <div class="row">
+    <div class="provision_role_vms_container large-12 large-centered columns"></div>
+  </div>
+</div>
\ No newline at end of file
diff --git a/src/sunstone/public/app/tabs/provision-tab/flows/list.hbs b/src/sunstone/public/app/tabs/provision-tab/flows/list.hbs
new file mode 100644
index 0000000000..384f0f2bd1
--- /dev/null
+++ b/src/sunstone/public/app/tabs/provision-tab/flows/list.hbs
@@ -0,0 +1,52 @@
+<dl class="accordion accordion_list provision_list_flows" data-accordion>
+  <dd class="{{#if opts.active}}active{{/if}} accordion-navigation">
+    <a class="provision_list_flow_accordion right only-not-active provision_back" href="#provision_list_flow_accordion{{accordionId}}">
+      <span class="button medium radius"> <i class="fa fa-fw fa-lg fa-th"/><i class="fa fa-fw fa-lg fa-chevron-left"/>
+      </span>
+    </a>
+    <h2 class="subheader">
+      {{opts.title}}
+      <span class="provision_info_flow_name only-not-active" style="margin-left: 20px; color: #777; font-size: 20px"></span>
+      <span href"#" class="only-active right button radius medium secondary provision_flows_list_refresh_button" 
+              {{#if opts.refresh}}style="display:none"{{/if}} data-tooltip title=" {{tr "Refresh"}}">
+        <i class="fa fa-fw fa-lg fa-refresh"/></span>
+      <span href"#" class="only-not-active right button medium radius secondary provision_refresh_info" 
+              {{#if opts.refresh}}style="display:none"{{/if}} data-tooltip title=" {{tr "Refresh"}}">
+        <i class="fa fa-fw fa-lg fa-refresh"/>
+      </span>
+      <span href"#" class="only-active right button radius medium secondary provision_flows_list_filter_button" 
+              {{#if opts.filter}}style="display:none"{{/if}} data-tooltip title=" {{tr "Filter by User"}}">
+        <i class="fa fa-fw fa-lg fa-filter"/>
+      </span>
+      <span class="only-active right provision_list_flows_filter" style="display: none"></span>
+      <span>
+        <input type="search" class="only-active provision_list_flows_search provision-search-input right" placeholder="Search"/>
+        <span href"#" class="only-active right button radius medium success provision_create_flow_button" 
+              {{#if opts.create}}style="display:none"{{/if}}>
+          <i class="fa fa-fw fa-lg fa-plus-square"/>
+        </span>
+      </h2>
+      <div id="provision_list_flow_accordion{{accordionId}}" class="content {{#if opts.active}}active{{/if}}">
+        <div class="">
+          <div class="row">
+            <div class="large-12 large-centered columns">
+              <table class="provision_flows_table">
+                <thead class="hidden">
+                  <tr>
+                    <th>{{tr "ID"}}</th>
+                    <th>{{tr "Name"}}</th>
+                    <th>{{tr "User ID"}}</th>
+                  </tr>
+                </thead>
+                <tbody class="hidden"></tbody>
+              </table>
+              <br></div>
+          </div>
+        </div>
+      </div>
+    </dd>
+    <dd class="accordion-navigation">
+      <a class="provision_show_flow_accordion" href="#provision_show_flow_accordion{{accordionId}}"></a>
+      <div id="provision_show_flow_accordion{{accordionId}}" class="content">{{> tabs/provision-tab/flows/info}}</div>
+    </dd>
+  </dl>
\ No newline at end of file
diff --git a/src/sunstone/public/app/tabs/provision-tab/group/info.hbs b/src/sunstone/public/app/tabs/provision-tab/group/info.hbs
new file mode 100644
index 0000000000..958bd407c9
--- /dev/null
+++ b/src/sunstone/public/app/tabs/provision-tab/group/info.hbs
@@ -0,0 +1,39 @@
+<div id="provision_manage_vdc" class="hidden section_content">
+  <div class="row">
+    <div class="large-11 large-centered columns">
+      <h3 class="subheader text-right">
+        <span class="left">{{tr "Group Accounting"}}</span>
+      </h3>
+    </div>
+  </div>
+  <br>
+  <div class="row">
+    <div  id="provision_info_vdc_group_acct" class="large-10 large-centered columns"></div>
+  </div>
+  <br>
+  {{#isFeatureEnabled "showback"}}
+  <div class="row">
+    <div class="large-11 large-centered columns">
+      <h3 class="subheader text-right">
+        <span class="left">{{tr "Group Showback"}}</span>
+      </h3>
+    </div>
+  </div>
+  <br>
+  <div class="row">
+    <div  id="provision_info_vdc_group_showback" class="large-10 large-centered columns"></div>
+  </div>
+  <br>
+  {{/isFeatureEnabled}}
+  <div class="row">
+    <div class="large-11 large-centered columns">
+      <h3 class="subheader text-right">
+        <span class="left">{{tr "Group Quotas"}}</span>
+      </h3>
+    </div>
+  </div>
+  <br>
+  <div class="row">
+    <div class="large-11 columns large-centered quotas" id="provision_vdc_quotas_div"></div>
+  </div>
+</div>
\ No newline at end of file
diff --git a/src/sunstone/public/app/tabs/provision-tab/header.hbs b/src/sunstone/public/app/tabs/provision-tab/header.hbs
new file mode 100644
index 0000000000..3f0a926a30
--- /dev/null
+++ b/src/sunstone/public/app/tabs/provision-tab/header.hbs
@@ -0,0 +1,60 @@
+<div style=" padding: 15px 0px 10px 0px; margin-bottom: 10px">
+  <div class="row">
+    <div class="large-10 large-centered columns">
+      <a href="#" class="provision_image_header" >
+        <img src="{{logo}}" style="height:40px; vertical-align:top"></a>
+      <br>
+      <br>
+      <ul class="inline-list text-center" style="font-size:13px; padding-bottom: 10px; border-bottom: 1px solid #efefef;">
+        {{#isTabPanelEnabled "provision-tab" "users"}}
+        <li>
+          <a href"#" class="medium off-color" id="provision_vdc_info_button"> <i class="fa fa-fw fa-2x fa-bar-chart-o"/>{{tr "Group Info"}}
+          </a>
+        </li>
+        <li>
+          <a href"#" class="medium off-color provision_users_list_button" id=""> <i class="fa fa-fw fa-2x fa-users"/>{{tr "Users"}}
+          </a>
+        </li>
+        {{/isTabPanelEnabled}}
+        <li>
+          <a href"#" class="medium off-color provision_vms_list_button" id="">
+            <i class="fa fa-fw fa-2x fa-th"/>
+            {{tr "VMs"}}
+          </a>
+        </li>
+        {{#isTabPanelEnabled "provision-tab" "templates"}}
+        <li>
+          <a href"#" class="medium off-color provision_templates_list_button">
+            <i class="fa fa-fw fa-2x fa-save"/>
+            {{tr "Templates"}}
+          </a>
+        </li>
+        {{/isTabPanelEnabled}}
+        {{#isTabPanelEnabled "provision-tab" "flows"}}
+        <li>
+          <a href"#" class="medium off-color provision_flows_list_button" id="">
+            <i class="fa fa-2x fa-fw fa-cubes"/>
+            {{tr "Services"}}
+          </a>
+        </li>
+        {{/isTabPanelEnabled}}
+        {{!
+        <li style="border-left: 1px solid #efefef; height: 40px"></li>
+        <li>
+          <a href"#" class="medium off-color" id="provision_user_info_button">
+            <i class="fa fa-fw fa-2x fa-user"/>
+            config[display_name]+
+          </a>
+        </li>
+        <li>
+          <a href="#" data-dropdown="provision_zone_selector" class="button small radius secondary dropdown off-color" id="zonelector" style="padding:0px; font-size: 12px;">
+            <i class="fa fa-home fa-2x header-icon" style="margin-bottom: 2px"/>
+            + config[zone_name] +
+          </a>
+          <ul id="provision_zone_selector" data-dropdown-content class="zone-ul f-dropdown"></ul>
+        </li>
+        }}
+      </ul>
+    </div>
+  </div>
+</div>
\ No newline at end of file
diff --git a/src/sunstone/public/app/tabs/provision-tab/templates/list.hbs b/src/sunstone/public/app/tabs/provision-tab/templates/list.hbs
new file mode 100644
index 0000000000..f2aefa59ca
--- /dev/null
+++ b/src/sunstone/public/app/tabs/provision-tab/templates/list.hbs
@@ -0,0 +1,44 @@
+<dl class="accordion accordion_list provision_list_templates" data-accordion="dfsaf">
+  <dd class="{{#if opts.active}}active{{/if}} accordion-navigation">
+    <a class="right only-not-active" href="#provision_list_template_accordion{{accordionId}}">
+      <span class="button medium radius"> <i class="fa fa-fw fa-lg fa-th"/><i class="fa fa-fw fa-lg fa-chevron-left"/>
+      </span>
+    </a>
+    <h2 class="subheader">
+      {{opts.title}}
+      <span href"#" class="right only-active button medium radius secondary provision_templates_list_refresh_button" 
+          {{#if opts.refresh}}style="display:none"{{/if}} data-tooltip title=" {{tr "Refresh"}}">
+        <i class="fa fa-fw fa-lg fa-refresh"/></span>
+      <span href"#" class="right only-active button medium radius secondary provision_templates_list_filter_button" 
+          {{#if opts.filter}}style="display:none"{{/if}} data-tooltip title=" {{tr "Filter by User"}}">
+        <i class="fa fa-fw fa-lg fa-filter"/>
+      </span>
+      <span class="right only-active provision_list_templates_filter" style="display: none"></span>
+      <input type="search" class="provision_list_templates_search right only-active provision-search-input right" placeholder="Search"/>
+    </h2>
+    <div id="provision_list_template_accordion{{accordionId}}" class="content {{#if opts.active}}active{{/if}}">
+      <div class="row">
+        <div class="provision_confirm_delete_template_div large-10 large-centered columns"></div>
+      </div>
+      <div class="row">
+        <div class="large-12 large-centered columns">
+          <table class="provision_templates_table">
+            <thead class="hidden">
+              <tr>
+                <th>{{tr "ID"}}</th>
+                <th>{{tr "Name"}}</th>
+                <th>{{tr "Saved"}}</th>
+                <th>{{tr "User ID"}}</th>
+              </tr>
+            </thead>
+            <tbody class="hidden"></tbody>
+          </table>
+          <br></div>
+      </div>
+    </div>
+  </dd>
+  <dd class="accordion-navigation">
+    <a class="provision_show_template_accordion" href="#provision_show_template_accordion{{accordionId}}"></a>
+    <div id="provision_show_template_accordion{{accordionId}}" class="content"></div>
+  </dd>
+</dl>
\ No newline at end of file
diff --git a/src/sunstone/public/app/tabs/provision-tab/users/create.hbs b/src/sunstone/public/app/tabs/provision-tab/users/create.hbs
new file mode 100644
index 0000000000..5497ff3b04
--- /dev/null
+++ b/src/sunstone/public/app/tabs/provision-tab/users/create.hbs
@@ -0,0 +1,67 @@
+<form id="provision_create_user" class="hidden section_content">
+  <div class="row">
+    <div class="large-10 large-centered columns">
+      <h2 class="subheader">{{tr "Create User"}}</h2>
+      <br></div>
+  </div>
+  <div class="row">
+    <div class="large-8 large-centered columns">
+      <input type="text" id="username"  class="provision-input" placeholder="{{tr "Username"}}" style="height: 40px !important; font-size: 16px; padding: 0.5rem  !important;"/>
+      <br></div>
+  </div>
+  <div class="row">
+    <div class="large-8 large-centered columns">
+      <input type="password" id="password"  class="provision-input" placeholder="{{tr "Password"}}" style="height: 40px !important; font-size: 16px; padding: 0.5rem  !important;"/>
+      <br></div>
+  </div>
+  <div class="row">
+    <div class="large-8 large-centered columns">
+      <input type="password" id="repeat_password"  class="provision-input" placeholder="{{tr "Repeat Password"}}" style="height: 40px !important; font-size: 16px; padding: 0.5rem  !important;"/>
+      <br></div>
+  </div>
+  <div class="row">
+    <div class="large-10 large-centered columns">
+      <h3 class="subheader text-right">
+        <span class="left">{{tr "Define Quotas"}}</span>
+      </h3>
+      <br></div>
+  </div>
+  <br>
+  <div class="row">
+    <div class="large-8 large-centered columns">
+      <dl class="tabs text-center" data-tab style="width: 100%">
+        <dd class="active" style="width: 50%;">
+          <a href="#provision_create_user_default_quota">{{tr "Default"}}</a>
+        </dd>
+        <dd style="width: 50%;">
+          <a href="#provision_create_user_manual_quota">{{tr "Manual"}}</a>
+        </dd>
+      </dl>
+      <div class="tabs-content">
+        <div class="content active" id="provision_create_user_default_quota">
+          <div class="row">
+            <div class="large-12 large-centered columns">
+              <span style="font-size: 18px; color: #999">
+                {{tr "Use the default system quotas set by the cloud adminstrator"}}
+              </span>
+            </div>
+          </div>
+        </div>
+        <div class="content" id="provision_create_user_manual_quota">{{> ./quota-widget}}</div>
+      </div>
+    </div>
+  </div>
+  <br>
+  <br>
+  <div class="row">
+    <div class="large-5 large-centered columns">
+      <hr>
+      <br></div>
+  </div>
+  <div class="row">
+    <div class="large-7 columns large-centered">
+      <div data-alert class="alert-box alert-box-error radius text-center hidden"></div>
+      <button href="#" class="button large radius large-12 small-12" type="submit">{{tr "Add User"}}</button>
+    </div>
+  </div>
+  <br></form>
\ No newline at end of file
diff --git a/src/sunstone/public/app/tabs/provision-tab/users/empty-graphs.hbs b/src/sunstone/public/app/tabs/provision-tab/users/empty-graphs.hbs
new file mode 100644
index 0000000000..9cef304b11
--- /dev/null
+++ b/src/sunstone/public/app/tabs/provision-tab/users/empty-graphs.hbs
@@ -0,0 +1,4 @@
+<span class="fa-stack fa-2x" style="color: #dfdfdf"> <i class="fa fa-cloud fa-stack-2x"></i>
+</span>
+<br>
+<span style="color: #cfcfcf">{{tr "There is no information available"}}</span>
\ No newline at end of file
diff --git a/src/sunstone/public/app/tabs/provision-tab/users/info.hbs b/src/sunstone/public/app/tabs/provision-tab/users/info.hbs
new file mode 100644
index 0000000000..257072b3d6
--- /dev/null
+++ b/src/sunstone/public/app/tabs/provision-tab/users/info.hbs
@@ -0,0 +1,72 @@
+<div class="text-center provision_info_vdc_user_loading">
+  <span class="fa-stack fa-5x" style="color: #dfdfdf"> <i class="fa fa-cloud fa-stack-2x"></i> <i class="fa  fa-spinner fa-spin fa-stack-1x fa-inverse"></i>
+  </span>
+  <br>
+  <br>
+  <span style="font-size: 18px; color: #999"></span>
+</div>
+<div class="provision_info_vdc_user">
+  <div class="row">
+    <div class="large-12 large-centered columns">
+      <ul class="inline-list provision_action_icons">
+        <li class="">
+          <a href"#" data-tooltip title="{{tr "Update the User Quotas"}}" class="left button medium secondary radius provision_vdc_user_quota_confirm_button tip-top">
+            <i class="fa fa-fw fa-lg fa-align-left"/></a>
+          <a href"#" data-tooltip title="{{tr "Change the password of the User"}}" class="left button medium secondary radius provision_vdc_user_password_confirm_button tip-top">
+            <i class="fa fa-fw fa-lg fa-lock"/></a>
+        </li>
+        <li class="right">
+          <a href"#" data-tooltip title="{{tr "Delete the User"}}" class="right button medium radius alert provision_vdc_user_delete_confirm_button tip-top">
+            <i class="fa fa-fw fa-lg fa-trash-o"/>
+          </a>
+        </li>
+      </ul>
+    </div>
+  </div>
+  <div class="row">
+    <div class="provision_vdc_user_confirm_action large-10 large-centered columns"></div>
+  </div>
+  <br>
+  <div class="row">
+    <div class="large-4 columns">
+      <ul class="provision-pricing-table_user_info provision-pricing-table" style="border: 0px !important; background: #fff;"></ul>
+    </div>
+    <div class="large-8 columns">
+      <div class="row dashboard_vm_accounting">
+        <div id="acct_content">
+          <div class="large-6 columns">
+            <input style="display:none;" value="vm" id="acct_group_by"/>
+            <div class="row">
+              <div class="large-12 columns graph_legend text-center">
+                <span style="color: #777; font-size: 14px">{{tr "CPU hours"}}</span>
+              </div>
+              <br>
+              <div class="large-12 columns">
+                <div class="large-12 columns centered graph" id="acct_cpu_graph" style="height: 180px;"></div>
+              </div>
+            </div>
+          </div>
+          <div class="large-6 columns">
+            <div class="row">
+              <div class="large-12 columns graph_legend text-center">
+                <span style="color: #777; font-size: 14px">{{tr "Memory GB hours"}}</span>
+              </div>
+              <div class="large-12 columns">
+                <div class="large-12 columns centered graph" id="acct_mem_graph" style="height: 180px;"></div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div id="acct_no_data">
+          <div class="row">
+            <div class="large-12 columns text-center">{{> ./empty-graphs}}</div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <br>
+  <div class="row">
+    <div class="provision_vdc_info_container large-12 large-centered columns"></div>
+  </div>
+  <br></div>
\ No newline at end of file
diff --git a/src/sunstone/public/app/tabs/provision-tab/users/list.hbs b/src/sunstone/public/app/tabs/provision-tab/users/list.hbs
new file mode 100644
index 0000000000..23c5dbfe97
--- /dev/null
+++ b/src/sunstone/public/app/tabs/provision-tab/users/list.hbs
@@ -0,0 +1,41 @@
+<dl class="accordion accordion_list provision_list_users" data-accordion>
+  <dd class="active accordion-navigation">
+    <a href="#provision_list_user_accordion{{accordionId}}" class="provision_back right only-not-active">
+      <span class="button medium radius"> <i class="fa fa-fw fa-lg fa-th"/><i class="fa fa-fw fa-lg fa-chevron-left"/>
+      </span>
+    </a>
+    <h2 class="subheader">
+      {{tr "Users"}}
+      <span class="provision_info_vdc_user_name only-not-active" style="margin-left: 20px; color: #777; font-size: 20px"></span>
+      <span href"#" class="right only-active provision_users_list_refresh_button button medium radius secondary" data-tooltip title="{{tr "Refresh"}}">
+        <i class="fa fa-fw fa-lg fa-refresh"/></span>
+      <span href"#" class="right only-not-active provision_refresh_info button medium radius secondary" data-tooltip title="{{tr "Refresh"}}">
+        <i class="fa fa-fw fa-lg fa-refresh"/>
+      </span>
+      <input type="search" class="provision_list_users_search provision-search-input right only-active" placeholder="Search"/>
+      <span href"#" class="right only-active provision_create_user_button button medium radius success">
+        <i class="fa fa-fw fa-lg fa-plus-square"/>
+      </span>
+    </h2>
+    <div id="provision_list_user_accordion{{accordionId}}" class="content active">
+      <div class="row">
+        <div class="large-12 large-centered columns">
+          <table class="provision_users_table">
+            <thead class="hidden">
+              <tr>
+                <th>{{tr "ID"}}</th>
+                <th>{{tr "Name"}}</th>
+              </tr>
+            </thead>
+            <tbody class="hidden"></tbody>
+          </table>
+          <br></div>
+      </div>
+    </div>
+  </dd>
+  <dd class="accordion-navigation">
+    <a class="provision_show_user_accordion" href="#provision_show_user_accordion{{accordionId}}"></a>
+    <div id="provision_show_user_accordion{{accordionId}}" class="content">{{> tabs/provision-tab/users/info}}</div>
+  </dd>
+</dl>
+;
\ No newline at end of file
diff --git a/src/sunstone/public/app/tabs/provision-tab/users/quota-widget.hbs b/src/sunstone/public/app/tabs/provision-tab/users/quota-widget.hbs
new file mode 100644
index 0000000000..3e11ccaa63
--- /dev/null
+++ b/src/sunstone/public/app/tabs/provision-tab/users/quota-widget.hbs
@@ -0,0 +1,114 @@
+<div class="row">
+  <div class="large-12 large-centered columns">
+    <h5 class="subheader text-right">
+      <span class="left" style="margin-bottom: 0.5em">{{tr "Running VMs"}}</span>
+    </h5>
+  </div>
+</div>
+<div class="row provision_rvms_quota">
+  <div class="medium-3 small-12 columns">
+    <select class="provision_quota_select">
+      <option value="edit">{{tr "Manual"}}</option>
+      <option value="unlimited">{{tr "Unlimited"}}</option>
+      <option value="default">{{tr "Default"}}</option>
+    </select>
+  </div>
+  <div class="medium-9 small-12 columns provision_quota_edit">
+    <div class="row collapse">
+      <div class="small-9 columns">
+        <div class="range-slider radius provision_rvms_quota_slider" data-slider data-options="start: 0; end: 50;">
+          <span class="range-slider-handle"></span>
+          <span class="range-slider-active-segment"></span>
+          <input type="hidden"></div>
+      </div>
+      <div class="large-2 small-2 columns">
+        <input type="text"  class="provision-input provision_rvms_quota_input" style="margin-top: -7px; height: 40px !important; font-size: 16px; padding: 0.5rem  !important;"/>
+      </div>
+    </div>
+  </div>
+  <div class="medium-9 small-12 columns provision_quota_unlimited" style="display:none">
+    <span style="font-size: 18px; color: #999">{{tr "Unlimited. Group quotas will still apply"}}</span>
+  </div>
+  <div class="medium-9 small-12 columns provision_quota_default" style="display:none">
+    <span style="font-size: 18px; color: #999">
+      {{tr "Use the default system quotas set by the cloud adminstrator"}}
+    </span>
+  </div>
+</div>
+<div class="row">
+  <div class="large-12 large-centered columns">
+    <h5 class="subheader text-right">
+      <span class="left" style="margin-bottom: 0.5em">{{tr "CPU"}}</span>
+    </h5>
+  </div>
+</div>
+<div class="row provision_cpu_quota">
+  <div class="medium-3 small-12 columns">
+    <select class="provision_quota_select">
+      <option value="edit">{{tr "Manual"}}</option>
+      <option value="unlimited">{{tr "Unlimited"}}</option>
+      <option value="default">{{tr "Default"}}</option>
+    </select>
+  </div>
+  <div class="medium-9 small-12 columns provision_quota_edit">
+    <div class="row collapse">
+      <div class="small-9 columns">
+        <div class="range-slider radius provision_cpu_quota_slider" data-slider data-options="start: 0; end: 50;">
+          <span class="range-slider-handle"></span>
+          <span class="range-slider-active-segment"></span>
+          <input type="hidden"></div>
+      </div>
+      <div class="large-2 small-2 columns">
+        <input type="text"  class="provision-input provision_cpu_quota_input" style="margin-top: -7px; height: 40px !important; font-size: 16px; padding: 0.5rem  !important;"/>
+      </div>
+    </div>
+  </div>
+  <div class="medium-9 small-12 columns provision_quota_unlimited" style="display:none">
+    <span style="font-size: 18px; color: #999">{{tr "Unlimited. Group quotas will still apply"}}</span>
+  </div>
+  <div class="medium-9 small-12 columns provision_quota_default" style="display:none">
+    <span style="font-size: 18px; color: #999">
+      {{tr "Use the default system quotas set by the cloud adminstrator"}}
+    </span>
+  </div>
+</div>
+<div class="row">
+  <div class="large-12 large-centered columns">
+    <h5 class="subheader text-right">
+      <span class="left" style="margin-bottom: 0.5em">{{tr "Memory (GBs)"}}</span>
+    </h5>
+  </div>
+</div>
+<div class="vm_param">
+  <input type="hidden" class="provision_memory_quota_input"/>
+</div>
+<div class="row provision_memory_quota">
+  <div class="medium-3 small-12 columns">
+    <select class="provision_quota_select">
+      <option value="edit">{{tr "Manual"}}</option>
+      <option value="unlimited">{{tr "Unlimited"}}</option>
+      <option value="default">{{tr "Default"}}</option>
+    </select>
+  </div>
+  <div class="medium-9 small-12 columns provision_quota_edit">
+    <div class="row collapse">
+      <div class="small-9 columns">
+        <div class="range-slider radius provision_memory_quota_slider" data-slider data-options="start: 0; end: 50;">
+          <span class="range-slider-handle"></span>
+          <span class="range-slider-active-segment"></span>
+          <input type="hidden"></div>
+      </div>
+      <div class="large-2 small-2 columns">
+        <input type="text"  class="provision-input provision_memory_quota_tmp_input" style="margin-top: -7px; height: 40px !important; font-size: 16px; padding: 0.5rem  !important;"/>
+      </div>
+    </div>
+  </div>
+  <div class="medium-9 small-12 columns provision_quota_unlimited" style="display:none">
+    <span style="font-size: 18px; color: #999">{{tr "Unlimited. Group quotas will still apply"}}</span>
+  </div>
+  <div class="medium-9 small-12 columns provision_quota_default" style="display:none">
+    <span style="font-size: 18px; color: #999">
+      {{tr "Use the default system quotas set by the cloud adminstrator"}}
+    </span>
+  </div>
+</div>
\ No newline at end of file
diff --git a/src/sunstone/public/app/tabs/provision-tab/vms/create.hbs b/src/sunstone/public/app/tabs/provision-tab/vms/create.hbs
new file mode 100644
index 0000000000..a4932f567e
--- /dev/null
+++ b/src/sunstone/public/app/tabs/provision-tab/vms/create.hbs
@@ -0,0 +1,115 @@
+<form id="provision_create_vm" class="hidden section_content">
+  <div class="row">
+    <div class="large-10 large-centered columns">
+      <h2 class="subheader">{{tr "Create Virtual Machine"}}</h2>
+      <br></div>
+  </div>
+  <div class="row">
+    <div class="large-8 large-centered columns">
+      <input type="text" id="vm_name"  class="provision-input" placeholder="{{tr "Virtual Machine Name"}}" style="height: 40px !important; font-size: 16px; padding: 0.5rem  !important;"/>
+      <br></div>
+  </div>
+  <div class="row">
+    <div class="large-10 large-centered columns">
+      <dl class="accordion provision_accordion_template" data-accordion="provision_accordion_template">
+        <dd style="border-bottom: 1px solid #efefef;" class="active accordion-navigation">
+          <a href="#provision_dd_template" style="background: #fff; font-size: 30px">
+            <span class="select_template" style="color:#555">{{tr "Select a Template"}}</span>
+            <span class="selected_template" style="display:none; color:#555">
+              <span class="provision-logo selected_template_logo" style="line-height: 80px"></span>
+              <span class="selected_template_name"></span>
+              <span class="has-tip right" style="cursor: pointer; margin-right:10px; line-height: 80px"> <i class="fa fa-pencil"/></span>
+            </span>
+          </a>
+          <div id="provision_dd_template" class="active content">
+            <div class="row provision_select_template">
+              <div class="large-12 large-centered columns">
+                <dl class="tabs text-center" data-tab style="width: 100%">
+                  <dd class="active" style="width: 33%;">
+                    <a href="#provision_system_templates_selector">{{tr "System"}}</a>
+                  </dd>
+                  <dd style="width: 33%;">
+                    <a href="#provision_vdc_templates_selector">{{tr "Group"}}</a>
+                  </dd>
+                  <dd style="width: 34%;">
+                    <a href="#provision_saved_templates_selector">{{tr "Saved"}}</a>
+                  </dd>
+                </dl>
+                <div class="row">
+                  <div class="large-12 large-centered columns">
+                    <h3 class="subheader text-right">
+                      <input type="search" class="provision-search-input right" placeholder="Search" id="provision_create_template_search"/>
+                    </h3>
+                    <br></div>
+                </div>
+                <div class="tabs-content">
+                  <div class="content active" id="provision_system_templates_selector">
+                    <table id="provision_system_templates_table">
+                      <thead class="hidden">
+                        <tr>
+                          <th>{{tr "ID"}}</th>
+                          <th>{{tr "Name"}}</th>
+                          <th>{{tr "Saved"}}</th>
+                        </tr>
+                      </thead>
+                      <tbody class="hidden"></tbody>
+                    </table>
+                  </div>
+                  <div class="content" id="provision_vdc_templates_selector">
+                    <table id="provision_vdc_templates_table">
+                      <thead class="hidden">
+                        <tr>
+                          <th>{{tr "ID"}}</th>
+                          <th>{{tr "Name"}}</th>
+                          <th>{{tr "Saved"}}</th>
+                          <th>{{tr "Shared"}}</th>
+                        </tr>
+                      </thead>
+                      <tbody class="hidden"></tbody>
+                    </table>
+                  </div>
+                  <div class="content" id="provision_saved_templates_selector">
+                    <table id="provision_saved_templates_table">
+                      <thead class="hidden">
+                        <tr>
+                          <th>{{tr "ID"}}</th>
+                          <th>{{tr "Name"}}</th>
+                          <th>{{tr "Saved"}}</th>
+                          <th>{{tr "Shared"}}</th>
+                        </tr>
+                      </thead>
+                      <tbody class="hidden"></tbody>
+                    </table>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </dd>
+      </dl>
+    </div>
+  </div>
+  <br>
+  <br>
+  <div class="row">
+    <div class="large-10 large-centered columns">
+      <div class="provision_capacity_selector"></div>
+      <br>
+      <br>
+      <div class="provision_network_selector"></div>
+      <br>
+      <br>
+      <div class="provision_custom_attributes_selector"></div>
+    </div>
+  </div>
+  <br>
+  <br>
+  <br>
+  <div class="row">
+    <div class="large-7 columns large-centered">
+      <div data-alert class="alert-box alert-box-error radius text-center hidden"></div>
+      <button href="#" class="button large success radius large-12 small-12" type="submit" style="height: 59px">{{tr "Create"}}</button>
+    </div>
+  </div>
+  <br>
+  <br></form>
\ No newline at end of file
diff --git a/src/sunstone/public/app/tabs/provision-tab/vms/info.hbs b/src/sunstone/public/app/tabs/provision-tab/vms/info.hbs
new file mode 100644
index 0000000000..76ba7c8800
--- /dev/null
+++ b/src/sunstone/public/app/tabs/provision-tab/vms/info.hbs
@@ -0,0 +1,166 @@
+<div class="text-center provision_info_vm_loading">
+  <span class="fa-stack fa-5x" style="color: #dfdfdf"> <i class="fa fa-cloud fa-stack-2x"></i> <i class="fa  fa-spinner fa-spin fa-stack-1x fa-inverse"></i>
+  </span>
+  <br>
+  <br>
+  <span style="font-size: 18px; color: #999"></span>
+</div>
+<div class="provision_info_vm">
+  <div class="row">
+    <div class="large-12 large-centered columns">
+      <ul class="inline-list provision_action_icons">
+        <li>
+          <a href"#" data-tooltip title="{{tr "Open a remote console in a new window"}}" class="left button medium radius provision_vnc_button tip-top">
+            <i class="fa fa-fw fa-lg fa-desktop"/></a>
+          <a data-tooltip title="{{tr "You have to boot the Virtual Machine first"}}" class="left button medium radius white provision_vnc_button_disabled tip-top" style="color: #999">
+            <i class="fa fa-fw fa-lg fa-desktop"/></a>
+          {{#isTabPanelEnabled "provision-tab" "templates"}}
+          <a href"#" data-tooltip title="{{tr "The main disk of the Virtual Machine will be saved in a new Image"}}" class="left button medium radius success provision_snapshot_button tip-top">
+            <i class="fa fa-fw fa-lg fa-save"/>
+          </a>
+          <a data-tooltip title="{{tr "You have to power-off the virtual machine first"}}" class="left button medium radius white provision_snapshot_button_disabled tip-top" style="color: #999">
+            <i class="fa fa-fw fa-lg fa-save"/>
+          </a>
+          {{/isTabPanelEnabled}}
+        </li>
+        <li class="right">
+          <a href"#" data-tooltip title="{{tr "Delete"}}" class="button medium radius alert provision_delete_confirm_button tip-top right">
+            <i class="fa fa-fw fa-lg fa-trash-o"/>
+          </a>
+          <a href"#" data-tooltip title="{{tr "Delete"}}" class="button medium radius alert provision_shutdownhard_confirm_button tip-top right">
+            <i class="fa fa-fw fa-lg fa-trash-o"/>
+          </a>
+          <a href"#" data-tooltip title="{{tr "Power off"}}" class="button medium radius secondary provision_poweroff_confirm_button tip-top right">
+            <i class="fa fa-fw fa-lg fa-power-off"/>
+          </a>
+          <a href"#" data-tooltip title="{{tr "Power on"}}" class="button medium radius secondary provision_poweron_button tip-top right">
+            <i class="fa fa-fw fa-lg fa-play"/>
+          </a>
+          <a href"#" data-tooltip title="{{tr "Reboot"}}" class="button medium radius secondary provision_reboot_confirm_button tip-top right">
+            <i class="fa fa-fw fa-lg fa-repeat"/>
+          </a>
+        </li>
+      </ul>
+    </div>
+  </div>
+  <div class="row">
+    <div class="provision_confirm_action large-10 large-centered columns"></div>
+  </div>
+  <br>
+  <div class="row">
+    <div class="large-4 columns">
+      <ul class="provision-pricing-table_vm_info provision-pricing-table" style="border: 0px !important; background: #fff;"></ul>
+    </div>
+    <div class="large-8 columns">
+      <div class="row">
+        <div class="large-6 medium-6  columns">
+          <div class="row text-center">
+            <div class="large-12 columns">
+              <h3 class="subheader">
+                <small>{{tr "CPU"}}</small>
+              </h3>
+            </div>
+          </div>
+          <div class="row">
+            <div class="large-12 columns">
+              <div class="large-12 columns centered graph vm_cpu_graph" style="height: 100px;"></div>
+            </div>
+          </div>
+          <div class="row graph_legend">
+            <div class="large-12 columns centered vm_cpu_legend"></div>
+          </div>
+        </div>
+        <div class="large-6 medium-6 columns">
+          <div class="row text-center">
+            <div class="large-12 columns">
+              <h3 class="subheader">
+                <small>{{tr "MEMORY"}}</small>
+              </h3>
+            </div>
+          </div>
+          <div class="row">
+            <div class="large-12 columns">
+              <div class="large-12 columns centered graph vm_memory_graph" style="height: 100px;"></div>
+            </div>
+          </div>
+          <div class="row graph_legend">
+            <div class="large-12 columns centered vm_memory_legend"></div>
+          </div>
+        </div>
+      </div>
+      <div class="row">
+        <div class="large-6 medium-6 columns">
+          <div class="row text-center">
+            <div class="large-12 columns">
+              <h3 class="subheader">
+                <small>{{tr "NET RX"}}</small>
+              </h3>
+            </div>
+          </div>
+          <div class="row">
+            <div class="large-12 columns">
+              <div class="large-12 columns centered graph vm_net_rx_graph" style="height: 100px;"></div>
+            </div>
+          </div>
+          <div class="row graph_legend">
+            <div class="large-12 columns centered vm_net_rx_legend"></div>
+          </div>
+        </div>
+        <div class="large-6 medium-6  columns">
+          <div class="row text-center">
+            <div class="large-12 columns">
+              <h3 class="subheader">
+                <small>{{tr "NET TX"}}</small>
+              </h3>
+            </div>
+          </div>
+          <div class="row">
+            <div class="large-12 columns">
+              <div class="large-12 columns centered graph vm_net_tx_graph" style="height: 100px;"></div>
+            </div>
+          </div>
+          <div class="row graph_legend">
+            <div class="large-12 columns centered vm_net_tx_legend"></div>
+          </div>
+        </div>
+      </div>
+      <div class="row">
+        <div class="large-6 medium-6  columns">
+          <div class="row text-center">
+            <div class="large-12 columns">
+              <h3 class="subheader">
+                <small>{{tr "NET DOWNLOAD SPEED"}}</small>
+              </h3>
+            </div>
+          </div>
+          <div class="row">
+            <div class="large-12 columns">
+              <div class="large-12 columns centered graph vm_net_rx_speed_graph" style="height: 100px;"></div>
+            </div>
+          </div>
+          <div class="row graph_legend">
+            <div class="large-12 columns centered vm_net_rx_speed_legend"></div>
+          </div>
+        </div>
+        <div class="large-6 medium-6 columns">
+          <div class="row text-center">
+            <div class="large-12 columns">
+              <h3 class="subheader">
+                <small>{{tr "NET UPLOAD SPEED"}}</small>
+              </h3>
+            </div>
+          </div>
+          <div class="row">
+            <div class="large-12 columns">
+              <div class="large-12 columns centered graph vm_net_tx_speed_graph" style="height: 100px;"></div>
+            </div>
+          </div>
+          <div class="row graph_legend">
+            <div class="large-12 columns centered vm_net_tx_speed_legend"></div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <br>
+  <br></div>
\ No newline at end of file
diff --git a/src/sunstone/public/app/tabs/provision-tab/vms/list.hbs b/src/sunstone/public/app/tabs/provision-tab/vms/list.hbs
new file mode 100644
index 0000000000..6bbe5f1ab8
--- /dev/null
+++ b/src/sunstone/public/app/tabs/provision-tab/vms/list.hbs
@@ -0,0 +1,50 @@
+<dl class="accordion accordion_list provision_list_vms" data-accordion>
+  <dd class="{{#if opts.active}}active{{/if}} accordion-navigation">
+    <a href="#provision_list_vm_accordion{{accordionId}}" class="provision_back right only-not-active">
+      <span class="button medium radius"> <i class="fa fa-fw fa-lg fa-th"/><i class="fa fa-fw fa-lg fa-chevron-left"/>
+      </span>
+    </a>
+    <h2 class="subheader">
+      {{opts.title}}
+      <span class="provision_info_vm_name only-not-active" style="margin-left: 20px; color: #777; font-size: 20px"></span>
+      <span href"#" class="right only-active button medium radius secondary provision_vms_list_refresh_button" 
+                {{#if opts.refresh}}style="display:none"{{/if}} data-tooltip title=" {{tr "Refresh"}}">
+        <i class="fa fa-fw fa-lg fa-refresh"/></span>
+      <span href"#" class="right only-not-active button medium radius secondary provision_refresh_info" 
+                {{#if opts.refresh}}style="display:none"{{/if}} data-tooltip title=" {{tr "Refresh"}}">
+        <i class="fa fa-fw fa-lg fa-refresh"/>
+      </span>
+      <span href"#" class="right only-active button medium radius secondary provision_vms_list_filter_button" 
+                {{#if opts.filter}}style="display:none"{{/if}} data-tooltip title=" {{tr "Filter by User"}}">
+        <i class="fa fa-fw fa-lg fa-filter"/>
+      </span>
+      <span class="right only-active provision_list_vms_filter" style="display: none"></span>
+      <span>
+        <input type="search" class="right only-active provision_list_vms_search provision-search-input right" placeholder="Search"/>
+        <span href"#" class="right only-active button medium radius success provision_create_vm_button" 
+                {{#if opts.create}}style="display:none"{{/if}}>
+          <i class="fa fa-fw fa-lg fa-plus-square"/>
+        </span>
+      </h2>
+      <div id="provision_list_vm_accordion{{accordionId}}" class="content {{#if opts.active}}active{{/if}}">
+        <div class="row">
+          <div class="large-12 large-centered columns">
+            <table class="provision_vms_table">
+              <thead class="hidden">
+                <tr>
+                  <th>{{tr "ID"}}</th>
+                  <th>{{tr "Name"}}</th>
+                  <th>{{tr "User ID"}}</th>
+                </tr>
+              </thead>
+              <tbody class="hidden"></tbody>
+            </table>
+            <br></div>
+        </div>
+      </div>
+    </dd>
+    <dd class="accordion-navigation">
+      <a class="provision_show_vm_accordion" href="#provision_show_vm_accordion{{accordionId}}"></a>
+      <div id="provision_show_vm_accordion{{accordionId}}" class="content">{{> tabs/provision-tab/vms/info}}</div>
+    </dd>
+  </dl>
\ No newline at end of file
diff --git a/src/sunstone/public/app/templates/helpers/isTabPanelEnabled.js b/src/sunstone/public/app/templates/helpers/isTabPanelEnabled.js
new file mode 100644
index 0000000000..0880cdd77e
--- /dev/null
+++ b/src/sunstone/public/app/templates/helpers/isTabPanelEnabled.js
@@ -0,0 +1,16 @@
+define(function(require) {
+  var Handlebars = require('hbs/handlebars');
+  var Config = require('sunstone-config');
+  
+  var isTabPanelEnabled = function(tabName, panel, options) {
+    if (Config.isTabPanelEnabled(tabName, panel)) {
+      return options.fn(this);
+    } else {
+      return options.inverse(this);
+    }
+  };
+
+  Handlebars.registerHelper('isTabPanelEnabled', isTabPanelEnabled);
+
+  return isTabPanelEnabled;
+})
\ No newline at end of file