Show More
@@ -1,452 +1,452 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 | // 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 | IPython.Cell.apply(this, arguments); |
|
23 | IPython.Cell.apply(this, arguments); | |
24 | }; |
|
24 | }; | |
25 |
|
25 | |||
26 |
|
26 | |||
27 | CodeCell.prototype = new IPython.Cell(); |
|
27 | CodeCell.prototype = new IPython.Cell(); | |
28 |
|
28 | |||
29 |
|
29 | |||
30 | CodeCell.prototype.create_element = function () { |
|
30 | CodeCell.prototype.create_element = function () { | |
31 | var cell = $('<div></div>').addClass('cell border-box-sizing code_cell vbox'); |
|
31 | var cell = $('<div></div>').addClass('cell border-box-sizing code_cell vbox'); | |
32 | cell.attr('tabindex','2'); |
|
32 | cell.attr('tabindex','2'); | |
33 | var input = $('<div></div>').addClass('input hbox'); |
|
33 | var input = $('<div></div>').addClass('input hbox'); | |
34 | input.append($('<div/>').addClass('prompt input_prompt')); |
|
34 | input.append($('<div/>').addClass('prompt input_prompt')); | |
35 | var input_area = $('<div/>').addClass('input_area box-flex1'); |
|
35 | var input_area = $('<div/>').addClass('input_area box-flex1'); | |
36 | this.code_mirror = CodeMirror(input_area.get(0), { |
|
36 | this.code_mirror = CodeMirror(input_area.get(0), { | |
37 | indentUnit : 4, |
|
37 | indentUnit : 4, | |
38 | mode: 'python', |
|
38 | mode: 'python', | |
39 | theme: 'ipython', |
|
39 | theme: 'ipython', | |
40 | onKeyEvent: $.proxy(this.handle_codemirror_keyevent,this) |
|
40 | onKeyEvent: $.proxy(this.handle_codemirror_keyevent,this) | |
41 | }); |
|
41 | }); | |
42 | input.append(input_area); |
|
42 | input.append(input_area); | |
43 | var output = $('<div></div>').addClass('output vbox'); |
|
43 | var output = $('<div></div>').addClass('output vbox'); | |
44 | cell.append(input).append(output); |
|
44 | cell.append(input).append(output); | |
45 | this.element = cell; |
|
45 | this.element = cell; | |
46 | this.collapse() |
|
46 | this.collapse() | |
47 | }; |
|
47 | }; | |
48 |
|
48 | |||
49 |
|
49 | |||
50 | CodeCell.prototype.handle_codemirror_keyevent = function (editor, event) { |
|
50 | CodeCell.prototype.handle_codemirror_keyevent = function (editor, event) { | |
51 | // This method gets called in CodeMirror's onKeyDown/onKeyPress handlers and |
|
51 | // This method gets called in CodeMirror's onKeyDown/onKeyPress handlers and | |
52 | // is used to provide custom key handling. Its return value is used to determine |
|
52 | // is used to provide custom key handling. Its return value is used to determine | |
53 | // if CodeMirror should ignore the event: true = ignore, false = don't ignore. |
|
53 | // if CodeMirror should ignore the event: true = ignore, false = don't ignore. | |
54 | if (event.keyCode === 13 && event.shiftKey) { |
|
54 | if (event.keyCode === 13 && (event.shiftKey || event.ctrlKey)) { | |
55 | // Always ignore shift-enter in CodeMirror as we handle it. |
|
55 | // Always ignore shift-enter in CodeMirror as we handle it. | |
56 | return true; |
|
56 | return true; | |
57 | } else if (event.keyCode === 9 && event.type == 'keydown') { |
|
57 | } else if (event.keyCode === 9 && event.type == 'keydown') { | |
58 | // Tab completion. |
|
58 | // Tab completion. | |
59 | var cur = editor.getCursor(); |
|
59 | var cur = editor.getCursor(); | |
60 | var pre_cursor = editor.getRange({line:cur.line,ch:0},cur).trim(); |
|
60 | var pre_cursor = editor.getRange({line:cur.line,ch:0},cur).trim(); | |
61 | if (pre_cursor === "") { |
|
61 | if (pre_cursor === "") { | |
62 | // Don't autocomplete if the part of the line before the cursor is empty. |
|
62 | // Don't autocomplete if the part of the line before the cursor is empty. | |
63 | // In this case, let CodeMirror handle indentation. |
|
63 | // In this case, let CodeMirror handle indentation. | |
64 | return false; |
|
64 | return false; | |
65 | } else { |
|
65 | } else { | |
66 | // Autocomplete the current line. |
|
66 | // Autocomplete the current line. | |
67 | event.stop(); |
|
67 | event.stop(); | |
68 | var line = editor.getLine(cur.line); |
|
68 | var line = editor.getLine(cur.line); | |
69 | this.is_completing = true; |
|
69 | this.is_completing = true; | |
70 | this.completion_cursor = cur; |
|
70 | this.completion_cursor = cur; | |
71 | IPython.notebook.complete_cell(this, line, cur.ch); |
|
71 | IPython.notebook.complete_cell(this, line, cur.ch); | |
72 | return true; |
|
72 | return true; | |
73 | } |
|
73 | } | |
74 | } else if (event.keyCode === 8 && event.type == 'keydown') { |
|
74 | } else if (event.keyCode === 8 && event.type == 'keydown') { | |
75 | // If backspace and the line ends with 4 spaces, remove them. |
|
75 | // If backspace and the line ends with 4 spaces, remove them. | |
76 | var cur = editor.getCursor(); |
|
76 | var cur = editor.getCursor(); | |
77 | var line = editor.getLine(cur.line); |
|
77 | var line = editor.getLine(cur.line); | |
78 | var ending = line.slice(-4); |
|
78 | var ending = line.slice(-4); | |
79 | if (ending === ' ') { |
|
79 | if (ending === ' ') { | |
80 | editor.replaceRange('', |
|
80 | editor.replaceRange('', | |
81 | {line: cur.line, ch: cur.ch-4}, |
|
81 | {line: cur.line, ch: cur.ch-4}, | |
82 | {line: cur.line, ch: cur.ch} |
|
82 | {line: cur.line, ch: cur.ch} | |
83 | ); |
|
83 | ); | |
84 | event.stop(); |
|
84 | event.stop(); | |
85 | return true; |
|
85 | return true; | |
86 | } else { |
|
86 | } else { | |
87 | return false; |
|
87 | return false; | |
88 | }; |
|
88 | }; | |
89 | } else { |
|
89 | } else { | |
90 | // keypress/keyup also trigger on TAB press, and we don't want to use those |
|
90 | // keypress/keyup also trigger on TAB press, and we don't want to use those | |
91 | // to disable tab completion. |
|
91 | // to disable tab completion. | |
92 | if (this.is_completing && event.keyCode !== 9) { |
|
92 | if (this.is_completing && event.keyCode !== 9) { | |
93 | var ed_cur = editor.getCursor(); |
|
93 | var ed_cur = editor.getCursor(); | |
94 | var cc_cur = this.completion_cursor; |
|
94 | var cc_cur = this.completion_cursor; | |
95 | if (ed_cur.line !== cc_cur.line || ed_cur.ch !== cc_cur.ch) { |
|
95 | if (ed_cur.line !== cc_cur.line || ed_cur.ch !== cc_cur.ch) { | |
96 | this.is_completing = false; |
|
96 | this.is_completing = false; | |
97 | this.completion_cursor = null; |
|
97 | this.completion_cursor = null; | |
98 | }; |
|
98 | }; | |
99 | }; |
|
99 | }; | |
100 | return false; |
|
100 | return false; | |
101 | }; |
|
101 | }; | |
102 | }; |
|
102 | }; | |
103 |
|
103 | |||
104 |
|
104 | |||
105 | CodeCell.prototype.finish_completing = function (matched_text, matches) { |
|
105 | CodeCell.prototype.finish_completing = function (matched_text, matches) { | |
106 | // console.log("Got matches", matched_text, matches); |
|
106 | // console.log("Got matches", matched_text, matches); | |
107 | if (!this.is_completing || matches.length === 0) {return;} |
|
107 | if (!this.is_completing || matches.length === 0) {return;} | |
108 |
|
108 | |||
109 | var that = this; |
|
109 | var that = this; | |
110 | var cur = this.completion_cursor; |
|
110 | var cur = this.completion_cursor; | |
111 |
|
111 | |||
112 | var insert = function (selected_text) { |
|
112 | var insert = function (selected_text) { | |
113 | that.code_mirror.replaceRange( |
|
113 | that.code_mirror.replaceRange( | |
114 | selected_text, |
|
114 | selected_text, | |
115 | {line: cur.line, ch: (cur.ch-matched_text.length)}, |
|
115 | {line: cur.line, ch: (cur.ch-matched_text.length)}, | |
116 | {line: cur.line, ch: cur.ch} |
|
116 | {line: cur.line, ch: cur.ch} | |
117 | ); |
|
117 | ); | |
118 | }; |
|
118 | }; | |
119 |
|
119 | |||
120 | if (matches.length === 1) { |
|
120 | if (matches.length === 1) { | |
121 | insert(matches[0]); |
|
121 | insert(matches[0]); | |
122 | setTimeout(function(){that.code_mirror.focus();}, 50); |
|
122 | setTimeout(function(){that.code_mirror.focus();}, 50); | |
123 | return; |
|
123 | return; | |
124 | }; |
|
124 | }; | |
125 |
|
125 | |||
126 | var complete = $('<div/>').addClass('completions'); |
|
126 | var complete = $('<div/>').addClass('completions'); | |
127 | var select = $('<select/>').attr('multiple','true'); |
|
127 | var select = $('<select/>').attr('multiple','true'); | |
128 | for (var i=0; i<matches.length; ++i) { |
|
128 | for (var i=0; i<matches.length; ++i) { | |
129 | select.append($('<option/>').text(matches[i])); |
|
129 | select.append($('<option/>').text(matches[i])); | |
130 | } |
|
130 | } | |
131 | select.children().first().attr('selected','true'); |
|
131 | select.children().first().attr('selected','true'); | |
132 | select.attr('size',Math.min(10,matches.length)); |
|
132 | select.attr('size',Math.min(10,matches.length)); | |
133 | var pos = this.code_mirror.cursorCoords(); |
|
133 | var pos = this.code_mirror.cursorCoords(); | |
134 | complete.css('left',pos.x+'px'); |
|
134 | complete.css('left',pos.x+'px'); | |
135 | complete.css('top',pos.yBot+'px'); |
|
135 | complete.css('top',pos.yBot+'px'); | |
136 | complete.append(select); |
|
136 | complete.append(select); | |
137 |
|
137 | |||
138 | $('body').append(complete); |
|
138 | $('body').append(complete); | |
139 | var done = false; |
|
139 | var done = false; | |
140 |
|
140 | |||
141 | var close = function () { |
|
141 | var close = function () { | |
142 | if (done) return; |
|
142 | if (done) return; | |
143 | done = true; |
|
143 | done = true; | |
144 | complete.remove(); |
|
144 | complete.remove(); | |
145 | that.is_completing = false; |
|
145 | that.is_completing = false; | |
146 | that.completion_cursor = null; |
|
146 | that.completion_cursor = null; | |
147 | }; |
|
147 | }; | |
148 |
|
148 | |||
149 | var pick = function () { |
|
149 | var pick = function () { | |
150 | insert(select.val()[0]); |
|
150 | insert(select.val()[0]); | |
151 | close(); |
|
151 | close(); | |
152 | setTimeout(function(){that.code_mirror.focus();}, 50); |
|
152 | setTimeout(function(){that.code_mirror.focus();}, 50); | |
153 | }; |
|
153 | }; | |
154 |
|
154 | |||
155 | select.blur(close); |
|
155 | select.blur(close); | |
156 | select.keydown(function (event) { |
|
156 | select.keydown(function (event) { | |
157 | var code = event.which; |
|
157 | var code = event.which; | |
158 | if (code === 13 || code === 32) { |
|
158 | if (code === 13 || code === 32) { | |
159 | // Pressing SPACE or ENTER will cause a pick |
|
159 | // Pressing SPACE or ENTER will cause a pick | |
160 | event.stopPropagation(); |
|
160 | event.stopPropagation(); | |
161 | event.preventDefault(); |
|
161 | event.preventDefault(); | |
162 | pick(); |
|
162 | pick(); | |
163 | } else if (code === 38 || code === 40) { |
|
163 | } else if (code === 38 || code === 40) { | |
164 | // We don't want the document keydown handler to handle UP/DOWN, |
|
164 | // We don't want the document keydown handler to handle UP/DOWN, | |
165 | // but we want the default action. |
|
165 | // but we want the default action. | |
166 | event.stopPropagation(); |
|
166 | event.stopPropagation(); | |
167 | } else { |
|
167 | } else { | |
168 | // All other key presses exit completion. |
|
168 | // All other key presses exit completion. | |
169 | event.stopPropagation(); |
|
169 | event.stopPropagation(); | |
170 | event.preventDefault(); |
|
170 | event.preventDefault(); | |
171 | close(); |
|
171 | close(); | |
172 | that.code_mirror.focus(); |
|
172 | that.code_mirror.focus(); | |
173 | } |
|
173 | } | |
174 | }); |
|
174 | }); | |
175 | // Double click also causes a pick. |
|
175 | // Double click also causes a pick. | |
176 | select.dblclick(pick); |
|
176 | select.dblclick(pick); | |
177 | select.focus(); |
|
177 | select.focus(); | |
178 | }; |
|
178 | }; | |
179 |
|
179 | |||
180 |
|
180 | |||
181 | CodeCell.prototype.select = function () { |
|
181 | CodeCell.prototype.select = function () { | |
182 | IPython.Cell.prototype.select.apply(this); |
|
182 | IPython.Cell.prototype.select.apply(this); | |
183 | // Todo: this dance is needed because as of CodeMirror 2.12, focus is |
|
183 | // Todo: this dance is needed because as of CodeMirror 2.12, focus is | |
184 | // not causing the cursor to blink if the editor is empty initially. |
|
184 | // not causing the cursor to blink if the editor is empty initially. | |
185 | // While this seems to fix the issue, this should be fixed |
|
185 | // While this seems to fix the issue, this should be fixed | |
186 | // in CodeMirror proper. |
|
186 | // in CodeMirror proper. | |
187 | var s = this.code_mirror.getValue(); |
|
187 | var s = this.code_mirror.getValue(); | |
188 | this.code_mirror.focus(); |
|
188 | this.code_mirror.focus(); | |
189 | if (s === '') this.code_mirror.setValue(''); |
|
189 | if (s === '') this.code_mirror.setValue(''); | |
190 | }; |
|
190 | }; | |
191 |
|
191 | |||
192 |
|
192 | |||
193 | CodeCell.prototype.select_all = function () { |
|
193 | CodeCell.prototype.select_all = function () { | |
194 | var start = {line: 0, ch: 0}; |
|
194 | var start = {line: 0, ch: 0}; | |
195 | var nlines = this.code_mirror.lineCount(); |
|
195 | var nlines = this.code_mirror.lineCount(); | |
196 | var last_line = this.code_mirror.getLine(nlines-1); |
|
196 | var last_line = this.code_mirror.getLine(nlines-1); | |
197 | var end = {line: nlines-1, ch: last_line.length}; |
|
197 | var end = {line: nlines-1, ch: last_line.length}; | |
198 | this.code_mirror.setSelection(start, end); |
|
198 | this.code_mirror.setSelection(start, end); | |
199 | }; |
|
199 | }; | |
200 |
|
200 | |||
201 |
|
201 | |||
202 | CodeCell.prototype.append_output = function (json) { |
|
202 | CodeCell.prototype.append_output = function (json) { | |
203 | this.expand(); |
|
203 | this.expand(); | |
204 | if (json.output_type === 'pyout') { |
|
204 | if (json.output_type === 'pyout') { | |
205 | this.append_pyout(json); |
|
205 | this.append_pyout(json); | |
206 | } else if (json.output_type === 'pyerr') { |
|
206 | } else if (json.output_type === 'pyerr') { | |
207 | this.append_pyerr(json); |
|
207 | this.append_pyerr(json); | |
208 | } else if (json.output_type === 'display_data') { |
|
208 | } else if (json.output_type === 'display_data') { | |
209 | this.append_display_data(json); |
|
209 | this.append_display_data(json); | |
210 | } else if (json.output_type === 'stream') { |
|
210 | } else if (json.output_type === 'stream') { | |
211 | this.append_stream(json); |
|
211 | this.append_stream(json); | |
212 | }; |
|
212 | }; | |
213 | this.outputs.push(json); |
|
213 | this.outputs.push(json); | |
214 | }; |
|
214 | }; | |
215 |
|
215 | |||
216 |
|
216 | |||
217 | CodeCell.prototype.create_output_area = function () { |
|
217 | CodeCell.prototype.create_output_area = function () { | |
218 | var oa = $("<div/>").addClass("hbox output_area"); |
|
218 | var oa = $("<div/>").addClass("hbox output_area"); | |
219 | oa.append($('<div/>').addClass('prompt')); |
|
219 | oa.append($('<div/>').addClass('prompt')); | |
220 | return oa; |
|
220 | return oa; | |
221 | }; |
|
221 | }; | |
222 |
|
222 | |||
223 |
|
223 | |||
224 | CodeCell.prototype.append_pyout = function (json) { |
|
224 | CodeCell.prototype.append_pyout = function (json) { | |
225 | n = json.prompt_number || ' '; |
|
225 | n = json.prompt_number || ' '; | |
226 | var toinsert = this.create_output_area(); |
|
226 | var toinsert = this.create_output_area(); | |
227 | toinsert.find('div.prompt').addClass('output_prompt').html('Out[' + n + ']:'); |
|
227 | toinsert.find('div.prompt').addClass('output_prompt').html('Out[' + n + ']:'); | |
228 | this.append_mime_type(json, toinsert); |
|
228 | this.append_mime_type(json, toinsert); | |
229 | this.element.find('div.output').append(toinsert); |
|
229 | this.element.find('div.output').append(toinsert); | |
230 | // If we just output latex, typeset it. |
|
230 | // If we just output latex, typeset it. | |
231 | if (json.latex !== undefined) { |
|
231 | if (json.latex !== undefined) { | |
232 | MathJax.Hub.Queue(["Typeset",MathJax.Hub]); |
|
232 | MathJax.Hub.Queue(["Typeset",MathJax.Hub]); | |
233 | }; |
|
233 | }; | |
234 | }; |
|
234 | }; | |
235 |
|
235 | |||
236 |
|
236 | |||
237 | CodeCell.prototype.append_pyerr = function (json) { |
|
237 | CodeCell.prototype.append_pyerr = function (json) { | |
238 | var tb = json.traceback; |
|
238 | var tb = json.traceback; | |
239 | if (tb !== undefined && tb.length > 0) { |
|
239 | if (tb !== undefined && tb.length > 0) { | |
240 | var s = ''; |
|
240 | var s = ''; | |
241 | var len = tb.length; |
|
241 | var len = tb.length; | |
242 | for (var i=0; i<len; i++) { |
|
242 | for (var i=0; i<len; i++) { | |
243 | s = s + tb[i] + '\n'; |
|
243 | s = s + tb[i] + '\n'; | |
244 | } |
|
244 | } | |
245 | s = s + '\n'; |
|
245 | s = s + '\n'; | |
246 | var toinsert = this.create_output_area(); |
|
246 | var toinsert = this.create_output_area(); | |
247 | this.append_text(s, toinsert); |
|
247 | this.append_text(s, toinsert); | |
248 | this.element.find('div.output').append(toinsert); |
|
248 | this.element.find('div.output').append(toinsert); | |
249 | }; |
|
249 | }; | |
250 | }; |
|
250 | }; | |
251 |
|
251 | |||
252 |
|
252 | |||
253 | CodeCell.prototype.append_stream = function (json) { |
|
253 | CodeCell.prototype.append_stream = function (json) { | |
254 | var toinsert = this.create_output_area(); |
|
254 | var toinsert = this.create_output_area(); | |
255 | this.append_text(json.text, toinsert); |
|
255 | this.append_text(json.text, toinsert); | |
256 | this.element.find('div.output').append(toinsert); |
|
256 | this.element.find('div.output').append(toinsert); | |
257 | }; |
|
257 | }; | |
258 |
|
258 | |||
259 |
|
259 | |||
260 | CodeCell.prototype.append_display_data = function (json) { |
|
260 | CodeCell.prototype.append_display_data = function (json) { | |
261 | var toinsert = this.create_output_area(); |
|
261 | var toinsert = this.create_output_area(); | |
262 | this.append_mime_type(json, toinsert) |
|
262 | this.append_mime_type(json, toinsert) | |
263 | this.element.find('div.output').append(toinsert); |
|
263 | this.element.find('div.output').append(toinsert); | |
264 | // If we just output latex, typeset it. |
|
264 | // If we just output latex, typeset it. | |
265 | if (json.latex !== undefined) { |
|
265 | if (json.latex !== undefined) { | |
266 | MathJax.Hub.Queue(["Typeset",MathJax.Hub]); |
|
266 | MathJax.Hub.Queue(["Typeset",MathJax.Hub]); | |
267 | }; |
|
267 | }; | |
268 | }; |
|
268 | }; | |
269 |
|
269 | |||
270 |
|
270 | |||
271 | CodeCell.prototype.append_mime_type = function (json, element) { |
|
271 | CodeCell.prototype.append_mime_type = function (json, element) { | |
272 | if (json.html !== undefined) { |
|
272 | if (json.html !== undefined) { | |
273 | this.append_html(json.html, element); |
|
273 | this.append_html(json.html, element); | |
274 | } else if (json.latex !== undefined) { |
|
274 | } else if (json.latex !== undefined) { | |
275 | this.append_latex(json.latex, element); |
|
275 | this.append_latex(json.latex, element); | |
276 | } else if (json.svg !== undefined) { |
|
276 | } else if (json.svg !== undefined) { | |
277 | this.append_svg(json.svg, element); |
|
277 | this.append_svg(json.svg, element); | |
278 | } else if (json.png !== undefined) { |
|
278 | } else if (json.png !== undefined) { | |
279 | this.append_png(json.png, element); |
|
279 | this.append_png(json.png, element); | |
280 | } else if (json.jpeg !== undefined) { |
|
280 | } else if (json.jpeg !== undefined) { | |
281 | this.append_jpeg(json.jpeg, element); |
|
281 | this.append_jpeg(json.jpeg, element); | |
282 | } else if (json.text !== undefined) { |
|
282 | } else if (json.text !== undefined) { | |
283 | this.append_text(json.text, element); |
|
283 | this.append_text(json.text, element); | |
284 | }; |
|
284 | }; | |
285 | }; |
|
285 | }; | |
286 |
|
286 | |||
287 |
|
287 | |||
288 | CodeCell.prototype.append_html = function (html, element) { |
|
288 | CodeCell.prototype.append_html = function (html, element) { | |
289 | var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_html rendered_html"); |
|
289 | var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_html rendered_html"); | |
290 | toinsert.append(html); |
|
290 | toinsert.append(html); | |
291 | element.append(toinsert); |
|
291 | element.append(toinsert); | |
292 | } |
|
292 | } | |
293 |
|
293 | |||
294 |
|
294 | |||
295 | CodeCell.prototype.append_text = function (data, element) { |
|
295 | CodeCell.prototype.append_text = function (data, element) { | |
296 | var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_stream"); |
|
296 | var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_stream"); | |
297 | toinsert.append($("<pre/>").html(data)); |
|
297 | toinsert.append($("<pre/>").html(data)); | |
298 | element.append(toinsert); |
|
298 | element.append(toinsert); | |
299 | }; |
|
299 | }; | |
300 |
|
300 | |||
301 |
|
301 | |||
302 | CodeCell.prototype.append_svg = function (svg, element) { |
|
302 | CodeCell.prototype.append_svg = function (svg, element) { | |
303 | var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_svg"); |
|
303 | var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_svg"); | |
304 | toinsert.append(svg); |
|
304 | toinsert.append(svg); | |
305 | element.append(toinsert); |
|
305 | element.append(toinsert); | |
306 | }; |
|
306 | }; | |
307 |
|
307 | |||
308 |
|
308 | |||
309 | CodeCell.prototype.append_png = function (png, element) { |
|
309 | CodeCell.prototype.append_png = function (png, element) { | |
310 | var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_png"); |
|
310 | var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_png"); | |
311 | toinsert.append($("<img/>").attr('src','data:image/png;base64,'+png)); |
|
311 | toinsert.append($("<img/>").attr('src','data:image/png;base64,'+png)); | |
312 | element.append(toinsert); |
|
312 | element.append(toinsert); | |
313 | }; |
|
313 | }; | |
314 |
|
314 | |||
315 |
|
315 | |||
316 | CodeCell.prototype.append_jpeg = function (jpeg, element) { |
|
316 | CodeCell.prototype.append_jpeg = function (jpeg, element) { | |
317 | var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_jpeg"); |
|
317 | var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_jpeg"); | |
318 | toinsert.append($("<img/>").attr('src','data:image/jpeg;base64,'+jpeg)); |
|
318 | toinsert.append($("<img/>").attr('src','data:image/jpeg;base64,'+jpeg)); | |
319 | element.append(toinsert); |
|
319 | element.append(toinsert); | |
320 | }; |
|
320 | }; | |
321 |
|
321 | |||
322 |
|
322 | |||
323 | CodeCell.prototype.append_latex = function (latex, element) { |
|
323 | CodeCell.prototype.append_latex = function (latex, element) { | |
324 | // This method cannot do the typesetting because the latex first has to |
|
324 | // This method cannot do the typesetting because the latex first has to | |
325 | // be on the page. |
|
325 | // be on the page. | |
326 | var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_latex"); |
|
326 | var toinsert = $("<div/>").addClass("box_flex1 output_subarea output_latex"); | |
327 | toinsert.append(latex); |
|
327 | toinsert.append(latex); | |
328 | element.append(toinsert); |
|
328 | element.append(toinsert); | |
329 | } |
|
329 | } | |
330 |
|
330 | |||
331 |
|
331 | |||
332 | CodeCell.prototype.clear_output = function () { |
|
332 | CodeCell.prototype.clear_output = function () { | |
333 | this.element.find("div.output").html(""); |
|
333 | this.element.find("div.output").html(""); | |
334 | this.outputs = []; |
|
334 | this.outputs = []; | |
335 | }; |
|
335 | }; | |
336 |
|
336 | |||
337 |
|
337 | |||
338 | CodeCell.prototype.clear_input = function () { |
|
338 | CodeCell.prototype.clear_input = function () { | |
339 | this.code_mirror.setValue(''); |
|
339 | this.code_mirror.setValue(''); | |
340 | }; |
|
340 | }; | |
341 |
|
341 | |||
342 |
|
342 | |||
343 | CodeCell.prototype.collapse = function () { |
|
343 | CodeCell.prototype.collapse = function () { | |
344 | if (!this.collapsed) { |
|
344 | if (!this.collapsed) { | |
345 | this.element.find('div.output').hide(); |
|
345 | this.element.find('div.output').hide(); | |
346 | this.collapsed = true; |
|
346 | this.collapsed = true; | |
347 | }; |
|
347 | }; | |
348 | }; |
|
348 | }; | |
349 |
|
349 | |||
350 |
|
350 | |||
351 | CodeCell.prototype.expand = function () { |
|
351 | CodeCell.prototype.expand = function () { | |
352 | if (this.collapsed) { |
|
352 | if (this.collapsed) { | |
353 | this.element.find('div.output').show(); |
|
353 | this.element.find('div.output').show(); | |
354 | this.collapsed = false; |
|
354 | this.collapsed = false; | |
355 | }; |
|
355 | }; | |
356 | }; |
|
356 | }; | |
357 |
|
357 | |||
358 |
|
358 | |||
359 | CodeCell.prototype.toggle_output = function () { |
|
359 | CodeCell.prototype.toggle_output = function () { | |
360 | if (this.collapsed) { |
|
360 | if (this.collapsed) { | |
361 | this.expand(); |
|
361 | this.expand(); | |
362 | } else { |
|
362 | } else { | |
363 | this.collapse(); |
|
363 | this.collapse(); | |
364 | }; |
|
364 | }; | |
365 | }; |
|
365 | }; | |
366 |
|
366 | |||
367 | CodeCell.prototype.set_input_prompt = function (number) { |
|
367 | CodeCell.prototype.set_input_prompt = function (number) { | |
368 | var n = number || ' '; |
|
368 | var n = number || ' '; | |
369 | this.input_prompt_number = n |
|
369 | this.input_prompt_number = n | |
370 | this.element.find('div.input_prompt').html('In [' + n + ']:'); |
|
370 | this.element.find('div.input_prompt').html('In [' + n + ']:'); | |
371 | }; |
|
371 | }; | |
372 |
|
372 | |||
373 |
|
373 | |||
374 | CodeCell.prototype.get_code = function () { |
|
374 | CodeCell.prototype.get_code = function () { | |
375 | return this.code_mirror.getValue(); |
|
375 | return this.code_mirror.getValue(); | |
376 | }; |
|
376 | }; | |
377 |
|
377 | |||
378 |
|
378 | |||
379 | CodeCell.prototype.set_code = function (code) { |
|
379 | CodeCell.prototype.set_code = function (code) { | |
380 | return this.code_mirror.setValue(code); |
|
380 | return this.code_mirror.setValue(code); | |
381 | }; |
|
381 | }; | |
382 |
|
382 | |||
383 |
|
383 | |||
384 | CodeCell.prototype.at_top = function () { |
|
384 | CodeCell.prototype.at_top = function () { | |
385 | var cursor = this.code_mirror.getCursor(); |
|
385 | var cursor = this.code_mirror.getCursor(); | |
386 | if (cursor.line === 0) { |
|
386 | if (cursor.line === 0) { | |
387 | return true; |
|
387 | return true; | |
388 | } else { |
|
388 | } else { | |
389 | return false; |
|
389 | return false; | |
390 | } |
|
390 | } | |
391 | }; |
|
391 | }; | |
392 |
|
392 | |||
393 |
|
393 | |||
394 | CodeCell.prototype.at_bottom = function () { |
|
394 | CodeCell.prototype.at_bottom = function () { | |
395 | var cursor = this.code_mirror.getCursor(); |
|
395 | var cursor = this.code_mirror.getCursor(); | |
396 | if (cursor.line === (this.code_mirror.lineCount()-1)) { |
|
396 | if (cursor.line === (this.code_mirror.lineCount()-1)) { | |
397 | return true; |
|
397 | return true; | |
398 | } else { |
|
398 | } else { | |
399 | return false; |
|
399 | return false; | |
400 | } |
|
400 | } | |
401 | }; |
|
401 | }; | |
402 |
|
402 | |||
403 |
|
403 | |||
404 | CodeCell.prototype.fromJSON = function (data) { |
|
404 | CodeCell.prototype.fromJSON = function (data) { | |
405 | // console.log('Import from JSON:', data); |
|
405 | // console.log('Import from JSON:', data); | |
406 | if (data.cell_type === 'code') { |
|
406 | if (data.cell_type === 'code') { | |
407 | if (data.input !== undefined) { |
|
407 | if (data.input !== undefined) { | |
408 | this.set_code(data.input); |
|
408 | this.set_code(data.input); | |
409 | } |
|
409 | } | |
410 | if (data.prompt_number !== undefined) { |
|
410 | if (data.prompt_number !== undefined) { | |
411 | this.set_input_prompt(data.prompt_number); |
|
411 | this.set_input_prompt(data.prompt_number); | |
412 | } else { |
|
412 | } else { | |
413 | this.set_input_prompt(); |
|
413 | this.set_input_prompt(); | |
414 | }; |
|
414 | }; | |
415 | var len = data.outputs.length; |
|
415 | var len = data.outputs.length; | |
416 | for (var i=0; i<len; i++) { |
|
416 | for (var i=0; i<len; i++) { | |
417 | this.append_output(data.outputs[i]); |
|
417 | this.append_output(data.outputs[i]); | |
418 | }; |
|
418 | }; | |
419 | if (data.collapsed !== undefined) { |
|
419 | if (data.collapsed !== undefined) { | |
420 | if (data.collapsed) { |
|
420 | if (data.collapsed) { | |
421 | this.collapse(); |
|
421 | this.collapse(); | |
422 | }; |
|
422 | }; | |
423 | }; |
|
423 | }; | |
424 | }; |
|
424 | }; | |
425 | }; |
|
425 | }; | |
426 |
|
426 | |||
427 |
|
427 | |||
428 | CodeCell.prototype.toJSON = function () { |
|
428 | CodeCell.prototype.toJSON = function () { | |
429 | var data = {}; |
|
429 | var data = {}; | |
430 | data.input = this.get_code(); |
|
430 | data.input = this.get_code(); | |
431 | data.cell_type = 'code'; |
|
431 | data.cell_type = 'code'; | |
432 | if (this.input_prompt_number !== ' ') { |
|
432 | if (this.input_prompt_number !== ' ') { | |
433 | data.prompt_number = this.input_prompt_number |
|
433 | data.prompt_number = this.input_prompt_number | |
434 | }; |
|
434 | }; | |
435 | var outputs = []; |
|
435 | var outputs = []; | |
436 | var len = this.outputs.length; |
|
436 | var len = this.outputs.length; | |
437 | for (var i=0; i<len; i++) { |
|
437 | for (var i=0; i<len; i++) { | |
438 | outputs[i] = this.outputs[i]; |
|
438 | outputs[i] = this.outputs[i]; | |
439 | }; |
|
439 | }; | |
440 | data.outputs = outputs; |
|
440 | data.outputs = outputs; | |
441 | data.language = 'python'; |
|
441 | data.language = 'python'; | |
442 | data.collapsed = this.collapsed; |
|
442 | data.collapsed = this.collapsed; | |
443 | // console.log('Export to JSON:',data); |
|
443 | // console.log('Export to JSON:',data); | |
444 | return data; |
|
444 | return data; | |
445 | }; |
|
445 | }; | |
446 |
|
446 | |||
447 |
|
447 | |||
448 | IPython.CodeCell = CodeCell; |
|
448 | IPython.CodeCell = CodeCell; | |
449 |
|
449 | |||
450 | return IPython; |
|
450 | return IPython; | |
451 | }(IPython)); |
|
451 | }(IPython)); | |
452 |
|
452 |
General Comments 0
You need to be logged in to leave comments.
Login now