From c2a96381d8f73ee764a88fa549c84381925c563c Mon Sep 17 00:00:00 2001 From: David Brochart Date: Mon, 15 Feb 2021 16:20:07 +0100 Subject: [PATCH 1/2] Rename pWidget to lmWidget --- packages/base/src/widget.ts | 30 +++++++---- packages/controls/src/widget_audio.ts | 2 +- packages/controls/src/widget_box.ts | 34 ++++++------ packages/controls/src/widget_controller.ts | 20 +++---- packages/controls/src/widget_image.ts | 4 +- packages/controls/src/widget_int.ts | 2 +- .../controls/src/widget_selectioncontainer.ts | 54 +++++++++---------- packages/controls/src/widget_video.ts | 4 +- packages/html-manager/src/htmlmanager.ts | 2 +- packages/html-manager/src/output.ts | 18 +++---- packages/html-manager/src/output_renderers.ts | 2 +- 11 files changed, 91 insertions(+), 81 deletions(-) diff --git a/packages/base/src/widget.ts b/packages/base/src/widget.ts index 45d39cc4e0..5ff050b02d 100644 --- a/packages/base/src/widget.ts +++ b/packages/base/src/widget.ts @@ -886,6 +886,16 @@ export class DOMWidgetView extends WidgetView { this.updateTooltip(); } + /** + * Getter for backward compatibility. + * + * pWidget is deprecated and will be removed in the future, + * please use lmWidget instead. + */ + get pWidget(): Widget { + return this.lmWidget; + } + setLayout(layout: LayoutModel, oldLayout?: LayoutModel): void { if (layout) { this.layoutPromise = this.layoutPromise.then(oldLayoutView => { @@ -904,12 +914,12 @@ export class DOMWidgetView extends WidgetView { // Post (asynchronous) so layout changes can take // effect first. MessageLoop.postMessage( - this.pWidget, + this.lmWidget, Widget.ResizeMessage.UnknownSize ); }); MessageLoop.postMessage( - this.pWidget, + this.lmWidget, Widget.ResizeMessage.UnknownSize ); return view; @@ -1034,21 +1044,21 @@ export class DOMWidgetView extends WidgetView { } _setElement(el: HTMLElement): void { - if (this.pWidget) { - this.pWidget.dispose(); + if (this.lmWidget) { + this.lmWidget.dispose(); } this.$el = el instanceof $ ? el : $(el); this.el = this.$el[0]; - this.pWidget = new JupyterLuminoWidget({ + this.lmWidget = new JupyterLuminoWidget({ node: el, view: this }); } remove(): any { - if (this.pWidget) { - this.pWidget.dispose(); + if (this.lmWidget) { + this.lmWidget.dispose(); } return super.remove(); } @@ -1063,9 +1073,9 @@ export class DOMWidgetView extends WidgetView { private _comm_live_update(): void { if (this.model.comm_live) { - this.pWidget.removeClass('jupyter-widgets-disconnected'); + this.lmWidget.removeClass('jupyter-widgets-disconnected'); } else { - this.pWidget.addClass('jupyter-widgets-disconnected'); + this.lmWidget.addClass('jupyter-widgets-disconnected'); } } @@ -1081,7 +1091,7 @@ export class DOMWidgetView extends WidgetView { } el: HTMLElement; // Override typing '$el': any; - pWidget: Widget; + lmWidget: Widget; layoutPromise: Promise; stylePromise: Promise; } diff --git a/packages/controls/src/widget_audio.ts b/packages/controls/src/widget_audio.ts index f1f1962118..12479a0f13 100644 --- a/packages/controls/src/widget_audio.ts +++ b/packages/controls/src/widget_audio.ts @@ -35,7 +35,7 @@ export class AudioView extends DOMWidgetView { * Called when view is rendered. */ super.render(); - this.pWidget.addClass('jupyter-widgets'); + this.lmWidget.addClass('jupyter-widgets'); this.update(); // Set defaults. } diff --git a/packages/controls/src/widget_box.ts b/packages/controls/src/widget_box.ts index 997828ebac..55cf4af4de 100644 --- a/packages/controls/src/widget_box.ts +++ b/packages/controls/src/widget_box.ts @@ -60,18 +60,18 @@ export class VBoxModel extends BoxModel { export class BoxView extends DOMWidgetView { _createElement(tagName: string): HTMLElement { - this.pWidget = new JupyterLuminoPanelWidget({ view: this }); - return this.pWidget.node; + this.lmWidget = new JupyterLuminoPanelWidget({ view: this }); + return this.lmWidget.node; } _setElement(el: HTMLElement): void { - if (this.el || el !== this.pWidget.node) { + if (this.el || el !== this.lmWidget.node) { // Boxes don't allow setting the element beyond the initial creation. throw new Error('Cannot reset the DOM element.'); } - this.el = this.pWidget.node; - this.$el = $(this.pWidget.node); + this.el = this.lmWidget.node; + this.$el = $(this.lmWidget.node); } initialize(parameters: WidgetView.IInitializeParameters): void { @@ -80,9 +80,9 @@ export class BoxView extends DOMWidgetView { this.listenTo(this.model, 'change:children', this.update_children); this.listenTo(this.model, 'change:box_style', this.update_box_style); - this.pWidget.addClass('jupyter-widgets'); - this.pWidget.addClass('widget-container'); - this.pWidget.addClass('widget-box'); + this.lmWidget.addClass('jupyter-widgets'); + this.lmWidget.addClass('widget-container'); + this.lmWidget.addClass('widget-box'); } render(): void { @@ -98,7 +98,7 @@ export class BoxView extends DOMWidgetView { // Notify all children that their sizes may have changed. views.forEach(view => { MessageLoop.postMessage( - view.pWidget, + view.lmWidget, Widget.ResizeMessage.UnknownSize ); }); @@ -117,13 +117,13 @@ export class BoxView extends DOMWidgetView { // we insert a dummy element so the order is preserved when we add // the rendered content later. const dummy = new Widget(); - this.pWidget.addWidget(dummy); + this.lmWidget.addWidget(dummy); return this.create_child_view(model) .then((view: DOMWidgetView) => { // replace the dummy widget with the new one. - const i = ArrayExt.firstIndexOf(this.pWidget.widgets, dummy); - this.pWidget.insertWidget(i, view.pWidget); + const i = ArrayExt.firstIndexOf(this.lmWidget.widgets, dummy); + this.lmWidget.insertWidget(i, view.lmWidget); dummy.dispose(); return view; }) @@ -136,7 +136,7 @@ export class BoxView extends DOMWidgetView { } children_views: ViewList | null; - pWidget: JupyterLuminoPanelWidget; + lmWidget: JupyterLuminoPanelWidget; static class_map = { success: ['alert', 'alert-success'], @@ -152,7 +152,7 @@ export class HBoxView extends BoxView { */ initialize(parameters: WidgetView.IInitializeParameters): void { super.initialize(parameters); - this.pWidget.addClass('widget-hbox'); + this.lmWidget.addClass('widget-hbox'); } } @@ -162,7 +162,7 @@ export class VBoxView extends BoxView { */ initialize(parameters: WidgetView.IInitializeParameters): void { super.initialize(parameters); - this.pWidget.addClass('widget-vbox'); + this.lmWidget.addClass('widget-vbox'); } } @@ -172,9 +172,9 @@ export class GridBoxView extends BoxView { */ initialize(parameters: WidgetView.IInitializeParameters): void { super.initialize(parameters); - this.pWidget.addClass('widget-gridbox'); + this.lmWidget.addClass('widget-gridbox'); // display needn't be set to flex and grid - this.pWidget.removeClass('widget-box'); + this.lmWidget.removeClass('widget-box'); } } diff --git a/packages/controls/src/widget_controller.ts b/packages/controls/src/widget_controller.ts index 7024ac3c68..c81549063b 100644 --- a/packages/controls/src/widget_controller.ts +++ b/packages/controls/src/widget_controller.ts @@ -329,18 +329,18 @@ export class ControllerModel extends CoreDOMWidgetModel { */ export class ControllerView extends DOMWidgetView { _createElement(tagName: string): HTMLElement { - this.pWidget = new JupyterLuminoPanelWidget({ view: this }); - return this.pWidget.node; + this.lmWidget = new JupyterLuminoPanelWidget({ view: this }); + return this.lmWidget.node; } _setElement(el: HTMLElement): void { - if (this.el || el !== this.pWidget.node) { + if (this.el || el !== this.lmWidget.node) { // Boxes don't allow setting the element beyond the initial creation. throw new Error('Cannot reset the DOM element.'); } - this.el = this.pWidget.node; - this.$el = $(this.pWidget.node); + this.el = this.lmWidget.node; + this.$el = $(this.lmWidget.node); } initialize(parameters: WidgetView.IInitializeParameters): void { @@ -367,11 +367,11 @@ export class ControllerView extends DOMWidgetView { this.axis_box = new Panel(); this.axis_box.node.style.display = 'flex'; - this.pWidget.addWidget(this.axis_box); + this.lmWidget.addWidget(this.axis_box); this.button_box = new Panel(); this.button_box.node.style.display = 'flex'; - this.pWidget.addWidget(this.button_box); + this.lmWidget.addWidget(this.button_box); this.button_views.update(this.model.get('buttons')); this.axis_views.update(this.model.get('axes')); @@ -393,7 +393,7 @@ export class ControllerView extends DOMWidgetView { .then((view: ControllerButtonView) => { // replace the dummy widget with the new one. const i = ArrayExt.firstIndexOf(this.button_box.widgets, dummy); - this.button_box.insertWidget(i, view.pWidget); + this.button_box.insertWidget(i, view.lmWidget); dummy.dispose(); return view; }) @@ -410,7 +410,7 @@ export class ControllerView extends DOMWidgetView { .then((view: ControllerAxisView) => { // replace the dummy widget with the new one. const i = ArrayExt.firstIndexOf(this.axis_box.widgets, dummy); - this.axis_box.insertWidget(i, view.pWidget); + this.axis_box.insertWidget(i, view.lmWidget); dummy.dispose(); return view; }) @@ -429,5 +429,5 @@ export class ControllerView extends DOMWidgetView { axis_box: Panel; button_box: Panel; model: ControllerModel; - pWidget: JupyterLuminoPanelWidget; + lmWidget: JupyterLuminoPanelWidget; } diff --git a/packages/controls/src/widget_image.ts b/packages/controls/src/widget_image.ts index f0dd2b470a..1f5c67f9e2 100644 --- a/packages/controls/src/widget_image.ts +++ b/packages/controls/src/widget_image.ts @@ -34,8 +34,8 @@ export class ImageView extends DOMWidgetView { * Called when view is rendered. */ super.render(); - this.pWidget.addClass('jupyter-widgets'); - this.pWidget.addClass('widget-image'); + this.lmWidget.addClass('jupyter-widgets'); + this.lmWidget.addClass('widget-image'); this.update(); // Set defaults. } diff --git a/packages/controls/src/widget_int.ts b/packages/controls/src/widget_int.ts index c0d44c2727..5bc3f33c95 100644 --- a/packages/controls/src/widget_int.ts +++ b/packages/controls/src/widget_int.ts @@ -716,7 +716,7 @@ export class ProgressView extends DescriptionView { initialize(parameters: WidgetView.IInitializeParameters): void { super.initialize(parameters); this.listenTo(this.model, 'change:bar_style', this.update_bar_style); - this.pWidget.addClass('jupyter-widgets'); + this.lmWidget.addClass('jupyter-widgets'); } render(): void { diff --git a/packages/controls/src/widget_selectioncontainer.ts b/packages/controls/src/widget_selectioncontainer.ts index 725e79f2de..c98efb5142 100644 --- a/packages/controls/src/widget_selectioncontainer.ts +++ b/packages/controls/src/widget_selectioncontainer.ts @@ -90,18 +90,18 @@ export class JupyterLuminoAccordionWidget extends Accordion { export class AccordionView extends DOMWidgetView { _createElement(tagName: string): HTMLElement { - this.pWidget = new JupyterLuminoAccordionWidget({ view: this }); - return this.pWidget.node; + this.lmWidget = new JupyterLuminoAccordionWidget({ view: this }); + return this.lmWidget.node; } _setElement(el: HTMLElement): void { - if (this.el || el !== this.pWidget.node) { + if (this.el || el !== this.lmWidget.node) { // Accordions don't allow setting the element beyond the initial creation. throw new Error('Cannot reset the DOM element.'); } - this.el = this.pWidget.node; - this.$el = $(this.pWidget.node); + this.el = this.lmWidget.node; + this.$el = $(this.lmWidget.node); } initialize(parameters: WidgetView.IInitializeParameters): void { @@ -123,7 +123,7 @@ export class AccordionView extends DOMWidgetView { */ render(): void { super.render(); - const accordion = this.pWidget; + const accordion = this.lmWidget; accordion.addClass('jupyter-widgets'); accordion.addClass('widget-accordion'); accordion.addClass('widget-container'); @@ -147,7 +147,7 @@ export class AccordionView extends DOMWidgetView { // tabs before updating so we don't get spurious changes in the index, // which would then set off another sync cycle. this.updatingChildren = true; - this.pWidget.selection.index = null; + this.lmWidget.selection.index = null; this.children_views?.update(this.model.get('children')); this.update_selected_index(); this.updatingChildren = false; @@ -157,7 +157,7 @@ export class AccordionView extends DOMWidgetView { * Set header titles */ update_titles(): void { - const collapsed = this.pWidget.collapseWidgets; + const collapsed = this.lmWidget.collapseWidgets; const titles = this.model.get('titles'); for (let i = 0; i < collapsed.length; i++) { if (titles[i] !== void 0) { @@ -170,14 +170,14 @@ export class AccordionView extends DOMWidgetView { * Make the rendering and selected index consistent. */ update_selected_index(): void { - this.pWidget.selection.index = this.model.get('selected_index'); + this.lmWidget.selection.index = this.model.get('selected_index'); } /** * Called when a child is removed from children list. */ remove_child_view(view: DOMWidgetView): void { - this.pWidget.removeWidget(view.pWidget); + this.lmWidget.removeWidget(view.lmWidget); view.remove(); } @@ -186,13 +186,13 @@ export class AccordionView extends DOMWidgetView { */ add_child_view(model: WidgetModel, index: number): Promise { // Placeholder widget to keep our position in the tab panel while we create the view. - const accordion = this.pWidget; + const accordion = this.lmWidget; const placeholder = new Widget(); placeholder.title.label = this.model.get('titles')[index] || ''; accordion.addWidget(placeholder); return this.create_child_view(model) .then((view: DOMWidgetView) => { - const widget = view.pWidget; + const widget = view.lmWidget; widget.title.label = placeholder.title.label; const collapse = accordion.collapseWidgets[accordion.indexOf(placeholder)]; @@ -209,7 +209,7 @@ export class AccordionView extends DOMWidgetView { } children_views: ViewList | null; - pWidget: Accordion; + lmWidget: Accordion; updatingChildren: boolean; } @@ -264,20 +264,20 @@ export class JupyterLuminoTabPanelWidget extends TabPanel { export class TabView extends DOMWidgetView { _createElement(tagName: string): HTMLElement { - this.pWidget = new JupyterLuminoTabPanelWidget({ + this.lmWidget = new JupyterLuminoTabPanelWidget({ view: this }); - return this.pWidget.node; + return this.lmWidget.node; } _setElement(el: HTMLElement): void { - if (this.el || el !== this.pWidget.node) { + if (this.el || el !== this.lmWidget.node) { // TabViews don't allow setting the element beyond the initial creation. throw new Error('Cannot reset the DOM element.'); } - this.el = this.pWidget.node; - this.$el = $(this.pWidget.node); + this.el = this.lmWidget.node; + this.$el = $(this.lmWidget.node); } /** @@ -301,7 +301,7 @@ export class TabView extends DOMWidgetView { */ render(): void { super.render(); - const tabs = this.pWidget; + const tabs = this.lmWidget; tabs.addClass('jupyter-widgets'); tabs.addClass('widget-container'); tabs.addClass('widget-tab'); @@ -328,9 +328,9 @@ export class TabView extends DOMWidgetView { // tabs before updating so we don't get spurious changes in the index, // which would then set off another sync cycle. this.updatingTabs = true; - this.pWidget.currentIndex = null; + this.lmWidget.currentIndex = null; this.childrenViews?.update(this.model.get('children')); - this.pWidget.currentIndex = this.model.get('selected_index'); + this.lmWidget.currentIndex = this.model.get('selected_index'); this.updatingTabs = false; } @@ -340,13 +340,13 @@ export class TabView extends DOMWidgetView { addChildView(model: WidgetModel, index: number): Promise { // Placeholder widget to keep our position in the tab panel while we create the view. const label = this.model.get('titles')[index] || ''; - const tabs = this.pWidget; + const tabs = this.lmWidget; const placeholder = new Widget(); placeholder.title.label = label; tabs.addWidget(placeholder); return this.create_child_view(model) .then((view: DOMWidgetView) => { - const widget = view.pWidget; + const widget = view.lmWidget; widget.title.label = placeholder.title.label; widget.title.closable = false; @@ -380,7 +380,7 @@ export class TabView extends DOMWidgetView { */ updateTitles(): void { const titles = this.model.get('titles') || []; - each(this.pWidget.widgets, (widget, i) => { + each(this.lmWidget.widgets, (widget, i) => { widget.title.label = titles[i] || ''; }); } @@ -389,7 +389,7 @@ export class TabView extends DOMWidgetView { * Updates the selected index. */ updateSelectedIndex(): void { - this.pWidget.currentIndex = this.model.get('selected_index'); + this.lmWidget.currentIndex = this.model.get('selected_index'); } remove(): void { @@ -423,7 +423,7 @@ export class TabView extends DOMWidgetView { updatingTabs = false; childrenViews: ViewList | null; - pWidget: JupyterLuminoTabPanelWidget; + lmWidget: JupyterLuminoTabPanelWidget; } export class StackedModel extends SelectionContainerModel { @@ -452,7 +452,7 @@ export class StackedView extends BoxView { // Notify all children that their sizes may have changed. views.forEach(view => { MessageLoop.postMessage( - view.pWidget, + view.lmWidget, Widget.ResizeMessage.UnknownSize ); }); diff --git a/packages/controls/src/widget_video.ts b/packages/controls/src/widget_video.ts index 6f06c03cc1..86d0ab92da 100644 --- a/packages/controls/src/widget_video.ts +++ b/packages/controls/src/widget_video.ts @@ -37,8 +37,8 @@ export class VideoView extends DOMWidgetView { * Called when view is rendered. */ super.render(); - this.pWidget.addClass('jupyter-widgets'); - this.pWidget.addClass('widget-image'); + this.lmWidget.addClass('jupyter-widgets'); + this.lmWidget.addClass('widget-image'); this.update(); // Set defaults. } diff --git a/packages/html-manager/src/htmlmanager.ts b/packages/html-manager/src/htmlmanager.ts index c9c70649e5..620087434e 100644 --- a/packages/html-manager/src/htmlmanager.ts +++ b/packages/html-manager/src/htmlmanager.ts @@ -41,7 +41,7 @@ export class HTMLManager extends ManagerBase { view: Promise | DOMWidgetView, el: HTMLElement ): Promise { - LuminoWidget.Widget.attach((await view).pWidget, el); + LuminoWidget.Widget.attach((await view).lmWidget, el); } /** diff --git a/packages/html-manager/src/output.ts b/packages/html-manager/src/output.ts index 4cf4b4500c..e11aa7b868 100644 --- a/packages/html-manager/src/output.ts +++ b/packages/html-manager/src/output.ts @@ -41,17 +41,17 @@ export class OutputModel extends outputBase.OutputModel { export class OutputView extends outputBase.OutputView { _createElement(tagName: string): HTMLElement { - this.pWidget = new Panel(); - return this.pWidget.node; + this.lmWidget = new Panel(); + return this.lmWidget.node; } _setElement(el: HTMLElement): void { - if (this.el || el !== this.pWidget.node) { + if (this.el || el !== this.lmWidget.node) { // Boxes don't allow setting the element beyond the initial creation. throw new Error('Cannot reset the DOM element.'); } - this.el = this.pWidget.node; - this.$el = $(this.pWidget.node); + this.el = this.lmWidget.node; + this.$el = $(this.lmWidget.node); } render(): void { @@ -61,13 +61,13 @@ export class OutputView extends outputBase.OutputView { rendermime: rendermime, model: this.model.outputs }); - this.pWidget.insertWidget(0, this._outputView); - this.pWidget.addClass('jupyter-widgets'); - this.pWidget.addClass('widget-output'); + this.lmWidget.insertWidget(0, this._outputView); + this.lmWidget.addClass('jupyter-widgets'); + this.lmWidget.addClass('widget-output'); this.update(); } model: OutputModel; private _outputView: OutputArea; - pWidget: Panel; + lmWidget: Panel; } diff --git a/packages/html-manager/src/output_renderers.ts b/packages/html-manager/src/output_renderers.ts index 5239caca3b..4f3e7612bd 100644 --- a/packages/html-manager/src/output_renderers.ts +++ b/packages/html-manager/src/output_renderers.ts @@ -24,7 +24,7 @@ export class WidgetRenderer extends Widget implements IRenderMime.IRenderer { try { const wModel = await modelPromise; const wView = await this._manager.create_view(wModel); - Widget.attach(wView.pWidget, this.node); + Widget.attach(wView.lmWidget, this.node); } catch (err) { console.log('Error displaying widget'); console.log(err); From e6f9f37f48309a7519c87010923dc8e9f00588c6 Mon Sep 17 00:00:00 2001 From: David Brochart Date: Wed, 17 Feb 2021 10:09:14 +0100 Subject: [PATCH 2/2] Add back pWidget typing in subclasses --- packages/controls/src/widget_box.ts | 1 + packages/controls/src/widget_controller.ts | 1 + packages/controls/src/widget_selectioncontainer.ts | 2 ++ packages/html-manager/src/output.ts | 1 + 4 files changed, 5 insertions(+) diff --git a/packages/controls/src/widget_box.ts b/packages/controls/src/widget_box.ts index 55cf4af4de..7a642afbdd 100644 --- a/packages/controls/src/widget_box.ts +++ b/packages/controls/src/widget_box.ts @@ -136,6 +136,7 @@ export class BoxView extends DOMWidgetView { } children_views: ViewList | null; + pWidget: JupyterLuminoPanelWidget; lmWidget: JupyterLuminoPanelWidget; static class_map = { diff --git a/packages/controls/src/widget_controller.ts b/packages/controls/src/widget_controller.ts index c81549063b..f83ac3fece 100644 --- a/packages/controls/src/widget_controller.ts +++ b/packages/controls/src/widget_controller.ts @@ -429,5 +429,6 @@ export class ControllerView extends DOMWidgetView { axis_box: Panel; button_box: Panel; model: ControllerModel; + pWidget: JupyterLuminoPanelWidget; lmWidget: JupyterLuminoPanelWidget; } diff --git a/packages/controls/src/widget_selectioncontainer.ts b/packages/controls/src/widget_selectioncontainer.ts index c98efb5142..2c3e59ff29 100644 --- a/packages/controls/src/widget_selectioncontainer.ts +++ b/packages/controls/src/widget_selectioncontainer.ts @@ -209,6 +209,7 @@ export class AccordionView extends DOMWidgetView { } children_views: ViewList | null; + pWidget: Accordion; lmWidget: Accordion; updatingChildren: boolean; } @@ -423,6 +424,7 @@ export class TabView extends DOMWidgetView { updatingTabs = false; childrenViews: ViewList | null; + pWidget: JupyterLuminoTabPanelWidget; lmWidget: JupyterLuminoTabPanelWidget; } diff --git a/packages/html-manager/src/output.ts b/packages/html-manager/src/output.ts index e11aa7b868..328ad47756 100644 --- a/packages/html-manager/src/output.ts +++ b/packages/html-manager/src/output.ts @@ -69,5 +69,6 @@ export class OutputView extends outputBase.OutputView { model: OutputModel; private _outputView: OutputArea; + pWidget: Panel; lmWidget: Panel; }