+ Now using the "front" class when zooming down (was just when zooming up), hopefully to speed things up
authorIan Gilman <ian@iangilman.com>
Fri, 11 Jun 2010 16:35:47 -0700
changeset 49962 eca0ad5050e930a8630ba3cf4b8806cf4d18735e
parent 49961 36708bbc5a52808fbbc9f62b66551a30301b1b77
child 49963 b10c2ffafb1ac8fc1a5c5a0391b8cc87345846dd
push id15039
push useredward.lee@engineering.uiuc.edu
push dateThu, 12 Aug 2010 19:47:36 +0000
treeherdermozilla-central@5da28c582cc7 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
+ Now using the "front" class when zooming down (was just when zooming up), hopefully to speed things up + Modified the "front" class to remove unnecessary bits from the tab, and to turn on crisp edges, hopefully to speed things up
browser/base/content/tabcandy/app/ui.js
browser/themes/pinstripe/browser/tabcandy/tabcandy.css
--- a/browser/base/content/tabcandy/app/ui.js
+++ b/browser/base/content/tabcandy/app/ui.js
@@ -312,20 +312,17 @@ window.Page = {
             left: data.pos.left,
             top: data.pos.top, 
             width: data.w,
             height: data.h
           }, {
             duration: 400,
             easing: 'easeInQuad',
             complete: function() { // note that this will happen on the DOM thread
-              $tab.css({
-                zIndex: data.z,
-                '-moz-transform': data.transform
-              });
+              $tab.removeClass('front');
               
               self.setActiveTab(item);
               var activeGroup = Groups.getActiveGroup();
               if( activeGroup )
                 activeGroup.reorderBasedOnTabOrder(item);        
       
               window.Groups.setActiveGroup(null);
               TabMirror.resumePainting();        
@@ -345,47 +342,45 @@ window.Page = {
           
           // ___ prepare for when we return to TabCandy
           var oldItem = TabItems.getItemByTabElement(currentTab.mirror.el);
           if(item != oldItem) {
             var data;
             if(oldItem) {
               var $oldTab = iQ(oldItem.container);
               data = $oldTab.data('zoomSave');
-              $oldTab.css({
+              $oldTab
+                .removeClass('front')
+                .css({
                   left: data.pos.left,
                   top: data.pos.top, 
                   width: data.w,
-                  height: data.h,
-                  zIndex: data.z,
-                  '-moz-transform': data.transform
-              });
+                  height: data.h
+                });
             }                
   
             if(item) {
               var $tab = iQ(item.container);
 
               data = {
-                transform: $tab.css('-moz-transform'),
-                z: $tab.css('zIndex'),
                 pos: $tab.position(),
                 w: $tab.width(),
                 h: $tab.height()
               };
               
               $tab.data('zoomSave', data);
 
-              $tab.css({
+              $tab
+                .addClass('front')
+                .css({
                   left: 0,
                   top: 0, 
                   width: window.innerWidth,
-                  height: data.h * (window.innerWidth / data.w),
-                  zIndex: 999999,
-                  '-moz-transform': 'rotate(0deg)'
-               });
+                  height: data.h * (window.innerWidth / data.w)
+                });
             }                
           }
         }, 1);
       }
       
       UI.currentTab = focusTab;
     });
   },
--- a/browser/themes/pinstripe/browser/tabcandy/tabcandy.css
+++ b/browser/themes/pinstripe/browser/tabcandy/tabcandy.css
@@ -132,16 +132,24 @@ body {
   font-size: 11px;
 }
 .stack-trayed .thumb{ -moz-box-shadow: none !important;}
 
 .focus{
   -moz-box-shadow:  rgba(54,79,225,1) 0px 0px 5px -1px !important;
 }
 
+.front .tab-title, .front .close, .front .favicon, .front .expander, .front .thumbShadow {
+  display: none;
+}
+
+.front .focus {
+  -moz-box-shadow: none !important;
+}
+
 /* Tab Group
 ----------------------------------*/
 
 .tabInGroup {
   border: none;
 	-moz-box-shadow: 
 		inset rgba(255, 255, 255, 0) 0 2px 0px,
 		inset rgba(255, 255, 255, 0) 0 -2px 0px,
@@ -343,16 +351,18 @@ input.defaultName:hover{
 
 /* Utils
 ----------------------------------*/
 
 .front{
   z-index: 999999 !important;
   -moz-border-radius: 0 !important;
 	-moz-box-shadow: none !important;
+	-moz-transform: none;
+  image-rendering: -moz-crisp-edges;
 }
 
 /* Feedback
 ----------------------------------*/
 
 .bottomButton{
   position: absolute;
   bottom: 0px;