##// END OF EJS Templates
Collapse -> Close in button description as suggested by @fperez
Erik Tollerud -
Show More
@@ -1,174 +1,174 b''
1 //----------------------------------------------------------------------------
1 //----------------------------------------------------------------------------
2 // Copyright (C) 2008-2011 The IPython Development Team
2 // Copyright (C) 2008-2011 The IPython Development Team
3 //
3 //
4 // Distributed under the terms of the BSD License. The full license is in
4 // Distributed under the terms of the BSD License. The full license is in
5 // the file COPYING, distributed as part of this software.
5 // the file COPYING, distributed as part of this software.
6 //----------------------------------------------------------------------------
6 //----------------------------------------------------------------------------
7
7
8 //============================================================================
8 //============================================================================
9 // Pager
9 // Pager
10 //============================================================================
10 //============================================================================
11
11
12 var IPython = (function (IPython) {
12 var IPython = (function (IPython) {
13
13
14 var utils = IPython.utils;
14 var utils = IPython.utils;
15
15
16 var Pager = function (pager_selector, pager_splitter_selector) {
16 var Pager = function (pager_selector, pager_splitter_selector) {
17 this.pager_element = $(pager_selector);
17 this.pager_element = $(pager_selector);
18 this.pager_button_area = $('#pager_button_area');
18 this.pager_button_area = $('#pager_button_area');
19 var that = this;
19 var that = this;
20 this.percentage_height = 0.40;
20 this.percentage_height = 0.40;
21 this.pager_splitter_element = $(pager_splitter_selector)
21 this.pager_splitter_element = $(pager_splitter_selector)
22 .draggable({
22 .draggable({
23 containment: 'window',
23 containment: 'window',
24 axis:'y',
24 axis:'y',
25 helper: null ,
25 helper: null ,
26 drag: function(event, ui) {
26 drag: function(event, ui) {
27 // recalculate the amount of space the pager should take
27 // recalculate the amount of space the pager should take
28 var pheight = ($(body).height()-event.clientY-4);
28 var pheight = ($(body).height()-event.clientY-4);
29 var downprct = pheight/IPython.layout_manager.app_height();
29 var downprct = pheight/IPython.layout_manager.app_height();
30 downprct = Math.min(0.9, downprct);
30 downprct = Math.min(0.9, downprct);
31 if (downprct < 0.1) {
31 if (downprct < 0.1) {
32 that.percentage_height = 0.1;
32 that.percentage_height = 0.1;
33 that.collapse({'duration':0});
33 that.collapse({'duration':0});
34 } else if (downprct > 0.2) {
34 } else if (downprct > 0.2) {
35 that.percentage_height = downprct;
35 that.percentage_height = downprct;
36 that.expand({'duration':0});
36 that.expand({'duration':0});
37 }
37 }
38 IPython.layout_manager.do_resize();
38 IPython.layout_manager.do_resize();
39 }
39 }
40 });
40 });
41 this.expanded = false;
41 this.expanded = false;
42 this.style();
42 this.style();
43 this.create_button_area();
43 this.create_button_area();
44 this.bind_events();
44 this.bind_events();
45 };
45 };
46
46
47 Pager.prototype.create_button_area = function(){
47 Pager.prototype.create_button_area = function(){
48 var that = this;
48 var that = this;
49 this.pager_button_area.append(
49 this.pager_button_area.append(
50 $('<a>').attr('role', "button")
50 $('<a>').attr('role', "button")
51 .attr('title',"Open the pager in an external window")
51 .attr('title',"Open the pager in an external window")
52 .addClass('ui-button')
52 .addClass('ui-button')
53 .click(function(){that.detach()})
53 .click(function(){that.detach()})
54 .attr('style','position: absolute; right: 20px;')
54 .attr('style','position: absolute; right: 20px;')
55 .append(
55 .append(
56 $('<span>').addClass("ui-icon ui-icon-extlink")
56 $('<span>').addClass("ui-icon ui-icon-extlink")
57 )
57 )
58 )
58 )
59 this.pager_button_area.append(
59 this.pager_button_area.append(
60 $('<a>').attr('role', "button")
60 $('<a>').attr('role', "button")
61 .attr('title',"Collapse the pager")
61 .attr('title',"Close the pager")
62 .addClass('ui-button')
62 .addClass('ui-button')
63 .click(function(){that.collapse()})
63 .click(function(){that.collapse()})
64 .attr('style','position: absolute; right: 5px;')
64 .attr('style','position: absolute; right: 5px;')
65 .append(
65 .append(
66 $('<span>').addClass("ui-icon ui-icon-close")
66 $('<span>').addClass("ui-icon ui-icon-close")
67 )
67 )
68 )
68 )
69 };
69 };
70
70
71 Pager.prototype.style = function () {
71 Pager.prototype.style = function () {
72 this.pager_splitter_element.addClass('border-box-sizing ui-widget ui-state-default');
72 this.pager_splitter_element.addClass('border-box-sizing ui-widget ui-state-default');
73 this.pager_element.addClass('border-box-sizing ui-widget');
73 this.pager_element.addClass('border-box-sizing ui-widget');
74 this.pager_splitter_element.attr('title', 'Click to Show/Hide pager area, drag to Resize');
74 this.pager_splitter_element.attr('title', 'Click to Show/Hide pager area, drag to Resize');
75 };
75 };
76
76
77
77
78 Pager.prototype.bind_events = function () {
78 Pager.prototype.bind_events = function () {
79 var that = this;
79 var that = this;
80
80
81 this.pager_element.bind('collapse_pager', function (event, extrap) {
81 this.pager_element.bind('collapse_pager', function (event, extrap) {
82 var time = (extrap != undefined) ? ((extrap.duration != undefined ) ? extrap.duration : 'fast') : 'fast';
82 var time = (extrap != undefined) ? ((extrap.duration != undefined ) ? extrap.duration : 'fast') : 'fast';
83 that.pager_element.hide(time);
83 that.pager_element.hide(time);
84 });
84 });
85
85
86 this.pager_element.bind('expand_pager', function (event, extrap) {
86 this.pager_element.bind('expand_pager', function (event, extrap) {
87 var time = (extrap != undefined) ? ((extrap.duration != undefined ) ? extrap.duration : 'fast') : 'fast';
87 var time = (extrap != undefined) ? ((extrap.duration != undefined ) ? extrap.duration : 'fast') : 'fast';
88 that.pager_element.show(time);
88 that.pager_element.show(time);
89 });
89 });
90
90
91 this.pager_splitter_element.hover(
91 this.pager_splitter_element.hover(
92 function () {
92 function () {
93 that.pager_splitter_element.addClass('ui-state-hover');
93 that.pager_splitter_element.addClass('ui-state-hover');
94 },
94 },
95 function () {
95 function () {
96 that.pager_splitter_element.removeClass('ui-state-hover');
96 that.pager_splitter_element.removeClass('ui-state-hover');
97 }
97 }
98 );
98 );
99
99
100 this.pager_splitter_element.click(function () {
100 this.pager_splitter_element.click(function () {
101 that.toggle();
101 that.toggle();
102 });
102 });
103
103
104 $([IPython.events]).on('open_with_text.Pager', function (event, data) {
104 $([IPython.events]).on('open_with_text.Pager', function (event, data) {
105 if (data.text.trim() !== '') {
105 if (data.text.trim() !== '') {
106 that.clear();
106 that.clear();
107 that.expand();
107 that.expand();
108 that.append_text(data.text);
108 that.append_text(data.text);
109 };
109 };
110 });
110 });
111 };
111 };
112
112
113
113
114 Pager.prototype.collapse = function (extrap) {
114 Pager.prototype.collapse = function (extrap) {
115 if (this.expanded === true) {
115 if (this.expanded === true) {
116 this.expanded = false;
116 this.expanded = false;
117 this.pager_element.add($('div#notebook')).trigger('collapse_pager', extrap);
117 this.pager_element.add($('div#notebook')).trigger('collapse_pager', extrap);
118 };
118 };
119 };
119 };
120
120
121
121
122 Pager.prototype.expand = function (extrap) {
122 Pager.prototype.expand = function (extrap) {
123 if (this.expanded !== true) {
123 if (this.expanded !== true) {
124 this.expanded = true;
124 this.expanded = true;
125 this.pager_element.add($('div#notebook')).trigger('expand_pager', extrap);
125 this.pager_element.add($('div#notebook')).trigger('expand_pager', extrap);
126 };
126 };
127 };
127 };
128
128
129
129
130 Pager.prototype.toggle = function () {
130 Pager.prototype.toggle = function () {
131 if (this.expanded === true) {
131 if (this.expanded === true) {
132 this.collapse();
132 this.collapse();
133 } else {
133 } else {
134 this.expand();
134 this.expand();
135 };
135 };
136 };
136 };
137
137
138
138
139 Pager.prototype.clear = function (text) {
139 Pager.prototype.clear = function (text) {
140 this.pager_element.empty();
140 this.pager_element.empty();
141 };
141 };
142
142
143 Pager.prototype.detach = function(){
143 Pager.prototype.detach = function(){
144 var w = window.open("","_blank")
144 var w = window.open("","_blank")
145 $(w.document.head)
145 $(w.document.head)
146 .append(
146 .append(
147 $('<link>')
147 $('<link>')
148 .attr('rel',"stylesheet")
148 .attr('rel',"stylesheet")
149 .attr('href',"/static/css/notebook.css")
149 .attr('href',"/static/css/notebook.css")
150 .attr('type',"text/css")
150 .attr('type',"text/css")
151 )
151 )
152 .append(
152 .append(
153 $('<title>').text("IPython Pager")
153 $('<title>').text("IPython Pager")
154 );
154 );
155 var pager_body = $(w.document.body)
155 var pager_body = $(w.document.body)
156 pager_body.attr('style','overflow:scroll');
156 pager_body.attr('style','overflow:scroll');
157
157
158 pager_body.append(this.pager_element.children())
158 pager_body.append(this.pager_element.children())
159 w.document.close();
159 w.document.close();
160 this.collapse();
160 this.collapse();
161
161
162 }
162 }
163
163
164 Pager.prototype.append_text = function (text) {
164 Pager.prototype.append_text = function (text) {
165 this.pager_element.append($('<pre/>').html(utils.fixCarriageReturn(utils.fixConsole(text))));
165 this.pager_element.append($('<pre/>').html(utils.fixCarriageReturn(utils.fixConsole(text))));
166 };
166 };
167
167
168
168
169 IPython.Pager = Pager;
169 IPython.Pager = Pager;
170
170
171 return IPython;
171 return IPython;
172
172
173 }(IPython));
173 }(IPython));
174
174
General Comments 0
You need to be logged in to leave comments. Login now