diff --git a/IPython/frontend/html/notebook/static/css/notebook.css b/IPython/frontend/html/notebook/static/css/notebook.css
index d5ddb6d..27f72ce 100644
--- a/IPython/frontend/html/notebook/static/css/notebook.css
+++ b/IPython/frontend/html/notebook/static/css/notebook.css
@@ -122,6 +122,10 @@ div#pager_splitter {
height: 8px;
}
+#pager_container {
+ position : relative;
+}
+
div#pager {
padding: 15px;
overflow: auto;
diff --git a/IPython/frontend/html/notebook/static/js/pager.js b/IPython/frontend/html/notebook/static/js/pager.js
index 4853a97..f7ae401 100644
--- a/IPython/frontend/html/notebook/static/js/pager.js
+++ b/IPython/frontend/html/notebook/static/js/pager.js
@@ -15,6 +15,7 @@ var IPython = (function (IPython) {
var Pager = function (pager_selector, pager_splitter_selector) {
this.pager_element = $(pager_selector);
+ this.pager_button_area = $('#pager_button_area');
var that = this;
this.percentage_height = 0.40;
this.pager_splitter_element = $(pager_splitter_selector)
@@ -39,9 +40,24 @@ var IPython = (function (IPython) {
});
this.expanded = false;
this.style();
+ this.create_button_area();
this.bind_events();
};
+ Pager.prototype.create_button_area = function(){
+ var that = this;
+ this.pager_button_area.append(
+ $('').attr('role', "button")
+ .attr('title',"open the pager in an external window")
+ .addClass('ui-button')
+ .click(function(){that.detach()})
+ .attr('style','position: absolute; right: 10px;')
+ .append(
+ $('').addClass("ui-icon ui-icon-extlink")
+ )
+ )
+ };
+
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');
@@ -114,6 +130,26 @@ var IPython = (function (IPython) {
this.pager_element.empty();
};
+ Pager.prototype.detach = function(){
+ var w = window.open("","_blank")
+ $(w.document.head)
+ .append(
+ $('')
+ .attr('rel',"stylesheet")
+ .attr('href',"/static/css/notebook.css")
+ .attr('type',"text/css")
+ )
+ .append(
+ $('').text("IPython Pager")
+ );
+ var pager_body = $(w.document.body)
+ pager_body.attr('style','overflow:scroll');
+
+ pager_body.append(this.pager_element.children())
+ w.document.close();
+ this.collapse();
+
+ }
Pager.prototype.append_text = function (text) {
var toinsert = $("").addClass("output_area output_stream");
diff --git a/IPython/frontend/html/notebook/templates/notebook.html b/IPython/frontend/html/notebook/templates/notebook.html
index 69d99b7..b2bbbbf 100644
--- a/IPython/frontend/html/notebook/templates/notebook.html
+++ b/IPython/frontend/html/notebook/templates/notebook.html
@@ -200,7 +200,11 @@ data-notebook-id={{notebook_id}}