Simulator dialog full screen and collapsed views

[psychemedia]

It would be useful to be able to expand the simulator to a full screen view.

Possible jquery extensions worth trying out in this respect:

• jqueryui.dialog.fullmode: expand to fill window;
• jquery-ui-dialog-collapse: collapse;
• jquery-dialogextend [usage]: full featured configurator.

[psychemedia]

Looks like there's a demo of this by @aaronwatters here: https://github.com/AaronWatters/jp_doodle/blob/master/notebooks/misc/JQueryUI%20dialogextend%20plugin%20demo.ipynb

[psychemedia]

This is possible by loading in the jquery.dialogextend package in the appropriate javascript context, and then calling on it.

To load it in, it seems like we need to load it into its own, rendered, dummy loader widget:

from nbev3devsim import ev3devsim_nb as eds
import jp_proxy_widget

#https://github.com/AaronWatters/jp_doodle/blob/master/notebooks/misc/JQueryUI%20dialogextend%20plugin%20demo.ipynb
#Load and initialise the jquery.dialogextend package

cdn_url = "https://cdn.jsdelivr.net/npm/binary-com-jquery-dialogextended@1.0.0/jquery.dialogextend.js"
cdn_url = eds.get_file_path('js/jquery.dialogextend.js')
module_id = "dialogExtend"

# Load the module using a widget (any widget -- the module loads to the global jQuery object).
loader = jp_proxy_widget.JSProxyWidget()

# Configure the module to be loaded.
loader.require_js(module_id, cdn_url)

# Load the module
loader.js_init("""
    element.requirejs([module_identifier], function(module_value) {
        //element.html("loaded " + module_identifier + " : " + module_value);
    });
""", module_identifier=module_id)
loader

We can then call on the controls when we create the simulator dialogue widget:

roboSim.js_init("""
element.dialog({ "title" : "Robot Simulator" }).dialogExtend({
        "maximizable" : true,
        "dblclick" : "maximize",
        "icons" : { "maximize" : "ui-icon-arrow-4-diag" }});
""")

If the jquery.dialogextend has not loaded when the simulator dialog is created, the controls are not available.

• [ ] find a way of making jquery.dialogextend a requirement of the simulator widget.