More accuract height calculations for the pager collapse/expand.

IPython/frontend/html/notebook/static/js/notebook.js

@@ -83,18 +83,17 @@ var IPython = (function (IPython) {
         });
 
         this.element.bind('collapse_pager', function () {
-            var that_height = that.element.outerHeight(true);
-            var pager_height = $('div#pager').outerHeight(true);
-            var new_height = that_height + pager_height; 
-            console.log('collapse', that_height, pager_height, new_height);
+            var app_height = $('div#notebook_app').height(); // content height
+            var splitter_height = $('div#pager_splitter').outerHeight(true);
+            var new_height = app_height - splitter_height;
             that.element.animate({height : new_height + 'px'}, 'fast');
         });
 
         this.element.bind('expand_pager', function () {
-            var that_height = that.element.outerHeight(true);
+            var app_height = $('div#notebook_app').height(); // content height
+            var splitter_height = $('div#pager_splitter').outerHeight(true);
             var pager_height = $('div#pager').outerHeight(true);
-            var new_height = that_height - pager_height; 
-            console.log('expand', that_height, pager_height, new_height);
+            var new_height = app_height - pager_height - splitter_height; 
             that.element.animate({height : new_height + 'px'}, 'fast');
         });
     };

IPython/frontend/html/notebook/static/js/notebook_main.js

@@ -42,14 +42,18 @@ $(document).ready(function () {
         var w = win.width();
         var h = win.height();
         var header_height = $('div#header').outerHeight(true);
-        var app_height = h - header_height - 2;
+        var app_height = h - header_height - 2;  // content height
         var pager_height = $('div#pager').outerHeight(true);
         var pager_splitter_height = $('div#pager_splitter').outerHeight(true);
-        $('div#notebook_app').height(app_height + 2);
+        $('div#notebook_app').height(app_height + 2);  // content+padding+border height
         $('div#left_panel').height(app_height);
         $('div#left_panel_splitter').height(app_height);
         $('div#notebook_panel').height(app_height);
-        $('div#notebook').height(app_height-pager_height-pager_splitter_height);
+        if (IPython.pager.expanded) {
+            $('div#notebook').height(app_height-pager_height-pager_splitter_height);
+        } else {
+            $('div#notebook').height(app_height-pager_splitter_height);
+        }
         console.log('resize: ', app_height);
     };