Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

emit event on appended element on dom #4774

Merged
merged 5 commits into from
Feb 5, 2014
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
172 changes: 98 additions & 74 deletions IPython/html/static/notebook/js/outputarea.js
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,12 @@ var IPython = (function (IPython) {
this.style();
this.bind_events();
};



/**
* Class prototypes
**/

OutputArea.prototype.create_elements = function () {
this.element = $("<div/>");
this.collapse_button = $("<div/>");
Expand Down Expand Up @@ -158,33 +163,6 @@ var IPython = (function (IPython) {
this.scrolled = false;
};

/**
* Threshold to trigger autoscroll when the OutputArea is resized,
* typically when new outputs are added.
*
* Behavior is undefined if autoscroll is lower than minimum_scroll_threshold,
* unless it is < 0, in which case autoscroll will never be triggered
*
* @property auto_scroll_threshold
* @type Number
* @default 100
*
**/
OutputArea.auto_scroll_threshold = 100;


/**
* Lower limit (in lines) for OutputArea to be made scrollable. OutputAreas
* shorter than this are never scrolled.
*
* @property minimum_scroll_threshold
* @type Number
* @default 20
*
**/
OutputArea.minimum_scroll_threshold = 20;


/**
*
* Scroll OutputArea if height supperior than a threshold (in lines).
Expand Down Expand Up @@ -254,28 +232,7 @@ var IPython = (function (IPython) {
}
this.append_output(json);
};

OutputArea.mime_map = {
"text/plain" : "text",
"text/html" : "html",
"image/svg+xml" : "svg",
"image/png" : "png",
"image/jpeg" : "jpeg",
"text/latex" : "latex",
"application/json" : "json",
"application/javascript" : "javascript",
};

OutputArea.mime_map_r = {
"text" : "text/plain",
"html" : "text/html",
"svg" : "image/svg+xml",
"png" : "image/png",
"jpeg" : "image/jpeg",
"latex" : "text/latex",
"json" : "application/json",
"javascript" : "application/javascript",
};

OutputArea.prototype.rename_keys = function (data, key_map) {
var remapped = {};
Expand Down Expand Up @@ -516,15 +473,6 @@ var IPython = (function (IPython) {
}
};

OutputArea.display_order = [
'application/javascript',
'text/html',
'text/latex',
'image/svg+xml',
'image/png',
'image/jpeg',
'text/plain'
];

OutputArea.prototype.append_mime_type = function (json, element) {

Expand All @@ -533,7 +481,8 @@ var IPython = (function (IPython) {
var append = OutputArea.append_map[type];
if ((json[type] !== undefined) && append) {
var md = json.metadata || {};
append.apply(this, [json[type], md, element]);
var toinsert = append.apply(this, [json[type], md, element]);
$([IPython.events]).trigger('output_appended.OutputArea', [type, json[type], md, toinsert]);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

shouldn't this toinsert be element?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

or is there a missing var insert = append... in the line above?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@minrk is right that one of these two things needs to be there as toinsert is not defined in scope.

return true;
}
}
Expand All @@ -547,21 +496,28 @@ var IPython = (function (IPython) {
IPython.keyboard_manager.register_events(toinsert);
toinsert.append(html);
element.append(toinsert);
return toinsert;
};


OutputArea.prototype.append_javascript = function (js, md, container) {
OutputArea.prototype.append_javascript = function (js, md, element) {
// We just eval the JS code, element appears in the local scope.
var type = 'application/javascript';
var element = this.create_output_subarea(md, "output_javascript", type);
IPython.keyboard_manager.register_events(element);
container.append(element);
var toinsert = this.create_output_subarea(md, "output_javascript", type);
IPython.keyboard_manager.register_events(toinsert);
element.append(toinsert);
// FIXME TODO : remove `container element for 3.0`
//backward compat, js should be eval'ed in a context where `container` is defined.
var container = element;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

why did you rename container to element, then assign container = element? It seems like if you are keeping the name anyway, just leave it.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I name it element to keep a constant naming in API, but I need container to be visible in the scope of eval'ed javascript.
for 3.0 I will just "delete" those 3 lines.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

gotcha, thanks.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

add a FIXME: mark for removal, then?

container.show = function(){console.log('Warning "container.show()" is deprecated.')};
// end backward compat
try {
eval(js);
} catch(err) {
console.log(err);
this._append_javascript_error(err, element);
this._append_javascript_error(err, toinsert);
}
return toinsert;
};


Expand All @@ -577,6 +533,7 @@ var IPython = (function (IPython) {
}
toinsert.append($("<pre/>").html(data));
element.append(toinsert);
return toinsert;
};


Expand All @@ -585,6 +542,7 @@ var IPython = (function (IPython) {
var toinsert = this.create_output_subarea(md, "output_svg", type);
toinsert.append(svg);
element.append(toinsert);
return toinsert;
};


Expand Down Expand Up @@ -629,6 +587,7 @@ var IPython = (function (IPython) {
this._dblclick_to_reset_size(img);
toinsert.append(img);
element.append(toinsert);
return toinsert;
};


Expand All @@ -645,6 +604,7 @@ var IPython = (function (IPython) {
this._dblclick_to_reset_size(img);
toinsert.append(img);
element.append(toinsert);
return toinsert;
};


Expand All @@ -655,18 +615,9 @@ var IPython = (function (IPython) {
var toinsert = this.create_output_subarea(md, "output_latex", type);
toinsert.append(latex);
element.append(toinsert);
return toinsert;
};

OutputArea.append_map = {
"text/plain" : OutputArea.prototype.append_text,
"text/html" : OutputArea.prototype.append_html,
"image/svg+xml" : OutputArea.prototype.append_svg,
"image/png" : OutputArea.prototype.append_png,
"image/jpeg" : OutputArea.prototype.append_jpeg,
"text/latex" : OutputArea.prototype.append_latex,
"application/json" : OutputArea.prototype.append_json,
"application/javascript" : OutputArea.prototype.append_javascript,
};

OutputArea.prototype.append_raw_input = function (msg) {
var that = this;
Expand Down Expand Up @@ -811,6 +762,79 @@ var IPython = (function (IPython) {
return outputs;
};

/**
* Class properties
**/

/**
* Threshold to trigger autoscroll when the OutputArea is resized,
* typically when new outputs are added.
*
* Behavior is undefined if autoscroll is lower than minimum_scroll_threshold,
* unless it is < 0, in which case autoscroll will never be triggered
*
* @property auto_scroll_threshold
* @type Number
* @default 100
*
**/
OutputArea.auto_scroll_threshold = 100;

/**
* Lower limit (in lines) for OutputArea to be made scrollable. OutputAreas
* shorter than this are never scrolled.
*
* @property minimum_scroll_threshold
* @type Number
* @default 20
*
**/
OutputArea.minimum_scroll_threshold = 20;



OutputArea.mime_map = {
"text/plain" : "text",
"text/html" : "html",
"image/svg+xml" : "svg",
"image/png" : "png",
"image/jpeg" : "jpeg",
"text/latex" : "latex",
"application/json" : "json",
"application/javascript" : "javascript",
};

OutputArea.mime_map_r = {
"text" : "text/plain",
"html" : "text/html",
"svg" : "image/svg+xml",
"png" : "image/png",
"jpeg" : "image/jpeg",
"latex" : "text/latex",
"json" : "application/json",
"javascript" : "application/javascript",
};

OutputArea.display_order = [
'application/javascript',
'text/html',
'text/latex',
'image/svg+xml',
'image/png',
'image/jpeg',
'text/plain'
];

OutputArea.append_map = {
"text/plain" : OutputArea.prototype.append_text,
"text/html" : OutputArea.prototype.append_html,
"image/svg+xml" : OutputArea.prototype.append_svg,
"image/png" : OutputArea.prototype.append_png,
"image/jpeg" : OutputArea.prototype.append_jpeg,
"text/latex" : OutputArea.prototype.append_latex,
"application/json" : OutputArea.prototype.append_json,
"application/javascript" : OutputArea.prototype.append_javascript,
};

IPython.OutputArea = OutputArea;

Expand Down
3 changes: 3 additions & 0 deletions docs/source/whatsnew/pr/deprecation-js-container.rst
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
* calling `container.show()` on javascript display is deprecated and will
trigger errors on future IPython notebook versions. `container` now show
itself as soon as non-empty