manager.js
256 lines
| 9.7 KiB
| application/javascript
|
JavascriptLexer
|
r17198 | // Copyright (c) IPython Development Team. | ||
// Distributed under the terms of the Modified BSD License. | ||||
define([ | ||||
"underscore", | ||||
|
r17199 | "backbone", | ||
|
r17273 | "jquery", | ||
|
r18882 | "base/js/utils", | ||
|
r17216 | "base/js/namespace" | ||
|
r18882 | ], function (_, Backbone, $, utils, IPython) { | ||
|
r18146 | "use strict"; | ||
|
r17199 | //-------------------------------------------------------------------- | ||
// WidgetManager class | ||||
//-------------------------------------------------------------------- | ||||
|
r17200 | var WidgetManager = function (comm_manager, notebook) { | ||
|
r17199 | // Public constructor | ||
WidgetManager._managers.push(this); | ||||
// Attach a comm manager to the | ||||
|
r17200 | this.keyboard_manager = notebook.keyboard_manager; | ||
|
r17199 | this.notebook = notebook; | ||
this.comm_manager = comm_manager; | ||||
this._models = {}; /* Dictionary of model ids and model instances */ | ||||
|
r18264 | // Register with the comm manager. | ||
this.comm_manager.register_target('ipython.widget', $.proxy(this._handle_comm_open, this)); | ||||
|
r17199 | }; | ||
//-------------------------------------------------------------------- | ||||
// Class level | ||||
//-------------------------------------------------------------------- | ||||
WidgetManager._model_types = {}; /* Dictionary of model type names (target_name) and model types. */ | ||||
WidgetManager._view_types = {}; /* Dictionary of view names and view types. */ | ||||
WidgetManager._managers = []; /* List of widget managers */ | ||||
WidgetManager.register_widget_model = function (model_name, model_type) { | ||||
// Registers a widget model by name. | ||||
WidgetManager._model_types[model_name] = model_type; | ||||
}; | ||||
WidgetManager.register_widget_view = function (view_name, view_type) { | ||||
// Registers a widget view by name. | ||||
WidgetManager._view_types[view_name] = view_type; | ||||
}; | ||||
//-------------------------------------------------------------------- | ||||
// Instance level | ||||
//-------------------------------------------------------------------- | ||||
WidgetManager.prototype.display_view = function(msg, model) { | ||||
// Displays a view for a particular model. | ||||
var cell = this.get_msg_cell(msg.parent_header.msg_id); | ||||
if (cell === null) { | ||||
console.log("Could not determine where the display" + | ||||
" message was from. Widget will not be displayed"); | ||||
} else { | ||||
|
r18882 | var dummy = null; | ||
if (cell.widget_subarea) { | ||||
dummy = $('<div />'); | ||||
cell.widget_subarea.append(dummy); | ||||
} | ||||
|
r18142 | var that = this; | ||
|
r18882 | this.create_view(model, {cell: cell}).then(function(view) { | ||
|
r18142 | that._handle_display_view(view); | ||
|
r18882 | if (dummy) { | ||
dummy.replaceWith(view.$el); | ||||
|
r18142 | } | ||
view.trigger('displayed'); | ||||
|
r18886 | }, $.proxy(console.error, console)); | ||
|
r17199 | } | ||
}; | ||||
WidgetManager.prototype._handle_display_view = function (view) { | ||||
// Have the IPython keyboard manager disable its event | ||||
// handling so the widget can capture keyboard input. | ||||
// Note, this is only done on the outer most widgets. | ||||
if (this.keyboard_manager) { | ||||
this.keyboard_manager.register_events(view.$el); | ||||
|
r18882 | if (view.additional_elements) { | ||
for (var i = 0; i < view.additional_elements.length; i++) { | ||||
this.keyboard_manager.register_events(view.additional_elements[i]); | ||||
} | ||||
} | ||||
|
r17199 | } | ||
}; | ||||
|
r18142 | |||
|
r17199 | |||
|
r18146 | WidgetManager.prototype.create_view = function(model, options) { | ||
|
r17199 | // Creates a view for a particular model. | ||
|
r18881 | return new Promise(function(resolve, reject) { | ||
|
r18882 | var view_name = model.get('_view_name'); | ||
var view_module = model.get('_view_module'); | ||||
utils.try_load(view_name, view_module, WidgetManager._view_types).then(function(ViewType){ | ||||
|
r18145 | |||
|
r18142 | // If a view is passed into the method, use that view's cell as | ||
// the cell for the view that is created. | ||||
|
r18882 | options = options || {}; | ||
|
r18146 | if (options.parent !== undefined) { | ||
options.cell = options.parent.options.cell; | ||||
|
r18142 | } | ||
|
r17199 | |||
|
r18142 | // Create and render the view... | ||
var parameters = {model: model, options: options}; | ||||
|
r18146 | var view = new ViewType(parameters); | ||
|
r18142 | view.render(); | ||
|
r18882 | model.on('destroy', view.remove, view); | ||
|
r18881 | resolve(view); | ||
|
r18882 | }, reject); | ||
}); | ||||
|
r17199 | }; | ||
WidgetManager.prototype.get_msg_cell = function (msg_id) { | ||||
var cell = null; | ||||
// First, check to see if the msg was triggered by cell execution. | ||||
if (this.notebook) { | ||||
cell = this.notebook.get_msg_cell(msg_id); | ||||
} | ||||
if (cell !== null) { | ||||
return cell; | ||||
} | ||||
// Second, check to see if a get_cell callback was defined | ||||
// for the message. get_cell callbacks are registered for | ||||
// widget messages, so this block is actually checking to see if the | ||||
// message was triggered by a widget. | ||||
var kernel = this.comm_manager.kernel; | ||||
if (kernel) { | ||||
var callbacks = kernel.get_callbacks_for_msg(msg_id); | ||||
if (callbacks && callbacks.iopub && | ||||
callbacks.iopub.get_cell !== undefined) { | ||||
return callbacks.iopub.get_cell(); | ||||
|
r14534 | } | ||
|
r17199 | } | ||
// Not triggered by a cell or widget (no get_cell callback | ||||
// exists). | ||||
return null; | ||||
}; | ||||
WidgetManager.prototype.callbacks = function (view) { | ||||
// callback handlers specific a view | ||||
var callbacks = {}; | ||||
if (view && view.options.cell) { | ||||
// Try to get output handlers | ||||
var cell = view.options.cell; | ||||
var handle_output = null; | ||||
var handle_clear_output = null; | ||||
if (cell.output_area) { | ||||
handle_output = $.proxy(cell.output_area.handle_output, cell.output_area); | ||||
handle_clear_output = $.proxy(cell.output_area.handle_clear_output, cell.output_area); | ||||
|
r14469 | } | ||
|
r18517 | // Create callback dictionary using what is known | ||
|
r16652 | var that = this; | ||
|
r17199 | callbacks = { | ||
iopub : { | ||||
output : handle_output, | ||||
clear_output : handle_clear_output, | ||||
// Special function only registered by widget messages. | ||||
// Allows us to get the cell for a message so we know | ||||
// where to add widgets if the code requires it. | ||||
get_cell : function () { | ||||
return cell; | ||||
}, | ||||
}, | ||||
}; | ||||
} | ||||
return callbacks; | ||||
}; | ||||
WidgetManager.prototype.get_model = function (model_id) { | ||||
// Look-up a model instance by its id. | ||||
|
r18884 | var that = this; | ||
var model = that._models[model_id]; | ||||
if (model !== undefined) { | ||||
return new Promise(function(resolve, reject){ | ||||
if (model instanceof Promise) { | ||||
model.then(resolve, reject); | ||||
} else { | ||||
resolve(model); | ||||
} | ||||
}); | ||||
} else { | ||||
return undefined; | ||||
|
r17199 | } | ||
}; | ||||
WidgetManager.prototype._handle_comm_open = function (comm, msg) { | ||||
// Handle when a comm is opened. | ||||
|
r18517 | this.create_model({ | ||
model_name: msg.content.data.model_name, | ||||
model_module: msg.content.data.model_module, | ||||
comm: comm}); | ||||
|
r18506 | }; | ||
|
r18512 | WidgetManager.prototype.create_model = function (options) { | ||
|
r18881 | // Create and return a promise to create a new widget model. | ||
|
r18506 | // | ||
|
r18515 | // Minimally, one must provide the model_name and widget_class | ||
|
r18512 | // parameters to create a model from Javascript. | ||
// | ||||
// Example | ||||
// -------- | ||||
// JS: | ||||
|
r18517 | // IPython.notebook.kernel.widget_manager.create_model({ | ||
|
r18512 | // model_name: 'WidgetModel', | ||
|
r18882 | // widget_class: 'IPython.html.widgets.widget_int.IntSlider'}) | ||
// .then(function(model) { console.log('Create success!', model); }, | ||||
|
r18886 | // $.proxy(console.error, console)); | ||
|
r18506 | // | ||
// Parameters | ||||
// ---------- | ||||
// options: dictionary | ||||
// Dictionary of options with the following contents: | ||||
// model_name: string | ||||
// Target name of the widget model to create. | ||||
|
r18517 | // model_module: (optional) string | ||
// Module name of the widget model to create. | ||||
|
r18515 | // widget_class: (optional) string | ||
|
r18506 | // Target name of the widget in the back-end. | ||
// comm: (optional) Comm | ||||
|
r18884 | |||
// Create a comm if it wasn't provided. | ||||
var comm = options.comm; | ||||
if (!comm) { | ||||
comm = this.comm_manager.new_comm('ipython.widget', {'widget_class': options.widget_class}); | ||||
} | ||||
var that = this; | ||||
var model_id = comm.comm_id; | ||||
var promise = new Promise(function(resolve, reject) { | ||||
|
r18882 | |||
|
r18881 | // Get the model type using require or through the registry. | ||
var widget_type_name = options.model_name; | ||||
var widget_module = options.model_module; | ||||
|
r18882 | utils.try_load(widget_type_name, widget_module, WidgetManager._model_types) | ||
.then(function(ModelType) { | ||||
var widget_model = new ModelType(that, model_id, comm); | ||||
widget_model.on('comm:close', function () { | ||||
delete that._models[model_id]; | ||||
}); | ||||
that._models[model_id] = widget_model; | ||||
|
r18884 | resolve(widget_model); | ||
|
r18881 | }, reject); | ||
|
r18882 | }); | ||
|
r18884 | this._models[model_id] = promise; | ||
return promise; | ||||
|
r17199 | }; | ||
|
r17198 | |||
|
r18882 | // Backwards compatibility. | ||
|
r17216 | IPython.WidgetManager = WidgetManager; | ||
|
r17203 | return {'WidgetManager': WidgetManager}; | ||
|
r17199 | }); | ||