From 976c433fe4528696c2f097a8f5b5fd15ccdb7c29 Mon Sep 17 00:00:00 2001 From: Matthias BUSSONNIER Date: Sun, 6 May 2012 18:17:32 +0200 Subject: [PATCH 1/5] Make pager resizable, and remember size... Resizing to small collapse the pager keeping the size to at least 20% height (trying to) resize a collapsed pager to more than 10% "expand" it. Pager can remember it size when toggling by clicking. --- .../html/notebook/static/js/notebook.js | 18 +++++-- .../frontend/html/notebook/static/js/pager.js | 47 ++++++++++++++----- 2 files changed, 48 insertions(+), 17 deletions(-) diff --git a/IPython/frontend/html/notebook/static/js/notebook.js b/IPython/frontend/html/notebook/static/js/notebook.js index 26088b5c6..facc157fa 100644 --- a/IPython/frontend/html/notebook/static/js/notebook.js +++ b/IPython/frontend/html/notebook/static/js/notebook.js @@ -231,19 +231,29 @@ var IPython = (function (IPython) { return true; }); - this.element.bind('collapse_pager', function () { + var collapse_time = function(time){ var app_height = $('div#main_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'); + that.element.animate({height : new_height + 'px'}, time); + } + + this.element.bind('collapse_pager', function (event,extrap) { + time = (extrap != undefined) ? ((extrap.duration != undefined ) ? extrap.duration : 'fast') : 'fast'; + collapse_time(time); }); - this.element.bind('expand_pager', function () { + var expand_time = function(time) { var app_height = $('div#main_app').height(); // content height var splitter_height = $('div#pager_splitter').outerHeight(true); var pager_height = $('div#pager').outerHeight(true); var new_height = app_height - pager_height - splitter_height; - that.element.animate({height : new_height + 'px'}, 'fast'); + that.element.animate({height : new_height + 'px'}, time); + } + + this.element.bind('expand_pager', function (event, extrap) { + time = (extrap != undefined) ? ((extrap.duration != undefined ) ? extrap.duration : 'fast') : 'fast'; + expand_time(time); }); $(window).bind('beforeunload', function () { diff --git a/IPython/frontend/html/notebook/static/js/pager.js b/IPython/frontend/html/notebook/static/js/pager.js index c3d4fcf6d..60cce2df9 100644 --- a/IPython/frontend/html/notebook/static/js/pager.js +++ b/IPython/frontend/html/notebook/static/js/pager.js @@ -15,30 +15,51 @@ var IPython = (function (IPython) { var Pager = function (pager_selector, pager_splitter_selector) { this.pager_element = $(pager_selector); - this.pager_splitter_element = $(pager_splitter_selector); - this.expanded = false; + var that = this; this.percentage_height = 0.40; + this.pager_splitter_element = $(pager_splitter_selector) + .draggable({ + containment: 'window', + axis:'y', + helper: null , + drag: function(event,ui){ + // recalculate the amount of space the pager should take + var pheight =(document.height-event.clientY-4); + var downprct = pheight/IPython.layout_manager.app_height(); + downprct = Math.min(0.9,downprct); + if(downprct < 0.1) { + that.percentage_height = 0.1; + that.collapse({'duration':0}); + } else if(downprct > 0.2) { + that.percentage_height = downprct; + that.expand({'duration':0}); + } + IPython.layout_manager.do_resize(); + } + }); + this.expanded = false; this.style(); this.bind_events(); }; - Pager.prototype.style = function () { this.pager_splitter_element.addClass('border-box-sizing ui-widget ui-state-default'); this.pager_element.addClass('border-box-sizing ui-widget'); - this.pager_splitter_element.attr('title', 'Click to Show/Hide pager area'); + this.pager_splitter_element.attr('title', 'Click to Show/Hide pager area, drag to Resize'); }; Pager.prototype.bind_events = function () { var that = this; - this.pager_element.bind('collapse_pager', function () { - that.pager_element.hide('fast'); + this.pager_element.bind('collapse_pager', function (event,extrap) { + time = (extrap != undefined) ? ((extrap.duration != undefined ) ? extrap.duration : 'fast') : 'fast'; + that.pager_element.hide(time); }); - this.pager_element.bind('expand_pager', function () { - that.pager_element.show('fast'); + this.pager_element.bind('expand_pager', function (event,extrap) { + time = (extrap != undefined) ? ((extrap.duration != undefined ) ? extrap.duration : 'fast') : 'fast'; + that.pager_element.show(time); }); this.pager_splitter_element.hover( @@ -57,18 +78,18 @@ var IPython = (function (IPython) { }; - Pager.prototype.collapse = function () { + Pager.prototype.collapse = function (extrap) { if (this.expanded === true) { - this.pager_element.add($('div#notebook')).trigger('collapse_pager'); this.expanded = false; + this.pager_element.add($('div#notebook')).trigger('collapse_pager',extrap); }; }; - Pager.prototype.expand = function () { + Pager.prototype.expand = function (extrap) { if (this.expanded !== true) { - this.pager_element.add($('div#notebook')).trigger('expand_pager'); this.expanded = true; + this.pager_element.add($('div#notebook')).trigger('expand_pager',extrap); }; }; @@ -91,7 +112,7 @@ var IPython = (function (IPython) { var toinsert = $("
").addClass("output_area output_stream"); toinsert.append($('
').html(utils.fixConsole(text)));
         this.pager_element.append(toinsert);
-    };   
+    };
 
 
     IPython.Pager = Pager;

From 785fbd9d9a82a5b953fd1d8edc22ee38f9522d53 Mon Sep 17 00:00:00 2001
From: Matthias BUSSONNIER 
Date: Mon, 7 May 2012 12:36:18 +0200
Subject: [PATCH 2/5] esc collapse pager

---
 IPython/frontend/html/notebook/static/js/notebook.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/IPython/frontend/html/notebook/static/js/notebook.js b/IPython/frontend/html/notebook/static/js/notebook.js
index facc157fa..d4b5f4f65 100644
--- a/IPython/frontend/html/notebook/static/js/notebook.js
+++ b/IPython/frontend/html/notebook/static/js/notebook.js
@@ -76,6 +76,7 @@ var IPython = (function (IPython) {
             } else if (event.which === 27) {
                 // Intercept escape at highest level to avoid closing 
                 // websocket connection with firefox
+                IPython.pager.collapse();
                 event.preventDefault();
             }
             if (event.which === 38 && !event.shiftKey) {

From 4cfd7e9df6c01c42ba5b0ae0d99395925f74830f Mon Sep 17 00:00:00 2001
From: Matthias BUSSONNIER 
Date: Tue, 8 May 2012 09:46:52 +0200
Subject: [PATCH 3/5] fix firefox compatibility

---
 IPython/frontend/html/notebook/static/js/pager.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/IPython/frontend/html/notebook/static/js/pager.js b/IPython/frontend/html/notebook/static/js/pager.js
index 60cce2df9..02afaa106 100644
--- a/IPython/frontend/html/notebook/static/js/pager.js
+++ b/IPython/frontend/html/notebook/static/js/pager.js
@@ -24,7 +24,7 @@ var IPython = (function (IPython) {
                         helper: null ,
                         drag: function(event,ui){
                             // recalculate the amount of space the pager should take
-                            var pheight =(document.height-event.clientY-4);
+                            var pheight =($(body).height()-event.clientY-4);
                             var downprct = pheight/IPython.layout_manager.app_height();
                                 downprct = Math.min(0.9,downprct);
                             if(downprct < 0.1) {

From 6acefdacb28214dba57944d57f09d168dfcc0512 Mon Sep 17 00:00:00 2001
From: Matthias BUSSONNIER 
Date: Wed, 9 May 2012 14:50:22 +0200
Subject: [PATCH 4/5] pep 8 and js

space after comma, space around equal, space before if and curly bracket
---
 .../frontend/html/notebook/static/js/pager.js  | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

diff --git a/IPython/frontend/html/notebook/static/js/pager.js b/IPython/frontend/html/notebook/static/js/pager.js
index 02afaa106..d57b4e638 100644
--- a/IPython/frontend/html/notebook/static/js/pager.js
+++ b/IPython/frontend/html/notebook/static/js/pager.js
@@ -22,15 +22,15 @@ var IPython = (function (IPython) {
                         containment: 'window',
                         axis:'y',
                         helper: null ,
-                        drag: function(event,ui){
+                        drag: function(event, ui) {
                             // recalculate the amount of space the pager should take
-                            var pheight =($(body).height()-event.clientY-4);
+                            var pheight = ($(body).height()-event.clientY-4);
                             var downprct = pheight/IPython.layout_manager.app_height();
-                                downprct = Math.min(0.9,downprct);
-                            if(downprct < 0.1) {
+                                downprct = Math.min(0.9, downprct);
+                            if (downprct < 0.1) {
                                 that.percentage_height = 0.1;
                                 that.collapse({'duration':0});
-                            } else if(downprct > 0.2) {
+                            } else if (downprct > 0.2) {
                                 that.percentage_height = downprct;
                                 that.expand({'duration':0});
                             }
@@ -52,12 +52,12 @@ var IPython = (function (IPython) {
     Pager.prototype.bind_events = function () {
         var that = this;
 
-        this.pager_element.bind('collapse_pager', function (event,extrap) {
+        this.pager_element.bind('collapse_pager', function (event, extrap) {
             time = (extrap != undefined) ? ((extrap.duration != undefined ) ? extrap.duration : 'fast') : 'fast';
             that.pager_element.hide(time);
         });
 
-        this.pager_element.bind('expand_pager', function (event,extrap) {
+        this.pager_element.bind('expand_pager', function (event, extrap) {
             time = (extrap != undefined) ? ((extrap.duration != undefined ) ? extrap.duration : 'fast') : 'fast';
             that.pager_element.show(time);
         });
@@ -81,7 +81,7 @@ var IPython = (function (IPython) {
     Pager.prototype.collapse = function (extrap) {
         if (this.expanded === true) {
             this.expanded = false;
-            this.pager_element.add($('div#notebook')).trigger('collapse_pager',extrap);
+            this.pager_element.add($('div#notebook')).trigger('collapse_pager', extrap);
         };
     };
 
@@ -89,7 +89,7 @@ var IPython = (function (IPython) {
     Pager.prototype.expand = function (extrap) {
         if (this.expanded !== true) {
             this.expanded = true;
-            this.pager_element.add($('div#notebook')).trigger('expand_pager',extrap);
+            this.pager_element.add($('div#notebook')).trigger('expand_pager', extrap);
         };
     };
 

From 1eeff0e5c8cb7b2445d1f9fb3033c32151e6cec4 Mon Sep 17 00:00:00 2001
From: Matthias BUSSONNIER 
Date: Wed, 23 May 2012 20:35:23 +0200
Subject: [PATCH 5/5] Revert "esc collapse pager"

This reverts commit c8e47d45dbd7c17293de0d9218e8f52247b79d1d.
---
 IPython/frontend/html/notebook/static/js/notebook.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/IPython/frontend/html/notebook/static/js/notebook.js b/IPython/frontend/html/notebook/static/js/notebook.js
index d4b5f4f65..facc157fa 100644
--- a/IPython/frontend/html/notebook/static/js/notebook.js
+++ b/IPython/frontend/html/notebook/static/js/notebook.js
@@ -76,7 +76,6 @@ var IPython = (function (IPython) {
             } else if (event.which === 27) {
                 // Intercept escape at highest level to avoid closing 
                 // websocket connection with firefox
-                IPython.pager.collapse();
                 event.preventDefault();
             }
             if (event.which === 38 && !event.shiftKey) {