Zone type switcher: Style, add functionality - Add top label to zone switcher, add more styling
- Implement zone switching functionality, which on change sets cloudStack.context.zoneType to the relevant filter option, or null for 'All' zone types Project: http://git-wip-us.apache.org/repos/asf/cloudstack/repo Commit: http://git-wip-us.apache.org/repos/asf/cloudstack/commit/fa8b8358 Tree: http://git-wip-us.apache.org/repos/asf/cloudstack/tree/fa8b8358 Diff: http://git-wip-us.apache.org/repos/asf/cloudstack/diff/fa8b8358 Branch: refs/heads/ui-mixed-zone-management Commit: fa8b83581bd39230f98806ed43f4103bb5454469 Parents: 5014073 Author: Brian Federle <brian.fede...@citrix.com> Authored: Wed Apr 10 14:43:42 2013 -0700 Committer: Brian Federle <brian.fede...@citrix.com> Committed: Wed Apr 10 14:43:42 2013 -0700 ---------------------------------------------------------------------- ui/css/cloudstack3.css | 30 ++++++++++++++++++++++++++++++ ui/index.jsp | 2 +- ui/scripts/ui-custom/zoneFilter.js | 16 ++++++++++++---- 3 files changed, 43 insertions(+), 5 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/cloudstack/blob/fa8b8358/ui/css/cloudstack3.css ---------------------------------------------------------------------- diff --git a/ui/css/cloudstack3.css b/ui/css/cloudstack3.css index 61e5ab4..3211130 100644 --- a/ui/css/cloudstack3.css +++ b/ui/css/cloudstack3.css @@ -2277,6 +2277,34 @@ div.detail-group.actions td { top: 13px; } +/** Zone filter (mixed zone management)*/ +#header .zone-filter { + float: left; + width: 111px; + margin: 9px 20px 0 2px; +} + +#header .zone-filter label { + position: absolute; + top: -3px; + color: #FFFFFF; + font-size: 11px; +} + +#header .zone-filter select { + width: 100%; + font-size: 12px; + border: 1px solid #000000; + border-bottom: #FFFFFF; + /*+border-radius:4px;*/ + -moz-border-radius: 4px; + -webkit-border-radius: 4px; + -khtml-border-radius: 4px; + border-radius: 4px; + background: #ECECEC; + margin-top: 2px; +} + /*Navigation*/ #navigation, #browser { @@ -8930,6 +8958,8 @@ div.ui-dialog div.multi-edit-add-list div.view div.data-table table.body tbody t -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; + background: #ECECEC; + margin-top: 2px; } /*** Select project*/ http://git-wip-us.apache.org/repos/asf/cloudstack/blob/fa8b8358/ui/index.jsp ---------------------------------------------------------------------- diff --git a/ui/index.jsp b/ui/index.jsp index 5b3ef3a..6b7d431 100644 --- a/ui/index.jsp +++ b/ui/index.jsp @@ -1659,7 +1659,6 @@ under the License. <script type="text/javascript" src="scripts/events.js?t=<%=now%>"></script> <script type="text/javascript" src="scripts/regions.js?t=<%=now%>"></script> <script type="text/javascript" src="scripts/ui-custom/regions.js?t=<%=now%>"></script> - <script type="text/javascript" src="scripts/ui-custom/zoneFilter.js?t=<%=now%>"></script> <script type="text/javascript" src="scripts/ui-custom/ipRules.js?t=<%=now%>"></script> <script type="text/javascript" src="scripts/ui-custom/enableStaticNAT.js?t=<%=now%>"></script> <script type="text/javascript" src="scripts/ui-custom/securityRules.js?t=<%=now%>"></script> @@ -1681,6 +1680,7 @@ under the License. <script type="text/javascript" src="scripts/docs.js?t=<%=now%>"></script> <script type="text/javascript" src="scripts/vm_snapshots.js?t=<%=now%>"></script> <script type="text/javascript" src="scripts/ui-custom/projectSelect.js?t=<%=now%>"></script> + <script type="text/javascript" src="scripts/ui-custom/zoneFilter.js?t=<%=now%>"></script> <!-- Plugins --> <script type="text/javascript" src="scripts/ui-custom/plugins.js?t=<%=now%>"></script> http://git-wip-us.apache.org/repos/asf/cloudstack/blob/fa8b8358/ui/scripts/ui-custom/zoneFilter.js ---------------------------------------------------------------------- diff --git a/ui/scripts/ui-custom/zoneFilter.js b/ui/scripts/ui-custom/zoneFilter.js index d298e4f..9e6a493 100644 --- a/ui/scripts/ui-custom/zoneFilter.js +++ b/ui/scripts/ui-custom/zoneFilter.js @@ -20,12 +20,20 @@ var $header = $('#header .controls'); var $zoneFilter = $('<div>').addClass('zone-filter'); var $zoneTypeSelect = $('<select>').append( - $('<option>').attr('value', 'basic').html(_l('Basic')), - $('<option>').attr('value', 'advanced').html(_l('Advanced')) + $('<option>').attr('value', '').html(_l('All zones')), + $('<option>').attr('value', 'Basic').html(_l('Basic')), + $('<option>').attr('value', 'Advanced').html(_l('Advanced')) ); + var $label = $('<label>').html('Zone type:'); - $zoneTypeSelect.appendTo($zoneFilter); - $zoneFilter.insertAfter($header.find('#user')); + $zoneFilter.append($label, $zoneTypeSelect); + $zoneFilter.insertAfter($header.find('.project-switcher')); + $zoneTypeSelect.change(function() { + cloudStack.context.zoneType = $zoneTypeSelect.val(); + + // Go to default/start page (dashboard) + $('#breadcrumbs .home').click(); + }); }); }(jQuery, cloudStack));
