Add select region icon to top bar

ui/css/cloudstack3.css

@@ -11071,6 +11071,48 @@ div.ui-dialog div.autoscaler div.field-group div.form-container form div.form-it
   height: 100%;
 }
 
+/*Regions*/
+.region-switcher {
+  background: url(../images/bg-gradients.png) 0px -1px;
+  border: 1px solid #5E5E5E;
+  /*+border-radius:4px;*/
+  -moz-border-radius: 4px;
+  -webkit-border-radius: 4px;
+  -khtml-border-radius: 4px;
+  border-radius: 4px;
+  border-top: 1px solid #717171;
+  border-bottom: 1px solid #FFFFFF;
+  width: 32px;
+  height: 28px;
+  float: left;
+  margin: 4px 13px 0 0;
+  cursor: pointer;
+  /*+box-shadow:inset 0px 1px 1px #000000;*/
+  -moz-box-shadow: inset 0px 1px 1px #000000;
+  -webkit-box-shadow: inset 0px 1px 1px #000000;
+  -o-box-shadow: inset 0px 1px 1px #000000;
+  box-shadow: inset 0px 1px 1px #000000;
+}
+
+.region-switcher .icon {
+  display: block;
+  width: 100%;
+  height: 100%;
+  background: url(../images/sprites.png) -15px -1313px;
+}
+
+.region-switcher:hover {
+  /*+box-shadow:inset 0px 1px 5px #000000;*/
+  -moz-box-shadow: inset 0px 1px 5px #000000;
+  -webkit-box-shadow: inset 0px 1px 5px #000000;
+  -o-box-shadow: inset 0px 1px 5px #000000;
+  box-shadow: inset 0px 1px 5px #000000;
+}
+
+.region-switcher:hover .icon {
+  background-position: -70px -1311px;
+}
+
 /*Action icons*/
 .action.edit .icon {
   background-position: 1px -1px;

ui/scripts/regions.js

@@ -68,6 +68,26 @@
       },
       detailView: {
         name: 'Region details',
+        actions: {
+          remove: {
+            label: 'label.remove.region',
+            messages: {
+              notification: function() { return 'label.remove.region'; },
+              confirm: function() { return 'message.remove.region'; }
+            },
+            action: function(args) {
+              var region = args.context.regions[0];
+
+              $.ajax({ 
+                url: createURL('removeRegion'),
+                data: { id: region.id },
+                success: function(json) {
+                  args.response.success();
+                }
+              });
+            }
+          }
+        },
         tabs: {
           details: {
             title: 'label.details',

ui/scripts/ui/core.js

@@ -127,6 +127,13 @@
             .append($('<span>').html(_l('label.notifications')))
             .notifications();
 
+      // Region switcher
+      var $regionSwitcher = $('<div>').addClass('region-switcher')
+        .attr('title', 'Select region')
+        .append(
+          $('<span>').addClass('icon').html('&nbsp;')
+        );
+
       // Project switcher
       var $viewSwitcher = $('<div>').addClass('button view-switcher')
             .append(
@@ -220,6 +227,7 @@
         $('<div>').addClass('controls')
           .append($notificationArea)
           .append($viewSwitcher)
+          .append($regionSwitcher)
           .append($projectSelect)
           .append($userInfo)
       ];