incubator-cloudstack-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From alena1...@apache.org
Subject [22/44] git commit: cloudBrowser / list view UI: Show subsection in breadcrumb
Date Thu, 02 Aug 2012 02:08:32 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/ef9dd421
Tree: http://git-wip-us.apache.org/repos/asf/incubator-cloudstack/tree/ef9dd421
Diff: http://git-wip-us.apache.org/repos/asf/incubator-cloudstack/diff/ef9dd421

Branch: refs/heads/vpc
Commit: ef9dd4210e1772f0b8e7d2aac2cd16803810529a
Parents: 8c8c10f
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 14:36:15 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/ef9dd421/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/ef9dd421/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/ef9dd421/ui/scripts/ui/widgets/listView.js
----------------------------------------------------------------------
diff --git a/ui/scripts/ui/widgets/listView.js b/ui/scripts/ui/widgets/listView.js
index 087f540..2136d5c 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