outputarea.js
730 lines
| 23.6 KiB
| application/javascript
|
JavascriptLexer
|
r7177 | //---------------------------------------------------------------------------- | ||
|
r10776 | // Copyright (C) 2008 The IPython Development Team | ||
|
r7177 | // | ||
// Distributed under the terms of the BSD License. The full license is in | ||||
// the file COPYING, distributed as part of this software. | ||||
//---------------------------------------------------------------------------- | ||||
//============================================================================ | ||||
// OutputArea | ||||
//============================================================================ | ||||
|
r10776 | /** | ||
* @module IPython | ||||
* @namespace IPython | ||||
* @submodule OutputArea | ||||
*/ | ||||
|
r7177 | var IPython = (function (IPython) { | ||
"use strict"; | ||||
var utils = IPython.utils; | ||||
|
r10776 | /** | ||
* @class OutputArea | ||||
* | ||||
* @constructor | ||||
*/ | ||||
|
r7177 | var OutputArea = function (selector, prompt_area) { | ||
this.selector = selector; | ||||
|
r7362 | this.wrapper = $(selector); | ||
|
r7177 | this.outputs = []; | ||
this.collapsed = false; | ||||
|
r7362 | this.scrolled = false; | ||
|
r12592 | this.clear_queued = null; | ||
|
r7177 | if (prompt_area === undefined) { | ||
this.prompt_area = true; | ||||
|
r7181 | } else { | ||
this.prompt_area = prompt_area; | ||||
|
r9555 | } | ||
|
r7362 | this.create_elements(); | ||
|
r7177 | this.style(); | ||
|
r7362 | this.bind_events(); | ||
}; | ||||
OutputArea.prototype.create_elements = function () { | ||||
this.element = $("<div/>"); | ||||
this.collapse_button = $("<div/>"); | ||||
this.prompt_overlay = $("<div/>"); | ||||
this.wrapper.append(this.prompt_overlay); | ||||
this.wrapper.append(this.element); | ||||
this.wrapper.append(this.collapse_button); | ||||
|
r7177 | }; | ||
OutputArea.prototype.style = function () { | ||||
|
r7362 | this.collapse_button.hide(); | ||
this.prompt_overlay.hide(); | ||||
this.wrapper.addClass('output_wrapper'); | ||||
|
r13332 | this.element.addClass('output'); | ||
|
r7362 | |||
|
r10897 | this.collapse_button.addClass("btn output_collapsed"); | ||
|
r9903 | this.collapse_button.attr('title', 'click to expand output'); | ||
|
r7362 | this.collapse_button.html('. . .'); | ||
this.prompt_overlay.addClass('out_prompt_overlay prompt'); | ||||
|
r9903 | this.prompt_overlay.attr('title', 'click to expand output; double click to hide output'); | ||
|
r7362 | |||
|
r7177 | this.collapse(); | ||
}; | ||||
|
r10776 | /** | ||
* Should the OutputArea scroll? | ||||
* Returns whether the height (in lines) exceeds a threshold. | ||||
* | ||||
* @private | ||||
* @method _should_scroll | ||||
* @param [lines=100]{Integer} | ||||
* @return {Bool} | ||||
* | ||||
*/ | ||||
|
r7362 | OutputArea.prototype._should_scroll = function (lines) { | ||
|
r10776 | if (lines <=0 ){ return } | ||
|
r7362 | if (!lines) { | ||
|
r7728 | lines = 100; | ||
|
r7362 | } | ||
// line-height from http://stackoverflow.com/questions/1185151 | ||||
var fontSize = this.element.css('font-size'); | ||||
var lineHeight = Math.floor(parseInt(fontSize.replace('px','')) * 1.5); | ||||
return (this.element.height() > lines * lineHeight); | ||||
}; | ||||
OutputArea.prototype.bind_events = function () { | ||||
var that = this; | ||||
this.prompt_overlay.dblclick(function () { that.toggle_output(); }); | ||||
this.prompt_overlay.click(function () { that.toggle_scroll(); }); | ||||
this.element.resize(function () { | ||||
|
r7733 | // FIXME: Firefox on Linux misbehaves, so automatic scrolling is disabled | ||
|
r9227 | if ( IPython.utils.browser[0] === "Firefox" ) { | ||
|
r7733 | return; | ||
} | ||||
|
r7362 | // maybe scroll output, | ||
// if it's grown large enough and hasn't already been scrolled. | ||||
|
r10776 | if ( !that.scrolled && that._should_scroll(OutputArea.auto_scroll_threshold)) { | ||
|
r7362 | that.scroll_area(); | ||
} | ||||
}); | ||||
this.collapse_button.click(function () { | ||||
that.expand(); | ||||
}); | ||||
}; | ||||
|
r7177 | OutputArea.prototype.collapse = function () { | ||
if (!this.collapsed) { | ||||
this.element.hide(); | ||||
|
r7362 | this.prompt_overlay.hide(); | ||
if (this.element.html()){ | ||||
this.collapse_button.show(); | ||||
} | ||||
|
r7177 | this.collapsed = true; | ||
|
r9555 | } | ||
|
r7177 | }; | ||
OutputArea.prototype.expand = function () { | ||||
if (this.collapsed) { | ||||
|
r7362 | this.collapse_button.hide(); | ||
|
r7177 | this.element.show(); | ||
|
r7362 | this.prompt_overlay.show(); | ||
|
r7177 | this.collapsed = false; | ||
|
r9555 | } | ||
|
r7177 | }; | ||
OutputArea.prototype.toggle_output = function () { | ||||
if (this.collapsed) { | ||||
this.expand(); | ||||
} else { | ||||
this.collapse(); | ||||
|
r9555 | } | ||
|
r7177 | }; | ||
|
r7362 | OutputArea.prototype.scroll_area = function () { | ||
this.element.addClass('output_scroll'); | ||||
|
r7423 | this.prompt_overlay.attr('title', 'click to unscroll output; double click to hide'); | ||
|
r7362 | this.scrolled = true; | ||
}; | ||||
OutputArea.prototype.unscroll_area = function () { | ||||
this.element.removeClass('output_scroll'); | ||||
|
r7423 | this.prompt_overlay.attr('title', 'click to scroll output; double click to hide'); | ||
|
r7362 | this.scrolled = false; | ||
}; | ||||
|
r10776 | /** | ||
* Threshold to trigger autoscroll when the OutputArea is resized, | ||||
* typically when new outputs are added. | ||||
* | ||||
|
r10782 | * Behavior is undefined if autoscroll is lower than minimum_scroll_threshold, | ||
|
r10778 | * unless it is < 0, in which case autoscroll will never be triggered | ||
|
r10776 | * | ||
* @property auto_scroll_threshold | ||||
* @type Number | ||||
|
r10812 | * @default 100 | ||
|
r10776 | * | ||
**/ | ||||
|
r10812 | OutputArea.auto_scroll_threshold = 100; | ||
|
r10776 | |||
/** | ||||
|
r10778 | * Lower limit (in lines) for OutputArea to be made scrollable. OutputAreas | ||
* shorter than this are never scrolled. | ||||
|
r10776 | * | ||
|
r10782 | * @property minimum_scroll_threshold | ||
|
r10776 | * @type Number | ||
* @default 20 | ||||
* | ||||
**/ | ||||
|
r10782 | OutputArea.minimum_scroll_threshold = 20; | ||
|
r10776 | |||
/** | ||||
* | ||||
|
r10778 | * Scroll OutputArea if height supperior than a threshold (in lines). | ||
|
r10776 | * | ||
|
r10778 | * Threshold is a maximum number of lines. If unspecified, defaults to | ||
|
r10782 | * OutputArea.minimum_scroll_threshold. | ||
|
r10778 | * | ||
|
r10793 | * Negative threshold will prevent the OutputArea from ever scrolling. | ||
|
r10776 | * | ||
* @method scroll_if_long | ||||
|
r10793 | * | ||
* @param [lines=20]{Number} Default to 20 if not set, | ||||
* behavior undefined for value of `0`. | ||||
|
r10776 | * | ||
**/ | ||||
|
r7362 | OutputArea.prototype.scroll_if_long = function (lines) { | ||
|
r10782 | var n = lines | OutputArea.minimum_scroll_threshold; | ||
|
r10776 | if(n <= 0){ | ||
return | ||||
} | ||||
if (this._should_scroll(n)) { | ||||
|
r7362 | // only allow scrolling long-enough output | ||
this.scroll_area(); | ||||
|
r9555 | } | ||
|
r7362 | }; | ||
OutputArea.prototype.toggle_scroll = function () { | ||||
if (this.scrolled) { | ||||
this.unscroll_area(); | ||||
} else { | ||||
// only allow scrolling long-enough output | ||||
|
r10776 | this.scroll_if_long(); | ||
|
r9555 | } | ||
|
r7362 | }; | ||
|
r7177 | // typeset with MathJax if MathJax is available | ||
OutputArea.prototype.typeset = function () { | ||||
if (window.MathJax){ | ||||
MathJax.Hub.Queue(["Typeset",MathJax.Hub]); | ||||
} | ||||
}; | ||||
|
r13207 | OutputArea.prototype.handle_output = function (msg) { | ||
|
r7177 | var json = {}; | ||
|
r13207 | var msg_type = json.output_type = msg.header.msg_type; | ||
var content = msg.content; | ||||
|
r7177 | if (msg_type === "stream") { | ||
json.text = content.data; | ||||
json.stream = content.name; | ||||
} else if (msg_type === "display_data") { | ||||
json = this.convert_mime_types(json, content.data); | ||||
|
r10445 | json.metadata = this.convert_mime_types({}, content.metadata); | ||
|
r7177 | } else if (msg_type === "pyout") { | ||
json.prompt_number = content.execution_count; | ||||
json = this.convert_mime_types(json, content.data); | ||||
|
r10445 | json.metadata = this.convert_mime_types({}, content.metadata); | ||
|
r7177 | } else if (msg_type === "pyerr") { | ||
json.ename = content.ename; | ||||
json.evalue = content.evalue; | ||||
json.traceback = content.traceback; | ||||
|
r9555 | } | ||
|
r7177 | // append with dynamic=true | ||
this.append_output(json, true); | ||||
}; | ||||
OutputArea.prototype.convert_mime_types = function (json, data) { | ||||
|
r11673 | if (data === undefined) { | ||
return json; | ||||
} | ||||
|
r7177 | if (data['text/plain'] !== undefined) { | ||
json.text = data['text/plain']; | ||||
|
r9555 | } | ||
|
r7177 | if (data['text/html'] !== undefined) { | ||
json.html = data['text/html']; | ||||
|
r9555 | } | ||
|
r7177 | if (data['image/svg+xml'] !== undefined) { | ||
json.svg = data['image/svg+xml']; | ||||
|
r9555 | } | ||
|
r7177 | if (data['image/png'] !== undefined) { | ||
json.png = data['image/png']; | ||||
|
r9555 | } | ||
|
r7177 | if (data['image/jpeg'] !== undefined) { | ||
json.jpeg = data['image/jpeg']; | ||||
|
r9555 | } | ||
|
r7177 | if (data['text/latex'] !== undefined) { | ||
json.latex = data['text/latex']; | ||||
|
r9555 | } | ||
|
r7177 | if (data['application/json'] !== undefined) { | ||
json.json = data['application/json']; | ||||
|
r9555 | } | ||
|
r7177 | if (data['application/javascript'] !== undefined) { | ||
json.javascript = data['application/javascript']; | ||||
} | ||||
return json; | ||||
}; | ||||
OutputArea.prototype.append_output = function (json, dynamic) { | ||||
// If dynamic is true, javascript output will be eval'd. | ||||
this.expand(); | ||||
|
r12592 | // Clear the output if clear is queued. | ||
|
r12817 | var needs_height_reset = false; | ||
|
r12592 | if (this.clear_queued) { | ||
this.clear_output(false); | ||||
|
r12817 | needs_height_reset = true; | ||
|
r12592 | } | ||
|
r7177 | if (json.output_type === 'pyout') { | ||
this.append_pyout(json, dynamic); | ||||
} else if (json.output_type === 'pyerr') { | ||||
this.append_pyerr(json); | ||||
} else if (json.output_type === 'display_data') { | ||||
this.append_display_data(json, dynamic); | ||||
} else if (json.output_type === 'stream') { | ||||
this.append_stream(json); | ||||
|
r9555 | } | ||
|
r7177 | this.outputs.push(json); | ||
|
r12817 | |||
// Only reset the height to automatic if the height is currently | ||||
// fixed (done by wait=True flag on clear_output). | ||||
if (needs_height_reset) { | ||||
|
r12878 | this.element.height(''); | ||
|
r12817 | } | ||
|
r7362 | var that = this; | ||
setTimeout(function(){that.element.trigger('resize');}, 100); | ||||
|
r7177 | }; | ||
OutputArea.prototype.create_output_area = function () { | ||||
|
r10216 | var oa = $("<div/>").addClass("output_area"); | ||
|
r7177 | if (this.prompt_area) { | ||
oa.append($('<div/>').addClass('prompt')); | ||||
} | ||||
return oa; | ||||
}; | ||||
|
r13412 | |||
OutputArea.prototype.create_output_subarea = function(md, classes) { | ||||
var subarea = $('<div/>').addClass('output_subarea').addClass(classes); | ||||
if (md['isolated']) { | ||||
// Create an iframe to isolate the subarea from the rest of the | ||||
// document | ||||
|
r13418 | var iframe = $('<iframe/>').addClass('box-flex1'); | ||
|
r13419 | iframe.css({'height':1, 'width':'100%', 'display':'block'}); | ||
|
r13412 | iframe.attr('frameborder', 0); | ||
iframe.attr('scrolling', 'auto'); | ||||
// Once the iframe is loaded, the subarea is dynamically inserted | ||||
iframe.on('load', function() { | ||||
// Workaround needed by Firefox, to properly render svg inside | ||||
// iframes, see http://stackoverflow.com/questions/10177190/ | ||||
// svg-dynamically-added-to-iframe-does-not-render-correctly | ||||
this.contentDocument.open(); | ||||
// Insert the subarea into the iframe | ||||
// We must directly write the html. When using Jquery's append | ||||
// method, javascript is evaluated in the parent document and | ||||
// not in the iframe document. | ||||
this.contentDocument.write(subarea.html()); | ||||
this.contentDocument.close(); | ||||
var body = this.contentDocument.body; | ||||
|
r13418 | // Adjust the iframe height automatically | ||
|
r13412 | iframe.height(body.scrollHeight + 'px'); | ||
}); | ||||
// Elements should be appended to the inner subarea and not to the | ||||
// iframe | ||||
iframe.append = function(that) { | ||||
subarea.append(that); | ||||
}; | ||||
return iframe; | ||||
} else { | ||||
return subarea; | ||||
} | ||||
} | ||||
|
r13792 | OutputArea.prototype._append_javascript_error = function (err, element) { | ||
|
r12332 | // display a message when a javascript error occurs in display output | ||
var msg = "Javascript error adding output!" | ||||
|
r13792 | if ( element === undefined ) return; | ||
element.append( | ||||
|
r12332 | $('<div/>').html(msg + "<br/>" + | ||
err.toString() + | ||||
'<br/>See your browser Javascript console for more details.' | ||||
).addClass('js-error') | ||||
); | ||||
}; | ||||
OutputArea.prototype._safe_append = function (toinsert) { | ||||
// safely append an item to the document | ||||
// this is an object created by user code, | ||||
// and may have errors, which should not be raised | ||||
// under any circumstances. | ||||
try { | ||||
this.element.append(toinsert); | ||||
} catch(err) { | ||||
console.log(err); | ||||
|
r13792 | // Create an actual output_area and output_subarea, which creates | ||
// the prompt area and the proper indentation. | ||||
var toinsert = this.create_output_area(); | ||||
var subarea = $('<div/>').addClass('output_subarea'); | ||||
toinsert.append(subarea); | ||||
this._append_javascript_error(err, subarea); | ||||
this.element.append(toinsert); | ||||
|
r12332 | } | ||
}; | ||||
|
r7177 | |||
OutputArea.prototype.append_pyout = function (json, dynamic) { | ||||
var n = json.prompt_number || ' '; | ||||
var toinsert = this.create_output_area(); | ||||
if (this.prompt_area) { | ||||
toinsert.find('div.prompt').addClass('output_prompt').html('Out[' + n + ']:'); | ||||
} | ||||
this.append_mime_type(json, toinsert, dynamic); | ||||
|
r12332 | this._safe_append(toinsert); | ||
|
r7177 | // If we just output latex, typeset it. | ||
if ((json.latex !== undefined) || (json.html !== undefined)) { | ||||
this.typeset(); | ||||
|
r9555 | } | ||
|
r7177 | }; | ||
OutputArea.prototype.append_pyerr = function (json) { | ||||
var tb = json.traceback; | ||||
if (tb !== undefined && tb.length > 0) { | ||||
var s = ''; | ||||
var len = tb.length; | ||||
for (var i=0; i<len; i++) { | ||||
s = s + tb[i] + '\n'; | ||||
} | ||||
s = s + '\n'; | ||||
var toinsert = this.create_output_area(); | ||||
|
r10445 | this.append_text(s, {}, toinsert); | ||
|
r12332 | this._safe_append(toinsert); | ||
|
r9555 | } | ||
|
r7177 | }; | ||
OutputArea.prototype.append_stream = function (json) { | ||||
// temporary fix: if stream undefined (json file written prior to this patch), | ||||
// default to most likely stdout: | ||||
if (json.stream == undefined){ | ||||
json.stream = 'stdout'; | ||||
} | ||||
|
r7350 | var text = json.text; | ||
|
r7177 | var subclass = "output_"+json.stream; | ||
if (this.outputs.length > 0){ | ||||
// have at least one output to consider | ||||
var last = this.outputs[this.outputs.length-1]; | ||||
if (last.output_type == 'stream' && json.stream == last.stream){ | ||||
// latest output was in the same stream, | ||||
// so append directly into its pre tag | ||||
// escape ANSI & HTML specials: | ||||
|
r7350 | var pre = this.element.find('div.'+subclass).last().find('pre'); | ||
var html = utils.fixCarriageReturn( | ||||
|
r7339 | pre.html() + utils.fixConsole(text)); | ||
pre.html(html); | ||||
|
r7177 | return; | ||
} | ||||
} | ||||
|
r7339 | |||
if (!text.replace("\r", "")) { | ||||
// text is nothing (empty string, \r, etc.) | ||||
// so don't append any elements, which might add undesirable space | ||||
return; | ||||
} | ||||
|
r7177 | // If we got here, attach a new div | ||
var toinsert = this.create_output_area(); | ||||
|
r10445 | this.append_text(text, {}, toinsert, "output_stream "+subclass); | ||
|
r12332 | this._safe_append(toinsert); | ||
|
r7177 | }; | ||
OutputArea.prototype.append_display_data = function (json, dynamic) { | ||||
var toinsert = this.create_output_area(); | ||||
|
r13454 | if (this.append_mime_type(json, toinsert, dynamic)) { | ||
this._safe_append(toinsert); | ||||
// If we just output latex, typeset it. | ||||
if ( (json.latex !== undefined) || (json.html !== undefined) ) { | ||||
this.typeset(); | ||||
} | ||||
|
r9555 | } | ||
|
r7177 | }; | ||
|
r10398 | OutputArea.display_order = ['javascript','html','latex','svg','png','jpeg','text']; | ||
|
r7177 | |||
OutputArea.prototype.append_mime_type = function (json, element, dynamic) { | ||||
|
r9540 | for(var type_i in OutputArea.display_order){ | ||
var type = OutputArea.display_order[type_i]; | ||||
if(json[type] != undefined ){ | ||||
|
r10445 | var md = {}; | ||
if (json.metadata && json.metadata[type]) { | ||||
md = json.metadata[type]; | ||||
}; | ||||
|
r9715 | if(type == 'javascript'){ | ||
if (dynamic) { | ||||
|
r10445 | this.append_javascript(json.javascript, md, element, dynamic); | ||
|
r13454 | return true; | ||
|
r9715 | } | ||
|
r9553 | } else { | ||
|
r10445 | this['append_'+type](json[type], md, element); | ||
|
r13454 | return true; | ||
|
r9540 | } | ||
|
r13454 | return false; | ||
|
r9540 | } | ||
} | ||||
|
r13454 | return false; | ||
|
r7177 | }; | ||
|
r10445 | OutputArea.prototype.append_html = function (html, md, element) { | ||
|
r13412 | var toinsert = this.create_output_subarea(md, "output_html rendered_html"); | ||
|
r7177 | toinsert.append(html); | ||
element.append(toinsert); | ||||
}; | ||||
|
r10445 | OutputArea.prototype.append_javascript = function (js, md, container) { | ||
|
r7177 | // We just eval the JS code, element appears in the local scope. | ||
|
r13792 | var element = this.create_output_subarea(md, "output_javascript"); | ||
|
r7177 | container.append(element); | ||
|
r8071 | try { | ||
eval(js); | ||||
} catch(err) { | ||||
|
r13792 | console.log(err); | ||
this._append_javascript_error(err, element); | ||||
|
r8071 | } | ||
|
r9555 | }; | ||
|
r7177 | |||
|
r10445 | OutputArea.prototype.append_text = function (data, md, element, extra_class) { | ||
|
r13412 | var toinsert = this.create_output_subarea(md, "output_text"); | ||
|
r7177 | // escape ANSI & HTML specials in plaintext: | ||
data = utils.fixConsole(data); | ||||
|
r7339 | data = utils.fixCarriageReturn(data); | ||
|
r8528 | data = utils.autoLinkUrls(data); | ||
|
r7177 | if (extra_class){ | ||
toinsert.addClass(extra_class); | ||||
} | ||||
toinsert.append($("<pre/>").html(data)); | ||||
element.append(toinsert); | ||||
}; | ||||
|
r10445 | OutputArea.prototype.append_svg = function (svg, md, element) { | ||
|
r13412 | var toinsert = this.create_output_subarea(md, "output_svg"); | ||
|
r7355 | toinsert.append(svg); | ||
element.append(toinsert); | ||||
|
r7177 | }; | ||
|
r7601 | OutputArea.prototype._dblclick_to_reset_size = function (img) { | ||
// schedule wrapping image in resizable after a delay, | ||||
// so we don't end up calling resize on a zero-size object | ||||
var that = this; | ||||
|
r7599 | setTimeout(function () { | ||
|
r7601 | var h0 = img.height(); | ||
var w0 = img.width(); | ||||
if (!(h0 && w0)) { | ||||
// zero size, schedule another timeout | ||||
that._dblclick_to_reset_size(img); | ||||
|
r9555 | return; | ||
|
r7601 | } | ||
|
r7599 | img.resizable({ | ||
aspectRatio: true, | ||||
|
r7601 | autoHide: true | ||
}); | ||||
img.dblclick(function () { | ||||
// resize wrapper & image together for some reason: | ||||
img.parent().height(h0); | ||||
img.height(h0); | ||||
img.parent().width(w0); | ||||
img.width(w0); | ||||
|
r7599 | }); | ||
}, 250); | ||||
|
r9555 | }; | ||
|
r7601 | |||
|
r10445 | OutputArea.prototype.append_png = function (png, md, element) { | ||
|
r13412 | var toinsert = this.create_output_subarea(md, "output_png"); | ||
|
r13579 | var img = $("<img/>"); | ||
|
r13573 | img[0].setAttribute('src','data:image/png;base64,'+png); | ||
|
r10445 | if (md['height']) { | ||
|
r13573 | img[0].setAttribute('height', md['height']); | ||
|
r10445 | } | ||
if (md['width']) { | ||||
|
r13573 | img[0].setAttribute('width', md['width']); | ||
|
r10445 | } | ||
|
r7601 | this._dblclick_to_reset_size(img); | ||
|
r7352 | toinsert.append(img); | ||
|
r7177 | element.append(toinsert); | ||
}; | ||||
|
r10445 | OutputArea.prototype.append_jpeg = function (jpeg, md, element) { | ||
|
r13412 | var toinsert = this.create_output_subarea(md, "output_jpeg"); | ||
|
r7352 | var img = $("<img/>").attr('src','data:image/jpeg;base64,'+jpeg); | ||
|
r10445 | if (md['height']) { | ||
img.attr('height', md['height']); | ||||
} | ||||
if (md['width']) { | ||||
img.attr('width', md['width']); | ||||
} | ||||
|
r7601 | this._dblclick_to_reset_size(img); | ||
|
r7352 | toinsert.append(img); | ||
|
r7177 | element.append(toinsert); | ||
}; | ||||
|
r10445 | OutputArea.prototype.append_latex = function (latex, md, element) { | ||
|
r7177 | // This method cannot do the typesetting because the latex first has to | ||
// be on the page. | ||||
|
r13412 | var toinsert = this.create_output_subarea(md, "output_latex"); | ||
|
r7177 | toinsert.append(latex); | ||
element.append(toinsert); | ||||
}; | ||||
|
r10776 | |||
|
r13207 | OutputArea.prototype.append_raw_input = function (msg) { | ||
|
r10370 | var that = this; | ||
|
r10368 | this.expand(); | ||
|
r13207 | var content = msg.content; | ||
|
r10368 | var area = this.create_output_area(); | ||
|
r11612 | |||
// disable any other raw_inputs, if they are left around | ||||
$("div.output_subarea.raw_input").remove(); | ||||
|
r10368 | area.append( | ||
$("<div/>") | ||||
.addClass("box-flex1 output_subarea raw_input") | ||||
.append( | ||||
|
r10370 | $("<span/>") | ||
.addClass("input_prompt") | ||||
.text(content.prompt) | ||||
) | ||||
.append( | ||||
$("<input/>") | ||||
.addClass("raw_input") | ||||
.attr('type', 'text') | ||||
|
r10934 | .attr("size", 47) | ||
|
r10370 | .keydown(function (event, ui) { | ||
// make sure we submit on enter, | ||||
// and don't re-execute the *cell* on shift-enter | ||||
if (event.which === utils.keycodes.ENTER) { | ||||
that._submit_raw_input(); | ||||
return false; | ||||
} | ||||
}) | ||||
|
r10368 | ) | ||
|
r10370 | ); | ||
|
r10368 | this.element.append(area); | ||
|
r10934 | // weirdly need double-focus now, | ||
// otherwise only the cell will be focused | ||||
area.find("input.raw_input").focus().focus(); | ||||
|
r10368 | } | ||
OutputArea.prototype._submit_raw_input = function (evt) { | ||||
var container = this.element.find("div.raw_input"); | ||||
var theprompt = container.find("span.input_prompt"); | ||||
var theinput = container.find("input.raw_input"); | ||||
|
r10934 | var value = theinput.val(); | ||
|
r10368 | var content = { | ||
output_type : 'stream', | ||||
name : 'stdout', | ||||
text : theprompt.text() + value + '\n' | ||||
} | ||||
// remove form container | ||||
container.parent().remove(); | ||||
// replace with plaintext version in stdout | ||||
this.append_output(content, false); | ||||
$([IPython.events]).trigger('send_input_reply.Kernel', value); | ||||
} | ||||
|
r7177 | |||
|
r13207 | OutputArea.prototype.handle_clear_output = function (msg) { | ||
this.clear_output(msg.content.wait); | ||||
|
r9555 | }; | ||
|
r7177 | |||
|
r12592 | OutputArea.prototype.clear_output = function(wait) { | ||
if (wait) { | ||||
|
r12582 | |||
|
r12592 | // If a clear is queued, clear before adding another to the queue. | ||
if (this.clear_queued) { | ||||
this.clear_output(false); | ||||
}; | ||||
this.clear_queued = true; | ||||
} else { | ||||
|
r12606 | // Fix the output div's height if the clear_output is waiting for | ||
// new output (it is being used in an animation). | ||||
if (this.clear_queued) { | ||||
var height = this.element.height(); | ||||
this.element.height(height); | ||||
this.clear_queued = false; | ||||
} | ||||
|
r12592 | // clear all, no need for logic | ||
this.element.html(""); | ||||
this.outputs = []; | ||||
this.unscroll_area(); | ||||
return; | ||||
}; | ||||
|
r7177 | }; | ||
// JSON serialization | ||||
OutputArea.prototype.fromJSON = function (outputs) { | ||||
var len = outputs.length; | ||||
for (var i=0; i<len; i++) { | ||||
// append with dynamic=false. | ||||
this.append_output(outputs[i], false); | ||||
|
r9555 | } | ||
|
r7177 | }; | ||
OutputArea.prototype.toJSON = function () { | ||||
var outputs = []; | ||||
var len = this.outputs.length; | ||||
for (var i=0; i<len; i++) { | ||||
outputs[i] = this.outputs[i]; | ||||
|
r9555 | } | ||
|
r7177 | return outputs; | ||
}; | ||||
IPython.OutputArea = OutputArea; | ||||
return IPython; | ||||
}(IPython)); | ||||