##// END OF EJS Templates
Remove $el_to_style from the widget javascript code; '' now defaults to this.$el...
Remove $el_to_style from the widget javascript code; '' now defaults to this.$el This seems to make it easiest to select the top-level element. An alternative is to use special syntax for top-level elements, like in https://github.com/ipython/ipython/pull/6185 This will be followed up by other fixes that let the user set specific common properties of different elements. This change also adds the .addBack() call, which means that nonempty selectors now apply to this.$el and its descendants, rather than just the descendants of this.$el.

File last commit:

r17216:08b8fbc9
r17420:69911d59
Show More
widget_image.js
44 lines | 1.4 KiB | application/javascript | JavascriptLexer
// Copyright (c) IPython Development Team.
// Distributed under the terms of the Modified BSD License.
define([
"widgets/js/widget",
"jquery",
], function(widget, $){
var ImageView = widget.DOMWidgetView.extend({
render : function(){
// Called when view is rendered.
this.setElement($("<img />"));
this.update(); // Set defaults.
},
update : function(){
// Update the contents of this view
//
// Called when the model is changed. The model may have been
// changed by another view or by a state update from the back-end.
var image_src = 'data:image/' + this.model.get('format') + ';base64,' + this.model.get('_b64value');
this.$el.attr('src', image_src);
var width = this.model.get('width');
if (width !== undefined && width.length > 0) {
this.$el.attr('width', width);
} else {
this.$el.removeAttr('width');
}
var height = this.model.get('height');
if (height !== undefined && height.length > 0) {
this.$el.attr('height', height);
} else {
this.$el.removeAttr('height');
}
return ImageView.__super__.update.apply(this);
},
});
return {
'ImageView': ImageView,
};
});