custom widgets that extend widgets.DOMWidget

[Rob Ellis]

I want to create some custom widgets that extend DOMWidget, but available examples like this and this aren't working for me with a variety of errors.

Uncaught TypeError: WidgetManager.register_widget_model is not a function(anonymous function) @ VM1733:10context.execCb @ require.js?v=640929dac3c23a448d2eebc37bc32062:1658Module.check @ require.js?v=640929dac3c23a448d2eebc37bc32062:874Module.enable @ require.js?v=640929dac3c23a448d2eebc37bc32062:1151Module.init @ require.js?v=640929dac3c23a448d2eebc37bc32062:782(anonymous function) @ require.js?v=640929dac3c23a448d2eebc37bc32062:1424

utils.js?v=20150526112054:777 WrappedError {stack: "Error: Couldn't create a view for model id 'fdbea9…/static/base/js/utils.js?v=20150526112054:776:33)", message: "Couldn't create a view for model id 'fdbea92cbc3547df94ba3d2945b81168'", error_stack: Array[2]}reject @ utils.js?v=20150526112054:777

utils.js?v=20150526112054:777 WrappedError {stack: "Error: Could not create or display view↵    at new…/static/base/js/utils.js?v=20150526112054:776:33)", message: "Could not create or display view", error_stack: Array[3]}reject @ utils.js?v=20150526112054:777

utils.js?v=20150526112054:777 WrappedError {stack: "Error: Could not display view↵    at new Error (na…/static/base/js/utils.js?v=20150526112054:776:33)", message: "Could not display view", error_stack: Array[4]}reject @ utils.js?v=20150526112054:777

Untitled2.ipynb?kernel_name=python2:1 Uncaught (in promise) WrappedError {stack: "Error: Couldn't create a view for model id 'fdbea9…/static/base/js/utils.js?v=20150526112054:776:33)", message: "Couldn't create a view for model id 'fdbea92cbc3547df94ba3d2945b81168'", error_stack: Array[4]}

Untitled2.ipynb?kernel_name=python2:1 Uncaught (in promise) WrappedError {stack: "Error: Could not display view↵    at new Error (na…/static/base/js/utils.js?v=20150526112054:776:33)", message: "Could not display view", error_stack: Array[4]}

I'm working through the source code, but I'd appreciate pointers or working examples. My testing goal is to reproduce one of the in-built widgets, like Text, from external code.

I'm running:

The version of the notebook server is 3.1.0-cbccb68 and is running on:

Python 2.7.9 |Continuum Analytics, Inc.| (default, Dec 18 2014, 16:57:52) [MSC v.1500 64 bit (AMD64)]

[Kyle Kelley]

The bitjet widget extends the DOMWidget: https://github.com/rgbkrk/bitjet

--
You received this message because you are subscribed to the Google Groups "Project Jupyter" group.
To unsubscribe from this group and stop receiving emails from it, send an email to jupyter+u...@googlegroups.com.
To post to this group, send email to jup...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/jupyter/86e2f6f7-d058-458f-81c1-c34e4949d060%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

--

Kyle Kelley (@rgbkrk; lambdaops.com, developer.rackspace.com)

[Pierre Villeneuve]

This weekend I was stumbling over problems very similar to what Rob described.  All working examples I have until yours used the old style starting with require instead of define.  The IPython documentation for 3.1 is really quite vague about the whole process: link.  Can someone clarify that the bitjet example is representative of the new way for building custom widgets?

	define(function(require) { var widget = require("widgets/js/widget");

Pierre Villeneuve

pierre.v...@gmail.com

To view this discussion on the web visit https://groups.google.com/d/msgid/jupyter/CA%2BtbMaVRR2M6s5VdUme5iPqzOyMp061SFqiDj-y1RVKr1xpVKw%40mail.gmail.com.

[Matthias Bussonnier]

require is a weird beast.  if you use the require([...], function(){...}) you basically want the things to execute now[1]. The second form is `define([...], function(){})` which will basically only execute the content of the function when the module is loaded by another require call [2], which help for circular dependencies, and other stuff. 

The define(function(require){   var foo = require('foo')} ) form is just simpler, but get rewritten to the second form in some condition[3] by regexes, or just fails and tell you to explicitly use the second form[4][5]. 

And lastly, we are still learning require, so we also do mistakes. 

Hope that clarify things enough. 

-- 

M

[1] Well technically not really, but sufficient for this explanation now.

[2] see [1]

[3] refer to  [2]

[4] same as  [3]

[5] Yes, I ment [1] everywhere. 

To view this discussion on the web visit https://groups.google.com/d/msgid/jupyter/CANL3p1JpuZynb7O20rNe7JEVbhJaEqM6mbpSJfR6aijgvd10kQ%40mail.gmail.com.

[Pierre Villeneuve]

Matthias,

Thanks for the reply!  It helped.

Pierre V. Villeneuve
pierre.v...@gmail.com

To view this discussion on the web visit https://groups.google.com/d/msgid/jupyter/CANJQusUtWH1-8L2cOD8RLk9rV9hrsuGXb39iP30Y9UtDWpuZow%40mail.gmail.com.

[Nicholas Bollweg]

Little late to the party, but I generally agree with all the things replied here.

The node-style imperative require("foo") (i.e. with no callback) will work if the requirement has already been loaded, which for most of base and key libraries like underscore will have be the case by the time your code is run. The huge list of imports that you can end up with once you start doing any complex integration with base or a big library can get a little ridiculous, so little things like this can be nice to make it clearer what you actually are doing.

Also, as a note: when you are debugging anything that gets near comms, it's pretty important to have your debugger be in "Pause on Exceptions" with "Pause on Caught Exceptions" ticked... otherwise, these errors will get swallowed up... though you'll want to wait until the page has been rendered, as there are a number of those errors before it even gets to your code.

And, as usual, I'll plug cookiecutter-ipython-widget, a template for creating a full python package around a widget, which takes a surprisingly large amount of fiddling. I haven't gotten a ton of public feedback on it, but have been adding new stuff based on other feedback. Perhaps it can help!