##// END OF EJS Templates
Removing extra refresh that is no longer needed because of CM fix.
Brian Granger -
Show More
@@ -1,850 +1,850
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 // CodeCell
9 // CodeCell
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 CodeCell = function (notebook) {
16 var CodeCell = function (notebook) {
17 this.code_mirror = null;
17 this.code_mirror = null;
18 this.input_prompt_number = ' ';
18 this.input_prompt_number = ' ';
19 this.is_completing = false;
19 this.is_completing = false;
20 this.completion_cursor = null;
20 this.completion_cursor = null;
21 this.outputs = [];
21 this.outputs = [];
22 this.collapsed = false;
22 this.collapsed = false;
23 this.tooltip_timeout = null;
23 this.tooltip_timeout = null;
24 IPython.Cell.apply(this, arguments);
24 IPython.Cell.apply(this, arguments);
25 };
25 };
26
26
27
27
28 CodeCell.prototype = new IPython.Cell();
28 CodeCell.prototype = new IPython.Cell();
29
29
30
30
31 CodeCell.prototype.create_element = function () {
31 CodeCell.prototype.create_element = function () {
32 var cell = $('<div></div>').addClass('cell border-box-sizing code_cell vbox');
32 var cell = $('<div></div>').addClass('cell border-box-sizing code_cell vbox');
33 cell.attr('tabindex','2');
33 cell.attr('tabindex','2');
34 var input = $('<div></div>').addClass('input hbox');
34 var input = $('<div></div>').addClass('input hbox');
35 input.append($('<div/>').addClass('prompt input_prompt'));
35 input.append($('<div/>').addClass('prompt input_prompt'));
36 var input_area = $('<div/>').addClass('input_area box-flex1');
36 var input_area = $('<div/>').addClass('input_area box-flex1');
37 this.code_mirror = CodeMirror(input_area.get(0), {
37 this.code_mirror = CodeMirror(input_area.get(0), {
38 indentUnit : 4,
38 indentUnit : 4,
39 mode: 'python',
39 mode: 'python',
40 theme: 'ipython',
40 theme: 'ipython',
41 readOnly: this.read_only,
41 readOnly: this.read_only,
42 onKeyEvent: $.proxy(this.handle_codemirror_keyevent,this)
42 onKeyEvent: $.proxy(this.handle_codemirror_keyevent,this)
43 });
43 });
44 input.append(input_area);
44 input.append(input_area);
45 var output = $('<div></div>').addClass('output vbox');
45 var output = $('<div></div>').addClass('output vbox');
46 cell.append(input).append(output);
46 cell.append(input).append(output);
47 this.element = cell;
47 this.element = cell;
48 this.collapse();
48 this.collapse();
49 };
49 };
50
50
51 //TODO, try to diminish the number of parameters.
51 //TODO, try to diminish the number of parameters.
52 CodeCell.prototype.request_tooltip_after_time = function (pre_cursor,time){
52 CodeCell.prototype.request_tooltip_after_time = function (pre_cursor,time){
53 var that = this;
53 var that = this;
54 if (pre_cursor === "" || pre_cursor === "(" ) {
54 if (pre_cursor === "" || pre_cursor === "(" ) {
55 // don't do anything if line beggin with '(' or is empty
55 // don't do anything if line beggin with '(' or is empty
56 } else {
56 } else {
57 // Will set a timer to request tooltip in `time`
57 // Will set a timer to request tooltip in `time`
58 that.tooltip_timeout = setTimeout(function(){
58 that.tooltip_timeout = setTimeout(function(){
59 IPython.notebook.request_tool_tip(that, pre_cursor)
59 IPython.notebook.request_tool_tip(that, pre_cursor)
60 },time);
60 },time);
61 }
61 }
62 };
62 };
63
63
64 CodeCell.prototype.handle_codemirror_keyevent = function (editor, event) {
64 CodeCell.prototype.handle_codemirror_keyevent = function (editor, event) {
65 // This method gets called in CodeMirror's onKeyDown/onKeyPress
65 // This method gets called in CodeMirror's onKeyDown/onKeyPress
66 // handlers and is used to provide custom key handling. Its return
66 // handlers and is used to provide custom key handling. Its return
67 // value is used to determine if CodeMirror should ignore the event:
67 // value is used to determine if CodeMirror should ignore the event:
68 // true = ignore, false = don't ignore.
68 // true = ignore, false = don't ignore.
69
69
70 if (this.read_only){
70 if (this.read_only){
71 return false;
71 return false;
72 }
72 }
73
73
74 // note that we are comparing and setting the time to wait at each key press.
74 // note that we are comparing and setting the time to wait at each key press.
75 // a better wqy might be to generate a new function on each time change and
75 // a better wqy might be to generate a new function on each time change and
76 // assign it to CodeCell.prototype.request_tooltip_after_time
76 // assign it to CodeCell.prototype.request_tooltip_after_time
77 tooltip_wait_time = this.notebook.time_before_tooltip;
77 tooltip_wait_time = this.notebook.time_before_tooltip;
78 tooltip_on_tab = this.notebook.tooltip_on_tab;
78 tooltip_on_tab = this.notebook.tooltip_on_tab;
79 var that = this;
79 var that = this;
80 // whatever key is pressed, first, cancel the tooltip request before
80 // whatever key is pressed, first, cancel the tooltip request before
81 // they are sent, and remove tooltip if any
81 // they are sent, and remove tooltip if any
82 if(event.type === 'keydown' ){
82 if(event.type === 'keydown' ){
83 that.remove_and_cancel_tooltip();
83 that.remove_and_cancel_tooltip();
84 }
84 }
85
85
86 if (event.keyCode === 13 && (event.shiftKey || event.ctrlKey)) {
86 if (event.keyCode === 13 && (event.shiftKey || event.ctrlKey)) {
87 // Always ignore shift-enter in CodeMirror as we handle it.
87 // Always ignore shift-enter in CodeMirror as we handle it.
88 return true;
88 return true;
89 } else if (event.which === 40 && event.type === 'keypress' && tooltip_wait_time >= 0) {
89 } else if (event.which === 40 && event.type === 'keypress' && tooltip_wait_time >= 0) {
90 // triger aon keypress (!) otherwise inconsistent event.which depending on plateform
90 // triger aon keypress (!) otherwise inconsistent event.which depending on plateform
91 // browser and keyboard layout !
91 // browser and keyboard layout !
92 // Pressing '(' , request tooltip, don't forget to reappend it
92 // Pressing '(' , request tooltip, don't forget to reappend it
93 var cursor = editor.getCursor();
93 var cursor = editor.getCursor();
94 var pre_cursor = editor.getRange({line:cursor.line,ch:0},cursor).trim()+'(';
94 var pre_cursor = editor.getRange({line:cursor.line,ch:0},cursor).trim()+'(';
95 that.request_tooltip_after_time(pre_cursor,tooltip_wait_time);
95 that.request_tooltip_after_time(pre_cursor,tooltip_wait_time);
96 } else if (event.which === 38) {
96 } else if (event.which === 38) {
97 // If we are not at the top, let CM handle the up arrow and
97 // If we are not at the top, let CM handle the up arrow and
98 // prevent the global keydown handler from handling it.
98 // prevent the global keydown handler from handling it.
99 if (!that.at_top()) {
99 if (!that.at_top()) {
100 event.stop();
100 event.stop();
101 return false;
101 return false;
102 } else {
102 } else {
103 return true;
103 return true;
104 };
104 };
105 } else if (event.which === 40) {
105 } else if (event.which === 40) {
106 // If we are not at the bottom, let CM handle the down arrow and
106 // If we are not at the bottom, let CM handle the down arrow and
107 // prevent the global keydown handler from handling it.
107 // prevent the global keydown handler from handling it.
108 if (!that.at_bottom()) {
108 if (!that.at_bottom()) {
109 event.stop();
109 event.stop();
110 return false;
110 return false;
111 } else {
111 } else {
112 return true;
112 return true;
113 };
113 };
114 } else if (event.keyCode === 9 && event.type == 'keydown') {
114 } else if (event.keyCode === 9 && event.type == 'keydown') {
115 // Tab completion.
115 // Tab completion.
116 var cur = editor.getCursor();
116 var cur = editor.getCursor();
117 //Do not trim here because of tooltip
117 //Do not trim here because of tooltip
118 var pre_cursor = editor.getRange({line:cur.line,ch:0},cur);
118 var pre_cursor = editor.getRange({line:cur.line,ch:0},cur);
119 if (pre_cursor.trim() === "") {
119 if (pre_cursor.trim() === "") {
120 // Don't autocomplete if the part of the line before the cursor
120 // Don't autocomplete if the part of the line before the cursor
121 // is empty. In this case, let CodeMirror handle indentation.
121 // is empty. In this case, let CodeMirror handle indentation.
122 return false;
122 return false;
123 } else if ((pre_cursor.substr(-1) === "("|| pre_cursor.substr(-1) === " ") && tooltip_on_tab ) {
123 } else if ((pre_cursor.substr(-1) === "("|| pre_cursor.substr(-1) === " ") && tooltip_on_tab ) {
124 that.request_tooltip_after_time(pre_cursor,0);
124 that.request_tooltip_after_time(pre_cursor,0);
125 } else {
125 } else {
126 pre_cursor.trim();
126 pre_cursor.trim();
127 // Autocomplete the current line.
127 // Autocomplete the current line.
128 event.stop();
128 event.stop();
129 var line = editor.getLine(cur.line);
129 var line = editor.getLine(cur.line);
130 this.is_completing = true;
130 this.is_completing = true;
131 this.completion_cursor = cur;
131 this.completion_cursor = cur;
132 IPython.notebook.complete_cell(this, line, cur.ch);
132 IPython.notebook.complete_cell(this, line, cur.ch);
133 return true;
133 return true;
134 }
134 }
135 } else if (event.keyCode === 8 && event.type == 'keydown') {
135 } else if (event.keyCode === 8 && event.type == 'keydown') {
136 // If backspace and the line ends with 4 spaces, remove them.
136 // If backspace and the line ends with 4 spaces, remove them.
137 var cur = editor.getCursor();
137 var cur = editor.getCursor();
138 var line = editor.getLine(cur.line);
138 var line = editor.getLine(cur.line);
139 var ending = line.slice(-4);
139 var ending = line.slice(-4);
140 if (ending === ' ') {
140 if (ending === ' ') {
141 editor.replaceRange('',
141 editor.replaceRange('',
142 {line: cur.line, ch: cur.ch-4},
142 {line: cur.line, ch: cur.ch-4},
143 {line: cur.line, ch: cur.ch}
143 {line: cur.line, ch: cur.ch}
144 );
144 );
145 event.stop();
145 event.stop();
146 return true;
146 return true;
147 } else {
147 } else {
148 return false;
148 return false;
149 }
149 }
150 } else if (event.keyCode === 76 && event.ctrlKey && event.shiftKey
150 } else if (event.keyCode === 76 && event.ctrlKey && event.shiftKey
151 && event.type == 'keydown') {
151 && event.type == 'keydown') {
152 // toggle line numbers with Ctrl-Shift-L
152 // toggle line numbers with Ctrl-Shift-L
153 this.toggle_line_numbers();
153 this.toggle_line_numbers();
154 }
154 }
155 else {
155 else {
156 // keypress/keyup also trigger on TAB press, and we don't want to
156 // keypress/keyup also trigger on TAB press, and we don't want to
157 // use those to disable tab completion.
157 // use those to disable tab completion.
158 if (this.is_completing && event.keyCode !== 9) {
158 if (this.is_completing && event.keyCode !== 9) {
159 var ed_cur = editor.getCursor();
159 var ed_cur = editor.getCursor();
160 var cc_cur = this.completion_cursor;
160 var cc_cur = this.completion_cursor;
161 if (ed_cur.line !== cc_cur.line || ed_cur.ch !== cc_cur.ch) {
161 if (ed_cur.line !== cc_cur.line || ed_cur.ch !== cc_cur.ch) {
162 this.is_completing = false;
162 this.is_completing = false;
163 this.completion_cursor = null;
163 this.completion_cursor = null;
164 }
164 }
165 }
165 }
166 return false;
166 return false;
167 };
167 };
168 return false;
168 return false;
169 };
169 };
170
170
171 CodeCell.prototype.remove_and_cancel_tooltip = function() {
171 CodeCell.prototype.remove_and_cancel_tooltip = function() {
172 // note that we don't handle closing directly inside the calltip
172 // note that we don't handle closing directly inside the calltip
173 // as in the completer, because it is not focusable, so won't
173 // as in the completer, because it is not focusable, so won't
174 // get the event.
174 // get the event.
175 if (this.tooltip_timeout != null){
175 if (this.tooltip_timeout != null){
176 clearTimeout(this.tooltip_timeout);
176 clearTimeout(this.tooltip_timeout);
177 $('#tooltip').remove();
177 $('#tooltip').remove();
178 this.tooltip_timeout = null;
178 this.tooltip_timeout = null;
179 }
179 }
180 }
180 }
181
181
182 CodeCell.prototype.finish_tooltip = function (reply) {
182 CodeCell.prototype.finish_tooltip = function (reply) {
183 // Extract call tip data; the priority is call, init, main.
183 // Extract call tip data; the priority is call, init, main.
184 defstring = reply.call_def;
184 defstring = reply.call_def;
185 if (defstring == null) { defstring = reply.init_definition; }
185 if (defstring == null) { defstring = reply.init_definition; }
186 if (defstring == null) { defstring = reply.definition; }
186 if (defstring == null) { defstring = reply.definition; }
187
187
188 docstring = reply.call_docstring;
188 docstring = reply.call_docstring;
189 if (docstring == null) { docstring = reply.init_docstring; }
189 if (docstring == null) { docstring = reply.init_docstring; }
190 if (docstring == null) { docstring = reply.docstring; }
190 if (docstring == null) { docstring = reply.docstring; }
191 if (docstring == null) { docstring = "<empty docstring>"; }
191 if (docstring == null) { docstring = "<empty docstring>"; }
192
192
193 name=reply.name;
193 name=reply.name;
194
194
195 var that = this;
195 var that = this;
196 var tooltip = $('<div/>').attr('id', 'tooltip').addClass('tooltip');
196 var tooltip = $('<div/>').attr('id', 'tooltip').addClass('tooltip');
197 // remove to have the tooltip not Limited in X and Y
197 // remove to have the tooltip not Limited in X and Y
198 tooltip.addClass('smalltooltip');
198 tooltip.addClass('smalltooltip');
199 var pre=$('<pre/>').html(utils.fixConsole(docstring));
199 var pre=$('<pre/>').html(utils.fixConsole(docstring));
200 var expandlink=$('<a/>').attr('href',"#");
200 var expandlink=$('<a/>').attr('href',"#");
201 expandlink.addClass("ui-corner-all"); //rounded corner
201 expandlink.addClass("ui-corner-all"); //rounded corner
202 expandlink.attr('role',"button");
202 expandlink.attr('role',"button");
203 //expandlink.addClass('ui-button');
203 //expandlink.addClass('ui-button');
204 //expandlink.addClass('ui-state-default');
204 //expandlink.addClass('ui-state-default');
205 var expandspan=$('<span/>').text('Expand');
205 var expandspan=$('<span/>').text('Expand');
206 expandspan.addClass('ui-icon');
206 expandspan.addClass('ui-icon');
207 expandspan.addClass('ui-icon-plus');
207 expandspan.addClass('ui-icon-plus');
208 expandlink.append(expandspan);
208 expandlink.append(expandspan);
209 expandlink.attr('id','expanbutton');
209 expandlink.attr('id','expanbutton');
210 expandlink.click(function(){
210 expandlink.click(function(){
211 tooltip.removeClass('smalltooltip');
211 tooltip.removeClass('smalltooltip');
212 tooltip.addClass('bigtooltip');
212 tooltip.addClass('bigtooltip');
213 $('#expanbutton').remove();
213 $('#expanbutton').remove();
214 setTimeout(function(){that.code_mirror.focus();}, 50);
214 setTimeout(function(){that.code_mirror.focus();}, 50);
215 });
215 });
216 var morelink=$('<a/>').attr('href',"#");
216 var morelink=$('<a/>').attr('href',"#");
217 morelink.attr('role',"button");
217 morelink.attr('role',"button");
218 morelink.addClass('ui-button');
218 morelink.addClass('ui-button');
219 //morelink.addClass("ui-corner-all"); //rounded corner
219 //morelink.addClass("ui-corner-all"); //rounded corner
220 //morelink.addClass('ui-state-default');
220 //morelink.addClass('ui-state-default');
221 var morespan=$('<span/>').text('Open in Pager');
221 var morespan=$('<span/>').text('Open in Pager');
222 morespan.addClass('ui-icon');
222 morespan.addClass('ui-icon');
223 morespan.addClass('ui-icon-arrowstop-l-n');
223 morespan.addClass('ui-icon-arrowstop-l-n');
224 morelink.append(morespan);
224 morelink.append(morespan);
225 morelink.click(function(){
225 morelink.click(function(){
226 var msg_id = IPython.notebook.kernel.execute(name+"?");
226 var msg_id = IPython.notebook.kernel.execute(name+"?");
227 IPython.notebook.msg_cell_map[msg_id] = IPython.notebook.get_selected_cell().cell_id;
227 IPython.notebook.msg_cell_map[msg_id] = IPython.notebook.get_selected_cell().cell_id;
228 that.remove_and_cancel_tooltip();
228 that.remove_and_cancel_tooltip();
229 setTimeout(function(){that.code_mirror.focus();}, 50);
229 setTimeout(function(){that.code_mirror.focus();}, 50);
230 });
230 });
231
231
232 var closelink=$('<a/>').attr('href',"#");
232 var closelink=$('<a/>').attr('href',"#");
233 closelink.attr('role',"button");
233 closelink.attr('role',"button");
234 closelink.addClass('ui-button');
234 closelink.addClass('ui-button');
235 //closelink.addClass("ui-corner-all"); //rounded corner
235 //closelink.addClass("ui-corner-all"); //rounded corner
236 //closelink.adClass('ui-state-default'); // grey background and blue cross
236 //closelink.adClass('ui-state-default'); // grey background and blue cross
237 var closespan=$('<span/>').text('Close');
237 var closespan=$('<span/>').text('Close');
238 closespan.addClass('ui-icon');
238 closespan.addClass('ui-icon');
239 closespan.addClass('ui-icon-close');
239 closespan.addClass('ui-icon-close');
240 closelink.append(closespan);
240 closelink.append(closespan);
241 closelink.click(function(){
241 closelink.click(function(){
242 that.remove_and_cancel_tooltip();
242 that.remove_and_cancel_tooltip();
243 setTimeout(function(){that.code_mirror.focus();}, 50);
243 setTimeout(function(){that.code_mirror.focus();}, 50);
244 });
244 });
245 //construct the tooltip
245 //construct the tooltip
246 tooltip.append(closelink);
246 tooltip.append(closelink);
247 tooltip.append(expandlink);
247 tooltip.append(expandlink);
248 tooltip.append(morelink);
248 tooltip.append(morelink);
249 if(defstring){
249 if(defstring){
250 defstring_html = $('<pre/>').html(utils.fixConsole(defstring));
250 defstring_html = $('<pre/>').html(utils.fixConsole(defstring));
251 tooltip.append(defstring_html);
251 tooltip.append(defstring_html);
252 }
252 }
253 tooltip.append(pre);
253 tooltip.append(pre);
254 var pos = this.code_mirror.cursorCoords();
254 var pos = this.code_mirror.cursorCoords();
255 tooltip.css('left',pos.x+'px');
255 tooltip.css('left',pos.x+'px');
256 tooltip.css('top',pos.yBot+'px');
256 tooltip.css('top',pos.yBot+'px');
257 $('body').append(tooltip);
257 $('body').append(tooltip);
258
258
259 // issues with cross-closing if multiple tooltip in less than 5sec
259 // issues with cross-closing if multiple tooltip in less than 5sec
260 // keep it comented for now
260 // keep it comented for now
261 // setTimeout(that.remove_and_cancel_tooltip, 5000);
261 // setTimeout(that.remove_and_cancel_tooltip, 5000);
262 };
262 };
263
263
264 // As you type completer
264 // As you type completer
265 CodeCell.prototype.finish_completing = function (matched_text, matches) {
265 CodeCell.prototype.finish_completing = function (matched_text, matches) {
266 //return if not completing or nothing to complete
266 //return if not completing or nothing to complete
267 if (!this.is_completing || matches.length === 0) {return;}
267 if (!this.is_completing || matches.length === 0) {return;}
268
268
269 // for later readability
269 // for later readability
270 var key = { tab:9,
270 var key = { tab:9,
271 esc:27,
271 esc:27,
272 backspace:8,
272 backspace:8,
273 space:32,
273 space:32,
274 shift:16,
274 shift:16,
275 enter:13,
275 enter:13,
276 // _ is 95
276 // _ is 95
277 isCompSymbol : function (code)
277 isCompSymbol : function (code)
278 {
278 {
279 return (code > 64 && code <= 90)
279 return (code > 64 && code <= 90)
280 || (code >= 97 && code <= 122)
280 || (code >= 97 && code <= 122)
281 || (code == 95)
281 || (code == 95)
282 },
282 },
283 dismissAndAppend : function (code)
283 dismissAndAppend : function (code)
284 {
284 {
285 chararr = '()[]+-/\\. ,=*'.split("");
285 chararr = '()[]+-/\\. ,=*'.split("");
286 codearr = chararr.map(function(x){return x.charCodeAt(0)});
286 codearr = chararr.map(function(x){return x.charCodeAt(0)});
287 return jQuery.inArray(code, codearr) != -1;
287 return jQuery.inArray(code, codearr) != -1;
288 }
288 }
289
289
290 }
290 }
291
291
292 // smart completion, sort kwarg ending with '='
292 // smart completion, sort kwarg ending with '='
293 var newm = new Array();
293 var newm = new Array();
294 if(this.notebook.smart_completer)
294 if(this.notebook.smart_completer)
295 {
295 {
296 kwargs = new Array();
296 kwargs = new Array();
297 other = new Array();
297 other = new Array();
298 for(var i = 0 ; i<matches.length ; ++i){
298 for(var i = 0 ; i<matches.length ; ++i){
299 if(matches[i].substr(-1) === '='){
299 if(matches[i].substr(-1) === '='){
300 kwargs.push(matches[i]);
300 kwargs.push(matches[i]);
301 }else{other.push(matches[i]);}
301 }else{other.push(matches[i]);}
302 }
302 }
303 newm = kwargs.concat(other);
303 newm = kwargs.concat(other);
304 matches = newm;
304 matches = newm;
305 }
305 }
306 // end sort kwargs
306 // end sort kwargs
307
307
308 // give common prefix of a array of string
308 // give common prefix of a array of string
309 function sharedStart(A){
309 function sharedStart(A){
310 if(A.length == 1){return A[0]}
310 if(A.length == 1){return A[0]}
311 if(A.length > 1 ){
311 if(A.length > 1 ){
312 var tem1, tem2, s, A = A.slice(0).sort();
312 var tem1, tem2, s, A = A.slice(0).sort();
313 tem1 = A[0];
313 tem1 = A[0];
314 s = tem1.length;
314 s = tem1.length;
315 tem2 = A.pop();
315 tem2 = A.pop();
316 while(s && tem2.indexOf(tem1) == -1){
316 while(s && tem2.indexOf(tem1) == -1){
317 tem1 = tem1.substring(0, --s);
317 tem1 = tem1.substring(0, --s);
318 }
318 }
319 return tem1;
319 return tem1;
320 }
320 }
321 return "";
321 return "";
322 }
322 }
323
323
324
324
325 //try to check if the user is typing tab at least twice after a word
325 //try to check if the user is typing tab at least twice after a word
326 // and completion is "done"
326 // and completion is "done"
327 fallback_on_tooltip_after = 2
327 fallback_on_tooltip_after = 2
328 if(matches.length == 1 && matched_text === matches[0])
328 if(matches.length == 1 && matched_text === matches[0])
329 {
329 {
330 if(this.npressed >fallback_on_tooltip_after && this.prevmatch==matched_text)
330 if(this.npressed >fallback_on_tooltip_after && this.prevmatch==matched_text)
331 {
331 {
332 this.request_tooltip_after_time(matched_text+'(',0);
332 this.request_tooltip_after_time(matched_text+'(',0);
333 return;
333 return;
334 }
334 }
335 this.prevmatch = matched_text
335 this.prevmatch = matched_text
336 this.npressed = this.npressed+1;
336 this.npressed = this.npressed+1;
337 }
337 }
338 else
338 else
339 {
339 {
340 this.prevmatch = "";
340 this.prevmatch = "";
341 this.npressed = 0;
341 this.npressed = 0;
342 }
342 }
343 // end fallback on tooltip
343 // end fallback on tooltip
344 //==================================
344 //==================================
345 // Real completion logic start here
345 // Real completion logic start here
346 var that = this;
346 var that = this;
347 var cur = this.completion_cursor;
347 var cur = this.completion_cursor;
348 var done = false;
348 var done = false;
349
349
350 // call to dismmiss the completer
350 // call to dismmiss the completer
351 var close = function () {
351 var close = function () {
352 if (done) return;
352 if (done) return;
353 done = true;
353 done = true;
354 if (complete != undefined)
354 if (complete != undefined)
355 {complete.remove();}
355 {complete.remove();}
356 that.is_completing = false;
356 that.is_completing = false;
357 that.completion_cursor = null;
357 that.completion_cursor = null;
358 };
358 };
359
359
360 // update codemirror with the typed text
360 // update codemirror with the typed text
361 prev = matched_text
361 prev = matched_text
362 var update = function (inserted_text, event) {
362 var update = function (inserted_text, event) {
363 that.code_mirror.replaceRange(
363 that.code_mirror.replaceRange(
364 inserted_text,
364 inserted_text,
365 {line: cur.line, ch: (cur.ch-matched_text.length)},
365 {line: cur.line, ch: (cur.ch-matched_text.length)},
366 {line: cur.line, ch: (cur.ch+prev.length-matched_text.length)}
366 {line: cur.line, ch: (cur.ch+prev.length-matched_text.length)}
367 );
367 );
368 prev = inserted_text
368 prev = inserted_text
369 if(event != null){
369 if(event != null){
370 event.stopPropagation();
370 event.stopPropagation();
371 event.preventDefault();
371 event.preventDefault();
372 }
372 }
373 };
373 };
374 // insert the given text and exit the completer
374 // insert the given text and exit the completer
375 var insert = function (selected_text, event) {
375 var insert = function (selected_text, event) {
376 update(selected_text)
376 update(selected_text)
377 close();
377 close();
378 setTimeout(function(){that.code_mirror.focus();}, 50);
378 setTimeout(function(){that.code_mirror.focus();}, 50);
379 };
379 };
380
380
381 // insert the curent highlited selection and exit
381 // insert the curent highlited selection and exit
382 var pick = function () {
382 var pick = function () {
383 insert(select.val()[0],null);
383 insert(select.val()[0],null);
384 };
384 };
385
385
386
386
387 // Define function to clear the completer, refill it with the new
387 // Define function to clear the completer, refill it with the new
388 // matches, update the pseuso typing field. autopick insert match if
388 // matches, update the pseuso typing field. autopick insert match if
389 // only one left, in no matches (anymore) dismiss itself by pasting
389 // only one left, in no matches (anymore) dismiss itself by pasting
390 // what the user have typed until then
390 // what the user have typed until then
391 var complete_with = function(matches,typed_text,autopick,event)
391 var complete_with = function(matches,typed_text,autopick,event)
392 {
392 {
393 // If autopick an only one match, past.
393 // If autopick an only one match, past.
394 // Used to 'pick' when pressing tab
394 // Used to 'pick' when pressing tab
395 if (matches.length < 1) {
395 if (matches.length < 1) {
396 insert(typed_text,event);
396 insert(typed_text,event);
397 if(event != null){
397 if(event != null){
398 event.stopPropagation();
398 event.stopPropagation();
399 event.preventDefault();
399 event.preventDefault();
400 }
400 }
401 } else if (autopick && matches.length == 1) {
401 } else if (autopick && matches.length == 1) {
402 insert(matches[0],event);
402 insert(matches[0],event);
403 if(event != null){
403 if(event != null){
404 event.stopPropagation();
404 event.stopPropagation();
405 event.preventDefault();
405 event.preventDefault();
406 }
406 }
407 }
407 }
408 //clear the previous completion if any
408 //clear the previous completion if any
409 update(typed_text,event);
409 update(typed_text,event);
410 complete.children().children().remove();
410 complete.children().children().remove();
411 $('#asyoutype').html("<b>"+matched_text+"</b>"+typed_text.substr(matched_text.length));
411 $('#asyoutype').html("<b>"+matched_text+"</b>"+typed_text.substr(matched_text.length));
412 select = $('#asyoutypeselect');
412 select = $('#asyoutypeselect');
413 for (var i = 0; i<matches.length; ++i) {
413 for (var i = 0; i<matches.length; ++i) {
414 select.append($('<option/>').html(matches[i]));
414 select.append($('<option/>').html(matches[i]));
415 }
415 }
416 select.children().first().attr('selected','true');
416 select.children().first().attr('selected','true');
417 }
417 }
418
418
419 // create html for completer
419 // create html for completer
420 var complete = $('<div/>').addClass('completions');
420 var complete = $('<div/>').addClass('completions');
421 complete.attr('id','complete');
421 complete.attr('id','complete');
422 complete.append($('<p/>').attr('id', 'asyoutype').html('<b>fixed part</b>user part'));//pseudo input field
422 complete.append($('<p/>').attr('id', 'asyoutype').html('<b>fixed part</b>user part'));//pseudo input field
423
423
424 var select = $('<select/>').attr('multiple','true');
424 var select = $('<select/>').attr('multiple','true');
425 select.attr('id', 'asyoutypeselect')
425 select.attr('id', 'asyoutypeselect')
426 select.attr('size',Math.min(10,matches.length));
426 select.attr('size',Math.min(10,matches.length));
427 var pos = this.code_mirror.cursorCoords();
427 var pos = this.code_mirror.cursorCoords();
428
428
429 // TODO: I propose to remove enough horizontal pixel
429 // TODO: I propose to remove enough horizontal pixel
430 // to align the text later
430 // to align the text later
431 complete.css('left',pos.x+'px');
431 complete.css('left',pos.x+'px');
432 complete.css('top',pos.yBot+'px');
432 complete.css('top',pos.yBot+'px');
433 complete.append(select);
433 complete.append(select);
434
434
435 $('body').append(complete);
435 $('body').append(complete);
436
436
437 // So a first actual completion. see if all the completion start wit
437 // So a first actual completion. see if all the completion start wit
438 // the same letter and complete if necessary
438 // the same letter and complete if necessary
439 fastForward = sharedStart(matches)
439 fastForward = sharedStart(matches)
440 typed_characters = fastForward.substr(matched_text.length);
440 typed_characters = fastForward.substr(matched_text.length);
441 complete_with(matches,matched_text+typed_characters,true,null);
441 complete_with(matches,matched_text+typed_characters,true,null);
442 filterd = matches;
442 filterd = matches;
443 // Give focus to select, and make it filter the match as the user type
443 // Give focus to select, and make it filter the match as the user type
444 // by filtering the previous matches. Called by .keypress and .keydown
444 // by filtering the previous matches. Called by .keypress and .keydown
445 var downandpress = function (event,press_or_down) {
445 var downandpress = function (event,press_or_down) {
446 var code = event.which;
446 var code = event.which;
447 var autopick = false; // auto 'pick' if only one match
447 var autopick = false; // auto 'pick' if only one match
448 if (press_or_down === 0){
448 if (press_or_down === 0){
449 press = true; down = false; //Are we called from keypress or keydown
449 press = true; down = false; //Are we called from keypress or keydown
450 } else if (press_or_down == 1){
450 } else if (press_or_down == 1){
451 press = false; down = true;
451 press = false; down = true;
452 }
452 }
453 if (code === key.shift) {
453 if (code === key.shift) {
454 // nothing on Shift
454 // nothing on Shift
455 return;
455 return;
456 }
456 }
457 if (key.dismissAndAppend(code) && press) {
457 if (key.dismissAndAppend(code) && press) {
458 var newchar = String.fromCharCode(code);
458 var newchar = String.fromCharCode(code);
459 typed_characters = typed_characters+newchar;
459 typed_characters = typed_characters+newchar;
460 insert(matched_text+typed_characters,event);
460 insert(matched_text+typed_characters,event);
461 return
461 return
462 }
462 }
463 if (code === key.enter) {
463 if (code === key.enter) {
464 // Pressing ENTER will cause a pick
464 // Pressing ENTER will cause a pick
465 event.stopPropagation();
465 event.stopPropagation();
466 event.preventDefault();
466 event.preventDefault();
467 pick();
467 pick();
468 } else if (code === 38 || code === 40) {
468 } else if (code === 38 || code === 40) {
469 // We don't want the document keydown handler to handle UP/DOWN,
469 // We don't want the document keydown handler to handle UP/DOWN,
470 // but we want the default action.
470 // but we want the default action.
471 event.stopPropagation();
471 event.stopPropagation();
472 } else if ( (code == key.backspace)||(code == key.tab && down) || press || key.isCompSymbol(code)){
472 } else if ( (code == key.backspace)||(code == key.tab && down) || press || key.isCompSymbol(code)){
473 if( key.isCompSymbol(code) && press)
473 if( key.isCompSymbol(code) && press)
474 {
474 {
475 var newchar = String.fromCharCode(code);
475 var newchar = String.fromCharCode(code);
476 typed_characters = typed_characters+newchar;
476 typed_characters = typed_characters+newchar;
477 } else if (code == key.tab) {
477 } else if (code == key.tab) {
478 fastForward = sharedStart(filterd)
478 fastForward = sharedStart(filterd)
479 ffsub = fastForward.substr(matched_text.length+typed_characters.length);
479 ffsub = fastForward.substr(matched_text.length+typed_characters.length);
480 typed_characters = typed_characters+ffsub;
480 typed_characters = typed_characters+ffsub;
481 autopick = true;
481 autopick = true;
482 } else if (code == key.backspace && down) {
482 } else if (code == key.backspace && down) {
483 // cancel if user have erase everything, otherwise decrease
483 // cancel if user have erase everything, otherwise decrease
484 // what we filter with
484 // what we filter with
485 event.preventDefault();
485 event.preventDefault();
486 if (typed_characters.length <= 0)
486 if (typed_characters.length <= 0)
487 {
487 {
488 insert(matched_text,event)
488 insert(matched_text,event)
489 return
489 return
490 }
490 }
491 typed_characters = typed_characters.substr(0,typed_characters.length-1);
491 typed_characters = typed_characters.substr(0,typed_characters.length-1);
492 } else if (press && code != key.backspace && code != key.tab && code != 0){
492 } else if (press && code != key.backspace && code != key.tab && code != 0){
493 insert(matched_text+typed_characters,event);
493 insert(matched_text+typed_characters,event);
494 return
494 return
495 } else {
495 } else {
496 return
496 return
497 }
497 }
498 re = new RegExp("^"+"\%?"+matched_text+typed_characters,"");
498 re = new RegExp("^"+"\%?"+matched_text+typed_characters,"");
499 filterd = matches.filter(function(x){return re.test(x)});
499 filterd = matches.filter(function(x){return re.test(x)});
500 complete_with(filterd,matched_text+typed_characters,autopick,event);
500 complete_with(filterd,matched_text+typed_characters,autopick,event);
501 } else if (code == key.esc) {
501 } else if (code == key.esc) {
502 // dismiss the completer and go back to before invoking it
502 // dismiss the completer and go back to before invoking it
503 insert(matched_text,event);
503 insert(matched_text,event);
504 } else if (press) { // abort only on .keypress or esc
504 } else if (press) { // abort only on .keypress or esc
505 }
505 }
506 }
506 }
507 select.keydown(function (event) {
507 select.keydown(function (event) {
508 downandpress(event,1)
508 downandpress(event,1)
509 });
509 });
510 select.keypress(function (event) {
510 select.keypress(function (event) {
511 downandpress(event,0)
511 downandpress(event,0)
512 });
512 });
513 // Double click also causes a pick.
513 // Double click also causes a pick.
514 // and bind the last actions.
514 // and bind the last actions.
515 select.dblclick(pick);
515 select.dblclick(pick);
516 select.blur(close);
516 select.blur(close);
517 select.focus();
517 select.focus();
518 };
518 };
519
519
520
520
521 CodeCell.prototype.toggle_line_numbers = function () {
521 CodeCell.prototype.toggle_line_numbers = function () {
522 if (this.code_mirror.getOption('lineNumbers') == false) {
522 if (this.code_mirror.getOption('lineNumbers') == false) {
523 this.code_mirror.setOption('lineNumbers', true);
523 this.code_mirror.setOption('lineNumbers', true);
524 } else {
524 } else {
525 this.code_mirror.setOption('lineNumbers', false);
525 this.code_mirror.setOption('lineNumbers', false);
526 }
526 }
527 this.code_mirror.refresh();
527 this.code_mirror.refresh();
528 };
528 };
529
529
530
530
531 CodeCell.prototype.select = function () {
531 CodeCell.prototype.select = function () {
532 IPython.Cell.prototype.select.apply(this);
532 IPython.Cell.prototype.select.apply(this);
533 // In some cases (inserting a new cell) we need a refresh before and
534 // after the focus. Not sure why this is the case.
535 this.code_mirror.refresh();
533 this.code_mirror.refresh();
536 this.code_mirror.focus();
534 this.code_mirror.focus();
537 this.code_mirror.refresh();
535 // We used to need an additional refresh() after the focus, but
536 // it appears that this has been fixed in CM. This bug would show
537 // up on FF when a newly loaded markdown cell was edited.
538 };
538 };
539
539
540
540
541 CodeCell.prototype.select_all = function () {
541 CodeCell.prototype.select_all = function () {
542 var start = {line: 0, ch: 0};
542 var start = {line: 0, ch: 0};
543 var nlines = this.code_mirror.lineCount();
543 var nlines = this.code_mirror.lineCount();
544 var last_line = this.code_mirror.getLine(nlines-1);
544 var last_line = this.code_mirror.getLine(nlines-1);
545 var end = {line: nlines-1, ch: last_line.length};
545 var end = {line: nlines-1, ch: last_line.length};
546 this.code_mirror.setSelection(start, end);
546 this.code_mirror.setSelection(start, end);
547 };
547 };
548
548
549
549
550 CodeCell.prototype.append_output = function (json) {
550 CodeCell.prototype.append_output = function (json) {
551 this.expand();
551 this.expand();
552 if (json.output_type === 'pyout') {
552 if (json.output_type === 'pyout') {
553 this.append_pyout(json);
553 this.append_pyout(json);
554 } else if (json.output_type === 'pyerr') {
554 } else if (json.output_type === 'pyerr') {
555 this.append_pyerr(json);
555 this.append_pyerr(json);
556 } else if (json.output_type === 'display_data') {
556 } else if (json.output_type === 'display_data') {
557 this.append_display_data(json);
557 this.append_display_data(json);
558 } else if (json.output_type === 'stream') {
558 } else if (json.output_type === 'stream') {
559 this.append_stream(json);
559 this.append_stream(json);
560 };
560 };
561 this.outputs.push(json);
561 this.outputs.push(json);
562 };
562 };
563
563
564
564
565 CodeCell.prototype.create_output_area = function () {
565 CodeCell.prototype.create_output_area = function () {
566 var oa = $("<div/>").addClass("hbox output_area");
566 var oa = $("<div/>").addClass("hbox output_area");
567 oa.append($('<div/>').addClass('prompt'));
567 oa.append($('<div/>').addClass('prompt'));
568 return oa;
568 return oa;
569 };
569 };
570
570
571
571
572 CodeCell.prototype.append_pyout = function (json) {
572 CodeCell.prototype.append_pyout = function (json) {
573 n = json.prompt_number || ' ';
573 n = json.prompt_number || ' ';
574 var toinsert = this.create_output_area();
574 var toinsert = this.create_output_area();
575 toinsert.find('div.prompt').addClass('output_prompt').html('Out[' + n + ']:');
575 toinsert.find('div.prompt').addClass('output_prompt').html('Out[' + n + ']:');
576 this.append_mime_type(json, toinsert);
576 this.append_mime_type(json, toinsert);
577 this.element.find('div.output').append(toinsert);
577 this.element.find('div.output').append(toinsert);
578 // If we just output latex, typeset it.
578 // If we just output latex, typeset it.
579 if ((json.latex !== undefined) || (json.html !== undefined)) {
579 if ((json.latex !== undefined) || (json.html !== undefined)) {
580 this.typeset();
580 this.typeset();
581 };
581 };
582 };
582 };
583
583
584
584
585 CodeCell.prototype.append_pyerr = function (json) {
585 CodeCell.prototype.append_pyerr = function (json) {
586 var tb = json.traceback;
586 var tb = json.traceback;
587 if (tb !== undefined && tb.length > 0) {
587 if (tb !== undefined && tb.length > 0) {
588 var s = '';
588 var s = '';
589 var len = tb.length;
589 var len = tb.length;
590 for (var i=0; i<len; i++) {
590 for (var i=0; i<len; i++) {
591 s = s + tb[i] + '\n';
591 s = s + tb[i] + '\n';
592 }
592 }
593 s = s + '\n';
593 s = s + '\n';
594 var toinsert = this.create_output_area();
594 var toinsert = this.create_output_area();
595 this.append_text(s, toinsert);
595 this.append_text(s, toinsert);
596 this.element.find('div.output').append(toinsert);
596 this.element.find('div.output').append(toinsert);
597 };
597 };
598 };
598 };
599
599
600
600
601 CodeCell.prototype.append_stream = function (json) {
601 CodeCell.prototype.append_stream = function (json) {
602 // temporary fix: if stream undefined (json file written prior to this patch),
602 // temporary fix: if stream undefined (json file written prior to this patch),
603 // default to most likely stdout:
603 // default to most likely stdout:
604 if (json.stream == undefined){
604 if (json.stream == undefined){
605 json.stream = 'stdout';
605 json.stream = 'stdout';
606 }
606 }
607 var subclass = "output_"+json.stream;
607 var subclass = "output_"+json.stream;
608 if (this.outputs.length > 0){
608 if (this.outputs.length > 0){
609 // have at least one output to consider
609 // have at least one output to consider
610 var last = this.outputs[this.outputs.length-1];
610 var last = this.outputs[this.outputs.length-1];
611 if (last.output_type == 'stream' && json.stream == last.stream){
611 if (last.output_type == 'stream' && json.stream == last.stream){
612 // latest output was in the same stream,
612 // latest output was in the same stream,
613 // so append directly into its pre tag
613 // so append directly into its pre tag
614 this.element.find('div.'+subclass).last().find('pre').append(json.text);
614 this.element.find('div.'+subclass).last().find('pre').append(json.text);
615 return;
615 return;
616 }
616 }
617 }
617 }
618
618
619 // If we got here, attach a new div
619 // If we got here, attach a new div
620 var toinsert = this.create_output_area();
620 var toinsert = this.create_output_area();
621 this.append_text(json.text, toinsert, "output_stream "+subclass);
621 this.append_text(json.text, toinsert, "output_stream "+subclass);
622 this.element.find('div.output').append(toinsert);
622 this.element.find('div.output').append(toinsert);
623 };
623 };
624
624
625
625
626 CodeCell.prototype.append_display_data = function (json) {
626 CodeCell.prototype.append_display_data = function (json) {
627 var toinsert = this.create_output_area();
627 var toinsert = this.create_output_area();
628 this.append_mime_type(json, toinsert);
628 this.append_mime_type(json, toinsert);
629 this.element.find('div.output').append(toinsert);
629 this.element.find('div.output').append(toinsert);
630 // If we just output latex, typeset it.
630 // If we just output latex, typeset it.
631 if ( (json.latex !== undefined) || (json.html !== undefined) ) {
631 if ( (json.latex !== undefined) || (json.html !== undefined) ) {
632 this.typeset();
632 this.typeset();
633 };
633 };
634 };
634 };
635
635
636
636
637 CodeCell.prototype.append_mime_type = function (json, element) {
637 CodeCell.prototype.append_mime_type = function (json, element) {
638 if (json.html !== undefined) {
638 if (json.html !== undefined) {
639 this.append_html(json.html, element);
639 this.append_html(json.html, element);
640 } else if (json.latex !== undefined) {
640 } else if (json.latex !== undefined) {
641 this.append_latex(json.latex, element);
641 this.append_latex(json.latex, element);
642 } else if (json.svg !== undefined) {
642 } else if (json.svg !== undefined) {
643 this.append_svg(json.svg, element);
643 this.append_svg(json.svg, element);
644 } else if (json.png !== undefined) {
644 } else if (json.png !== undefined) {
645 this.append_png(json.png, element);
645 this.append_png(json.png, element);
646 } else if (json.jpeg !== undefined) {
646 } else if (json.jpeg !== undefined) {
647 this.append_jpeg(json.jpeg, element);
647 this.append_jpeg(json.jpeg, element);
648 } else if (json.text !== undefined) {
648 } else if (json.text !== undefined) {
649 this.append_text(json.text, element);
649 this.append_text(json.text, element);
650 };
650 };
651 };
651 };
652
652
653
653
654 CodeCell.prototype.append_html = function (html, element) {
654 CodeCell.prototype.append_html = function (html, element) {
655 var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_html rendered_html");
655 var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_html rendered_html");
656 toinsert.append(html);
656 toinsert.append(html);
657 element.append(toinsert);
657 element.append(toinsert);
658 };
658 };
659
659
660
660
661 CodeCell.prototype.append_text = function (data, element, extra_class) {
661 CodeCell.prototype.append_text = function (data, element, extra_class) {
662 var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_text");
662 var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_text");
663 if (extra_class){
663 if (extra_class){
664 toinsert.addClass(extra_class);
664 toinsert.addClass(extra_class);
665 }
665 }
666 toinsert.append($("<pre/>").html(data));
666 toinsert.append($("<pre/>").html(data));
667 element.append(toinsert);
667 element.append(toinsert);
668 };
668 };
669
669
670
670
671 CodeCell.prototype.append_svg = function (svg, element) {
671 CodeCell.prototype.append_svg = function (svg, element) {
672 var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_svg");
672 var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_svg");
673 toinsert.append(svg);
673 toinsert.append(svg);
674 element.append(toinsert);
674 element.append(toinsert);
675 };
675 };
676
676
677
677
678 CodeCell.prototype.append_png = function (png, element) {
678 CodeCell.prototype.append_png = function (png, element) {
679 var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_png");
679 var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_png");
680 toinsert.append($("<img/>").attr('src','data:image/png;base64,'+png));
680 toinsert.append($("<img/>").attr('src','data:image/png;base64,'+png));
681 element.append(toinsert);
681 element.append(toinsert);
682 };
682 };
683
683
684
684
685 CodeCell.prototype.append_jpeg = function (jpeg, element) {
685 CodeCell.prototype.append_jpeg = function (jpeg, element) {
686 var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_jpeg");
686 var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_jpeg");
687 toinsert.append($("<img/>").attr('src','data:image/jpeg;base64,'+jpeg));
687 toinsert.append($("<img/>").attr('src','data:image/jpeg;base64,'+jpeg));
688 element.append(toinsert);
688 element.append(toinsert);
689 };
689 };
690
690
691
691
692 CodeCell.prototype.append_latex = function (latex, element) {
692 CodeCell.prototype.append_latex = function (latex, element) {
693 // This method cannot do the typesetting because the latex first has to
693 // This method cannot do the typesetting because the latex first has to
694 // be on the page.
694 // be on the page.
695 var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_latex");
695 var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_latex");
696 toinsert.append(latex);
696 toinsert.append(latex);
697 element.append(toinsert);
697 element.append(toinsert);
698 };
698 };
699
699
700
700
701 CodeCell.prototype.clear_output = function (stdout, stderr, other) {
701 CodeCell.prototype.clear_output = function (stdout, stderr, other) {
702 var output_div = this.element.find("div.output");
702 var output_div = this.element.find("div.output");
703 if (stdout && stderr && other){
703 if (stdout && stderr && other){
704 // clear all, no need for logic
704 // clear all, no need for logic
705 output_div.html("");
705 output_div.html("");
706 this.outputs = [];
706 this.outputs = [];
707 return;
707 return;
708 }
708 }
709 // remove html output
709 // remove html output
710 // each output_subarea that has an identifying class is in an output_area
710 // each output_subarea that has an identifying class is in an output_area
711 // which is the element to be removed.
711 // which is the element to be removed.
712 if (stdout){
712 if (stdout){
713 output_div.find("div.output_stdout").parent().remove();
713 output_div.find("div.output_stdout").parent().remove();
714 }
714 }
715 if (stderr){
715 if (stderr){
716 output_div.find("div.output_stderr").parent().remove();
716 output_div.find("div.output_stderr").parent().remove();
717 }
717 }
718 if (other){
718 if (other){
719 output_div.find("div.output_subarea").not("div.output_stderr").not("div.output_stdout").parent().remove();
719 output_div.find("div.output_subarea").not("div.output_stderr").not("div.output_stdout").parent().remove();
720 }
720 }
721
721
722 // remove cleared outputs from JSON list:
722 // remove cleared outputs from JSON list:
723 for (var i = this.outputs.length - 1; i >= 0; i--){
723 for (var i = this.outputs.length - 1; i >= 0; i--){
724 var out = this.outputs[i];
724 var out = this.outputs[i];
725 var output_type = out.output_type;
725 var output_type = out.output_type;
726 if (output_type == "display_data" && other){
726 if (output_type == "display_data" && other){
727 this.outputs.splice(i,1);
727 this.outputs.splice(i,1);
728 }else if (output_type == "stream"){
728 }else if (output_type == "stream"){
729 if (stdout && out.stream == "stdout"){
729 if (stdout && out.stream == "stdout"){
730 this.outputs.splice(i,1);
730 this.outputs.splice(i,1);
731 }else if (stderr && out.stream == "stderr"){
731 }else if (stderr && out.stream == "stderr"){
732 this.outputs.splice(i,1);
732 this.outputs.splice(i,1);
733 }
733 }
734 }
734 }
735 }
735 }
736 };
736 };
737
737
738
738
739 CodeCell.prototype.clear_input = function () {
739 CodeCell.prototype.clear_input = function () {
740 this.code_mirror.setValue('');
740 this.code_mirror.setValue('');
741 };
741 };
742
742
743
743
744 CodeCell.prototype.collapse = function () {
744 CodeCell.prototype.collapse = function () {
745 if (!this.collapsed) {
745 if (!this.collapsed) {
746 this.element.find('div.output').hide();
746 this.element.find('div.output').hide();
747 this.collapsed = true;
747 this.collapsed = true;
748 };
748 };
749 };
749 };
750
750
751
751
752 CodeCell.prototype.expand = function () {
752 CodeCell.prototype.expand = function () {
753 if (this.collapsed) {
753 if (this.collapsed) {
754 this.element.find('div.output').show();
754 this.element.find('div.output').show();
755 this.collapsed = false;
755 this.collapsed = false;
756 };
756 };
757 };
757 };
758
758
759
759
760 CodeCell.prototype.toggle_output = function () {
760 CodeCell.prototype.toggle_output = function () {
761 if (this.collapsed) {
761 if (this.collapsed) {
762 this.expand();
762 this.expand();
763 } else {
763 } else {
764 this.collapse();
764 this.collapse();
765 };
765 };
766 };
766 };
767
767
768 CodeCell.prototype.set_input_prompt = function (number) {
768 CodeCell.prototype.set_input_prompt = function (number) {
769 var n = number || '&nbsp;';
769 var n = number || '&nbsp;';
770 this.input_prompt_number = n;
770 this.input_prompt_number = n;
771 this.element.find('div.input_prompt').html('In&nbsp;[' + n + ']:');
771 this.element.find('div.input_prompt').html('In&nbsp;[' + n + ']:');
772 };
772 };
773
773
774
774
775 CodeCell.prototype.get_text = function () {
775 CodeCell.prototype.get_text = function () {
776 return this.code_mirror.getValue();
776 return this.code_mirror.getValue();
777 };
777 };
778
778
779
779
780 CodeCell.prototype.set_text = function (code) {
780 CodeCell.prototype.set_text = function (code) {
781 return this.code_mirror.setValue(code);
781 return this.code_mirror.setValue(code);
782 };
782 };
783
783
784
784
785 CodeCell.prototype.at_top = function () {
785 CodeCell.prototype.at_top = function () {
786 var cursor = this.code_mirror.getCursor();
786 var cursor = this.code_mirror.getCursor();
787 if (cursor.line === 0) {
787 if (cursor.line === 0) {
788 return true;
788 return true;
789 } else {
789 } else {
790 return false;
790 return false;
791 }
791 }
792 };
792 };
793
793
794
794
795 CodeCell.prototype.at_bottom = function () {
795 CodeCell.prototype.at_bottom = function () {
796 var cursor = this.code_mirror.getCursor();
796 var cursor = this.code_mirror.getCursor();
797 if (cursor.line === (this.code_mirror.lineCount()-1)) {
797 if (cursor.line === (this.code_mirror.lineCount()-1)) {
798 return true;
798 return true;
799 } else {
799 } else {
800 return false;
800 return false;
801 }
801 }
802 };
802 };
803
803
804
804
805 CodeCell.prototype.fromJSON = function (data) {
805 CodeCell.prototype.fromJSON = function (data) {
806 if (data.cell_type === 'code') {
806 if (data.cell_type === 'code') {
807 if (data.input !== undefined) {
807 if (data.input !== undefined) {
808 this.set_text(data.input);
808 this.set_text(data.input);
809 }
809 }
810 if (data.prompt_number !== undefined) {
810 if (data.prompt_number !== undefined) {
811 this.set_input_prompt(data.prompt_number);
811 this.set_input_prompt(data.prompt_number);
812 } else {
812 } else {
813 this.set_input_prompt();
813 this.set_input_prompt();
814 };
814 };
815 var len = data.outputs.length;
815 var len = data.outputs.length;
816 for (var i=0; i<len; i++) {
816 for (var i=0; i<len; i++) {
817 this.append_output(data.outputs[i]);
817 this.append_output(data.outputs[i]);
818 };
818 };
819 if (data.collapsed !== undefined) {
819 if (data.collapsed !== undefined) {
820 if (data.collapsed) {
820 if (data.collapsed) {
821 this.collapse();
821 this.collapse();
822 };
822 };
823 };
823 };
824 };
824 };
825 };
825 };
826
826
827
827
828 CodeCell.prototype.toJSON = function () {
828 CodeCell.prototype.toJSON = function () {
829 var data = {};
829 var data = {};
830 data.input = this.get_text();
830 data.input = this.get_text();
831 data.cell_type = 'code';
831 data.cell_type = 'code';
832 if (this.input_prompt_number !== ' ') {
832 if (this.input_prompt_number !== ' ') {
833 data.prompt_number = this.input_prompt_number;
833 data.prompt_number = this.input_prompt_number;
834 };
834 };
835 var outputs = [];
835 var outputs = [];
836 var len = this.outputs.length;
836 var len = this.outputs.length;
837 for (var i=0; i<len; i++) {
837 for (var i=0; i<len; i++) {
838 outputs[i] = this.outputs[i];
838 outputs[i] = this.outputs[i];
839 };
839 };
840 data.outputs = outputs;
840 data.outputs = outputs;
841 data.language = 'python';
841 data.language = 'python';
842 data.collapsed = this.collapsed;
842 data.collapsed = this.collapsed;
843 return data;
843 return data;
844 };
844 };
845
845
846
846
847 IPython.CodeCell = CodeCell;
847 IPython.CodeCell = CodeCell;
848
848
849 return IPython;
849 return IPython;
850 }(IPython));
850 }(IPython));
@@ -1,290 +1,287
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 // TextCell
9 // TextCell
10 //============================================================================
10 //============================================================================
11
11
12 var IPython = (function (IPython) {
12 var IPython = (function (IPython) {
13
13
14 // TextCell base class
14 // TextCell base class
15
15
16 var TextCell = function (notebook) {
16 var TextCell = function (notebook) {
17 this.code_mirror_mode = this.code_mirror_mode || 'htmlmixed';
17 this.code_mirror_mode = this.code_mirror_mode || 'htmlmixed';
18 IPython.Cell.apply(this, arguments);
18 IPython.Cell.apply(this, arguments);
19 this.rendered = false;
19 this.rendered = false;
20 this.cell_type = this.cell_type || 'text';
20 this.cell_type = this.cell_type || 'text';
21 };
21 };
22
22
23
23
24 TextCell.prototype = new IPython.Cell();
24 TextCell.prototype = new IPython.Cell();
25
25
26
26
27 TextCell.prototype.create_element = function () {
27 TextCell.prototype.create_element = function () {
28 var cell = $("<div>").addClass('cell text_cell border-box-sizing');
28 var cell = $("<div>").addClass('cell text_cell border-box-sizing');
29 cell.attr('tabindex','2');
29 cell.attr('tabindex','2');
30 var input_area = $('<div/>').addClass('text_cell_input border-box-sizing');
30 var input_area = $('<div/>').addClass('text_cell_input border-box-sizing');
31 this.code_mirror = CodeMirror(input_area.get(0), {
31 this.code_mirror = CodeMirror(input_area.get(0), {
32 indentUnit : 4,
32 indentUnit : 4,
33 mode: this.code_mirror_mode,
33 mode: this.code_mirror_mode,
34 theme: 'default',
34 theme: 'default',
35 value: this.placeholder,
35 value: this.placeholder,
36 readOnly: this.read_only,
36 readOnly: this.read_only,
37 onKeyEvent: $.proxy(this.handle_codemirror_keyevent,this)
37 onKeyEvent: $.proxy(this.handle_codemirror_keyevent,this)
38 });
38 });
39 // The tabindex=-1 makes this div focusable.
39 // The tabindex=-1 makes this div focusable.
40 var render_area = $('<div/>').addClass('text_cell_render border-box-sizing').
40 var render_area = $('<div/>').addClass('text_cell_render border-box-sizing').
41 addClass('rendered_html').attr('tabindex','-1');
41 addClass('rendered_html').attr('tabindex','-1');
42 cell.append(input_area).append(render_area);
42 cell.append(input_area).append(render_area);
43 this.element = cell;
43 this.element = cell;
44 };
44 };
45
45
46
46
47 TextCell.prototype.bind_events = function () {
47 TextCell.prototype.bind_events = function () {
48 IPython.Cell.prototype.bind_events.apply(this);
48 IPython.Cell.prototype.bind_events.apply(this);
49 var that = this;
49 var that = this;
50 this.element.keydown(function (event) {
50 this.element.keydown(function (event) {
51 if (event.which === 13) {
51 if (event.which === 13) {
52 if (that.rendered) {
52 if (that.rendered) {
53 that.edit();
53 that.edit();
54 return false;
54 return false;
55 };
55 };
56 };
56 };
57 });
57 });
58 this.element.dblclick(function () {
58 this.element.dblclick(function () {
59 that.edit();
59 that.edit();
60 });
60 });
61 };
61 };
62
62
63
63
64 TextCell.prototype.handle_codemirror_keyevent = function (editor, event) {
64 TextCell.prototype.handle_codemirror_keyevent = function (editor, event) {
65 // This method gets called in CodeMirror's onKeyDown/onKeyPress
65 // This method gets called in CodeMirror's onKeyDown/onKeyPress
66 // handlers and is used to provide custom key handling. Its return
66 // handlers and is used to provide custom key handling. Its return
67 // value is used to determine if CodeMirror should ignore the event:
67 // value is used to determine if CodeMirror should ignore the event:
68 // true = ignore, false = don't ignore.
68 // true = ignore, false = don't ignore.
69
69
70 if (event.keyCode === 13 && (event.shiftKey || event.ctrlKey)) {
70 if (event.keyCode === 13 && (event.shiftKey || event.ctrlKey)) {
71 // Always ignore shift-enter in CodeMirror as we handle it.
71 // Always ignore shift-enter in CodeMirror as we handle it.
72 return true;
72 return true;
73 }
73 }
74 return false;
74 return false;
75 };
75 };
76
76
77
77
78 TextCell.prototype.select = function () {
78 TextCell.prototype.select = function () {
79 IPython.Cell.prototype.select.apply(this);
79 IPython.Cell.prototype.select.apply(this);
80 var output = this.element.find("div.text_cell_render");
80 var output = this.element.find("div.text_cell_render");
81 output.trigger('focus');
81 output.trigger('focus');
82 };
82 };
83
83
84
84
85 TextCell.prototype.unselect = function() {
85 TextCell.prototype.unselect = function() {
86 // render on selection of another cell
86 // render on selection of another cell
87 this.render();
87 this.render();
88 IPython.Cell.prototype.unselect.apply(this);
88 IPython.Cell.prototype.unselect.apply(this);
89 };
89 };
90
90
91
91
92 TextCell.prototype.edit = function () {
92 TextCell.prototype.edit = function () {
93 if ( this.read_only ) return;
93 if ( this.read_only ) return;
94 if (this.rendered === true) {
94 if (this.rendered === true) {
95 var text_cell = this.element;
95 var text_cell = this.element;
96 var output = text_cell.find("div.text_cell_render");
96 var output = text_cell.find("div.text_cell_render");
97 output.hide();
97 output.hide();
98 text_cell.find('div.text_cell_input').show();
98 text_cell.find('div.text_cell_input').show();
99 // I don't know why I need to do this, but if I don't do
100 // refresh/focus/refresh, the to_markdown method won't work.
101 this.code_mirror.refresh();
99 this.code_mirror.refresh();
102 this.code_mirror.focus();
100 this.code_mirror.focus();
103 // This final refresh is needed on Firefox to trigger the editor
101 // We used to need an additional refresh() after the focus, but
104 // to be auto-sized. This glitch only happens on cell that are
102 // it appears that this has been fixed in CM. This bug would show
105 // loaded initially and haven't had their editor focused before.
103 // up on FF when a newly loaded markdown cell was edited.
106 this.code_mirror.refresh();
107 this.rendered = false;
104 this.rendered = false;
108 if (this.get_text() === this.placeholder) {
105 if (this.get_text() === this.placeholder) {
109 this.set_text('');
106 this.set_text('');
110 this.refresh();
107 this.refresh();
111 }
108 }
112 }
109 }
113 };
110 };
114
111
115
112
116 // Subclasses must define render.
113 // Subclasses must define render.
117 TextCell.prototype.render = function () {};
114 TextCell.prototype.render = function () {};
118
115
119
116
120 TextCell.prototype.get_text = function() {
117 TextCell.prototype.get_text = function() {
121 return this.code_mirror.getValue();
118 return this.code_mirror.getValue();
122 };
119 };
123
120
124
121
125 TextCell.prototype.set_text = function(text) {
122 TextCell.prototype.set_text = function(text) {
126 this.code_mirror.setValue(text);
123 this.code_mirror.setValue(text);
127 this.code_mirror.refresh();
124 this.code_mirror.refresh();
128 };
125 };
129
126
130
127
131 TextCell.prototype.get_rendered = function() {
128 TextCell.prototype.get_rendered = function() {
132 return this.element.find('div.text_cell_render').html();
129 return this.element.find('div.text_cell_render').html();
133 };
130 };
134
131
135
132
136 TextCell.prototype.set_rendered = function(text) {
133 TextCell.prototype.set_rendered = function(text) {
137 this.element.find('div.text_cell_render').html(text);
134 this.element.find('div.text_cell_render').html(text);
138 };
135 };
139
136
140
137
141 TextCell.prototype.at_top = function () {
138 TextCell.prototype.at_top = function () {
142 if (this.rendered) {
139 if (this.rendered) {
143 return true;
140 return true;
144 } else {
141 } else {
145 return false;
142 return false;
146 }
143 }
147 };
144 };
148
145
149
146
150 TextCell.prototype.at_bottom = function () {
147 TextCell.prototype.at_bottom = function () {
151 if (this.rendered) {
148 if (this.rendered) {
152 return true;
149 return true;
153 } else {
150 } else {
154 return false;
151 return false;
155 }
152 }
156 };
153 };
157
154
158
155
159 TextCell.prototype.fromJSON = function (data) {
156 TextCell.prototype.fromJSON = function (data) {
160 if (data.cell_type === this.cell_type) {
157 if (data.cell_type === this.cell_type) {
161 if (data.source !== undefined) {
158 if (data.source !== undefined) {
162 this.set_text(data.source);
159 this.set_text(data.source);
163 this.set_rendered(data.rendered || '');
160 this.set_rendered(data.rendered || '');
164 this.rendered = false;
161 this.rendered = false;
165 this.render();
162 this.render();
166 }
163 }
167 }
164 }
168 };
165 };
169
166
170
167
171 TextCell.prototype.toJSON = function () {
168 TextCell.prototype.toJSON = function () {
172 var data = {};
169 var data = {};
173 data.cell_type = this.cell_type;
170 data.cell_type = this.cell_type;
174 data.source = this.get_text();
171 data.source = this.get_text();
175 return data;
172 return data;
176 };
173 };
177
174
178
175
179 // HTMLCell
176 // HTMLCell
180
177
181 var HTMLCell = function (notebook) {
178 var HTMLCell = function (notebook) {
182 this.placeholder = "Type <strong>HTML</strong> and LaTeX: $\\alpha^2$";
179 this.placeholder = "Type <strong>HTML</strong> and LaTeX: $\\alpha^2$";
183 IPython.TextCell.apply(this, arguments);
180 IPython.TextCell.apply(this, arguments);
184 this.cell_type = 'html';
181 this.cell_type = 'html';
185 };
182 };
186
183
187
184
188 HTMLCell.prototype = new TextCell();
185 HTMLCell.prototype = new TextCell();
189
186
190
187
191 HTMLCell.prototype.render = function () {
188 HTMLCell.prototype.render = function () {
192 if (this.rendered === false) {
189 if (this.rendered === false) {
193 var text = this.get_text();
190 var text = this.get_text();
194 if (text === "") { text = this.placeholder; }
191 if (text === "") { text = this.placeholder; }
195 this.set_rendered(text);
192 this.set_rendered(text);
196 this.typeset();
193 this.typeset();
197 this.element.find('div.text_cell_input').hide();
194 this.element.find('div.text_cell_input').hide();
198 this.element.find("div.text_cell_render").show();
195 this.element.find("div.text_cell_render").show();
199 this.rendered = true;
196 this.rendered = true;
200 }
197 }
201 };
198 };
202
199
203
200
204 // MarkdownCell
201 // MarkdownCell
205
202
206 var MarkdownCell = function (notebook) {
203 var MarkdownCell = function (notebook) {
207 this.placeholder = "Type *Markdown* and LaTeX: $\\alpha^2$";
204 this.placeholder = "Type *Markdown* and LaTeX: $\\alpha^2$";
208 IPython.TextCell.apply(this, arguments);
205 IPython.TextCell.apply(this, arguments);
209 this.cell_type = 'markdown';
206 this.cell_type = 'markdown';
210 };
207 };
211
208
212
209
213 MarkdownCell.prototype = new TextCell();
210 MarkdownCell.prototype = new TextCell();
214
211
215
212
216 MarkdownCell.prototype.render = function () {
213 MarkdownCell.prototype.render = function () {
217 if (this.rendered === false) {
214 if (this.rendered === false) {
218 var text = this.get_text();
215 var text = this.get_text();
219 if (text === "") { text = this.placeholder; }
216 if (text === "") { text = this.placeholder; }
220 var html = IPython.markdown_converter.makeHtml(text);
217 var html = IPython.markdown_converter.makeHtml(text);
221 this.set_rendered(html);
218 this.set_rendered(html);
222 this.typeset()
219 this.typeset()
223 this.element.find('div.text_cell_input').hide();
220 this.element.find('div.text_cell_input').hide();
224 this.element.find("div.text_cell_render").show();
221 this.element.find("div.text_cell_render").show();
225 var code_snippets = this.element.find("pre > code");
222 var code_snippets = this.element.find("pre > code");
226 code_snippets.replaceWith(function () {
223 code_snippets.replaceWith(function () {
227 var code = $(this).html();
224 var code = $(this).html();
228 /* Substitute br for newlines and &nbsp; for spaces
225 /* Substitute br for newlines and &nbsp; for spaces
229 before highlighting, since prettify doesn't
226 before highlighting, since prettify doesn't
230 preserve those on all browsers */
227 preserve those on all browsers */
231 code = code.replace(/(\r\n|\n|\r)/gm, "<br/>");
228 code = code.replace(/(\r\n|\n|\r)/gm, "<br/>");
232 code = code.replace(/ /gm, '&nbsp;');
229 code = code.replace(/ /gm, '&nbsp;');
233 code = prettyPrintOne(code);
230 code = prettyPrintOne(code);
234
231
235 return '<code class="prettyprint">' + code + '</code>';
232 return '<code class="prettyprint">' + code + '</code>';
236 });
233 });
237 this.rendered = true;
234 this.rendered = true;
238 }
235 }
239 };
236 };
240
237
241
238
242 // RSTCell
239 // RSTCell
243
240
244 var RSTCell = function (notebook) {
241 var RSTCell = function (notebook) {
245 this.placeholder = "Type *ReStructured Text* and LaTeX: $\\alpha^2$";
242 this.placeholder = "Type *ReStructured Text* and LaTeX: $\\alpha^2$";
246 IPython.TextCell.apply(this, arguments);
243 IPython.TextCell.apply(this, arguments);
247 this.cell_type = 'rst';
244 this.cell_type = 'rst';
248 };
245 };
249
246
250
247
251 RSTCell.prototype = new TextCell();
248 RSTCell.prototype = new TextCell();
252
249
253
250
254 RSTCell.prototype.render = function () {
251 RSTCell.prototype.render = function () {
255 if (this.rendered === false) {
252 if (this.rendered === false) {
256 var text = this.get_text();
253 var text = this.get_text();
257 if (text === "") { text = this.placeholder; }
254 if (text === "") { text = this.placeholder; }
258 var settings = {
255 var settings = {
259 processData : false,
256 processData : false,
260 cache : false,
257 cache : false,
261 type : "POST",
258 type : "POST",
262 data : text,
259 data : text,
263 headers : {'Content-Type': 'application/x-rst'},
260 headers : {'Content-Type': 'application/x-rst'},
264 success : $.proxy(this.handle_render,this)
261 success : $.proxy(this.handle_render,this)
265 };
262 };
266 $.ajax("/rstservice/render", settings);
263 $.ajax("/rstservice/render", settings);
267 this.element.find('div.text_cell_input').hide();
264 this.element.find('div.text_cell_input').hide();
268 this.element.find("div.text_cell_render").show();
265 this.element.find("div.text_cell_render").show();
269 this.set_rendered("Rendering...");
266 this.set_rendered("Rendering...");
270 }
267 }
271 };
268 };
272
269
273
270
274 RSTCell.prototype.handle_render = function (data, status, xhr) {
271 RSTCell.prototype.handle_render = function (data, status, xhr) {
275 this.set_rendered(data);
272 this.set_rendered(data);
276 this.typeset();
273 this.typeset();
277 this.rendered = true;
274 this.rendered = true;
278 };
275 };
279
276
280
277
281 IPython.TextCell = TextCell;
278 IPython.TextCell = TextCell;
282 IPython.HTMLCell = HTMLCell;
279 IPython.HTMLCell = HTMLCell;
283 IPython.MarkdownCell = MarkdownCell;
280 IPython.MarkdownCell = MarkdownCell;
284 IPython.RSTCell = RSTCell;
281 IPython.RSTCell = RSTCell;
285
282
286
283
287 return IPython;
284 return IPython;
288
285
289 }(IPython));
286 }(IPython));
290
287
General Comments 0
You need to be logged in to leave comments. Login now