incubator-cloudstack-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From bfede...@apache.org
Subject [2/3] git commit: cloudBrowser / list view UI: Show subsection in breadcrumb
Date Wed, 01 Aug 2012 22:58:00 GMT
cloudBrowser / list view UI: Show subsection in breadcrumb

If in a section with multiple subsections, show active subsection in
the breadcrumb.

For example, if in storage->snapshots, display 'Storage - Snapshots'
based on the 'title' attribute for the main section and subsetion.

-- Note: this disables the 'fixSize' functionality which resizes long
   breadcrumb trails, due to incompatibility with this new feature. It
   is going to be reimplemented anyway, as it is fairly glitchy in its
   current incarnation.


Project: http://git-wip-us.apache.org/repos/asf/incubator-cloudstack/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-cloudstack/commit/640dcdec
Tree: http://git-wip-us.apache.org/repos/asf/incubator-cloudstack/tree/640dcdec
Diff: http://git-wip-us.apache.org/repos/asf/incubator-cloudstack/diff/640dcdec

Branch: refs/heads/vpc
Commit: 640dcdec1f01791c2217ceb1dd641434d398dd3e
Parents: 96ac18d
Author: Brian Federle <brian.federle@citrix.com>
Authored: Wed Aug 1 13:24:19 2012 -0700
Committer: Brian Federle <brian.federle@citrix.com>
Committed: Wed Aug 1 15:57:24 2012 -0700

----------------------------------------------------------------------
 ui/scripts/ui/core.js                 |    9 ++++--
 ui/scripts/ui/widgets/cloudBrowser.js |   41 +---------------------------
 ui/scripts/ui/widgets/listView.js     |   12 ++++++++
 3 files changed, 19 insertions(+), 43 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-cloudstack/blob/640dcdec/ui/scripts/ui/core.js
----------------------------------------------------------------------
diff --git a/ui/scripts/ui/core.js b/ui/scripts/ui/core.js
index 0c6b4e7..c38ed3f 100644
--- a/ui/scripts/ui/core.js
+++ b/ui/scripts/ui/core.js
@@ -73,17 +73,20 @@
       return $(this).hasClass(sectionID);
     });
     var data = args.sections[sectionID];
+    
     data.$browser = $browser;
-
     $navItem.siblings().removeClass('active');
     $navItem.addClass('active');
 
     // Reset browser panels
     $browser.cloudBrowser('removeAllPanels');
     $browser.cloudBrowser('addPanel', {
-      title: _l(data.title),
+      title: '<span class="section">' + _l(data.title) + '</span>' + '<span
class="subsection"></span>',
       data: '',
-      complete: function($panel) {
+      complete: function($panel, $breadcrumb) {
+        $breadcrumb.attr('title', _l(data.title));
+        data.$breadcrumb = $breadcrumb;
+        
         // Hide breadcrumb if this is the home section
         if (args.home === sectionID) {
           $('#breadcrumbs').find('li:first, div.end:last').hide();

http://git-wip-us.apache.org/repos/asf/incubator-cloudstack/blob/640dcdec/ui/scripts/ui/widgets/cloudBrowser.js
----------------------------------------------------------------------
diff --git a/ui/scripts/ui/widgets/cloudBrowser.js b/ui/scripts/ui/widgets/cloudBrowser.js
index 2c518cb..2cd0169 100644
--- a/ui/scripts/ui/widgets/cloudBrowser.js
+++ b/ui/scripts/ui/widgets/cloudBrowser.js
@@ -21,41 +21,6 @@
    * Breadcrumb-related functions
    */
   var _breadcrumb = cloudStack.ui.widgets.browser.breadcrumb = {
-    fixSize: function($breadcrumbContainer) {
-      var width = 0;
-      var containerWidth = $breadcrumbContainer.width();
-      var $elems = $breadcrumbContainer.find('ul li, div');
-
-      $elems.each(function() {
-        width += $(this).width();
-      });
-
-      if (width > containerWidth) {
-        $elems.filter('li').each(function() {
-          var targetWidth = $(this).width() - (
-            (width - containerWidth) / $elems.filter('li').size()
-          ) - 10;
-
-          $(this).width(targetWidth);
-
-          // Concatenate title
-          var $text = $(this).find('span');
-          var text = $(this).attr('title');
-
-          $text.html(
-            text
-              .substring(0, text.length - targetWidth / 15)
-              .concat('...')
-          );
-        });
-      } else {
-        $elems.css({ width: '' });
-        $elems.find('span').each(function() {
-          $(this).html($(this).closest('li').attr('title'));
-        });
-      }
-    },
-
     /**
      * Generate new breadcrumb
      */
@@ -244,7 +209,6 @@
           .removeClass('maximized')
           .addClass('reduced')
       ).removeClass('active maximized');
-      _breadcrumb.fixSize($('#breadcrumbs'));
 
       $toRemove.animate(
         _panel.initialState($container),
@@ -330,8 +294,6 @@
         .addClass('active')
         .appendTo('#breadcrumbs ul');
 
-      _breadcrumb.fixSize($('#breadcrumbs'));
-
       // Reduced appearance for previous panels
       $panel.siblings().filter(function() {
         return $(this).index() < $panel.index();
@@ -352,7 +314,7 @@
         $panel.css(
           { left: targetPosition }
         );
-        if (args.complete) args.complete($panel);
+        if (args.complete) args.complete($panel, _breadcrumb.filter($panel));
       } else {
         // Animate slide-in
         $panel.animate({ left: targetPosition }, {
@@ -380,7 +342,6 @@
       this.element.find('div.panel').remove();
       $('#breadcrumbs').find('ul li').remove();
       $('#breadcrumbs').find('ul div.end').remove();
-      _breadcrumb.fixSize($('#breadcrumbs'));
     }
   });
 

http://git-wip-us.apache.org/repos/asf/incubator-cloudstack/blob/640dcdec/ui/scripts/ui/widgets/listView.js
----------------------------------------------------------------------
diff --git a/ui/scripts/ui/widgets/listView.js b/ui/scripts/ui/widgets/listView.js
index 9c30b49..be2f106 100644
--- a/ui/scripts/ui/widgets/listView.js
+++ b/ui/scripts/ui/widgets/listView.js
@@ -1117,6 +1117,18 @@
 
     if (section) {
       listViewData = args.sections[section].listView;
+
+      var sectionTitle = _l(args.title);
+      var subsectionTitle = _l(args.sections[section].title);
+
+      // Show subsection in breadcrumb
+      if ((sectionTitle && subsectionTitle) && (sectionTitle != subsectionTitle))
{
+        args.$breadcrumb.find('span.subsection').html(' - ' + subsectionTitle);
+        args.$breadcrumb.attr('title', sectionTitle + ' - ' + subsectionTitle);
+      } else {
+        args.$breadcrumb.find('span.subsection').html('');
+        args.$breadcrumb.attr('title', sectionTitle);
+      }
     }
 
     // Create table and other elems


Mime
View raw message